/* Infinite Zephyr customer UI â€” consolidated from Zephyr_web_21July.html. */

/* ══════════════════════════════════════════
       INFINITE ZEPHYR — LUXURY REDESIGN
       Aesthetic: Private wealth. Sydney harbour
       at midnight. Champagne gold on midnight ink,
       parchment cream for editorial breath.
    ══════════════════════════════════════════ */
    :root {
      /* ── Palette ── */
      --ink:           #070e1c;   /* deepest midnight */
      --ink-2:         #0c1828;   /* dark surface (cards) */
      --ink-3:         #14223a;   /* elevated dark */
      --ink-4:         #1c2c46;
      --cream:         #f4ede0;   /* warm parchment */
      --cream-2:       #ebe2cf;
      --bone:          #f4f1ea;   /* Bone — Brand Guidelines 06 · RGB 244 241 234 · Warm Gray 1 */
      /* GOLD — [16 Jul · SIGNED OFF] a HIGHLIGHT, not a typeface rule.
         Gold marks a word worth attention. It is free to land on any font and
         any size: Cormorant (.izlr-tag), Fraunces (engineered., next financial
         stage), Manrope (.email-link), Mono (.trust-num). One hard constraint,
         and it is contrast, not taste:
             on Ink  → --gold          (#c9a35a)
             on Bone → --gold-on-paper (#87682c) — raw gold is 2.03:1, fails AA
         Never use --gold for text on a light ground. */
      --gold:          #c9a35a;   /* champagne gold */
      --gold-light:    #e0c285;
      --gold-on-paper: #87682c;   /* Zephyr Gold darkened along its own hue.
                                     Gold is 2.03:1 and gold-deep 3.29:1 on Bone — both fail.
                                     This clears 4.5:1 for small text on paper. */
      --oxblood:       #6b1d28;
      --emerald:       #14653f;

      /* ── Surface contract (default = ink) ── */
      --surface:              var(--ink);
      --surface-2:            var(--ink-2);
      /* Text tone ladder. Bone at fixed opacities — this is what the site
         actually renders today, so the tokens describe reality instead of
         competing with it. Was #d9cdb3 (warm tan) / #8d96a8 (cool blue-grey):
         a considered palette that was never adopted (19 rules out of 300).
         NOTE: only ~19 rules read these tokens. The other ~282 hard-code the
         same colours by hand, so changing the values here will NOT restyle the
         site until those are migrated. Don't trust these as a global dial yet. */
      --on-surface-strong:    var(--bone);                    /* #F4F1EA        */
      --on-surface:           rgba(244, 241, 234, 0.82);      /* ~#C9C8C5 11.5:1 */
      --on-surface-muted:     rgba(244, 241, 234, 0.58);      /* ~#909293  6.2:1 */
      --on-surface-faint:     rgba(244, 241, 234, 0.42);      /* ~#6B6D73  3.7:1
                                   DECORATIVE ONLY — fails 4.5:1, never for
                                   text a user actually needs to read. */
      --hairline:             rgba(201, 163, 90, 0.20);
      --hairline-strong:      rgba(201, 163, 90, 0.42);
      --card-bg:              rgba(255, 255, 255, 0.025);
      --card-border:          rgba(201, 163, 90, 0.18);
      --eyebrow:              var(--gold);   /* the label colour. One rule; the ground
                                                   redefines it, so every eyebrow says the same thing. */

      /* ── Back-compat aliases (referenced in inline HTML styles) ── */
      --bg:           var(--ink);
      --bg-soft:      var(--cream);
      --bg-tint:      rgba(201, 163, 90, 0.10);
      --primary:      var(--bone);
      --primary-mid:  var(--ink-3);
      --secondary:    var(--gold);
      --accent:       var(--gold);
      --accent-light: var(--gold-light);
      --accent-glow:  rgba(201, 163, 90, 0.16);
      --blue:         var(--gold);
      --text:         var(--on-surface);
      --muted:        var(--on-surface-muted);
      --muted-light:  #b7bdcb;
      --border:       rgba(201, 163, 90, 0.20);
      --border-soft:  rgba(201, 163, 90, 0.10);
      --success:      var(--emerald);

      /* ── Shadow ── */
      --shadow-sm:    0 1px 0 rgba(201,163,90,0.06), 0 8px 22px rgba(0,0,0,0.28);
      --shadow:       0 1px 0 rgba(201,163,90,0.08), 0 22px 60px rgba(0,0,0,0.42);
      --shadow-lg:    0 1px 0 rgba(201,163,90,0.10), 0 40px 100px rgba(0,0,0,0.55);

      /* ── Geometry ── */
      --radius:       2px;
      --radius-sm:    2px;
      --max:          1240px;

      /* ── Type ── */
      --font-display: 'Fraunces', 'Instrument Serif', Georgia, serif;
      --font-italic:  var(--font-accent);   /* the italic voice IS the accent voice.
                                              Was Instrument Serif — a third serif in no
                                              brand document. Used by h1 ("Wealth, engineered."
                                              — the tagline) and .final-cta h2. */
      --font-serif:   'Instrument Serif', 'Fraunces', Georgia, serif;
      /* ── ACCENT VOICE — Brand Guidelines 07. Cormorant Garamond italic.
         The human register: personal names (.team-name — Dean Nguyen, Minh Le
         CFA — and .mission-sign-name), the founder quote, testimonial keywords,
         the logo tagline, editorial asides.

         THIS IS NOT THE SAME THING AS HEADING EMPHASIS. See --font-emphasis
         below. Two registers, two rules:
             --font-accent   → who is speaking   (Cormorant italic)
             --font-emphasis → a stressed word inside a heading (Fraunces italic)
         I briefly collapsed both onto Fraunces on 16 Jul. Wrong: the brief was
         about heading emphasis only. Don't merge them again. */
      --font-accent:  'Cormorant Garamond', Georgia, serif;
      /* [16 Jul · SIGNED OFF — verified in Chromium, not by reading the CSS]
         Every italic emphasis inside a heading (18 of them, see the audit).

         This is the SAME FACE the approved headings already render in:
             "Know your next move."            .final-cta h2      -> Fraunces italic
             "Wealth is engineered, not earned"  .mission-headline -> Fraunces italic
             "Wealth, engineered."             .hero h1           -> Fraunces italic
         Despite what several rules in this file *say*, all three compute to
         Fraunces at runtime. --font-accent (Cormorant) is a different face and
         is NOT what those headings use — it belongs to .team-name (Dean Nguyen)
         and the logo tagline only. Don't "fix" this to --font-accent; measure
         first with getComputedStyle.

         Size: Fraunces IS the heading font, so the <em> sets at exactly the
         heading's font-size with no compensation. Never add a font-size bump
         here — emphasis must never change the size of a word. */
      --font-emphasis: 'Fraunces', 'Instrument Serif', Georgia, serif;

      /* Logo + header geometry. --iz-sym is the symbol's ink height; everything
         in the lockup scales off it (see .brand). --header-h is derived from it
         so the two can never drift apart:
              brand image  = --iz-sym x 1.1230   (svg canvas / ink height)
            + .nav padding = 44px   (22 top + 22 bottom)
            + border       = 1px
         The header is position:fixed, so the first section on every page must
         clear this. It didn't: .section's 90px top padding was written when the
         header was ~95px, and the 15 Jul logo rebuild took it to ~101px — so the
         first 11px of every page, i.e. the eyebrow, sat underneath it. */
      --iz-sym:       52px;
      --header-h:     calc(var(--iz-sym) * 1.1230 + 45px);
      --font-sans:    'Manrope', system-ui, -apple-system, sans-serif;
      --font-mono:    'JetBrains Mono', ui-monospace, 'SF Mono', monospace;

      /* ══════════════════════════════════════════════════════════════════
         TYPE SYSTEM — Phase 0 (tokens only; nothing consumes these yet)

         Every element picks ONE role below. No bespoke sizes, ever.
         Values chosen to sit close to the site's existing common sizes so
         adoption moves things as little as possible.

         Audit that prompted this (15 Jul):
           546 font-size declarations  ->  128 distinct values (56 used once)
           769 colour declarations     ->  137 distinct values (401 hard-coded)
         ══════════════════════════════════════════════════════════════════ */

      /* Type roles */
      --t-display:  clamp(2.2rem, 5vw, 3.6rem);   /* hero only              */
      --t-h2:       clamp(1.75rem, 3.4vw, 2.8rem);/* section heading        */
      --t-h3:       1.4rem;                       /* card heading           */
      --t-lead:     1.15rem;                      /* intro paragraph        */
      --t-body:     1rem;                         /* body copy              */
      --t-caption:  0.78rem;                      /* fine print, captions   */
      --t-label:    0.65rem;                      /* eyebrow, label         */
      --t-figure:   2.2rem;                       /* statistics, big numbers*/
      --t-accent:   1.75rem;                      /* Cormorant accent line  */
      --t-button:   0.65rem;                      /* buttons                */

      /* Colour roles — DO NOT invent new ones. Use the surface contract that
         already exists below; it flips automatically on light sections, so the
         same rule works on ink and on bone:
             heading  ->  var(--on-surface-strong)
             body     ->  var(--on-surface)
             caption  ->  var(--on-surface-muted)
             accent   ->  var(--gold)
             rules    ->  var(--hairline) / var(--hairline-strong)
         Hard-coded hex/rgba in a rule is a bug, not a choice. */

      /* Tracking */
      --tr-label:   0.18em;
      --tr-button:  0.14em;

      /* Rule 1: italic is ONLY ever var(--font-accent). Nothing else italicises.
         Rule 2: gold does five jobs — hairlines, dots, eyebrows, highlighted
                 words inside a line, and the primary CTA. Never body text. */
    }

    /* ── Component-level surface flip ──────────────────────────────────────
       Some components own their own light ground (.media-card / .story-card are
       background: var(--bone)) while their SECTION stays dark. The contract has
       to flip on the component, or var(--on-surface-strong) resolves to Bone and
       lands bone-on-bone.
       That was live: .media-webinar-input is transparent with
       color: var(--on-surface-strong) inside a bone card — typed text was
       invisible. Variables only; nothing else here consumes the contract. */
    .media-card, .story-card, .trust-block {
      --on-surface:        #2a2f3d;
      --on-surface-strong: var(--ink);
      --on-surface-muted:  #6b6f7e;
  --on-surface-faint:  rgba(7, 14, 28, 0.42);
      --hairline:          rgba(7, 14, 28, 0.10);
      --hairline-strong:   rgba(7, 14, 28, 0.22);
      --eyebrow:           var(--gold-on-paper);
    }

    /* ── Section-level surface flip: cream parchment ── */
    .faq-section, .blog-section, .contact-section,
    .inline-newsletter-section, .taxded-section, .voa-site-section,
    section[style*="bg-soft"], section[style*="--bg-soft"] {
      --surface:           var(--cream);
      --surface-2:         var(--bone);
      --on-surface:        #2a2f3d;
      --on-surface-strong: var(--ink);
      --on-surface-muted:  #6b6f7e;
  --on-surface-faint:  rgba(7, 14, 28, 0.42);
      --hairline:          rgba(7, 14, 28, 0.10);
      --hairline-strong:   rgba(7, 14, 28, 0.22);
      --card-bg:           var(--bone);
      --card-border:       rgba(7, 14, 28, 0.08);
      --eyebrow:           var(--gold-on-paper);
      background: var(--surface) !important;
      color: var(--on-surface);
    }

    /* ── Reset & Base ── */
    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    html { scroll-behavior: smooth; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
    body {
      font-family: var(--font-sans);
      color: var(--on-surface);
      background: var(--surface);
      line-height: 1.7;
      overflow-x: hidden;
      font-weight: 400;
      font-feature-settings: "ss01", "cv01", "cv03", "kern";
    }
    a { color: inherit; text-decoration: none; }
    img { max-width: 100%; display: block; }
    button { font-family: inherit; cursor: pointer; background: none; border: none; color: inherit; }
    ul { list-style: none; }
    ::selection { background: var(--gold); color: var(--ink); }

    /* ── Subtle film grain on dark surfaces ── */
    body::before {
      content: "";
      position: fixed;
      inset: 0;
      pointer-events: none;
      z-index: 1000;
      opacity: 0.035;
      background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 1 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
      mix-blend-mode: overlay;
    }

    /* ── Layout primitives ── */
    .container {
      width: min(calc(100% - 2.5rem), var(--max));
      margin: 0 auto;
    }
    .section    { padding: 90px 0; position: relative; }
    /* The first section on a page sits under the fixed header. Restore the 90px
       of air the design intends, measured from the header's bottom edge rather
       than from the top of the viewport. Only :first-child is affected. */
    .page > section:first-child:not(.hero) {
      padding-top: calc(var(--header-h) + 45px);
    }
    .section-sm { padding: 56px 0; }
    @media (max-width: 768px) { .section { padding: 64px 0; } }

    /* ── Typography ── */
    h1, h2, h3, h4 { line-height: 1.05; letter-spacing: -0.02em; color: var(--on-surface-strong); font-weight: 400; }
    h1 {
      font-family: var(--font-italic);
      font-size: clamp(3.2rem, 7vw, 6.6rem);
      font-weight: 400;
      font-style: italic;
      letter-spacing: -0.025em;
      line-height: 0.98;
    }
    h1 strong {
      font-style: italic; font-weight: 400;
      color: var(--gold);
      position: relative;
    }
    h2 {
      font-family: var(--font-display);
      font-size: clamp(2.2rem, 4vw, 3.8rem);
      font-weight: 350;
      font-variation-settings: "opsz" 144, "SOFT" 30;
      letter-spacing: -0.022em;
    }
    h3 {
      font-family: var(--font-sans);
      font-size: 1.15rem;
      font-weight: 600;
      letter-spacing: -0.005em;
      text-transform: none;
    }
    h4 {
      font-family: var(--font-sans);
      font-size: 0.95rem;
      font-weight: 600;
      letter-spacing: -0.005em;
    }
    p { color: var(--on-surface); }
    p.lead {
      font-family: var(--font-sans);
      font-size: 1.15rem;
      font-weight: 350;
      color: var(--on-surface);
      opacity: 0.78;
      max-width: 64ch;
      line-height: 1.75;
      letter-spacing: -0.005em;
    }
    .muted, .muted-small {
      color: var(--on-surface-muted);
      font-size: 0.82rem;
    }
    .muted-small { font-size: 0.82rem; }

    /* ── Eyebrow: tracked small-caps mono editorial label ── */
    .eyebrow, .fc-eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 12px;
      padding: 0;
      background: transparent;
      color: var(--eyebrow);
      border: none;
      border-radius: 0;
      font-family: var(--font-mono);
      font-size: 0.72rem;
      font-weight: 500;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      margin-bottom: 28px;
    }
    .eyebrow::before, .fc-eyebrow::before {
      content: "";
      width: 28px;
      height: 1px;
      background: var(--gold);
      display: inline-block;
    }
    .eyebrow-dot {
      width: 5px; height: 5px;
      border-radius: 50%;
      background: var(--gold);
      flex-shrink: 0;
      display: none;  /* replaced by ::before rule */
    }

    /* ── Buttons ── */
    .btn-row { display: flex; gap: 16px; flex-wrap: wrap; align-items: center; margin-top: 36px; }
    .btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 12px;
      min-height: 56px;
      padding: 0 32px;
      border-radius: 0;
      font-family: var(--font-sans);
      font-weight: 500;
      font-size: 0.82rem;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      border: 1px solid transparent;
      transition: color .55s ease, background .55s ease, border-color .55s ease, transform .35s cubic-bezier(.22,.61,.36,1);
      white-space: nowrap;
      position: relative;
      overflow: hidden;
    }
    .btn-primary {
      background: var(--gold);
      color: var(--ink);
      border-color: var(--gold);
    }
    .btn-primary::before {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(110deg, transparent 30%, rgba(255,255,255,0.45) 50%, transparent 70%);
      transform: translateX(-110%);
      transition: transform .9s ease;
    }
    .btn-primary:hover {
      background: var(--gold-light);
      border-color: var(--gold-light);
      transform: translateY(-1px);
    }
    .btn-primary:hover::before { transform: translateX(110%); }
    .btn-secondary {
      border-color: var(--hairline-strong);
      background: transparent;
      color: var(--on-surface-strong);
    }
    .btn-secondary:hover {
      border-color: var(--gold);
      color: var(--gold);
    }
    .btn-ghost {
      color: var(--gold);
      background: transparent;
      border-color: transparent;
      padding-left: 0;
      letter-spacing: 0.16em;
    }
    .btn-ghost:hover { gap: 18px; }
    .btn-arrow::after { content: "→"; }

    /* ── Cards (generic) ── */
    .card {
      background: var(--card-bg);
      border: 1px solid var(--card-border);
      border-radius: var(--radius);
      box-shadow: var(--shadow-sm);
    }
    .card-pad  { padding: 36px; }
    .card-hover { transition: transform .5s cubic-bezier(.22,.61,.36,1), border-color .5s ease, box-shadow .5s ease; }
    .card-hover:hover {
      transform: translateY(-3px);
      border-color: var(--hairline-strong);
      box-shadow: var(--shadow);
    }

    /* ── Section head ── */
    .section-head { margin-bottom: 80px; max-width: 760px; }
    .section-head.center {
      margin-left: auto; margin-right: auto;
      text-align: center;
      display: flex; flex-direction: column; align-items: center;
    }
    .section-head.center .lead { text-align: center; }
    .section-head h2 { margin-bottom: 24px; }
    .section-head .lead { font-size: 1.15rem; }

    /* ── Tick ── */
    .tick {
      flex: 0 0 18px; width: 18px; height: 18px;
      border-radius: 50%;
      background: transparent;
      border: 1px solid var(--gold);
      color: var(--gold);
      font-size: 0.62rem;
      display: inline-flex; align-items: center; justify-content: center;
      font-weight: 700;
    }
    .tick-item {
      display: flex; gap: 16px; align-items: flex-start;
      padding: 18px 22px;
      background: var(--card-bg);
      border: 1px solid var(--card-border);
      border-radius: 0;
      transition: border-color .4s ease;
    }
    .tick-item:hover { border-color: var(--hairline-strong); }

    /* ── Icon ── */
    .icon, .ico {
      width: 52px; height: 52px;
      border-radius: 50%;
      display: inline-flex; align-items: center; justify-content: center;
      background: transparent;
      border: 1px solid var(--hairline-strong);
      color: var(--gold);
      font-size: 1.15rem;
      flex-shrink: 0;
      letter-spacing: 0;
    }

    /* ── Pill / chip ── */
    .pill, .gated-pill {
      display: inline-flex; white-space: nowrap; align-items: center; gap: 8px;
      padding: 8px 14px;
      border-radius: 999px;
      background: transparent;
      color: var(--gold);
      border: 1px solid var(--hairline-strong);
      font-family: var(--font-mono);
      font-size: 0.72rem;
      font-weight: 500;
      letter-spacing: 0.12em;
      text-transform: uppercase;
    }

    /* ══════════════════════════════════════════
       HEADER / NAV
    ══════════════════════════════════════════ */
    #siteHeader {
      position: fixed;
      top: 0; left: 0; right: 0;
      z-index: 500;
      background: rgba(7, 14, 28, 0.72);
      backdrop-filter: blur(20px) saturate(140%);
      -webkit-backdrop-filter: blur(20px) saturate(140%);
      border-bottom: 1px solid rgba(201, 163, 90, 0.10);
      transition: background .5s ease, border-color .5s ease;
    }
    #siteHeader.scrolled {
      background: rgba(7, 14, 28, 0.92);
      border-bottom-color: rgba(201, 163, 90, 0.18);
    }
    .nav {
      display: flex; align-items: center; justify-content: space-between;
      padding: 22px 0;
      gap: 24px;
    }
    /* ── Horizontal lockup, live text ────────────────────────────────────────
       Symbol = master artwork (symbol-bone.png). Wordmark = real text, so it
       stays crawlable/indexable for SEO/GEO/AEO.

       Every value below is derived from lockup-horizontal-bone.png, measured
       against the symbol's ink height (S = --iz-sym). Change --iz-sym only —
       everything else scales with it, so the ratio never drifts:
         symbol ink aspect ....... 1.8505 (792 x 428)
         svg canvas / ink height . 1.1230 (IZ-header-mark-bone.svg viewBox pad)
         gap symbol -> rule ...... 0.277 S   (less the svg's own 0.061 S pad)
         rule height ............. 0.734 S   hairline, bone @ 32%
         gap rule -> wordmark .... 0.243 S
         wordmark cap height ..... 0.1864 S  -> font-size 0.2553 S
         line pitch .............. 0.339 S   -> line-height 1.327
         tracking ................ 0.205em   (the lockup is tighter than the
                                              standalone wordmark's 0.30em)
         weight .................. 700        (stem/em 0.144)
       Colour is Bone on Ink — never white (white is the knockout for use over
       photography/video only). Gold is never applied to symbol or wordmark. */
    @media (max-width: 820px) { :root { --iz-sym: 40px; } }

    .brand {
      display: flex; align-items: center;
      flex-shrink: 0;
      text-decoration: none;
    }
    .brand-symbol {
      height: calc(var(--iz-sym) * 1.1230);
      width: auto;
      display: block;
      flex-shrink: 0;
    }
    .brand-rule {
      flex-shrink: 0;
      width: 1px;
      height: calc(var(--iz-sym) * 0.734);
      background: rgba(244, 241, 234, 0.32);
      margin-left: calc(var(--iz-sym) * 0.216);
      margin-right: calc(var(--iz-sym) * 0.243);
    }
    .brand-word {
      font-family: var(--font-mono);
      font-style: normal;
      font-weight: 700;
      font-size: calc(var(--iz-sym) * 0.2553);
      line-height: 1.327;
      letter-spacing: 0.205em;
      margin-right: -0.205em;      /* strip the trailing tracking on each line */
      text-transform: uppercase;
      color: var(--bone);
      white-space: nowrap;
    }

    .nav-links {
      display: flex; gap: 36px; align-items: center;
    }
    .nav-links a {
      font-family: var(--font-sans);
      font-size: 0.82rem;
      font-weight: 500;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: rgba(231, 221, 200, 0.65);
      transition: color .35s ease;
      position: relative;
    }
    .nav-links a:hover { color: var(--gold); }
    .nav-actions { display: flex; gap: 12px; align-items: center; flex-shrink: 0; }
    .nav-actions .btn { min-height: 44px; padding: 0 22px; font-size: 0.72rem; }
    .menu-toggle {
      display: none;
      font-size: 1.4rem;
      color: var(--bone);
      padding: 8px;
    }

    @media (max-width: 1100px) {
      .nav-links { display: none; }
      .menu-toggle { display: inline-flex; }
      .nav.open .nav-links {
        display: flex; flex-direction: column;
        position: absolute; top: 100%; left: 0; right: 0;
        background: rgba(7, 14, 28, 0.96);
        backdrop-filter: blur(20px);
        -webkit-backdrop-filter: blur(20px);
        padding: 30px 24px;
        border-bottom: 1px solid var(--hairline);
        gap: 22px;
      }
      .nav.open .nav-links a {
        padding: 8px 0;
        border-bottom: 1px solid var(--hairline);
      }
    }
    @media (max-width: 720px) {
      .nav-actions .btn-secondary { display: none; }
    }

    /* ══════════════════════════════════════════
       HERO
    ══════════════════════════════════════════ */
    .hero {
      padding: calc(var(--header-h) + 100px) 0 100px;
      /* The header is fixed and sits OVER the page, so it eats the top padding.
         200px top looked like 99px of air (200 - 101 header) while the bottom
         showed a full 140px — 42% more. Measuring the top FROM the header's
         bottom edge makes the two equal, and deriving it from --header-h keeps
         them equal if the logo is ever resized. */
      background: var(--ink);
      position: relative;
      overflow: hidden;
    }
    .hero::before {
      content: "";
      position: absolute;
      inset: 0;
      background: none;
      pointer-events: none;
    }
    .hero-geo {
      position: absolute;
      top: 0; right: 0; bottom: 0;
      width: 50%;
      pointer-events: none;
      opacity: 0.4;
      background-image:
        none;
      background-size: 80px 80px;
      mask-image: radial-gradient(ellipse at 70% 50%, black 30%, transparent 75%);
      -webkit-mask-image: radial-gradient(ellipse at 70% 50%, black 30%, transparent 75%);
    }
    .hero .container { position: relative; z-index: 2; }
.hero .hero-grid { position: relative; z-index: 2; }
    .hero-grid {
      display: grid;
      grid-template-columns: 1.15fr 0.85fr;
      gap: 90px;
      align-items: center;
    }
    .hero-kicker {
      display: inline-flex; align-items: center; gap: 14px;
      font-family: var(--font-mono);
      font-size: 0.72rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--gold);
      margin-bottom: 36px;
    }
    .hero-kicker::before {
      content: "";
      width: 36px; height: 1px;
      background: var(--gold);
    }
    .hero-kicker-dot {
      width: 5px; height: 5px;
      border-radius: 50%;
      background: var(--gold);
      box-shadow: 0 0 12px var(--gold);
      animation: pulse 2.4s ease-in-out infinite;
      display: none;
    }
    @keyframes pulse {
      0%, 100% { opacity: 0.4; }
      50% { opacity: 1; }
    }
    .hero h1 {
      color: var(--bone);
      margin-bottom: 32px;
    }
    .hero h1 strong {
      color: var(--gold);
      position: relative;
      display: inline-block;
    }
    .hero h1 strong::after {
      content: "";
      position: absolute;
      left: 0; right: 0; bottom: 0.04em;
      height: 1px;
      background: var(--gold);
      opacity: 0.4;
    }
    .hero-lead {
      font-size: 1.15rem;
      color: rgba(231, 221, 200, 0.72);
      max-width: 52ch;
      margin-bottom: 40px;
      line-height: 1.75;
      font-weight: 350;
    }
    .hero-points, .featured-health-check, .financial-health-check {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 14px;
      max-width: 540px;
      margin-bottom: 12px;
    }
    .hero-point {
      display: flex; align-items: flex-start; gap: 12px;
      padding: 14px 16px;
      background: transparent;
      border: 1px solid var(--hairline);
      font-family: var(--font-sans);
      font-size: 0.82rem;
      color: rgba(231, 221, 200, 0.84);
      transition: border-color .4s ease;
    }
    .hero-point:hover { border-color: var(--hairline-strong); }
    .hero-point .tick {
      flex: 0 0 16px; width: 16px; height: 16px;
      font-size: 0.62rem;
    }

    /* ── Hero card (lead form) ── */
    .hero-card {
      background: var(--ink-2);
      border: 1px solid var(--hairline);
      padding: 40px 36px;
      position: relative;
      box-shadow: var(--shadow-lg);
    }
    .hero-card::before {
      content: "";
      position: absolute;
      top: -1px; left: -1px; right: -1px;
      height: 2px;
      background: linear-gradient(90deg, transparent, var(--gold), transparent);
    }
    .hero-card h3 {
      font-family: var(--font-display);
      font-size: 1.4rem !important;
      font-weight: 350;
      color: var(--bone);
      letter-spacing: -0.015em;
      margin-bottom: 24px !important;
    }
    .hero-card .eyebrow { margin-bottom: 18px; }

    .form-grid {
      display: flex; flex-direction: column; gap: 14px;
      margin-bottom: 22px;
    }
    .form-grid input,
    .form-grid select,
    .form-field input,
    .form-field select,
    .form-field textarea {
      width: 100%;
      padding: 16px 18px;
      background: rgba(255,255,255,0.02);
      border: 1px solid var(--hairline);
      color: var(--bone);
      font-family: var(--font-sans);
      font-size: 0.95rem;
      font-weight: 400;
      border-radius: 0;
      transition: border-color .35s ease, background .35s ease;
      outline: none;
    }
    .form-grid input::placeholder,
    .form-field input::placeholder,
    .form-field textarea::placeholder { color: rgba(231,221,200,0.40); }
    .form-grid input:focus,
    .form-grid select:focus,
    .form-field input:focus,
    .form-field select:focus,
    .form-field textarea:focus {
      border-color: var(--gold);
      background: rgba(255,255,255,0.04);
    }
    .form-grid select option { background: var(--ink-2); color: var(--bone); }
    .form-grid .btn { width: 100%; margin-top: 4px; }

    .hero-stat {
      display: flex; justify-content: space-between; align-items: center;
      padding-top: 22px;
      border-top: 1px solid var(--hairline);
      gap: 20px;
    }
    .hero-score {
      font-family: var(--font-display);
      font-weight: 350;
      font-size: 2.6rem;
      color: var(--gold);
      line-height: 1;
      letter-spacing: -0.02em;
    }
    .form-note {
      font-size: 0.72rem;
      color: rgba(231,221,200,0.45);
      letter-spacing: 0.02em;
      line-height: 1.6;
    }

    @media (max-width: 1024px) {
      .hero { padding: 120px 0 70px; }
      .hero-grid { grid-template-columns: 1fr; gap: 64px; }
      .hero-geo { width: 100%; opacity: 0.25; }
    }
    @media (max-width: 600px) {
      .hero { padding: 100px 0 60px; }
      .hero-points, .featured-health-check, .financial-health-check { grid-template-columns: 1fr; }
      .hero-card { padding: 30px 24px; }
    }

    /* ══════════════════════════════════════════
       TRUST STRIP
    ══════════════════════════════════════════ */
    .trust-strip {
      background: var(--ink);
      padding: 36px 0;
      border-top: 1px solid var(--hairline);
      border-bottom: 1px solid var(--hairline);
      position: relative;
    }
    .trust-items {
      display: flex; align-items: center; justify-content: center;
      gap: 28px;
      flex-wrap: wrap;
    }
    .trust-item {
      display: inline-flex; align-items: center; gap: 12px;
      font-family: var(--font-mono);
      font-size: 0.72rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: rgba(231,221,200,0.65);
      font-weight: 500;
    }
    .trust-item-icon {
      color: var(--gold);
      font-size: 0.95rem;
      filter: saturate(0) brightness(1.6);
      opacity: 0.7;
    }
    .trust-divider {
      width: 1px; height: 18px;
      background: var(--hairline-strong);
      flex-shrink: 0;
    }
    @media (max-width: 900px) {
      .trust-divider { display: none; }
      .trust-items { justify-content: center; gap: 18px 28px; }
    }

/* ══════════════════════════════════════════
       WHO WE HELP — audience cards
    ══════════════════════════════════════════ */
    .audience-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 32px;
    }
    .audience-card {
      display: flex;
      flex-direction: column;
      background: var(--card-bg);
      border: 1px solid var(--card-border);
      padding: 44px 38px;
      transition: border-color .5s ease, transform .5s cubic-bezier(.22,.61,.36,1);
      position: relative;
    }
    .audience-card::before {
      content: "";
      position: absolute;
      top: 0; left: 0;
      width: 0; height: 1px;
      background: var(--gold);
      transition: width .8s cubic-bezier(.22,.61,.36,1);
    }
    .audience-card:hover { border-color: var(--hairline-strong); transform: translateY(-3px); }
    .audience-card:hover::before { width: 100%; }
    .audience-card .icon { margin-bottom: 18px; }
    .audience-card h3 {
      font-family: var(--font-display);
      font-size: 1.4rem;
      font-weight: 350;
      letter-spacing: -0.015em;
      margin-bottom: 14px;
      color: var(--on-surface-strong);
    }
    .audience-card p { font-size: 0.95rem; line-height: 1.7; opacity: 0.78; }
    @media (max-width: 1000px) { .audience-grid { grid-template-columns: 1fr; gap: 18px; } }

    /* ══════════════════════════════════════════
       INSIGHT BANNER (cost of waiting)
    ══════════════════════════════════════════ */
    .insight-banner {
      background: var(--ink-2);
      border: 1px solid var(--hairline);
      padding: 40px 44px;
      position: relative;
      overflow: hidden;
    }
    .insight-banner::before {
      content: "";
      position: absolute;
      inset: 0;
      background: none;
      pointer-events: none;
    }
    .insight-banner h2 { color: var(--bone); }
    .insight-banner .lead, .insight-banner p { color: rgba(231,221,200,0.72); }
    .insight-list {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 18px;
      margin-top: 32px;
    }
    .insight-list-item {
      padding: 22px;
      border: 1px solid var(--hairline);
      background: rgba(0,0,0,0.15);
      font-family: var(--font-sans);
      font-size: 0.95rem;
      color: rgba(231,221,200,0.84);
      line-height: 1.6;
    }
    .insight-stat-block {
      display: flex; flex-direction: column;
      padding: 26px;
      border: 1px solid var(--hairline);
      background: rgba(0,0,0,0.18);
      gap: 6px;
    }
    .insight-stat-block .stat-num,
    .insight-stat-block strong:first-child {
      font-family: var(--font-display);
      font-size: 2.2rem;
      font-weight: 350;
      color: var(--gold);
      letter-spacing: -0.02em;
    }
    .illustrative-impact-card {
      background: rgba(0,0,0,0.25);
      border: 1px solid var(--hairline-strong);
      padding: 30px;
      color: rgba(231,221,200,0.84);
    }
    .illustrative-impact-card strong { color: var(--gold); }
    .cost-waiting-copy-block { color: rgba(231,221,200,0.84); }
    .cost-waiting-copy-block strong { color: var(--gold); }

    @media (max-width: 900px) {
      .insight-banner { padding: 28px 20px; }
      .insight-list { grid-template-columns: 1fr; }
    }

    /* ══════════════════════════════════════════
       HOW IT WORKS — steps row
    ══════════════════════════════════════════ */
    .steps-row {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 32px;
      position: relative;
    }
    .steps-row::before {
      content: "";
      position: absolute;
      top: 32px; left: 5%; right: 5%;
      height: 1px;
      background: linear-gradient(90deg, transparent, var(--hairline-strong), transparent);
      z-index: 0;
    }
    .step {
      position: relative; z-index: 1;
      text-align: center;
      padding: 0 12px;
    }
    .step-num {
      width: 64px; height: 64px;
      margin: 0 auto 28px;
      border: 1px solid var(--gold);
      background: var(--surface);
      color: var(--gold);
      font-family: var(--font-display);
      
      font-weight: 400;
      font-size: 1.4rem;
      border-radius: 50%;
      display: inline-flex; align-items: center; justify-content: center;
      letter-spacing: -0.02em;
      position: relative;
    }
    .step-num::after {
      content: "";
      position: absolute;
      inset: 4px;
      border: 1px solid rgba(201,163,90,0.25);
      border-radius: 50%;
    }
    .step h3 {
      font-family: var(--font-display);
      font-size: 1.4rem;
      font-weight: 400;
      margin-bottom: 12px;
      letter-spacing: -0.015em;
    }
    .step p { font-size: 0.95rem; line-height: 1.7; opacity: 0.78; }
    @media (max-width: 900px) {
      .steps-row { grid-template-columns: 1fr 1fr; gap: 44px 24px; }
      .steps-row::before { display: none; }
    }
    @media (max-width: 540px) {
      .steps-row { grid-template-columns: 1fr; }
    }

    /* ══════════════════════════════════════════
       SCORECARD
    ══════════════════════════════════════════ */
    .scorecard-wrap {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 80px;
      align-items: center;
      padding: 64px 56px;
      background: var(--ink-2);
      border: 1px solid var(--hairline);
      position: relative;
    }
    .scorecard-wrap::before {
      content: "";
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 1px;
      background: linear-gradient(90deg, transparent, var(--gold), transparent);
    }
    .scorecard-left h2 { color: var(--bone); }
    .scorecard-left .lead, .scorecard-left p { color: rgba(231,221,200,0.72); }
    .scorecard-list {
      display: flex; flex-direction: column; gap: 14px;
      margin-top: 28px;
    }
    .scorecard-list-item {
      display: flex; gap: 16px; align-items: flex-start;
      padding: 16px 0;
      border-bottom: 1px solid var(--hairline);
      font-size: 0.95rem;
      color: rgba(231,221,200,0.84);
      line-height: 1.55;
    }
    .scorecard-list-item:last-child { border-bottom: none; }
    .scorecard-tick {
      flex: 0 0 22px; width: 22px; height: 22px;
      border-radius: 50%;
      border: 1px solid var(--gold);
      color: var(--gold);
      font-size: 0.62rem;
      display: inline-flex; align-items: center; justify-content: center;
      font-weight: 600;
    }
    .scorecard-right {
      background: rgba(0,0,0,0.25);
      border: 1px solid var(--hairline);
      padding: 38px 32px;
    }
    .scorecard-right .eyebrow { margin-bottom: 18px; }
    .scorecard-right h3 {
      font-family: var(--font-display) !important;
      font-size: 1.4rem !important;
      font-weight: 350 !important;
      color: var(--bone);
      margin-bottom: 22px !important;
    }
    @media (max-width: 900px) {
      .scorecard-wrap { grid-template-columns: 1fr; gap: 44px; padding: 44px 28px; }
    }

    /* ══════════════════════════════════════════
       SERVICES
    ══════════════════════════════════════════ */
    .services-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 16px;
    }
    .service-card {
      background: var(--card-bg);
      border: 1px solid var(--card-border);
      padding: 26px 22px 22px;
      transition: border-color .5s ease, transform .5s cubic-bezier(.22,.61,.36,1);
      display: flex; flex-direction: column;
      position: relative;
    }
    .service-card::after {
      content: "";
      position: absolute;
      left: 34px; right: 34px; top: 0;
      height: 1px;
      background: var(--gold);
      transform: scaleX(0);
      transform-origin: left;
      transition: transform .7s cubic-bezier(.22,.61,.36,1);
    }
    .service-card:hover {
      border-color: var(--hairline-strong);
      transform: translateY(-3px);
    }
    .service-card:hover::after { transform: scaleX(1); }
    .service-card .ico { margin-bottom: 14px; }
    .service-card h3 {
      font-family: var(--font-display);
      font-size: 1.15rem;
      font-weight: 400;
      letter-spacing: -0.01em;
      margin-bottom: 8px;
      color: var(--on-surface-strong);
      line-height: 1.2;
    }
    .service-card p {
      font-size: 0.82rem;
      line-height: 1.55;
      margin-bottom: 14px;
    }
    .service-tag {
      display: inline-block;
      font-family: var(--font-mono);
      font-size: 0.62rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--gold);
      margin-bottom: 12px;
      padding: 3px 0;
      border-top: 1px solid var(--hairline);
      border-bottom: 1px solid var(--hairline);
    }
    .service-mini-list {
      list-style: none;
      margin-top: auto;
      padding-top: 18px;
      border-top: 1px solid var(--hairline);
    }
    .service-mini-list li {
      font-size: 0.72rem;
      padding: 4px 0;
      position: relative;
      padding-left: 14px;
      line-height: 1.45;
    }
    .service-mini-list li::before {
      content: "—";
      position: absolute;
      left: 0;
      color: var(--gold);
    }
    .service-compliance-note {
      font-size: 0.72rem;
      color: var(--on-surface-muted);
      margin-top: 14px;
      line-height: 1.6;
      font-style: italic;
    }
    .featured, .featured-service {
      background: var(--ink-2) !important;
      border-color: var(--gold) !important;
      box-shadow: 0 1px 0 rgba(201,163,90,0.18), 0 30px 80px rgba(0,0,0,0.42) !important;
      position: relative;
    }
    .featured::before, .featured-service::before {
      content: "Featured";
      position: absolute;
      top: -11px; left: 18px;
      padding: 3px 10px;
      background: var(--gold);
      color: var(--ink);
      font-family: var(--font-mono);
      font-size: 0.62rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      font-weight: 600;
    }
    .featured h3, .featured-service h3 { color: var(--bone) !important; }
    .featured p, .featured-service p { color: rgba(231,221,200,0.92) !important; }
    .modelling-service {
      border-style: dashed !important;
      border-color: var(--hairline-strong) !important;
    }
    .modelling-disclaimer {
      grid-column: 1 / -1;
      padding: 18px 22px;
      background: rgba(201,163,90,0.06);
      border: 1px solid var(--hairline);
      color: var(--on-surface-muted);
      font-size: 0.82rem;
      line-height: 1.65;
      font-style: italic;
    }
    .ato-badge, .rg-badge {
      display: inline-flex; align-items: center; gap: 6px;
      padding: 3px 9px;
      background: transparent;
      border: 1px solid var(--gold);
      color: var(--gold);
      font-family: var(--font-mono);
      font-size: 0.62rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      font-weight: 500;
      margin-right: 6px;
    }
    @media (max-width: 1200px) { .services-grid { grid-template-columns: repeat(3, 1fr); gap: 20px; } }
    @media (max-width: 900px)  { .services-grid { grid-template-columns: repeat(2, 1fr); gap: 18px; } }
    @media (max-width: 560px)  { .services-grid { grid-template-columns: 1fr; } }

    /* ══════════════════════════════════════════
       TESTIMONIALS
    ══════════════════════════════════════════ */
    .testimonials-bg {
      background: var(--ink);
      position: relative;
    }
    .testimonials-bg::before {
      content: "";
      position: absolute; inset: 0;
      background:
        none;
      pointer-events: none;
    }
    .testimonials-bg .container { position: relative; z-index: 2; }
    .testimonials-bg h2 { color: var(--bone); }
    .testimonials-bg .lead { color: rgba(231,221,200,0.72); }
    .testimonials-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 28px;
    }
    .testimonial-card {
      background: var(--ink-2);
      border: 1px solid var(--hairline);
      padding: 40px 34px;
      position: relative;
      transition: border-color .5s ease, transform .5s ease;
    }
    .testimonial-card::before {
      content: "“";
      position: absolute;
      top: 14px; left: 28px;
      font-family: var(--font-display);
      font-size: 5rem;
      line-height: 1;
      color: var(--gold);
      opacity: 0.22;
      font-style: italic;
    }
    .testimonial-card:hover {
      border-color: var(--hairline-strong);
      transform: translateY(-3px);
    }
    .testimonial-stars {
      color: var(--gold);
      font-size: 0.82rem;
      letter-spacing: 3px;
      margin-bottom: 14px;
      opacity: 0.90;
    }
    .testimonial-quote {
      /* [20 Jul] was Cormorant Garamond italic w300 — a light condensed accent
         serif that's hard to read as body copy. Switched to Manrope (the body
         font) for readability; kept upright, bumped weight and opacity so the
         longer, more emotional quotes read cleanly. Gold .kw highlights unchanged. */
      font-family: var(--font-sans);
      font-size: 1.05rem;
      font-style: normal;
      font-weight: 400;
      color: rgba(244,237,224,0.82);
      line-height: 1.7;
      margin-bottom: 28px;
      letter-spacing: 0;
    }
    /* Keywords: same font, same italic — just brighter and bolder weight */
    .testimonial-quote .kw,
    .testimonial-quote strong {
      /* [20 Jul] body is now Manrope, so the highlight matches it (bold, upright)
         rather than reverting to Cormorant italic — the emphasis is weight + the
         brighter bone colour, consistent with the readable sans body. */
      font-family: var(--font-sans) !important;
      font-style: normal !important;
      font-weight: 600 !important;
      color: rgba(244,237,224,0.98) !important;
      letter-spacing: 0;
    }
    /* Opening quote mark */
    .testimonial-card::before {
      font-family: var(--font-accent);
      font-style: italic;
      font-weight: 300;
      color: var(--gold);
      opacity: 0.45;
    }
    .testimonial-author {
      display: flex; align-items: center; gap: 14px;
      padding-top: 22px;
      border-top: 1px solid var(--hairline);
    }
    .testimonial-avatar {
      width: 48px; height: 48px;
      border-radius: 50%;
      background: var(--ink-3);
      border: 1px solid var(--hairline-strong);
      display: inline-flex; align-items: center; justify-content: center;
      font-family: var(--font-display);
      font-style: italic;
      color: var(--gold);
      font-size: 1.15rem;
      flex-shrink: 0;
    }
    .testimonial-name {
      font-family: 'Manrope', system-ui, sans-serif;
      font-weight: 700;
      font-size: 0.95rem;
      color: #ffffff;
      letter-spacing: -0.01em;
      line-height: 1.2;
    }
    .testimonial-title {
      font-family: 'JetBrains Mono', ui-monospace, monospace;
      font-size: 0.62rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: rgba(231,221,200,0.48);
      margin-top: 4px;
      line-height: 1.4;
    }
    .testimonials-cta {
      text-align: center;
      margin-top: 56px;
    }
    @media (max-width: 1000px) { .testimonials-grid { grid-template-columns: 1fr; gap: 18px; } }

/* ══════════════════════════════════════════
       6-STAGE PRICING
    ══════════════════════════════════════════ */
    .stage-pricing-section {
      background: var(--ink) !important;
      position: relative;
      overflow: hidden;
    }
    .stage-pricing-section::before {
      content: "";
      position: absolute;
      inset: 0;
      background:
        none;
      pointer-events: none;
    }
    .stage-pricing-section .container { position: relative; z-index: 2; }
    .stage-pricing-section h2,
    .stage-pricing-section h3 { color: var(--bone); }
    .stage-pricing-section .lead,
    .stage-pricing-section p { color: rgba(231,221,200,0.72); }
    .pricing-model-hero {
      text-align: center;
      max-width: 820px;
      margin: 0 auto 50px;
      display: flex; flex-direction: column; align-items: center;
    }
    .pricing-model-hero h2 { margin-bottom: 22px; }
    .pricing-model-hero .lead { text-align: center; }
    .pricing-tabs-note {
      display: flex; gap: 0;
      justify-content: center;
      flex-wrap: wrap;
      margin: 0 auto 64px;
      max-width: 880px;
      border: 1px solid var(--hairline);
      border-radius: 999px;
      padding: 6px;
      background: rgba(0,0,0,0.25);
    }
    .pricing-tabs-note span {
      padding: 10px 22px;
      font-family: var(--font-mono);
      font-size: 0.72rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: rgba(231,221,200,0.65);
      border-radius: 999px;
      transition: color .35s ease, background .35s ease;
    }
    .pricing-tabs-note span:hover {
      color: var(--gold);
      background: rgba(201,163,90,0.06);
    }
    .stage-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 24px;
    }
    .stg {
      background: var(--ink-2);
      border: 1px solid var(--hairline);
      padding: 38px 32px;
      display: flex; flex-direction: column;
      transition: border-color .5s ease, transform .5s cubic-bezier(.22,.61,.36,1);
      position: relative;
      overflow: hidden;
    }
    .stg::before {
      content: "";
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 2px;
      background: var(--gold);
      transform: scaleX(0);
      transform-origin: left;
      transition: transform .9s cubic-bezier(.22,.61,.36,1);
    }
    .stg:hover {
      border-color: var(--hairline-strong);
      transform: translateY(-4px);
    }
    .stg:hover::before { transform: scaleX(1); }
    .stg-hdr {
      padding-bottom: 22px;
      margin-bottom: 22px;
      border-bottom: 1px solid var(--hairline);
    }
    .stg-num {
      font-family: var(--font-mono);
      font-size: 0.62rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--gold);
      display: block;
      margin-bottom: 16px;
    }
    .stg-name {
      font-family: var(--font-display);
      font-style: italic;
      font-size: 1.75rem;
      font-weight: 350;
      color: var(--bone);
      letter-spacing: -0.02em;
      line-height: 1.05;
      margin-bottom: 10px;
    }
    .stg-age {
      font-family: var(--font-sans);
      font-size: 0.82rem;
      color: rgba(231,221,200,0.55);
      line-height: 1.55;
      font-weight: 400;
    }
    .stg-body {
      flex-grow: 1;
      padding-bottom: 22px;
    }
    .stg-who {
      font-size: 0.95rem;
      color: rgba(231,221,200,0.82);
      line-height: 1.7;
    }
    .stg-who strong {
      color: var(--bone);
      font-weight: 600;
      display: block;
      margin-bottom: 4px;
      font-size: 0.82rem;
    }
    .stg-foot {
      padding: 18px 0;
      margin-bottom: 18px;
      border-top: 1px solid var(--hairline);
      border-bottom: 1px solid var(--hairline);
      display: flex; flex-direction: column; gap: 8px;
    }
    .stg-foot-row {
      display: flex; justify-content: space-between; align-items: center;
      gap: 12px;
    }
    .stg-foot-lbl {
      font-family: var(--font-mono);
      font-size: 0.62rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: rgba(231,221,200,0.45);
    }
    .stg-foot-val {
      font-family: var(--font-sans);
      font-size: 0.82rem;
      font-weight: 600;
      color: var(--gold);
    }
    .stg-cta {
      display: inline-flex; align-items: center; gap: 8px;
      font-family: var(--font-sans);
      font-size: 0.82rem;
      font-weight: 500;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: var(--gold);
      padding: 4px 0;
      transition: gap .35s ease;
    }
    .stg-cta:hover { gap: 14px; }
    .stg-trans {
      margin-top: 56px;
      padding: 44px 48px;
      text-align: center;
      background: rgba(0,0,0,0.25);
      border: 1px solid var(--hairline);
      border-radius: 0;
    }
    .stg-trans h3 {
      font-family: var(--font-display) !important;
      font-size: 1.75rem !important;
      font-weight: 350 !important;
      font-style: italic;
      color: var(--bone) !important;
      margin-bottom: 14px !important;
      letter-spacing: -0.015em;
    }
    .stg-trans p {
      max-width: 720px;
      margin: 0 auto;
      color: rgba(231,221,200,0.72);
    }
    .pricing-disclaimer {
      margin-top: 28px;
      font-size: 0.82rem;
      color: rgba(231,221,200,0.55);
      text-align: center;
      line-height: 1.65;
    }
    .pricing-disclaimer a {
      color: var(--gold) !important;
      border-bottom: 1px solid rgba(201,163,90,0.4);
      transition: border-color .35s ease;
    }
    .pricing-disclaimer a:hover { border-color: var(--gold); }
    @media (max-width: 1000px) { .stage-grid { grid-template-columns: 1fr 1fr; } }
    @media (max-width: 680px) { .stage-grid { grid-template-columns: 1fr; } }

    /* ══════════════════════════════════════════
       TAX DEDUCTIBILITY
    ══════════════════════════════════════════ */
    .taxded-section .container { position: relative; }
    .taxded-hero-card {
      background: var(--bone);
      border: 1px solid var(--hairline-strong);
      padding: 40px 44px;
      position: relative;
      margin-bottom: 32px;
      border-radius: 4px;
    }
    .taxded-hero-card::before {
      content: "";
      position: absolute;
      top: 0; left: 0; bottom: 0;
      width: 3px;
      background: var(--gold);
    }
    .taxded-hero-card h2,
    .taxded-hero-card h3 { color: var(--ink); }
    .taxded-hero-card h3 {
      font-size: 1.4rem;
      margin-bottom: 0;
      letter-spacing: -0.015em;
    }
    .taxded-hero-card p, .taxded-hero-card .lead { color: var(--on-surface); opacity: 0.85; }
    /* Eyebrow badge — clean gold pill, no awkward dashed border */
    .ato-badge {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      font-family: 'JetBrains Mono', ui-monospace, monospace;
      font-size: 0.62rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--gold-on-paper);
      padding: 5px 12px;
      background: rgba(201,163,90,0.10);
      border: 1px solid rgba(201,163,90,0.32);
      border-radius: 999px;
      margin-bottom: 14px;
      font-weight: 600;
    }
    .ato-badge .dot {
      width: 6px; height: 6px;
      border-radius: 50%;
      background: var(--gold);
      flex-shrink: 0;
    }
    /* Stats row — 3 distinct columns with gold separators */
    .taxded-hero-stats {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 0;
      margin-top: 28px;
      padding-top: 24px;
      border-top: 1px solid rgba(7,14,28,0.10);
    }
    .taxded-hero-stat {
      padding: 0 24px;
      border-right: 1px solid rgba(7,14,28,0.10);
      text-align: left;
      display: flex;
      flex-direction: column;
      gap: 6px;
    }
    .taxded-hero-stat:first-child { padding-left: 0; }
    .taxded-hero-stat:last-child { border-right: none; padding-right: 0; }
    .taxded-num {
      font-family: 'Fraunces', 'Instrument Serif', Georgia, serif;
      font-size: 2.2rem;
      font-weight: 350;
      color: var(--gold-on-paper);
      line-height: 1;
      letter-spacing: -0.02em;
      display: block;
      margin: 0;
    }
    .taxded-num-text {
      font-size: 1.4rem;
      font-style: italic;
      font-weight: 300;
    }
    .taxded-lbl {
      font-family: 'JetBrains Mono', ui-monospace, monospace;
      font-size: 0.62rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: rgba(7,14,28,0.78);
      font-weight: 600;
      display: block;
      line-height: 1.4;
      margin-top: 4px;
    }
    .taxded-sub {
      font-family: 'Manrope', system-ui, sans-serif;
      font-size: 0.72rem;
      color: rgba(7,14,28,0.55);
      line-height: 1.45;
      display: block;
    }
    .taxded-disclaimer {
      font-size: 0.82rem;
      color: var(--on-surface-muted);
      line-height: 1.65;
      font-style: italic;
      max-width: 100%;
      margin: 0 auto;
    }
    @media (max-width: 900px) {
      .taxded-hero-card { padding: 42px 28px; }
      .taxded-hero-stats { grid-template-columns: 1fr; gap: 28px; }
      .taxded-hero-stat { border-right: none; border-bottom: 1px solid var(--hairline); padding: 0 0 24px; }
      .taxded-hero-stat:last-child { border-bottom: none; }
    }

    /* ══════════════════════════════════════════
       VALUE OF ADVICE
    ══════════════════════════════════════════ */
    .voa-site-section { background: var(--cream) !important; }
    .voa-site-section h2, .voa-site-section h3 { color: var(--ink); }
    .voa-subsection-head {
      margin: 80px 0 36px;
      text-align: center;
    }
    .voa-subsection-head h3 {
      font-family: var(--font-display) !important;
      font-size: clamp(1.7rem, 2.6vw, 2.3rem) !important;
      font-weight: 350 !important;
      color: var(--ink) !important;
      margin-bottom: 14px !important;
      letter-spacing: -0.02em;
      
    }
    .voa-subsection-head p {
      color: var(--on-surface-muted) !important;
      font-size: 0.95rem !important;
      max-width: 780px;
      margin: 0 auto;
      line-height: 1.7 !important;
    }
    .voa-site-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 24px;
    }
    .voa-feature-card,
    .voa-principle,
    .voa-letter,
    .voa-seg {
      background: var(--bone);
      border: 1px solid var(--hairline);
      padding: 32px 28px;
      transition: border-color .5s ease, transform .5s ease;
      display: flex; flex-direction: column;
    }
    .voa-feature-card:hover,
    .voa-principle:hover,
    .voa-letter:hover,
    .voa-seg:hover {
      border-color: var(--hairline-strong);
      transform: translateY(-3px);
    }
    .voa-feature-card h4,
    .voa-principle h4,
    .voa-letter h4,
    .voa-seg h4 {
      font-family: var(--font-display);
      font-size: 1.15rem;
      font-weight: 350;
      color: var(--ink);
      margin-bottom: 12px;
      letter-spacing: -0.015em;
    }
    .voa-feature-card p,
    .voa-principle p,
    .voa-seg p { font-size: 0.95rem; line-height: 1.7; color: var(--on-surface); opacity: 0.85; }
    .voa-principles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
    .voa-abcet-cards { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; }
    .voa-abcet .voa-letter {
      padding: 28px 18px;
      text-align: center;
    }
    .voa-abcet .voa-letter strong:first-child,
    .voa-abcet .voa-letter > b {
      font-family: var(--font-display);
      font-style: italic;
      font-size: 2.2rem;
      font-weight: 350;
      color: var(--gold-on-paper);
      line-height: 1;
      display: block;
      margin-bottom: 12px;
    }
    .voa-client-segments { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
    .voa-seg { text-align: left; }
    .voa-seg-ico {
      width: 48px; height: 48px;
      border-radius: 50%;
      border: 1px solid var(--hairline-strong);
      color: var(--gold-on-paper);
      display: inline-flex; align-items: center; justify-content: center;
      font-size: 1.15rem;
      margin-bottom: 18px;
    }
    .voa-kpi-row {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 16px;
      margin: 36px 0;
    }
    .voa-kpi {
      background: var(--bone);
      border: 1px solid var(--hairline);
      padding: 26px 22px;
      text-align: left;
    }
    .voa-kpi .voa-stat,
    .voa-kpi b:first-child {
      font-family: var(--font-display);
      font-size: 2.2rem;
      font-weight: 350;
      color: var(--gold-on-paper);
      line-height: 1;
      letter-spacing: -0.02em;
      display: block;
      margin-bottom: 10px;
    }
    .voa-kpi .voa-stat-lbl,
    .voa-kpi span {
      font-family: var(--font-mono);
      font-size: 0.62rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--on-surface-muted);
      line-height: 1.5;
    }
    .voa-note-box {
      padding: 26px 30px;
      background: rgba(201,163,90,0.08);
      border-left: 2px solid var(--gold);
      color: var(--on-surface);
      font-size: 0.95rem;
      line-height: 1.7;
      margin: 28px 0;
      font-style: italic;
    }
    .voa-proof,
    .voa-segments-source,
    .voa-value-list {
      font-size: 0.82rem;
      color: var(--on-surface-muted);
      line-height: 1.65;
      max-width: 880px;
      margin: 24px auto;
      text-align: center;
      font-style: italic;
    }
    @media (max-width: 1000px) {
      .voa-site-grid,
      .voa-principles,
      .voa-client-segments { grid-template-columns: 1fr 1fr; }
      .voa-abcet-cards { grid-template-columns: repeat(2, 1fr); }
      .voa-kpi-row { grid-template-columns: 1fr 1fr; }
    }
    @media (max-width: 600px) {
      .voa-site-grid,
      .voa-principles,
      .voa-client-segments,
      .voa-abcet-cards { grid-template-columns: 1fr; }
      .voa-kpi-row { grid-template-columns: 1fr; }
    }

    /* ══════════════════════════════════════════
       INLINE NEWSLETTER
    ══════════════════════════════════════════ */
    .inline-newsletter-section {
      padding: 80px 0 !important;
      background: var(--cream) !important;
    }
    .inline-newsletter-card { --eyebrow: var(--gold-on-paper);
      max-width: 880px;
      margin: 0 auto;
      padding: 56px 56px;
      background: var(--bone);
      border: 1px solid var(--hairline-strong);
      text-align: center;
      position: relative;
    }
    .inline-newsletter-card::before,
    .inline-newsletter-card::after {
      content: "";
      position: absolute;
      width: 40px; height: 1px;
      background: var(--gold);
    }
    .inline-newsletter-card::before { top: 28px; left: 28px; }
    .inline-newsletter-card::after { bottom: 28px; right: 28px; }
    .inline-newsletter-card h3 {
      font-family: var(--font-display) !important;
      font-size: 1.75rem !important;
      font-weight: 350 !important;
      
      color: var(--ink);
      margin-bottom: 14px !important;
      letter-spacing: -0.015em;
    }
    .inline-newsletter-card p {
      color: var(--on-surface);
      opacity: 0.8;
      margin-bottom: 28px;
      max-width: 580px;
      margin-left: auto;
      margin-right: auto;
    }
    .inline-newsletter-form {
      display: flex; gap: 12px;
      max-width: 560px;
      margin: 0 auto;
      flex-wrap: wrap;
    }
    .inline-newsletter-form input {
      flex: 1; min-width: 240px;
      padding: 16px 20px;
      background: transparent;
      border: 1px solid var(--hairline-strong);
      color: var(--ink);
      font-family: var(--font-sans);
      font-size: 0.95rem;
      outline: none;
      transition: border-color .35s ease;
    }
    .inline-newsletter-form input::placeholder { color: rgba(7,14,28,0.4); }
    .inline-newsletter-form input:focus { border-color: var(--gold); }
    .inline-newsletter-form .btn { flex-shrink: 0; }
    .inline-news-fineprint {
      font-size: 0.72rem;
      color: var(--on-surface-muted);
      margin-top: 18px;
      padding-left: 10px;
      border-left: 2px solid rgba(201, 163, 90, .62);
      font-family: var(--font-sans);
      font-style: normal;
      font-weight: 400;
      line-height: 1.55;
    }
    @media (max-width: 700px) {
      .inline-newsletter-card { padding: 40px 28px; }
      .inline-newsletter-form .btn { width: 100%; }
    }

    /* ══════════════════════════════════════════
       RESOURCES
    ══════════════════════════════════════════ */
    .resources-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 24px;
    }
    .resource-card {
      background: var(--card-bg);
      border: 1px solid var(--card-border);
      padding: 36px 32px;
      transition: border-color .5s ease, transform .5s ease;
      display: flex; flex-direction: column;
      position: relative;
    }
    .resource-card:hover {
      border-color: var(--hairline-strong);
      transform: translateY(-3px);
    }
    .resource-card .ico { margin-bottom: 22px; }
    .resource-card h3 {
      font-family: var(--font-display);
      font-size: 1.4rem;
      font-weight: 350;
      letter-spacing: -0.015em;
      margin-bottom: 12px;
      color: var(--on-surface-strong);
    }
    .resource-card p {
      font-size: 0.95rem;
      line-height: 1.7;
      opacity: 0.78;
      margin-bottom: 18px;
      flex-grow: 1;
    }
    .resource-link {
      display: inline-flex; align-items: center; gap: 10px;
      font-family: var(--font-sans);
      font-size: 0.82rem;
      font-weight: 500;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: var(--gold);
      padding-top: 14px;
      border-top: 1px solid var(--hairline);
      transition: gap .35s ease;
    }
    .resource-link:hover { gap: 16px; }
    .lock-badge, .locked-link {
      display: inline-flex; align-items: center; gap: 6px;
      padding: 4px 10px;
      background: transparent;
      border: 1px solid var(--hairline-strong);
      color: var(--gold);
      font-family: var(--font-mono);
      font-size: 0.62rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      margin-bottom: 14px;
      align-self: flex-start;
    }
    @media (max-width: 1000px) { .resources-grid { grid-template-columns: 1fr 1fr; } }
    @media (max-width: 680px)  { .resources-grid { grid-template-columns: 1fr; } }

    /* ══════════════════════════════════════════
       MEMBER TOOLS
    ══════════════════════════════════════════ */
    .member-intro {
      max-width: 760px;
      margin-bottom: 48px;
    }
    .member-intro p { color: var(--on-surface); opacity: 0.85; }
    .member-tools-wrap { position: relative; }
    .tools-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 24px;
    }
    .tool-card {
      background: var(--bone);
      border: 1px solid var(--hairline);
      padding: 34px 30px;
      transition: border-color .5s ease, transform .5s ease;
      display: flex; flex-direction: column;
    }
    .tool-card:hover {
      border-color: var(--gold);
      transform: translateY(-3px);
    }
    .tool-icon {
      width: 52px; height: 52px;
      border-radius: 50%;
      border: 1px solid var(--hairline-strong);
      color: var(--gold-on-paper);
      background: transparent;
      display: inline-flex; align-items: center; justify-content: center;
      font-size: 1.15rem;
      margin-bottom: 22px;
    }
    .tool-card h3 {
      font-family: var(--font-display);
      font-size: 1.15rem;
      font-weight: 350;
      color: var(--ink);
      margin-bottom: 10px;
      letter-spacing: -0.015em;
    }
    .tool-card p {
      font-size: 0.95rem;
      line-height: 1.7;
      opacity: 0.82;
      margin-bottom: 16px;
      flex-grow: 1;
    }
    @media (max-width: 1000px) { .tools-grid { grid-template-columns: 1fr 1fr; } }
    @media (max-width: 680px)  { .tools-grid { grid-template-columns: 1fr; } }

    /* ══════════════════════════════════════════
       BLOG
    ══════════════════════════════════════════ */
    .blog-section { background: var(--cream); }
    .blog-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 32px;
    }
    .blog-card {
      background: var(--bone);
      border: 1px solid var(--hairline);
      overflow: hidden;
      transition: border-color .5s ease, transform .5s cubic-bezier(.22,.61,.36,1);
      display: flex; flex-direction: column;
    }
    .blog-card:hover {
      border-color: var(--hairline-strong);
      transform: translateY(-4px);
    }
    .blog-thumb {
      aspect-ratio: 16/10;
      background:
        var(--ink-2);
      position: relative;
      overflow: hidden;
      display: flex; align-items: center; justify-content: center;
    }
    .blog-thumb::before {
      content: "";
      position: absolute;
      inset: 0;
      background:
        none;
    }
    .blog-thumb::after {
      content: "";
      position: absolute;
      inset: 14px;
      border: 1px solid var(--gold);
      opacity: 0.35;
    }
    .blog-body { padding: 30px 28px; flex-grow: 1; display: flex; flex-direction: column; }
    .blog-cat {
      font-family: var(--font-mono);
      font-size: 0.62rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--gold-on-paper);
      margin-bottom: 14px;
    }
    .blog-title {
      font-family: var(--font-display);
      font-size: 1.4rem;
      font-weight: 350;
      color: var(--ink);
      line-height: 1.2;
      margin-bottom: 14px;
      letter-spacing: -0.018em;
    }
    .blog-excerpt {
      font-size: 0.95rem;
      line-height: 1.7;
      color: var(--on-surface);
      opacity: 0.82;
      margin-bottom: 18px;
      flex-grow: 1;
    }
    .blog-meta {
      font-family: var(--font-mono);
      font-size: 0.62rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--on-surface-muted);
      margin-bottom: 18px;
    }
    .blog-read-more {
      display: inline-flex; align-items: center; gap: 10px;
      font-family: var(--font-sans);
      font-size: 0.82rem;
      font-weight: 500;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: var(--gold-on-paper);
      padding-top: 14px;
      border-top: 1px solid var(--hairline);
      transition: gap .35s ease;
    }
    .blog-read-more:hover { gap: 16px; }
    @media (max-width: 1000px) { .blog-grid { grid-template-columns: 1fr 1fr; } }
    @media (max-width: 680px)  { .blog-grid { grid-template-columns: 1fr; } }

/* ══════════════════════════════════════════
       CASE STUDIES
    ══════════════════════════════════════════ */
    .case-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 32px;
    }
    .case-card {
      background: var(--card-bg);
      border: 1px solid var(--card-border);
      padding: 44px 40px;
      transition: border-color .5s ease, transform .5s ease;
      position: relative;
    }
    .case-card::before {
      content: "";
      position: absolute;
      top: 0; left: 0; bottom: 0;
      width: 2px;
      background: var(--gold);
      transform: scaleY(0);
      transform-origin: top;
      transition: transform .7s cubic-bezier(.22,.61,.36,1);
    }
    .case-card:hover {
      border-color: var(--hairline-strong);
      transform: translateY(-3px);
    }
    .case-card:hover::before { transform: scaleY(1); }
    .case-badge {
      display: inline-block;
      padding: 4px 12px;
      background: transparent;
      border: 1px solid var(--gold);
      color: var(--gold);
      font-family: var(--font-mono);
      font-size: 0.62rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      margin-bottom: 18px;
    }
    .case-card h3 {
      font-family: var(--font-display);
      font-size: 1.75rem;
      font-weight: 350;
      color: var(--on-surface-strong);
      margin-bottom: 16px;
      letter-spacing: -0.018em;
    }
    .case-card > p { color: var(--on-surface); opacity: 0.85; margin-bottom: 22px; line-height: 1.7; }
    .case-list {
      list-style: none;
      padding-top: 22px;
      border-top: 1px solid var(--hairline);
    }
    .case-item {
      padding: 12px 0;
      display: flex; gap: 14px; align-items: flex-start;
      font-size: 0.95rem;
      color: var(--on-surface);
      opacity: 0.88;
      line-height: 1.6;
      border-bottom: 1px solid var(--hairline);
    }
    .case-item:last-child { border-bottom: none; }
    .case-item::before {
      content: "→";
      color: var(--gold);
      flex-shrink: 0;
      font-weight: 600;
    }
    @media (max-width: 900px) { .case-grid { grid-template-columns: 1fr; } }

    /* ══════════════════════════════════════════
       WHY CHOOSE US
    ══════════════════════════════════════════ */
    .why-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 32px;
    }
    .why-card {
      padding: 38px 32px;
      background: var(--card-bg);
      border: 1px solid var(--card-border);
      transition: border-color .5s ease, transform .5s ease;
      position: relative;
    }
    .why-card:hover {
      border-color: var(--hairline-strong);
      transform: translateY(-3px);
    }
    .why-num {
      font-family: var(--font-display);
      font-style: italic;
      font-size: 3.4rem;
      font-weight: 350;
      color: var(--gold);
      line-height: 1;
      margin-bottom: 22px;
      letter-spacing: -0.04em;
      display: block;
    }
    .why-card h3 {
      font-family: var(--font-display);
      font-size: 1.4rem;
      font-weight: 350;
      letter-spacing: -0.015em;
      margin-bottom: 12px;
      color: var(--on-surface-strong);
    }
    .why-card p { font-size: 0.95rem; line-height: 1.7; opacity: 0.82; }
    @media (max-width: 1000px) { .why-grid { grid-template-columns: 1fr 1fr; } }
    @media (max-width: 680px)  { .why-grid { grid-template-columns: 1fr; } }

    /* ══════════════════════════════════════════
       ABOUT
    ══════════════════════════════════════════ */
    .about-grid {
      display: grid;
      grid-template-columns: 1.2fr 1fr;
      gap: 60px;
      align-items: flex-start;
    }
    .about-intro-card {
      padding: 44px 40px;
      background: var(--card-bg);
      border: 1px solid var(--card-border);
    }
    .about-intro-card h3 {
      font-family: var(--font-display);
      font-size: 1.4rem;
      font-weight: 350;
      margin-bottom: 18px;
      color: var(--on-surface-strong);
      letter-spacing: -0.015em;
    }
    .about-intro-card p {
      color: var(--on-surface);
      opacity: 0.85;
      line-height: 1.75;
      margin-bottom: 14px;
    }
    .about-stat-row {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 0;
      margin-top: 32px;
      padding-top: 28px;
      border-top: 1px solid var(--hairline);
    }
    .about-stat {
      padding: 0 20px;
      border-right: 1px solid var(--hairline);
    }
    .about-stat:first-child { padding-left: 0; }
    .about-stat:last-child { border-right: none; }
    .stat-card {
      padding: 32px 28px;
      background: var(--card-bg);
      border: 1px solid var(--card-border);
      transition: border-color .5s ease;
    }
    .stat-card:hover { border-color: var(--hairline-strong); }
    .stat-row {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 18px;
      margin: 28px 0;
    }
    .stat-num,
    .about-stat .stat-num,
    .stat-card .stat-num {
      font-family: var(--font-display);
      
      font-size: 2.2rem;
      font-weight: 350;
      color: var(--gold);
      line-height: 1;
      letter-spacing: -0.02em;
      display: block;
      margin-bottom: 8px;
    }
    .stat-label {
      font-family: var(--font-mono);
      font-size: 0.72rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--on-surface-muted);
      line-height: 1.5;
      display: block;
    }
    .founder-grid {
      display: grid;
      grid-template-columns: 1fr;
      gap: 24px;
    }
    .founder-card {
      padding: 36px 32px;
      background: var(--card-bg);
      border: 1px solid var(--card-border);
      transition: border-color .5s ease;
    }
    .founder-card:hover { border-color: var(--hairline-strong); }
    .founder-head {
      display: flex; gap: 22px; align-items: center;
      padding-bottom: 22px;
      margin-bottom: 22px;
      border-bottom: 1px solid var(--hairline);
    }
    .founder-avatar {
      width: 64px; height: 64px;
      border-radius: 50%;
      background: var(--ink-3);
      border: 1px solid var(--gold);
      display: inline-flex; align-items: center; justify-content: center;
      font-family: var(--font-display);
      font-style: italic;
      font-size: 1.4rem;
      color: var(--gold);
      flex-shrink: 0;
    }
    .founder-card h3 {
      font-family: var(--font-display);
      font-size: 1.4rem;
      font-weight: 350;
      color: var(--on-surface-strong);
      margin-bottom: 4px;
      letter-spacing: -0.015em;
    }
    .founder-role {
      font-family: var(--font-mono);
      font-size: 0.72rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--gold);
    }
    .founder-bio {
      color: var(--on-surface);
      opacity: 0.82;
      line-height: 1.7;
      margin-bottom: 18px;
    }
    .founder-tags {
      display: flex; flex-wrap: wrap; gap: 8px;
    }
    .founder-tag {
      padding: 5px 12px;
      background: transparent;
      border: 1px solid var(--hairline-strong);
      color: var(--gold);
      font-family: var(--font-mono);
      font-size: 0.62rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
    }
    .credential-strip {
      display: flex; flex-wrap: wrap; gap: 14px;
      margin-top: 24px;
      padding-top: 24px;
      border-top: 1px solid var(--hairline);
    }
    .credential {
      padding: 6px 14px;
      background: rgba(201,163,90,0.06);
      border: 1px solid var(--hairline);
      font-family: var(--font-mono);
      font-size: 0.62rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--gold);
    }
    .money-pills {
      display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px;
    }
    .money-pill {
      padding: 5px 12px;
      background: transparent;
      border: 1px solid var(--hairline-strong);
      color: var(--on-surface);
      font-family: var(--font-mono);
      font-size: 0.62rem;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      opacity: 0.82;
    }
    .jump {
      display: inline-flex; align-items: center; gap: 8px;
      font-family: var(--font-sans);
      font-size: 0.82rem;
      font-weight: 500;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: var(--gold);
      transition: gap .35s ease;
      padding: 8px 0;
    }
    .jump:hover { gap: 14px; }
    .jump-lbl {
      font-family: var(--font-mono);
      font-size: 0.72rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--on-surface-muted);
    }
    @media (max-width: 900px) {
      .about-grid { grid-template-columns: 1fr; gap: 32px; }
      .about-stat-row { grid-template-columns: 1fr; }
      .about-stat { padding: 18px 0; border-right: none; border-bottom: 1px solid var(--hairline); }
      .about-stat:last-child { border-bottom: none; }
      .stat-row { grid-template-columns: 1fr 1fr; }
    }

    /* ══════════════════════════════════════════
       FAQ
    ══════════════════════════════════════════ */
    .faq-section { background: var(--cream); }
    .faq-grid {
      display: grid;
      grid-template-columns: 0.85fr 1.15fr;
      gap: 80px;
      align-items: start;
    }
    .faq-list {
      display: flex; flex-direction: column;
      border-top: 1px solid var(--hairline-strong);
    }
    .faq-item {
      border-bottom: 1px solid var(--hairline-strong);
      transition: background .35s ease;
    }
    .faq-item.active,
    .faq-item.open { background: var(--bone); }
    .faq-q {
      width: 100%;
      padding: 26px 0;
      display: flex; justify-content: space-between; align-items: center;
      gap: 24px;
      text-align: left;
      font-family: var(--font-display);
      font-size: 1.15rem;
      font-weight: 350;
      color: var(--ink);
      letter-spacing: -0.015em;
      transition: color .35s ease;
      line-height: 1.4;
    }
    .faq-item.active .faq-q,
    .faq-item.open .faq-q { color: var(--gold-on-paper); padding-left: 22px; padding-right: 22px; }
    .faq-q:hover { color: var(--gold-on-paper); }
    .faq-icon {
      flex-shrink: 0;
      width: 28px; height: 28px;
      border: 1px solid var(--hairline-strong);
      border-radius: 50%;
      display: inline-flex; align-items: center; justify-content: center;
      color: var(--gold-on-paper);
      font-size: 0.95rem;
      font-weight: 400;
      transition: transform .4s ease, border-color .35s ease, background .35s ease;
    }
    .faq-item.active .faq-icon,
    .faq-item.open .faq-icon {
      transform: rotate(45deg);
      background: var(--gold);
      color: var(--bone);
      border-color: var(--gold);
    }
    .faq-a {
      overflow: hidden;
      max-height: 0;
      transition: max-height .55s ease;
    }
    .faq-item.active .faq-a,
    .faq-item.open .faq-a { max-height: 600px; }
    .faq-a-inner {
      padding: 0 22px 28px;
      font-size: 0.95rem;
      color: var(--on-surface);
      opacity: 0.85;
      line-height: 1.75;
    }
    @media (max-width: 900px) {
      .faq-grid { grid-template-columns: 1fr; gap: 40px; }
    }

    /* ══════════════════════════════════════════
       CONTACT
    ══════════════════════════════════════════ */
    .contact-section { background: var(--cream); }
    .contact-grid {
      display: grid;
      grid-template-columns: 0.9fr 1.1fr;
      gap: 60px;
      align-items: start;
    }
    .contact-info {
      display: flex; flex-direction: column; gap: 24px;
    }
    .contact-detail {
      display: flex; gap: 18px; align-items: flex-start;
      padding: 22px 0;
      border-bottom: 1px solid var(--hairline);
    }
    .contact-detail:last-child { border-bottom: none; }
    .contact-detail-icon {
      width: 44px; height: 44px;
      border: 1px solid var(--hairline-strong);
      border-radius: 50%;
      display: inline-flex; align-items: center; justify-content: center;
      color: var(--gold-on-paper);
      flex-shrink: 0;
      font-size: 0.95rem;
    }
    .contact-detail-label {
      font-family: var(--font-mono);
      font-size: 0.62rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--on-surface-muted);
      margin-bottom: 4px;
    }
    .contact-detail-value {
      font-family: var(--font-display);
      font-size: 1.15rem;
      font-weight: 400;
      color: var(--ink);
      letter-spacing: -0.01em;
    }
    .contact-form-card {
      background: var(--bone);
      border: 1px solid var(--hairline-strong);
      padding: 44px 40px;
      position: relative;
      align-self: start;
    }
    .contact-form-card::before {
      content: "";
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 2px;
      background: linear-gradient(90deg, var(--gold), transparent);
    }
    .form-field {
      margin-bottom: 18px;
      display: flex; flex-direction: column; gap: 8px;
    }
    .form-field label {
      font-family: var(--font-mono);
      font-size: 0.62rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--on-surface-muted);
    }
    .contact-form-card .form-field input,
    .contact-form-card .form-field select,
    .contact-form-card .form-field textarea {
      background: transparent;
      color: var(--ink);
      border: 1px solid var(--hairline-strong);
    }
    .contact-form-card .form-field input::placeholder,
    .contact-form-card .form-field textarea::placeholder { color: rgba(7,14,28,0.4); }
    .contact-form-card .form-field input:focus,
    .contact-form-card .form-field select:focus,
    .contact-form-card .form-field textarea:focus { border-color: var(--gold); background: rgba(201,163,90,0.04); }
    .contact-phone-row {
      display: grid;
      grid-template-columns: minmax(150px, 0.75fr) minmax(0, 1.25fr);
      gap: 10px;
    }
    @media (max-width: 560px) {
      .contact-phone-row { grid-template-columns: 1fr; }
    }
    .form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
    /* ══════════════════════════════════════════════════════════════
       POST-SEND CONFIRMATION — the site's language, not a generic
       success box. Bone ground, gold rule, mono eyebrow, Fraunces
       heading. The CTA is the real .btn-primary pill, because a
       ghost pill after a success reads as an afterthought.
       ══════════════════════════════════════════════════════════════ */
    .contact-success {
      padding: 40px 32px 36px;
      text-align: left;
      background: transparent;
      border: 1px solid rgba(7,14,28,0.10);
      border-top: 2px solid var(--gold);
      border-radius: var(--radius);
    }
    /* Status left, logistics right, one baseline. */
    .cs-head {
      display: flex; align-items: center; justify-content: space-between;
      gap: 18px; flex-wrap: wrap;
      margin-bottom: 16px;
    }
    .cs-eyebrow {
      display: inline-flex; align-items: center; gap: 9px;
      font-family: var(--font-mono);
      font-size: 0.62rem; font-weight: 500;
      letter-spacing: 0.18em; text-transform: uppercase;
      color: var(--emerald);
    }

    /* ── "Message sent" ──────────────────────────────────────────────────
       The reference (iconscout "Message Sent", FLOWRAME) is a premium $5
       asset, so this is the same idea built from scratch — its own keywords
       give the sequence away: envelope → send → done.
         flap folds shut → envelope lifts away → tick draws → rest → repeat.
       6s cycle: the confirmation should breathe, not flash. If you buy the
       asset, send me the Lottie JSON and I'll wire the real thing.
       ── */
    .cs-sent { width: 14px; height: 14px; flex: none; overflow: visible;
               stroke: currentColor; fill: none;
               stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
    .cs-env  { animation: csEnv 6s ease-in-out infinite; transform-origin: 50% 50%; }
    .cs-env-flap { stroke-dasharray: 22; stroke-dashoffset: 22;
                   animation: csFlap 6s ease-in-out infinite; }
    .cs-tick { stroke-dasharray: 24; stroke-dashoffset: 24; opacity: 0;
               animation: csTick 6s cubic-bezier(.22,.61,.36,1) infinite; }
    @keyframes csFlap {                      /* the flap folds shut */
      0%       { stroke-dashoffset: 22; }
      12%, 26% { stroke-dashoffset: 0; }
      34%, 100%{ stroke-dashoffset: 0; }
    }
    @keyframes csEnv {                       /* then it lifts away */
      0%, 26%  { transform: translate(0,0) scale(1); opacity: 1; }
      40%      { transform: translate(3px,-4px) scale(.7); opacity: 0; }
      88%      { transform: translate(3px,-4px) scale(.7); opacity: 0; }
      98%,100% { transform: translate(0,0) scale(1); opacity: 1; }
    }
    @keyframes csTick {                      /* and the tick confirms it */
      0%, 38%  { stroke-dashoffset: 24; opacity: 0; }
      40%      { stroke-dashoffset: 24; opacity: 1; }
      56%, 86% { stroke-dashoffset: 0;  opacity: 1; }
      94%,100% { stroke-dashoffset: 0;  opacity: 0; }
    }
    @media (prefers-reduced-motion: reduce) {
      .cs-env, .cs-env-flap, .cs-tick { animation: none !important; }
      .cs-env { opacity: 0; }
      .cs-tick { stroke-dashoffset: 0; opacity: 1; }
    }
    .cs-h {
      font-family: var(--font-display);
      font-weight: 350;
      font-variation-settings: "opsz" 144, "SOFT" 30;
      font-size: clamp(1.6rem, 2.8vw, 2.1rem);
      line-height: 1.06; letter-spacing: -0.022em;
      color: var(--ink); margin: 0 0 10px;
    }
    .cs-meta {
      font-family: var(--font-mono);
      font-size: 0.58rem; letter-spacing: 0.14em; text-transform: uppercase;
      color: rgba(7,14,28,0.5); margin: 0; text-align: right;
    }
    @media (max-width: 520px) { .cs-meta { text-align: left; } }

    .contact-suggest {
      margin-top: 30px; padding-top: 26px;
      border-top: 1px solid rgba(7,14,28,0.10);
      text-align: left;
    }
    .cs-sug-eyebrow {
      font-family: var(--font-mono);
      font-size: 0.62rem; font-weight: 500;
      letter-spacing: 0.18em; text-transform: uppercase;
      color: var(--gold-on-paper);
      display: flex; align-items: center; gap: 10px;
      margin-bottom: 12px;
    }
    .cs-sug-eyebrow::before { content: ''; width: 22px; height: 1px; background: var(--gold); }
    .contact-suggest-p {
      font-size: 0.92rem; line-height: 1.6;
      color: var(--on-surface); margin-bottom: 22px; max-width: 46ch;
    }
    .contact-suggest-btn {
      width: 100%; min-height: 56px;
      gap: 12px;
    }
    /* [17 Jul] .cs-arrow retired — that button now carries the approved pulse
       icon (.iz-cta-pulse) with the shared idle motion. Keeping this class on
       it meant two animations running on one icon. */
    .cs-sug-note {
      margin-top: 14px;
      font-family: var(--font-mono);
      /* [17 Jul] 0.58rem → 0.72rem. It was set as fineprint, but it isn't
         fineprint — it's the ladder, and it's doing the selling. 0.72rem is the
         same size as the pill above it, so the two read as a pair. */
      font-size: 0.72rem; letter-spacing: 0.12em; text-transform: uppercase;
      color: rgba(7,14,28,0.55);
      line-height: 1.85;
      /* [17 Jul] The ladder is ~100 characters of tracked-out mono, so it wraps
         at this width. Left alone it broke 98% / 27% — "0 cost, yours to keep"
         stranded on its own line, which is the weakest beat in the worst place.
         balance splits it evenly instead. Don't shorten the copy to fix this. */
      text-wrap: balance;
    }
    /* Gold Fraunces numerals sit on the mono baseline without changing line height. */
    .cs-sug-note b {
      font-family: var(--font-display);
      font-weight: 400;
      font-variation-settings: "opsz" 144;
      font-size: 1.5em; line-height: 0;
      color: var(--gold-on-paper);
      margin-right: 1px;
    }
    @media (prefers-reduced-motion: reduce) {
      .cs-tick { animation: none; stroke-dashoffset: 0; }
    }

    /* .success-icon removed — the 64px emerald ring is now a 13px mono tick. */
    @media (min-width: 901px) {
      .contact-section > .container {
        display: grid;
        grid-template-columns: 0.9fr 1.1fr;
        column-gap: 60px;
        align-items: start;
      }
      .contact-section .section-head {
        grid-column: 1;
        grid-row: 1;
      }
      .contact-section .contact-grid {
        display: contents;
      }
      .contact-section .contact-info {
        grid-column: 1;
        grid-row: 2;
      }
      .contact-section .contact-form-card {
        grid-column: 2;
        grid-row: 1 / span 2;
        margin-top: 48px;
      }
    }
    @media (max-width: 900px) {
      .contact-grid { grid-template-columns: 1fr; gap: 40px; }
      .form-row { grid-template-columns: 1fr; }
      .contact-form-card { order: -1; padding: 32px 24px; }
    }

    /* ══════════════════════════════════════════
       FINAL CTA
    ══════════════════════════════════════════ */
    .final-cta {
      padding: 100px 0;
      background: var(--ink);
      text-align: center;
      position: relative;
      overflow: hidden;
    }
    .final-cta::before {
      content: "";
      position: absolute;
      inset: 0;
      background:
        none;
      pointer-events: none;
    }
    .final-cta .container { position: relative; z-index: 2; }
    .final-cta h2 {
      color: var(--bone);
      font-family: var(--font-italic);
      font-style: italic;
      font-size: clamp(2.6rem, 5vw, 4.4rem);
      margin-bottom: 26px;
      line-height: 1.05;
    }
    .final-cta .lead, .final-cta p {
      color: rgba(231,221,200,0.72);
      max-width: 600px;
      margin: 0 auto 36px;
      font-size: 1.15rem;
      line-height: 1.75;
    }
    .final-cta .btn-row { justify-content: center; }
    .tiny-note {
      font-size: 0.72rem;
      color: rgba(231,221,200,0.45);
      margin-top: 22px;
      letter-spacing: 0.04em;
      font-style: italic;
    }
    @media (max-width: 768px) { .final-cta { padding: 60px 0 20px; } }

    /* ══════════════════════════════════════════
       MODALS
    ══════════════════════════════════════════ */
    .auth-modal, .legal-modal {
      position: fixed; inset: 0; z-index: 1000;
      display: none;
      align-items: center; justify-content: center;
      background: rgba(7,14,28,0.85);
      backdrop-filter: blur(8px);
      -webkit-backdrop-filter: blur(8px);
      padding: 24px;
    }
    .auth-modal.on, .legal-modal.on,
    .auth-modal.open, .legal-modal.open { display: flex; }
    .auth-card, .legal-card {
      background: var(--ink-2);
      border: 1px solid var(--hairline-strong);
      padding: 48px 44px;
      max-width: 520px;
      width: 100%;
      position: relative;
      color: var(--on-surface);
      max-height: 90vh;
      overflow-y: auto;
    }
    .auth-card::before, .legal-card::before {
      content: "";
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 2px;
      background: linear-gradient(90deg, transparent, var(--gold), transparent);
    }
    .legal-card { max-width: 760px; }
    .auth-close, .legal-close {
      position: absolute;
      top: 18px; right: 18px;
      width: 36px; height: 36px;
      border: 1px solid var(--hairline);
      border-radius: 50%;
      color: var(--bone);
      font-size: 1.15rem;
      display: inline-flex; align-items: center; justify-content: center;
      transition: border-color .35s ease, color .35s ease;
    }
    .auth-close:hover, .legal-close:hover {
      border-color: var(--gold); color: var(--gold);
    }
    .auth-card h3, .legal-card h3 {
      font-family: var(--font-display);
      font-size: 1.75rem;
      font-weight: 350;
      color: var(--bone);
      margin-bottom: 8px;
      letter-spacing: -0.015em;
    }
    .auth-chip {
      display: inline-block;
      padding: 4px 12px;
      border: 1px solid var(--hairline);
      color: var(--gold);
      font-family: var(--font-mono);
      font-size: 0.62rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      margin-bottom: 14px;
    }
    .auth-switch, .auth-foot {
      margin-top: 22px;
      padding-top: 22px;
      border-top: 1px solid var(--hairline);
      font-size: 0.82rem;
      color: rgba(231,221,200,0.65);
      text-align: center;
    }
    .auth-switch a, .auth-foot a { color: var(--gold); border-bottom: 1px solid rgba(201,163,90,0.4); }
    .legal-tabs {
      display: flex; gap: 0;
      border-bottom: 1px solid var(--hairline);
      margin-bottom: 22px;
      overflow-x: auto;
    }
    .legal-tab {
      padding: 14px 22px;
      background: transparent;
      border: none;
      border-bottom: 2px solid transparent;
      color: rgba(231,221,200,0.55);
      font-family: var(--font-mono);
      font-size: 0.72rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      cursor: pointer;
      transition: color .35s ease, border-color .35s ease;
      white-space: nowrap;
    }
    .legal-tab.active {
      color: var(--gold);
      border-bottom-color: var(--gold);
    }
    .legal-pane {
      display: none;
      font-size: 0.95rem;
      line-height: 1.75;
      color: var(--on-surface);
      opacity: 0.88;
    }
    .legal-pane.active { display: block; }
    .legal-pane h4 {
      font-family: var(--font-display);
      font-size: 1.15rem;
      font-weight: 350;
      color: var(--bone);
      margin: 18px 0 10px;
    }
    .legal-pane p { margin-bottom: 12px; }

    /* ══════════════════════════════════════════
       FOOTER
    ══════════════════════════════════════════ */
    footer {
      background: var(--ink);
      padding: 100px 0 40px;
      border-top: 1px solid var(--hairline);
      color: rgba(231,221,200,0.72);
      position: relative;
    }
    footer::before {
      content: "";
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 1px;
      background: linear-gradient(90deg, transparent, var(--gold), transparent);
      opacity: 0.4;
    }
    .footer-grid {
      display: grid;
      grid-template-columns: 1.5fr 1fr 1fr 1fr 1fr 1fr;
      gap: 32px;
      padding-bottom: 64px;
      border-bottom: 1px solid var(--hairline);
      align-items: start;
    }
    .footer-col-title {
      font-family: var(--font-mono);
      font-size: 0.72rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--gold);
      margin-bottom: 24px;
      padding-bottom: 12px;
      border-bottom: 1px solid var(--hairline);
    }
    .footer-links {
      display: flex; flex-direction: column; gap: 12px;
    }
    .footer-links a {
      font-size: 0.95rem;
      color: rgba(231,221,200,0.72);
      transition: color .35s ease;
    }
    .footer-links a:hover { color: var(--gold); }
    .footer-newsletter p { font-size: 0.82rem; opacity: 0.78; margin-bottom: 18px; line-height: 1.7; }
    .footer-news-row {
      display: flex; gap: 8px;
    }
    .footer-news-row input {
      flex: 1;
      padding: 12px 14px;
      background: transparent;
      border: 1px solid var(--hairline);
      color: var(--bone);
      font-family: var(--font-sans);
      font-size: 0.82rem;
      outline: none;
      transition: border-color .35s ease;
    }
    .footer-news-row input::placeholder { color: rgba(231,221,200,0.4); }
    .footer-news-row input:focus { border-color: var(--gold); }
    .footer-news-row .btn { min-height: 44px; padding: 0 20px; font-size: 0.72rem; }
    .footer-news-label {
      font-family: var(--font-mono);
      font-size: 0.62rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: rgba(231,221,200,0.5);
      margin-bottom: 8px;
      display: block;
    }
    .footer-news-fineprint {
      font-size: 0.72rem;
      color: rgba(231,221,200,0.45);
      margin-top: 12px;
      font-style: italic;
      line-height: 1.6;
    }
    .footer-bottom {
      padding-top: 32px;
      display: flex; justify-content: space-between; align-items: center;
      flex-wrap: wrap;
      gap: 18px;
      font-size: 0.82rem;
      color: rgba(231,221,200,0.5);
    }
    .footer-social {
      display: flex; gap: 12px;
    }
    .footer-social a {
      width: 38px; height: 38px;
      border: 1px solid var(--hairline);
      border-radius: 50%;
      display: inline-flex; align-items: center; justify-content: center;
      color: rgba(231,221,200,0.7);
      transition: border-color .35s ease, color .35s ease;
      font-size: 0.82rem;
    }
    .footer-social a:hover { border-color: var(--gold); color: var(--gold); }
    .footer-compliance {
      margin-top: 32px;
      padding: 24px 28px;
      background: rgba(0,0,0,0.25);
      border: 1px solid var(--hairline);
      font-size: 0.82rem;
      color: rgba(231,221,200,0.55);
      line-height: 1.75;
    }
    .footer-compliance-row { margin-bottom: 10px; }
    .footer-compliance-row:last-child { margin-bottom: 0; }
    .footer-compliance-warning {
      color: var(--gold);
      font-family: var(--font-mono);
      font-size: 0.72rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      margin-bottom: 8px;
      display: block;
    }
    .aud-link {
      color: var(--gold);
      border-bottom: 1px solid rgba(201,163,90,0.3);
      transition: border-color .35s ease;
    }
    .aud-link:hover { border-bottom-color: var(--gold); }
    .audience-card .aud-link { margin-top: auto; align-self: flex-start; }
    .voa-principle .ico { margin-bottom: 16px; }
    .voa-principle .voa-proof { margin-top: auto; }
    .tool-card .locked-link { margin-top: auto; }

    @media (max-width: 1200px) {
      .footer-grid { grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 30px; }
    }
    @media (max-width: 900px) {
      .footer-grid { grid-template-columns: 1fr 1fr 1fr; gap: 28px; }
    }
    @media (max-width: 640px) {
      .footer-grid { grid-template-columns: 1fr 1fr; gap: 24px; }
    }
    @media (max-width: 460px) {
      .footer-grid { grid-template-columns: 1fr; }
      .footer-bottom { flex-direction: column; align-items: flex-start; }
    }

    /* ══════════════════════════════════════════
       REVEAL ANIMATIONS
    ══════════════════════════════════════════ */
    .reveal {
      opacity: 0;
      transform: translateY(28px);
      transition: opacity 2s cubic-bezier(.22,.61,.36,1), transform 2s cubic-bezier(.22,.61,.36,1);
      will-change: opacity, transform;
    }
    .reveal.on,
    .reveal.visible {
      opacity: 1;
      transform: translateY(0);
    }
    .reveal-delay-1 { transition-delay: 0.08s; }
    .reveal-delay-2 { transition-delay: 0.16s; }
    .reveal-delay-3 { transition-delay: 0.24s; }
    .reveal-delay-4 { transition-delay: 0.32s; }
    @media (prefers-reduced-motion: reduce) {
      .reveal, .reveal-delay-1, .reveal-delay-2, .reveal-delay-3, .reveal-delay-4 {
        transition: none !important;
        opacity: 1 !important;
        transform: none !important;
      }
      * { animation: none !important; }
    }

    /* ══════════════════════════════════════════
       UTILITIES
    ══════════════════════════════════════════ */
    .center { text-align: center; }
    .dot { display: inline-block; width: 4px; height: 4px; border-radius: 50%; background: var(--gold); margin: 0 8px; vertical-align: middle; opacity: 0.6; }
    [hidden] { display: none !important; }

    /* Scroll bar styling */
    ::-webkit-scrollbar { width: 8px; height: 8px; }
    ::-webkit-scrollbar-track { background: var(--ink); }
    ::-webkit-scrollbar-thumb { background: rgba(201,163,90,0.25); border-radius: 0; }
    ::-webkit-scrollbar-thumb:hover { background: rgba(201,163,90,0.5); }

/* ══════════════════════════════════════════
       COST-OF-WAITING CHART (cw2)
    ══════════════════════════════════════════ */
    .cw2-card {
      margin-top: 30px;
      width: 100%;
      padding: 0;
      border-radius: 0;
      background: transparent;
      border: none;
      box-shadow: none;
    }
    .cw2-head {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      gap: 18px;
      flex-wrap: wrap;
      margin-bottom: 22px;
      width: 100%;
      margin-left: auto;
      margin-right: auto;
    }
    .cw2-head h4 {
      margin: 0;
      font-family: var(--font-display);
      font-size: 1.4rem;
      font-weight: 350;
      color: var(--bone);
      letter-spacing: -0.015em;
    }
    .cw2-head p {
      margin: 8px 0 0;
      max-width: 620px;
      color: rgba(231, 221, 200, 0.65);
      font-size: 0.82rem;
      line-height: 1.65;
    }
    .cw2-pills {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
      justify-content: flex-end;
    }
    .cw2-pills span {
      padding: 6px 12px;
      border-radius: 999px;
      background: transparent;
      border: 1px solid var(--hairline-strong);
      color: var(--gold);
      font-family: var(--font-mono);
      font-size: 0.62rem;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      font-weight: 500;
    }
    .cw2-chart-area {
      position: relative;
      width: 100%;
      height: 380px;
      border-radius: 0;
      background: rgba(0, 0, 0, 0.22);
      border: 1px solid var(--hairline);
      overflow: hidden;
      margin: 22px auto 0;
    }
    .cw2-chart-area::before {
      content: "";
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 1px;
      background: linear-gradient(90deg, transparent, var(--gold), transparent);
      opacity: 0.4;
    }
    .cw2-watermark {
      /* Ownership mark. It must live OUTSIDE the svg: that svg is
         preserveAspectRatio="none", so its coordinate system is stretched
         non-uniformly (1.36x vertically at 1240px, and it changes with the
         window) — anything drawn inside it comes out crooked. As a plain img
         the aspect is the browser's job and stays true. It sits above the
         chart so it still lands in any screenshot; pointer-events:none keeps
         the tooltips working. */
      position: absolute; top: 50%; left: 50%;
      transform: translate(-50%, -50%);
      width: 40%; height: auto;
      opacity: 0.06;
      pointer-events: none;
      user-select: none;
      z-index: 1;
    }
    .cw2-svg {
      width: 100%;
      height: 100%;
      display: block;
    }
    .cw2-tooltip {
      position: absolute;
      display: none;
      min-width: 250px;
      padding: 14px 16px;
      border-radius: 0;
      background: var(--ink);
      border: 1px solid var(--gold);
      color: var(--bone);
      box-shadow: 0 18px 38px rgba(0, 0, 0, 0.5);
      z-index: 9;
      pointer-events: none;
      font-size: 0.82rem;
      font-family: var(--font-sans);
    }
    .cw2-tooltip b {
      display: block;
      font-size: 0.95rem;
      margin-bottom: 8px;
      color: var(--gold);
      font-family: var(--font-display);
      font-weight: 350;
    }
    .cw2-tooltip-row {
      display: flex;
      justify-content: space-between;
      gap: 14px;
      border-top: 1px solid rgba(201, 163, 90, 0.18);
      padding-top: 6px;
      margin-top: 6px;
    }
    .cw2-tooltip-row span:first-child { color: rgba(231, 221, 200, 0.6); font-family: var(--font-mono); font-size: 0.72rem; letter-spacing: 0.08em; }
    .cw2-tooltip-row span:last-child { font-weight: 600; color: var(--bone); }
    .cw2-legend {
      display: flex;
      flex-wrap: wrap;
      gap: 22px;
      margin-top: 18px;
      color: rgba(231, 221, 200, 0.72);
      font-family: var(--font-mono);
      font-size: 0.72rem;
      letter-spacing: 0.1em;
      text-transform: uppercase;
    }
    .cw2-legend span { display: flex; align-items: center; gap: 8px; }
    .cw2-dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }
    .cw2-kpis {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 12px;
      margin-top: 22px;
    }
    .cw2-kpi {
      padding: 18px 16px;
      border: 1px solid var(--hairline);
      border-radius: 0;
      background: rgba(0, 0, 0, 0.15);
      text-align: center;
    }
    .cw2-kpi b {
      display: block;
      font-family: var(--font-display);
      font-size: 1.75rem;
      font-weight: 350;
      color: var(--gold);
      line-height: 1;
      letter-spacing: -0.02em;
    }
    .cw2-kpi span {
      display: block;
      margin-top: 8px;
      color: rgba(231, 221, 200, 0.5);
      font-family: var(--font-mono);
      font-size: 0.62rem;
      font-weight: 500;
      text-transform: uppercase;
      letter-spacing: 0.18em;
    }
    .cw2-note {
      margin-top: 14px;
      font-size: 0.72rem;
      color: rgba(231, 221, 200, 0.5);
      line-height: 1.65;
      font-style: italic;
    }

    /* Health check / hero-points narrow fix (preserve original behavior) */
    .financial-health-check,
    .health-check-card,
    .featured-health-check {
      max-width: 100%;
      width: 100%;
      min-height: auto;
      transform: none;
    }
    /* Cost-waiting layout (preserve behavior) */
    .cost-waiting-text-impact-row,
    .waiting-impact-layout {
      display: grid;
      grid-template-columns: minmax(0, 1.25fr) minmax(280px, .75fr);
      gap: 36px;
      align-items: center;
    }
    .illustrative-impact-card,
    .impact-card,
    .waiting-impact-card {
      max-width: 440px;
      justify-self: end;
    }

    @media (max-width: 1100px) {
      .cw2-kpis { grid-template-columns: 1fr 1fr; }
    }
    @media (max-width: 900px) {
      .cw2-chart-area { height: 320px; }
      .cost-waiting-text-impact-row,
      .waiting-impact-layout { grid-template-columns: 1fr; }
      .illustrative-impact-card,
      .impact-card,
      .waiting-impact-card { max-width: 100%; justify-self: stretch; }
    }
    @media (max-width: 640px) {
      .cw2-chart-area { height: 280px; }
      .cw2-kpis { grid-template-columns: 1fr; }
    }

/* ══════════════════════════════════════════
       PART 6 — SPA ROUTING & CONVERSION MECHANICS
       ══════════════════════════════════════════ */

    /* ── Page routing wrappers ── */
    .page { animation: pageReveal 0.65s cubic-bezier(.16,1,.3,1) both; }
    .page[hidden] { display: none !important; }
    @keyframes pageReveal {
      from { opacity: 0; transform: translateY(14px); }
      to   { opacity: 1; transform: none; }
    }
    @media (prefers-reduced-motion: reduce) {
      .page { animation: none; }
    }

    /* Active nav link */
    .nav-links .nav-trigger.active {
      color: var(--gold) !important;
      position: relative;
    }
    .nav-links .nav-trigger.active::after {
      content: "";
      position: absolute;
      left: 0; right: 0;
      bottom: -6px;
      height: 1px;
      background: var(--gold);
      opacity: 0.7;
    }

    /* Nav CTA pill — tighten as a single primary button */
    .nav-cta {
      display: inline-flex !important;
      align-items: center;
      gap: 8px;
      padding: 11px 20px !important;
    }
    .nav-cta-arrow {
      display: inline-block;
      transition: transform 0.35s cubic-bezier(.16,1,.3,1);
    }
    .nav-cta:hover .nav-cta-arrow {
      transform: translateX(4px);
    }

    /* ── Scarcity strip ── */
    .scarcity-strip {
      background: #070e1c;
      border-top: 1px solid rgba(201,163,90,0.18);
      border-bottom: 1px solid rgba(201,163,90,0.18);
      padding: 14px 0;
      color: rgba(244,237,224,0.88);
      position: relative;
      overflow: hidden;
    }
    .scarcity-strip::before {
      content: "";
      position: absolute;
      inset: 0;
      background:
        none;
      pointer-events: none;
    }
    .scarcity-inner {
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-wrap: wrap;
      gap: 14px;
      font-family: 'JetBrains Mono', ui-monospace, monospace;
      font-size: 0.72rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
    }
    .scarcity-pulse {
      width: 8px; height: 8px;
      border-radius: 50%;
      background: #d6b66f;
      box-shadow: 0 0 0 0 rgba(214,182,111,0.7);
      animation: scarcityPulse 2.2s infinite cubic-bezier(.66,0,.34,1);
      flex-shrink: 0;
    }
    @keyframes scarcityPulse {
      0%   { box-shadow: 0 0 0 0 rgba(214,182,111,0.55); }
      70%  { box-shadow: 0 0 0 11px rgba(214,182,111,0); }
      100% { box-shadow: 0 0 0 0 rgba(214,182,111,0); }
    }
    .scarcity-eyebrow {
      color: var(--eyebrow);
      font-weight: 500;
    }
    .scarcity-text strong { color: #f4ede0; font-weight: 600; }
    .scarcity-text-soft { color: rgba(244,237,224,0.62); }
    .scarcity-text-soft strong { color: var(--gold); font-weight: 600; }
    .scarcity-sep { color: rgba(201,163,90,0.4); }
    @media (max-width: 720px) {
      .scarcity-inner { font-size: 0.62rem; gap: 8px; letter-spacing: 0.1em; }
      .scarcity-sep { display: none; }
      .scarcity-text-soft { display: none; }
    }

    /* ── Hero dual-CTA row ── */
    .hero-dual-cta {
      margin-top: 36px;
      display: grid;
      gap: 14px;
      align-items: flex-start;
      width: max-content;
      max-width: 100%;
    }
    .hero-dual-cta > .btn {
      width: 100%;
      align-self: stretch;
    }
    .hero-cta-primary {
      display: inline-flex !important;
      align-items: center;
      gap: 10px;
      padding: 14px 26px !important;
      font-size: 0.82rem !important;
    }
    .hero-cta-primary .btn-arrow {
      display: inline-block;
      transition: transform 0.4s cubic-bezier(.16,1,.3,1);
    }
    .hero-cta-primary:hover .btn-arrow { transform: translateX(6px); }
    .hero-cta-secondary {
      padding: 14px 26px !important;
      font-size: 0.82rem !important;
      cursor: pointer;
      background: transparent;
    }
    .hero-cta-microcopy {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      margin: 6px 0 0;
      font-family: 'JetBrains Mono', ui-monospace, monospace;
      font-size: 0.72rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: rgba(244,237,224,0.55);
    }
    .dot-gold {
      width: 5px; height: 5px;
      background: var(--gold);
      border-radius: 50%;
      flex-shrink: 0;
    }
    @media (max-width: 600px) {
      .hero-dual-cta { width: 100%; }
      .hero-dual-cta > .btn { width: 100%; justify-content: center; }
      .hero-cta-microcopy { font-size: 0.62rem; flex-wrap: wrap; }
    }

    /* ══════════════════════════════════════════
       STICKY CTA PILL (bottom-right)
       ══════════════════════════════════════════ */
    .sticky-cta {
      position: fixed;
      right: 28px;
      bottom: 28px;
      z-index: 800;
      display: inline-flex;
      align-items: center;
      gap: 12px;
      padding: 16px 26px 16px 22px;
      background: #c9a35a;
      background-size: 200% 100%;
      background-position: 0% 50%;
      color: #070e1c;
      font-family: 'Manrope', system-ui, sans-serif;
      font-weight: 500;
      font-size: 0.82rem;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      text-decoration: none;
      border-radius: 999px;
      box-shadow:
        0 18px 44px rgba(7,14,28,0.32),
        0 4px 14px rgba(7,14,28,0.20),
        inset 0 1px 0 rgba(255,255,255,0.35);
      opacity: 0;
      transform: translateY(120%) scale(0.92);
      pointer-events: none;
      transition:
        opacity 0.5s cubic-bezier(.16,1,.3,1),
        transform 0.6s cubic-bezier(.16,1,.3,1),
        background-position 0.6s ease;
    }
    .sticky-cta.visible {
      opacity: 1;
      transform: translateY(0) scale(1);
      pointer-events: auto;
    }
    .sticky-cta:hover {
      background-position: 100% 50%;
      transform: translateY(-2px);
    }
    /* Pulsing dot indicator inside "Book a strategy call" — matches "By appointment" style */
    .sticky-cta-pulse {
      width: 9px; height: 9px;
      background: #070e1c;
      border-radius: 50%;
      position: relative;
      flex-shrink: 0;
      box-shadow: 0 0 0 0 rgba(7,14,28,0.55);
      animation: ctaPulseDot 2.2s infinite cubic-bezier(.66,0,.34,1);
    }
    @keyframes ctaPulseDot {
      0%   { box-shadow: 0 0 0 0 rgba(7,14,28,0.55); }
      70%  { box-shadow: 0 0 0 9px rgba(7,14,28,0); }
      100% { box-shadow: 0 0 0 0 rgba(7,14,28,0); }
    }
    .sticky-cta-arrow {
      display: inline-block;
      transition: transform 0.35s cubic-bezier(.16,1,.3,1);
    }
    .sticky-cta:hover .sticky-cta-arrow {
      transform: translateX(4px);
    }
    @media (max-width: 600px) {
      .sticky-cta {
        right: 14px; bottom: 14px;
        padding: 13px 20px 13px 18px;
        font-size: 0.82rem;
        gap: 9px;
      }
      .sticky-cta-text {
        max-width: 160px;
      }
    }

    /* ══════════════════════════════════════════
       CONVERSION MODAL (Entry / Exit)
       ══════════════════════════════════════════ */
    .conv-modal {
      position: fixed;
      inset: 0;
      z-index: 1000;
      display: none;
      align-items: center;
      justify-content: center;
      padding: 20px;
    }
    .conv-modal.open {
      display: flex;
      animation: convFade 0.4s ease-out;
    }
    @keyframes convFade { from { opacity: 0; } to { opacity: 1; } }

    .conv-modal-backdrop {
      position: absolute;
      inset: 0;
      background:
        rgba(7,14,28,0.82);
      backdrop-filter: blur(8px);
      -webkit-backdrop-filter: blur(8px);
      cursor: pointer;
    }

    .conv-modal-card {
      position: relative;
      width: 100%;
      max-width: 880px;
      max-height: calc(100vh - 40px);
      overflow: hidden;
      display: grid;
      grid-template-columns: 0.85fr 1fr;
      background: #f4ede0;
      border: 1px solid rgba(201,163,90,0.45);
      border-radius: 4px;
      box-shadow:
        0 40px 100px rgba(0,0,0,0.5),
        0 0 0 1px rgba(201,163,90,0.2);
      animation: convCardIn 0.5s cubic-bezier(.16,1,.3,1);
    }
    @keyframes convCardIn {
      from { opacity: 0; transform: translateY(24px) scale(0.97); }
      to   { opacity: 1; transform: none; }
    }
    .conv-modal-card::before {
      content: "";
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 2px;
      background: var(--gold);
      z-index: 5;
    }

    .conv-modal-card-sm {
      grid-template-columns: 1fr;
      max-width: 480px;
    }

    .conv-modal-close {
      position: absolute;
      top: 12px;
      right: 14px;
      width: 36px;
      height: 36px;
      background: rgba(7,14,28,0.85);
      color: #f4ede0;
      border: 1px solid rgba(201,163,90,0.4);
      border-radius: 50%;
      font-size: 1.4rem;
      font-weight: 300;
      line-height: 1;
      cursor: pointer;
      z-index: 10;
      transition: all 0.25s ease;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 0;
    }
    .conv-modal-close:hover {
      background: var(--gold);
      color: #070e1c;
      transform: rotate(90deg);
    }

    /* Magazine-cover style art panel */
    .conv-modal-cover {
      position: relative;
      background:
        #070e1c;
      color: #f4ede0;
      padding: 44px 32px;
      display: flex;
      align-items: flex-end;
      min-height: 360px;
      overflow: hidden;
    }
    .conv-cover-noise {
      position: absolute;
      inset: 0;
      background-image:
        none;
      pointer-events: none;
    }
    .conv-cover-inner {
      position: relative;
      z-index: 2;
      width: 100%;
    }
    .conv-cover-tag {
      font-family: 'JetBrains Mono', ui-monospace, monospace;
      font-size: 0.62rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--gold);
      margin-bottom: 24px;
      padding-bottom: 14px;
      border-bottom: 1px solid rgba(201,163,90,0.32);
    }
    .conv-cover-title {
      font-family: 'Fraunces', 'Instrument Serif', Georgia, serif;
      font-weight: 300;
      font-size: clamp(46px, 6vw, 72px);
      line-height: 0.92;
      letter-spacing: -0.02em;
      margin-bottom: 28px;
      color: #f4ede0;
    }
    .conv-cover-title em {
      font-family: var(--font-emphasis); font-style: italic;
      color: var(--gold);
    }
    .conv-cover-meta {
      display: flex;
      align-items: center;
      gap: 14px;
      font-family: 'JetBrains Mono', ui-monospace, monospace;
      font-size: 0.62rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: rgba(244,237,224,0.62);
    }
    .conv-cover-rule {
      flex: 1;
      height: 1px;
      background: rgba(201,163,90,0.35);
      max-width: 80px;
    }

    /* Body / form side */
    .conv-modal-body {
      padding: 44px 40px 36px;
      background: #f4ede0;
      overflow-y: auto;
      display: flex;
      flex-direction: column;
      justify-content: center;
    }
    .conv-modal-body-solo {
      padding: 50px 38px 38px;
    }
    .conv-eyebrow {
      font-family: var(--font-mono);
      font-size: 0.72rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--eyebrow);
      margin: 0 0 16px;
    }
    .conv-headline {
      font-family: 'Fraunces', 'Instrument Serif', Georgia, serif;
      font-weight: 300;
      font-size: clamp(26px, 3.2vw, 34px);
      line-height: 1.12;
      letter-spacing: -0.015em;
      color: #050a14;
      margin: 0 0 14px;
    }
    .conv-headline em {
      font-family: var(--font-emphasis); font-style: italic;
      color: #050a14;
      position: relative;
    }
    .conv-headline em::after {
      content: "";
      position: absolute;
      left: 0; right: 0;
      bottom: 2px;
      height: 6px;
      background: rgba(201,163,90,0.32);
      z-index: -1;
    }
    .conv-sub {
      font-family: 'Manrope', system-ui, sans-serif;
      font-size: 0.95rem;
      line-height: 1.55;
      color: rgba(7,14,28,0.72);
      margin: 0 0 26px;
    }

    .conv-form { display: flex; flex-direction: column; gap: 12px; }
    .conv-field {
      position: relative;
      display: flex;
      flex-direction: column;
      align-items: stretch;
      min-width: 0;
    }
    /* [16 Jul] Was background: rgba(255,255,255,0.7) — white boxes stacked on a
       Bone card, which read as cards-inside-a-card. Now transparent on a
       hairline, identical to .iz-input and to the select trigger beside them. */
    /* ── The 6/3/1/0 line ────────────────────────────────────────────────
       One sentence, not a stack. The stacked ladder read well but measured
       165px on an iPhone SE and pushed "See where I stand" further down a card
       that already scrolls internally; inline costs a fraction of that and
       keeps every number.
       GOLD: this pane is Bone, so the numerals are --gold-on-paper (#87682c).
       Raw --gold is 2.03:1 here and fails AA — same rule as the confirmation
       card. line-height:0 keeps the oversized numerals from opening the lines.
       ── */
    .conv-ladder-line b {
      font-family: var(--font-display);
      font-weight: 400;
      font-variation-settings: "opsz" 144;
      font-size: 1.55em; line-height: 0;
      letter-spacing: -0.01em;
      color: var(--gold-on-paper);
      margin-right: 1px;
    }
    .conv-ladder-line em {
      font-style: normal;
      font-weight: 600;
      color: rgba(7,14,28,0.86);
    }
    .conv-ladder-line { text-wrap: pretty; }
    /* [17 Jul] Mobile: at 0.95rem the sentence wrapped to 6 lines on an iPhone
       SE (141px) — taller than the stacked version it replaced, because a
       paragraph can't put the numerals in their own column. 0.82rem brings it
       back to 5. The pop-up's other copy is 0.82rem on mobile anyway. */
    @media (max-width: 560px) {
      .conv-ladder-line { font-size: 0.82rem; line-height: 1.5; }
      .conv-ladder-line b { font-size: 1.5em; }
    }

    .conv-field input {
      flex: 1;
      width: 100%;
      padding: 14px 16px;
      background: transparent;
      border: 1px solid rgba(7,14,28,0.22);
      border-radius: var(--radius);
      font-family: 'Manrope', system-ui, sans-serif;
      font-size: 0.95rem;
      color: #050a14;
      transition: border-color .35s ease, background .35s ease;
    }
    .conv-field input::placeholder {
      color: rgba(7,14,28,0.38);
    }
    .conv-field input:focus {
      outline: none;
      border-color: var(--gold);
      background: rgba(201,163,90,0.04);
      box-shadow: none;
    }
    .conv-field-phone {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      align-items: stretch;
    }
    .conv-field-phone > select,
    .conv-field-phone > .iz-select {
      grid-column: 1;
      grid-row: 1;
      width: 100%;
      max-width: none;
      min-width: 0;
    }
    .conv-field-phone > .iz-select .iz-select-trigger {
      height: 100%;
      padding: 14px 12px;
      min-width: 0;
      overflow: hidden;
      white-space: nowrap;
    }
    .conv-field-phone > .iz-select .iz-select-value {
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .conv-field-phone > .iz-select .iz-select-panel {
      right: auto;
      width: max-content;
      min-width: 260px;
      max-width: calc(100vw - 32px);
    }
    .conv-field-phone > .iz-select .iz-select-option {
      white-space: nowrap;
    }
    .conv-field-phone > input {
      grid-column: 2;
      grid-row: 1;
      width: 100%;
    }
    .conv-field-phone > .zephyr-field-error {
      grid-column: 1 / -1;
      grid-row: 2;
    }
    .conv-field-prefix {
      display: inline-flex;
      align-items: center;
      padding: 0 14px;
      background: transparent;
      border: 1px solid rgba(7,14,28,0.18);
      border-right: none;
      border-radius: 2px 0 0 2px;
      font-family: 'JetBrains Mono', ui-monospace, monospace;
      font-size: 0.82rem;
      letter-spacing: 0.06em;
      color: rgba(7,14,28,0.62);
    }
    .conv-field-phone input {
      min-width: 0;
      flex: 1 1 auto;
      border-radius: 0 2px 2px 0;
    }
    .conv-field-phone select {
      flex: 0 0 120px;
      width: 120px;
      max-width: 38%;
      min-width: 0;
      border: 1px solid rgba(7,14,28,0.18);
      border-right: 0;
      border-radius: 2px 0 0 2px;
      background: #fff;
      color: #07101c;
      padding: 0 10px;
      font: inherit;
      text-overflow: ellipsis;
    }
    @media (max-width: 480px) {
      .conv-field-phone {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
      .conv-field-phone select {
        width: 100%;
        max-width: none;
        padding-inline: 7px;
        font-size: 0.84rem;
      }
    }
    .zephyr-lead-error {
      grid-column: 1 / -1;
      color: #9f1d1d;
      font-size: .82rem;
      line-height: 1.4;
      margin-top: 4px;
    }
    .zephyr-field-error {
      display: block;
      width: 100%;
      color: #9f1d1d;
      font-size: .78rem;
      line-height: 1.35;
      margin-top: 5px;
    }
    .zephyr-lead-field {
      display: flex;
      flex-direction: column;
      width: 100%;
    }
    .zephyr-field-error[hidden] {
      display: none;
    }
    .zephyr-health-check-lead input[aria-invalid="true"],
    .zephyr-health-check-lead select[aria-invalid="true"],
    #scorecardForm input[aria-invalid="true"],
    #scorecardForm select[aria-invalid="true"],
    #contactForm input[aria-invalid="true"],
    #contactForm select[aria-invalid="true"] {
      border-color: #b42318;
      box-shadow: 0 0 0 2px rgba(180,35,24,.1);
    }

    .conv-submit {
      margin-top: 10px;
      padding: 16px 22px !important;
      width: 100%;
      justify-content: center;
      display: inline-flex !important;
      align-items: center;
      gap: 8px;
      font-size: 0.95rem !important;
    }
    .conv-submit .btn-arrow {
      display: inline-block;
      transition: transform 0.35s cubic-bezier(.16,1,.3,1);
    }
    .conv-submit:hover .btn-arrow { transform: translateX(4px); }

    .conv-consent {
      margin: 14px 0 0;
      font-size: 0.72rem;
      line-height: 1.55;
      color: rgba(7,14,28,0.55);
    }
    .conv-consent a {
      color: rgba(7,14,28,0.78);
      text-decoration: underline;
      text-decoration-color: rgba(201,163,90,0.5);
      text-underline-offset: 2px;
    }

    /* Success state */
    .conv-success {
      text-align: center;
      padding: 20px 0;
    }
    .conv-success-mark {
      width: 64px;
      height: 64px;
      border-radius: 50%;
      background: var(--gold);
      color: #070e1c;
      font-size: 2.2rem;
      line-height: 64px;
      margin: 0 auto 18px;
      animation: successPop 0.6s cubic-bezier(.16,1,.3,1);
    }
    @keyframes successPop {
      0%   { transform: scale(0.4); opacity: 0; }
      60%  { transform: scale(1.08); }
      100% { transform: scale(1); opacity: 1; }
    }
    .conv-success-h {
      font-family: 'Fraunces', 'Instrument Serif', Georgia, serif;
      font-weight: 300;
      
      font-size: 1.75rem;
      color: #050a14;
      margin: 0 0 8px;
    }
    .conv-success-p {
      color: rgba(7,14,28,0.66);
      font-size: 0.82rem;
      margin: 0;
    }

    /* Mobile collapse */
    @media (max-width: 720px) {
      .conv-modal-card {
        grid-template-columns: 1fr;
        max-height: calc(100vh - 24px);
        overflow-y: auto;
      }
      .conv-modal-cover {
        min-height: 200px;
        padding: 28px 24px;
      }
      .conv-cover-title { font-size: clamp(38px, 9vw, 52px); margin-bottom: 18px; }
      .conv-cover-tag { margin-bottom: 14px; }
      .conv-modal-body { padding: 32px 24px; }
      .conv-modal-close { top: 8px; right: 8px; }
    }

    /* Lock body scroll while modal open */
    body.modal-locked {
      overflow: hidden;
    }

    /* Make sure existing reveal works the first time pages become un-hidden */
    .page[hidden] .reveal {
      opacity: 0;
    }

/* ══════════════════════════════════════════
       PART 7 — RESTORED CLASS STYLES (luxury palette)
       Adds back styling for .journey-* (start-here cards),
       .s1–.s6 (pricing stage header gradients),
       .count-target (count-up animation flag),
       .conv-field-row / .conv-modal-sm (modal helpers).
       ══════════════════════════════════════════ */

    /* ── Journey cards (Start Here, 4-col) ── */
    .journey-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 22px;
      margin-top: 12px;
    }
    .journey-card {
      position: relative;
      overflow: hidden;
      padding: 30px 26px 32px;
      background: rgba(244, 237, 224, 0.04);
      border: 1px solid rgba(244, 237, 224, 0.12);
      border-radius: 4px;
      transition:
        transform 0.45s cubic-bezier(.16,1,.3,1),
        border-color 0.4s ease,
        background 0.4s ease,
        box-shadow 0.4s ease;
      cursor: pointer;
      color: #1e2433;
    }
    /* On cream-bg sections, journey cards flip to ink-on-cream */
    section[style*="bg-soft"] .journey-card,
    .page[data-page="approach"] #start-here .journey-card {
      /* approach page starts with start-here; keep dark unless explicitly inverted */
    }
    .journey-card::before {
      /* hairline gold accent on top, hidden by default */
      content: "";
      position: absolute;
      top: 0; left: 0;
      width: 0;
      height: 1px;
      background: var(--gold);
      transition: width 0.55s cubic-bezier(.16,1,.3,1);
    }
    .journey-card::after {
      content: "→";
      position: absolute;
      right: 22px; bottom: 20px;
      font-family: 'Fraunces', 'Instrument Serif', Georgia, serif;
      font-size: 1.4rem;
      color: var(--gold);
      font-weight: 300;
      opacity: 0;
      transform: translateX(-8px);
      transition: all 0.4s cubic-bezier(.16,1,.3,1);
    }
    .journey-card:hover {
      transform: translateY(-4px);
      background: rgba(244, 237, 224, 0.06);
      border-color: rgba(201, 163, 90, 0.45);
      box-shadow: 0 22px 40px -18px rgba(0,0,0,0.5);
    }
    .journey-card:hover::before { width: 100%; }
    .journey-card:hover::after  { opacity: 0.92; transform: translateX(0); }

    .journey-num {
      display: block;
      font-family: 'Fraunces', 'Instrument Serif', Georgia, serif;
      
      font-weight: 300;
      font-size: 3.4rem;
      line-height: 1;
      letter-spacing: -0.02em;
      color: rgba(201, 163, 90, 0.55);
      margin-bottom: 6px;
    }
    .journey-card .icon {
      margin-bottom: 14px;
      font-size: 1.4rem;
    }
    .journey-card h3 {
      font-family: 'Fraunces', 'Instrument Serif', Georgia, serif;
      font-weight: 400;
      font-size: 1.15rem;
      line-height: 1.25;
      letter-spacing: -0.005em;
      color: #070e1c;
      margin: 0 0 10px;
    }
    .journey-card p.muted {
      font-size: 0.95rem;
      line-height: 1.6;
      color: #4a4f5e;
      margin: 0;
      padding-right: 30px; /* leave room for arrow */
    }

    /* Journey grid responsiveness */
    @media (max-width: 1100px) {
      .journey-grid { grid-template-columns: repeat(2, 1fr); }
    }
    @media (max-width: 640px) {
      .journey-grid { grid-template-columns: 1fr; gap: 16px; }
      .journey-card { padding: 26px 22px 28px; }
      .journey-num { font-size: 3rem; }
    }

    /* ══════════════════════════════════════════
       Pricing stage header gradients (.s1–.s6)
       Cool ink → warm gold progression through 6 stages
       Targets ".stg.sN .stg-hdr" (matches original markup)
       ══════════════════════════════════════════ */
    .stg.s1 .stg-hdr { background: #1a2540; color: #f4ede0; }
    .stg.s2 .stg-hdr { background: #243355; color: #f4ede0; }
    .stg.s3 .stg-hdr { background: #2d3f6a; color: #f4ede0; }
    .stg.s4 .stg-hdr { background: #3a4a73; color: #f4ede0; }
    .stg.s5 .stg-hdr { background: #8a6f3a; color: #050a14; }
    .stg.s6 .stg-hdr { background: var(--gold); color: #050a14; }

    /* Add a subtle inner glow to higher stages */
    .stg.s5 .stg-hdr,
    .stg.s6 .stg-hdr {
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.18);
    }

    /* If the stage header has an eyebrow/label inside that lives darker, keep them readable */
    .stg.s5 .stg-hdr .stg-eyebrow,
    .stg.s6 .stg-hdr { --eyebrow: rgba(5,10,20,0.65); }
    .stg.s6 .stg-hdr .stg-eyebrow {
      color: var(--eyebrow);
    }

    /* ══════════════════════════════════════════
       Count-up animation flag
       ══════════════════════════════════════════ */
    .count-target { display: inline-block; }

    /* ══════════════════════════════════════════
       Modal helper classes (now styled explicitly
       rather than inheriting via the flex parent only)
       ══════════════════════════════════════════ */
    .conv-field-row {
      width: 100%;
      display: flex;
      flex-direction: column;
    }

    /* .conv-modal-sm already styles via .conv-modal-card-sm, but expose the
       outer .conv-modal-sm for any future overrides */
    .conv-modal-sm { /* container hook */ }

/* ══════════════════════════════════════════
       PART 8 — DUAL CTAs + SIX-STAGE JOURNEY
       ══════════════════════════════════════════ */

    /* ── Nav: small "Complimentary Financial Health Check™" secondary ── */
    .nav-actions { display: flex; align-items: center; gap: 16px; }
    .nav-health {
      display: inline-flex; align-items: center; gap: 8px;
      background: transparent;
      border: none;
      color: rgba(244,237,224,0.82);
      font-family: 'Manrope', system-ui, sans-serif;
      font-size: 0.82rem; font-weight: 500;
      letter-spacing: 0.01em;
      cursor: pointer;
      padding: 8px 4px;
      transition: color 0.3s ease;
      white-space: nowrap;
    }
    .nav-health:hover { color: var(--gold); }
    .nav-health-dot {
      width: 6px; height: 6px; border-radius: 50%;
      background: var(--gold);
      box-shadow: 0 0 0 0 rgba(201,163,90,0.6);
      animation: scarcityPulse 2.4s infinite cubic-bezier(.66,0,.34,1);
    }
    @media (max-width: 1080px) { .nav-health { display: none; } }

    /* ── Sticky group: stacked Health Check + Book Call ── */
    /* Override old single-pill positioning; the GROUP is now the fixed element */
    .sticky-cta-group {
      position: fixed;
      right: 28px; bottom: 28px;
      z-index: 800;
      display: flex; flex-direction: column;
      align-items: flex-end; gap: 10px;
      opacity: 0;
      transform: translateY(120%) scale(0.96);
      pointer-events: none;
      transition: opacity 0.5s cubic-bezier(.16,1,.3,1),
                  transform 0.6s cubic-bezier(.16,1,.3,1);
    }
    .sticky-cta-group.visible {
      opacity: 1; transform: translateY(0) scale(1); pointer-events: auto;
    }
    .sticky-health {
      display: inline-flex; align-items: center; gap: 8px;
      background: rgba(7,14,28,0.86);
      backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
      border: 1px solid rgba(201,163,90,0.42);
      color: #f4ede0;
      font-family: 'Manrope', system-ui, sans-serif;
      font-weight: 500; font-size: 0.82rem;
      padding: 9px 16px; border-radius: 999px;
      cursor: pointer;
      box-shadow: 0 10px 26px rgba(7,14,28,0.28);
      transition: all 0.3s ease;
    }
    .sticky-health:hover { border-color: var(--gold); transform: translateY(-1px); }
    .sticky-health-icon {
      width: 16px; height: 16px; border-radius: 50%;
      background: var(--gold); color: #070e1c;
      font-size: 0.62rem; line-height: 16px; text-align: center; font-weight: 700;
    }
    /* The pill itself: now static within the group, keep gold styling */
    .sticky-cta-group .sticky-cta {
      position: static;
      opacity: 1; transform: none; pointer-events: auto;
      transition: background-position 0.6s ease, transform 0.3s ease;
    }
    .sticky-cta-group .sticky-cta:hover { transform: translateY(-2px); }
    @media (max-width: 600px) {
      .sticky-cta-group { right: 12px; bottom: 12px; gap: 8px; }
      .sticky-health { font-size: 0.72rem; padding: 8px 13px; }
    }

    /* ══════════════════════════════════════════
       SIX-STAGE JOURNEY
       ══════════════════════════════════════════ */
    .stage-journey { margin-top: 8px; }

    /* ── The spine: whole journey at a glance ── */
    .journey-spine {
      position: relative;
      display: grid;
      grid-template-columns: repeat(6, 1fr);
      align-items: end;
      gap: 0;
      padding: 8px 0 0;
      margin: 12px 0 6px;
    }
    .spine-track {
      position: absolute;
      left: 8.33%; right: 8.33%;
      bottom: 46px;
      height: 1px;
      background: rgba(201,163,90,0.35);
    }
    .spine-col {
      position: relative;
      display: flex; flex-direction: column;
      align-items: center;
      justify-content: flex-end;
      gap: 0;
      min-height: 190px;
      text-align: center;
    }
    .spine-age {
      font-family: 'JetBrains Mono', ui-monospace, monospace;
      font-size: 0.72rem; letter-spacing: 0.12em; text-transform: uppercase;
      color: rgba(244,237,224,0.5);
      margin-bottom: 10px;
    }
    .spine-bar-wrap {
      height: 120px; width: 100%;
      display: flex; align-items: flex-end; justify-content: center;
    }
    .spine-bar {
      width: 30px;
      height: var(--h);
      border-radius: 4px 4px 0 0;
      opacity: 0.92;
      transition: height 0.9s cubic-bezier(.16,1,.3,1), filter 0.3s ease;
    }
    .spine-col .spine-dot {
      width: 11px; height: 11px; border-radius: 50%;
      margin: 14px 0 12px;
      border: 2px solid var(--ink);
      position: relative; z-index: 2;
    }
    .spine-name {
      font-family: 'Fraunces','Instrument Serif',Georgia,serif;
      font-size: 0.95rem; font-weight: 400;
      color: #f4ede0; line-height: 1.2;
      padding: 0 4px;
    }
    /* Per-stage bar/dot colours: cool → gold */
    .spine-col.s1 .spine-bar { background: #3a4f82; }
    .spine-col.s2 .spine-bar { background: #42588c; }
    .spine-col.s3 .spine-bar { background: #56628f; }
    .spine-col.s4 .spine-bar { background: #856f4a; }
    .spine-col.s5 .spine-bar { background: #bd9650; }
    .spine-col.s6 .spine-bar { background: var(--gold); }
    .spine-col.s1 .spine-dot { background:#3a4f82; }
    .spine-col.s2 .spine-dot { background:#42588c; }
    .spine-col.s3 .spine-dot { background:#56628f; }
    .spine-col.s4 .spine-dot { background:#856f4a; }
    .spine-col.s5 .spine-dot { background:#bd9650; }
    .spine-col.s6 .spine-dot { background:var(--gold); box-shadow:0 0 14px rgba(201,163,90,0.6); }
    .spine-arrow {
      position: absolute;
      right: -6px; bottom: 52px;
      color: var(--gold); font-size: 1.4rem; line-height: 1;
      opacity: 0.85;
    }
    .journey-spine-note {
      text-align: center;
      font-size: 1.15rem;
      color: rgba(244,237,224,0.6);
      max-width: 620px; margin: 0 auto 44px;
      font-style: italic;
      font-family: var(--font-accent);
    }
    @media (max-width: 720px) {
      .journey-spine { display: none; }       /* spine is decorative; hide on small screens */
      .journey-spine-note { margin-bottom: 28px; }
    }

    /* ── Stage detail cards — 6 in 1 row, compact ── */
    .stage-grid-v2 {
      display: grid;
      grid-template-columns: repeat(6, 1fr);
      gap: 12px;
    }
    .stgx {
      position: relative;
      display: flex; flex-direction: column;
      padding: 22px 18px 20px;
      background: rgba(244,237,224,0.045);
      border: 1px solid rgba(244,237,224,0.12);
      border-radius: 4px;
      overflow: hidden;
      transition: transform 0.45s cubic-bezier(.16,1,.3,1),
                  border-color 0.4s ease, background 0.4s ease, box-shadow 0.4s ease;
    }
    .stgx-accent {
      position: absolute; top: 0; left: 0; right: 0; height: 2px;
    }
    .stgx.s1 .stgx-accent { background: #2d3f6a; }
    .stgx.s2 .stgx-accent { background: #344878; }
    .stgx.s3 .stgx-accent { background: #45527e; }
    .stgx.s4 .stgx-accent { background: #6b5d44; }
    .stgx.s5 .stgx-accent { background: #9c7d44; }
    .stgx.s6 .stgx-accent { background: var(--gold); }
    .stgx:hover {
      transform: translateY(-4px);
      background: rgba(244,237,224,0.07);
      border-color: rgba(201,163,90,0.4);
      box-shadow: 0 20px 36px -16px rgba(0,0,0,0.5);
    }
    .stgx-top {
      display: flex; align-items: baseline; justify-content: space-between;
      margin-bottom: 4px;
    }
    .stgx-num {
      font-family: 'Fraunces','Instrument Serif',Georgia,serif;
      font-style: italic; font-weight: 300;
      font-size: 2.2rem; line-height: 1;
      color: rgba(201,163,90,0.45);
    }
    .stgx-age {
      font-family: 'JetBrains Mono', ui-monospace, monospace;
      font-size: 0.62rem; letter-spacing: 0.08em; text-transform: uppercase;
      color: rgba(244,237,224,0.55);
    }
    .stgx-name {
      font-family: 'Fraunces','Instrument Serif',Georgia,serif;
      font-weight: 400; font-size: 1.15rem; line-height: 1.2;
      color: #f4ede0; margin: 0 0 10px;
      letter-spacing: -0.01em;
      min-height: 2.6em;
      display: flex;
      align-items: flex-start;
    }
    .stgx-trigger {
      font-family: 'JetBrains Mono', ui-monospace, monospace;
      font-size: 0.62rem; letter-spacing: 0.04em;
      color: var(--gold); opacity: 0.85;
      margin: 0 0 12px; line-height: 1.5;
      min-height: 3em;
    }
    .stgx-who {
      font-size: 0.82rem; line-height: 1.5;
      color: rgba(244,237,224,0.75);
      margin: 0 0 14px;
      min-height: 2.6em;
    }
    .stgx-diff {
      margin: 0 0 14px;
      padding: 11px 12px;
      background: rgba(201,163,90,0.08);
      border-left: 2px solid var(--gold);
      border-radius: 0 3px 3px 0;
      min-height: 6.6em;
      display: flex;
      flex-direction: column;
    }
    .stgx-diff-lbl {
      display: block;
      font-family: 'JetBrains Mono', ui-monospace, monospace;
      font-size: 0.62rem; letter-spacing: 0.10em; text-transform: uppercase;
      color: var(--gold); margin-bottom: 5px;
    }
    .stgx-diff p {
      margin: 0; font-size: 0.82rem; line-height: 1.42;
      color: #f4ede0;
      font-family: 'Fraunces','Instrument Serif',Georgia,serif;
      font-style: italic;
    }
    .stgx-meta {
      display: flex; flex-direction: column; gap: 6px;
      padding-top: 10px; margin-top: auto;
      border-top: 1px solid rgba(244,237,224,0.1);
      min-height: 4.4em;
    }
    .stgx-meta-item {
      display: flex; flex-direction: column; gap: 2px;
      font-size: 0.82rem; color: rgba(244,237,224,0.88); font-weight: 500;
      line-height: 1.3;
    }
    .stgx-meta-item em {
      font-style: normal;
      font-family: 'JetBrains Mono', ui-monospace, monospace;
      font-size: 0.62rem; letter-spacing: 0.10em; text-transform: uppercase;
      color: rgba(244,237,224,0.5);
    }
    .stgx-cta {
      display: inline-flex; align-items: center; gap: 5px;
      margin-top: 12px;
      font-size: 0.82rem; font-weight: 600;
      color: var(--gold); text-decoration: none;
      transition: gap 0.3s ease;
      line-height: 1.3;
    }
    .stgx-cta:hover { gap: 9px; }

    @media (max-width: 1200px) {
      .stage-grid-v2 { grid-template-columns: repeat(3, 1fr); gap: 16px; }
      .stgx { padding: 26px 22px 22px; }
      .stgx-num { font-size: 2.2rem; }
      .stgx-name { font-size: 1.15rem; }
      .stgx-age, .stgx-trigger { font-size: 0.62rem; }
      .stgx-who { font-size: 0.82rem; }
      .stgx-diff p { font-size: 0.95rem; }
      .stgx-meta { flex-direction: row; gap: 20px; }
      .stgx-meta-item { font-size: 0.82rem; }
    }
    @media (max-width: 760px) {
      .stage-grid-v2 { grid-template-columns: repeat(2, 1fr); }
    }
    @media (max-width: 500px) {
      .stage-grid-v2 { grid-template-columns: 1fr; }
    }

    /* Final CTA dual-row spacing */
    .final-cta-row { gap: 16px; flex-wrap: wrap; justify-content: center; }
    .final-cta-row .btn-secondary { cursor: pointer; }

    /* ── General Advice Warning — restore boxed, readable design (matches attachment) ── */
    .footer-compliance-warning {
      background: rgba(201,163,90,0.07);
      border: 1px solid rgba(201,163,90,0.22);
      border-radius: 10px;
      padding: 16px 18px;
      font-family: 'Manrope', system-ui, sans-serif !important;
      font-size: 0.82rem !important;
      line-height: 1.65 !important;
      letter-spacing: normal !important;
      text-transform: none !important;
      color: rgba(244,237,224,0.62) !important;
      margin-bottom: 0 !important;
      display: block;
    }
    .footer-compliance-warning strong { color: var(--gold); font-weight: 600; }
    .footer-compliance-warning a {
      color: rgba(244,237,224,0.84);
      text-decoration: underline;
      text-underline-offset: 2px;
      text-decoration-color: rgba(201,163,90,0.5);
    }

/* ══════════════════════════════════════════
       PART 9 — DISCLAIMER FIX · TRANSITIONS · HOME
       OVERVIEW · SECTION BULLETS · ABOUT · MEMBERS
       ══════════════════════════════════════════ */

    /* ── FIX: 3-column compliance disclaimer grid ── */
    .footer-compliance-row {
      display: grid !important;
      grid-template-columns: repeat(3, 1fr);
      gap: 30px;
      margin-bottom: 24px !important;
    }
    .footer-compliance .fc-eyebrow {
      margin-bottom: 12px;
      font-size: 0.72rem;
    }
    .footer-compliance p {
      font-size: 0.82rem; line-height: 1.66;
      color: rgba(244,237,224,0.58); margin: 0;
    }
    @media (max-width: 860px) {
      .footer-compliance-row { grid-template-columns: 1fr; gap: 22px; }
    }

    /* ── FIX: invisible member-tools heading (white on cream) ── */
    .tools-unlock-title,
    #tools .tools-cta-card h3,
    #tools h3.unlock-heading { color: #050a14 !important; }

    /* ══════════════════════════════════════════
       SOFTER TRANSITIONS & EFFECTS
       ══════════════════════════════════════════ */
    .reveal {
      transition: opacity 1.15s cubic-bezier(.19,1,.22,1),
                  transform 1.15s cubic-bezier(.19,1,.22,1),
                  filter 1.15s cubic-bezier(.19,1,.22,1);
      filter: blur(5px);
    }
    .reveal.visible, .reveal.on { filter: blur(0); }
    .reveal-delay-1 { transition-delay: 0.10s; }
    .reveal-delay-2 { transition-delay: 0.20s; }
    .reveal-delay-3 { transition-delay: 0.30s; }
    .reveal-delay-4 { transition-delay: 0.40s; }
    .reveal-delay-5 { transition-delay: 0.50s; }
    @media (prefers-reduced-motion: reduce) {
      .reveal { filter: none !important; }
    }
    /* Smooth, consistent easing on common interactive surfaces */
    .card, .audience-card, .journey-card, .stgx, .overview-card,
    .resource-card, .tool-card, .blog-card, .case-card, .service-card {
      transition: transform 0.5s cubic-bezier(.19,1,.22,1),
                  box-shadow 0.5s cubic-bezier(.19,1,.22,1),
                  border-color 0.5s ease, background 0.5s ease !important;
    }
    a, button { transition: color .3s ease, background-color .3s ease,
                 border-color .3s ease, opacity .3s ease, transform .3s ease; }

    /* ── Reusable section value-bullets ── */
    .section-bullets {
      list-style: none; margin: 26px 0 0; padding: 0;
      display: grid; grid-template-columns: repeat(2, minmax(0,1fr));
      gap: 12px 28px; max-width: 760px;
    }
    .section-bullets.center { margin-left: auto; margin-right: auto; }
    .section-bullets li {
      position: relative; padding-left: 30px;
      font-size: 0.95rem; line-height: 1.55;
      color: var(--ink-soft, rgba(7,14,28,0.78));
    }
    .section-dark .section-bullets li,
    .stage-pricing-section .section-bullets li { color: rgba(244,237,224,0.78); }
    .section-bullets li::before {
      content: ""; position: absolute; left: 0; top: 7px;
      width: 16px; height: 16px; border-radius: 50%;
      background: var(--gold);
      box-shadow: 0 0 0 4px rgba(201,163,90,0.12);
    }
    .section-bullets li::after {
      content: "✓"; position: absolute; left: 3.5px; top: 5px;
      font-size: 0.62rem; color: #070e1c; font-weight: 700;
    }
    @media (max-width: 640px){ .section-bullets { grid-template-columns: 1fr; } }

    /* ══════════════════════════════════════════
       HOME OVERVIEW
       ══════════════════════════════════════════ */
    .home-overview { background: var(--bg-soft, #f4ede0); }

    /* ── Lender panel (home) ─────────────────────────────────────────── */
    .lender-panel { background: var(--cream, #f4ede0); overflow: hidden; }  /* [20 Jul] was var(--bone) #f4f1ea — a cooler bone than the #overview section directly above (#f4ede0), so the two abutted with a visible seam. Now matches. */
    /* [20 Jul] This is a LIGHT section. The heading + lead were inheriting the
       dark-surface text token (bone on bone = 1.03:1, invisible). Force the same
       ink values #overview uses on the identical background. */
    .lender-panel h2 { color: #070e1c; }
    .lender-panel .lead { color: #2a2f3d; }
    .lender-panel h2 em { font-family: var(--font-emphasis); font-style: italic; color: var(--gold-on-paper); }
    .lender-marquee {
      position: relative; margin-top: 14px;
      -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
              mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
      overflow: hidden;
    }
    .lender-track { display: flex; gap: 18px; width: max-content; will-change: transform; }
    .lender-track-a { animation: lenderScrollA 64s linear infinite; }
    .lender-track-b { animation: lenderScrollB 72s linear infinite; }
    .lender-track-c { animation: lenderScrollC 68s linear infinite; }
    @keyframes lenderScrollA { from { transform: translateX(0); } to { transform: translateX(-50%); } }
    @keyframes lenderScrollB { from { transform: translateX(-50%); } to { transform: translateX(0); } }
    @keyframes lenderScrollC { from { transform: translateX(0); } to { transform: translateX(-50%); } }
    .lender-marquee:hover .lender-track { animation-play-state: paused; }
    .lender-logo {
      flex: none;
      width: 170px; height: 84px;
      display: flex; align-items: center; justify-content: center;
      padding: 12px 18px;
      border: 1px solid rgba(7,14,28,0.1);
      border-radius: 6px;
      background: rgba(255,255,255,0.58);
      overflow: hidden;
    }
    .lender-logo img {
      display: block;
      width: auto; height: auto;
      max-width: 124px; max-height: 46px;
      object-fit: contain;
    }
    .lender-logo span {
      font-family: var(--font-mono);
      font-size: 0.62rem; letter-spacing: 0.16em; text-transform: uppercase;
      color: rgba(7,14,28,0.34);
    }
    .lender-logo-fallback[hidden] { display: none; }
    .iz-sr-only {
      position: absolute;
      width: 1px; height: 1px;
      padding: 0; margin: -1px;
      overflow: hidden;
      clip: rect(0, 0, 0, 0);
      white-space: nowrap;
      border: 0;
    }
    .lender-foot {
      margin-top: 26px; text-align: center;
      font-family: var(--font-mono);
      font-size: 0.62rem; letter-spacing: 0.06em;
      color: rgba(7,14,28,0.5);
      max-width: 64ch; margin-left: auto; margin-right: auto;
    }
    @media (max-width: 560px) {
      .lender-logo { width: 132px; height: 66px; padding: 9px 14px; }
      .lender-logo img { max-width: 94px; max-height: 36px; }
    }
    @media (prefers-reduced-motion: reduce) {
      .lender-track-a, .lender-track-b, .lender-track-c { animation: none; }
      .lender-marquee { mask-image: none; -webkit-mask-image: none; overflow-x: auto; }
    }

    .overview-grid {
      display: grid; grid-template-columns: repeat(4, 1fr);
      gap: 20px; margin-top: 44px;
    }
    .overview-card {
      display: flex; flex-direction: column;
      padding: 30px 26px 26px;
      background: #fff;
      border: 1px solid rgba(7,14,28,0.1);
      border-radius: 6px; text-decoration: none;
      position: relative; overflow: hidden;
      box-shadow: 0 1px 2px rgba(7,14,28,0.04);
    }
    .overview-card::before {
      content:""; position:absolute; top:0; left:0; right:0; height:3px;
      background: var(--gold);
      transform: scaleX(0); transform-origin: left;
      transition: transform .55s cubic-bezier(.19,1,.22,1);
    }
    .overview-card:hover { transform: translateY(-6px); box-shadow: 0 26px 50px -22px rgba(7,14,28,0.4); border-color: rgba(201,163,90,0.4); }
    .overview-card:hover::before { transform: scaleX(1); }
    .overview-ico {
      width: 46px; height: 46px; border-radius: 12px;
      display: flex; align-items: center; justify-content: center;
      background: rgba(201,163,90,0.12); color: var(--gold);
      font-size: 1.15rem; margin-bottom: 18px;
    }
    .overview-card h3 {
      font-family: 'Fraunces','Instrument Serif',Georgia,serif;
      font-weight: 400; font-size: 1.15rem; color: #070e1c;
      margin: 0 0 10px; line-height: 1.2;
    }
    .overview-card > p { font-size: 0.95rem; line-height: 1.6; color: rgba(7,14,28,0.66); margin: 0 0 16px; }
    .ov-bullets { list-style: none; margin: 0 0 20px; padding: 0; }
    .ov-bullets li {
      position: relative; padding-left: 18px; margin-bottom: 7px;
      font-size: 0.82rem; line-height: 1.45; color: rgba(7,14,28,0.72);
    }
    .ov-bullets li::before {
      content: "→"; position: absolute; left: 0; top: 0;
      color: var(--gold); font-weight: 600;
    }
    .overview-link {
      margin-top: auto; font-weight: 600; font-size: 0.95rem;
      color: var(--gold); display: inline-flex; gap: 6px; transition: gap .3s ease;
    }
    .overview-card:hover .overview-link { gap: 11px; }
    @media (max-width: 980px){ .overview-grid { grid-template-columns: repeat(2,1fr); } }
    @media (max-width: 560px){ .overview-grid { grid-template-columns: 1fr; } }

    /* ══════════════════════════════════════════
       ABOUT — STORY · TEAM · TRUST
       ══════════════════════════════════════════ */
    .about-story {
      max-width: 820px; margin: 8px auto 0; text-align: center;
    }
    .about-story p {
      font-family: var(--font-accent);
      font-style: italic; font-weight: 300;
      font-size: clamp(1.4rem, 2.6vw, 1.75rem); line-height: 1.5;
      color: #f4ede0; margin: 0;
    }
    .about-story .as-sign {
      display: block; margin-top: 22px;
      font-family: 'JetBrains Mono', ui-monospace, monospace;
      font-style: normal; font-size: 0.72rem; letter-spacing: 0.18em;
      text-transform: uppercase; color: var(--gold);
    }

    .team-feature { display: grid; gap: 22px; margin-top: 12px; grid-template-columns: 1fr 1fr; }
    .team-member {
      display: grid; grid-template-columns: 150px 1fr; gap: 26px;
      padding: 30px; border-radius: 8px;
      background: rgba(244,237,224,0.045);
      border: 1px solid rgba(244,237,224,0.12);
    }
    .team-member:hover { border-color: rgba(201,163,90,0.4); background: rgba(244,237,224,0.07); transform: translateY(-4px); }
    .team-portrait {
      width: 150px; height: 180px; border-radius: 6px; position: relative; overflow: hidden;
      background:
        #16233f;
      display: flex; align-items: center; justify-content: center;
      border: 1px solid rgba(201,163,90,0.3);
    }
    .team-portrait .tp-mono {
      font-family: 'Fraunces','Instrument Serif',Georgia,serif;
      font-style: italic; font-size: 3.6rem; font-weight: 300;
      color: rgba(244,237,224,0.9);
    }
    .team-portrait .tp-tag {
      position: absolute; bottom: 8px; left: 0; right: 0; text-align: center;
      font-family: 'JetBrains Mono', ui-monospace, monospace;
      font-size: 0.62rem; letter-spacing: 0.18em; text-transform: uppercase;
      color: rgba(244,237,224,0.45);
    }
    .team-name { font-family: var(--font-accent); font-style: italic; font-weight:400; font-size: 1.75rem; color:#f4ede0; margin:0 0 4px; }
    .team-role { font-family:'JetBrains Mono',ui-monospace,monospace; font-size: 0.62rem; letter-spacing:0.1em; text-transform:uppercase; color:var(--gold); margin-bottom:14px; }
    .team-bio { font-size: 0.95rem; line-height:1.62; color:rgba(244,237,224,0.7); margin:0 0 16px; }
    /* [20 Jul] second bio paragraph — the casual/human aside. Slightly softer so
       the credentials paragraph leads, and this reads as the personal note. */
    .team-bio-aside { color: rgba(244,237,224,0.6); margin-top: -4px; }
    /* Vietinvest link — always gold + underlined so it's visibly clickable,
       not just on hover. Gold #c9a35a reads on the ink team section. */
    .team-bio a.bio-link {
      color: var(--gold) !important;
      text-decoration: underline !important;
      text-decoration-color: rgba(201,163,90,0.55) !important;
      text-underline-offset: 3px;
      transition: text-decoration-color .3s ease, color .3s ease;
    }
    .team-bio a.bio-link:hover {
      text-decoration-color: var(--gold) !important;
    }
    .team-creds { display:flex; flex-wrap:wrap; gap:7px; }
    .team-cred {
      font-size: 0.72rem; padding: 5px 11px; border-radius: 999px;
      background: rgba(201,163,90,0.1); border: 1px solid rgba(201,163,90,0.3);
      color: rgba(244,237,224,0.85); letter-spacing: 0.02em;
    }
    @media (max-width: 1000px){ .team-feature { grid-template-columns: 1fr; } }
    @media (max-width: 540px){ .team-member { grid-template-columns: 1fr; gap:18px; } .team-portrait { width:120px; height:140px; } }

    /* Trust / credentials band */
    .trust-band {
      margin-top: 40px; padding: 30px;
      border: 1px solid rgba(244,237,224,0.12); border-radius: 8px;
      background: rgba(244,237,224,0.04);
      display: grid; grid-template-columns: repeat(4,1fr); gap: 24px;
    }
    .trust-item { text-align: center; }
    .trust-item strong {
      display: block; font-family:'Fraunces','Instrument Serif',Georgia,serif;
      font-weight: 400; font-size: 2.2rem; color: var(--gold); line-height: 1;
      margin-bottom: 8px;
    }
    .trust-item span { font-size: 0.82rem; color: rgba(244,237,224,0.62); line-height: 1.4; }
    @media (max-width: 760px){ .trust-band { grid-template-columns: repeat(2,1fr); } }

    /* ══════════════════════════════════════════
       MEMBERS' CLUB (exclusive)
       ══════════════════════════════════════════ */
    .members-club {
      position: relative; margin-top: 44px;
      border-radius: 14px; overflow: hidden;
      background: #0c1730;
      border: 1px solid rgba(201,163,90,0.32);
      box-shadow: 0 40px 90px -40px rgba(0,0,0,0.7);
    }
    .members-club::before {
      content:""; position:absolute; inset:0;
      background-image:
        none;
      pointer-events:none;
    }
    .club-inner {
      position: relative; z-index: 2;
      display: grid; grid-template-columns: 1.05fr 0.95fr; gap: 0;
    }
    .club-left { padding: 52px 48px; }
    .club-badge {
      display: inline-flex; align-items: center; gap: 9px;
      font-family:'JetBrains Mono',ui-monospace,monospace;
      font-size: 0.62rem; letter-spacing: 0.18em; text-transform: uppercase;
      color: var(--gold); padding: 7px 14px;
      border: 1px solid rgba(201,163,90,0.4); border-radius: 999px;
      background: rgba(201,163,90,0.08); margin-bottom: 28px;
    }
    .club-lock { font-size: 0.72rem; }
    .club-title {
      font-family:'Fraunces','Instrument Serif',Georgia,serif;
      font-weight: 300; font-size: clamp(1.9rem, 3vw, 2.6rem); line-height: 1.08;
      color: #f4ede0; margin: 0 0 26px; letter-spacing: -0.01em;
    }
    .club-title em { font-family: var(--font-emphasis); font-style: italic; color: var(--gold); }
    .club-sub { font-size: 0.95rem; line-height: 1.62; color: rgba(244,237,224,0.7); margin: 0 0 22px; max-width: 460px; }
    .club-perks { list-style:none; margin:0 0 34px; padding:0; display:grid; gap:14px; }
    .club-perks li {
      position: relative; padding-left: 28px;
      font-size: 0.95rem; color: rgba(244,237,224,0.85);
      line-height: 1.55;
    }
    .club-perks li::before {
      content:"✦"; position:absolute; left:0; top:1px; color:var(--gold); font-size: 0.82rem;
    }
    .club-cta-row { display:flex; align-items:center; gap:24px; flex-wrap:wrap; }
    .club-cta { cursor:pointer; padding: 15px 28px !important; }
    .club-signin { color: rgba(244,237,224,0.72); font-size: 0.95rem; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(201,163,90,0.4); }
    .club-signin:hover { color: var(--gold); }
    .club-note { margin: 22px 0 0; font-size: 0.82rem; color: rgba(244,237,224,0.48); font-style: italic; line-height: 1.5; }

    /* Locked tools preview — creates curiosity */
    .club-right {
      position: relative; padding: 40px;
      border-left: 1px solid rgba(244,237,224,0.1);
      display: flex; flex-direction: column; justify-content: center;
    }
    .locked-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
    .locked-tool {
      position: relative; padding: 18px 16px;
      border-radius: 8px; border: 1px solid rgba(244,237,224,0.1);
      background: rgba(244,237,224,0.04);
      display: flex; flex-direction: column; gap: 8px; min-height: 92px;
      overflow: hidden; transition: all .45s cubic-bezier(.19,1,.22,1);
    }
    .locked-tool .lt-ico { font-size: 1.15rem; filter: grayscale(0.2); }
    .locked-tool .lt-name {
      font-size: 0.82rem; color: rgba(244,237,224,0.82); font-weight: 500;
      filter: blur(2.5px); user-select: none;
    }
    .locked-tool .lt-sub {
      font-size: 0.62rem; color: rgba(244,237,224,0.4);
      filter: blur(3px); line-height: 1.4;
    }
    .locked-tool .lt-lock {
      position: absolute; top: 12px; right: 12px;
      font-size: 0.72rem; opacity: 0.6;
    }
    .locked-tool::after {
      content:""; position:absolute; inset:0;
      background: rgba(5,10,20,0.25);
      pointer-events:none;
    }
    .locked-tool:hover {
      border-color: rgba(201,163,90,0.5); background: rgba(201,163,90,0.07);
      transform: translateY(-3px);
    }
    .locked-tool:hover .lt-lock { opacity: 1; color: var(--gold); }
    .club-velvet {
      margin-top: 18px; text-align: center;
      font-family:'JetBrains Mono',ui-monospace,monospace;
      font-size: 0.62rem; letter-spacing: 0.18em; text-transform: uppercase;
      color: #ffffff;
    }
    .club-velvet strong { color: var(--gold); }
    @media (max-width: 900px){
      .club-inner { grid-template-columns: 1fr; }
      .club-left { padding: 38px 30px 26px; }
      .club-right { border-left: none; border-top: 1px solid rgba(244,237,224,0.1); padding: 30px; }
    }

/* ══════════════════════════════════════════
       PART 10 — ONE-SCREEN FOLD · INVISIBLE-TEXT
       FIXES · CASE STUDIES · SOCIAL · MISSION ·
       SOFTER MOTION
       ══════════════════════════════════════════ */

    /* ── FOLD: hero + scarcity + trust within one screen ── */
    .hero {
      padding: 108px 0 28px !important;
      min-height: calc(100svh - 224px);   /* header≈88 + scarcity≈48 + trust≈88 */
      display: flex; align-items: center;
    }
    .hero-grid { gap: 56px !important; align-items: center; }
    .hero-kicker { margin-bottom: 16px !important; }
    .hero h1 {
      font-size: clamp(2.3rem, 4vw, 3.5rem) !important;
      line-height: 1.04 !important;
      margin-bottom: 16px !important;
    }
    .hero-lead {
      font-size: 1.03rem !important;
      line-height: 1.75 !important;
      margin-bottom: 18px !important;
      max-width: 50ch;
    }
    .hero-points, .featured-health-check, .financial-health-check {
      gap: 9px !important; margin-bottom: 0 !important;
    }
    .hero-point { padding: 10px 13px !important; font-size: 0.82rem !important; }
    .hero-dual-cta { margin-top: 20px !important; gap: 11px !important; }
    .hero-cta-primary { padding: 14px 26px !important; font-size: 0.95rem !important; }
    .hero-cta-secondary { padding: 12px 22px !important; font-size: 0.82rem !important; }
    .hero-cta-microcopy { margin-top: 2px !important; }
    /* compact hero card */
    .hero-card { padding: 28px 26px !important; }
    .hero-card .form-grid { gap: 11px !important; }

    /* scarcity slightly tighter */
    .scarcity-strip { padding: 11px 0 !important; }

    /* trust strip: compact single band */
    .trust-strip { padding: 18px 0 !important; }
    .trust-items { gap: 12px 22px !important; }
    .trust-item { font-size: 0.72rem !important; }

    @media (max-width: 920px) {
      .hero { min-height: 0; padding: 120px 0 48px !important; }
    }

    /* ══════════════════════════════════════════
       INVISIBLE-TEXT FIXES
       ══════════════════════════════════════════ */
    /* Home overview is on cream — force dark headings/body */
    .home-overview .section-head h2 { color: #070e1c !important; }
    .home-overview .section-head .lead { color: rgba(7,14,28,0.66) !important; }
    .overview-card { color: rgba(7,14,28,0.72); }

    /* About section is dark ink — bullets must be light */
    #about .section-bullets li { color: rgba(244,237,224,0.82) !important; }
    #about .section-bullets li::after { color: #070e1c; }

    /* ══════════════════════════════════════════
       CASE STUDIES — upgraded display
       ══════════════════════════════════════════ */
    .case-grid {
      display: grid; grid-template-columns: repeat(3, 1fr);
      gap: 22px; margin-top: 12px;
    }
    .case-card {
      position: relative; display: flex; flex-direction: column;
      padding: 30px 26px; border-radius: 8px;
      background: rgba(244,237,224,0.05);
      border: 1px solid rgba(244,237,224,0.12);
      overflow: hidden;
    }
    .case-card::before {
      content:""; position:absolute; top:0; left:0; right:0; height:3px;
      background: var(--gold);
      transform: scaleX(0); transform-origin:left;
      transition: transform .6s cubic-bezier(.19,1,.22,1);
    }
    .case-card:hover { transform: translateY(-5px); border-color: rgba(201,163,90,0.45);
      background: rgba(244,237,224,0.075); box-shadow: 0 26px 50px -22px rgba(0,0,0,0.55); }
    .case-card:hover::before { transform: scaleX(1); }
    .case-badge {
      align-self: flex-start;
      font-family:'JetBrains Mono',ui-monospace,monospace;
      font-size: 0.62rem; letter-spacing: 0.18em; text-transform: uppercase;
      color: var(--gold); padding: 6px 12px; border-radius: 999px;
      border: 1px solid rgba(201,163,90,0.35); background: rgba(201,163,90,0.08);
      margin-bottom: 18px;
    }
    .case-card > h3 {
      font-family:'Fraunces','Instrument Serif',Georgia,serif;
      font-weight: 400; font-size: 1.15rem; line-height: 1.25;
      color: #f4ede0 !important; margin: 0 0 20px;
    }
    .case-list { display: flex; flex-direction: column; gap: 0; }
    .case-item {
      position: relative; padding: 12px 0 12px 26px;
      font-size: 0.95rem; line-height: 1.5; color: rgba(244,237,224,0.72);
      border-left: 1px solid rgba(201,163,90,0.25); margin-left: 6px;
    }
    .case-item::before {
      content:""; position:absolute; left:-5px; top:17px;
      width: 9px; height: 9px; border-radius: 50%;
      background: var(--ink); border: 2px solid rgba(201,163,90,0.5);
    }
    .case-item:last-child::before { background: var(--gold); border-color: var(--gold); box-shadow: 0 0 10px rgba(201,163,90,0.5); }
    .case-item strong {
      display: block; font-family:'JetBrains Mono',ui-monospace,monospace;
      font-size: 0.62rem; letter-spacing: 0.18em; text-transform: uppercase;
      color: var(--gold) !important; margin-bottom: 4px; font-weight: 500;
    }
    .case-item:last-child { color: #f4ede0; }
    @media (max-width: 980px){ .case-grid { grid-template-columns: 1fr; } }

    /* ══════════════════════════════════════════
       SOCIAL ICONS (contact + success)
       ══════════════════════════════════════════ */
    .contact-social { margin-top: 30px; padding-top: 26px; border-top: 1px solid rgba(7,14,28,0.1); display: flex; align-items: center; justify-content: space-between; gap: 10px; }
    .contact-section .contact-social { border-color: rgba(7,14,28,0.12); }
    .contact-social-label { position: relative; display: inline-flex; align-items: center; gap: 8px; height: 42px; padding: 0 18px; overflow: hidden; font-family:'JetBrains Mono',ui-monospace,monospace; font-size: 0.72rem; letter-spacing: 0.18em; text-transform: uppercase; font-weight: 600; color: var(--ink, #070e1c); background: var(--gold); border-radius: 999px; text-decoration: none; box-shadow: 0 6px 22px rgba(201,163,90,0.22); transition: transform 0.35s cubic-bezier(.2,.7,.2,1), box-shadow 0.35s; }
    .contact-social-label .csl-txt { position: relative; z-index: 1; }
    .contact-social-label::before { content: ""; position: absolute; top: 0; left: -60%; width: 45%; height: 100%; background: linear-gradient(100deg, transparent, rgba(255,255,255,0.55), transparent); transform: skewX(-18deg); animation: izSubShimmer 3.4s ease-in-out infinite; }
    @keyframes izSubShimmer { 0% { left: -60%; } 55%, 100% { left: 130%; } }

    /* [17 Jul] The same shimmer, on the two Subscribe buttons — the newsletter
       section and the pop-up card. Arrow deliberately not brought along: this
       band IS the motion, an arrow would be a second thing moving.
       Same keyframes and same 3.4s as .contact-social-label, so the three can
       never drift apart. overflow:hidden is what clips the band to the pill. */
    .iz-shimmer { position: relative; overflow: hidden; }
    .iz-shimmer > * { position: relative; z-index: 1; }
    .iz-shimmer::before {
      content: ""; position: absolute; top: 0; left: -60%;
      width: 45%; height: 100%;
      background: linear-gradient(100deg, transparent, rgba(255,255,255,0.55), transparent);
      transform: skewX(-18deg);
      animation: izSubShimmer 3.4s ease-in-out infinite;
      z-index: 0; pointer-events: none;
    }
    @media (prefers-reduced-motion:reduce){ .iz-shimmer::before { animation: none; opacity: 0; } }
    @media (prefers-reduced-motion:reduce){ .contact-social-label::before { animation: none; opacity: 0; } }
    .social-row { display: flex; gap: 8px; }
    .social-ic { width: 42px; height: 42px; border-radius: 50%;
      display: inline-flex; align-items: center; justify-content: center;
      border: 1px solid rgba(7,14,28,0.18);
      color: #070e1c; background: rgba(7,14,28,0.03);
      transition: all .35s cubic-bezier(.19,1,.22,1);
    }
    .social-ic svg { width: 18px; height: 18px; fill: currentColor; }
    .social-ic:hover {
      transform: translateY(-3px);
      background: var(--gold); color: #070e1c; border-color: var(--gold);
      box-shadow: 0 12px 24px -8px rgba(201,163,90,0.55);
    }
    /* success-state social (on dark card) */
    .contact-success .social-ic { border-color: rgba(201,163,90,0.35); color: #f4ede0; background: rgba(244,237,224,0.06); }
    .contact-success .social-ic:hover { background: var(--gold); color: #070e1c; }
    .contact-success .social-row { justify-content: center; }
    .contact-success .contact-social { border-color: rgba(244,237,224,0.14); }

    /* ══════════════════════════════════════════
       MISSION band (home)
       ══════════════════════════════════════════ */
    .mission-section {
      background: var(--ink); position: relative; overflow: hidden;
      padding: 96px 0;
    }
    .mission-section::before {
      content:""; position:absolute; inset:0;
      background: none;
      pointer-events:none;
    }
    .mission-inner { position: relative; z-index: 2; max-width: 920px; margin: 0 auto; text-align: center; }
    .mission-eyebrow {
      display: inline-flex; align-items: center; gap: 12px;
      font-family: var(--font-mono);
      font-size: 0.72rem; letter-spacing: 0.18em; text-transform: uppercase;
      color: var(--eyebrow); margin-bottom: 28px;
    }
    .mission-eyebrow::before, .mission-eyebrow::after {
      content:""; width: 30px; height: 1px; background: rgba(201,163,90,0.5);
    }
    .mission-statement {
      font-family:'Fraunces','Instrument Serif',Georgia,serif;
      font-weight: 300; 
      font-size: clamp(1.5rem, 3.2vw, 2.5rem); line-height: 1.42;
      color: #f4ede0; margin: 0; letter-spacing: -0.01em;
    }
    .mission-statement em { color: var(--gold); font-family: var(--font-accent); font-style: italic; }

    /* ══════════════════════════════════════════
       SOFTER PAGE / NUMBER / TEXT MOTION
       ══════════════════════════════════════════ */
    .page { animation: pageReveal 0.85s cubic-bezier(.19,1,.22,1) both; }
    @keyframes pageReveal {
      from { opacity: 0; transform: translateY(18px); filter: blur(4px); }
      to   { opacity: 1; transform: none; filter: blur(0); }
    }
    /* gentle count-up flair */
    .count-target { display: inline-block; transition: color .4s ease; }
    /* soft hover on trust-band figures */
    .trust-band .trust-item strong { transition: transform .5s cubic-bezier(.19,1,.22,1); display:inline-block; }
    .trust-band .trust-item:hover strong { transform: translateY(-3px); }
  
    /* ── Mission signature ── */
    .mission-sign { margin-top: 34px; display: flex; flex-direction: column; align-items: center; gap: 6px; }
    .mission-sign-rule { width: 44px; height: 1px; background: linear-gradient(90deg, transparent, var(--gold), transparent); margin-bottom: 8px; }
    .mission-sign-name {
      font-family: var(--font-accent);
      font-style: italic; font-weight: 400; font-size: 1.75rem;
      color: #f4ede0; letter-spacing: 0.01em;
    }
    .mission-sign-role {
      font-family: 'JetBrains Mono', ui-monospace, monospace;
      font-size: 0.62rem; letter-spacing: 0.18em; text-transform: uppercase;
      color: var(--gold);
    }

    /* ── Mission headline + supporting statement ── */
    .mission-headline {
      /* NOT --font-accent. The "Display headings → Fraunces" rule further down
         this sheet also names .mission-headline — same specificity, declared
         later — so this line never applied. Stating the truth instead: the
         tagline is Fraunces italic, and heading emphasis now matches it. */
      font-family: var(--font-emphasis);
      font-weight: 300; font-style: italic;
      font-size: clamp(2.2rem, 4.9vw, 3.6rem); line-height: 1.12;
      letter-spacing: -0.015em; color: #f4ede0; margin: 0 0 22px;
    }
    .mission-headline em { font-style: italic; color: var(--gold); }
    .mission-section .mission-statement {
      font-family: 'Manrope', system-ui, sans-serif !important;
      font-style: normal !important; font-weight: 350 !important;
      font-size: clamp(1.02rem, 1.6vw, 1.22rem) !important;
      line-height: 1.62 !important; color: rgba(244,237,224,0.74) !important;
      max-width: 660px; margin: 0 auto !important;
    }
    @media (min-width:1040px){ .mission-section .mission-statement{ max-width:none !important; white-space:nowrap; } }

/* ══════════════════════════════════════════
       PART 11 — MEGA-MENU NAV · CONTRAST FIXES ·
       1-ROW NOTE · COMPACT SECTIONS · LIVE COST
       ══════════════════════════════════════════ */

    /* ── Mega-menu nav structure ── */
    .nav-links { gap: 0 !important; }
    .nav-item {
      position: relative;
      display: flex; align-items: center;
    }
    .nav-item > .nav-trigger {
      display: inline-flex; align-items: center; gap: 5px;
      padding: 8px 16px;
    }
    .nav-item > .nav-trigger::after {
      content: "▾";
      font-size: 0.62rem;
      opacity: 0.55;
      transition: transform .35s cubic-bezier(.19,1,.22,1), opacity .25s;
      margin-top: 1px;
    }
    .nav-item:hover > .nav-trigger::after,
    .nav-item:focus-within > .nav-trigger::after { transform: rotate(180deg); opacity: 1; }

    /* The dropdown — wrapped with transparent top padding as a hover bridge */
    .nav-dropdown {
      position: absolute; top: 100%; left: 50%;
      transform: translateX(-50%) translateY(-6px);
      padding-top: 14px;
      opacity: 0; pointer-events: none;
      transition: opacity .35s cubic-bezier(.19,1,.22,1),
                  transform .45s cubic-bezier(.19,1,.22,1);
      z-index: 250;
      will-change: opacity, transform;
    }
    .nav-item:hover .nav-dropdown,
    .nav-item:focus-within .nav-dropdown {
      opacity: 1; pointer-events: auto;
      transform: translateX(-50%) translateY(0);
    }
    .nav-dd-card {
      position: relative;
      background:
        #0a1730;
      border: 1px solid rgba(201,163,90,0.36);
      border-radius: 12px;
      padding: 26px 30px;
      box-shadow: 0 28px 70px -20px rgba(0,0,0,0.7),
                  0 0 0 1px rgba(201,163,90,0.06);
      min-width: 280px;
    }
    .nav-dd-card::before {
      content:""; position:absolute; top:-7px; left:50%;
      transform: translateX(-50%) rotate(45deg);
      width: 13px; height: 13px;
      background: #0a1730;
      border-left: 1px solid rgba(201,163,90,0.36);
      border-top: 1px solid rgba(201,163,90,0.36);
    }
    .nav-dd-card::after {
      content:""; position:absolute; top:0; left:0; right:0; height:2px;
      background: linear-gradient(90deg, transparent, var(--gold), transparent);
      border-radius: 12px 12px 0 0;
      opacity: 0.6;
    }
    .nav-dd-grid {
      display: grid;
      grid-template-columns: repeat(var(--cols, 2), minmax(240px, 1fr));
      gap: 22px 36px;
    }
    /* Home / Services / Approach / Resources share one width. */
    .nav-dd-grid.dd-w-std {
      grid-template-columns: repeat(var(--cols, 2), 260px);
      min-height: var(--dd-std-h, 176px);
      align-content: start;
    }
    .nav-dd-col { min-width: 0; }
    .nav-dd-h {
      font-family: 'JetBrains Mono', ui-monospace, monospace;
      font-size: 0.62rem; letter-spacing: 0.18em; text-transform: uppercase;
      color: var(--gold); margin: 0 0 12px;
      padding-bottom: 9px; border-bottom: 1px solid rgba(201,163,90,0.22);
      display: block;
    }
    .nav-dd-link {
      position: relative;
      display: block;
      padding: 7px 0 7px 0;
      color: rgba(244,237,224,0.82);
      font-family: 'Manrope', system-ui, sans-serif;
      font-size: 0.82rem; font-weight: 500;
      text-transform: none !important;
      letter-spacing: 0 !important;
      text-decoration: none; cursor: pointer; background: transparent; border: 0;
      text-align: left; width: 100%;
      transition: color .25s ease, padding-left .35s cubic-bezier(.19,1,.22,1);
    }
    .nav-dd-link::before, .nav-dd-action::before {
      content: ""; position: absolute; left: 0; top: 18px;
      width: 0; height: 1px; background: var(--gold);
      transition: width .35s cubic-bezier(.19,1,.22,1);
    }
    .nav-dd-link:hover, .nav-dd-action:hover {
      color: #f4ede0; padding-left: 18px;
    }
    .nav-dd-link:hover::before, .nav-dd-action:hover::before { width: 14px; }
    .nav-dd-link small, .nav-dd-action small {
      display: block;
      font-size: 0.62rem; font-weight: 400;
      color: rgba(244,237,224,0.5);
      line-height: 1.4; margin-top: 3px;
      letter-spacing: 0 !important;
      text-transform: none !important;
    }
    /* Exact copy of the corner / hero pill. Every value below is lifted from
       .btn + .nav-actions .btn + .nav-cta — do not drift from them.
       [16 Jul] Selector scoped to .nav-links: this is an <a> inside .nav-links,
       and `.nav-links a { font-size: .82rem }` (0,1,1) was outranking a bare
       `.nav-dd-cta` (0,1,0), so the pill rendered 0.82rem instead of the corner
       pill's 0.72rem. Don't unscope it. */
    .nav-links .nav-dd-cta,
    .nav-dd-cta {
      display: inline-flex; align-items: center; justify-content: center;
      gap: 8px;                       /* .nav-cta */
      margin-top: 14px;
      min-height: 44px;               /* .nav-actions .btn */
      padding: 11px 20px;             /* .nav-cta */
      border-radius: 999px;
      background: var(--gold);
      color: var(--ink) !important;
      font-family: var(--font-sans);  /* .btn */
      font-weight: 500;               /* .btn */
      font-size: 0.72rem;             /* .nav-actions .btn */
      letter-spacing: 0.14em;         /* .btn */
      text-transform: uppercase;      /* .btn */
      white-space: nowrap;
      text-decoration: none !important;
      cursor: pointer; border: 1px solid var(--gold);
      background-image: none !important;
      transition: transform .3s ease, box-shadow .3s ease;
    }
    /* hover handled by the shared .btn-primary/.nav-cta rule — see part 17 */
    .nav-dd-cta { width: 100%; box-sizing: border-box; justify-content: center; }
    .nav-dd-cta svg.nav-dd-phone { width: 13px; height: 13px; flex: none; }
    /* [16 Jul] EXACT copy of the top-right button — same class, same padding,
       same type, same lock. The only changes are the ones that would otherwise
       break it in this context: the nav breakpoint hides the corner button, and
       margin-right is for sitting beside the CTA in the corner. Nothing about
       the button itself is touched. */
    /* [17 Jul · SIGNED OFF] ONE FORMAT FOR EVERY CTA PILL IN A DROPDOWN.
       Text size, text font, tracking, case, padding, height, width — identical
       across .nav-dd-cta (gold), .nav-dd-action (ghost) and this one. It was
       JetBrains Mono 0.62rem here (inherited from the corner button) against
       Manrope 0.72rem on the others, so it read a size smaller than the pill
       above it. The corner button keeps its own mono identity; inside a
       dropdown, consistency with its neighbours wins. */
    .nav-dd-col .nav-client-login {
      display: flex !important;
      width: 100%;
      box-sizing: border-box;
      justify-content: center;
      min-height: 44px;
      padding: 11px 20px;
      margin: 14px 0 0;
      font-family: var(--font-sans) !important;
      font-size: 0.72rem !important;
      font-weight: 500 !important;
      letter-spacing: 0.14em !important;
      text-transform: uppercase !important;
      gap: 8px;
    }
    .nav-dd-col .nav-client-login .nav-client-login-label {
      font: inherit !important;
      letter-spacing: inherit !important;
      text-transform: inherit !important;
    }
    .nav-dd-col .nav-client-login-lock { width: 13px; height: 13px; flex: none; }
    /* the gold pill in a dropdown column fills it too */
    .nav-dd-col .nav-dd-cta { width: 100%; box-sizing: border-box; }
    .nav-dd-col .nav-client-login-chev { display: none; }
    .cta-phone { width: 1.15em; height: 1.15em; flex: none; vertical-align: -0.15em; }
    @keyframes ctaAttn { 0%,100% { filter: drop-shadow(0 0 0 rgba(201,163,90,0)); } 50% { filter: drop-shadow(0 0 7px rgba(201,163,90,0.55)); } }
    /* [16 Jul] .nav-dd-cta removed: the corner "Book a strategy call" sits an
       inch away and does not pulse. Two identical pills, one throbbing. */
    .sticky-cta, .final-cta .btn-primary, .hero-cta-primary { animation: ctaAttn 3s ease-in-out infinite; }
    /* Ghost pill — same type as the gold one above, .btn-secondary's outline.
       Was JetBrains Mono 700 / 0.03em, which matched no button on the site. */
    .nav-dd-action {
      display: inline-flex !important; align-items: center; justify-content: center;
      gap: 8px !important;
      width: 100% !important; box-sizing: border-box !important;
      margin-top: 14px !important;
      min-height: 44px !important;
      padding: 11px 20px !important; border-radius: 999px !important;
      background: transparent !important;
      border: 1px solid rgba(201,163,90,0.5) !important;
      color: rgba(244,237,224,0.9) !important;
      font-family: var(--font-sans) !important;
      font-size: 0.72rem !important; font-weight: 500 !important;
      letter-spacing: 0.14em !important; text-transform: uppercase !important;
      text-align: center !important; line-height: 1; white-space: nowrap !important;
      transition: border-color .3s ease, color .3s ease;
    }
    .nav-dd-action::before { display: none !important; }
    .nav-dd-action:hover { border-color: var(--gold) !important; color: var(--gold) !important; }
    .nav-dd-col .iz-nav-account {
      width: 100% !important; box-sizing: border-box !important;
      justify-content: center !important;
      margin: 4px 0 0 0 !important;
      padding: 9px 12px !important; border-radius: 999px !important;
      background: transparent !important;
      border: 1px solid rgba(201,163,90,0.5) !important;
      font-family: 'JetBrains Mono', ui-monospace, monospace !important;
      font-size: 0.62rem !important; font-weight: 700 !important;
      letter-spacing: 0.03em !important; text-transform: uppercase !important;
      color: rgba(244,237,224,0.9) !important;
    }
    .nav-dd-col .iz-nav-account:hover { border-color: var(--gold) !important; color: var(--gold) !important; background: transparent !important; }
    .nav-dd-col .iz-nav-avatar { display: none !important; }
    .nav-dd-col .iz-nav-account .iz-nav-account-label,
    .nav-dd-col .iz-nav-account .iz-nav-account-label::before {
      font-family: 'JetBrains Mono', ui-monospace, monospace !important;
      font-size: 0.62rem !important; font-weight: 700 !important;
      letter-spacing: 0.03em !important; text-transform: uppercase !important;
      color: inherit !important; line-height: 1 !important;
    }

    /* Hide dropdowns on tablet/mobile (the existing mobile menu handles it) */
    @media (max-width: 1100px) { .nav-dropdown { display: none; } }

    /* Edge-aware: shift early/late items so dropdowns don't overflow viewport */
    .nav-item.dd-align-left .nav-dropdown { left: 0; transform: translateX(0) translateY(-6px); }
    .nav-item.dd-align-left:hover .nav-dropdown,
    .nav-item.dd-align-left:focus-within .nav-dropdown { transform: translateX(0) translateY(0); }
    .nav-item.dd-align-left .nav-dd-card::before { left: 24px; }
    .nav-item.dd-align-right .nav-dropdown { left: auto; right: 0; transform: translateX(0) translateY(-6px); }
    .nav-item.dd-align-right:hover .nav-dropdown,
    .nav-item.dd-align-right:focus-within .nav-dropdown { transform: translateX(0) translateY(0); }
    .nav-item.dd-align-right .nav-dd-card::before { left: auto; right: 24px; }

    /* ══════════════════════════════════════════
       CONTRAST FIXES (dark-on-dark)
       ══════════════════════════════════════════ */
    .service-card.featured-service .service-mini-list li {
      color: rgba(244,237,224,0.82) !important;
    }
    .service-card.featured-service .service-mini-list li::marker { color: var(--gold); }
    #start-here .section-bullets li { color: rgba(244,237,224,0.82) !important; }
    #start-here .section-bullets li::after { color: #070e1c; }

    /* ══════════════════════════════════════════
       JOURNEY SPINE NOTE — one row on desktop
       ══════════════════════════════════════════ */
    .journey-spine-note {
      max-width: none !important;
      white-space: nowrap;
      font-size: clamp(0.78rem, 1.15vw, 0.92rem) !important;
    }
    @media (max-width: 980px) {
      .journey-spine-note { white-space: normal; max-width: 620px !important; margin-left:auto; margin-right:auto; }
    }

    /* ══════════════════════════════════════════
       COMPACT SECTIONS — who-we-help, cost-of-waiting (insight-banner),
       value-of-advice. Trim vertical padding and head margins.
       ══════════════════════════════════════════ */
    #who-we-help, #insight-banner, #value-advice {
      padding-top: 64px !important;
      padding-bottom: 64px !important;
    }
    #who-we-help .section-head,
    #insight-banner .section-head,
    #value-advice .section-head {
      margin-bottom: 30px !important;
    }
    #who-we-help .section-head .lead,
    #value-advice .section-head .lead { margin-bottom: 0 !important; }
    /* Tighten cards within these sections */
    #who-we-help .audience-grid,
    #who-we-help .audience-cards { gap: 16px !important; margin-top: 8px !important; }
    #insight-banner .container { gap: 24px; }
    #value-advice .voa-site-grid { gap: 16px !important; margin-top: 8px !important; margin-bottom: 36px !important; }
    #value-advice .voa-principles { gap: 14px !important; margin-bottom: 40px !important; }
    #value-advice .voa-subsection-head { margin-top: 28px !important; margin-bottom: 20px !important; }
    #value-advice .voa-client-segments,
    #value-advice .voa-abcet-cards { gap: 14px !important; }
    #value-advice .voa-segments-source { margin-top: 14px !important; }

    /* ══════════════════════════════════════════
       TIME-SENSITIVE strip in cost-of-waiting (#insight-banner)
       ══════════════════════════════════════════ */
    .cow-live {
      display: inline-flex; align-items: center; gap: 12px; flex-wrap: wrap;
      padding: 10px 18px;
      background: rgba(7,14,28,0.55);
      border: 1px solid rgba(201,163,90,0.36);
      border-radius: 999px;
      margin: 0 auto 26px;
      max-width: 100%;
    }
    .cow-live-dot {
      width: 8px; height: 8px; border-radius: 50%;
      background: #ff7e4d;
      box-shadow: 0 0 0 0 rgba(255,126,77,0.65);
      animation: cowPulse 1.4s infinite cubic-bezier(.66,0,.34,1);
      flex-shrink: 0;
    }
    @keyframes cowPulse {
      0%   { box-shadow: 0 0 0 0 rgba(255,126,77,0.55); }
      70%  { box-shadow: 0 0 0 14px rgba(255,126,77,0); }
      100% { box-shadow: 0 0 0 0 rgba(255,126,77,0); }
    }
    .cow-live-label {
      font-family:'JetBrains Mono',ui-monospace,monospace;
      font-size: 0.62rem; letter-spacing: 0.18em; text-transform: uppercase;
      color: #ff7e4d; font-weight: 600;
    }
    .cow-live-sep { color: rgba(244,237,224,0.25); }
    .cow-live-msg {
      font-size: 0.82rem; color: rgba(244,237,224,0.85);
      font-family:'Manrope',system-ui,sans-serif;
    }
    .cow-live-msg strong { color: var(--gold); font-weight: 700; }
    .cow-tick { font-variant-numeric: tabular-nums; display: inline-block; min-width: 5ch; transition: color .3s ease; }
    .cow-live-center { display: flex; justify-content: center; }

    /* ══════════════════════════════════════════
       PAGE-LEVEL motion polish: nav itself slides in
       ══════════════════════════════════════════ */
    .nav-links .nav-item > .nav-trigger,
    .nav-links .nav-item.active > .nav-trigger {
      transition: color .35s cubic-bezier(.19,1,.22,1);
    }

/* ══════════════════════════════════════════
       PART 12 — VOA COMPACTNESS · CAREER SECTION
       ══════════════════════════════════════════ */

    /* ── VOA layout fixes ── */
    /* The site-grid only has 2 cards — it should be 2 columns, not 3 */
    #value-advice .voa-site-grid {
      grid-template-columns: 1fr 1fr !important;
      gap: 18px !important;
      max-width: none !important;
      margin: 14px 0 32px !important;
    }
    /* Principles: 8 items → 4 columns × 2 rows (was 3 × ~3, wasted space) */
    #value-advice .voa-principles {
      grid-template-columns: repeat(4, 1fr) !important;
      gap: 14px !important;
      margin-bottom: 36px !important;
    }
    /* Tighten card padding across the section */
    #value-advice .voa-feature-card,
    #value-advice .voa-principle,
    #value-advice .voa-seg,
    #value-advice .voa-letter {
      padding: 22px 22px !important;
    }
    #value-advice .voa-feature-card h3,
    #value-advice .voa-feature-card h4 {
      font-size: 1.15rem !important;
      margin-bottom: 10px !important;
    }
    #value-advice .voa-feature-card p {
      font-size: 0.95rem !important;
      line-height: 1.55 !important;
      margin-bottom: 14px !important;
    }
    #value-advice .voa-kpi-row { gap: 12px !important; margin: 12px 0 14px !important; }
    #value-advice .voa-kpi { padding: 12px !important; }
    #value-advice .voa-kpi b { font-size: 1.4rem !important; }
    #value-advice .voa-kpi span { font-size: 0.62rem !important; letter-spacing: 0.12em !important; line-height: 1.4 !important; margin-top: 4px !important; }
    #value-advice .voa-note-box {
      margin-top: 10px !important;
      padding: 11px 14px !important;
      font-size: 0.82rem !important;
      line-height: 1.55 !important;
    }
    /* Principle cards: tighter */
    #value-advice .voa-principle { padding: 20px 20px !important; }
    #value-advice .voa-principle h3,
    #value-advice .voa-principle h4 { font-size: 0.95rem !important; margin-bottom: 8px !important; }
    #value-advice .voa-principle p { font-size: 0.82rem !important; line-height: 1.5 !important; margin-bottom: 0 !important; }
    #value-advice .voa-principle .voa-tag {
      margin-top: 14px !important; font-size: 0.62rem !important;
    }
    /* Segments (8) — 4 cols too */
    #value-advice .voa-client-segments {
      grid-template-columns: repeat(4, 1fr) !important;
      gap: 14px !important;
    }
    #value-advice .voa-seg { padding: 20px 20px !important; }
    #value-advice .voa-seg h3,
    #value-advice .voa-seg h4 { font-size: 0.95rem !important; margin-bottom: 8px !important; }
    #value-advice .voa-seg p { font-size: 0.82rem !important; line-height: 1.5 !important; }
    /* ABCET cards: keep 5 cols, tighter */
    #value-advice .voa-abcet-cards { grid-template-columns: repeat(5, 1fr) !important; gap: 12px !important; }
    #value-advice .voa-letter { padding: 22px 16px !important; }
    /* Subsection heads — tighter */
    #value-advice .voa-subsection-head { margin: 96px 0 18px !important; }
    #value-advice .voa-subsection-head h3 { font-size: 1.4rem !important; margin-bottom: 8px !important; }
    #value-advice .voa-subsection-head p { font-size: 0.95rem !important; line-height: 1.55 !important; max-width: 760px; margin: 0 auto; }
    /* Source notes — small */
    #value-advice .voa-segments-source {
      margin-top: 12px !important;
      font-size: 0.82rem !important;
      line-height: 1.55 !important;
    }
    /* Responsive */
    @media (max-width: 1100px) {
      #value-advice .voa-principles,
      #value-advice .voa-client-segments { grid-template-columns: repeat(2, 1fr) !important; }
      #value-advice .voa-abcet-cards { grid-template-columns: repeat(2, 1fr) !important; }
    }
    @media (max-width: 720px) {
      #value-advice .voa-site-grid,
      #value-advice .voa-principles,
      #value-advice .voa-client-segments,
      #value-advice .voa-abcet-cards { grid-template-columns: 1fr !important; }
    }

    /* ══════════════════════════════════════════
       CAREERS section
       ══════════════════════════════════════════ */
    .careers-section {
      background: var(--bg-soft, #f4ede0);
      padding: 84px 0;
      position: relative;
    }
    .careers-section::before {
      content: ""; position: absolute; top: 0; left: 0; right: 0; height: 1px;
      background: linear-gradient(90deg, transparent, rgba(201,163,90,0.4), transparent);
    }
    .careers-grid {
      display: grid; grid-template-columns: 0.95fr 1fr;
      gap: 60px; align-items: start;
    }
    .careers-intro .eyebrow {
      margin-bottom: 22px;
    }
    .careers-h2 {
      font-family: 'Fraunces','Instrument Serif',Georgia,serif;
      font-weight: 300;
      font-size: clamp(1.8rem, 3vw, 2.4rem);
      line-height: 1.12; letter-spacing: -0.015em;
      color: #070e1c; margin: 0 0 18px;
    }
    .careers-h2 em { color: var(--gold); font-family: var(--font-emphasis); font-style: italic; }
    .careers-section .lead {
      font-size: 0.95rem !important; line-height: 1.65 !important;
      color: rgba(7,14,28,0.72) !important; margin: 0 0 18px !important;
    }
    .careers-tag-line {
      font-family: var(--font-accent);
      font-style: italic; font-size: 1.15rem; line-height: 1.55;
      color: rgba(7,14,28,0.62);
      margin: 0; padding-left: 18px;
      border-left: 2px solid var(--gold);
    }
    .careers-h {
      display: block;
      font-family: 'JetBrains Mono', ui-monospace, monospace;
      font-size: 0.62rem; letter-spacing: 0.18em; text-transform: uppercase;
      color: var(--gold); margin: 4px 0 18px;
      padding-bottom: 10px;
      border-bottom: 1px solid rgba(201,163,90,0.3);
    }
    .careers-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; }
    .careers-list li {
      position: relative; padding-left: 26px;
      font-size: 0.95rem; line-height: 1.6;
      color: rgba(7,14,28,0.78);
    }
    .careers-list li::before {
      content: "◆"; position: absolute; left: 0; top: 0;
      color: var(--gold); font-size: 0.72rem;
    }
    .careers-list li strong { color: #070e1c; font-weight: 600; }
    .careers-cta-row {
      margin-top: 28px; display: flex; flex-direction: column; align-items: flex-start; gap: 14px;
    }
    .careers-cta {
      display: inline-flex !important; align-items: center; gap: 8px;
      padding: 14px 24px !important;
      font-family: 'JetBrains Mono', ui-monospace, monospace !important;
      font-size: 0.82rem !important; letter-spacing: 0.06em !important;
    }
    .careers-note {
      margin: 0; font-size: 0.82rem; line-height: 1.6;
      color: rgba(7,14,28,0.55); font-style: italic;
      max-width: 440px;
    }
    @media (max-width: 900px) {
      .careers-grid { grid-template-columns: 1fr; gap: 40px; }
    }
    @media (max-width: 560px) {
      .careers-section { padding: 60px 0; }
    }

/* ══════════════════════════════════════════
       PART 13 — KEYWORD HIGHLIGHT · IN-CARD COW
       LIVE · TOOLS EXCLUSIVITY · COMPLIANCE LINKS
       ══════════════════════════════════════════ */

    /* ── Keyword highlighter (marker-pen effect) ── */
    .kw {
      font-weight: 600;
      color: inherit;
      background-image: none;
      background-repeat: no-repeat;
      padding: 0 2px;
      transition: background-color .4s ease;
      box-decoration-break: clone;
      -webkit-box-decoration-break: clone;
    }
    /* On dark backgrounds, a touch stronger so it still reads */
    .stage-pricing-section .kw,
    .mission-section .kw,
    #about .kw,
    #insight-banner .kw,
    .testimonial-card .kw,
    .voa-feature-card .kw,
    #value-advice .kw,
    #services .kw {
      background-image: none;
    }
    .kw:hover {
      background-image: none;
    }

    /* ── Cost-of-waiting LIVE strip — now inside the chart card ── */
    .cow-live-inside {
      display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
      margin: 0 0 18px 0;
      padding: 9px 14px;
      background: rgba(255,126,77,0.08);
      border: 1px solid rgba(255,126,77,0.32);
      border-radius: 8px;
      font-size: 0.82rem;
    }
    .cow-live-inside .cow-live-msg { font-size: 0.82rem; }
    .cw2-card { padding-top: 18px !important; }

    /* ── Scorecard "Run our proprietary" emphasis ── */
    #scorecard h2 em {
      font-family: var(--font-emphasis); font-style: italic; color: var(--gold);
    }

    /* ── Tools section "Members Only" exclusivity styling ── */
    #tools .section-head h2 em {
      color: var(--gold); font-family: var(--font-emphasis); font-style: italic;
    }

    /* ── About story signature includes "Est. 2018" ── */
    .about-story .as-sign { letter-spacing: 0.14em; }

    /* ── Footer "Established 2018" emphasis ── */
    footer strong { color: var(--gold); font-weight: 600; }
    .footer-verify-link {
      color: rgba(244,237,224,0.78) !important;
      text-decoration: underline; text-underline-offset: 2px;
      text-decoration-color: rgba(201,163,90,0.45);
      transition: color .3s ease;
    }
    .footer-verify-link:hover { color: var(--gold) !important; }

    /* ── Compliance "verify" links — small gold action chips ── */
    .fc-verify-row {
      display: flex; gap: 10px; flex-wrap: wrap;
      margin-top: 8px !important;
    }
    .fc-verify {
      display: inline-flex; align-items: center;
      font-family: 'JetBrains Mono', ui-monospace, monospace;
      font-size: 0.62rem; letter-spacing: 0.08em;
      color: var(--gold) !important;
      padding: 5px 10px; border-radius: 999px;
      border: 1px solid rgba(201,163,90,0.36);
      background: rgba(201,163,90,0.06);
      text-decoration: none !important;
      transition: all .3s ease;
    }
    .fc-verify:hover {
      background: rgba(201,163,90,0.14);
      border-color: var(--gold);
      transform: translateY(-1px);
    }
    .footer-compliance p { margin: 0 0 8px !important; }
    .footer-compliance strong { color: var(--gold); font-weight: 600; }
    .footer-compliance p:last-child { margin-bottom: 0 !important; }

/* ══════════════════════════════════════════
       PART 14 — LAYOUT COMPACTNESS · ALIGNMENT ·
       MEMBERS-CLUB SPACING · MAILTO STYLING
       ══════════════════════════════════════════ */

    /* ── 3. Who We Help — 4 in a row on desktop ── */
    #who-we-help .audience-grid {
      grid-template-columns: repeat(4, 1fr) !important;
      gap: 18px !important;
    }
    #who-we-help .audience-card {
      padding: 28px 22px !important;
    }
    #who-we-help .audience-card h3 {
      font-size: 1.15rem !important;
      margin-bottom: 10px !important;
    }
    #who-we-help .audience-card p {
      font-size: 0.82rem !important;
      line-height: 1.55 !important;
    }
    #who-we-help .audience-card .icon {
      margin-bottom: 20px !important;
    }
    @media (max-width: 1100px) {
      #who-we-help .audience-grid { grid-template-columns: repeat(2, 1fr) !important; }
    }
    @media (max-width: 560px) {
      #who-we-help .audience-grid { grid-template-columns: 1fr !important; }
    }

    /* ── 4. Cost of Waiting — restructured layout ── */
    #insight-banner .cow-restructured {
      display: block !important;     /* override existing grid layout */
      width: 100%;
      position: relative;
    }
    .cow-head {
      display: flex; align-items: flex-start; justify-content: space-between;
      gap: 20px; margin-bottom: 14px;
    }
    .cow-head-text { flex: 1; min-width: 0; }
    .cow-head-text .eyebrow { margin-bottom: 10px; }
    .cow-head-text h2 { margin: 0 0 8px !important; font-size: 1.75rem !important; line-height: 1.15 !important; letter-spacing: -0.02em !important; }
    .cow-head-text p { margin: 0; font-size: 0.82rem !important; }
    /* LIVE strip in the top-right corner */
    .cow-live.cow-live-corner {
      display: inline-flex; align-items: center; gap: 9px; flex-wrap: nowrap;
      padding: 8px 14px; border-radius: 999px;
      background: rgba(255,126,77,0.10);
      border: 1px solid rgba(255,126,77,0.42);
      flex-shrink: 0; max-width: 380px;
      font-size: 0.72rem;
    }
    .cow-live.cow-live-corner .cow-live-label { font-size: 0.62rem; letter-spacing: 0.16em; }
    .cow-live.cow-live-corner .cow-live-msg { font-size: 0.72rem; line-height: 1.4; }
    @media (max-width: 980px) {
      .cow-head { flex-direction: column-reverse; align-items: stretch; }
      .cow-live.cow-live-corner { align-self: flex-start; }
    }

    /* 1-row layout: 3 trigger cards + 1 impact card */
    .cow-row {
      display: grid;
      grid-template-columns: 1fr 1fr 1fr 1.15fr;
      gap: 12px;
      align-items: stretch;
    }
    .cow-card {
      background: rgba(255,255,255,0.04);
      border: 1px solid rgba(255,255,255,0.1);
      border-radius: 6px;
      padding: 16px 18px;
      display: flex; flex-direction: column;
      justify-content: center;
      transition: border-color .4s ease, transform .4s ease;
    }
    .cow-card:hover { border-color: rgba(201,163,90,0.4); transform: translateY(-3px); }
    .cow-trigger {
      justify-content: center;
      min-height: 0;
    }
    .cow-trigger p {
      margin: 0; font-size: 0.82rem; line-height: 1.45;
      color: rgba(255,255,255,0.88);
      font-weight: 500;
    }
    .cow-trigger::before {
      content: ""; width: 22px; height: 1px;
      background: var(--gold); opacity: 0.65;
      margin-bottom: 10px;
    }
    /* impact card stays top-aligned so its CTA pins at the bottom */
    .cow-impact { justify-content: flex-start; padding: 14px 18px; }
    .cow-impact .illustrative-impact-card {
      font-size: 0.62rem !important; letter-spacing: 0.14em !important;
      text-transform: uppercase; color: var(--gold) !important;
      font-weight: 600; margin: 0 0 8px !important;
      background: transparent !important; border: none !important; padding: 0 !important;
    }
    .cow-impact .stat-num {
      font-family: 'Fraunces','Instrument Serif',Georgia,serif !important;
      font-size: 1.75rem !important;
      color: var(--gold) !important;
      margin: 0 0 6px !important; line-height: 1 !important;
       font-weight: 300;
    }
    .cow-impact > p {
      font-size: 0.82rem !important; line-height: 1.45 !important;
      color: rgba(255,255,255,0.7) !important; margin: 0 0 10px !important;
    }
    .cow-impact .btn {
      padding: 10px 16px !important; font-size: 0.82rem !important;
      width: 100% !important;
    }
    @media (max-width: 1100px) {
      .cow-row { grid-template-columns: repeat(2, 1fr); }
    }
    @media (max-width: 600px) {
      .cow-row { grid-template-columns: 1fr; }
    }

    /* ── 5. "What clients really pay for" — 2×2 grid ── */
    .voa-clients-pay-for .voa-value-list {
      display: grid !important;
      grid-template-columns: 1fr 1fr;
      gap: 14px;
      font-style: normal !important;
      text-align: left !important;
      max-width: none !important;
      margin: 16px 0 0 !important;
    }
    .voa-clients-pay-for .tick-item {
      display: grid !important;
      grid-template-columns: auto 1fr;
      gap: 14px; align-items: start !important;
      padding: 18px 18px !important;
      background: rgba(7,14,28,0.025);
      border: 1px solid rgba(7,14,28,0.07);
      border-radius: 6px;
      transition: border-color 0.4s ease, background 0.4s ease;
    }
    .voa-clients-pay-for .tick-item:hover {
      border-color: rgba(201,163,90,0.45);
      background: rgba(201,163,90,0.04);
    }
    .voa-clients-pay-for .tick-item .tick {
      width: 28px; height: 28px; border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      background: rgba(201,163,90,0.14);
      color: var(--gold); font-weight: 700; font-size: 0.82rem;
      flex-shrink: 0;
      margin-top: 2px;
    }
    .voa-clients-pay-for .tick-item > div {
      text-align: left; line-height: 1.5;
    }
    .voa-clients-pay-for .tick-item strong {
      display: block;
      font-family: 'Fraunces', 'Instrument Serif', Georgia, serif !important;
      font-style: normal !important;
      font-size: 1.15rem; font-weight: 400;
      color: var(--ink, #070e1c);
      margin-bottom: 4px;
      letter-spacing: -0.005em;
    }
    .voa-clients-pay-for .tick-item .muted {
      font-family: 'Manrope', system-ui, sans-serif;
      font-style: normal !important;
      font-size: 0.82rem;
      color: rgba(7,14,28,0.68);
      line-height: 1.5;
    }
    @media (max-width: 600px) {
      .voa-clients-pay-for .voa-value-list {
        grid-template-columns: 1fr;
      }
    }

    /* ── 6. Members club — spacing to category cards below ── */
    .members-club {
      margin-bottom: 56px !important;
    }
    /* Add a clear separator between the club panel and the category cards */
    .members-club + * {
      margin-top: 16px !important;
    }

    /* ── 2. Email link styling ── */
    .email-link {
      color: var(--gold);
      text-decoration: underline;
      text-underline-offset: 2px;
      text-decoration-color: rgba(201,163,90,0.5);
      transition: color .3s ease, text-decoration-color .3s ease;
    }
    .email-link:hover {
      color: #d8b878;
      text-decoration-color: var(--gold);
    }
    /* Compliance/footer email links retain their special palette */
    .footer-compliance .email-link,
    footer .email-link { color: inherit; text-decoration-color: rgba(201,163,90,0.45); }

    /* Make the contact email row visibly clickable */
    .contact-detail-value .email-link {
      display: inline-block;
      font-weight: 500;
    }

/* ══════════════════════════════════════════
       PART 15 — CAREERS BUTTON · COOKIE BANNER ·
       MEGA-MENU SIMPLIFICATION · MOTION POLISH
       ══════════════════════════════════════════ */

    /* ── Careers CTA — ensure email is readable (was gold-on-gold) ── */
    .careers-cta {
      text-transform: none !important;
      color: #070e1c !important;
      font-family: 'Manrope', system-ui, sans-serif !important;
      font-size: 0.82rem !important;
      font-weight: 600 !important;
      letter-spacing: 0.01em !important;
    }
    .careers-cta:hover { color: #070e1c !important; }
    /* Email-link styling should never override a button */
    .btn.email-link, .careers-cta.email-link {
      color: #070e1c !important;
      text-decoration: none !important;
    }

    /* ── Mega-menu: tighter spacing now that <small> descriptions are gone ── */
    .nav-dd-card { padding: 22px 26px !important; }
    /* Links only. .nav-dd-action was in here too, which forced the ghost pill
       to 0.82rem and zero padding — it is a pill, not a link. */
    .nav-dd-link {
      padding: 8px 0 !important;
      font-size: 0.82rem !important;
    }
    .nav-dd-h { margin-bottom: 10px !important; padding-bottom: 8px !important; }
    .nav-dd-grid { gap: 18px 32px !important; }

    /* ══════════════════════════════════════════
       COOKIE BANNER
       ══════════════════════════════════════════ */
    .cookie-banner {
      position: fixed; left: 16px; right: 16px; bottom: 16px;
      z-index: 9000;
      opacity: 0; transform: translateY(20px);
      transition: opacity .5s cubic-bezier(.19,1,.22,1), transform .55s cubic-bezier(.19,1,.22,1);
      pointer-events: none;
      max-width: 100%;
      margin: 0 auto;
    }
    .cookie-banner.visible { opacity: 1; transform: translateY(0); pointer-events: auto; }
    .cookie-banner-inner {
      display: grid; grid-template-columns: 1fr auto;
      gap: 22px; align-items: center;
      background: #0a1730;
      border: 1px solid rgba(201,163,90,0.36);
      border-radius: 12px;
      padding: 18px 24px;
      box-shadow: 0 24px 60px -16px rgba(0,0,0,0.65);
      color: rgba(244,237,224,0.9);
      font-family: 'Manrope', system-ui, sans-serif;
    }
    .cookie-banner-text strong {
      display: inline; color: var(--gold);
      font-family: 'JetBrains Mono', ui-monospace, monospace;
      font-size: 0.62rem; letter-spacing: 0.18em; text-transform: uppercase;
      margin-right: 8px;
    }
    .cookie-banner-text span {
      font-size: 0.82rem; line-height: 1.55;
      color: rgba(244,237,224,0.78);
    }
    .cookie-banner-actions { display: flex; gap: 10px; flex-shrink: 0; }
    .cookie-btn {
      cursor: pointer; border: 1px solid; padding: 10px 18px;
      border-radius: 999px;
      font-family: 'JetBrains Mono', ui-monospace, monospace;
      font-size: 0.72rem; letter-spacing: 0.08em; text-transform: uppercase;
      transition: all .3s ease;
    }
    .cookie-decline {
      background: transparent; color: rgba(244,237,224,0.8);
      border-color: rgba(244,237,224,0.25);
    }
    .cookie-decline:hover {
      color: #f4ede0; border-color: rgba(244,237,224,0.5);
    }
    .cookie-accept {
      background: var(--gold); color: #070e1c;
      border-color: var(--gold);
    }
    .cookie-accept:hover {
      background: #d8b878; border-color: #d8b878;
      transform: translateY(-1px);
      box-shadow: 0 8px 20px -6px rgba(201,163,90,0.45);
    }
    @media (max-width: 720px) {
      .cookie-banner-inner { grid-template-columns: 1fr; gap: 14px; }
      .cookie-banner-actions { justify-content: flex-end; }
    }

    /* ══════════════════════════════════════════
       MOTION POLISH — softer, more elegant
       ══════════════════════════════════════════ */
    html { scroll-behavior: smooth; }
    /* Softer reveal default */
    .reveal {
      transition-duration: 1.05s !important;
      transition-timing-function: cubic-bezier(.19,1,.22,1) !important;
    }
    /* Stagger refinements — slightly longer between cards for a more deliberate feel */
    .reveal-delay-1 { transition-delay: .08s !important; }
    .reveal-delay-2 { transition-delay: .18s !important; }
    .reveal-delay-3 { transition-delay: .28s !important; }
    .reveal-delay-4 { transition-delay: .38s !important; }
    .reveal-delay-5 { transition-delay: .48s !important; }
    .reveal-delay-6 { transition-delay: .58s !important; }

    /* Soft hover lift on cards across the site */
    .service-card, .audience-card, .stage-card, .stgx,
    .testimonial-card, .case-card, .overview-card,
    .voa-feature-card, .voa-principle, .voa-seg, .voa-letter,
    .cow-card, .insight-list-item, .stat-card {
      transition: transform .6s cubic-bezier(.19,1,.22,1),
                  border-color .5s ease,
                  box-shadow .6s cubic-bezier(.19,1,.22,1);
    }
    .service-card:hover, .stgx:hover,
    .testimonial-card:hover, .case-card:hover, .overview-card:hover {
      transform: translateY(-4px);
    }

    /* Gentle parallax-style on hero card */
    @media (prefers-reduced-motion: no-preference) {
      .hero-card {
        transition: transform 1.4s cubic-bezier(.19,1,.22,1), box-shadow .6s ease;
      }
    }

    /* Mega-menu open transition — slightly softer */
    .nav-dropdown {
      transition: opacity .42s cubic-bezier(.19,1,.22,1),
                  transform .55s cubic-bezier(.19,1,.22,1) !important;
    }

    /* Trust strip & footer subtle fade on view */
    .trust-items, .footer-grid, .footer-compliance-row {
      transition: opacity .8s ease, transform .8s cubic-bezier(.19,1,.22,1);
    }

    /* Section-head reveal — slightly emphasised */
    .section-head h2 { transition: transform 1.2s cubic-bezier(.19,1,.22,1), opacity 1.2s ease; }

    /* Buttons — softer micro-interaction */
    .btn, .nav-cta, .hero-cta-primary, .hero-cta-secondary,
    .cookie-btn, .careers-cta {
      transition: transform .35s cubic-bezier(.19,1,.22,1),
                  box-shadow .4s ease,
                  background-color .35s ease,
                  color .35s ease,
                  border-color .35s ease !important;
    }

    /* Respect reduced-motion preference */
    @media (prefers-reduced-motion: reduce) {
      *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
      }
    }

/* ══════════════════════════════════════════
       PART 16 — TOP-OF-WORLD ELEGANCE PASS
       (ABCET · segments · overall card system)
       ══════════════════════════════════════════ */

    /* ── Consistent border-radius system ── */
    .service-card, .audience-card, .stage-card, .stgx,
    .testimonial-card, .case-card, .overview-card,
    .voa-feature-card, .voa-principle, .voa-seg, .voa-letter,
    .voa-abcet, .stat-card, .insight-list-item,
    .cow-card, .nav-dd-card {
      border-radius: 10px !important;
    }
    .btn, .nav-cta, .hero-cta-primary, .hero-cta-secondary,
    .cookie-btn, .fc-verify, .careers-cta,
    .eyebrow, .case-badge, .club-badge {
      border-radius: 999px !important;
    }

    /* ══════════════════════════════════════════
       ABCET cards — "5 ways good advice pays for itself"
       Editorial layout: letter as gold pill in corner,
       big italic stat, mono "AGREE" footnote label.
       ══════════════════════════════════════════ */
    #value-advice .voa-abcet-cards { gap: 16px !important; }
    #value-advice .voa-abcet {
      position: relative;
      text-align: left !important;
      padding: 26px 24px !important;
      display: flex !important;
      flex-direction: column;
      background: var(--bone, #faf6ec) !important;
      border: 1px solid rgba(7,14,28,0.08) !important;
      transition: border-color .5s ease, transform .5s cubic-bezier(.19,1,.22,1),
                  box-shadow .6s cubic-bezier(.19,1,.22,1) !important;
    }
    #value-advice .voa-abcet:hover {
      border-color: rgba(201,163,90,0.4) !important;
      transform: translateY(-4px);
      box-shadow: 0 22px 50px -22px rgba(7,14,28,0.18);
    }
    /* Letter — refined pill in top-right corner */
    #value-advice .voa-abcet .voa-letter {
      position: absolute !important;
      top: 18px !important; right: 20px !important;
      padding: 5px 14px !important;
      min-width: 0 !important; width: auto !important; height: auto !important;
      background: rgba(201,163,90,0.08) !important;
      border: 1px solid rgba(201,163,90,0.32) !important;
      border-radius: 999px !important;
      font-family: 'Fraunces','Instrument Serif',Georgia,serif !important;
      font-size: 0.95rem !important;
      font-style: italic !important;
      font-weight: 400 !important;
      color: var(--gold) !important;
      line-height: 1 !important;
      letter-spacing: 0 !important;
      display: inline-block !important;
    }
    #value-advice .voa-abcet h3,
    #value-advice .voa-abcet h4 {
      margin: 0 0 8px !important;
      padding-right: 58px !important;  /* room for letter pill */
      font-size: 0.95rem !important;
      font-weight: 500 !important;
      font-family: 'Manrope', system-ui, sans-serif !important;
      color: #070e1c !important;
      letter-spacing: -0.005em !important;
      line-height: 1.3 !important;
    }
    #value-advice .voa-abcet > p:not(.voa-stat-lbl) {
      font-size: 0.82rem !important;
      line-height: 1.55 !important;
      color: rgba(7,14,28,0.68) !important;
      margin: 0 0 18px !important;
      flex: 1;
    }
    /* The stat — big editorial italic gold */
    #value-advice .voa-abcet .voa-stat {
      font-family: 'Fraunces','Instrument Serif',Georgia,serif !important;
      font-style: italic !important;
      font-size: 2.2rem !important;
      font-weight: 300 !important;
      color: var(--gold) !important;
      margin: 0 0 4px !important;
      line-height: 1 !important;
      padding-top: 16px !important;
      border-top: 1px solid rgba(7,14,28,0.08) !important;
      letter-spacing: -0.01em !important;
    }
    /* Footnote with a mono "AGREE" label above it */
    #value-advice .voa-abcet .voa-stat-lbl {
      font-size: 0.82rem !important;
      line-height: 1.5 !important;
      color: rgba(7,14,28,0.58) !important;
      margin: 0 !important;
      font-style: italic !important;
    }
    #value-advice .voa-abcet .voa-stat-lbl::before {
      content: "Agree" !important;
      display: block !important;
      font-family: 'JetBrains Mono', ui-monospace, monospace !important;
      font-size: 0.62rem !important;
      font-style: normal !important;
      font-weight: 600 !important;
      letter-spacing: 0.18em !important;
      text-transform: uppercase !important;
      color: var(--gold) !important;
      margin-bottom: 5px !important;
    }

    /* ══════════════════════════════════════════
       Segment cards — "What clients say"
       Hierarchy: icon · title · jump-stat (with chip),
       description, then "WHAT MATTERS" grouped tags.
       ══════════════════════════════════════════ */
    #value-advice .voa-client-segments {
      gap: 16px !important;
    }
    #value-advice .voa-seg {
      position: relative;
      padding: 24px 22px !important;
      background: var(--bone, #faf6ec) !important;
      border: 1px solid rgba(7,14,28,0.08) !important;
      display: flex; flex-direction: column;
      transition: border-color .5s ease, transform .5s cubic-bezier(.19,1,.22,1),
                  box-shadow .6s cubic-bezier(.19,1,.22,1) !important;
    }
    #value-advice .voa-seg:hover {
      border-color: rgba(201,163,90,0.4) !important;
      transform: translateY(-4px);
      box-shadow: 0 22px 50px -22px rgba(7,14,28,0.18);
    }
    #value-advice .voa-seg-ico {
      width: 40px; height: 40px;
      display: inline-flex; align-items: center; justify-content: center;
      background: rgba(201,163,90,0.1);
      border-radius: 50%;
      font-size: 1.15rem;
      margin-bottom: 14px;
    }
    #value-advice .voa-seg h3,
    #value-advice .voa-seg h4 {
      font-family: 'Manrope', system-ui, sans-serif !important;
      font-size: 0.95rem !important;
      font-weight: 600 !important;
      color: #070e1c !important;
      margin: 0 0 12px !important;
      letter-spacing: -0.005em !important;
    }
    /* Stat jump — small but punchy */
    #value-advice .voa-seg .jump {
      font-family: 'Fraunces','Instrument Serif',Georgia,serif !important;
      font-style: italic !important;
      font-size: 1.4rem !important;
      font-weight: 300 !important;
      color: var(--gold) !important;
      line-height: 1 !important;
      margin: 0 !important;
      letter-spacing: -0.01em !important;
    }
    #value-advice .voa-seg .jump-lbl {
      display: block !important;
      font-family: 'JetBrains Mono', ui-monospace, monospace !important;
      font-size: 0.62rem !important;
      font-weight: 600 !important;
      letter-spacing: 0.18em !important;
      text-transform: uppercase !important;
      color: rgba(7,14,28,0.55) !important;
      margin: 4px 0 14px !important;
      line-height: 1.4 !important;
    }
    /* Description */
    #value-advice .voa-seg > p {
      font-size: 0.82rem !important;
      line-height: 1.6 !important;
      color: rgba(7,14,28,0.68) !important;
      margin: 0 0 16px !important;
      flex: 1;
    }
    /* Tags list — grouped under a "What matters" label */
    #value-advice .voa-seg ul {
      list-style: none !important;
      margin: 0 !important;
      padding: 14px 0 0 !important;
      border-top: 1px solid rgba(7,14,28,0.08) !important;
      display: flex; flex-direction: column; gap: 7px;
      position: relative;
    }
    #value-advice .voa-seg ul::before {
      content: "What matters";
      display: block;
      font-family: 'JetBrains Mono', ui-monospace, monospace;
      font-size: 0.62rem;
      font-weight: 600;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--gold);
      margin-bottom: 6px;
    }
    #value-advice .voa-seg ul li {
      position: relative;
      padding: 0 0 0 14px !important;
      font-size: 0.82rem !important;
      line-height: 1.5 !important;
      color: rgba(7,14,28,0.72) !important;
      list-style: none !important;
    }
    #value-advice .voa-seg ul li::before {
      content: "›";
      position: absolute; left: 0; top: 0;
      color: var(--gold);
      font-weight: 700;
      font-size: 0.72rem;
    }

    /* ══════════════════════════════════════════
       OVERALL elegance refinements
       ══════════════════════════════════════════ */

    /* Card shadows on hover — universal soft lift */
    .service-card:hover, .audience-card:hover, .stgx:hover,
    .testimonial-card:hover, .case-card:hover, .overview-card:hover,
    .voa-feature-card:hover, .voa-principle:hover {
      box-shadow: 0 24px 50px -22px rgba(7,14,28,0.18);
    }
    /* Dark section card hovers — different shadow tone */
    .stage-pricing-section .stgx:hover,
    #about .testimonial-card:hover,
    #about .case-card:hover {
      box-shadow: 0 24px 60px -20px rgba(0,0,0,0.6);
    }

    /* Soft subtle gradient depth on dark sections (tone preserved) */
    .mission-section,
    .stage-pricing-section,
    #insight-banner,
    #about,
    #testimonials,
    #case-studies {
      position: relative;
    }
    .mission-section::after,
    .stage-pricing-section::after,
    #insight-banner::after,
    #about::after,
    #testimonials::after,
    #case-studies::after {
      content: ""; position: absolute; inset: 0;
      pointer-events: none;
      background: none;
      z-index: 0;
    }
    .mission-section .container,
    .stage-pricing-section .container,
    #insight-banner .container,
    #about .container,
    #testimonials .container,
    #case-studies .container { position: relative; z-index: 1; }

    /* Font hierarchy enforcement — all visible serif headings unified */
    h1, h2,
    .section-head h3,
    .voa-subsection-head h3 {
      font-family: 'Fraunces','Instrument Serif',Georgia,serif !important;
      font-weight: 300 !important;
      letter-spacing: -0.015em !important;
    }
    /* Card sub-headings stay in clean sans for hierarchy contrast */
    .audience-card h3, .service-card h3, .stgx h3 {
      font-family: 'Manrope', system-ui, sans-serif !important;
      font-weight: 600 !important;
      letter-spacing: -0.005em !important;
    }

    /* Mono small-caps labels — consistent treatment */
    .eyebrow, .nav-dd-h, .case-badge, .club-badge,
    .voa-tag, .stat-label, .jump-lbl, .fc-eyebrow {
      font-family: var(--font-mono)!important;
      letter-spacing: 0.18em !important;
      text-transform: uppercase !important;
    }

    /* Slightly softer page reveal */
    .page {
      animation-duration: 1s !important;
      animation-timing-function: cubic-bezier(.19,1,.22,1) !important;
    }

    /* Refined link focus states (accessibility + premium feel) */
    a:focus-visible, button:focus-visible,
    input:focus-visible, select:focus-visible, textarea:focus-visible {
      outline: 2px solid rgba(201,163,90,0.6) !important;
      outline-offset: 3px !important;
      border-radius: 4px !important;
    }
    /* Form inputs — softer focus glow */
    input:focus, select:focus, textarea:focus {
      box-shadow: 0 0 0 3px rgba(201,163,90,0.15) !important;
    }

    /* Image / icon containers — consistent soft scale on hover */
    .audience-card .ico, .service-icon, .overview-ico, .voa-seg-ico,
    .stat-card .stat-num {
      transition: transform .6s cubic-bezier(.19,1,.22,1) !important;
    }
    .audience-card:hover .ico,
    .service-card:hover .service-icon,
    .overview-card:hover .overview-ico,
    .voa-seg:hover .voa-seg-ico {
      transform: scale(1.05) translateY(-2px);
    }

    /* Mobile responsive for ABCET + segments */
    @media (max-width: 1100px) {
      #value-advice .voa-abcet-cards { grid-template-columns: repeat(3, 1fr) !important; }
      #value-advice .voa-client-segments { grid-template-columns: repeat(2, 1fr) !important; }
    }
    @media (max-width: 720px) {
      #value-advice .voa-abcet-cards { grid-template-columns: repeat(2, 1fr) !important; }
      #value-advice .voa-client-segments { grid-template-columns: 1fr !important; }
    }
    @media (max-width: 480px) {
      #value-advice .voa-abcet-cards { grid-template-columns: 1fr !important; }
    }

/* ══════════════════════════════════════════
       PART 17 — SITE-WIDE GRADIENT BACKDROP
       (tone preserved · depth added)
       ══════════════════════════════════════════ */

    /* Body — subtle global gradient layer underneath everything */
    body {
      background: var(--bg, #f4ede0);
    }

    /* ── DARK SECTIONS — refined gradient depth ── */
    .hero,
    .mission-section,
    .stage-pricing-section,
    #insight-banner,
    #about,
    #testimonials,
    #case-studies,
    .scarcity-strip,
    #trust {
      position: relative;
      background: #070e1c;
    }
    /* Hero gets an extra soft sheen at the top-right */
    .hero {
      background:
        #070e1c;
    }
    /* Trust strip / scarcity — slightly deeper, no sheen */
    #trust, .scarcity-strip {
      background:
        #070e1c;
    }

    /* Subtle grain overlay (premium texture) on dark sections only */
    .hero::after,
    .mission-section::after,
    .stage-pricing-section::after,
    #insight-banner::after,
    #about::after,
    #testimonials::after,
    #case-studies::after {
      content: ""; position: absolute; inset: 0;
      pointer-events: none;
      background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.85, 0 0 0 0 0.78, 0 0 0 0 0.62, 0 0 0 0.022 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
      opacity: 0.18;
      mix-blend-mode: soft-light;
      z-index: 0;
    }
    /* keep section content above the grain layer */
    .hero > .container,
    .mission-section > .container,
    .stage-pricing-section > .container,
    #insight-banner > .container,
    #about > .container,
    #testimonials > .container,
    #case-studies > .container { position: relative; z-index: 1; }

    /* ── CREAM SECTIONS — softer warm gradient ── */
    .home-overview,
    #services,
    #tax-deductibility,
    #start-here,
    #who-we-help,
    #scorecard,
    #value-advice,
    #resources,
    #tools,
    #blog,
    #faq,
    #newsletter,
    #contact,
    #how-it-works,
    .careers-section,
    #why-choose-us {
      position: relative;
      background:
        var(--cream, #f4ede0) !important;
    }
    /* Smooth section-to-section gradient transitions */
    section + section,
    section + .section,
    .section + section,
    .section + .section { position: relative; }
    section + section::before,
    section + .section::before,
    .section + section::before,
    .section + .section::before {
      content: ""; position: absolute; top: -1px; left: 0; right: 0;
      height: 1px;
      background: linear-gradient(90deg, transparent, rgba(201,163,90,0.18), transparent);
      pointer-events: none;
    }

    /* NOTE (15 Jul): this block had a stray brace. @keyframes heroGradientDrift
       was empty and unreferenced (dead), its 50% step was orphaned at top level,
       and the extra "}" closed the @media early — which let pulseGold escape the
       prefers-reduced-motion guard and animate for users who opted out.
       Dead keyframes removed; the guard now actually guards. */
    @media (prefers-reduced-motion: no-preference) {
      @keyframes pulseGold {
        0%, 100% { opacity: 0.03; }
        50%      { opacity: 0.05; }
      }
      .mission-section::before { animation: pulseGold 8s ease-in-out infinite; }
    }

    /* ── Soft section divider — fade between cream + dark sections ── */
    .home-overview + .mission-section,
    .stage-pricing-section + #tax-deductibility,
    #insight-banner + #scorecard,
    #scorecard + #value-advice {
      box-shadow: 0 -40px 60px -40px rgba(7,14,28,0.18) inset;
    }

    /* ══════════════════════════════════════════
       2. DEAN'S signature line styling
       ══════════════════════════════════════════ */
    .team-signature {
      font-family: 'JetBrains Mono', ui-monospace, monospace;
      font-size: 0.62rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: rgba(201,163,90,0.85);
      margin: 10px 0 14px;
      padding: 8px 0;
      border-top: 1px solid rgba(201,163,90,0.2);
      border-bottom: 1px solid rgba(201,163,90,0.2);
      line-height: 1.7;
    }

    /* ══════════════════════════════════════════
       3. DISCLAIMER — polished display
       ══════════════════════════════════════════ */
    .footer-compliance {
      background:
        rgba(7,14,28,0.45) !important;
      border-top: 1px solid rgba(201,163,90,0.22) !important;
      padding: 48px 0 36px !important;
      position: relative;
    }
    .footer-compliance::before {
      content: ""; position: absolute; top: 0; left: 50%;
      transform: translateX(-50%);
      width: 80px; height: 3px;
      background: linear-gradient(90deg, transparent, var(--gold), transparent);
      border-radius: 0 0 4px 4px;
    }
    .footer-compliance-row {
      display: grid !important;
      grid-template-columns: repeat(3, 1fr) !important;
      gap: 32px !important;
      margin-bottom: 28px !important;
    }
    .footer-compliance-row > div {
      padding: 22px 24px;
      background: rgba(7,14,28,0.35);
      border: 1px solid rgba(201,163,90,0.18);
      border-radius: 10px;
      transition: border-color .4s ease, transform .5s cubic-bezier(.19,1,.22,1);
    }
    .footer-compliance-row > div:hover {
      border-color: rgba(201,163,90,0.45);
      transform: translateY(-2px);
    }
    .fc-eyebrow {
      font-family: var(--font-mono)!important;
      font-size: 0.72rem !important;
      letter-spacing: 0.18em !important;
      text-transform: uppercase !important;
      color: var(--eyebrow) !important;
      margin-bottom: 12px !important;
      padding-bottom: 10px !important;
      border-bottom: 1px solid rgba(201,163,90,0.2);
      display: block;
      position: relative;
      padding-left: 14px !important;
    }
    .fc-eyebrow::before {
      content: ""; position: absolute; left: 0; top: 50%;
      width: 6px; height: 6px; border-radius: 50%;
      background: var(--gold);
      transform: translateY(-50%);
      box-shadow: 0 0 8px rgba(201,163,90,0.6);
    }
    .footer-compliance p {
      font-size: 0.82rem !important;
      line-height: 1.6 !important;
      color: rgba(244,237,224,0.74) !important;
      margin: 0 0 10px !important;
    }
    .footer-compliance p:last-child { margin-bottom: 0 !important; }
    .footer-compliance strong {
      color: var(--gold) !important;
      font-weight: 600 !important;
      font-family: 'Manrope', system-ui, sans-serif !important;
    }
    .fc-verify-row {
      display: flex !important; gap: 8px !important; flex-wrap: wrap;
      margin-top: 10px !important;
    }
    .fc-verify {
      font-family: 'JetBrains Mono', ui-monospace, monospace !important;
      font-size: 0.62rem !important;
      letter-spacing: 0.10em !important;
      padding: 5px 11px !important;
      border-radius: 999px !important;
      color: var(--gold) !important;
      border: 1px solid rgba(201,163,90,0.4) !important;
      background: rgba(201,163,90,0.06) !important;
      text-decoration: none !important;
      transition: all .35s cubic-bezier(.19,1,.22,1) !important;
    }
    .fc-verify:hover {
      background: var(--gold) !important;
      color: #070e1c !important;
      transform: translateY(-1px);
      box-shadow: 0 8px 18px -6px rgba(201,163,90,0.5);
    }

    /* General Advice Warning — refined editorial card */
    .footer-compliance-warning {
      background:

        rgba(7,14,28,0.5) !important;
      border: 1px solid rgba(201,163,90,0.28) !important;
      border-radius: 12px !important;
      padding: 22px 26px !important;
      position: relative;
    }
    .footer-compliance-warning::before {
      content: "⚠"; position: absolute; top: -1px; left: 22px;
      transform: translateY(-50%);
      width: 28px; height: 28px;
      background: var(--gold); color: #070e1c;
      border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      font-size: 0.82rem; font-weight: 700;
    }
    .footer-compliance-warning > p {
      padding-left: 12px;
    }
    .footer-compliance-warning strong:first-child {
      font-family: 'JetBrains Mono', ui-monospace, monospace !important;
      font-size: 0.62rem !important;
      letter-spacing: 0.18em !important;
      text-transform: uppercase !important;
      color: var(--gold) !important;
      font-weight: 700 !important;
      display: inline-block !important;
      margin-bottom: 2px !important;
    }
    .footer-compliance-warning p {
      font-size: 0.72rem !important;
      line-height: 1.65 !important;
      color: rgba(244,237,224,0.7) !important;
    }
    .footer-compliance-warning a {
      color: var(--gold) !important;
      text-decoration: underline !important;
      text-underline-offset: 2px;
      text-decoration-color: rgba(201,163,90,0.45);
    }

    @media (max-width: 900px) {
      .footer-compliance-row { grid-template-columns: 1fr !important; }
    }

    /* ══════════════════════════════════════════
       Subtle effect on key CTAs — gold gradient sheen
       ══════════════════════════════════════════ */
    .btn-primary, .nav-cta, .hero-cta-primary, .nav-dd-cta,
    .careers-cta, .cookie-accept {
      background: var(--gold) !important;
      background-size: 200% 200% !important;
      transition: background-position .8s cubic-bezier(.19,1,.22,1),
                  transform .4s ease, box-shadow .4s ease !important;
    }
    .btn-primary:hover, .nav-cta:hover, .hero-cta-primary:hover, .nav-dd-cta:hover,
    .careers-cta:hover, .cookie-accept:hover {
      background-position: 100% 100% !important;
      transform: translateY(-2px);
      box-shadow: 0 14px 30px -10px rgba(201,163,90,0.5);
    }

/* ══════════════════════════════════════════
     PART 19 — TEXT CLARITY · INLINE COMPLIANCE LINKS
     ══════════════════════════════════════════ */

  /* Inline compliance link (matches email-link pattern but for compliance) */
  .fc-inline {
    color: var(--gold) !important;
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-color: rgba(201,163,90,0.45);
    text-decoration-thickness: 1px;
    font-weight: 500;
    transition: color .3s ease, text-decoration-color .3s ease;
    cursor: pointer;
    white-space: nowrap;
  }
  .fc-inline:hover {
    color: var(--gold-light) !important;
    text-decoration-color: var(--gold);
    text-decoration-thickness: 1.5px;
  }
  .fc-inline::after {
    content: ' ↗';
    font-size: 0.85em;
    opacity: 0.65;
    margin-left: 1px;
  }
  .fc-inline:hover::after { opacity: 1; }
  /* If the inline link wraps a <strong>, keep gold + underline */
  .fc-inline strong {
    color: inherit !important;
    font-weight: 600 !important;
  }
  /* Remove old chip row styles (chips are gone now) */
  .fc-verify-row { display: none !important; }

  /* ══════════════════════════════════════════
     CLARITY — slightly boost body text on dark sections
     for better contrast against the softer gradient
     ══════════════════════════════════════════ */
  .mission-section .mission-statement,
  #about p, #testimonials .testimonial-quote,
  #case-studies p, #insight-banner p,
  .stage-pricing-section p {
    color: rgba(244,237,224,0.86) !important;
  }
  /* Cards on dark sections — slightly stronger background for clarity */
  .testimonial-card, .case-card, .cow-card {
    background: rgba(255,255,255,0.045) !important;
  }
  /* Footer compliance body text — slightly more opaque */
  .footer-compliance p {
    color: rgba(244,237,224,0.82) !important;
  }
  .footer-compliance strong {
    color: var(--gold) !important;
  }

  /* Slightly stronger card surfaces on cream sections for VOA + others */
  .voa-feature-card, .voa-abcet, .voa-seg, .voa-principle {
    background: rgba(255,255,255,0.55) !important;
  }

.nav-item.dd-just-closed .nav-dropdown { opacity: 0 !important; pointer-events: none !important; }

/* ══════════════════════════════════════════
       PART 11 — CUSTOM DROPDOWN (replaces native
       <select> so the open panel matches the design)
       ══════════════════════════════════════════ */
    .iz-select { position: relative; width: 100%; }
    /* keep native select for form value, hidden visually */
    select.iz-native-hidden {
      position: absolute !important; width: 1px; height: 1px;
      padding: 0 !important; margin: -1px; overflow: hidden;
      clip: rect(0,0,0,0); border: 0 !important; opacity: 0; pointer-events: none;
    }

    .iz-select-trigger {
      width: 100%;
      display: flex; align-items: center; justify-content: space-between; gap: 12px;
      padding: 16px 18px; cursor: pointer; text-align: left;
      font-family: var(--font-sans); font-size: 0.95rem; font-weight: 400;
      border-radius: var(--radius); outline: none;
      transition: border-color .35s ease, background .35s ease, box-shadow .35s ease;
    }
    .iz-select-value { flex: 1; line-height: 1.3; }
    .iz-select-arrow {
      display: inline-flex; flex-shrink: 0;
      transition: transform .45s cubic-bezier(.19,1,.22,1);
    }
    .iz-select-arrow svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 2; }
    .iz-select.open .iz-select-arrow { transform: rotate(180deg); }

    /* Shared panel */
    .iz-select-panel {
      position: absolute; top: calc(100% + 6px); left: 0; right: 0; z-index: 60;
      max-height: 0; opacity: 0; overflow: hidden;
      transform: translateY(-6px);
      border-radius: var(--radius);   /* 2px — was 6px, matched nothing */
      transition: max-height .42s cubic-bezier(.19,1,.22,1),
                  opacity .3s ease, transform .42s cubic-bezier(.19,1,.22,1);
      pointer-events: none;
    }
    .iz-select.open .iz-select-panel {
      max-height: 300px; opacity: 1; transform: translateY(0);
      overflow-y: auto; pointer-events: auto;
    }
    .iz-select-option {
      padding: 13px 18px; cursor: pointer; font-size: 0.95rem; line-height: 1.35;
      display: flex; align-items: center; justify-content: space-between; gap: 10px;
      transition: background .22s ease, color .22s ease, padding-left .22s ease;
      border-bottom: 1px solid transparent;
    }
    .iz-select-option.selected::after { content: "✓"; font-weight: 700; flex-shrink: 0; }
    .iz-select-option.placeholder { opacity: 0.55; font-style: italic; }
    .iz-select-option:hover { padding-left: 22px; }
    .iz-select-panel::-webkit-scrollbar { width: 8px; }
    .iz-select-panel::-webkit-scrollbar-thumb { background: rgba(201,163,90,0.3); border-radius: 4px; }
    .iz-select-panel::-webkit-scrollbar-track { background: transparent; }

    /* ── DARK theme (hero card, scorecard, auth modal) ── */
    .iz-select[data-theme="dark"] .iz-select-trigger {
      background: rgba(255,255,255,0.02);
      border: 1px solid var(--hairline);
      color: var(--bone);
    }
    .iz-select[data-theme="dark"] .iz-select-trigger:hover,
    .iz-select[data-theme="dark"].open .iz-select-trigger {
      border-color: var(--gold); background: rgba(255,255,255,0.045);
      box-shadow: 0 0 0 3px rgba(201,163,90,0.12);
    }
    .iz-select[data-theme="dark"] .iz-select-value.is-placeholder { color: rgba(231,221,200,0.42); }
    .iz-select[data-theme="dark"] .iz-select-arrow { color: var(--gold); }
    .iz-select[data-theme="dark"] .iz-select-panel {
      background: #0f1c38;
      border: 1px solid rgba(201,163,90,0.34);
      box-shadow: 0 26px 54px -16px rgba(0,0,0,0.72);
    }
    .iz-select[data-theme="dark"] .iz-select-option { color: rgba(244,237,224,0.82); }
    .iz-select[data-theme="dark"] .iz-select-option:hover { background: rgba(201,163,90,0.14); color: #f4ede0; }
    .iz-select[data-theme="dark"] .iz-select-option.selected { color: var(--gold); }
    .iz-select[data-theme="dark"] .iz-select-option.selected::after { color: var(--gold); }

    /* ── LIGHT theme (paper: contact card, member access, Health Check) ──
       [16 Jul] Was white (rgba(255,255,255,0.7)) on Bone with a 6px radius —
       a floating white box on paper, matching nothing else on the form. Now
       transparent + square + hairline, identical to .iz-input beside it. */
    .iz-select[data-theme="light"] .iz-select-trigger {
      background: transparent;
      border: 1px solid rgba(7,14,28,0.22);
      color: #070e1c;
    }
    .iz-select[data-theme="light"] .iz-select-trigger:hover,
    .iz-select[data-theme="light"].open .iz-select-trigger {
      border-color: var(--gold);
      background: rgba(201,163,90,0.04);
      box-shadow: none;
    }
    .iz-select[data-theme="light"] .iz-select-value.is-placeholder { color: rgba(7,14,28,0.38); }
    .iz-select[data-theme="light"] .iz-select-arrow { color: var(--gold-on-paper); }
    .iz-select[data-theme="light"] .iz-select-panel {
      background: var(--bone);
      border: 1px solid rgba(7,14,28,0.14);
      box-shadow: 0 26px 54px -16px rgba(7,14,28,0.22);
    }
    .iz-select[data-theme="light"] .iz-select-option { color: rgba(7,14,28,0.78); border-bottom-color: rgba(7,14,28,0.05); }
    .iz-select[data-theme="light"] .iz-select-option:hover { background: rgba(201,163,90,0.12); color: #070e1c; }
    .iz-select[data-theme="light"] .iz-select-option.selected { color: #8a6f2e; }
    .iz-select[data-theme="light"] .iz-select-option.selected::after { color: #b8924d; }

/*
 * READABILITY FIX — only colour corrections, nothing else.
 * Does not change layout, spacing, fonts, components or design.
 * 
 * Two problems solved:
 * 1. Cream sections missing the dark-text flip → add them
 * 2. Low-opacity hardcoded text values too faint → boost them
 */

/* ── 1. Extend cream surface flip to all light-background sections ──
   Original only covered: faq/blog/contact/taxded/voa + section[style*=bg-soft]
   Missing: home-overview, scorecard, value-advice, start-here, resources, careers */
.home-overview,
.careers-section,
#scorecard,
#value-advice,
#start-here,
#resources,
#overview {
  --on-surface:        #2a2f3d;
  --on-surface-strong: #070e1c;
  --on-surface-muted:  #6b6f7e;
  --on-surface-faint:  rgba(7, 14, 28, 0.42);
  --card-bg:           var(--bone);
  --card-border:       rgba(7, 14, 28, 0.08);
  --eyebrow:           var(--gold-on-paper);
  color: #2a2f3d;
}

/* ── 2. Force text colour on child elements in cream sections
   (needed because some elements have hardcoded colours that don't use CSS vars) */

/* Headings */
.home-overview h1, .home-overview h2, .home-overview h3, .home-overview h4,
.careers-section h1, .careers-section h2, .careers-section h3,
#scorecard h2, #scorecard h3,
#value-advice h2, #value-advice h3, #value-advice h4,
#start-here h2, #start-here h3,
#resources h2, #resources h3,
#overview h2, #overview h3,
/* already-flipped sections also need heading enforcement */
.faq-section h2, .faq-section h3,
.blog-section h2, .blog-section h3,
.contact-section h2, .contact-section h3,
.taxded-section h2, .taxded-section h3,
.voa-site-section h2, .voa-site-section h3,
section[style*="bg-soft"] h2, section[style*="bg-soft"] h3, section[style*="bg-soft"] h4 {
  color: #070e1c !important;
}

/* Body & lead text */
.home-overview p, .home-overview li, .home-overview .lead,
.careers-section p, .careers-section li, .careers-section .lead,
#scorecard p, #scorecard li, #scorecard .lead,
#value-advice p, #value-advice li, #value-advice .lead,
#start-here p, #start-here li, #start-here .lead,
#resources p, #resources li, #resources .lead,
#overview p, #overview li, #overview .lead,
.faq-section p, .faq-section li,
.blog-section p, .blog-section li,
.contact-section p, .contact-section li,
.taxded-section p, .taxded-section li,
.voa-site-section p, .voa-site-section li,
section[style*="bg-soft"] p,
section[style*="bg-soft"] li,
section[style*="bg-soft"] .lead {
  color: #2a2f3d !important;
}

/* Muted text */
.home-overview .muted,
.careers-section .muted,
#scorecard .muted,
#value-advice .muted,
#start-here .muted,
#resources .muted,
#overview .muted,
.faq-section .muted,
.blog-section .muted,
.contact-section .muted,
.taxded-section .muted,
.voa-site-section .muted,
section[style*="bg-soft"] .muted {
  color: #6b6f7e !important;
}

/* ── 3. Boost low-opacity cream text on DARK sections ──
   These values were originally designed for dark backgrounds — just too faint */

/* Light cream text — boost opacity on dark section elements */
.hero .lead, .hero p,
.mission-section p, .mission-section .lead, .mission-section .mission-statement,
.stage-pricing-section p, .stage-pricing-section .lead,
.stage-pricing-section .stgx-who,
.stage-pricing-section .stgx-diff p,
.stage-pricing-section .stg-trans p,
.stage-pricing-section .pricing-disclaimer,
.stage-pricing-section .journey-spine-note,
#insight-banner p, #insight-banner .lead,
#about p, #about .lead, #about .team-bio,
#testimonials p, #testimonials .lead, #testimonials .testimonial-quote,
#case-studies p, #case-studies .lead,
.final-cta p, .final-cta .lead {
  color: rgba(244, 237, 224, 0.92) !important;
}

/* Stage card body text */
.stgx-name { color: #fbf7ef !important; }
.stgx-who  { color: rgba(244,237,224,0.82) !important; }
.stgx-diff p { color: rgba(244,237,224,0.95) !important; }
.stg-trans h3 { color: #fbf7ef !important; }
.stg-trans p  { color: rgba(244,237,224,0.88) !important; }
.pricing-disclaimer { color: rgba(244,237,224,0.80) !important; }
.journey-spine-note { color: rgba(244,237,224,0.80) !important; }

/* Scorecard left (dark bg) */
.scorecard-left h2, .scorecard-left h3 { color: #fbf7ef !important; }
.scorecard-left p, .scorecard-left .lead,
.scorecard-list-item { color: rgba(244,237,224,0.90) !important; }

/* Members club (dark card on cream section) */
.club-title { color: #fbf7ef !important; }
.club-sub   { color: rgba(244,237,224,0.88) !important; }
.club-perks li { color: rgba(244,237,224,0.88) !important; }

/* Final CTA (dark bg) */
.final-cta h2 { color: #fbf7ef !important; }
.tiny-note    { color: rgba(244,237,224,0.65) !important; }

/* ── 4. Buttons — ensure legible in both contexts ── */
/* Secondary button on cream sections must use dark text */
section[style*="bg-soft"] .btn-secondary,
.home-overview .btn-secondary,
.careers-section .btn-secondary,
#scorecard .btn-secondary,
#value-advice .btn-secondary,
#start-here .btn-secondary,
#resources .btn-secondary,
#overview .btn-secondary,
.faq-section .btn-secondary,
.contact-section .btn-secondary,
.taxded-section .btn-secondary,
.voa-site-section .btn-secondary {
  color: var(--ink) !important;
  border-color: rgba(7,14,28,0.30) !important;
}
/* Secondary button on dark sections stays light */
.hero .btn-secondary,
.mission-section .btn-secondary,
.stage-pricing-section .btn-secondary,
#insight-banner .btn-secondary,
#about .btn-secondary,
.final-cta .btn-secondary {
  color: var(--bone) !important;
  border-color: rgba(251,247,239,0.35) !important;
}

/* ── ADDITIONAL FIXES based on screenshots ── */

/* IMAGE 1 fix: final-cta IS dark bg (var(--ink)) — text must be light */
.final-cta h2 { color: #fbf7ef !important; }
.final-cta p, .final-cta .lead { color: rgba(244,237,224,0.88) !important; }
.final-cta .eyebrow { color: var(--eyebrow) !important; }
.final-cta .btn-secondary { color: #fbf7ef !important; border-color: rgba(251,247,239,0.4) !important; }

/* IMAGE 3 & 4 fix: stage-pricing-section IS dark bg — all text must be light */
.stage-pricing-section h2,
.stage-pricing-section h3 { color: #fbf7ef !important; }
.stage-pricing-section p,
.stage-pricing-section .lead { color: rgba(244,237,224,0.88) !important; }
.stage-pricing-section .eyebrow { color: var(--eyebrow) !important; }
/* stgx stage cards */
.stgx-num { color: rgba(201,163,90,0.55) !important; }
.stgx-name { color: #fbf7ef !important; }
.stgx-trigger { color: rgba(244,237,224,0.60) !important; }
.stgx-who { color: rgba(244,237,224,0.80) !important; }
.stgx-diff { background: rgba(201,163,90,0.10) !important; border-left-color: var(--gold) !important; }
.stgx-diff-lbl { color: var(--gold) !important; }
.stgx-diff p { color: #fbf7ef !important; }
.stgx-meta-item { color: rgba(244,237,224,0.85) !important; }
.stgx-meta-item em { color: rgba(244,237,224,0.50) !important; }
.stgx-cta { color: var(--gold) !important; }
/* stg-trans banner (grey box in pricing) */
.stg-trans { background: rgba(255,255,255,0.07) !important; }
.stg-trans h3 { color: #fbf7ef !important; }
.stg-trans p { color: rgba(244,237,224,0.85) !important; }
/* journey spine labels */
.spine-age { color: rgba(244,237,224,0.55) !important; }
.spine-name { color: rgba(244,237,224,0.80) !important; }
.journey-spine-note { color: rgba(244,237,224,0.75) !important; }
.pricing-disclaimer { color: rgba(244,237,224,0.75) !important; }

/* IMAGE 5 fix: stg-trans grey box — white text on grey-olive bg */
.stg-trans h3 { color: #ffffff !important; }
.stg-trans p { color: rgba(255,255,255,0.90) !important; }

/* IMAGE 6 fix: section-bullets checkmark text on cream bg */
.section-bullets li { color: #2a2f3d !important; }
#start-here .section-bullets li { color: #2a2f3d !important; }

/* IMAGE 7 fix: scorecard left panel (dark bg) — text must be clearly light */
.scorecard-left h2, .scorecard-left h3 { color: #ffffff !important; }
.scorecard-left p, .scorecard-left .lead { color: rgba(244,237,224,0.95) !important; }
.scorecard-left li, .scorecard-list-item { color: rgba(244,237,224,0.95) !important; }
.scorecard-tick { color: var(--gold) !important; }
.scorecard-left .eyebrow { color: var(--eyebrow) !important; }
.scorecard-left .muted, .scorecard-left small { color: rgba(244,237,224,0.75) !important; }

/* IMAGE 8 fix: Members club (dark bg #0c1730) — boost all text */
.club-title { color: #ffffff !important; }
.club-title em { color: var(--gold) !important; }
.club-sub { color: rgba(244,237,224,0.95) !important; }
.club-perks li { color: rgba(244,237,224,0.95) !important; }
.club-note { color: rgba(244,237,224,0.72) !important; }
.club-badge { color: var(--gold) !important; }
/* right-side tool cards in members club */
.club-tool-card h4, .tool-card h4 { color: rgba(244,237,224,0.95) !important; }
.club-tool-card p, .tool-card p, .club-tool-card .muted, .tool-card .muted { color: rgba(244,237,224,0.72) !important; }

/* ══════════════════════════════════════════
   USER-REQUESTED TARGETED FIXES
   ══════════════════════════════════════════ */

/* ── Services page: "Financial Health Check™" featured card text ──
   Card has dark bg, text must be light cream */
#services .featured-service h3,
section[style*="bg-soft"] .featured-service h3 {
  color: #fbf7ef !important;
}
#services .featured-service p,
#services .featured-service .muted,
#services .featured-service li,
section[style*="bg-soft"] .featured-service p,
section[style*="bg-soft"] .featured-service .muted,
section[style*="bg-soft"] .featured-service li {
  color: rgba(244,237,224,0.92) !important;
}
#services .featured-service .service-tag,
section[style*="bg-soft"] .featured-service .service-tag {
  color: var(--gold) !important;
}

/* ── Approach page Scorecard section "Run our proprietary..." + "Get My Score" ──
   Dark section, all text must be light cream */
#scorecard .scorecard-left h2,
#scorecard .scorecard-left h2 em,
#scorecard .scorecard-right h3 {
  color: #fbf7ef !important;
}
#scorecard .scorecard-left p,
#scorecard .scorecard-left .lead {
  color: rgba(244,237,224,0.92) !important;
}
#scorecard .scorecard-list-item,
#scorecard .scorecard-list-item span:not(.scorecard-tick) {
  color: rgba(244,237,224,0.95) !important;
}
#scorecard .scorecard-tick {
  color: var(--gold) !important;
}
#scorecard .scorecard-right p,
#scorecard .scorecard-right .muted {
  color: rgba(244,237,224,0.85) !important;
}
#scorecard .kw {
  color: var(--gold) !important;
}

/* ── Resources page: "Step inside the Members' Suite" — dark card ── */
.members-club .club-title,
.members-club .club-title em {
  color: #fbf7ef !important;
}
.members-club .club-title em {
  color: var(--gold) !important;
}
.members-club .club-sub {
  color: rgba(244,237,224,0.93) !important;
}
.members-club .club-perks li {
  color: rgba(244,237,224,0.93) !important;
}
.members-club .club-badge {
  color: var(--gold) !important;
}
.members-club .club-note,
.members-club .club-signin {
  color: rgba(244,237,224,0.75) !important;
}

/* ── Approach page: 4 journey cards (Buy your first home / Grow investments /
   Optimise tax & super / Build a full wealth plan) — GOLD visible border ── */
#start-here .journey-card,
section[style*="bg-soft"] .journey-card {
  background: rgba(255, 255, 255, 0.6) !important;
  border: 1.5px solid var(--gold) !important;
  border-radius: 6px !important;
}
#start-here .journey-card:hover,
section[style*="bg-soft"] .journey-card:hover {
  border-color: var(--gold-on-paper) !important;
  background: rgba(255, 255, 255, 0.85) !important;
  box-shadow: 0 12px 28px -12px rgba(201, 163, 90, 0.35) !important;
}

/* ── "Time-sensitive · Live · Compound growth lost" pill — same place, bigger ── */
.cow-live.cow-live-corner {
  padding: 14px 22px !important;
  font-size: 0.82rem !important;
  max-width: 520px !important;
  gap: 12px !important;
}
.cow-live.cow-live-corner .cow-live-label {
  font-size: 0.72rem !important;
  letter-spacing: 0.18em !important;
  font-weight: 600 !important;
}
.cow-live.cow-live-corner .cow-live-msg {
  font-size: 0.82rem !important;
  line-height: 1.45 !important;
}
.cow-live.cow-live-corner .cow-live-msg strong {
  font-size: 0.95rem !important;
}
.cow-live.cow-live-corner .cow-live-dot {
  width: 9px !important;
  height: 9px !important;
}

/* ── Featured blog card "Property Strategy" — text on cream card bg ──
   .featured class on the card forces h3/p to bone/cream colours via !important;
   we override with section-scoped + multi-class specificity */
.blog-section .blog-card.featured .blog-cat,
.blog-section .blog-card .blog-cat {
  color: var(--gold-on-paper) !important;
  opacity: 1 !important;
}
.blog-section .blog-card.featured .blog-title,
.blog-section .blog-card .blog-title,
.blog-section article.blog-card h2.blog-title,
.blog-section article.blog-card h3.blog-title {
  color: #070e1c !important;
}
.blog-section .blog-card.featured .blog-excerpt,
.blog-section .blog-card .blog-excerpt,
.blog-section article.blog-card p.blog-excerpt {
  color: #2a2f3d !important;
  opacity: 1 !important;
}
.blog-section .blog-card.featured .blog-meta,
.blog-section .blog-card .blog-meta,
.blog-section .blog-card.featured .blog-meta span,
.blog-section .blog-card .blog-meta span {
  color: #6b6f7e !important;
}
.blog-section .blog-card.featured .blog-read-more,
.blog-section .blog-card .blog-read-more {
  color: var(--gold-on-paper) !important;
}
.blog-section .blog-card.featured .blog-read-more:hover,
.blog-section .blog-card .blog-read-more:hover {
  color: var(--gold) !important;
}
/* Also override the generic .featured p/h3 rule for the blog context */
.blog-section .featured h2,
.blog-section .featured h3 {
  color: #070e1c !important;
}
.blog-section .featured p {
  color: #2a2f3d !important;
}

/* ── "Financial Health Check™" → gold colour ──
   Applies wherever this specific heading text appears as a service card title */
#services .featured-service h3,
section[style*="bg-soft"] .featured-service h3 {
  color: var(--gold) !important;
}

/* ══════════════════════════════════════════
   FONT DISCIPLINE — purpose-locked, no mixing
   ──────────────────────────────────────────
   Fraunces        → large display headings (h1, h2)
   Instrument Serif→ italic emphasis only (em, i, italic quotes)
   Manrope         → all body text, buttons, navigation, forms, paragraphs
   JetBrains Mono  → eyebrow labels, small caps, metadata tags only
   ══════════════════════════════════════════ */

/* Base: every element defaults to Manrope unless explicitly overridden */
body, p, li, a, button, input, select, textarea, label, span, div {
  font-family: 'Manrope', system-ui, -apple-system, sans-serif;
}

/* ══════════════════════════════════════════════════════════════════════
   DISPLAY HEADINGS — THE STANDARD
   ══════════════════════════════════════════════════════════════════════
   Set by "Wealth is engineered, not earned." (.mission-headline). Every
   display heading on the site renders this exact cut:

       Fraunces · weight 300 · font-variation-settings: "opsz" 144, "SOFT" 30

   opsz 144 is the whole point. Fraunces' optical-size axis runs 9–144; at
   144 it becomes the display cut — thin hairlines, high contrast, the flared
   terminals you see in "Know your next move." Omit it and you get Fraunces'
   default text cut: chunkier, low contrast, visibly a different typeface at
   a glance. Five headings used to omit it, including the hero H1 — which is
   why "Wealth, engineered." never matched "Wealth is engineered, not earned."
   despite being nearly the same words in nominally the same font.

   Italic is NOT part of this standard — it's applied per heading, and to
   stressed words via --font-emphasis. Weight and opsz are.
   Don't add a heading without this cut.
   ══════════════════════════════════════════════════════════════════════ */
h1, h2,
.hero h1, .hero h2,
.section-head h2,
.mission-headline,
.club-title,
.blog-title,
.faq-q,
.trust-headline,
.careers-h2,
.kb-title {
  font-family: 'Fraunces', 'Instrument Serif', Georgia, serif;
  font-weight: 300;
  font-variation-settings: "opsz" 144, "SOFT" 30;
}

/* Sub-headings → also Fraunces for editorial consistency */
h3, h4,
.service-card h3,
.audience-card h3,
.journey-card h3,
.overview-card h3,
.stgx-name,
.stg-trans h3 {
  font-family: 'Fraunces', 'Instrument Serif', Georgia, serif;
}

/* Italic emphasis inside headings → Instrument Serif */
/* [16 Jul · SIGNED OFF] Emphasis inside a heading changes ONE thing: the angle.
   font-weight and font-variation-settings are inherited, so a stressed word can
   never be bolder, lighter, or a different optical cut than the sentence it sits
   in — and font-size is never set here either. Six of these rules used to force
   font-weight: 400 inside 300-weight headings, which made the italic word visibly
   heavier than its own line. Do not re-add font-weight/size/opsz below. */
h1 em, h2 em, h3 em, h4 em,
em.italic-emphasis,
.italic-display,
.mission-headline em,
.club-title em,
.stg-trans h3 em {
  font-family: var(--font-emphasis);
  font-style: italic;
  font-weight: inherit;
  font-variation-settings: inherit;
}

/* ══════════════════════════════════════════════════════════════════════
   MONO IS NEVER ITALIC.
   JetBrains Mono carries data and labels — licence numbers, eyebrows, tags.
   Those are facts, not asides, so they don't lean. Neither of these two set
   font-style themselves; they INHERIT it (h1 is italic site-wide, and the
   education disclaimer is italic fineprint), which is how mono italic appeared
   twice on a site that uses mono italic nowhere else.
   ══════════════════════════════════════════════════════════════════════ */
.trust-num {
  font-style: normal;
}

/* [16 Jul] The About credentials were breaking with a single word on line 2
   ("...ART & / Westpac", "...portfolio-management / discipline"). Measured: the
   longest needs 430px of text plus the 30px tick = 460px per column, but the
   760px list only gave 366px. Widened for this section only — the heading and
   lead keep their 760px measure, so nothing else moves. text-wrap: balance is
   the safety net: if a narrow viewport still forces a wrap, it splits evenly
   instead of orphaning one word. */
/* [17 Jul · SERVICES] Two orphans, both container-width problems, both measured:

     · The lead ran 4 lines with "sell." alone on the last. The text needs
       ~2917px of run; against the 896px section-head that's 3.4 lines, so it
       could never fit in 3. At 1040px it's 2.8 — three lines with room.
     · "Holistic strategy across property, super, investing & debt" needed
       459px + the 30px tick = 489px per column, but the 864px list gave 418px.
       Two columns of 489 + the 28px gap = 1006px, so the list needs ~1040.

   The container is 1240px, so both fit without touching the page grid.
   balance evens the lead's three lines instead of leaving a short tail. */
#about .section-head { max-width: 980px; }
#about .section-head h2,
#about .section-head .lead { max-width: 760px; margin-left: auto; margin-right: auto; }
#about .section-bullets { max-width: 980px; }
#about .section-bullets li { text-wrap: balance; }

/* ══════════════════════════════════════════════════════════════════════
   CTA ICONS — [17 Jul · approved]
   The site's existing grammar, measured off its own 92 inline SVGs:
   24×24 viewBox · stroke 1.5 · round caps and joins · fill none · currentColor.
   currentColor matters: the same icon sits on a gold pill (ink stroke) and a
   ghost pill (bone stroke) with no second rule.
   These replace generic "→" arrows, which said nothing about the action.
   ══════════════════════════════════════════════════════════════════════ */
/* NB: the class is .iz-cta-ico, NOT .iz-ico — .iz-ico already exists on 53
   elements (partner icons, contact details, trust items, locked tools) and
   styling it here would resize every one of them. */
.iz-cta-ico {
  width: 15px; height: 15px; flex: none;
  fill: none; stroke: currentColor;
  stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round;
  transition: transform .35s cubic-bezier(.19,1,.22,1);
}
.iz-cta-pulse { width: 18px; height: 18px; }   /* the trace needs the extra width */

/* ── Travelling CTA arrow ── */
.iz-cta-arrow {
  width: 18px; height: 12px; flex: none; overflow: visible;
  animation: izhcArrow 2s cubic-bezier(.45,0,.25,1) infinite;
}
@keyframes izhcArrow {
  0%   { transform: translateX(-7px); opacity: 0; }
  22%  { transform: translateX(0);    opacity: 1; }
  62%  { transform: translateX(3px);  opacity: 1; }
  88%  { transform: translateX(13px); opacity: 0; }
  100% { transform: translateX(13px); opacity: 0; }
}
.iz-cta-arrow path {
  fill: none; stroke: currentColor;
  stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;
}
.btn:hover .iz-cta-arrow, a:hover > .iz-cta-arrow, button:hover > .iz-cta-arrow {
  animation-play-state: paused; transform: translateX(4px); opacity: 1;
}
@media (prefers-reduced-motion: reduce) {
  .iz-cta-arrow { animation: none !important; transform: none !important; opacity: 1 !important; }
}

   The Zephyr mark is ~1.85:1, so fitting its WIDTH inside a ring leaves its
   HEIGHT at a fraction of the box — at 15px with an r=9 ring the mark came out
   4.1px tall against an 8.3px cap height beside it, i.e. half. Two fixes, both
   geometric rather than cosmetic:
     · ring r 9 → 10.4 (outer edge 11.15, still inside the 24-box)
     · mark fitted to the ring's true chord, not an arbitrary 12.4
   plus 15 → 18px here. Net: the mark is ~2.4× its old area and now reads.
   Don't shrink this back to 15 for "consistency" — the other three icons are
   roughly square and don't lose height the way this one does. */

/* ── Idle motion ──────────────────────────────────────────────────────
   Gentle, not busy. Each icon breathes in the way its own subject would:
   the pulse traces, the envelope lifts its flap, the speech mark drifts.
   6s cycles with long rests, ~2px of travel — at 15px it reads as "alive",
   never as "look at me". Hover overrides with a single deliberate nudge.
   All of it is off under prefers-reduced-motion.
   ── */
.iz-cta-ico { transform-origin: center; }

/* mail — a slow inhale, like a letter being lifted */
.iz-cta-mail { animation: izcMail 4.2s ease-in-out infinite; }  /* [17 Jul] was 6s */
@keyframes izcMail {
  0%, 62%, 100% { transform: translateY(0); }
  72%           { transform: translateY(-1.6px); }
  84%           { transform: translateY(0); }
}
/* speech — a soft drift, as if someone is about to answer */
.iz-cta-talk { animation: izcTalk 4.2s ease-in-out infinite; }  /* [17 Jul] was 6s */
@keyframes izcTalk {
  0%, 58%, 100% { transform: translateY(0) scale(1); }
  70%           { transform: translateY(-1.4px) scale(1.06); }
  84%           { transform: translateY(0) scale(1); }
}
/* pulse — the ECG draws itself, then rests */
.iz-cta-pulse path {
  stroke-dasharray: 34; stroke-dashoffset: 0;
  animation: izcTrace 6s cubic-bezier(.45,0,.25,1) infinite;
}
@keyframes izcTrace {
  0%, 8%   { stroke-dashoffset: 34; opacity: .45; }
  30%, 74% { stroke-dashoffset: 0;  opacity: 1; }
  92%,100% { stroke-dashoffset: 34; opacity: .45; }
}
/* one deliberate nudge on hover — idle motion stands down */
.btn:hover .iz-cta-ico, .email-link:hover .iz-cta-ico,
a:hover > .iz-cta-ico, button:hover > .iz-cta-ico {
  animation-play-state: paused;
  transform: translateX(3px);
}
.btn:hover .iz-cta-pulse path { animation-play-state: paused; stroke-dashoffset: 0; opacity: 1; }

@media (prefers-reduced-motion: reduce) {
  .iz-cta-ico, .iz-cta-ico path { animation: none !important; transform: none !important;
    stroke-dashoffset: 0 !important; opacity: 1 !important; }
}

/* Eyebrow labels, mono tags, small caps → JetBrains Mono */
.eyebrow, .nav-dd-h, .case-badge, .club-badge,
.voa-tag, .stat-label, .jump-lbl, .fc-eyebrow,
.service-tag, .blog-cat, .blog-meta,
.stgx-num, .stgx-diff-lbl, .stgx-meta-item em,
.spine-age, .scarcity-text,
.cow-live-label,
.taxded-eyebrow, .footer-eyebrow {
  font-family: var(--font-mono);
}

/* Form inputs explicitly Manrope (some browsers default to system) */
input, select, textarea, button {
  font-family: 'Manrope', system-ui, sans-serif;
}
/* Mono number tickers stay mono */
.cow-tick, .hero-score, .stat-num,
input[type="number"] {
  font-variant-numeric: tabular-nums;
}

/* ══════════════════════════════════════════
   VoA INFOGRAPHIC — confidence chart
   ══════════════════════════════════════════ */
.voa-infographic {
  background: var(--bone, #fbf7ef);
  border: 1px solid rgba(7,14,28,0.10);
  border-radius: 6px;
  padding: 36px 32px 28px;
  margin: 24px 0 18px;
}
.voa-chart-header {
  display: grid;
  grid-template-columns: 200px 1fr;
  gap: 24px;
  padding-bottom: 14px;
  margin-bottom: 6px;
  border-bottom: 1px solid rgba(7,14,28,0.12);
  align-items: end;
}
.voa-chart-label {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 0.62rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #6b6f7e;
}
.voa-chart-axis {
  display: flex;
  justify-content: space-between;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 0.62rem;
  letter-spacing: 0.12em;
  color: #6b6f7e;
}
.voa-chart-row {
  display: grid;
  grid-template-columns: 200px 1fr;
  gap: 24px;
  align-items: center;
  padding: 14px 0;
  border-bottom: 1px solid rgba(7,14,28,0.06);
}
.voa-chart-row:last-of-type { border-bottom: none; }
.voa-chart-meta {
  display: flex;
  align-items: center;
  gap: 12px;
}
.voa-chart-ico {
  font-size: 1.4rem;
  flex-shrink: 0;
}
.voa-chart-name {
  font-family: 'Manrope', system-ui, sans-serif;
  font-size: 0.95rem;
  font-weight: 600;
  color: #070e1c;
  line-height: 1.3;
}
.voa-chart-name em {
  font-style: normal;
  font-size: 0.82rem;
  color: #6b6f7e;
  display: block;
  margin-top: 2px;
}
.voa-chart-bar-wrap {
  position: relative;
  height: 44px;
  display: flex;
  align-items: center;
  gap: 0;
}
.voa-chart-bar {
  height: 22px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 0 8px;
  position: absolute;
  border-radius: 2px;
  transition: width 1s cubic-bezier(.16,1,.3,1);
}
.voa-chart-bar span {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: 0.04em;
}
.voa-chart-bar.voa-before {
  background: rgba(45,63,106,0.32);
  top: 4px;
}
.voa-chart-bar.voa-before span {
  color: var(--ink-3);
}
.voa-chart-bar.voa-after {
  background: var(--gold);
  top: 28px;
  height: 14px;
}
.voa-chart-bar.voa-after span {
  color: #070e1c;
}
.voa-chart-jump {
  /* [17 Jul] Was right:-52px — the jump sat OUTSIDE the chart, past the axis.
     Now it rides just inside the right edge of the track, on the after-bar row,
     so the +NN reads as part of the bar it describes. Ink-on-gold territory is
     avoided by keeping it in the empty tail of the track past the bar end. */
  position: absolute;
  right: 8px;
  top: 28px;                 /* the after-bar's row */
  height: 14px;
  display: flex;
  align-items: center;
  font-family: 'Fraunces', 'Instrument Serif', Georgia, serif;
  font-size: 0.95rem;
  font-weight: 500;
  color: var(--gold-on-paper);
  letter-spacing: -0.01em;
  white-space: nowrap;
}
.voa-chart-jump-big {
  font-size: 1.4rem;
  color: var(--gold);
  font-weight: 500;
}
.voa-chart-legend {
  display: flex;
  align-items: center;
  gap: 22px;
  margin-top: 22px;
  padding-top: 16px;
  border-top: 1px solid rgba(7,14,28,0.08);
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 0.62rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #6b6f7e;
  flex-wrap: wrap;
}
.voa-chart-legend span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.voa-legend-swatch {
  width: 14px;
  height: 10px;
  border-radius: 2px;
  display: inline-block;
}
.voa-legend-swatch.voa-before { background: rgba(45,63,106,0.32); }
.voa-legend-swatch.voa-after { background: var(--gold); }
.voa-legend-note {
  margin-left: auto;
  font-style: italic;
  text-transform: none;
  letter-spacing: 0.02em;
  color: #8a8e98;
}
.voa-segments-source {
  font-size: 0.82rem;
  color: #6b6f7e !important;
  line-height: 1.6;
  font-style: italic;
  text-align: center;
  margin-top: 20px;
}

/* Responsive */
@media (max-width: 820px) {
  .voa-chart-header,
  .voa-chart-row {
    grid-template-columns: 140px 1fr;
    gap: 14px;
  }
  .voa-chart-name { font-size: 0.82rem; }
  .voa-chart-name em { font-size: 0.72rem; }
  .voa-chart-jump { right: -42px; font-size: 0.95rem; }
  .voa-chart-bar span { font-size: 0.62rem; }
  .voa-chart-legend { font-size: 0.62rem; }
}
@media (max-width: 560px) {
  .voa-infographic { padding: 22px 16px 18px; }
  .voa-chart-header,
  .voa-chart-row {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .voa-chart-axis { padding-left: 0; }
  .voa-chart-jump { position: static; transform: none; display: inline-block; margin-left: 8px; }
  .voa-chart-bar-wrap { height: 50px; }
  .voa-legend-note { margin-left: 0; width: 100%; }
}

/* On dark page background, lighten card */
#value-advice .voa-infographic {
  background: var(--bone, #fbf7ef);
}

/* ══════════════════════════════════════════
   BECOME A PARTNER SECTION
   ══════════════════════════════════════════ */
.partners-section {
  background: var(--cream, #f4ede0);
  padding: 100px 0;
}
.partners-section h2 {
  color: #070e1c !important;
  font-family: 'Fraunces', 'Instrument Serif', Georgia, serif;
}
.partners-section h2 em {
  font-family: var(--font-emphasis);
  font-style: italic;
  color: var(--gold);
}
.partners-section .lead {
  color: #2a2f3d !important;
}
.partners-section .eyebrow {
  color: var(--eyebrow) !important;
}

.partner-intro {
  max-width: 760px;
  margin: 36px auto 56px;
  text-align: center;
}
.partner-intro p {
  font-family: 'Fraunces', 'Instrument Serif', Georgia, serif;
  font-size: 1.15rem;
  font-weight: 300;
  line-height: 1.55;
  color: #1e2433;
  letter-spacing: -0.005em;
}

.partner-pillars {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
  margin-bottom: 64px;
}
.partner-pillar {
  background: var(--bone, #fbf7ef);
  border: 1px solid rgba(7,14,28,0.08);
  border-radius: 4px;
  padding: 36px 30px 32px;
  position: relative;
  transition: border-color 0.4s ease, transform 0.45s cubic-bezier(.16,1,.3,1), box-shadow 0.4s ease;
}
.partner-pillar:hover {
  border-color: var(--gold);
  transform: translateY(-3px);
  box-shadow: 0 18px 36px -20px rgba(201,163,90,0.30);
}
.partner-pillar-num {
  display: block;
  font-family: 'Fraunces', 'Instrument Serif', Georgia, serif;
  font-style: italic;
  font-size: 2.2rem;
  font-weight: 300;
  color: rgba(201,163,90,0.55);
  line-height: 1;
  margin-bottom: 18px;
}
.partner-pillar h3 {
  font-family: 'Fraunces', 'Instrument Serif', Georgia, serif;
  font-weight: 400;
  font-size: 1.15rem;
  color: #070e1c;
  line-height: 1.3;
  margin: 0 0 12px;
  letter-spacing: -0.01em;
}
.partner-pillar p {
  font-family: 'Manrope', system-ui, sans-serif;
  font-size: 0.95rem;
  line-height: 1.65;
  color: #2a2f3d;
  margin: 0;
}

.partner-who {
  background: var(--bone, #fbf7ef);
  border: 1px solid rgba(7,14,28,0.08);
  border-radius: 4px;
  padding: 42px 38px;
  margin-bottom: 56px;
}
.partner-who-h {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 0.72rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold-on-paper);
  text-align: center;
  margin: 0 0 28px;
  font-weight: 600;
}
.partner-who-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 18px;
}
.partner-who-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 18px 12px;
  border-left: 1px solid rgba(7,14,28,0.08);
}
.partner-who-item:first-child {
  border-left: none;
}
.partner-who-ico {
  font-size: 1.75rem;
  line-height: 1;
}
.partner-who-label {
  font-family: 'Fraunces', 'Instrument Serif', Georgia, serif;
  font-size: 0.95rem;
  font-weight: 400;
  color: #070e1c;
  letter-spacing: -0.005em;
}

.partner-cta {
  text-align: center;
  padding: 48px 32px;
  background: var(--bone, #fbf7ef);
  border: 1px solid rgba(201,163,90,0.30);
  border-radius: 4px;
}
.partner-cta h3 {
  font-family: 'Fraunces', 'Instrument Serif', Georgia, serif;
  font-weight: 350;
  font-size: 1.75rem;
  color: #070e1c;
  margin: 0 0 10px;
  letter-spacing: -0.015em;
}
.partner-cta p {
  font-family: 'Manrope', system-ui, sans-serif;
  font-size: 0.95rem;
  color: #2a2f3d;
  margin: 0 0 26px;
}

@media (max-width: 1100px) {
  .partner-who-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 900px) {
  .partner-pillars { grid-template-columns: 1fr; gap: 18px; }
  .partner-who-grid { grid-template-columns: repeat(2, 1fr); gap: 14px; }
  .partner-who-item { border-left: none; border-top: 1px solid rgba(7,14,28,0.08); padding-top: 18px; }
  .partner-who-item:nth-child(-n+2) { border-top: none; padding-top: 0; }
}
@media (max-width: 560px) {
  .partners-section { padding: 70px 0; }
  .partner-intro p { font-size: 1.15rem; }
  .partner-who { padding: 28px 20px; }
  .partner-cta { padding: 36px 22px; }
}

/* ══════════════════════════════════════════
   REVEAL ANIMATION POLISH
   - Adds subtle horizontal-slide & scale variants
   - Adds staggered grid reveal helpers
   ══════════════════════════════════════════ */

/* Slide-from-left variant */
.reveal-left {
  opacity: 0;
  transform: translateX(-32px);
  transition: opacity 1.1s cubic-bezier(.22,.61,.36,1),
              transform 1.1s cubic-bezier(.22,.61,.36,1);
}
.reveal-left.visible, .reveal-left.on {
  opacity: 1;
  transform: translateX(0);
}

/* Slide-from-right variant */
.reveal-right {
  opacity: 0;
  transform: translateX(32px);
  transition: opacity 1.1s cubic-bezier(.22,.61,.36,1),
              transform 1.1s cubic-bezier(.22,.61,.36,1);
}
.reveal-right.visible, .reveal-right.on {
  opacity: 1;
  transform: translateX(0);
}

/* Soft-scale variant (cards) */
.reveal-scale {
  opacity: 0;
  transform: scale(0.96);
  transition: opacity 1.1s cubic-bezier(.22,.61,.36,1),
              transform 1.1s cubic-bezier(.22,.61,.36,1);
}
.reveal-scale.visible, .reveal-scale.on {
  opacity: 1;
  transform: scale(1);
}

/* Stat number count-up emphasis */
.reveal .stat-num,
.reveal .jump,
.reveal .voa-chart-jump {
  transition: color 0.6s ease 0.4s;
}

/* Gold underline reveal on headings (subtle) */
.section-head h2::after {
  content: "";
  display: block;
  width: 0;
  height: 1px;
  background: var(--gold);
  margin-top: 14px;
  transition: width 1.4s cubic-bezier(.22,.61,.36,1) 0.3s;
}
.section-head.center h2::after {
  margin-left: auto;
  margin-right: auto;
}
.reveal.visible .section-head h2::after,
.section-head.visible h2::after,
section.visible h2::after {
  width: 40px;
}
/* Trigger via parent reveal */
.reveal.visible h2::after,
.section-head .reveal.visible h2::after {
  width: 40px;
}
/* Don't apply to all headings — only inside section-head wrappers */
h2::after { display: none; }
.section-head h2::after { display: block; }

/* Page-level fade-in on tab switch */
.page {
  animation: pageFadeIn 0.7s cubic-bezier(.22,.61,.36,1);
}
@keyframes pageFadeIn {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Respect prefers-reduced-motion */
@media (prefers-reduced-motion: reduce) {
  .reveal-left, .reveal-right, .reveal-scale,
  .reveal-left.visible, .reveal-right.visible, .reveal-scale.visible {
    transition: none !important;
    transform: none !important;
    opacity: 1 !important;
  }
  .section-head h2::after { transition: none; width: 40px; }
  .page { animation: none; }
}

/* ── SVG icon defaults (replaces emoji) ── */
.iz-ico {
  width: 1.25em;
  height: 1.25em;
  display: inline-block;
  vertical-align: middle;
  flex-shrink: 0;
  color: var(--gold);
}
/* When sitting inside a circular badge */
.partner-who-ico .iz-ico,
.overview-ico .iz-ico,
.service-card .icon .iz-ico,
.audience-card .ico .iz-ico,
.step-num + .iz-ico,
.voa-seg-ico .iz-ico,
.voa-chart-ico .iz-ico,
.trust-item-icon .iz-ico,
.tool-icon .iz-ico,
.cow-card .iz-ico {
  width: 1.6em;
  height: 1.6em;
}
.club-lock .iz-ico,
.lt-lock .iz-ico,
.lt-ico .iz-ico {
  width: 1em;
  height: 1em;
}
.blog-thumb .iz-ico {
  width: 3rem;
  height: 3rem;
  color: var(--gold);
}
/* Dark-section icons stay gold; light-section icons get gold-deep for contrast */
.home-overview .iz-ico,
.careers-section .iz-ico,
#services .iz-ico,
#start-here .iz-ico,
#who-we-help .iz-ico,
#tools .iz-ico,
#why-choose-us .iz-ico,
.taxded-section .iz-ico,
.partners-section .iz-ico,
.faq-section .iz-ico,
.contact-section .iz-ico,
.blog-section .iz-ico {
  color: var(--gold-on-paper);
}

/* ══════════════════════════════════════════
   PREMIUM EFFECTS & TRANSITIONS
   - Subtle, luxury-tier interactions
   - All respect prefers-reduced-motion
   ══════════════════════════════════════════ */

/* ── Smooth scroll site-wide ── */
html {
  scroll-behavior: smooth;
}

/* ── Refined card lift effects ── */
.service-card,
.audience-card,
.overview-card,
.case-card,
.resource-card,
.tool-card,
.blog-card,
.partner-pillar,
.voa-principle,
.voa-abcet-card,
.team-card {
  transition: transform 0.55s cubic-bezier(.22,.61,.36,1),
              border-color 0.45s ease,
              box-shadow 0.55s ease,
              background-color 0.45s ease;
}
.service-card:hover,
.audience-card:hover,
.overview-card:hover,
.case-card:hover,
.resource-card:hover,
.tool-card:hover,
.partner-pillar:hover,
.voa-principle:hover,
.voa-abcet-card:hover {
  transform: translateY(-6px);
}

/* ── Gold link underline slide (content links, not nav) ── */
.section a:not(.btn):not(.nav-trigger):not(.nav-dd-link):not(.nav-dd-cta):not(.footer-links a):not(.iz-cta):not(.club-signin):not(.stgx-cta) {
  position: relative;
  text-decoration: none;
  background-image: linear-gradient(var(--gold), var(--gold));
  background-repeat: no-repeat;
  background-size: 0% 1px;
  background-position: 0 100%;
  transition: background-size 0.5s cubic-bezier(.22,.61,.36,1);
  padding-bottom: 2px;
}
.section a:not(.btn):not(.nav-trigger):not(.nav-dd-link):not(.nav-dd-cta):not(.footer-links a):not(.iz-cta):not(.club-signin):not(.stgx-cta):hover {
  background-size: 100% 1px;
}

/* ── Footer link slide-right on hover ── */
.footer-links a {
  display: inline-block;
  transition: transform 0.3s ease, color 0.3s ease;
  position: relative;
}
.footer-links a:hover {
  transform: translateX(4px);
  color: var(--gold) !important;
}

/* ── Gold button refined glow on hover ── */
.btn-primary {
  position: relative;
  transition: transform 0.4s cubic-bezier(.22,.61,.36,1),
              box-shadow 0.4s ease,
              background-color 0.3s ease;
}
.btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 30px -10px rgba(201,163,90,0.55),
              0 0 0 1px rgba(201,163,90,0.3);
}
.btn-primary:active {
  transform: translateY(0);
  transition-duration: 0.1s;
}

/* ── Secondary button refined ── */
.btn-secondary {
  transition: border-color 0.35s ease,
              background-color 0.35s ease,
              transform 0.35s cubic-bezier(.22,.61,.36,1);
}
.btn-secondary:hover {
  transform: translateY(-2px);
}

/* ── Nav trigger underline reveal ── */
.nav-trigger {
  position: relative;
}
.nav-trigger::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -4px;
  width: 0;
  height: 1px;
  background: var(--gold);
  transition: width 0.4s cubic-bezier(.22,.61,.36,1), left 0.4s cubic-bezier(.22,.61,.36,1);
}
.nav-trigger:hover::after,
.nav-item:hover .nav-trigger::after,
.nav-trigger.active::after {
  width: 100%;
  left: 0;
}

/* ── Nav dropdown — refined entry ── */
.nav-dropdown {
  transition: opacity 0.35s cubic-bezier(.22,.61,.36,1),
              transform 0.4s cubic-bezier(.22,.61,.36,1),
              visibility 0.35s;
  transform-origin: top center;
}
.nav-item:not(:hover) .nav-dropdown {
  transform: translateY(-8px) scale(0.98);
}

/* ── Nav dd link gold dot prefix on hover ── */
.nav-dd-link {
  position: relative;
  padding-left: 0;
  transition: padding-left 0.35s cubic-bezier(.22,.61,.36,1),
              color 0.3s ease;
}
.nav-dd-link::before {
  content: "";
  position: absolute;
  left: -10px;
  top: 50%;
  transform: translateY(-50%);
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--gold);
  opacity: 0;
  transition: opacity 0.3s ease, left 0.35s cubic-bezier(.22,.61,.36,1);
}
.nav-dd-link:hover {
  padding-left: 12px;
  color: var(--gold) !important;
}
.nav-dd-link:hover::before {
  opacity: 1;
  left: 0;
}

/* ── SVG icon micro-animations on parent hover ── */
.service-card .iz-ico,
.audience-card .iz-ico,
.overview-card .iz-ico,
.partner-who-item .iz-ico,
.tool-card .iz-ico,
.resource-card .iz-ico {
  transition: transform 0.6s cubic-bezier(.22,.61,.36,1),
              color 0.4s ease;
}
.service-card:hover .iz-ico,
.audience-card:hover .iz-ico,
.overview-card:hover .iz-ico,
.partner-who-item:hover .iz-ico,
.tool-card:hover .iz-ico,
.resource-card:hover .iz-ico {
  transform: scale(1.12) rotate(-3deg);
}

/* ── Hero kicker fade-in delay ── */
.hero-kicker, .hero-meta {
  animation: heroKickerFade 1.2s cubic-bezier(.22,.61,.36,1) 0.1s both;
}
@keyframes heroKickerFade {
  from { opacity: 0; letter-spacing: 0.08em; }
  to   { opacity: 1; letter-spacing: 0.18em; }
}

/* ── Hero h1 letter spacing settle ── */
.hero h1 {
  animation: heroH1Settle 1.4s cubic-bezier(.22,.61,.36,1) 0.2s both;
}
@keyframes heroH1Settle {
  from { opacity: 0; transform: translateY(20px); letter-spacing: 0.02em; }
  to   { opacity: 1; transform: translateY(0); letter-spacing: -0.02em; }
}

/* ── Hero lead fade-up ── */
.hero-lead {
  animation: heroLeadFade 1.2s cubic-bezier(.22,.61,.36,1) 0.5s both;
}
@keyframes heroLeadFade {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ── Hero CTAs slide up ── */
.hero-dual-cta {
  animation: heroCtaFade 1s cubic-bezier(.22,.61,.36,1) 0.8s both;
}
@keyframes heroCtaFade {
  from { opacity: 0; transform: translateY(20px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ── Hero card slide-in ── */
.hero-card {
  animation: heroCardSlide 1.3s cubic-bezier(.22,.61,.36,1) 0.6s both;
}
@keyframes heroCardSlide {
  from { opacity: 0; transform: translateX(30px); }
  to   { opacity: 1; transform: translateX(0); }
}

/* ── Stat number gentle pulse on view ── */
.stat-num, .voa-chart-jump, .jump-num, .jump {
  transition: color 0.6s ease, transform 0.6s cubic-bezier(.22,.61,.36,1);
}
.reveal.visible .stat-num,
.reveal.visible .voa-chart-jump,
.reveal.visible .jump-num {
  animation: numPop 0.9s cubic-bezier(.16,1,.3,1) 0.4s both;
}
@keyframes numPop {
  0%   { transform: scale(0.85); opacity: 0; }
  60%  { transform: scale(1.06); opacity: 1; }
  100% { transform: scale(1); opacity: 1; }
}

/* ── VoA chart bar grow-in ── */
.reveal.visible .voa-chart-bar.voa-before {
  animation: barGrowBefore 1.2s cubic-bezier(.22,.61,.36,1) 0.3s both;
}
.reveal.visible .voa-chart-bar.voa-after {
  animation: barGrowAfter 1.4s cubic-bezier(.22,.61,.36,1) 0.7s both;
}
@keyframes barGrowBefore {
  from { width: 0% !important; opacity: 0; }
  to   { opacity: 1; }
}
@keyframes barGrowAfter {
  from { width: 0% !important; opacity: 0; }
  to   { opacity: 1; }
}

/* ── Tick checkmark scale-in ── */
.scorecard-tick,
.tick-item .tick {
  transition: transform 0.45s cubic-bezier(.16,1,.3,1);
}
.reveal.visible .scorecard-tick,
.reveal.visible .tick-item .tick {
  animation: tickPop 0.6s cubic-bezier(.16,1,.3,1) both;
}
@keyframes tickPop {
  0%   { transform: scale(0); }
  70%  { transform: scale(1.18); }
  100% { transform: scale(1); }
}

/* ── Stage card gentle slide-in (staggered) ── */
.stgx { transition: transform 0.55s cubic-bezier(.22,.61,.36,1), border-color 0.4s ease, background 0.4s ease, box-shadow 0.4s ease; }
.stgx.s1.reveal.visible { animation: stgxIn 0.7s cubic-bezier(.22,.61,.36,1) 0.0s both; }
.stgx.s2.reveal.visible { animation: stgxIn 0.7s cubic-bezier(.22,.61,.36,1) 0.08s both; }
.stgx.s3.reveal.visible { animation: stgxIn 0.7s cubic-bezier(.22,.61,.36,1) 0.16s both; }
.stgx.s4.reveal.visible { animation: stgxIn 0.7s cubic-bezier(.22,.61,.36,1) 0.24s both; }
.stgx.s5.reveal.visible { animation: stgxIn 0.7s cubic-bezier(.22,.61,.36,1) 0.32s both; }
.stgx.s6.reveal.visible { animation: stgxIn 0.7s cubic-bezier(.22,.61,.36,1) 0.40s both; }
@keyframes stgxIn {
  from { opacity: 0; transform: translateY(24px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ── Stagger card grids (services, audience, partner pillars) ── */
.services-grid > .reveal:nth-child(1).visible { animation-delay: 0s; }
.services-grid > .reveal:nth-child(2).visible { animation-delay: 0.08s; }
.services-grid > .reveal:nth-child(3).visible { animation-delay: 0.16s; }
.services-grid > .reveal:nth-child(4).visible { animation-delay: 0.24s; }
.services-grid > .reveal:nth-child(5).visible { animation-delay: 0.32s; }
.services-grid > .reveal:nth-child(6).visible { animation-delay: 0.40s; }

/* ── Eyebrow dot blink ── */
.eyebrow-dot {
  animation: dotBlink 2.6s ease-in-out infinite;
}
@keyframes dotBlink {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%      { opacity: 0.45; transform: scale(0.85); }
}

/* ── Cow live label pulsing dot ── */
.cow-live-dot, .nav-health-dot {
  animation: livePulse 1.8s ease-in-out infinite;
}
@keyframes livePulse {
  0%, 100% { opacity: 1;   box-shadow: 0 0 0 0 rgba(201,163,90,0.55); }
  50%      { opacity: 0.6; box-shadow: 0 0 0 6px rgba(201,163,90,0); }
}

/* ── Cursor refinement on all clickables ── */
button, a, .btn, [data-trigger], [onclick] { cursor: pointer; }

/* ── Form input focus refinement ── */
input[type="email"],
input[type="text"],
input[type="tel"],
textarea,
select {
  transition: border-color 0.3s ease,
              box-shadow 0.3s ease,
              background-color 0.3s ease;
}
input[type="email"]:focus,
input[type="text"]:focus,
input[type="tel"]:focus,
textarea:focus,
select:focus {
  outline: none;
  border-color: var(--gold) !important;
  box-shadow: 0 0 0 3px rgba(201,163,90,0.18);
}

/* ── Partner pillar number gentle drift ── */
.partner-pillar-num {
  transition: color 0.5s ease, transform 0.5s cubic-bezier(.22,.61,.36,1);
}
.partner-pillar:hover .partner-pillar-num {
  color: var(--gold);
  transform: translateX(2px);
}

/* ── Image / icon badges subtle scale on parent hover ── */
.scorecard-tick { transition: transform 0.35s cubic-bezier(.16,1,.3,1); }

/* ── Section heading underline pulse on reveal ── */
.section-head h2 {
  position: relative;
}

/* ── Footer logo subtle hover ── */
.footer-logo {
  transition: transform 0.5s cubic-bezier(.22,.61,.36,1);
}
.footer-logo:hover {
  transform: scale(1.04);
}

/* ── Social icons hover ── */
.footer-social a, .footer-socials a {
  transition: transform 0.35s cubic-bezier(.22,.61,.36,1),
              color 0.3s ease;
}
.footer-social a:hover, .footer-socials a:hover {
  transform: translateY(-3px);
  color: var(--gold);
}

/* ── Page transition refinement ── */
.page[hidden] { display: none; }
.page:not([hidden]) {
  animation: pageReveal 0.8s cubic-bezier(.22,.61,.36,1);
}
@keyframes pageReveal {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ══════════════ REDUCED MOTION RESPECT ══════════════ */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  .service-card:hover,
  .audience-card:hover,
  .overview-card:hover,
  .partner-pillar:hover,
  .btn-primary:hover,
  .btn-secondary:hover {
    transform: none !important;
  }
}

/* Optional marketing consent shared by Contact, Health Check, Booking and signup.
   It follows the site's editorial field language: Manrope body copy, square
   geometry, a champagne wash and a single gold rule. */
.zephyr-marketing-consent {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 11px;
  align-items: start;
  margin: 2px 0;
  padding: 11px 13px;
  border: 1px solid rgba(7, 14, 28, .14);
  border-left: 2px solid var(--gold-on-paper);
  background: rgba(201, 163, 90, .06);
  color: rgba(7, 14, 28, .72);
  font-family: var(--font-sans);
  font-size: .78rem;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.55;
  text-transform: none;
  cursor: pointer;
  transition: border-color .3s ease, background-color .3s ease;
}

.zephyr-marketing-consent:hover {
  border-color: rgba(201, 163, 90, .48);
  background: rgba(201, 163, 90, .09);
}

.zephyr-marketing-consent span {
  display: block;
}

.form-grid > .zephyr-marketing-consent,
.conv-form > .zephyr-marketing-consent {
  grid-column: 1 / -1;
}

.zephyr-marketing-consent input[type="checkbox"] {
  display: grid;
  place-content: center;
  appearance: none;
  -webkit-appearance: none;
  width: 17px !important;
  height: 17px !important;
  min-height: 0 !important;
  margin: 2px 0 0 !important;
  padding: 0 !important;
  border: 1px solid rgba(7, 14, 28, .42) !important;
  border-radius: 0 !important;
  background: transparent !important;
  cursor: pointer;
  transition: border-color .2s ease, background-color .2s ease;
}

.zephyr-marketing-consent input[type="checkbox"]::before {
  content: "";
  width: 8px;
  height: 4px;
  border-bottom: 2px solid var(--ink);
  border-left: 2px solid var(--ink);
  transform: rotate(-45deg) scale(0);
  transform-origin: center;
  transition: transform .16s ease;
}

.zephyr-marketing-consent input[type="checkbox"]:checked {
  border-color: var(--gold-on-paper) !important;
  background: var(--gold-on-paper) !important;
}

.zephyr-marketing-consent input[type="checkbox"]:checked::before {
  transform: rotate(-45deg) scale(1);
}

.zephyr-marketing-consent input[type="checkbox"]:focus-visible {
  outline: 2px solid var(--gold-on-paper) !important;
  outline-offset: 3px;
}

/* Lead cards sit on midnight ink; keep the same structure but flip the tones. */
.form-grid > .zephyr-marketing-consent {
  border-color: rgba(201, 163, 90, .22);
  border-left-color: var(--gold);
  background: rgba(201, 163, 90, .055);
  color: rgba(244, 241, 234, .76);
}

.form-grid > .zephyr-marketing-consent:hover {
  border-color: rgba(201, 163, 90, .48);
  background: rgba(201, 163, 90, .085);
}

.form-grid > .zephyr-marketing-consent input[type="checkbox"] {
  border-color: rgba(244, 241, 234, .5) !important;
}

.zephyr-marketing-consent a,
.zephyr-subscription-disclosure a,
.inline-news-fineprint a {
  color: inherit;
  text-decoration: underline;
  text-decoration-color: rgba(201, 163, 90, .65);
  text-underline-offset: 2px;
}

.zephyr-subscription-disclosure {
  margin: 9px 0 0;
  padding-left: 10px;
  border-left: 2px solid rgba(201, 163, 90, .62);
  color: rgba(7, 14, 28, .62);
  font-family: var(--font-sans);
  font-size: .72rem;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.55;
}

/* ══════════════════════════════════════════
   FOOTER BRAND COLUMN — redesigned
   ══════════════════════════════════════════ */
.footer-brand-col {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.footer-brand-symbol { height: calc(var(--iz-sym-f) * 1.1230); width: auto; display: block; flex-shrink: 0; }
.footer-brand-rule { flex-shrink: 0; width: 1px; height: calc(var(--iz-sym-f) * 0.734); background: rgba(244, 241, 234, 0.32); margin-left: calc(var(--iz-sym-f) * 0.216); }
/* 40px canvas -> 35.6px of ink (svg canvas/ink = 1.1230), matching the 36px
   mark it replaces. No ring: README says the footer mark is unringed. */

.footer-brand-row {
  /* Same lockup as the header, from lockup-horizontal-bone.png.
     --iz-sym-f = the symbol's INK height; every part derives from it:
        symbol canvas 1.1230 . divider height 0.734 . font-size 0.2553
        gap sym->divider 0.2768 (less the svg's own 0.061 pad = 0.216)
        gap divider->word 0.2429 . line-height 1.305 . tracking 0.205em */
  --iz-sym-f: 51px;
  display: flex;
  align-items: center;
  gap: 0;
  margin-bottom: 14px;
}
.footer-brand-mark {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  overflow: hidden;
}
.footer-brand-mark img {
  width: 76%;
  height: 76%;
  object-fit: contain;
  display: block;
}
.footer-brand-name {
  font-family: var(--font-mono);
  font-style: normal;
  font-weight: 700;
  font-size: calc(var(--iz-sym-f) * 0.2553);
  text-transform: uppercase;
  color: var(--bone);
  letter-spacing: 0.205em;
  line-height: 1.305;
  margin-left: calc(var(--iz-sym-f) * 0.2429);
  margin-right: -0.205em;
  white-space: nowrap;
}
/* Tagline: short, then small caps keyword line */
.footer-brand-tagline {
  font-family: 'Manrope', system-ui, sans-serif;
  font-size: 0.82rem;
  line-height: 1.65;
  color: rgba(231,221,200,0.75);
  margin: 0 0 10px;
  max-width: 240px;
}
.footer-brand-sub {
  display: block;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 0.62rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(231,221,200,0.42);
  margin-bottom: 22px;
  padding-top: 4px;
}
/* Newsletter block — flush, no orphaned divider */
.footer-news-block {
  border-top: 1px solid rgba(244,237,224,0.10);
  padding-top: 16px;
  margin-bottom: 18px;
}
.footer-news-benefit {
  font-family: 'Manrope', system-ui, sans-serif;
  font-size: 0.82rem;
  line-height: 1.6;
  color: rgba(231,221,200,0.68);
  margin: 0 0 12px;
  max-width: 240px;
}
.footer-news-benefit strong {
  color: rgba(231,221,200,0.92);
  font-weight: 600;
}
.footer-news-eyebrow {
  display: inline;
  font-family: var(--font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--eyebrow);
  margin-right: 6px;
}
.footer-newsletter {
  margin: 0;
}
.footer-news-row {
  display: flex;
  gap: 0;
}
.footer-news-row input {
  flex: 1;
  padding: 9px 11px;
  background: rgba(244,237,224,0.06);
  border: 1px solid rgba(244,237,224,0.14);
  border-right: none;
  border-radius: 4px 0 0 4px;
  color: var(--bone);
  font-family: var(--font-sans);
  font-size: 0.82rem;
  outline: none;
  transition: border-color .35s ease, background .35s ease;
}
.footer-news-row input::placeholder {
  color: rgba(231,221,200,0.28);
}
.footer-news-row input:focus {
  border-color: var(--gold);
  background: rgba(244,237,224,0.09);
}
.footer-news-row button {
  padding: 9px 13px;
  background: var(--gold);
  color: #070e1c;
  border: none;
  border-radius: 0 4px 4px 0;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background .3s ease;
  white-space: nowrap;
}
.footer-news-row button:hover {
  background: #b8923e;
}
.footer-news-fineprint {
  display: block;
  font-size: 0.62rem;
  color: rgba(231,221,200,0.32);
  margin-top: 7px;
  font-style: italic;
}
.footer-social {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.footer-social a {
  width: 32px;
  height: 32px;
  border: 1px solid rgba(244,237,224,0.14);
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: rgba(231,221,200,0.50);
  transition: border-color .35s ease, color .35s ease, transform .35s cubic-bezier(.22,.61,.36,1);
}
.footer-social a svg {
  width: 13px;
  height: 13px;
  fill: currentColor;
}
.footer-social a:hover {
  border-color: var(--gold);
  color: var(--gold);
  transform: translateY(-2px);
}

/* ── Footer newsletter pitch ── */
.footer-news-pitch {
  margin-bottom: 14px;
}
.footer-news-eyebrow {
  display: inline-block;
  font-family: var(--font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--eyebrow);
  margin-bottom: 7px;
}
.footer-news-benefit {
  font-family: 'Manrope', system-ui, sans-serif;
  font-size: 0.82rem;
  line-height: 1.6;
  color: rgba(231,221,200,0.72);
  margin: 0;
  max-width: 230px;
}
.footer-news-benefit strong {
  color: rgba(231,221,200,0.95);
  font-weight: 600;
}
.footer-news-fineprint {
  display: block;
  font-size: 0.72rem;
  color: rgba(231,221,200,0.38);
  margin-top: 8px;
  font-style: italic;
  line-height: 1.5;
}

/* ── btn-secondary on light/cream backgrounds ── */
.partners-section .btn-secondary,
.partner-cta .btn-secondary,
.taxded-section .btn-secondary,
#start-here .btn-secondary,
#who-we-help .btn-secondary,
#overview .btn-secondary,
#why-choose-us .btn-secondary,
section[style*="bg-soft"] .btn-secondary {
  border-color: rgba(7,14,28,0.30) !important;
  color: #070e1c !important;
  background: transparent !important;
}
.partners-section .btn-secondary:hover,
.partner-cta .btn-secondary:hover,
section[style*="bg-soft"] .btn-secondary:hover {
  border-color: var(--gold-on-paper) !important;
  color: var(--gold-on-paper) !important;
}

/* ── Stage card title: graceful 2-line variant for "Retirement & Enjoyment" ── */
.stgx-name-sub {
  display: block;
  font-family: var(--font-accent);
  font-style: italic;
  font-weight: 300;
  font-size: 1.03em;
  color: rgba(244,237,224,0.78);
  margin-top: 1px;
  letter-spacing: -0.005em;
}
.stgx-name-2line {
  flex-direction: column;
  gap: 0;
}


/* ── Podcast coming-soon badge ── */
.social-ic.social-ic-soon {
  position: relative;
  cursor: default;
  opacity: 0.55;
  border-style: dashed;
}
.social-ic.social-ic-soon:hover {
  opacity: 0.85;
  transform: none !important;
  border-color: var(--gold);
  color: var(--gold);
}
.social-ic-soon-tag {
  position: absolute;
  bottom: -6px;
  right: -8px;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 0.62rem;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  background: var(--gold);
  color: #070e1c;
  padding: 1px 5px;
  border-radius: 3px;
  font-weight: 700;
  white-space: nowrap;
  line-height: 1.4;
}

/* ══════════════════════════════════════════
   CLIENT LOGIN — top nav (subtle, premium)
   ══════════════════════════════════════════ */
.nav-client-login {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 16px;
  margin-right: 10px;
  background: transparent;
  border: 1px solid rgba(201,163,90,0.32);
  border-radius: 999px;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(244,237,224,0.78);
  cursor: pointer;
  transition: border-color 0.35s ease, color 0.35s ease, background-color 0.35s ease, transform 0.35s cubic-bezier(.22,.61,.36,1);
}
.nav-client-login:hover {
  border-color: var(--gold);
  color: var(--gold);
  background: rgba(201,163,90,0.06);
  transform: translateY(-1px);
}
.nav-client-login-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--gold);
  flex-shrink: 0;
  box-shadow: 0 0 0 0 rgba(201,163,90,0.55);
  animation: clientLoginPulse 2.6s infinite cubic-bezier(.66,0,.34,1);
}
@keyframes clientLoginPulse {
  0%   { box-shadow: 0 0 0 0 rgba(201,163,90,0.55); }
  70%  { box-shadow: 0 0 0 6px rgba(201,163,90,0); }
  100% { box-shadow: 0 0 0 0 rgba(201,163,90,0); }
}
/* Hide on small mobile to save space */
@media (max-width: 720px) {
  .nav-client-login { display: none; }
}

/* ── FAQ group labels (for topic-organised expansion) ── */
.faq-group-label {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 0.62rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold-on-paper);
  margin: 24px 0 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(201,163,90,0.22);
  font-weight: 600;
}
.faq-group-label:first-child {
  margin-top: 0;
}

/* ══════════════════════════════════════════
   GLOSSARY SECTION — AEO-optimised content
   ══════════════════════════════════════════ */
.glossary-section {
  border-top: 1px solid var(--hairline);
}
.glossary-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-top: 28px;
}
.glossary-item {
  background: var(--bone);
  border: 1px solid var(--hairline);
  border-radius: 4px;
  padding: 18px 18px 16px;
  transition: border-color 0.4s ease, transform 0.4s cubic-bezier(.22,.61,.36,1), box-shadow 0.4s ease;
  position: relative;
}
.glossary-item:hover {
  border-color: rgba(201,163,90,0.42);
  transform: translateY(-2px);
  box-shadow: 0 8px 20px -10px rgba(7,14,28,0.15);
}
.glossary-term {
  font-family: 'Fraunces', 'Instrument Serif', Georgia, serif;
  font-size: 1.15rem;
  font-weight: 400;
  color: var(--ink, #070e1c);
  margin: 0 0 8px;
  letter-spacing: -0.01em;
  line-height: 1.25;
}
.glossary-def {
  font-family: 'Manrope', system-ui, sans-serif;
  font-size: 0.82rem;
  line-height: 1.6;
  color: rgba(7,14,28,0.72);
  margin: 0 0 12px;
}
.glossary-tag {
  display: inline-block;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 0.62rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold-on-paper);
  padding: 3px 9px;
  background: rgba(201,163,90,0.08);
  border: 1px solid rgba(201,163,90,0.22);
  border-radius: 3px;
  font-weight: 600;
}
@media (max-width: 720px) {
  .glossary-grid { grid-template-columns: 1fr; gap: 12px; }
}

/* ── Glossary filter chips ── */
.glossary-filters {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 32px;
  margin-bottom: 4px;
}
.glossary-chip {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 0.62rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-weight: 600;
  padding: 7px 14px;
  background: transparent;
  border: 1px solid rgba(7,14,28,0.15);
  border-radius: 999px;
  color: rgba(7,14,28,0.65);
  cursor: pointer;
  transition: border-color 0.3s ease, color 0.3s ease, background 0.3s ease, transform 0.3s ease;
}
.glossary-chip:hover {
  border-color: var(--gold);
  color: var(--gold-on-paper);
  transform: translateY(-1px);
}
.glossary-chip.active {
  background: var(--ink, #070e1c);
  border-color: var(--ink, #070e1c);
  color: var(--gold);
}
.glossary-chip-count {
  font-size: 0.62rem;
  opacity: 0.55;
  margin-left: 2px;
  letter-spacing: 0;
}
/* Filtered items animation */
.glossary-item.hidden {
  display: none;
}
.glossary-term {
  font-size: 1.15rem;
  margin: 0 0 6px;
}
.glossary-def {
  font-size: 0.82rem;
  line-height: 1.55;
  margin: 0 0 10px;
}
.glossary-tag {
  font-size: 0.62rem;
  padding: 2px 7px;
}
@media (max-width: 980px) {
  .glossary-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .glossary-grid { grid-template-columns: 1fr; gap: 10px; }
  .glossary-filters { gap: 6px; }
  .glossary-chip { font-size: 0.62rem; padding: 6px 11px; }
}

/* ── FAQ topic tabs ── */
.faq-tabs {
  display: flex;
  gap: 4px;
  margin-bottom: 24px;
  border-bottom: 1px solid var(--hairline);
  flex-wrap: wrap;
}
.faq-tab {
  font-family: 'Manrope', system-ui, sans-serif;
  font-size: 0.82rem;
  font-weight: 600;
  padding: 10px 16px;
  background: transparent;
  border: none;
  border-bottom: 2px solid transparent;
  color: rgba(7,14,28,0.50);
  cursor: pointer;
  transition: color 0.3s ease, border-color 0.3s ease;
  margin-bottom: -1px;
}
.faq-tab:hover {
  color: var(--gold-on-paper);
}
.faq-tab.active {
  color: var(--ink, #070e1c);
  border-bottom-color: var(--gold);
}
/* Hide non-active group items */
.faq-item[data-faq-group]:not([data-faq-group="start"]) {
  display: none;
}
.faq-item.faq-visible {
  display: block;
}
.faq-item.faq-hidden {
  display: none;
}
@media (max-width: 600px) {
  .faq-tab { font-size: 0.72rem; padding: 9px 11px; }
}
/* Remove old group label CSS reference since we no longer render them */
.faq-group-label { display: none; }

/* ══════════════════════════════════════════
   KNOWLEDGE BASE — luxury editorial style
   Centred, numbered, generous breathing room
   ══════════════════════════════════════════ */
.knowledge-section {
  border-top: 1px solid var(--hairline);
}

/* ── Centred header ── */
.kb-head {
  text-align: center;
  max-width: 720px;
  margin: 0 auto 36px;
}
.kb-head .eyebrow {
  justify-content: center;
}
.kb-title {
  font-family: 'Fraunces', 'Instrument Serif', Georgia, serif;
  font-size: clamp(2.6rem, 5vw, 4.2rem);
  font-weight: 400;
  line-height: 1.0;
  letter-spacing: -0.035em;
  color: var(--ink, #070e1c);
  margin: 12px 0 18px;
}
.kb-title em {
  font-family: var(--font-emphasis);
  font-style: italic;
  color: var(--gold-on-paper);
  letter-spacing: -0.02em;
}
.kb-lead {
  font-family: 'Manrope', system-ui, sans-serif;
  font-size: 0.95rem;
  line-height: 1.65;
  color: rgba(7,14,28,0.62);
  margin: 0 auto;
  max-width: 580px;
}

/* ── Tab switcher — centred segmented control ── */
.kb-tabs {
  display: inline-flex;
  background: rgba(7,14,28,0.06);
  border-radius: 999px;
  padding: 5px;
  gap: 2px;
  margin: 0 auto 56px;
  justify-content: center;
}
.kb-tabs[role="tablist"] {
  display: flex;
}
.kb-tabs-wrap {
  text-align: center;
}
.kb-tab {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  padding: 9px 18px;
  background: transparent;
  border: none;
  border-radius: 999px;
  color: rgba(7,14,28,0.50);
  cursor: pointer;
  transition: background 0.4s cubic-bezier(.22,.61,.36,1), color 0.3s ease, box-shadow 0.4s ease;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  white-space: nowrap;
}
.kb-tab:hover { color: var(--ink, #070e1c); }
.kb-tab.active {
  background: var(--ink, #070e1c);
  color: var(--gold);
  box-shadow: 0 2px 10px rgba(7,14,28,0.18);
}
.kb-tab-label { letter-spacing: 0.10em; }
.kb-tab-count {
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  opacity: 0.55;
  padding: 2px 5px;
  background: rgba(7,14,28,0.05);
  border-radius: 3px;
}
.kb-tab.active .kb-tab-count {
  background: rgba(201,163,90,0.15);
  color: var(--gold);
  opacity: 1;
}

/* Wrap tabs centrally */
.kb-tabs {
  margin-left: auto;
  margin-right: auto;
}

/* ── Accordion content — single column, refined ── */
.kb-content {
  max-width: 820px;
  margin: 0 auto;
}
.kb-panel { display: none; }
.kb-panel-active { display: block; animation: kbFadeIn 0.5s cubic-bezier(.22,.61,.36,1); }
@keyframes kbFadeIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

.kb-item {
  border-bottom: 1px solid rgba(7,14,28,0.08);
  background: transparent;
  position: relative;
  transition: background 0.35s ease;
}
.kb-item:first-child { border-top: 1px solid rgba(7,14,28,0.08); }
.kb-item::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 2px;
  background: var(--gold);
  opacity: 0;
  transition: opacity 0.4s cubic-bezier(.22,.61,.36,1);
}
.kb-item:hover::before,
.kb-item[open]::before { opacity: 1; }

.kb-item summary {
  list-style: none;
  cursor: pointer;
  padding: 22px 48px 22px 28px;
  display: flex;
  align-items: baseline;
  gap: 18px;
  position: relative;
  transition: padding-left 0.4s cubic-bezier(.22,.61,.36,1);
}
.kb-item summary::-webkit-details-marker { display: none; }
.kb-item:hover summary { padding-left: 36px; }
.kb-item[open] summary { padding-left: 36px; padding-bottom: 12px; }

.kb-num {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: var(--gold-on-paper);
  flex-shrink: 0;
  width: 24px;
  margin-top: 2px;
  opacity: 0.8;
  transition: opacity 0.3s ease, color 0.3s ease;
}
.kb-item:hover .kb-num,
.kb-item[open] .kb-num { opacity: 1; color: var(--gold); }

.kb-q {
  font-family: 'Fraunces', 'Instrument Serif', Georgia, serif;
  font-size: 1.15rem;
  font-weight: 400;
  color: var(--ink, #070e1c);
  line-height: 1.32;
  letter-spacing: -0.012em;
  flex: 1;
  transition: color 0.3s ease;
}
.kb-item:hover .kb-q,
.kb-item[open] .kb-q { color: var(--gold-on-paper); }

.kb-item summary::after {
  content: "";
  position: absolute;
  right: 14px;
  top: 50%;
  width: 10px;
  height: 10px;
  border-right: 1.5px solid var(--gold);
  border-bottom: 1.5px solid var(--gold);
  transform: translateY(-70%) rotate(45deg);
  transition: transform 0.4s cubic-bezier(.22,.61,.36,1);
}
.kb-item[open] summary::after {
  transform: translateY(-30%) rotate(-135deg);
}

.kb-a {
  font-family: 'Manrope', system-ui, sans-serif;
  font-size: 0.95rem;
  line-height: 1.7;
  color: rgba(7,14,28,0.70);
  padding: 0 48px 26px 70px;
  max-width: 720px;
}
/* [21 Jul] "Watch on YouTube" deep-links inside glossary/FAQ answers — link to
   Dean's videos at the relevant timestamp. Small, gold, with a YT glyph. */
.kb-watch {
  display: inline-flex; align-items: center; gap: 7px;
  margin-top: 10px;
  font-family: var(--font-mono); font-size: 0.72rem; font-weight: 600;
  letter-spacing: 0.02em; color: var(--gold-on-paper) !important;
  text-decoration: none; border-bottom: none !important;
}
.kb-watch svg { width: 17px; height: 17px; flex: none; color: #c0392b; }
.kb-watch:hover { color: var(--ink) !important; }
.kb-watch:hover svg { color: #c0392b; }
.kb-a strong { color: var(--ink, #070e1c); font-weight: 600; }
.kb-a em {
  
  color: var(--gold-on-paper);
  font-family: inherit; font-weight: 600;
  font-weight: 400;
}

/* ── Footer CTA ── */
.kb-foot {
  text-align: center;
  margin-top: 56px;
  padding-top: 36px;
  border-top: 1px solid rgba(7,14,28,0.08);
  max-width: 820px;
  margin-left: auto;
  margin-right: auto;
}
.kb-foot-q {
  font-family: 'Manrope', system-ui, sans-serif;
  font-size: 0.95rem;
  color: rgba(7,14,28,0.55);
  margin: 0 0 10px;
}
.kb-ask-link {
  font-family: var(--font-accent); font-style: italic;
  font-size: 1.4rem;
  
  font-weight: 700;
  color: var(--gold-on-paper);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: gap 0.35s cubic-bezier(.22,.61,.36,1), color 0.3s ease;
}
.kb-ask-link:hover {
  gap: 14px;
  color: var(--gold);
}
.kb-arrow {
  font-style: normal;
  font-family: 'Manrope', system-ui, sans-serif;
  display: inline-block;
  transition: transform 0.35s cubic-bezier(.22,.61,.36,1);
}

/* ── Responsive ── */
@media (max-width: 720px) {
  .kb-title { font-size: 2.2rem; }
  .kb-tabs { width: 100%; justify-content: space-between; }
  .kb-tab { flex: 1; justify-content: center; padding: 8px 6px; }
  .kb-item summary { padding: 18px 36px 18px 18px; gap: 12px; }
  .kb-item:hover summary,
  .kb-item[open] summary { padding-left: 22px; }
  .kb-q { font-size: 0.95rem; }
  .kb-a { font-size: 0.82rem; padding: 0 18px 22px 46px; }
  .kb-num { width: 18px; font-size: 0.62rem; }
}

/* Webinar signup block */
/* Webinar card — gold-tinted cream for unified light-section feel */
.contact-webinar {
  margin-top: 16px;
  padding: 22px 22px 18px;
  background: var(--bone, #fbf7ef);
  border-radius: 6px;
  border: 1px solid rgba(201,163,90,0.32);
  position: relative;
}
.contact-webinar::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: var(--gold);
  border-radius: 6px 6px 0 0;
}
.contact-webinar-eyebrow {
  font-family: var(--font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--eyebrow);
  font-weight: 500;
  margin-bottom: 10px;
}
.contact-webinar-h {
  font-family: 'Fraunces', 'Instrument Serif', Georgia, serif;
  font-size: 1.15rem;
  font-weight: 400;
  color: var(--ink, #070e1c);
  margin: 0 0 8px;
  letter-spacing: -0.01em;
  line-height: 1.25;
}
.contact-webinar-sub {
  font-family: 'Manrope', system-ui, sans-serif;
  font-size: 0.82rem;
  line-height: 1.55;
  color: rgba(7,14,28,0.72);
  margin: 0 0 14px;
}
.contact-webinar-form {
  display: flex;
  gap: 0;
  margin-bottom: 10px;
}
.contact-webinar-form input {
  flex: 1;
  padding: 11px 13px;
  background: #ffffff;
  border: 1px solid rgba(7,14,28,0.15);
  border-right: none;
  border-radius: 4px 0 0 4px;
  color: var(--ink, #070e1c);
  font-family: 'Manrope', system-ui, sans-serif;
  font-size: 0.82rem;
  outline: none;
  transition: border-color .35s ease, background .35s ease;
}
.contact-webinar-form input::placeholder { color: rgba(7,14,28,0.38); }
.contact-webinar-form input:focus {
  border-color: var(--gold);
  background: rgba(201,163,90,0.04);
}
.contact-webinar-form button {
  border-radius: 0 4px 4px 0;
  padding: 0 18px;
  font-size: 0.62rem;
  letter-spacing: 0.10em;
  white-space: nowrap;
  background: var(--ink, #070e1c);
  color: var(--gold);
  border: 1px solid var(--ink, #070e1c);
}
.contact-webinar-form button:hover {
  background: var(--gold);
  color: var(--ink, #070e1c);
  border-color: var(--gold);
}
.contact-webinar-fineprint {
  font-family: 'Manrope', system-ui, sans-serif;
  font-size: 0.72rem;
  color: rgba(7,14,28,0.50);
  margin: 0;
  font-style: italic;
}

/* ══════════════════════════════════════════
   VOA — Unified proof subsection
   Compact 5-stat strip + chart subheading
   ══════════════════════════════════════════ */
.voa-stat-strip {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 12px;
  margin: 28px 0 40px;
}
.voa-stat-pill {
  background: var(--bone);
  border: 1px solid rgba(7,14,28,0.08);
  border-radius: 6px;
  padding: 18px 16px;
  text-align: center;
  transition: border-color 0.4s ease, transform 0.4s cubic-bezier(.22,.61,.36,1), box-shadow 0.4s ease;
}
.voa-stat-pill:hover {
  border-color: rgba(201,163,90,0.42);
  transform: translateY(-3px);
  box-shadow: 0 10px 24px -10px rgba(7,14,28,0.12);
}
.voa-pill-num {
  display: block;
  font-family: 'Fraunces', 'Instrument Serif', Georgia, serif;
  
  font-weight: 300;
  font-size: 2.2rem;
  color: var(--gold-on-paper);
  line-height: 1;
  margin-bottom: 6px;
  letter-spacing: -0.02em;
}
.voa-pill-label {
  display: block;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 0.62rem;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: rgba(7,14,28,0.65);
  font-weight: 600;
  line-height: 1.4;
}
.voa-chart-subhead {
  text-align: center;
  margin: 0 0 24px;
  padding-top: 24px;
  border-top: 1px solid rgba(7,14,28,0.08);
}
.voa-chart-subhead span {
  font-family: 'Fraunces', 'Instrument Serif', Georgia, serif;
  font-size: 1.4rem;
  font-weight: 400;
  color: var(--ink, #070e1c);
  font-style: normal;
  letter-spacing: -0.005em;
}
.voa-chart-subhead em {
  font-style: italic;
  color: var(--gold-on-paper);
  font-family: var(--font-emphasis);
}
@media (max-width: 900px) {
  .voa-stat-strip { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 560px) {
  .voa-stat-strip { grid-template-columns: repeat(2, 1fr); }
  .voa-pill-num { font-size: 1.75rem; }
}

/* ══════════════════════════════════════════
   TRUST BLOCKS — Licensed advisers + Webinar
   Editorial luxury style, shared design DNA
   ══════════════════════════════════════════ */
.trust-block {
  position: relative;
  margin-top: 28px;
  padding: 24px 24px 22px;
  background: linear-gradient(180deg, rgba(201,163,90,0.05) 0%, rgba(201,163,90,0.015) 100%);
  border: 1px solid rgba(201,163,90,0.22);
  border-radius: 4px;
}
.trust-block::before {
  content: "";
  position: absolute;
  top: -1px;
  left: -1px;
  width: 44px;
  height: 2px;
  background: var(--gold);
  border-radius: 4px 0 0 0;
}

/* Refined eyebrow label */
.trust-label {
  display: inline-block;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold-on-paper);
  margin-bottom: 14px;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(201,163,90,0.18);
}

/* Editorial headline with italic emphasis */
.trust-headline {
  font-family: 'Fraunces', 'Instrument Serif', Georgia, serif;
  font-size: 1.4rem; /* font-weight removed — takes the display standard (300) */
  color: var(--ink, #070e1c);
  margin: 0 0 10px;
  line-height: 1.25;
  letter-spacing: -0.018em;
}
.trust-headline em {
  font-family: var(--font-emphasis);
  font-style: italic;
  color: var(--gold-on-paper);
}

.trust-body {
  font-family: 'Manrope', system-ui, sans-serif;
  font-size: 0.82rem;
  line-height: 1.65;
  color: rgba(7,14,28,0.70);
  margin: 0;
  max-width: 480px;
}
.trust-num {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--gold-on-paper);
  letter-spacing: 0.02em;
}

/* Webinar variant — has form, slightly more spacious */
.trust-webinar {
  margin-top: 14px;
}
.trust-licensed {
  margin-top: 28px;
}
.trust-webinar .trust-body {
  margin-bottom: 18px;
}

/* Refined form — input and button as separated elements */
.trust-form {
  display: flex;
  gap: 8px;
  margin: 0 0 10px;
  align-items: stretch;
  width: 100%;
}
.trust-form input {
  flex: 1;
  padding: 11px 14px;
  background: #ffffff;
  border: 1px solid rgba(7,14,28,0.14);
  border-radius: 3px;
  color: var(--ink, #070e1c);
  font-family: 'Manrope', system-ui, sans-serif;
  font-size: 0.82rem;
  outline: none;
  transition: border-color .35s ease, background .35s ease, box-shadow .35s ease;
}
.trust-form input::placeholder {
  color: rgba(7,14,28,0.38);
  font-family: 'Manrope', system-ui, sans-serif;
}
.trust-form input:focus {
  border-color: var(--gold);
  background: #ffffff;
  box-shadow: 0 0 0 3px rgba(201,163,90,0.10);
}

/* Custom luxury button — fully self-contained, no btn-primary conflict */
.trust-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 11px 18px;
  background: var(--ink, #070e1c);
  color: var(--gold);
  border: 1px solid var(--ink, #070e1c);
  border-radius: 3px;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.35s ease, color 0.35s ease, gap 0.35s cubic-bezier(.22,.61,.36,1), border-color 0.35s ease;
  position: relative;
  overflow: hidden;
}
.trust-btn span {
  position: relative;
  z-index: 2;
  display: inline-block;
}
.trust-btn-arrow {
  font-family: 'Manrope', system-ui, sans-serif;
  font-size: 0.82rem;
  font-weight: 500;
  letter-spacing: 0;
  transition: transform 0.35s cubic-bezier(.22,.61,.36,1);
}
.trust-btn:hover {
  background: var(--gold);
  color: var(--ink, #070e1c);
  border-color: var(--gold);
  gap: 12px;
}
.trust-btn:hover .trust-btn-arrow {
  transform: translateX(2px);
}
.trust-btn:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.trust-fineprint {
  font-family: 'Manrope', system-ui, sans-serif;
  font-size: 0.72rem;
  color: rgba(7,14,28,0.45);
  margin: 0;
  font-style: italic;
  letter-spacing: 0.01em;
}

/* Responsive form on mobile */
@media (max-width: 520px) {
  .trust-form { flex-direction: column; gap: 8px; }
  .trust-btn { justify-content: center; }
}

/* ── Webinar — bigger marketing headline ── */
.trust-headline-xl {
  font-size: clamp(1.7rem, 3.2vw, 2.3rem);
  line-height: 1.0;
  letter-spacing: -0.028em;
  margin: 4px 0 14px;
  font-weight: 400;
}
.trust-headline-xl em {
  font-size: 1em;
  letter-spacing: -0.035em;
}
.trust-label-kicker {
  font-size: 0.62rem;
  padding-bottom: 0;
  border-bottom: none;
  margin-bottom: 10px;
}
.trust-webinar .trust-body {
  font-size: 0.82rem;
  margin-bottom: 22px;
  max-width: 100%;
}

/* ══════════════════════════════════════════
   MEDIA SECTION — Press & podcast proof (coming soon)
   ══════════════════════════════════════════ */
.media-section { border-top: 1px solid var(--hairline); }
.media-placeholder {
  max-width: 100%;
  margin: 0 auto;
}
.media-card-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.media-card {
  background: var(--bone, #fbf7ef);
  border: 1px solid rgba(7,14,28,0.08);
  border-radius: 6px;
  padding: 24px 22px;
  text-align: center;
  position: relative;
  transition: border-color 0.4s ease, transform 0.4s cubic-bezier(.22,.61,.36,1);
}
.media-card:hover {
  border-color: rgba(201,163,90,0.4);
  transform: translateY(-3px);
}
.media-card-type {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 0.62rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold-on-paper);
  font-weight: 700;
  margin-bottom: 8px;
}
.media-card-title {
  font-family: 'Fraunces', 'Instrument Serif', Georgia, serif;
  font-size: 1.15rem;
  font-weight: 400;
  color: var(--ink, #070e1c);
  margin-bottom: 12px;
  letter-spacing: -0.01em;
  line-height: 1.3;
}
.media-card-status {
  display: inline-block;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 0.62rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(7,14,28,0.50);
  font-weight: 600;
  padding: 4px 10px;
  border: 1px dashed rgba(7,14,28,0.20);
  border-radius: 3px;
}
.media-note {
  text-align: center;
  font-family: 'Manrope', system-ui, sans-serif;
  font-size: 0.82rem;
  color: rgba(7,14,28,0.55);
  margin: 32px auto 0;
  max-width: 620px;
  font-style: italic;
  line-height: 1.6;
}
@media (max-width: 720px) {
  .media-card-row { grid-template-columns: 1fr; gap: 12px; }
}

/* ══════════════════════════════════════════
   EDUCATION — [20 Jul] rebuilt: watch/listen left, ink capture right
   Tokens only. Ink panel pops against the cream section; YouTube tile is
   larger than the podcast row so "live" reads as the primary thing.
   ══════════════════════════════════════════ */
.edu-grid {
  display: grid;
  grid-template-columns: 1.25fr 0.85fr;
  gap: 18px;
  max-width: 100%;
  margin: 0 auto;
  align-items: stretch;
}
.edu-left { display: flex; flex-direction: column; gap: 14px; }

/* Watch — the big live tile */
.edu-watch {
  display: block;
  border: 1px solid rgba(7,14,28,0.08);
  border-radius: 8px;
  overflow: hidden;
  background: var(--bone, #fbf7ef);
  text-decoration: none;
  transition: border-color 0.4s ease, transform 0.4s cubic-bezier(.22,.61,.36,1);
}
.edu-watch:hover { border-color: rgba(201,163,90,0.45); transform: translateY(-3px); }
.edu-watch-screen {
  /* [20 Jul] Brand-kit YouTube-thumbnail treatment: ink ground, corner mark
     top-right (logo + INFINITE ZEPHYR), editorial channel name, one play button.
     Follows the Video & Social Kit — ink ground, one gold accent, corner mark. */
  position: relative;
  height: 172px;
  /* [21 Jul] real YouTube thumbnail (matches the home founder card) instead of
     the ink black-out. ★ DEV: swap this URL when Dean posts a new episode, or
     wire the YouTube Data API to auto-pull the latest. */
  background-image:
    linear-gradient(180deg, rgba(7,14,28,0.12), rgba(7,14,28,0.45)),
    url("https://i.ytimg.com/vi/rH8izG02GBc/maxresdefault.jpg");
  background-size: cover; background-position: center;
  display: flex; align-items: center; justify-content: center;
}
.edu-thumb-corner {
  position: absolute; top: 14px; right: 16px;
  display: flex; align-items: center; gap: 8px;
}
.edu-thumb-corner img,
.edu-thumb-corner svg { height: 18px; width: auto; opacity: 0.92; }
.edu-thumb-corner span {
  font-family: var(--font-mono); font-size: 0.52rem; letter-spacing: 0.22em;
  text-transform: uppercase; color: rgba(244,241,234,0.72);
}
.edu-thumb-title {
  position: absolute; left: 20px; bottom: 16px;
  font-family: var(--font-display); font-weight: 300;
  font-variation-settings: "opsz" 144, "SOFT" 30;
  font-size: 1.5rem; letter-spacing: -0.01em; color: var(--bone);
}
.edu-live-badge {
  position: absolute; top: 12px; left: 12px;
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--font-mono); font-size: 0.56rem; font-weight: 600;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: #fff; background: #c0392b;
  padding: 3px 9px 3px 8px; border-radius: 999px;
}
/* [20 Jul] YouTube-style live cue — solid dot + radiating ring (::after) that
   scales out and fades. Only transform/opacity animate, so it's GPU-cheap. */
.edu-live-dot {
  position: relative; flex: none;
  width: 6px; height: 6px; border-radius: 50%;
  background: #fff;
}
.edu-live-dot::after {
  content: ""; position: absolute; inset: 0;
  border-radius: 50%; background: #fff;
  animation: eduLivePulse 1.8s ease-out infinite;
}
@keyframes eduLivePulse {
  0%   { transform: scale(1);   opacity: 0.7; }
  70%  { transform: scale(3.2); opacity: 0; }
  100% { transform: scale(3.2); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .edu-live-dot::after { animation: none; }
}
/* ═══ [21 Jul] Home "Founder Insight" video card (A+) ═══ */
.home-insight { padding: 0 0 96px; background: var(--cream, #f4ede0); }
.hi-head { margin-bottom: 18px; }
.hi-cta-row { display: flex; align-items: center; gap: 20px; margin-top: 8px; flex-wrap: wrap; }
.hi-channel {
  font-family: var(--font-accent); font-style: italic; font-size: 1.05rem;
  color: var(--gold-on-paper) !important; text-decoration: none;
  border-bottom: 1px solid rgba(135,104,44,0.4); transition: border-color .3s ease;
}
.hi-channel:hover { border-color: var(--gold-on-paper); }
.hi-channel-sep { color: rgba(135,104,44,0.5); font-family: var(--font-accent); font-style: italic; }
.hi-card {
  display: flex; text-decoration: none; color: inherit;
  background: var(--surface, #fff); background: #fffdf9;
  border: 1px solid rgba(7,14,28,0.12); border-radius: 16px; overflow: hidden;
  transition: border-color .45s ease, transform .45s cubic-bezier(.22,.61,.36,1), box-shadow .45s ease;
}
.hi-card:hover { border-color: rgba(201,163,90,0.5); transform: translateY(-3px); box-shadow: 0 18px 40px -24px rgba(7,14,28,0.35); }
.hi-thumb {
  position: relative; flex: 3 1 0; min-width: 0; min-height: 210px;
  background-image:
    linear-gradient(180deg, rgba(7,14,28,0.15), rgba(7,14,28,0.55)),
    url("https://i.ytimg.com/vi/rH8izG02GBc/maxresdefault.jpg");
  background-size: cover; background-position: center;
  display: flex; align-items: center; justify-content: center;
}
.hi-badge {
  position: absolute; top: 15px; left: 16px; display: inline-flex; align-items: center; gap: 7px;
  background: #c0392b; color: #fff; font-family: var(--font-mono);
  font-size: 0.6rem; letter-spacing: 0.1em; text-transform: uppercase;
  padding: 4px 11px 4px 10px; border-radius: 999px;
}
.hi-live-dot { position: relative; flex: none; width: 6px; height: 6px; border-radius: 50%; background: #fff; }
.hi-live-dot::after {
  content: ""; position: absolute; inset: 0; border-radius: 50%; background: #fff;
  animation: eduLivePulse 1.8s ease-out infinite;
}
.hi-corner {
  position: absolute; top: 15px; right: 16px;
  display: flex; align-items: center; gap: 8px;
}
.hi-corner img,
.hi-corner svg { height: 17px; width: auto; opacity: 0.92; }
.hi-corner span {
  font-family: var(--font-mono); font-size: 0.52rem; letter-spacing: 0.2em;
  text-transform: uppercase; color: rgba(244,241,234,0.72);
}
.hi-play {
  width: 60px; height: 60px; border-radius: 50%; background: var(--gold, #c9a35a);
  display: flex; align-items: center; justify-content: center; color: var(--ink, #070e1c);
  transition: transform .4s ease;
}
.hi-play svg { width: 26px; height: 26px; margin-left: 2px; }
.hi-card:hover .hi-play { transform: scale(1.07); }
.hi-body { flex: 2 1 0; min-width: 0; padding: 28px 30px; display: flex; flex-direction: column; justify-content: center; gap: 9px; }
.hi-eyebrow { font-family: var(--font-mono); font-size: 0.62rem; letter-spacing: 0.16em; color: var(--gold-on-paper); }
.hi-title { font-family: var(--font-display); font-weight: 300; font-variation-settings: "opsz" 40, "SOFT" 30; font-size: 1.55rem; line-height: 1.18; color: var(--ink, #070e1c); }
.hi-desc { font-family: var(--font-sans); font-size: 0.86rem; line-height: 1.55; color: rgba(7,14,28,0.62); }
.hi-cta {
  display: inline-flex; align-items: center; gap: 8px; align-self: flex-start;
  font-family: var(--font-mono); font-size: 0.64rem; font-weight: 600; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--gold-on-paper);
  border: 1px solid var(--gold-on-paper); border-radius: 999px; padding: 9px 18px;
  transition: background .3s ease, color .3s ease, border-color .3s ease;
}
.hi-card:hover .hi-cta { background: var(--gold, #c9a35a); border-color: var(--gold, #c9a35a); color: var(--ink, #070e1c); }
.hi-cta-arrow { display: inline-block; animation: hiArrowPulse 1.8s ease-out infinite; }
@keyframes hiArrowPulse {
  0%   { transform: translateX(0);    opacity: 0.55; }
  70%  { transform: translateX(5px);  opacity: 1; }
  100% { transform: translateX(5px);  opacity: 0.55; }
}
@media (prefers-reduced-motion: reduce) { .hi-cta-arrow { animation: none; } }
@media (max-width: 760px) {
  .hi-card { flex-direction: column; }
  .hi-thumb { min-height: 190px; }
}
.edu-play {
  width: 54px; height: 54px; border-radius: 50%;
  background: var(--gold); color: var(--ink);
  display: flex; align-items: center; justify-content: center;
}
.edu-play svg { width: 22px; height: 22px; margin-left: 3px; }
.edu-watch:hover .edu-play { transform: scale(1.06); transition: transform 0.4s ease; }
.edu-watch-foot {
  padding: 16px 18px;
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
}
.edu-watch-title {
  font-family: var(--font-display); font-weight: 400;
  font-variation-settings: "opsz" 144;
  font-size: 1.15rem; color: var(--ink); letter-spacing: -0.01em;
  margin: 2px 0 4px;
}
.edu-watch-desc { font-family: var(--font-sans); font-size: 0.8rem; color: rgba(7,14,28,0.6); line-height: 1.5; }
.edu-watch-cta {
  /* [20 Jul] bordered pill; [21 Jul] matched to the home "WATCH NOW" button
     (same size, gap, pulsing arrow). */
  display: inline-flex; align-items: center; gap: 8px; flex: none;
  font-family: var(--font-mono); font-size: 0.64rem; font-weight: 600;
  letter-spacing: 0.1em; text-transform: uppercase; color: var(--gold-on-paper);
  border: 1px solid var(--gold-on-paper);
  border-radius: 999px;
  padding: 7px 15px;
  background: transparent;
  transition: background .3s ease, color .3s ease, border-color .3s ease;
}
.edu-watch:hover .edu-watch-cta {
  background: var(--gold); border-color: var(--gold); color: var(--ink);
}
.edu-watch-cta .iz-cta-arrow { width: 16px; height: 11px; stroke: currentColor; transition: transform .3s ease; }
.edu-watch:hover .edu-watch-cta .iz-cta-arrow { transform: translateX(3px); }

/* Listen — the smaller podcast row */
.edu-listen {
  display: flex; align-items: center; gap: 14px;
  border: 1px solid rgba(7,14,28,0.08);
  border-radius: 8px;
  padding: 16px 18px;
  background: var(--bone, #fbf7ef);
}
.edu-listen-ico {
  width: 40px; height: 40px; flex: none;
  border-radius: 8px; background: var(--cream, #f4ede0);
  display: flex; align-items: center; justify-content: center;
  color: var(--gold-on-paper);
}
.edu-listen-ico svg { width: 20px; height: 20px; }
.edu-listen-body { flex: 1; }
.edu-listen-title {
  font-family: var(--font-display); font-weight: 400;
  font-variation-settings: "opsz" 144;
  font-size: 1rem; color: var(--ink); letter-spacing: -0.01em; margin: 2px 0 3px;
}
.edu-listen-desc { font-family: var(--font-sans); font-size: 0.76rem; color: rgba(7,14,28,0.55); line-height: 1.45; }
.edu-listen-status {
  flex: none;
  font-family: var(--font-mono); font-size: 0.56rem; font-weight: 600;
  letter-spacing: 0.12em; text-transform: uppercase; color: rgba(7,14,28,0.5);
  padding: 4px 10px; border: 1px dashed rgba(7,14,28,0.2); border-radius: 3px;
}

/* Capture — the ink panel */
.edu-capture {
  /* [20 Jul] was ink — user changed mind: only the thumbnail stays dark, the
     capture panel is now bone. Same cream as the section + a hairline so it
     reads as a card, not a second colour block. Text flips to dark-on-bone. */
  background: var(--bone, #f4f1ea);
  border: 1px solid rgba(7,14,28,0.08);
  border-radius: 8px;
  padding: 30px 26px;
  display: flex; flex-direction: column; justify-content: center;
}
.edu-capture .edu-hook.edu-hook {
  font-family: var(--font-display); font-weight: 300;
  font-variation-settings: "opsz" 144, "SOFT" 30;
  font-size: 1.5rem; line-height: 1.2; color: var(--ink) !important;
  letter-spacing: -0.01em; margin-bottom: 10px;
}
.edu-capture .edu-hook em { font-family: var(--font-emphasis); font-style: italic; color: var(--gold-on-paper) !important; }
.edu-capture .edu-capture-sub {
  font-family: var(--font-sans); font-size: 0.82rem; line-height: 1.5;
  color: #2a2f3d !important; margin-bottom: 18px;
}
.edu-form { display: flex; gap: 8px; margin-bottom: 18px; }
/* the input/btn reuse .media-webinar-input/.media-webinar-btn; on ink the
   input border and placeholder need to read against dark */
.edu-capture .media-webinar-input { color: var(--ink); border-color: rgba(7,14,28,0.22); }
.edu-capture .media-webinar-input::placeholder { color: rgba(7,14,28,0.42); }
.edu-trust { border-top: 1px solid rgba(7,14,28,0.1); padding-top: 16px; }
.edu-capture .edu-trust-lead {
  font-family: var(--font-accent); font-style: italic;
  font-size: 1.02rem; line-height: 1.3; color: var(--ink) !important;
  margin-bottom: 7px;
}
.edu-capture .edu-trust-lead em { font-style: italic; color: var(--gold-on-paper) !important; font-family: var(--font-accent); }
.edu-capture .edu-trust-body {
  font-family: var(--font-sans); font-size: 0.76rem; line-height: 1.55;
  color: #3a3f4c !important;
}
.edu-capture .edu-trust-body strong { color: var(--ink); font-weight: 600; }
.edu-capture .edu-trust-body .trust-num { font-family: var(--font-mono); color: var(--gold-on-paper); letter-spacing: 0.04em; }
/* eyebrow on the ink panel — dot + label must read on dark */
.edu-capture-eyebrow { margin-bottom: 14px; color: var(--gold-on-paper) !important; }
.edu-capture-eyebrow .eyebrow-dot { background: var(--gold-on-paper); }

@media (max-width: 720px) {
  .edu-grid { grid-template-columns: 1fr; gap: 14px; }
  .edu-watch-screen { height: 130px; }
}
@media (prefers-reduced-motion: reduce) {
  .edu-watch:hover { transform: none; }
  .edu-watch:hover .edu-play { transform: none; }
}

/* ══════════════════════════════════════════
   CLIENT STORIES STRIP — anonymised real wins
   ══════════════════════════════════════════ */
.story-strip {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  max-width: 1080px;
  margin: 0 auto;
}
.story-card {
  background: var(--bone, #fbf7ef);
  border: 1px solid rgba(7,14,28,0.08);
  border-radius: 6px;
  padding: 24px 22px;
  text-align: left;
  position: relative;
  transition: border-color 0.4s ease, transform 0.4s cubic-bezier(.22,.61,.36,1), box-shadow 0.4s ease;
  overflow: hidden;
}
.story-card::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 32px;
  height: 2px;
  background: var(--gold);
}
.story-card:hover {
  border-color: rgba(201,163,90,0.42);
  transform: translateY(-3px);
  box-shadow: 0 10px 24px -10px rgba(7,14,28,0.12);
}
.story-card-tag {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 0.62rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold-on-paper);
  font-weight: 700;
  margin-bottom: 14px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(201,163,90,0.18);
}
.story-card-result {
  font-family: 'Fraunces', 'Instrument Serif', Georgia, serif;
  font-size: 2.2rem;
  font-weight: 400;
  color: var(--ink, #070e1c);
  margin: 0 0 4px;
  line-height: 1;
  letter-spacing: -0.025em;
}
.story-card-result strong {
  font-weight: 400;
  background: linear-gradient(180deg, transparent 60%, rgba(201,163,90,0.16) 60%);
}
.story-card-label {
  font-family: 'Manrope', system-ui, sans-serif;
  font-size: 0.82rem;
  font-weight: 600;
  color: rgba(7,14,28,0.78);
  margin: 0 0 14px;
  letter-spacing: -0.005em;
}
.story-card-strat {
  font-family: 'Manrope', system-ui, sans-serif;
  font-size: 0.82rem;
  line-height: 1.55;
  color: rgba(7,14,28,0.58);
  margin: 0;
  
}
.story-disclaimer {
  text-align: center;
  font-family: 'Manrope', system-ui, sans-serif;
  font-size: 0.72rem;
  line-height: 1.55;
  color: rgba(7,14,28,0.50);
  max-width: 720px;
  margin: 40px auto 0;
  padding-top: 24px;
  border-top: 1px solid rgba(7,14,28,0.08);
}
@media (max-width: 900px) {
  .story-strip { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .story-strip { grid-template-columns: 1fr; gap: 12px; }
  .story-card-result { font-size: 1.75rem; }
}

/* Story tiers — subtle background tint to signal range */
.story-tier-1 { background: linear-gradient(180deg, rgba(201,163,90,0.04) 0%, var(--bone) 100%); }
.story-tier-2 { background: linear-gradient(180deg, rgba(201,163,90,0.08) 0%, var(--bone) 100%); }
.story-tier-3 { background: linear-gradient(180deg, rgba(201,163,90,0.12) 0%, var(--bone) 100%); }
.story-tier-4 { background: linear-gradient(180deg, rgba(201,163,90,0.16) 0%, var(--bone) 100%); }
.story-tier-5 { background: linear-gradient(180deg, rgba(201,163,90,0.20) 0%, var(--bone) 100%); }
.story-tier-5 .story-card-result strong { background: linear-gradient(180deg, transparent 55%, rgba(201,163,90,0.30) 55%); }

/* Live YouTube card variant — visually elevated */
.media-card-live {
  background: rgba(201,163,90,0.07) !important;
  border-color: var(--gold) !important;
  text-decoration: none;
  display: block;
  position: relative;
}
.media-card-live::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: var(--gold);
  border-radius: 6px 6px 0 0;
}
.media-card-live .media-card-type {
  color: var(--gold) !important;
}
.media-card-live .media-card-title {
  color: var(--ink,#070e1c) !important;
  font-size: 1.15rem !important;
}
.media-card-live .media-card-desc {
  color: rgba(7,14,28,0.62);
  font-size: 0.82rem;
  line-height: 1.55;
  margin: 8px 0 18px;
  font-family: 'Manrope', system-ui, sans-serif;
}
.media-card .media-card-desc {
  color: rgba(7,14,28,0.62);
  font-size: 0.82rem;
  line-height: 1.55;
  margin: 8px 0 14px;
  font-family: 'Manrope', system-ui, sans-serif;
}
.media-card-live .media-card-cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  background: var(--gold);
  color: var(--ink, #070e1c);
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  border-radius: 3px;
  transition: gap 0.35s cubic-bezier(.22,.61,.36,1);
}
.media-card-live:hover {
  transform: translateY(-4px);
}
.media-card-live:hover .media-card-cta {
  gap: 12px;
}
.media-card-arrow {
  font-family: 'Manrope', system-ui, sans-serif;
  letter-spacing: 0;
}

/* ══════════════════════════════════════════
   FOOTER — minimal · modern · top-tier
   Overrides legacy footer-compliance styles
   ══════════════════════════════════════════ */
.footer-minimal {
  background: var(--ink, #070e1c);
  padding: 80px 0 32px;
  position: relative;
  border-top: none !important;
}
.footer-minimal::before {
  display: none !important;
}
.footer-minimal .footer-grid {
  display: grid;
  grid-template-columns: 1.6fr repeat(4, 1fr);
  gap: 64px;
  padding-bottom: 56px;
  border-bottom: 1px solid rgba(244,237,224,0.08);
}
.footer-minimal .footer-brand-col {
  max-width: 320px;
}
.footer-minimal .footer-brand-row {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 18px;
}
.footer-minimal .footer-brand-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background: var(--ink);
  border: 1px solid rgba(201,163,90,0.55);
  border-radius: 50%;
  overflow: hidden;
}
.footer-minimal .footer-brand-mark img {
  width: 76%;
  height: 76%;
  object-fit: contain;
  display: block;
}
.footer-minimal .footer-brand-name {
  font-family: var(--font-mono);
  font-size: 0.82rem;
  font-weight: 700;
  font-style: normal;
  text-transform: uppercase;
  color: var(--bone, #f4f1ea);
  letter-spacing: 0.30em;
}
.footer-minimal .footer-brand-tagline {
  font-family: 'Manrope', system-ui, sans-serif;
  font-size: 0.82rem;
  line-height: 1.6;
  color: rgba(244,237,224,0.55);
  margin: 0 0 22px;
}
.footer-minimal .footer-social {
  display: flex;
  gap: 8px;
}
.footer-minimal .footer-social-ic {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border: 1px solid rgba(244,237,224,0.12);
  border-radius: 50%;
  color: rgba(244,237,224,0.55);
  transition: border-color 0.3s ease, color 0.3s ease, transform 0.3s cubic-bezier(.22,.61,.36,1);
  background: transparent;
}
.footer-minimal .footer-social-ic svg {
  width: 13px;
  height: 13px;
  fill: currentColor;
}
.footer-minimal .footer-social-ic:hover {
  border-color: var(--gold);
  color: var(--gold);
  transform: translateY(-2px);
}
.footer-minimal .footer-col-title {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 18px;
  opacity: 0.85;
}
.footer-minimal .footer-links {
  display: flex;
  flex-direction: column;
  gap: 11px;
}
.footer-minimal .footer-links a {
  font-family: 'Manrope', system-ui, sans-serif;
  font-size: 0.82rem;
  color: rgba(244,237,224,0.62);
  text-decoration: none;
  transition: color 0.3s ease, padding-left 0.3s cubic-bezier(.22,.61,.36,1);
}
.footer-minimal .footer-links a:hover {
  color: var(--bone, #f4ede0);
  padding-left: 4px;
}

/* Compliance — quiet, inline */
.footer-minimal .footer-fineline {
  padding: 32px 0 28px;
  border-bottom: 1px solid rgba(244,237,224,0.06);
}
.footer-minimal .footer-disclosure {
  font-family: 'Manrope', system-ui, sans-serif;
  font-size: 0.72rem;
  line-height: 1.7;
  color: rgba(244,237,224,0.42);
  margin: 0 0 14px;
  max-width: 100%;
}
.footer-minimal .footer-disclosure a {
  color: rgba(244,237,224,0.65);
  text-decoration: none;
  border-bottom: 1px dotted rgba(244,237,224,0.25);
  transition: color 0.3s ease, border-color 0.3s ease;
}
.footer-minimal .footer-disclosure a:hover {
  color: var(--gold);
  border-color: var(--gold);
}
.footer-minimal .footer-disclosure strong {
  color: rgba(244,237,224,0.62);
  font-weight: 600;
}
.footer-minimal .footer-warning {
  font-family: 'Manrope', system-ui, sans-serif;
  font-size: 0.72rem;
  line-height: 1.65;
  color: rgba(244,237,224,0.32);
  margin: 0;
  max-width: 100%;
}
.footer-minimal .footer-warning strong {
  color: rgba(244,237,224,0.46);
  font-weight: 600;
  font-style: normal;
}
.footer-minimal .footer-warning a {
  color: rgba(244,237,224,0.55);
  text-decoration: none;
  border-bottom: 1px dotted rgba(244,237,224,0.20);
}

/* Bottom strip */
.footer-minimal .footer-bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: 24px;
  gap: 20px;
  flex-wrap: wrap;
}
.footer-minimal .footer-copyright {
  font-family: 'Manrope', system-ui, sans-serif;
  font-size: 0.72rem;
  color: var(--gold);
  letter-spacing: 0.01em;
}
.footer-minimal .footer-legal-inline {
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
}
.footer-minimal .footer-legal-inline a {
  font-family: 'Manrope', system-ui, sans-serif;
  font-size: 0.72rem;
  color: rgba(244,237,224,0.50);
  text-decoration: none;
  transition: color 0.3s ease;
}
.footer-minimal .footer-legal-inline a:hover { color: var(--gold); }

/* Responsive */
@media (max-width: 980px) {
  .footer-minimal .footer-grid {
    grid-template-columns: 1fr 1fr;
    gap: 40px 32px;
  }
  .footer-minimal .footer-brand-col {
    grid-column: 1 / -1;
    max-width: none;
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(244,237,224,0.06);
  }
}

/* Keep the floating strategy-call label visually centred and on one line. */
.sticky-cta-group .sticky-cta {
  justify-content: center;
}

.sticky-cta-group .sticky-cta-text {
  display: block;
  max-width: none;
  white-space: nowrap;
  text-align: center;
  line-height: 1.15;
}

@media (max-width: 600px) {
  .sticky-cta-group .sticky-cta {
    max-width: calc(100vw - 24px);
    padding-left: 17px;
    padding-right: 17px;
    gap: 9px;
  }

  .sticky-cta-group .sticky-cta-text {
    letter-spacing: 0.11em;
  }
}
@media (max-width: 580px) {
  .footer-minimal { padding: 60px 0 28px; }
  .footer-minimal .footer-grid { grid-template-columns: 1fr; gap: 32px; }
  .footer-minimal .footer-bottom { flex-direction: column; align-items: flex-start; gap: 14px; }
}

/* Warning block with triangle icon */
.footer-minimal .footer-compliance-warning {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  background: rgba(7,14,28,0.5);
  border: 1px solid rgba(244,237,224,0.08);
  border-radius: 6px;
  padding: 16px 20px 16px 18px;
  position: relative;
}
.footer-minimal .fc-warn-icon {
  flex-shrink: 0;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: rgba(201,163,90,0.10);
  border: 1px solid rgba(201,163,90,0.32);
  color: var(--gold);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 1px;
}
.footer-minimal .fc-warn-icon svg {
  width: 16px;
  height: 16px;
}
.footer-minimal .footer-compliance-warning p {
  font-family: 'Manrope', system-ui, sans-serif;
  font-size: 0.72rem;
  line-height: 1.7;
  color: rgba(244,237,224,0.45);
  margin: 0;
}
.footer-minimal .footer-compliance-warning p strong {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 0.62rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  font-weight: 700;
  margin-right: 6px;
}
.footer-minimal .footer-compliance-warning p a {
  color: rgba(244,237,224,0.68);
  text-decoration: none;
  border-bottom: 1px dotted rgba(244,237,224,0.30);
  transition: color 0.3s ease, border-color 0.3s ease;
}
.footer-minimal .footer-compliance-warning p a:hover {
  color: var(--gold);
  border-color: var(--gold);
}

/* Responsive */
@media (max-width: 900px) {
  .footer-minimal .footer-compliance-row { grid-template-columns: 1fr; gap: 10px; }
  .footer-minimal .footer-compliance-warning { flex-direction: row; }
}
@media (max-width: 580px) {
  .footer-minimal .footer-compliance-warning {
    flex-direction: column;
  }
  .footer-minimal .fc-warn-icon { margin-bottom: 4px; }
}

/* ══════════════════════════════════════════
   FOOTER — gold ornament divider + readable compliance
   ══════════════════════════════════════════ */
.footer-minimal .footer-ornament {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
}
.footer-minimal .footer-ornament-top {
  margin: 0 0 56px;
  padding-top: 0;
  border-top: none;
}
.footer-minimal .footer-ornament-line {
  flex: 1;
  max-width: 560px;
  height: 1px;
  background: linear-gradient(90deg, transparent 0%, rgba(201,163,90,0.42) 100%);
}
.footer-minimal .footer-ornament-line + .footer-ornament-mark + .footer-ornament-line {
  background: linear-gradient(90deg, rgba(201,163,90,0.42) 0%, transparent 100%);
}
.footer-minimal .footer-ornament-mark {
  width: 36px;
  height: 4px;
  background: radial-gradient(ellipse at center, rgba(201,163,90,0.95) 0%, rgba(201,163,90,0.55) 45%, transparent 75%);
  border-radius: 50%;
  position: relative;
}
.footer-minimal .footer-ornament-mark::after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at center, rgba(255,235,180,0.35) 0%, transparent 60%);
  border-radius: 50%;
  filter: blur(1px);
}

/* ── Compliance — bigger, more readable ── */
.footer-minimal .footer-fineline {
  padding: 8px 0 28px;
  border-top: none;
  margin-top: 0;
}
.footer-minimal .footer-disclosure {
  font-family: 'Manrope', system-ui, sans-serif;
  font-size: 0.82rem;
  line-height: 1.75;
  color: rgba(244,237,224,0.58);
  margin: 0 0 18px;
  max-width: 100%;
  letter-spacing: 0.005em;
}
.footer-minimal .footer-disclosure .fd-brand {
  /* [21 Jul] match the wordmark lockup — mono, uppercase, tracked — but kept as
     live selectable text (not an image) so it still counts for SEO/GEO/AEO. */
  font-family: var(--font-mono);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: var(--gold);
}
.footer-minimal .footer-disclosure .fd-strong {
  color: rgba(244,237,224,0.85);
  font-weight: 600;
}
.footer-minimal .footer-disclosure a {
  color: rgba(244,237,224,0.92);
  text-decoration: underline;
  text-decoration-color: rgba(244,237,224,0.4);
  text-underline-offset: 2px;
  border-bottom: none;
  transition: text-decoration-color 0.3s ease;
  font-weight: 700;
}
/* [21 Jul] AR + AFSL (the licensing identifiers) stay GOLD; the other footer
   links (AFCA, etc.) keep the bold-bone treatment above. */
.footer-minimal .footer-disclosure a.fd-reg {
  color: var(--gold);
  text-decoration-color: rgba(201,163,90,0.5);
}
.footer-minimal .footer-disclosure a:hover {
  color: var(--bone, #f4ede0);
  border-color: var(--bone, #f4ede0);
}
.footer-minimal .footer-warning {
  font-family: 'Manrope', system-ui, sans-serif;
  font-size: 0.82rem;
  line-height: 1.75;
  color: rgba(244,237,224,0.58);
  margin: 0;
  max-width: 100%;
  letter-spacing: 0.005em;
}
.footer-minimal .footer-warning .fd-warn-label {
  font-family: 'Manrope', system-ui, sans-serif;
  color: var(--gold);
  font-weight: 600;
  font-style: normal;
}
.footer-minimal .footer-warning em {
  font-style: normal;
  color: rgba(244,237,224,0.58);
}
.footer-minimal .footer-warning a {
  /* [21 Jul] FSG etc. as bold bone (underlined) rather than gold — reads as a
     link without competing with the gold accents elsewhere in the footer. */
  color: rgba(244,237,224,0.92);
  text-decoration: underline;
  text-decoration-color: rgba(244,237,224,0.4);
  text-underline-offset: 2px;
  border-bottom: none;
  transition: text-decoration-color 0.3s ease;
  font-weight: 700;
}
.footer-minimal .footer-warning a:hover {
  color: var(--bone, #f4ede0);
  border-color: var(--bone, #f4ede0);
}

/* ══════════════════════════════════════════
   DEMO: IZ logo watermark
   (Replace inline SVG with your real logo PNG/SVG later)
   ══════════════════════════════════════════ */
.hero { position: relative; overflow: hidden; }
.hero-bg-logo {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 80%;
  max-width: 1150px;
  pointer-events: none;
  z-index: 0;
  opacity: 0.16;
}
.hero-bg-logo img,
.hero-bg-logo svg {
  width: 100%;
  height: auto;
  display: block;
  transform-origin: 50% 50%;
  will-change: transform, opacity, filter;
  animation: izHeroMark 2.4s cubic-bezier(.2,.72,.24,1) 0.3s both;
}

/* ── Hero watermark reveal ───────────────────────────────────────────────
   The same move as the sign-off at the end of Contact (.izlr-mark img):
   scale up from 0.55, un-rotate from -22deg, fade in — on the same easing
   curve, cubic-bezier(.2,.72,.24,1).

   Two deliberate differences:

   1. SLOWER — 2.4s against the sign-off's 1.25s. That's 1150px of artwork
      rather than 90px; the same duration on something this size reads as a
      lurch rather than a breath. Same curve, longer arc.

   2. AN ANIMATION, NOT A TRANSITION. The sign-off can use a transition because
      an IntersectionObserver adds .in when you scroll down to it. This one is
      on screen at load, so a transition would have to be armed first — and
      arming with a transition attached is exactly the bug that kept the mission
      signature invisible: it animates 1 -> 0 before it can animate 0 -> 1.
      A keyframe animation with `both` has no arming step and can't hit that.

   The blur resolves to 1.5px, not 0. This is a watermark sitting behind live
   headline text at 16% opacity — leaving a hair of softness keeps it behind the
   words instead of competing with them. It starts at 26px so the mark arrives
   like something coming into focus.
   ── */
@keyframes izHeroMark {
  0% {
    opacity: 0;
    transform: scale(0.55) rotate(-22deg);
    filter: blur(26px);
  }
  100% {
    opacity: 1;
    transform: scale(1) rotate(0deg);
    filter: blur(1.5px);
  }
}
@media (prefers-reduced-motion: reduce) {
  .hero-bg-logo img,
  .hero-bg-logo svg { animation: none; filter: blur(1.5px); }
}
.hero .container { position: relative; z-index: 2; }
.hero .hero-grid { position: relative; z-index: 2; }
.hero .hero-geo { z-index: 1; }
@media (max-width: 820px) {
  .hero-bg-logo { display: none; }
}

/* ─── For production: when you have the real logo file ───
   1. Save your logo as: logo-mark.png (transparent bg) or logo-mark.svg
   2. Replace the <svg> inside .hero-bg-logo with: <img src="logo-mark.png" alt="">
   3. Or update CSS to use background-image instead
   The .hero-bg-logo positioning + opacity settings will work for any image.
*/

/* ── Trust + Webinar blocks in Media section (2-col) ── */
.media-trust-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  max-width: 100%;
  margin: 44px auto 0;
}
.media-trust-row .trust-block {
  margin-top: 0;
}
@media (max-width: 820px) {
  .media-trust-row { grid-template-columns: 1fr; gap: 16px; }
}

.ju-wrap{margin:30px 0 6px;position:relative;}
.ju-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;position:relative;}
.ju-rail{position:absolute;left:8.3%;right:3%;top:27px;height:2px;border-radius:2px;transform:scaleX(0);transform-origin:left center;transition:transform 2.4s cubic-bezier(.4,0,.2,1);
 background:linear-gradient(90deg,#5B7CB0 0%,#7E86A0 42%,#C9A24B 72%,var(--gold,#c9a35a) 100%);z-index:0;}
.ju-rail::after{content:"";position:absolute;right:-4px;top:-5px;width:0;height:0;
 border-left:12px solid var(--gold,#c9a35a);border-top:6px solid transparent;border-bottom:6px solid transparent;}
.ju-rail.drawn{transform:scaleX(1);} .ju-col{position:relative;z-index:1;display:flex;flex-direction:column;align-items:stretch;}
.ju-col.s1{--acc:#6C8AB8}.ju-col.s2{--acc:#7689A5}.ju-col.s3{--acc:#8A8A8C}
.ju-col.s4{--acc:#B49A5F}.ju-col.s5{--acc:#CDA94E}.ju-col.s6{--acc:var(--gold,#c9a35a)}
.ju-node{display:flex;flex-direction:column;align-items:center;text-align:center;margin-bottom:14px;}
.ju-badge{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;
 border:1.5px solid var(--acc);color:var(--acc);background:var(--ink,#070e1c);box-shadow:0 0 0 5px var(--ink,#070e1c);}
.ju-badge svg{width:24px;height:24px;}
.ju-decade{margin-top:9px;font-size:0.72rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--acc);}
.ju-card{flex:1;display:flex;flex-direction:column;background:rgba(255,255,255,0.025);
 border:1px solid rgba(255,255,255,0.08);border-radius:14px;padding:16px 15px;}
.ju-card-top{display:flex;align-items:baseline;justify-content:space-between;gap:8px;}
.ju-num{font-family:var(--font-display,'Fraunces','Instrument Serif',Georgia,serif);font-size: 1.4rem;line-height:1;color:var(--acc);}
.ju-age{font-size: 0.72rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(244,237,224,.55);font-weight:600;}
.ju-name{margin:8px 0 6px;font-size: 1.15rem;line-height:1.15;color:rgba(244,237,224,.96);min-height:2.3em;}
.ju-name-sub{font-size:.92em;}
.ju-focus{font-family:var(--font-mono);font-size: 0.72rem;line-height:1.4;color:rgba(244,237,224,.6);margin:0 0 12px;min-height:2.7em;}
.ju-diff{background:rgba(201,163,90,0.08);border-left:2px solid var(--acc);border-radius:9px;padding:12px 13px 13px;}
.ju-diff-lbl{display:block;font-family:var(--font-mono);font-size: 0.72rem;letter-spacing:.13em;text-transform:uppercase;color:var(--acc);font-weight:700;margin-bottom:6px;}
.ju-diff p{margin:0;font-family:var(--font-sans);font-size: 0.95rem;line-height:1.4;color:rgba(244,237,224,.98);min-height:4.2em;}
.ju-meta{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin-top:11px;font-size:0.72rem;color:rgba(244,237,224,.7);}
.ju-card>.ju-diff{margin-top:0;}
.ju-meta em{font-style:normal;color:rgba(244,237,224,.4);margin-right:3px;}
.ju-dot{width:3px;height:3px;border-radius:50%;background:rgba(244,237,224,.3);margin:0 4px;}
.ju-thisisme{margin-top:13px;font-size: 0.82rem;font-weight:700;color:var(--acc);text-decoration:none;}
.ju-thisisme:hover{opacity:.8;}
.ju-note{text-align:center;max-width:620px;margin:40px auto 0;}.ju-quote-mark{display:block;font-family:var(--font-display,'Fraunces',Georgia,serif);font-size:3.4rem;line-height:.42;color:var(--gold,#c9a35a);}.ju-note .ju-quote-main{font-family: var(--font-accent);font-style:italic;font-weight:400;font-size: 1.4rem;line-height:1.5;color:var(--bone,#fbf7ef) !important;margin:4px auto 0;max-width:640px;}.ju-note .ju-quote-coda{font-family:var(--font-mono,'JetBrains Mono',monospace);font-size: 0.82rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--gold,#c9a35a) !important;margin:15px 0 0;}
.ju-btnrow{margin-top:26px;}.ju-btnrow .btn{border-radius:999px !important;}
@media(max-width:480px){.ju-grid{grid-template-columns:1fr;}}

    /* [16 Jul] This block used to force JetBrains Mono 700 / 0.03em onto the
       dropdown pills at (0,2,0) + !important — it beat .nav-dd-cta and made
       them heavier and more evenly spaced than the corner pill they are meant
       to copy. The pills now take their type from .nav-dd-cta / .nav-dd-action,
       which mirror .btn + .nav-actions .btn + .nav-cta exactly. Only the
       account label keeps a mono treatment here.
       DO NOT re-add font-family/weight for the pills in this block. */
    .nav-dropdown .iz-nav-account,
    .nav-dropdown .iz-nav-account .iz-nav-account-label,
    .nav-dropdown .iz-nav-account .iz-nav-account-label::before {
      font-size: 0.82rem !important;
      font-family: 'JetBrains Mono', ui-monospace, monospace !important;
      font-weight: 700 !important;
      letter-spacing: 0.03em !important;
      text-transform: uppercase !important;
    }

    /* Option E: compact 1/3 : 2/3 header dropdowns + heading font consistency */
    .nav-dd-grid[style*="--cols:2"] {
      grid-template-columns: minmax(240px, 1fr) minmax(240px, 1fr) !important;
      column-gap: 26px !important;
    }
    .nav-dd-grid[style*="--cols:3"] {
      grid-template-columns: minmax(240px, 2fr) minmax(90px, 1fr) minmax(90px, 1fr) !important;
      column-gap: 26px !important;
    }
    .nav-dropdown .nav-dd-h {
      font-family: 'JetBrains Mono', ui-monospace, monospace !important;
    }

    /* [16 Jul] Removed: this forced Home to 1fr / 2fr !important — a 1:2 split
       while Services, Approach and Resources all sit at 1:1. The !important
       beat .dd-w-std, which is why Home stayed lopsided after the width fix.
       Home now inherits the standard 240px + 240px like the other three. */
    .nav-dd-grid[data-menu="about"] {
      grid-template-columns: minmax(150px, 1fr) minmax(150px, 1fr) !important;
    }

    /* ===== Nav login pill: logged-in shows serif-italic name (Option C) ===== */
    .nav-client-login[data-state="in"] .nav-client-login-dot { display: none; }
    .nav-client-login[data-state="in"] .nav-client-login-label { font-family: var(--font-italic,'Instrument Serif',Georgia,serif); font-style: italic; text-transform: none; letter-spacing: 0.01em; font-size: 0.95rem; }
    .nav-client-login-chev { display: none; font-family: sans-serif; font-size: 0.72rem; opacity: 0.65; margin-left: 2px; }
    .nav-client-login[data-state="in"] .nav-client-login-chev { display: inline-block; }

    .nav-client-login-lock { width: 12px; height: 12px; color: var(--gold); flex: none; }
    .nav-client-login[data-state="in"] .nav-client-login-lock { display: none; }

    @keyframes ctaPhoneRing {
      0%, 90%, 100% { transform: rotate(0deg); }
      92% { transform: rotate(-10deg); }
      94% { transform: rotate(10deg); }
      96% { transform: rotate(-7deg); }
      98% { transform: rotate(7deg); }
    }
    .cta-phone, .nav-dd-phone { transform-origin: center; animation: ctaPhoneRing 3.6s ease-in-out infinite; }
    @media (prefers-reduced-motion: reduce) { .cta-phone, .nav-dd-phone { animation: none; } }

    .sticky-cta-pulse { display: none !important; }

    /* ===== Services pillars (16 services → 4 pillar cards) ===== */
    .pillar-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
    .pillar-card { background: var(--cream, #f4ede0); border: 1px solid rgba(7, 14, 28, 0.12);   /* [20 Jul] was var(--card-bg) = bone #F4F1EA, a COOLER white than the
         section's cream #F4EDE0 — the two abutted with a visible seam (the cards read greyer than the ground).
         Now matches the section exactly; the hairline border is what makes it read as a card, not the fill. */ border-radius: 14px; padding: 28px 28px 26px; transition: border-color .45s ease, transform .45s cubic-bezier(.22,.61,.36,1); }
    .pillar-card:hover { border-color: rgba(201,163,90,0.45); transform: translateY(-2px); }
    .pillar-num { font-family: var(--font-mono); font-size: 0.62rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gold); }
    .pillar-name { font-family: var(--font-display);  font-weight: 400; font-size: 1.4rem; color: var(--on-surface-strong); margin: 5px 0 18px; line-height: 1.05; }
    .pillar-pills { display: flex; flex-direction: column; gap: 9px; align-items: flex-start; }
    .pill-row { display: flex; gap: 9px; flex-wrap: wrap; }
    .pillar-pill { font-family: var(--font-sans); font-size: 0.82rem; font-weight: 500; color: var(--on-surface-strong); background: #ffffff; border: 1px solid rgba(201,163,90,0.42); border-radius: 999px; padding: 8px 15px; transition: background .3s, border-color .3s, color .3s; cursor: default; }
    .pillar-pill:hover { background: var(--gold); border-color: var(--gold); color: var(--ink); }
    .pillar-pill-lead { background: var(--gold); border-color: var(--gold); color: var(--ink); }
    @media (max-width: 700px) { .pillar-grid { grid-template-columns: 1fr; } }

    /* Services header: 3-line intro + bold highlights */
    /* [17 Jul] 56rem (896px) → 65rem (1040px). Two orphans, both measured:
         · the lead ran 4 lines with "sell." alone on the last. Its text needs
           ~2917px of run; against 896px that's 3.4 lines, so 3 was impossible.
           At 1040px it's 2.8.
         · "Holistic strategy across property, super, investing & debt" needed
           459px + the 30px tick = 489px per column; the 864px list gave 418px.
           Two columns of 489 + the 28px gap = 1006px.
       The .container is 1240px, so both fit without touching the page grid.
       balance evens the lines rather than leaving a short tail. */
    #services .section-head { max-width: 65rem; }

    /* [17 Jul] 54rem (864px) → 65rem (1040px), matching the .section-head above.
       These two are what actually constrained the text — widening the
       section-head alone did nothing, because the lead and the list each carry
       their own max-width. */
    #services .lead { max-width: 65rem; text-wrap: balance; }
    #services .section-bullets { max-width: 65rem; }
    #services .section-bullets li { text-wrap: balance; }
    #services .lead .kw { font-weight: 700; }




    /* Timeline "time processing" — rail draws + stages reveal in sync (slower, aligned).
       clip-path expands past the box (negative insets) so the → arrow is NOT clipped. */
    .ju-rail.reveal { opacity:1 !important; transform:none !important; clip-path: inset(-8px 100% -8px 0); transition: clip-path 2.0s cubic-bezier(.35,.02,.25,1); }
    .ju-rail.reveal.visible { clip-path: inset(-8px -18px -8px 0); }
    .ju-card.reveal-delay-1, .ju-node.reveal-delay-1 { transition-delay: 0s !important; }
    .ju-card.reveal-delay-2, .ju-node.reveal-delay-2 { transition-delay: 0.40s !important; }
    .ju-card.reveal-delay-3, .ju-node.reveal-delay-3 { transition-delay: 0.80s !important; }
    .ju-card.reveal-delay-4, .ju-node.reveal-delay-4 { transition-delay: 1.20s !important; }
    .ju-card.reveal-delay-5, .ju-node.reveal-delay-5 { transition-delay: 1.60s !important; }
    .ju-card.reveal-delay-6, .ju-node.reveal-delay-6 { transition-delay: 2.00s !important; }

    /* Signature reveal — gentle fade-in on scroll into view (OPACITY ONLY — font, size and
       layout are completely untouched; can't get stuck hidden thanks to the JS safety fallback). */
    /* ── Signature fade ──────────────────────────────────────────────────
       [17 Jul] The old rule put `transition: opacity 4.4s` on .sig-anim itself,
       so ARMING animated too: adding .sig-armed faded the text 1 → 0 over 4.4s
       (+ its 1.8–2.9s delay). On the home page the mission signature therefore
       spent ~6s quietly fading out while you scrolled toward it, and then faded
       back in — net effect, nothing you could see. The About signature escaped
       it only because its page is display:none at load, so no transition could
       run and it armed instantly.
       Fix: arm with NO transition; transition only on the way in. The
       :not(.sig-in) is what makes that work — .sig-armed is never removed, so
       without it the "transition: none" would also kill the fade-in.
       Timing: 4.4s → 2.6s, delays trimmed to match. */
    .sig-anim { transition: opacity 2.6s cubic-bezier(.4,0,.2,1); }
    .sig-anim.sig-armed:not(.sig-in) { opacity: 0; transition: none; }
    .sig-anim.sig-in { opacity: 1; }
    .mission-sign-role.sig-anim { transition-delay: 1.1s !important; }
    @media (prefers-reduced-motion:reduce){ .sig-anim { opacity: 1 !important; transition: none !important; } }

    /* "The process" line — draws left→right + steps arrive in step (matches the journey age-line) */
    #how-it-works .steps-row.reveal { opacity: 1 !important; transform: none !important; }
    #how-it-works .steps-row.reveal::before { clip-path: inset(0 100% 0 0); transition: clip-path 1.6s cubic-bezier(.35,.02,.25,1); }
    #how-it-works .steps-row.reveal.visible::before { clip-path: inset(0 0 0 0); }
    #how-it-works .step.reveal-delay-1 { transition-delay: 0s !important; }
    #how-it-works .step.reveal-delay-2 { transition-delay: 0.4s !important; }
    #how-it-works .step.reveal-delay-3 { transition-delay: 0.8s !important; }
    #how-it-works .step.reveal-delay-4 { transition-delay: 1.2s !important; }
    @media (prefers-reduced-motion:reduce){ #how-it-works .steps-row.reveal::before { clip-path: none !important; } }
    /* Case-study cards: align Before/Strategy/Outcome text */
    .case-item strong { display: inline-block; min-width: 5.4em; }
    /* Next-webinar signup (education media card) */
    .media-webinar-form { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
    .media-webinar-input { flex: 1; min-width: 0; background: transparent; border: 1px solid rgba(201,163,90,0.4); border-radius: 8px; padding: 9px 11px; color: var(--on-surface-strong); font-family: var(--font-sans); font-size: 0.82rem; }
    .media-webinar-input::placeholder { color: rgba(7,14,28,0.42); }
    .media-webinar-btn { background: var(--gold); color: var(--ink); border: none; border-radius: 8px; padding: 9px 14px; font-family: var(--font-mono); font-size: 0.62rem; letter-spacing: 0.08em; text-transform: uppercase; cursor: pointer; white-space: nowrap; font-weight: 500; }
    .media-webinar-form .newsletter-status { flex: 0 0 100%; margin-top: 2px; color: var(--ink); font-size: 0.76rem; line-height: 1.4; }
    /* Item 3: 'accountant-ready' dot -> live pulse */
    @keyframes atoLive { 0%,100% { box-shadow: 0 0 0 0 rgba(201,163,90,0.45); } 70% { box-shadow: 0 0 0 6px rgba(201,163,90,0); } }
    .ato-badge .dot { animation: atoLive 2.2s ease-out infinite; }
    @media (prefers-reduced-motion:reduce){ .ato-badge .dot { animation: none; } }
    /* Pillars: left-to-right sweep like the journey, quicker */
    #services .pillar-card.reveal-delay-1 { transition-delay: 0s !important; }
    #services .pillar-card.reveal-delay-2 { transition-delay: 0.4s !important; }
    #services .pillar-card.reveal-delay-3 { transition-delay: 0.8s !important; }
    #services .pillar-card.reveal-delay-4 { transition-delay: 1.2s !important; }
    /* Item 7C: About stat cards sweep in left-to-right (stronger, staggered) */
    [data-page="about"] .stat-card.reveal-delay-1 { transition-delay: 0s !important; }
    [data-page="about"] .stat-card.reveal-delay-2 { transition-delay: 0.2s !important; }
    [data-page="about"] .stat-card.reveal-delay-3 { transition-delay: 0.4s !important; }
    [data-page="about"] .stat-card.reveal-delay-4 { transition-delay: 0.6s !important; }
    /* Education disclaimer (was a card -> now small, italic, centred; keeps font + colour) */
    .edu-disclaimer { text-align: center; max-width: 620px; margin: 26px auto 0; font-style: italic; }
    .edu-disclaimer .trust-headline { font-size: 0.95rem; margin-bottom: 3px; }
    .edu-disclaimer .trust-body { font-size: 0.82rem; }
    /* Mission highlights — bold only (premium, no colour, font untouched) */
    .mgold { font-weight: 600; }
    /* Mission STATEMENT — word-by-word appear on scroll (inline spans; body font untouched) */
    .ms-fill .ms-word { opacity: 0.1; transition: opacity 0.5s ease; }
    .ms-fill .ms-word.lit { opacity: 1; }
    /* "Know your next move." — whole line rises (font untouched), slow */
    .km-move { transition: opacity 1.7s cubic-bezier(.2,.7,.2,1), transform 1.7s cubic-bezier(.2,.7,.2,1); }
    .km-move.km-armed { opacity: 0; transform: translateY(0.55em); }
    .km-move.km-armed.in { opacity: 1; transform: translateY(0); }
    @media (prefers-reduced-motion:reduce){ .ms-fill .ms-word { opacity: 1 !important; } .km-move.km-armed { opacity: 1 !important; transform: none !important; } }
    /* Typewriter (rotating text + cursor; text content only, font untouched) */
    .tw { display: inline; white-space: nowrap; font: inherit; font-variation-settings: inherit; letter-spacing: inherit; }
    .tw-inner { display: inline; font: inherit; font-variation-settings: inherit; letter-spacing: inherit; }
    .tw-cursor { display: inline; margin-left: 1px; font: inherit; font-variation-settings: inherit; letter-spacing: inherit; color: var(--gold); }
    .tw-cursor.blink { animation: izBlink 1.05s step-end infinite; }
    @keyframes izBlink { 0%,100% { opacity: 1; } 50% { opacity: 0; } }
    @media (prefers-reduced-motion:reduce){ .tw-cursor { animation: none; } }
    /* VOA heading: widen head so the typewriter line fits at the SAME font size (wraps only on narrow screens) */
    #value-advice .section-head { max-width: 1200px; }
    #value-advice .section-head .lead { max-width: 640px; margin-left: auto; margin-right: auto; }
    /* anime.js-style text reveal — heading slides up from behind a mask (font untouched) */
    .anim-reveal { overflow: hidden; padding-bottom: 0.14em; margin-bottom: -0.14em; }
    .anim-reveal .anim-inner { display: block; font: inherit; font-variation-settings: inherit; letter-spacing: inherit; transform: translateY(115%); transition: transform 2s cubic-bezier(.22,.61,.36,1); will-change: transform; }
    .anim-reveal.in .anim-inner { transform: translateY(0); }
    @media (prefers-reduced-motion:reduce){ .anim-reveal .anim-inner { transform: none !important; } }
    /* One-time typewriter (types the journey quote out on scroll; font untouched) */
    .tw-once { white-space: pre-line; }
    .tw-once-cursor { color: var(--gold); font-weight: 400; font-style: normal; margin-left: 1px; }
    .tw-once-cursor.blink { animation: izBlink 1.05s step-end infinite; }
    /* Signature sign-off — logotype reveal of the real logo (icon settles, wordmark rises from mask) */
    .iz-signature-end {
      /* Proportions from the SIGN-OFF SPEC SHEET (S = symbol ink height = 291px there):
           symbol 1.84 x 1.00 S | wordmark 4.36 wide, cap 0.234 S | rule 0.512 wide,
           hairline 0.007 S | tagline 1.63 wide, ink 0.216 S
           gaps (edge to edge): symbol->word 0.505 S, word->rule 0.299 S, rule->tag 0.251 S
         Live text, so font-size = cap / 0.730 (Mono) and ink / 1.020 (Cormorant italic).
         Margins below subtract the svg's own 0.061 pad and each font's line-box space,
         so the GAPS land edge-to-edge as specified.
         (cover-lockup-bone.png is the COVER lockup: symbol 8.6x the wordmark. That
         ratio assumes a large rendering; at sign-off size it gives an 11px wordmark
         and a 6.9px x-height tagline. The sign-off lockup is balanced 2.1x instead.)
         Everything below
         derives from --izlr-s = the SYMBOL'S INK HEIGHT, so the lockup holds its
         exact proportions at every screen width.
             artwork:  symbol ink 311 . wordmark cap 36 . rule 96 . tagline ink 56
             ratios/S: wordmark cap 0.1158 . rule 0.3087 . tagline ink 0.1801
             gaps/S:   sym->word 0.2701 . word->rule 0.2154 . rule->tag 0.1254
         Live text, so font-size = cap / 0.730 (JetBrains Mono 700 cap ratio) and
         tagline font-size = ink / 1.020 (Cormorant italic ink ratio). */
      --izlr-s: clamp(60px, 6vw, 90px);
      text-align: center; margin: 80px auto 56px; max-width: 900px;
    }
    /* Emphasis inside a display heading is the ACCENT voice, not the heading font
       slanted. Without this, <em> falls back to the browser default — italic with
       no font-family — so it slanted Fraunces. h1/h2 only: h3 is 1.15rem, below
       Cormorant's 1.4rem floor. */
    h1 em, h2 em { font-family: var(--font-emphasis); }
    /* The 1.14em optical bump that used to live here is gone with Cormorant.
       Fraunces italic IS the heading font, so the em now sets at exactly the
       heading's size with no compensation — which is the whole point. */

    .izlr-mark { display: inline-block; }
    .izlr-mark img, .izlr-mark svg { width: auto; height: calc(var(--izlr-s) * 1.1230); opacity: 0; transform: scale(0.55) rotate(-22deg); transition: opacity 1s cubic-bezier(.2,.7,.2,1), transform 1.25s cubic-bezier(.2,.72,.24,1); }
    .iz-signature-end.in .izlr-mark img, .iz-signature-end.in .izlr-mark svg { opacity: 1; transform: scale(1) rotate(0deg); }
    .izlr-word { display: block; overflow: hidden; padding-bottom: 0.16em; margin: calc(var(--izlr-s) * 0.4023) auto -0.16em; }
    .izlr-word-inner { display: inline-block; font-family: var(--font-mono); font-style: normal; font-weight: 700; font-size: calc(var(--izlr-s) * 0.3205); line-height: 1; color: var(--bone); text-transform: uppercase; letter-spacing: 0.33em; text-indent: 0.33em; transform: translateY(115%); transition: transform 1.2s cubic-bezier(.16,1,.3,1); transition-delay: 0.55s; }
    .iz-signature-end.in .izlr-word-inner { transform: translateY(0); }
    .izlr-tag { display: block; font-family: var(--font-accent); font-style: italic; font-size: max(1.4rem, calc(var(--izlr-s) * 0.2118)); letter-spacing: 0.04em; line-height: 1; text-transform: none; color: var(--gold); margin-top: calc(var(--izlr-s) * 0.2100); opacity: 0; transition: opacity 1s ease; transition-delay: 1.3s; }
    .iz-signature-end.in .izlr-tag { opacity: 1; }
    @media (prefers-reduced-motion:reduce){ .iz-signature-end .izlr-mark img, .iz-signature-end .izlr-mark svg, .iz-signature-end .izlr-word-inner, .iz-signature-end .izlr-tag { opacity: 1 !important; transform: none !important; } }
    /* Auto word-by-word reveal (time-based; plays itself when in view; font untouched) */
    .auto-reveal .ar-word { font: inherit; font-variation-settings: inherit; letter-spacing: inherit; opacity: 0.12; transition: opacity 0.6s ease; }
    .auto-reveal .ar-word.lit { opacity: 1; }
    @media (prefers-reduced-motion:reduce){ .auto-reveal .ar-word { opacity: 1 !important; } }
    /* Card reveal (Jitter-style: rise + gentle scale + fade, staggered) */
    .card-reveal { opacity: 0; transform: translateY(30px) scale(0.955); transition: opacity 0.9s cubic-bezier(.2,.72,.24,1), transform 0.9s cubic-bezier(.2,.72,.24,1); will-change: opacity, transform; }
    .card-reveal.in { opacity: 1; transform: translateY(0) scale(1); }
    .card-reveal.cr-1 { transition-delay: 0s; }
    .card-reveal.cr-2 { transition-delay: 0.13s; }
    .card-reveal.cr-3 { transition-delay: 0.26s; }
    .card-reveal.cr-4 { transition-delay: 0.39s; }
    @media (prefers-reduced-motion:reduce){ .card-reveal { opacity: 1 !important; transform: none !important; } }
    /* Part 4: breathing room before the confidence-jump chart */
    #value-advice .voa-chart-subhead { margin-top: 112px !important; }
    /* About founder signature: waits for the quote's word-by-word reveal to finish */
    .as-sign.sig-anim { transition-delay: 1.2s !important; }   /* [17 Jul] was 2.9s — faster, as asked */
    .contact-detail-value .email-link, a.email-link { font-family: inherit !important; }
    /* Education (#media): centre the media-head content + disclaimer (description is in .media-head, not .section-head) */
    #media .media-head { margin-left: auto !important; margin-right: auto !important; text-align: center !important; }
    #media .media-head .lead, #media .media-head p, #media .media-head h2, #media .media-head .eyebrow { text-align: center !important; margin-left: auto !important; margin-right: auto !important; }
    #media .edu-disclaimer { margin-left: auto !important; margin-right: auto !important; text-align: center !important; }
    #media .edu-disclaimer p, #media .edu-disclaimer .trust-headline, #media .edu-disclaimer .trust-body { text-align: center !important; }
    /* Bulletproof: centre disclaimer via parent text-align (margin-auto wasn't biting) */
    #media .media-placeholder { text-align: center !important; }
    #media .media-placeholder .edu-disclaimer { display: inline-block !important; max-width: 620px; margin: 26px auto 0 !important; float: none !important; text-align: center !important; }
    #tools .section-head .lead { margin-left: auto !important; margin-right: auto !important; }
    /* Partner icons — staggered pop-in (websites-style entrance) */
    .partner-who-item { opacity: 0; transform: translateY(18px) scale(0.88); transition: opacity 1.3s cubic-bezier(.2,.72,.24,1), transform 1.4s cubic-bezier(.2,.72,.24,1); }
    .partner-who-grid.pw-in .partner-who-item { opacity: 1; transform: translateY(0) scale(1); }
    .partner-who-grid.pw-in .partner-who-item:nth-child(1){transition-delay:0s}
    .partner-who-grid.pw-in .partner-who-item:nth-child(2){transition-delay:.18s}
    .partner-who-grid.pw-in .partner-who-item:nth-child(3){transition-delay:.36s}
    .partner-who-grid.pw-in .partner-who-item:nth-child(4){transition-delay:.54s}
    .partner-who-grid.pw-in .partner-who-item:nth-child(5){transition-delay:.72s}
    .partner-who-grid.pw-in .partner-who-item:nth-child(6){transition-delay:.90s}
    @media (prefers-reduced-motion:reduce){ .partner-who-item { opacity:1 !important; transform:none !important; } }
    .cw2-legend .cw2-tap { margin-left: auto; font-style: italic; text-transform: none; letter-spacing: 0; opacity: 0.85; font-weight: 500; }
    /* Mission signature waits for the statement's word-by-word reveal (name then role) */
    .mission-sign-name.sig-anim { transition-delay: 0.5s !important; }  /* [17 Jul] was 1.8s */
    /* Journey: cards/nodes reveal over the same ~2.4s window as the age line + quote */
    .ju-card.reveal, .ju-node.reveal { transition: opacity 0.65s cubic-bezier(.2,.7,.2,1), transform 0.65s cubic-bezier(.2,.7,.2,1) !important; }
    .ju-node.reveal-delay-1, .ju-card.reveal-delay-1 { transition-delay: 0s !important; }
    .ju-node.reveal-delay-2, .ju-card.reveal-delay-2 { transition-delay: 0.35s !important; }
    .ju-node.reveal-delay-3, .ju-card.reveal-delay-3 { transition-delay: 0.7s !important; }
    .ju-node.reveal-delay-4, .ju-card.reveal-delay-4 { transition-delay: 1.05s !important; }
    .ju-node.reveal-delay-5, .ju-card.reveal-delay-5 { transition-delay: 1.4s !important; }
    .ju-node.reveal-delay-6, .ju-card.reveal-delay-6 { transition-delay: 1.75s !important; }
    .contact-social-label:hover { transform: translateY(-2px); box-shadow: 0 10px 32px rgba(201,163,90,0.38); }
    .contact-social-label .csl-arrow { position: relative; z-index: 1; transition: transform 0.3s; }
    .contact-social-label:hover .csl-arrow { transform: translateX(3px); }
    /* Shimmer: sticky CTA = always-on (revenue); nav/hero = hover-only */
    .sticky-cta { overflow: hidden; }
    .sticky-cta::before { content:""; position:absolute; top:0; left:-60%; width:45%; height:100%; background: linear-gradient(100deg, transparent, rgba(255,255,255,0.5), transparent); transform: skewX(-18deg); pointer-events:none; animation: izSubShimmer 3.6s ease-in-out infinite; }
    .nav-cta, .hero-cta-primary, .nav-dd-cta { position: relative; overflow: hidden; }
    .nav-cta::before, .hero-cta-primary::before, .nav-dd-cta::before { content:""; position:absolute; top:0; left:-60%; width:45%; height:100%; background: linear-gradient(100deg, transparent, rgba(255,255,255,0.45), transparent); transform: skewX(-18deg); pointer-events:none; opacity:0; }
    .nav-cta:hover::before, .hero-cta-primary:hover::before, .nav-dd-cta:hover::before { opacity:1; animation: izSubShimmer 0.9s ease-in-out; }
    @media (prefers-reduced-motion:reduce){ .sticky-cta::before, .nav-cta::before, .hero-cta-primary::before, .nav-dd-cta::before { animation: none !important; opacity: 0; } }
    .izlr-rule { display: block; width: calc(var(--izlr-s) * 0.512); height: max(1px, calc(var(--izlr-s) * 0.007)); background: var(--gold); margin: calc(var(--izlr-s) * 0.2541) auto 0; opacity: 0; transition: opacity 1s ease; transition-delay: 1.05s; border-radius: 2px; }
    .iz-signature-end.in .izlr-rule { opacity: 1; }

/* WordPress migration safeguards: retain the supplied UI at narrow widths. */
.hero-card .hero-card-title {
  font-family: var(--font-display);
  font-weight: 350;
  color: var(--bone);
  letter-spacing: -0.015em;
}

/* Above-the-fold content must be immediately readable; reveal animations
   continue unchanged for sections reached by scrolling. */
.hero .reveal {
  opacity: 1;
  transform: none;
  filter: none;
  transition: none;
}
.hero-kicker,
.hero-meta,
.hero h1,
.hero-lead,
.hero-dual-cta,
.hero-card {
  animation: none !important;
  opacity: 1 !important;
  transform: none !important;
}
#page-home {
  animation: none;
}

/* Preserve the complete navigation interaction language from the previous
   WordPress theme: underline/chevron motion, single-open mega menus, link
   markers and CTA sheen. */
.nav-trigger {
  position: relative;
  transition: color .25s ease, transform .3s cubic-bezier(.22,.61,.36,1);
}
.nav-item > .nav-trigger {
  color: inherit;
  transform: none;
}
.nav-trigger::before {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -4px;
  width: 0;
  height: 1px;
  background: var(--gold);
  opacity: 1;
  transition: width .4s cubic-bezier(.22,.61,.36,1),
              left .4s cubic-bezier(.22,.61,.36,1);
}
.nav-trigger:hover::before,
.nav-item:hover > .nav-trigger::before,
.nav-item:focus-within > .nav-trigger::before,
.nav-trigger.active::before {
  left: 0;
  width: 100%;
}
.nav-item > .nav-trigger::after,
.nav-trigger:hover::after,
.nav-item:hover .nav-trigger::after,
.nav-trigger.active::after {
  content: "\25BE";
  position: static;
  width: auto;
  height: auto;
  margin-top: 1px;
  background: none;
  font-size: 9px;
  line-height: 1;
  opacity: .55;
  transform: none;
  transition: transform .35s cubic-bezier(.19,1,.22,1), opacity .25s;
}
.nav-item:hover > .nav-trigger,
.nav-item:focus-within > .nav-trigger,
.nav-trigger.active {
  color: var(--gold);
  transform: translateY(-1px);
}
.nav-item:hover > .nav-trigger::after,
.nav-item:focus-within > .nav-trigger::after,
.nav-item.dd-open > .nav-trigger::after {
  transform: rotate(180deg);
  opacity: 1;
}
.nav-dropdown {
  visibility: visible;
  transform-origin: top center;
  transition: opacity .35s cubic-bezier(.22,.61,.36,1),
              transform .4s cubic-bezier(.22,.61,.36,1),
              visibility .35s;
}
.nav-dd-card {
  transition: border-color .3s ease, box-shadow .35s ease;
}
.nav-item:hover .nav-dd-card,
.nav-item:focus-within .nav-dd-card,
.nav-item.dd-open .nav-dd-card {
  border-color: rgba(201,163,90,.36);
  box-shadow: 0 28px 70px -20px rgba(0,0,0,.7),
              0 0 0 1px rgba(201,163,90,.06);
}
.nav-dd-link {
  position: relative;
  transition: padding-left .35s cubic-bezier(.22,.61,.36,1), color .3s ease;
}
.nav-dd-link::before {
  display: block;
  content: "";
  position: absolute;
  left: -10px;
  top: 50%;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--gold);
  opacity: 0;
  transform: translateY(-50%);
  transition: opacity .3s ease, left .35s cubic-bezier(.22,.61,.36,1);
}
.nav-dd-link:hover {
  padding-left: 12px;
  color: var(--gold) !important;
}
.nav-dd-link:hover::before {
  left: 0;
  opacity: 1;
}
.nav-dd-account,
.nav-dd-action,
.nav-dd-cta,
.nav-actions .nav-cta {
  position: relative;
  overflow: hidden;
  transition: transform .3s ease, box-shadow .3s ease;
}
.nav-dd-account::after,
.nav-dd-action::after,
.nav-dd-cta::after,
.nav-actions .nav-cta::before {
  content: "";
  display: block;
  position: absolute;
  inset: 0;
  background: linear-gradient(110deg, transparent 30%, rgba(255,255,255,.48) 50%, transparent 70%);
  transform: translateX(-120%);
  transition: transform .7s ease;
  pointer-events: none;
}
.nav-dd-account:hover::after,
.nav-dd-action:hover::after,
.nav-dd-cta:hover::after,
.nav-actions .nav-cta:hover::before {
  transform: translateX(120%);
}
.nav-dd-account:hover,
.nav-dd-action:hover,
.nav-dd-cta:hover,
.nav-actions .nav-cta:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 22px -6px rgba(201,163,90,.6);
}
.nav-dd-h {
  transition: color .25s ease, border-color .25s ease;
}
.nav-dd-col:hover .nav-dd-h {
  color: var(--gold-light);
  border-color: rgba(201,163,90,.48);
}

@media (hover: hover) and (pointer: fine) {
  .nav-links .nav-item:not(.dd-open) > .nav-dropdown,
  .nav-links .nav-item.dd-just-closed > .nav-dropdown,
  .nav-links .nav-item.dd-just-closed:hover > .nav-dropdown,
  .nav-links .nav-item.dd-just-closed:focus-within > .nav-dropdown {
    opacity: 0 !important;
    pointer-events: none !important;
    visibility: hidden !important;
  }
  .nav-links .nav-item.dd-open > .nav-dropdown,
  .nav-links .nav-item.dd-open:hover > .nav-dropdown,
  .nav-links .nav-item.dd-open:focus-within > .nav-dropdown {
    opacity: 1 !important;
    pointer-events: auto !important;
    visibility: visible !important;
  }
  .nav-links .nav-item.dd-open:not(.dd-align-left):not(.dd-align-right) > .nav-dropdown {
    transform: translateX(-50%) translateY(0) !important;
  }
  .nav-links .nav-item.dd-open.dd-align-left > .nav-dropdown,
  .nav-links .nav-item.dd-open.dd-align-right > .nav-dropdown {
    transform: translateX(0) translateY(0) !important;
  }
  .nav-links .nav-item:not(.dd-open) > .nav-trigger::after,
  .nav-links .nav-item.dd-just-closed > .nav-trigger::after {
    transform: none !important;
    opacity: .55 !important;
  }
  .nav-links .nav-item.dd-open > .nav-trigger::after {
    transform: rotate(180deg) !important;
    opacity: 1 !important;
  }
}

@media (max-width: 720px) {
  .nav {
    padding-left: 20px;
    padding-right: 20px;
    gap: 12px;
  }
  .nav-actions {
    display: none !important;
  }
  .menu-toggle {
    display: inline-flex !important;
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    flex: 0 0 auto;
    color: var(--bone) !important;
    opacity: 1 !important;
    visibility: visible !important;
    z-index: 20;
  }
  .hero-kicker {
    max-width: 100%;
    white-space: normal;
    font-size: 0.62rem;
    letter-spacing: 0.12em;
  }
  .hero-points,
  .featured-health-check,
  .financial-health-check {
    width: 100%;
    max-width: 100%;
  }
}

/* Exact final navbar interaction layer from the LocalWP backup created on
   26 July. This intentionally comes last because the backup used this layer
   to normalize earlier navbar refinements. */
.nav-links .nav-item > .nav-trigger {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 0 !important;
  text-decoration: none !important;
}
.nav-links .nav-item > .nav-trigger::after,
.nav-links .nav-item:hover > .nav-trigger::after,
.nav-links .nav-item:focus-within > .nav-trigger::after,
.nav-links .nav-item.dd-open > .nav-trigger::after {
  content: none !important;
  display: none !important;
}
.nav-links .nav-item > .nav-trigger::before {
  content: "" !important;
  position: absolute !important;
  left: 16px !important;
  right: 16px !important;
  bottom: 1px !important;
  width: auto !important;
  height: 2px !important;
  background: var(--gold) !important;
  border-radius: 999px !important;
  opacity: 1 !important;
  transform: scaleX(0) !important;
  transform-origin: center !important;
  transition: transform .25s cubic-bezier(.22,.61,.36,1) !important;
}
.nav-links .nav-item:hover > .nav-trigger::before,
.nav-links .nav-item:focus-within > .nav-trigger::before,
.nav-links .nav-item.dd-open > .nav-trigger::before,
.nav-links .nav-item > .nav-trigger.active::before {
  left: 16px !important;
  right: 16px !important;
  width: auto !important;
  transform: scaleX(1) !important;
}
.nav-dd-account,
.nav-dd-cta {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  width: 100% !important;
  min-height: 44px !important;
  margin: 14px 0 0 !important;
  padding: 11px 20px !important;
  overflow: hidden !important;
  isolation: isolate !important;
  border: 1px solid var(--gold) !important;
  border-radius: 999px !important;
  background: var(--gold) !important;
  background-image: none !important;
  color: var(--ink) !important;
  font-family: var(--font-sans) !important;
  font-size: .72rem !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  letter-spacing: .14em !important;
  text-align: center !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
  box-shadow: none !important;
  appearance: none !important;
  cursor: pointer !important;
  transition: background-position .8s cubic-bezier(.19,1,.22,1),
              transform .4s ease,
              box-shadow .4s ease !important;
}
.nav-dd-account::before,
.nav-dd-cta::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: -60% !important;
  display: block !important;
  width: 45% !important;
  height: 100% !important;
  border-radius: inherit !important;
  background: linear-gradient(100deg, transparent, rgba(255,255,255,.45), transparent) !important;
  opacity: 0 !important;
  transform: skewX(-18deg) !important;
  pointer-events: none !important;
  z-index: 0 !important;
}
.nav-dd-action {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  width: 100% !important;
  min-height: 44px !important;
  margin: 14px 0 0 !important;
  padding: 11px 20px !important;
  border: 1px solid rgba(201,163,90,.5) !important;
  border-radius: 999px !important;
  background: transparent !important;
  background-image: none !important;
  color: rgba(244,237,224,.9) !important;
  font-family: var(--font-sans) !important;
  font-size: .72rem !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  letter-spacing: .14em !important;
  text-align: center !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
  box-shadow: none !important;
  transform: none !important;
  appearance: none !important;
  cursor: pointer !important;
  transition: border-color .3s ease, color .3s ease !important;
}
.nav-dd-action::before {
  content: none !important;
  display: none !important;
}
.nav-dd-account::after,
.nav-dd-action::after,
.nav-dd-cta::after {
  content: none !important;
  display: none !important;
}
.nav-dd-account > span,
.nav-dd-action > span,
.nav-dd-cta > span,
.nav-dd-account > svg,
.nav-dd-action > svg,
.nav-dd-cta > svg {
  position: relative !important;
  z-index: 2 !important;
}
.nav-dd-account:hover,
.nav-dd-account:focus-visible,
.nav-dd-cta:hover,
.nav-dd-cta:focus-visible {
  padding: 11px 20px !important;
  border-color: var(--gold) !important;
  background: var(--gold) !important;
  background-position: 100% 100% !important;
  color: var(--ink) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 14px 30px -10px rgba(201,163,90,.5) !important;
}
.nav-dd-account:hover::before,
.nav-dd-cta:hover::before,
.nav-dd-account:focus-visible::before,
.nav-dd-cta:focus-visible::before {
  opacity: 1 !important;
  animation: izSubShimmer .9s ease-in-out !important;
}
.nav-dd-action:hover,
.nav-dd-action:focus-visible {
  padding: 11px 20px !important;
  border-color: var(--gold) !important;
  background: transparent !important;
  color: var(--gold) !important;
  transform: none !important;
  box-shadow: none !important;
}
.nav-dd-link {
  display: block !important;
  padding-left: 0 !important;
  transform: translateY(0) !important;
  transition: color .25s ease, transform .25s ease !important;
}
.nav-dd-link::before,
.nav-dd-link::after {
  content: none !important;
  display: none !important;
}
.nav-dd-link:hover,
.nav-dd-link:focus-visible {
  padding-left: 0 !important;
  color: var(--gold) !important;
  transform: translateY(-1px) !important;
}

@media (max-width: 720px) {
  #siteHeader .nav {
    gap: 12px;
  }
  #siteHeader .brand {
    min-width: 0;
    flex: 1 1 auto;
  }
  #siteHeader .brand-word {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  #siteHeader .nav-actions {
    display: none;
  }
  #siteHeader .menu-toggle {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    position: static;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 1px solid rgba(201, 163, 90, 0.42);
    border-radius: 999px;
    background: rgba(7, 16, 31, 0.72);
    color: #f4ede0;
    font-size: 24px;
    line-height: 1;
    transform: none;
    flex: 0 0 44px;
    z-index: 1002;
  }
}
@media (max-width: 1100px) {
  #siteHeader .nav {
    position: relative;
  }
  #siteHeader .nav-links {
    display: flex !important;
    flex-direction: column;
    position: absolute;
    top: calc(100% + 12px);
    left: 0;
    right: 0;
    gap: 18px;
    max-height: 0;
    overflow: hidden;
    padding: 0 24px;
    border: 1px solid rgba(201, 163, 90, 0);
    border-radius: 18px;
    background: rgba(7, 14, 28, 0.96);
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(-10px) scale(.985);
    transform-origin: top center;
    transition: opacity 220ms ease,
                transform 260ms cubic-bezier(.22,.61,.36,1),
                max-height 320ms cubic-bezier(.22,.61,.36,1),
                padding 260ms cubic-bezier(.22,.61,.36,1),
                border-color 220ms ease,
                box-shadow 260ms ease,
                visibility 0s linear 320ms;
  }
  #siteHeader .nav.open .nav-links {
    max-height: calc(100svh - 96px);
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding: 24px;
    border-color: rgba(201, 163, 90, 0.24);
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.34);
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0) scale(1);
    transition-delay: 0s;
  }
  #siteHeader .nav.open .nav-links a {
    padding: 8px 0;
    border-bottom: 1px solid var(--hairline);
  }
  #siteHeader .nav-links .nav-item {
    opacity: 0;
    transform: translateY(-4px);
    transition: opacity 220ms ease, transform 260ms ease;
  }
  #siteHeader .nav.open .nav-links .nav-item {
    opacity: 1;
    transform: translateY(0);
  }
}
@media (prefers-reduced-motion: reduce) {
  #siteHeader .nav-links,
  #siteHeader .nav-links .nav-item {
    transition: none !important;
  }
}

/* Feedback alignment: larger homepage score heading. */
.hero-card .hero-card-title {
  margin-bottom: 18px;
  font-family: var(--font-display);
  font-size: clamp(1.75rem, 2.6vw, 2.2rem) !important;
  font-weight: 350;
  line-height: 1.08;
  letter-spacing: -0.025em;
}

/* Create account / Sign in modal from the approved HTML draft. */
.iz-modal {
  position: fixed;
  inset: 0;
  z-index: 10050;
  display: grid;
  place-items: center;
  padding: 24px;
  visibility: hidden;
  opacity: 0;
  transition: opacity .3s ease, visibility .3s ease;
}
.iz-modal.open { visibility: visible; opacity: 1; }
.iz-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(7, 14, 28, .78);
  backdrop-filter: blur(8px);
}
.iz-modal-card {
  --surface: var(--bone);
  --on-surface: var(--ink-2);
  --on-surface-strong: var(--ink);
  position: relative;
  z-index: 1;
  width: min(100%, 620px);
  max-height: min(90vh, 860px);
  overflow: auto;
  padding: 46px 48px 40px;
  border: 1px solid rgba(201, 163, 90, .45);
  background: var(--bone);
  color: var(--ink-2);
  box-shadow: 0 30px 90px rgba(0, 0, 0, .42);
  transform: translateY(18px) scale(.985);
  transition: transform .35s cubic-bezier(.22,.61,.36,1);
}
.iz-modal.open .iz-modal-card { transform: translateY(0) scale(1); }
.iz-modal-close {
  position: absolute;
  top: 16px;
  right: 18px;
  width: 36px;
  height: 36px;
  border: 0;
  background: transparent;
  color: var(--ink);
  font-size: 1.8rem;
  line-height: 1;
  cursor: pointer;
}
.iz-modal-eyebrow {
  margin-bottom: 14px;
  color: var(--gold-on-paper);
  font-family: var(--font-mono);
  font-size: .7rem;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.iz-modal-title {
  margin: 0 42px 10px 0;
  color: var(--ink);
  font-family: var(--font-display);
  font-size: clamp(2rem, 4vw, 2.7rem);
  font-weight: 350;
  line-height: 1.05;
  letter-spacing: -.03em;
}
.iz-modal-sub {
  margin: 0 0 26px;
  color: rgba(7, 14, 28, .72);
  font-size: .94rem;
  line-height: 1.65;
}
.iz-switch {
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin-bottom: 28px;
  border: 1px solid rgba(7, 14, 28, .25);
}
.iz-switch button {
  min-height: 50px;
  border: 0;
  background: transparent;
  color: rgba(7, 14, 28, .62);
  font-family: var(--font-mono);
  font-size: .72rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  cursor: pointer;
}
.iz-switch button + button { border-left: 1px solid rgba(7, 14, 28, .25); }
.iz-switch button[aria-selected="true"] { background: var(--ink); color: var(--bone); }
.iz-auth-form { display: grid; gap: 17px; }
.iz-field { display: grid; gap: 7px; }
.iz-field > label {
  color: var(--ink);
  font-family: var(--font-mono);
  font-size: .69rem;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.iz-input {
  width: 100%;
  min-height: 50px;
  padding: 12px 14px;
  border: 1px solid rgba(7, 14, 28, .28);
  border-radius: 0;
  background: rgba(255, 255, 255, .38);
  color: var(--ink);
  font: 400 .92rem/1.3 var(--font-body);
}
.iz-input:focus { border-color: var(--gold-on-paper); outline: 1px solid var(--gold-on-paper); }
.iz-input[aria-invalid="true"] { border-color: #9b2c2c; outline: 1px solid #9b2c2c; }
.iz-field-error { color: #9b2c2c; font-size: .76rem; line-height: 1.4; }
.iz-field-error[hidden] { display: none; }
.iz-phone { display: grid; grid-template-columns: minmax(150px, .85fr) 1.15fr; gap: 10px; }
.iz-password { position: relative; }
.iz-password .iz-input { padding-right: 66px; }
.iz-reveal {
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  padding: 0 14px;
  border: 0;
  background: transparent;
  color: var(--gold-on-paper);
  font-family: var(--font-mono);
  font-size: .68rem;
  text-transform: uppercase;
  cursor: pointer;
}
.iz-hint { margin: 0; color: rgba(7,14,28,.55); font-size: .76rem; }
.iz-consent {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 11px;
  align-items: start;
  padding: 11px 13px;
  border: 1px solid rgba(7,14,28,.14);
  border-left: 2px solid var(--gold-on-paper);
  background: rgba(201,163,90,.06);
  color: rgba(7,14,28,.72);
  font-family: var(--font-sans);
  font-size: .78rem;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.55;
  text-transform: none;
  cursor: pointer;
  transition: border-color .3s ease, background-color .3s ease;
}
.iz-consent:hover {
  border-color: rgba(201,163,90,.48);
  background: rgba(201,163,90,.09);
}
.iz-consent input {
  display: grid;
  place-content: center;
  appearance: none;
  -webkit-appearance: none;
  width: 17px;
  height: 17px;
  margin: 2px 0 0;
  padding: 0;
  border: 1px solid rgba(7,14,28,.42);
  border-radius: 0;
  background: transparent;
  cursor: pointer;
}
.iz-consent input::before {
  content: "";
  width: 8px;
  height: 4px;
  border-bottom: 2px solid var(--ink);
  border-left: 2px solid var(--ink);
  transform: rotate(-45deg) scale(0);
  transition: transform .16s ease;
}
.iz-consent input:checked {
  border-color: var(--gold-on-paper);
  background: var(--gold-on-paper);
}
.iz-consent input:checked::before { transform: rotate(-45deg) scale(1); }
.iz-consent input:focus-visible { outline: 2px solid var(--gold-on-paper); outline-offset: 3px; }
.iz-consent a, .iz-modal-foot button { color: var(--gold-on-paper); text-decoration: underline; }

/* Consent presentation mirrored from Zephyr_full function.html.
   Lead forms use the compact, plain treatment; account/booking forms retain
   the corresponding light-card treatment above. */
.form-grid .iz-consent,
.conv-form .iz-consent {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 2px 0 6px;
  padding: 0;
  border: 0;
  border-left: 0;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
  color: rgba(244, 241, 234, .55);
  font-size: .82rem;
  font-weight: 350;
  letter-spacing: .005em;
  line-height: 1.5;
  cursor: pointer;
}
.form-grid .iz-consent:hover,
.conv-form .iz-consent:hover {
  border-color: transparent;
  background: transparent;
  color: rgba(244, 241, 234, .78);
}
.form-grid .iz-consent span,
.conv-form .iz-consent span {
  text-wrap: pretty;
}
.form-grid .iz-consent input[type="checkbox"],
.conv-form .iz-consent input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  flex: none;
  width: 15px;
  height: 15px;
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 1px solid rgba(201, 163, 90, .85);
  border-radius: 3px;
  background: transparent;
  position: relative;
  cursor: pointer;
  opacity: 1;
  transition: background .15s, border-color .15s;
}
.form-grid .iz-consent input[type="checkbox"]::before,
.conv-form .iz-consent input[type="checkbox"]::before {
  content: none;
}
.form-grid .iz-consent input[type="checkbox"]:hover,
.conv-form .iz-consent input[type="checkbox"]:hover {
  border-color: #c9a35a;
  box-shadow: 0 0 0 3px rgba(201, 163, 90, .12);
}
.form-grid .iz-consent input[type="checkbox"]:checked,
.conv-form .iz-consent input[type="checkbox"]:checked {
  border-color: #c9a35a;
  background: #c9a35a;
}
.form-grid .iz-consent input[type="checkbox"]:checked::after,
.conv-form .iz-consent input[type="checkbox"]:checked::after {
  content: "";
  position: absolute;
  left: 4.5px;
  top: 1px;
  width: 4px;
  height: 8px;
  border: solid #070e1c;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.form-grid .iz-consent input[type="checkbox"]:focus-visible,
.conv-form .iz-consent input[type="checkbox"]:focus-visible {
  outline: 2px solid #c9a35a;
  outline-offset: 2px;
}
.form-grid .iz-consent a,
.conv-form .iz-consent a {
  color: rgba(244, 241, 234, .72);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.form-grid .iz-consent a:hover,
.conv-form .iz-consent a:hover {
  color: #c9a35a;
}
.iz-consent-flash {
  outline: 1px solid rgba(201, 163, 90, .85);
  outline-offset: 4px;
  border-radius: 3px;
}

/* Contact is the one .form-grid consent rendered on a light card. */
#contactForm .iz-consent {
  color: rgba(7, 14, 28, .62);
}
#contactForm .iz-consent:hover {
  color: rgba(7, 14, 28, .82);
}
#contactForm .iz-consent a {
  color: rgba(7, 14, 28, .72);
}

/* The conversion modal uses a paper background, so its compact consent must
   use the paper text palette rather than the dark-card palette. */
#scorecardForm .iz-consent {
  color: rgba(7, 14, 28, .72);
}
#scorecardForm .iz-consent:hover {
  color: rgba(7, 14, 28, .88);
}

/* Popup readability: preserve the gold accent while giving small copy enough
   contrast against the cream modal surfaces. */
.conv-modal-body .conv-eyebrow {
  color: #76591f;
}
.conv-modal-body .conv-ladder-line b {
  color: #76591f;
}
.conv-modal-body .conv-consent {
  color: rgba(7, 14, 28, .68);
}
.iz-modal .iz-hint {
  color: rgba(7, 14, 28, .68);
}
.iz-modal .iz-select[data-theme="light"] .iz-select-value.is-placeholder {
  color: rgba(7, 14, 28, .58);
}
.iz-modal .iz-select[data-theme="light"] .iz-select-option.selected {
  color: #76591f;
}
.conv-modal .iz-select[data-theme="light"] .iz-select-option.selected {
  color: #76591f;
}
.iz-modal .iz-consent a {
  color: #76591f;
}
.iz-btn {
  min-height: 54px;
  border: 1px solid var(--gold);
  background: var(--gold);
  color: var(--ink);
  font-family: var(--font-mono);
  font-size: .74rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  cursor: pointer;
}
.iz-btn:hover { background: var(--gold-light); }
.iz-btn:disabled { cursor: wait; opacity: .65; }
.iz-error { min-height: 0; color: #9b2c2c; font-size: .82rem; line-height: 1.45; }
.iz-error:empty { display: none; }
.iz-modal-foot { display: flex; justify-content: center; gap: 22px; margin: 22px 0 0; color: rgba(7,14,28,.62); font-size: .8rem; }
.iz-modal-foot button { border: 0; background: transparent; font: inherit; cursor: pointer; }
.iz-modal-card :focus-visible { outline: 2px solid var(--gold-on-paper); outline-offset: 2px; }

/* The chart paths draw on scroll and the ownership mark settles in after them. */
.cw2-watermark {
  opacity: 0;
  transform: translate(-50%, calc(-50% + 8px));
  transition: opacity 1.4s ease 1.1s, transform 1.4s ease 1.1s;
}
.cw2-watermark.is-visible {
  opacity: .12;
  transform: translate(-50%, -50%);
}

@media (max-width: 560px) {
  .iz-modal { padding: 12px; }
  .iz-modal-card { padding: 38px 22px 28px; max-height: 94vh; }
  .iz-phone { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .iz-modal, .iz-modal-card, .cw2-watermark { transition: none !important; }
  .cw2-watermark { opacity: .12; transform: translate(-50%, -50%); }
}

.iz-booking-modal-card { width: min(100%, 660px); }
.iz-name-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.iz-booking-form .iz-input[aria-invalid="true"] {
  border-color: #b42318;
  box-shadow: 0 0 0 2px rgba(180, 35, 24, .1);
}
.iz-booking-form .zephyr-field-error { margin-top: 0; }

/* Dedicated SSA booking surface. */
body:has(.booking-page) {
  min-height: 100vh;
  background:
    radial-gradient(circle at 12% 4%, rgba(201, 163, 90, .12), transparent 31rem),
    var(--ink);
}
.booking-header {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 76px;
  padding: 14px clamp(20px, 5vw, 72px);
  border-bottom: 1px solid rgba(244, 241, 234, .12);
}
.booking-brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: var(--bone);
  font-family: var(--font-display);
  font-size: 1.25rem;
  text-decoration: none;
}
.booking-brand-mark {
  width: 30px;
  height: 30px;
  color: var(--gold);
}
.booking-back {
  color: rgba(244, 241, 234, .72);
  font-family: var(--font-mono);
  font-size: .68rem;
  letter-spacing: .1em;
  text-decoration: none;
  text-transform: uppercase;
}
.booking-back:hover { color: var(--gold-light); }
.booking-page {
  width: min(100% - 32px, 1060px);
  margin: 0 auto;
  padding: clamp(52px, 8vw, 96px) 0 88px;
}
.booking-intro {
  max-width: 760px;
  margin: 0 auto 34px;
  color: var(--bone);
  text-align: center;
}
.booking-eyebrow {
  margin-bottom: 16px;
  color: var(--gold);
  font-family: var(--font-mono);
  font-size: .7rem;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.booking-intro h1 {
  margin: 0;
  color: var(--bone);
  font-family: var(--font-display);
  font-size: clamp(2.4rem, 6vw, 4.5rem);
  font-weight: 350;
  line-height: 1.02;
  letter-spacing: -.035em;
}
.booking-intro p {
  max-width: 620px;
  margin: 18px auto 0;
  color: rgba(244, 241, 234, .7);
  line-height: 1.7;
}
.booking-calendar {
  min-height: 520px;
  padding: clamp(16px, 3vw, 32px);
  border: 1px solid rgba(201, 163, 90, .35);
  background: var(--bone);
  box-shadow: 0 28px 80px rgba(0, 0, 0, .3);
}
.booking-unavailable {
  padding: 32px;
  color: #9f1d1d;
  text-align: center;
}

@media (max-width: 560px) {
  .iz-name-row { grid-template-columns: 1fr; }
  .booking-header { min-height: 66px; }
  .booking-header .brand-word { font-size: calc(var(--iz-sym) * 0.2553); }
  .booking-back { font-size: .6rem; }
  .booking-page { width: min(100% - 20px, 1060px); padding-top: 42px; }
  .booking-calendar { padding: 8px; }
}

/* Client portal placeholder */
.portal-shell {
  min-height: 100vh;
  padding: 96px clamp(22px, 5vw, 72px);
  background: #07101f;
  color: #f4ede0;
  animation: portalEnter .65s cubic-bezier(.19,1,.22,1) both;
}

.portal-hero {
  max-width: 980px;
  margin: 0 auto 34px;
  padding-bottom: 34px;
  border-bottom: 1px solid rgba(201,163,90,.24);
}

.portal-brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 38px;
  font-family: 'Manrope', system-ui, sans-serif;
  font-weight: 700;
  color: rgba(244,237,224,.82);
}

.portal-brand span {
  display: inline-grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border: 1px solid rgba(201,163,90,.45);
  border-radius: 50%;
  color: var(--gold);
}

.portal-eyebrow,
.portal-card-kicker {
  margin: 0 0 12px;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--gold);
}

.portal-hero h1 {
  max-width: 820px;
  margin: 0;
  color: #fff;
  font-size: clamp(2.5rem, 5vw, 5rem);
  line-height: .98;
}

.portal-hero p {
  max-width: 720px;
  margin: 22px 0 0;
  color: rgba(244,237,224,.72);
  font-size: 1.05rem;
  line-height: 1.75;
}

.portal-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 30px;
}

.portal-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  max-width: 980px;
  margin: 0 auto;
}

.portal-card {
  min-height: 250px;
  padding: 28px;
  border: 1px solid rgba(201,163,90,.24);
  border-radius: 8px;
  background: rgba(244,237,224,.045);
}

.portal-card h2 {
  margin: 0;
  color: #fff;
  font-family: 'Manrope', system-ui, sans-serif;
  font-size: 1.2rem;
}

.portal-card p {
  margin: 16px 0 24px;
  color: rgba(244,237,224,.66);
  line-height: 1.65;
}

.portal-card a {
  color: var(--gold);
  font-weight: 700;
  text-decoration: none;
}

@media (max-width: 860px) {
  .portal-grid { grid-template-columns: 1fr; }
  .portal-shell { padding-top: 72px; }
}

body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 9999;
  pointer-events: none;
  background:
    radial-gradient(circle at 50% 20%, rgba(201,163,90,.16), transparent 34%),
    #07101f;
  opacity: 0;
  transform: translateY(8px);
  transition: opacity .26s ease, transform .26s cubic-bezier(.22,.61,.36,1);
}

body.iz-route-leaving::after {
  opacity: 1;
  transform: translateY(0);
}

@keyframes portalEnter {
  from {
    opacity: 0;
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .portal-shell {
    animation: none;
  }

  body::after {
    transition: none;
  }
}

/* Full-screen Members' Suite flow, matched to the approved HTML reference. */
.iz-member-screen[hidden] {
  display: none !important;
}

.iz-member-screen {
  position: fixed;
  top: var(--iz-member-nav-offset, 103px);
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 450;
  overflow-x: hidden;
  overflow-y: auto;
  background: #05080f;
  color: rgba(244, 241, 234, .92);
  font-family: 'Manrope', system-ui, sans-serif;
  animation: izMemberScreenIn .55s cubic-bezier(.2, .7, .3, 1) both;
}

body.iz-member-screen-open {
  overflow: hidden !important;
}

body.iz-member-screen-open .sticky-cta {
  opacity: 0;
  pointer-events: none;
}

.iz-member-screen h1[tabindex="-1"]:focus {
  outline: none;
}

.iz-member-portal-inner {
  min-height: 100%;
  padding-bottom: 80px;
}

.iz-member-preview-hero {
  position: relative;
  min-height: 720px;
  width: 100%;
  overflow: hidden;
  border-bottom: .5px solid rgba(201, 163, 90, .22);
}

.iz-member-preview-bg {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 20px;
  filter: blur(1.4px);
  opacity: .8;
  pointer-events: none;
  user-select: none;
}

.iz-member-preview-lane {
  width: 100%;
  overflow: hidden;
}

.iz-member-preview-track {
  display: flex;
  width: max-content;
  gap: 20px;
  will-change: transform;
}

.iz-member-preview-track-1 {
  animation: izMemberMarqueeLeft 42s linear infinite;
}

.iz-member-preview-track-2 {
  animation: izMemberMarqueeRight 52s linear infinite;
}

.iz-member-preview-track-3 {
  animation: izMemberMarqueeLeft 62s linear infinite;
}

.iz-member-preview-card {
  flex: 0 0 238px;
  min-height: 112px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 8px;
  padding: 16px 18px;
  border: .5px solid rgba(201, 163, 90, .22);
  border-radius: 10px;
  background: rgba(201, 163, 90, .035);
}

.iz-member-preview-card span {
  color: rgba(244, 241, 234, .78);
  font-size: 12.5px;
}

.iz-member-preview-card strong {
  color: #e0c285;
  font-family: 'Fraunces', Georgia, serif;
  font-size: 27px;
  font-weight: 400;
  line-height: 1.05;
}

.iz-member-preview-card small {
  color: rgba(244, 241, 234, .42);
  font-family: 'JetBrains Mono', monospace;
  font-size: 9.5px;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.iz-member-preview-scrim {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(42% 46% at 50% 50%, rgba(5, 8, 15, .9) 0%, rgba(5, 8, 15, .7) 58%, rgba(5, 8, 15, .18) 100%),
    radial-gradient(130% 96% at 50% 50%, rgba(5, 8, 15, 0) 55%, rgba(5, 8, 15, .62) 100%);
}

.iz-member-preview-content {
  position: relative;
  z-index: 1;
  max-width: 720px;
  margin: 0 auto;
  padding: 126px 30px 116px;
  text-align: center;
}

.iz-member-preview-eyebrow,
.iz-members-eyebrow {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-bottom: 26px;
  color: #c9a35a;
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.iz-member-preview-eyebrow::before,
.iz-member-preview-eyebrow::after,
.iz-members-eyebrow::before {
  content: "";
  width: 34px;
  height: 1px;
  background: rgba(201, 163, 90, .35);
}

.iz-member-preview-content h1 {
  margin: 0 auto 36px;
  color: #f4f1ea;
  font-family: 'Fraunces', Georgia, serif;
  font-size: clamp(2rem, 4.2vw, 3.6rem);
  font-weight: 350;
  line-height: 1.08;
  letter-spacing: -.022em;
  text-shadow: 0 2px 26px rgba(5, 8, 15, .98), 0 1px 6px rgba(5, 8, 15, .9);
}

.iz-member-preview-content h1 em,
.iz-members-hero h1 em {
  color: #e0c285;
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-style: italic;
  font-weight: 500;
}

.iz-member-preview-content > p {
  max-width: 62ch;
  margin: 0 auto 44px;
  color: rgba(244, 241, 234, .82);
  font-size: 1.02rem;
  line-height: 1.85;
  text-shadow: 0 2px 18px rgba(5, 8, 15, .98);
}

.iz-member-preview-actions {
  display: flex;
  justify-content: center;
  gap: 14px;
  flex-wrap: wrap;
}

.iz-member-btn,
.iz-members-contact {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 14px 27px;
  border: .5px solid rgba(201, 163, 90, .35);
  border-radius: 999px;
  background: transparent;
  color: rgba(244, 241, 234, .92);
  cursor: pointer;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10.5px;
  letter-spacing: .14em;
  text-decoration: none;
  text-transform: uppercase;
  transition: background .25s, border-color .25s, color .25s, transform .25s;
}

.iz-member-btn:hover,
.iz-members-contact:hover {
  border-color: #c9a35a;
  transform: translateY(-2px);
}

.iz-member-btn-gold {
  border-color: #c9a35a;
  background: #c9a35a;
  color: #070e1c;
  font-weight: 600;
}

.iz-member-btn-gold:hover {
  background: #e0c285;
}

.iz-member-suite-link {
  margin-top: 20px;
  padding: 0 0 3px;
  border: 0;
  border-bottom: .5px solid rgba(201, 163, 90, .3);
  background: none;
  color: rgba(244, 241, 234, .5);
  cursor: pointer;
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 17px;
  font-style: italic;
  transition: color .25s, border-color .25s;
}

.iz-member-suite-link:hover {
  border-color: #c9a35a;
  color: #e0c285;
}

.iz-member-portal-details {
  width: min(1080px, calc(100% - 80px));
  margin: 0 auto;
  padding: 56px 0 20px;
}

.iz-member-section-label {
  display: flex;
  align-items: center;
  gap: 14px;
  color: #f4f1ea;
  font-family: 'Fraunces', Georgia, serif;
  font-size: 24px;
}

.iz-member-section-label i {
  flex: 1;
  height: 1px;
  background: rgba(201, 163, 90, .22);
}

.iz-member-portal-details > p {
  margin: 10px 0 24px;
  color: rgba(244, 241, 234, .6);
  font-size: 13.5px;
}

.iz-member-focus-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.iz-member-focus-grid article {
  display: flex;
  flex-direction: column;
  min-height: 250px;
  padding: 26px 24px;
  border: .5px solid rgba(201, 163, 90, .22);
  border-radius: 12px;
  background: rgba(201, 163, 90, .02);
}

.iz-member-focus-grid article > span {
  margin-bottom: 13px;
  color: #c9a35a;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.iz-member-focus-grid h2 {
  margin: 0 0 10px;
  color: #f4f1ea;
  font-family: 'Fraunces', Georgia, serif;
  font-size: 21px;
  font-weight: 400;
}

.iz-member-focus-grid p {
  flex: 1;
  color: rgba(244, 241, 234, .6);
  font-size: 13.5px;
  line-height: 1.65;
}

.iz-member-focus-grid small {
  padding-top: 14px;
  border-top: .5px solid rgba(201, 163, 90, .22);
  color: rgba(244, 241, 234, .4);
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.iz-members-wrap {
  width: min(1080px, calc(100% - 80px));
  min-height: 100%;
  margin: 0 auto;
  padding: 1px 0 84px;
}

.iz-members-hero {
  padding: 110px 0 126px;
  text-align: center;
}

.iz-members-hero h1 {
  margin: 0;
  color: #f4f1ea;
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: clamp(2.5rem, 5.8vw, 4.3rem);
  font-weight: 300;
  line-height: 1.04;
  letter-spacing: -.022em;
}

.iz-members-stage {
  padding-bottom: 20px;
}

.iz-members-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}

.iz-members-tool {
  position: relative;
  display: flex;
  min-height: 132px;
  padding: 22px 20px;
  border: .5px solid rgba(201, 163, 90, .16);
  border-radius: 12px;
  background: rgba(201, 163, 90, .03);
  opacity: 0;
  animation: izMemberToolRise 1s cubic-bezier(.2, .7, .3, 1) forwards;
}

.iz-members-grid .iz-members-tool:nth-child(1) { animation-delay: .05s; }
.iz-members-grid .iz-members-tool:nth-child(2) { animation-delay: .11s; }
.iz-members-grid .iz-members-tool:nth-child(3) { animation-delay: .17s; }
.iz-members-grid .iz-members-tool:nth-child(4) { animation-delay: .23s; }

.iz-members-lock {
  position: absolute;
  top: 18px;
  right: 18px;
  color: rgba(244, 241, 234, .34);
  font-size: 11px;
  filter: grayscale(1);
}

.iz-members-tool strong {
  display: block;
  padding-right: 22px;
  color: #f4f1ea;
  font-size: 14.5px;
  font-weight: 400;
  line-height: 1.45;
}

.iz-members-tool small {
  display: block;
  margin-top: 8px;
  color: rgba(244, 241, 234, .34);
  filter: blur(2.4px);
  font-family: 'JetBrains Mono', monospace;
  font-size: 9.5px;
  letter-spacing: .14em;
  line-height: 1.7;
  text-transform: uppercase;
  user-select: none;
}

.iz-members-centre {
  padding: 100px 0 92px;
  text-align: center;
}

.iz-members-centre h2 {
  margin: 0;
  color: #f4f1ea;
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: clamp(2.6rem, 7.4vw, 5.6rem);
  font-weight: 300;
  letter-spacing: .05em;
  line-height: 1;
  text-transform: uppercase;
}

.iz-members-centre span {
  display: block;
  margin-top: 22px;
  color: #c9a35a;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10.5px;
  letter-spacing: .3em;
  text-transform: uppercase;
}

.iz-members-foot {
  padding: 46px 0 0;
  text-align: center;
}

.iz-members-contact {
  border-radius: 0;
  color: #c9a35a;
}

@keyframes izMemberScreenIn {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes izMemberMarqueeLeft {
  from { transform: translate3d(0, 0, 0); }
  to { transform: translate3d(-50%, 0, 0); }
}

@keyframes izMemberMarqueeRight {
  from { transform: translate3d(-50%, 0, 0); }
  to { transform: translate3d(0, 0, 0); }
}

@keyframes izMemberToolRise {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: none; }
}

@media (max-width: 860px) {
  .iz-member-preview-hero { min-height: 660px; }
  .iz-member-preview-content { padding: 96px 22px 90px; }
  .iz-member-portal-details,
  .iz-members-wrap { width: min(100% - 40px, 1080px); }
  .iz-member-focus-grid { grid-template-columns: 1fr; }
  .iz-member-focus-grid article { min-height: 210px; }
  .iz-members-grid { grid-template-columns: repeat(2, 1fr); }
  .iz-members-hero { padding: 76px 0 82px; }
}

@media (max-width: 520px) {
  .iz-member-preview-actions { flex-direction: column; align-items: stretch; }
  .iz-member-btn { width: 100%; }
  .iz-member-preview-card { flex-basis: 190px; min-height: 100px; }
  .iz-members-grid { grid-template-columns: 1fr; }
  .iz-members-centre { padding: 70px 0 64px; }
  .iz-members-tool { min-height: 110px; }
}

@media (prefers-reduced-motion: reduce) {
  .iz-member-screen,
  .iz-member-preview-track,
  .iz-members-tool {
    animation: none !important;
  }

  .iz-members-tool {
    opacity: 1;
  }
}

/* Homepage narrow-screen overflow fixes. Keep single-column grid tracks
   shrinkable: the long hero kicker otherwise expands the full hero past the
   viewport even though the section itself clips horizontal overflow. */
@media (max-width: 600px) {
  .hero-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .hero-grid > * {
    min-width: 0;
  }

  .hero-kicker {
    display: flex;
    width: 100%;
  }

  .hero-stat {
    flex-direction: column;
    align-items: flex-start;
  }

  .hero-stat .pill {
    max-width: 100%;
    white-space: normal;
  }

  .final-cta-row .btn {
    width: 100%;
    padding-left: 16px;
    padding-right: 16px;
    white-space: normal;
  }
}
