/* Wins & Lessons editorial components (2026-07-15, founding post) — moved here from the Claude
   Design handoff's self-contained inline <style> per that file's own instruction ("move these
   rules into the theme stylesheet on implementation"). A separate, non-protected component
   stylesheet, not theme.css — theme.css is protected during the sitewide content release, same
   pattern as assets/css/components/cta-min-height.css.

   Live tokens only, no invented colors. .wl-ai's left border uses --accent-teal (#0E9C84), the
   correct light-surface teal token — the handoff's own README named #2DD4BF, which is actually
   --teal-on-navy (a dark-surface-only token per theme.json); using it on this white card would
   have been a token-purity defect. H2/body typography intentionally NOT redeclared here — plain
   <h2>/<p> tags in the post body already inherit the live article typographic scale from
   theme.css's .ad-single__body .article-content rules. */

.wl-pull { text-align: center; margin: 2.5rem auto; max-width: 620px; }
.wl-pull::before { content: ""; display: block; width: 44px; height: 3px; background: var(--wp--preset--color--primary); margin: 0 auto 1.375rem; border-radius: 2px; }
.wl-pull p { font-family: var(--wp--preset--font-family--serif); font-style: italic; font-size: clamp(1.375rem, 3.2vw, 1.6875rem); line-height: 1.38; color: var(--wp--preset--color--ink); margin: 0; }

.wl-lesson { margin: 2.125rem 0; padding-left: 22px; border-left: 3px solid var(--wp--preset--color--ink); }
.wl-lesson .wl-ey { font-family: var(--wp--preset--font-family--mono); font-size: 0.72rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--wp--preset--color--muted); margin-bottom: 0.5rem; }
.wl-lesson p { font-family: var(--wp--preset--font-family--serif); font-style: italic; font-size: 1.375rem; line-height: 1.42; color: var(--wp--preset--color--ink); margin: 0; }

.wl-ai { margin: 2.125rem 0; padding: 22px 26px; background: var(--wp--preset--color--card); border: 1px solid var(--wp--preset--color--line); border-left: 3px solid var(--wp--preset--color--accent-teal); border-radius: var(--wp--custom--radius--card); }
.wl-ai p { font-family: var(--wp--preset--font-family--serif); font-style: italic; font-size: 1.25rem; line-height: 1.5; color: var(--wp--preset--color--ink); margin: 0; }