@layer reset, base, components, layout, motion;

@layer reset {
  *, *::before, *::after { box-sizing: border-box; }
  html { scroll-behavior: smooth; }
  body, h1, h2, h3, p, ul, ol { margin: 0; }
  ul, ol { padding: 0; }
  button, input { font: inherit; }
  img, svg { display: block; max-width: 100%; }
  a { color: inherit; }
}

@layer base {
  :root {
    --ink-950: #0b1711;
    --ink-900: #102119;
    --ink-800: #173126;
    --green-700: #13572f;
    --green-600: #1a6b3a;
    --green-500: #23854a;
    --green-400: #31a362;
    --green-100: #dcefe3;
    --green-50: #edf7f0;
    --gold-500: #c9a84c;
    --gold-400: #e0c66f;
    --gold-100: #f4ecd4;
    --cream: #f6f3eb;
    --paper: #fcfbf7;
    --white: #fff;
    --slate: #52635a;
    --line: #dce4de;
    --shadow: 0 24px 70px rgba(5, 25, 14, .16);
    --text-base: 17px;
    --text-body: 18px;
    --text-supporting: 15px;
    --text-label: 13px;
    --serif: Iowan Old Style, Baskerville, "Times New Roman", serif;
    --sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  }

  html { scroll-padding-top: 86px; }
  body { background: var(--paper); color: var(--ink-950); font-family: var(--sans); font-size: var(--text-base); line-height: 1.65; -webkit-font-smoothing: antialiased; }
  button, a { -webkit-tap-highlight-color: transparent; }
  button { color: inherit; }
  :focus-visible { outline: 3px solid var(--gold-400); outline-offset: 4px; }
  ::selection { background: var(--gold-400); color: var(--ink-950); }
  .shell { width: min(1180px, calc(100% - 48px)); margin-inline: auto; }
  .section { padding: 112px 0; }
  .sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
  .skip-link { position: fixed; left: 16px; top: -60px; z-index: 200; background: var(--white); color: var(--ink-950); padding: 10px 16px; border-radius: 8px; text-decoration: none; transition: top .2s; }
  .skip-link:focus { top: 12px; }
}

@layer components {
  .brand { display: inline-flex; align-items: center; gap: 10px; color: var(--white); font-size: 22px; font-weight: 800; letter-spacing: -.055em; text-decoration: none; }
  .brand > span > span { color: var(--gold-400); }
  .brand img { border-radius: 8px; box-shadow: 0 6px 18px rgba(0,0,0,.18); }
  .eyebrow { display: flex; align-items: center; gap: 10px; color: #b8d0c1; font-size: var(--text-label); font-weight: 800; letter-spacing: .13em; line-height: 1.3; text-transform: uppercase; }
  .eyebrow > span { width: 26px; height: 1px; background: var(--gold-400); }
  .eyebrow.dark { color: var(--green-700); }
  h1, h2 { font-family: var(--serif); font-weight: 500; letter-spacing: -.045em; line-height: .98; }
  h2 { font-size: clamp(42px, 5vw, 66px); }
  h1 em, h2 em { color: var(--gold-400); font-weight: inherit; }
  h3 { font-size: 20px; letter-spacing: -.025em; line-height: 1.25; }
  .button { display: inline-flex; align-items: center; justify-content: center; gap: 14px; min-height: 53px; border: 0; border-radius: 7px; padding: 0 24px; cursor: pointer; font-size: 16px; font-weight: 750; text-decoration: none; transition: transform .2s, background .2s, box-shadow .2s; }
  .button:hover { transform: translateY(-2px); }
  .button-primary { background: var(--gold-400); color: var(--ink-950); box-shadow: 0 12px 28px rgba(201, 168, 76, .17); }
  .button-primary:hover { background: #ecd47d; box-shadow: 0 14px 34px rgba(201, 168, 76, .25); }
  .button-small { min-height: 42px; padding-inline: 17px; background: var(--gold-400); color: var(--ink-950); font-size: 14px; }
  .button-dark { width: 100%; background: var(--ink-950); color: var(--white); }
  .text-link { display: inline-flex; align-items: center; gap: 12px; color: var(--white); font-size: 16px; font-weight: 700; text-decoration: none; }
  .text-link span { color: var(--gold-400); }
  .section-heading h2 { margin-top: 20px; }
  .section-heading > p:last-child { color: var(--slate); font-size: var(--text-body); line-height: 1.75; }
  .section-heading.centered { max-width: 780px; margin: 0 auto 58px; text-align: center; }
  .section-heading.centered .eyebrow { justify-content: center; }
  .section-heading.centered > p:last-child { max-width: 650px; margin: 24px auto 0; }
}

@layer layout {
  .site-header { position: absolute; inset: 0 0 auto; z-index: 50; border-bottom: 1px solid rgba(255,255,255,.09); }
  .site-header.is-scrolled { position: fixed; background: rgba(11,23,17,.94); backdrop-filter: blur(18px); box-shadow: 0 10px 35px rgba(0,0,0,.14); }
  .header-inner { min-height: 74px; display: flex; align-items: center; justify-content: space-between; }
  .primary-nav { display: flex; align-items: center; gap: 28px; color: #d5dfd8; }
  .primary-nav > a { font-size: 14px; font-weight: 650; text-decoration: none; }
  .primary-nav > a:hover { color: var(--white); }
  .nav-signin { padding-left: 27px; border-left: 1px solid rgba(255,255,255,.14); }
  .menu-toggle { display: none; width: 42px; height: 42px; border: 0; background: transparent; cursor: pointer; }
  .menu-toggle span:not(.sr-only) { display: block; width: 22px; height: 2px; margin: 6px auto; background: var(--white); transition: transform .2s; }

  .hero { position: relative; overflow: hidden; min-height: 780px; padding: 160px 0 0; background: var(--ink-950); color: var(--white); }
  .hero::before { content: ""; position: absolute; inset: 0; opacity: .08; background-image: linear-gradient(rgba(255,255,255,.12) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.12) 1px, transparent 1px); background-size: 64px 64px; mask-image: linear-gradient(to bottom, #000, transparent 76%); }
  .hero-glow { position: absolute; width: 700px; height: 700px; right: -210px; top: -210px; background: radial-gradient(circle, rgba(38,132,75,.27), transparent 68%); }
  .hero-grid { position: relative; display: grid; grid-template-columns: .82fr 1.18fr; gap: 52px; align-items: center; }
  .hero-copy { padding-bottom: 76px; }
  .hero h1 { max-width: 650px; margin: 27px 0 25px; font-size: clamp(52px, 5.8vw, 78px); }
  .hero-lede { max-width: 610px; color: #c3d2c9; font-size: 20px; line-height: 1.7; }
  .hero-actions { display: flex; align-items: center; gap: 28px; margin-top: 34px; }
  .trust-list { display: flex; flex-wrap: wrap; gap: 21px; margin-top: 30px; color: #bdccc3; font-size: 14px; list-style: none; }
  .trust-list span { display: inline-grid; place-items: center; width: 17px; height: 17px; margin-right: 5px; border: 1px solid rgba(224,198,111,.4); border-radius: 50%; color: var(--gold-400); font-size: 9px; }

  .product-frame { position: relative; width: 690px; border: 1px solid rgba(255,255,255,.13); border-radius: 13px 13px 0 0; background: #f7f9f7; color: var(--ink-950); box-shadow: -25px 35px 100px rgba(0,0,0,.38); transform: perspective(1800px) rotateY(-4deg); transform-origin: left center; }
  .frame-top { height: 45px; display: flex; align-items: center; justify-content: space-between; padding: 0 17px; border-bottom: 1px solid #dde4df; background: var(--white); border-radius: 13px 13px 0 0; }
  .mini-brand { display: flex; align-items: center; gap: 7px; font-size: 12px; font-weight: 800; }
  .frame-status { display: flex; align-items: center; gap: 6px; color: #66776c; font-size: 10px; }
  .frame-status i { width: 6px; height: 6px; border-radius: 50%; background: var(--green-400); }
  .dashboard { display: grid; grid-template-columns: 44px 1fr; min-height: 465px; }
  .dash-sidebar { display: flex; flex-direction: column; align-items: center; gap: 18px; padding-top: 25px; border-right: 1px solid #e3e8e4; background: #eff3f0; }
  .dash-sidebar span { width: 15px; height: 15px; border-radius: 4px; background: #cad6ce; }
  .dash-sidebar .active { background: var(--green-600); }
  .dash-main { padding: 25px 26px 30px; }
  .dash-heading { display: flex; align-items: end; justify-content: space-between; margin-bottom: 17px; }
  .dash-heading small, .dash-heading strong { display: block; }
  .dash-heading small { color: #6c7c72; font-size: 11px; }
  .dash-heading strong { font-family: var(--serif); font-size: 21px; }
  .sample-label { border-radius: 99px; padding: 5px 8px; background: #e5eee8; color: var(--green-700); font-size: 9px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
  .dash-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
  .dash-stats article { padding: 13px; border: 1px solid #e1e7e2; border-radius: 7px; background: var(--white); }
  .dash-stats small, .dash-stats span { display: block; color: #6f7e75; font-size: 9px; }
  .dash-stats b { display: block; margin: 4px 0 1px; font-family: var(--serif); font-size: 22px; }
  .dash-stats .up { color: var(--green-500); }
  .dash-content { display: grid; grid-template-columns: 1.42fr .8fr; gap: 10px; margin-top: 10px; }
  .signal-card, .watch-card { border: 1px solid #e1e7e2; border-radius: 7px; padding: 14px; background: var(--white); }
  .card-kicker { margin-bottom: 13px; color: #66776d; font-size: 9px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
  .signal-title, .watch-row { display: flex; align-items: center; }
  .ticker { display: grid; place-items: center; width: 32px; height: 32px; margin-right: 8px; border-radius: 7px; background: var(--green-100); color: var(--green-700); font-size: 8px; font-weight: 900; }
  .signal-title div, .watch-row div { flex: 1; }
  .signal-title b, .signal-title small, .watch-row b, .watch-row small { display: block; }
  .signal-title b, .watch-row b { font-size: 10px; }
  .signal-title small, .watch-row small { color: #6f7e75; font-size: 9px; }
  .signal-title > strong { color: var(--green-500); font-size: 11px; }
  .chart { height: 116px; margin-top: 15px; border-bottom: 1px solid #e3e9e4; background: repeating-linear-gradient(to bottom, transparent 0 29px, #edf1ee 30px); }
  .chart svg { width: 100%; height: 100%; }
  .chart-area { fill: url(#chart-fill); }
  .chart-line { fill: none; stroke: var(--green-500); stroke-width: 2.5; }
  .chart-axis { display: flex; justify-content: space-between; margin-top: 6px; color: #748279; font-size: 9px; }
  .watch-row { padding: 11px 0; border-top: 1px solid #eef1ef; }
  .watch-row:first-of-type { border-top: 0; }
  .ticker.small { width: 28px; height: 28px; }
  .ticker.gold { background: var(--gold-100); color: #7f661b; }
  .ticker.blue { background: #e1ebf3; color: #3d637d; }
  .watch-row strong { color: var(--green-500); font-size: 10px; }
  .watch-row strong.down { color: #a75656; }
  .float-note { position: absolute; display: flex; align-items: center; gap: 9px; min-width: 195px; padding: 11px 14px; border: 1px solid rgba(255,255,255,.11); border-radius: 8px; background: rgba(15,38,26,.95); color: var(--white); box-shadow: 0 16px 35px rgba(0,0,0,.25); transform: translateZ(40px); }
  .float-note > span { display: grid; place-items: center; width: 25px; height: 25px; border: 1px solid rgba(224,198,111,.5); border-radius: 50%; color: var(--gold-400); font-family: var(--serif); font-size: 10px; }
  .float-note b, .float-note small { display: block; }
  .float-note b { font-size: 11px; }
  .float-note small { color: #b2c3b8; font-size: 9px; }
  .note-one { left: -28px; bottom: 52px; }
  .note-two { right: -18px; top: 95px; }
  .proof-strip { position: relative; min-height: 78px; display: flex; align-items: center; justify-content: space-between; border-top: 1px solid rgba(255,255,255,.1); color: #82988a; }
  .proof-strip p { font-family: var(--serif); font-style: italic; font-size: 15px; }
  .proof-strip div { display: flex; align-items: center; gap: 24px; font-size: 11px; font-weight: 800; letter-spacing: .15em; }
  .proof-strip i { width: 3px; height: 3px; border-radius: 50%; background: var(--gold-500); }

  .light-section { background: var(--paper); }
  .split-heading { display: grid; grid-template-columns: 1.25fr .75fr; gap: 80px; align-items: end; margin-bottom: 55px; }
  .audience-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
  .audience-card { position: relative; min-height: 375px; padding: 36px 32px; overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: var(--white); }
  .audience-card.featured { background: var(--ink-900); color: var(--white); box-shadow: var(--shadow); }
  .card-number { position: absolute; right: 25px; top: 23px; color: #c7d1ca; font-family: var(--serif); font-size: 13px; }
  .featured .card-number { color: #5e7667; }
  .icon-box { display: grid; place-items: center; width: 46px; height: 46px; margin-bottom: 52px; border-radius: 8px; background: var(--green-50); color: var(--green-700); font-size: 22px; }
  .featured .icon-box { background: rgba(224,198,111,.13); color: var(--gold-400); }
  .audience-card h3 { margin-bottom: 13px; }
  .audience-card p { min-height: 116px; color: var(--slate); font-size: 16px; line-height: 1.7; }
  .featured p { color: #aec0b5; }
  .audience-card a { display: inline-flex; gap: 8px; margin-top: 23px; color: var(--green-700); font-size: 14px; font-weight: 800; text-decoration: none; }
  .featured a { color: var(--gold-400); }

  .platform-section { background: var(--ink-950); color: var(--white); }
  .platform-section .section-heading > p:last-child { color: #a9bbb0; }
  .feature-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 16px; }
  .feature-card { grid-column: span 2; min-height: 340px; padding: 29px; overflow: hidden; border: 1px solid rgba(255,255,255,.09); border-radius: 8px; background: #11251a; }
  .feature-card.wide { grid-column: span 4; display: grid; grid-template-columns: .85fr 1.15fr; gap: 40px; }
  .feature-card.gold-card { background: #d7b95e; color: var(--ink-950); }
  .feature-icon { display: grid; place-items: center; width: 38px; height: 38px; margin-bottom: 42px; border-radius: 7px; background: rgba(49,163,98,.13); color: var(--green-400); font-size: 19px; }
  .gold-card .feature-icon { background: rgba(11,23,17,.09); color: var(--ink-950); }
  .feature-card h3 { margin-bottom: 11px; }
  .feature-card p { color: #b6c7bc; font-size: 16px; line-height: 1.7; }
  .gold-card p { color: #435047; }
  .feature-tag { display: inline-block; margin-top: 25px; color: var(--gold-400); font-size: 12px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
  .mini-timeline { padding-top: 12px; }
  .mini-timeline > div { display: grid; grid-template-columns: 42px 20px 1fr; min-height: 78px; color: #9eb1a5; font-size: 11px; }
  .mini-timeline i { position: relative; width: 1px; height: 100%; background: #30503c; }
  .mini-timeline i::before { content: ""; position: absolute; left: -4px; width: 9px; height: 9px; border: 2px solid var(--green-400); border-radius: 50%; background: var(--ink-900); }
  .mini-timeline p b, .mini-timeline p small { display: block; }
  .mini-timeline p b { color: var(--white); font-size: 13px; }
  .mini-timeline p small { color: #7f9286; }
  .stacked-lines { display: grid; gap: 9px; margin-top: 31px; }
  .stacked-lines span { height: 8px; border-radius: 5px; background: linear-gradient(90deg, rgba(49,163,98,.6) 62%, rgba(255,255,255,.06) 62%); }
  .stacked-lines span:nth-child(2) { background: linear-gradient(90deg, rgba(201,168,76,.5) 43%, rgba(255,255,255,.06) 43%); }
  .stacked-lines span:nth-child(3) { background: linear-gradient(90deg, rgba(49,163,98,.4) 78%, rgba(255,255,255,.06) 78%); }
  .sentiment { margin-top: 27px; }
  .sentiment > div { display: flex; justify-content: space-between; font-size: 13px; }
  .sentiment > i { display: block; height: 7px; margin: 8px 0; border-radius: 8px; background: rgba(11,23,17,.13); }
  .sentiment > i span { display: block; width: 62%; height: 100%; border-radius: inherit; background: var(--ink-900); }
  .sentiment small { font-size: 11px; }
  .pill-row { display: flex; gap: 7px; margin-top: 28px; }
  .pill-row span { padding: 6px 9px; border: 1px solid #3d6049; border-radius: 99px; color: #acc0b3; font-size: 11px; }
  .avatars { display: flex; align-items: center; margin-top: 26px; }
  .avatars i { display: grid; place-items: center; width: 30px; height: 30px; margin-right: -6px; border: 2px solid #11251a; border-radius: 50%; background: #284734; color: #dce7df; font-size: 7px; font-style: normal; }
  .avatars span { margin-left: 13px; color: var(--gold-400); font-size: 12px; }

  .academy-section { background: var(--cream); }
  .academy-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 120px; align-items: center; }
  .academy-visual { position: relative; min-height: 490px; }
  .academy-card { position: absolute; width: 350px; min-height: 390px; border-radius: 10px; padding: 35px; box-shadow: var(--shadow); }
  .back-card { left: 70px; top: 0; transform: rotate(7deg); background: var(--green-700); color: #8eb49a; }
  .back-card > span { font-family: var(--serif); font-size: 48px; }
  .back-card p { margin-top: 190px; font-size: 12px; text-transform: uppercase; }
  .back-card b { display: block; color: var(--white); font-family: var(--serif); font-size: 20px; }
  .front-card { left: 0; top: 48px; background: var(--white); }
  .lesson-label { display: flex; justify-content: space-between; color: var(--green-700); font-size: 10px; font-weight: 900; letter-spacing: .08em; }
  .lesson-label b { color: #8a998f; }
  .front-card h3 { margin-top: 52px; font-family: var(--serif); font-size: 40px; font-weight: 500; line-height: 1.05; }
  .front-card > p { margin-top: 20px; color: var(--slate); font-size: 15px; }
  .lesson-progress { height: 5px; margin-top: 50px; border-radius: 5px; background: #e8eee9; }
  .lesson-progress span { display: block; width: 34%; height: 100%; border-radius: inherit; background: var(--green-600); }
  .front-card > small { display: block; margin-top: 10px; color: #69786e; font-size: 12px; }
  .academy-copy h2 { margin: 22px 0 25px; }
  .academy-copy > p:not(.eyebrow) { color: var(--slate); font-size: var(--text-body); line-height: 1.75; }
  .check-list { display: grid; gap: 21px; margin-top: 31px; list-style: none; }
  .check-list li { display: flex; gap: 13px; }
  .check-list li > span { flex: 0 0 23px; height: 23px; display: grid; place-items: center; border-radius: 50%; background: var(--green-100); color: var(--green-700); font-size: 10px; }
  .check-list b { font-size: 16px; }
  .check-list p { color: var(--slate); font-size: 15px; }

  .flow-section { background: var(--paper); }
  .flow-grid { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 58px; list-style: none; counter-reset: flow; }
  .flow-grid li { position: relative; min-height: 315px; padding: 25px 28px; border: 1px solid var(--line); border-right: 0; background: var(--white); }
  .flow-grid li:first-child { border-radius: 8px 0 0 8px; }
  .flow-grid li:last-child { border-right: 1px solid var(--line); border-radius: 0 8px 8px 0; }
  .flow-grid li > span { color: #a1aea5; font-family: var(--serif); font-size: 12px; }
  .flow-icon { display: grid; place-items: center; width: 42px; height: 42px; margin: 37px 0 22px; border-radius: 50%; background: var(--green-50); color: var(--green-700); font-size: 19px; }
  .flow-grid h3 { font-size: 18px; }
  .flow-grid p { margin-top: 9px; color: var(--slate); font-size: 15px; line-height: 1.65; }
  .architecture-note { display: flex; gap: 35px; align-items: center; margin-top: 20px; padding: 18px 24px; border-left: 3px solid var(--gold-500); background: var(--gold-100); }
  .architecture-note span { flex: 0 0 auto; color: #6e5718; font-size: 12px; font-weight: 900; letter-spacing: .09em; text-transform: uppercase; }
  .architecture-note p { color: #514d40; font-size: 15px; }

  .membership-section { overflow: hidden; background: var(--ink-900); color: var(--white); }
  .membership-grid { display: grid; grid-template-columns: 1fr 480px; gap: 100px; align-items: center; }
  .membership-copy h2 { margin: 25px 0; }
  .membership-copy > p:not(.eyebrow) { max-width: 560px; color: #c0cec5; font-size: var(--text-body); line-height: 1.75; }
  .membership-copy .approved-pricing { display: grid; gap: 3px; margin: 22px 0 4px; color: var(--white); }
  .approved-pricing strong { font-family: var(--serif); font-size: 27px; font-weight: 600; }
  .approved-pricing span { color: #a9bbae; font-size: 14px; }
  .membership-copy .button { margin-top: 30px; }
  .membership-copy > small { display: block; max-width: 470px; margin-top: 16px; color: #9ab0a2; font-size: 13px; line-height: 1.6; }
  .membership-card { position: relative; padding: 36px 38px; border: 1px solid rgba(255,255,255,.13); border-radius: 11px; background: #f8f7f1; color: var(--ink-950); box-shadow: 0 35px 80px rgba(0,0,0,.3); }
  .membership-card::before { content: ""; position: absolute; inset: 10px; pointer-events: none; border: 1px solid #e5dec9; border-radius: 7px; }
  .membership-top { position: relative; display: flex; align-items: center; justify-content: space-between; padding-bottom: 23px; border-bottom: 1px solid #ddd9cd; }
  .membership-top span { color: var(--green-700); font-size: 10px; font-weight: 900; letter-spacing: .11em; }
  .membership-top b { font-family: var(--serif); font-size: 14px; }
  .trial { position: relative; display: flex; align-items: center; gap: 15px; padding: 26px 0 20px; }
  .trial > strong { font-family: var(--serif); font-size: 62px; font-weight: 500; line-height: 1; }
  .trial b, .trial span { display: block; }
  .trial b { font-size: 16px; }
  .trial span { color: var(--slate); font-size: 13px; }
  .membership-card ul { position: relative; display: grid; gap: 13px; padding: 20px 0; border-top: 1px solid #ddd9cd; list-style: none; }
  .membership-card li { font-size: 15px; }
  .membership-card li span { margin-right: 9px; color: var(--green-600); }
  .policy-note { position: relative; padding: 15px; border-radius: 6px; background: var(--green-50); }
  .policy-note b { color: var(--green-700); font-size: 11px; text-transform: uppercase; }
  .policy-note p { margin-top: 4px; color: #465c4e; font-size: 13px; line-height: 1.65; }

  .faq-section { background: var(--paper); }
  .faq-grid { display: grid; grid-template-columns: .72fr 1.28fr; gap: 110px; align-items: start; }
  .faq-grid .section-heading > p:last-child { margin-top: 20px; }
  .faq-list details { border-top: 1px solid var(--line); }
  .faq-list details:last-child { border-bottom: 1px solid var(--line); }
  .faq-list summary { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 22px 0; cursor: pointer; font-size: 17px; font-weight: 750; list-style: none; }
  .faq-list summary::-webkit-details-marker { display: none; }
  .faq-list summary span { color: var(--green-700); font-size: 24px; font-weight: 300; transition: transform .2s; }
  .faq-list details[open] summary span { transform: rotate(45deg); }
  .faq-list details p { max-width: 670px; padding: 0 45px 22px 0; color: var(--slate); font-size: 16px; }

  .final-cta { position: relative; overflow: hidden; padding: 95px 0; background: var(--green-700); color: var(--white); text-align: center; }
  .final-cta::before, .final-cta::after { content: ""; position: absolute; width: 460px; height: 460px; border: 1px solid rgba(255,255,255,.08); border-radius: 50%; }
  .final-cta::before { left: -200px; top: -230px; }
  .final-cta::after { right: -170px; bottom: -310px; }
  .final-inner { position: relative; }
  .final-inner .eyebrow { justify-content: center; }
  .final-inner h2 { margin: 25px 0 20px; }
  .final-inner > p:not(.eyebrow) { color: #bad0c2; }
  .final-inner .button { margin-top: 27px; }

  .site-footer { padding-top: 62px; background: var(--ink-950); color: var(--white); }
  .footer-top { display: grid; grid-template-columns: 2fr repeat(3, 1fr); gap: 45px; padding-bottom: 54px; }
  .footer-brand { margin-bottom: 17px; }
  .footer-top > div > p { color: #a6b8ad; font-size: 14px; }
  .footer-top nav { display: flex; flex-direction: column; gap: 10px; }
  .footer-top nav b { margin-bottom: 8px; color: #d5ded8; font-size: 12px; text-transform: uppercase; letter-spacing: .1em; }
  .footer-top nav a { color: #a6b8ad; font-size: 14px; text-decoration: none; }
  .footer-top nav a:hover { color: var(--white); }
  .footer-bottom { display: flex; justify-content: space-between; gap: 30px; padding: 22px 0 30px; border-top: 1px solid rgba(255,255,255,.08); color: #92a69a; font-size: 12px; }
  .footer-bottom p:last-child { max-width: 610px; text-align: right; }

  .enrollment-dialog { width: min(570px, calc(100% - 32px)); max-height: calc(100vh - 32px); padding: 0; overflow: auto; border: 0; border-radius: 12px; background: var(--paper); color: var(--ink-950); box-shadow: 0 35px 100px rgba(0,0,0,.45); }
  .enrollment-dialog::backdrop { background: rgba(5,15,9,.78); backdrop-filter: blur(5px); }
  .dialog-head { display: flex; align-items: center; justify-content: space-between; padding: 17px 22px; border-bottom: 1px solid var(--line); background: var(--white); }
  .dialog-head button { width: 34px; height: 34px; border: 0; border-radius: 50%; background: var(--green-50); cursor: pointer; font-size: 22px; }
  .dialog-body { padding: 31px 36px 36px; }
  .dialog-body h2 { margin: 17px 0 13px; font-size: 39px; }
  .dialog-body > p:not(.eyebrow) { color: var(--slate); font-size: 16px; }
  .dialog-body ol { display: grid; gap: 13px; margin: 25px 0; list-style: none; }
  .dialog-body li { display: flex; gap: 13px; }
  .dialog-body li > span { flex: 0 0 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; background: var(--green-100); color: var(--green-700); font-size: 10px; font-weight: 800; }
  .dialog-body li b { display: block; font-size: 15px; }
  .dialog-body li p { color: var(--slate); font-size: 13px; }
  .preview-banner { padding: 14px; margin-bottom: 20px; border-left: 3px solid var(--gold-500); background: var(--gold-100); }
  .preview-banner span { color: #6e5718; font-size: 11px; font-weight: 900; text-transform: uppercase; }
  .preview-banner p { color: #575244; font-size: 13px; }
  .enrollment-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
  .enrollment-actions .button { justify-content: center; text-align: center; }

  @media (max-width: 1080px) {
    .primary-nav { gap: 18px; }
    .primary-nav > a:not(.nav-signin) { display: none; }
    .hero { min-height: auto; }
    .hero-grid { grid-template-columns: 1fr; }
    .hero-copy { max-width: 720px; padding-bottom: 10px; }
    .product-frame { justify-self: center; transform: none; }
    .proof-strip { margin-top: 65px; }
    .split-heading { gap: 45px; }
    .academy-grid { gap: 55px; }
    .membership-grid { gap: 55px; }
  }

  @media (max-width: 800px) {
    .shell { width: min(100% - 32px, 660px); }
    .section { padding: 78px 0; }
    .site-header { position: absolute; }
    .site-header.is-scrolled { position: fixed; }
    .menu-toggle { display: block; }
    .primary-nav { position: fixed; inset: 74px 0 auto; display: none; align-items: stretch; gap: 0; padding: 20px 24px 28px; border-top: 1px solid rgba(255,255,255,.08); background: var(--ink-950); box-shadow: 0 25px 45px rgba(0,0,0,.3); }
    .primary-nav.is-open { display: flex; flex-direction: column; }
    .primary-nav > a:not(.nav-signin) { display: block; }
    .primary-nav > a { padding: 12px 2px; }
    .nav-signin { margin: 8px 0 14px; padding-left: 2px !important; border-left: 0; border-top: 1px solid rgba(255,255,255,.1); }
    .menu-toggle[aria-expanded="true"] span:not(.sr-only):first-of-type { transform: translateY(4px) rotate(45deg); }
    .menu-toggle[aria-expanded="true"] span:not(.sr-only):last-of-type { transform: translateY(-4px) rotate(-45deg); }
    .hero { padding-top: 130px; }
    .hero h1 { font-size: clamp(48px, 14vw, 67px); }
    .hero-lede { font-size: 18px; }
    .product-frame { width: 100%; }
    .float-note { display: none; }
    .dashboard { grid-template-columns: 34px 1fr; min-height: 390px; }
    .dash-main { padding: 17px 14px; }
    .dash-content { grid-template-columns: 1fr; }
    .watch-card { display: none; }
    .proof-strip { display: block; padding: 24px 0; }
    .proof-strip div { margin-top: 13px; gap: 10px; justify-content: space-between; }
    .split-heading, .academy-grid, .membership-grid, .faq-grid { grid-template-columns: 1fr; }
    .split-heading { gap: 24px; }
    .audience-grid { grid-template-columns: 1fr; }
    .audience-card { min-height: auto; }
    .icon-box { margin-bottom: 34px; }
    .feature-grid { grid-template-columns: 1fr; }
    .feature-card, .feature-card.wide { grid-column: auto; }
    .feature-card.wide { grid-template-columns: 1fr; }
    .academy-grid { gap: 35px; }
    .academy-visual { min-height: 430px; transform: scale(.88); transform-origin: left center; }
    .flow-grid { grid-template-columns: 1fr 1fr; }
    .flow-grid li { border-right: 1px solid var(--line); }
    .flow-grid li:first-child, .flow-grid li:last-child { border-radius: 0; }
    .membership-card { width: min(100%, 500px); }
    .faq-grid { gap: 45px; }
    .footer-top { grid-template-columns: 1.5fr 1fr 1fr; }
    .footer-top nav:last-child { display: none; }
  }

  @media (max-width: 520px) {
    h2 { font-size: 41px; }
    .hero-actions { align-items: stretch; flex-direction: column; }
    .text-link { justify-content: center; }
    .trust-list { gap: 11px; }
    .dash-stats article:last-child { display: none; }
    .dash-stats { grid-template-columns: 1fr 1fr; }
    .dash-heading .sample-label { display: none; }
    .proof-strip div { flex-wrap: wrap; justify-content: flex-start; }
    .feature-card.wide { gap: 15px; }
    .academy-visual { min-height: 375px; transform: scale(.74); }
    .flow-grid { grid-template-columns: 1fr; }
    .flow-grid li { min-height: auto; }
    .architecture-note { align-items: start; flex-direction: column; gap: 6px; }
    .membership-card { padding: 29px 24px; }
    .footer-top { grid-template-columns: 1fr 1fr; }
    .footer-top > div { grid-column: 1 / -1; }
    .footer-bottom { flex-direction: column; }
    .footer-bottom p:last-child { text-align: left; }
    .dialog-body { padding: 27px 23px 28px; }
  }
}

@layer motion {
  .reveal { opacity: 0; transform: translateY(18px); transition: opacity .65s ease, transform .65s ease; }
  .reveal.is-visible { opacity: 1; transform: translateY(0); }
  @media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
    .reveal { opacity: 1; transform: none; }
  }
}