:root{
    --navy:#1F2A44;
    --navy-deep:#16203A;
    --navy-ink:#0E1628;
    --paper:#F7F5F1;
    --paper-2:#FBFAF7;
    --slate:#5B7089;
    --slate-light:#9AA7BC;
    --line:#E4E0D8;
    --ink:#2A2E38;
    --muted:#5c5f68;
    /* signal system — the loud half of the palette */
    --alert:#C0392B;
    --alert-hot:#E24A32;
    --alert-soft:#FBEDEA;
    --gold:#C8942A;
    --gold-hot:#E8B33C;
    --gold-soft:#FBF3E0;
    --green:#2E7D5B;
    --maxw:1160px;
    /* One family for the entire site. Swap this single value to change every
       heading, label, number and paragraph at once. */
    --font:Arial,'Helvetica Neue',Helvetica,'Liberation Sans',sans-serif;
  }
  *{box-sizing:border-box;margin:0;padding:0;}
  html{scroll-behavior:smooth;scroll-padding-top:100px;}
  body{
    background:var(--paper);
    color:var(--ink);
    font-family:var(--font);
    -webkit-font-smoothing:antialiased;
    line-height:1.6;
    font-size:16.5px;
    overflow-x:hidden;
  }
  h1,h2,h3{font-family:var(--font);color:var(--navy);font-weight:700;line-height:1.08;letter-spacing:-.025em;}
  a{color:inherit;text-decoration:none;}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 32px;}
  ::selection{background:var(--navy);color:var(--paper);}
  .mono{font-family:var(--font);}
  .nums{font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1;}

  /* eyebrow label with the signature underline motif */
  .eyebrow{
    display:inline-block;font-family:var(--font);font-size:12px;font-weight:700;
    letter-spacing:.2em;text-transform:uppercase;color:var(--slate);
    padding-bottom:8px;position:relative;margin-bottom:22px;
  }
  .eyebrow::after{content:"";position:absolute;left:0;bottom:0;width:38px;height:2px;background:var(--slate);border-radius:1px;transform:scaleX(1);transform-origin:left;}
  .eyebrow.draw-in::after{transform:scaleX(0);transition:transform .7s cubic-bezier(.22,1,.36,1);}
  .eyebrow.draw-in.in-view::after{transform:scaleX(1);}
  .eyebrow .sec-no{color:var(--alert);font-family:var(--font);margin-right:10px;}

  /* article citation chip — the signal that everything here traces to the text */
  .cite{
    display:inline-block;font-family:var(--font);font-size:11px;font-weight:700;
    letter-spacing:.04em;color:#43536A;background:rgba(91,112,137,.09);
    border:1px solid rgba(91,112,137,.2);border-radius:5px;padding:3px 8px;white-space:nowrap;
  }
  .cite.on-dark{color:#BAC4D3;background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.15);}
  .cite.hot{color:#9B2C1D;background:var(--alert-soft);border-color:rgba(192,57,43,.28);}

  /* ---------- SCROLL PROGRESS ---------- */
  .scroll-progress{position:fixed;top:0;left:0;width:100%;height:3px;background:linear-gradient(90deg,var(--gold-hot),var(--alert));transform:scaleX(0);transform-origin:0 0;z-index:200;}

  /* ---------- ALERT BAR ---------- */
  .alertbar{
    position:relative;z-index:60;background:var(--navy-ink);color:#fff;overflow:hidden;
    border-bottom:1px solid rgba(255,255,255,.09);
  }
  .alertbar::before{
    content:"";position:absolute;inset:0;
    background:linear-gradient(100deg,transparent 20%,rgba(232,179,60,.13) 45%,transparent 70%);
    transform:translateX(-100%);animation:sheen 7s linear infinite;pointer-events:none;
  }
  @keyframes sheen{0%{transform:translateX(-100%);}55%,100%{transform:translateX(100%);}}
  .alertbar .wrap{display:flex;align-items:center;gap:16px;padding:9px 32px;flex-wrap:wrap;justify-content:center;}
  .ab-dot{width:8px;height:8px;border-radius:50%;background:var(--alert-hot);flex-shrink:0;box-shadow:0 0 0 0 rgba(226,74,50,.7);animation:pulse-dot 2s infinite;}
  @keyframes pulse-dot{0%{box-shadow:0 0 0 0 rgba(226,74,50,.65);}70%{box-shadow:0 0 0 9px rgba(226,74,50,0);}100%{box-shadow:0 0 0 0 rgba(226,74,50,0);}}
  .ab-label{font-family:var(--font);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--slate-light);}
  .ab-count{font-family:var(--font);font-size:13.5px;font-weight:700;letter-spacing:.06em;color:#fff;font-variant-numeric:tabular-nums;}
  .ab-count b{color:var(--gold-hot);font-weight:700;}
  .ab-link{font-size:12.5px;color:var(--slate-light);border-bottom:1px solid rgba(154,167,188,.45);transition:color .2s,border-color .2s;}
  .ab-link:hover{color:#fff;border-color:#fff;}

  /* ---------- HEADER ---------- */
  header{position:sticky;top:0;z-index:50;background:rgba(247,245,241,.88);backdrop-filter:saturate(140%) blur(10px);border-bottom:1px solid var(--line);}
  .nav{display:flex;align-items:center;justify-content:space-between;height:74px;}
  .logo{display:block;}
  .nav-links{display:flex;gap:26px;align-items:center;font-size:14.5px;color:var(--muted);}
  .nav-links a{transition:color .18s;position:relative;}
  .nav-links a:not(.nav-cta)::after{content:"";position:absolute;left:0;bottom:-4px;width:100%;height:1px;background:var(--navy);transform:scaleX(0);transform-origin:right;transition:transform .3s cubic-bezier(.22,1,.36,1);}
  .nav-links a:not(.nav-cta):hover::after{transform:scaleX(1);transform-origin:left;}
  .nav-links a:hover{color:var(--navy);}
  .nav-cta{font-family:var(--font);font-weight:700;font-size:14.5px;color:#fff;background:var(--alert);border:1px solid var(--alert);border-radius:999px;padding:9px 20px;transition:all .3s cubic-bezier(.22,1,.36,1);white-space:nowrap;}
  .nav-cta:hover{background:#A22F22;border-color:#A22F22;box-shadow:0 8px 22px -10px rgba(192,57,43,.7);}
  .nav-toggle{display:none;background:none;border:none;cursor:pointer;padding:6px;}
  .nav-toggle span{display:block;width:22px;height:2px;background:var(--navy);margin:5px 0;transition:.2s;}

  /* ---------- BUTTONS ---------- */
  .btn{font-family:var(--font);font-weight:700;font-size:15.5px;border-radius:999px;padding:15px 30px;transition:background .35s cubic-bezier(.22,1,.36,1),color .35s cubic-bezier(.22,1,.36,1),box-shadow .35s cubic-bezier(.22,1,.36,1),border-color .3s;cursor:pointer;display:inline-block;will-change:transform;border:1px solid transparent;text-align:center;}
  .btn-alert{background:var(--alert);color:#fff;box-shadow:0 10px 26px -12px rgba(192,57,43,.75);}
  .btn-alert:hover{background:#A22F22;box-shadow:0 16px 34px -12px rgba(192,57,43,.85);}
  .btn-primary{background:var(--navy);color:var(--paper);}
  .btn-primary:hover{background:var(--navy-deep);box-shadow:0 10px 26px -10px rgba(31,42,68,.55);}
  .btn-outline{color:var(--navy);border-color:var(--navy);}
  .btn-outline:hover{background:var(--navy);color:var(--paper);}
  .btn-outline-light{color:#fff;border-color:rgba(255,255,255,.4);}
  .btn-outline-light:hover{background:#fff;color:var(--navy);}
  .btn-ghost{color:var(--navy);font-weight:500;}
  .btn-ghost:hover{color:var(--alert);}
  .btn-ghost .arrow{transition:transform .35s cubic-bezier(.22,1,.36,1);display:inline-block;}
  .btn-ghost:hover .arrow{transform:translateX(4px);}

  /* ---------- HERO ---------- */
  .hero{position:relative;overflow:hidden;padding:48px 0 84px;}
  .hero-canvas{position:absolute;inset:0;z-index:0;width:100%;height:100%;display:block;}
  .hero-fade{position:absolute;inset:0;z-index:0;background:linear-gradient(90deg,var(--paper) 0%,var(--paper) 30%,rgba(247,245,241,.6) 48%,transparent 66%);pointer-events:none;}
  .hero .wrap{position:relative;z-index:1;}
  .hero-badge{
    display:inline-flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);
    border-radius:999px;padding:7px 16px 7px 10px;margin-bottom:20px;
    box-shadow:0 6px 18px -12px rgba(31,42,68,.4);
  }
  .hero-badge .hb-tag{font-family:var(--font);font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;background:var(--alert);color:#fff;border-radius:999px;padding:3px 9px;}
  .hero-badge .hb-txt{font-size:13px;color:var(--muted);letter-spacing:.01em;}
  .hero-badge .hb-txt strong{color:var(--navy);font-weight:700;}
  .hero h1{font-size:clamp(37px,5.2vw,68px);max-width:19ch;margin-bottom:20px;font-weight:700;}
  .hero h1 .word{display:inline-block;will-change:transform,filter,opacity;}
  .hero h1 em{font-style:italic;color:var(--slate);}
  /* the marker swipe — the one deliberately loud typographic move */
  .mark{position:relative;display:inline-block;color:var(--navy);z-index:0;white-space:nowrap;}
  .mark::before{
    /* Arial sits lower on the em box than the old serif did, so the highlight
       needs lifting to read as a marker stroke through the word rather than an
       underline hanging off its descenders. */
    content:"";position:absolute;left:-.07em;right:-.07em;bottom:.09em;height:.34em;z-index:-1;
    background:linear-gradient(90deg,rgba(232,179,60,.85),rgba(232,179,60,.45));border-radius:3px;
    transform:scaleX(0);transform-origin:left;
  }
  .mark.swiped::before{transform:scaleX(1);transition:transform .8s cubic-bezier(.22,1,.36,1) .35s;}
  .no-anim .mark::before{transform:scaleX(1);}
  .hero .sub{font-size:clamp(16.5px,1.6vw,19.5px);color:var(--muted);max-width:56ch;margin-bottom:28px;}
  .hero .sub strong{color:var(--navy);font-weight:700;}
  .hero-actions{display:flex;gap:16px;flex-wrap:wrap;align-items:center;}
  .hero-microcopy{font-size:13px;color:var(--muted);margin-top:14px;}
  .hero-microcopy b{color:var(--navy);font-weight:700;}

  /* ---------- COUNTDOWN ---------- */
  .countdown{
    margin-top:32px;background:var(--navy);border-radius:18px;padding:24px 30px;color:#fff;
    display:flex;align-items:center;gap:34px;flex-wrap:wrap;position:relative;overflow:hidden;
    box-shadow:0 26px 56px -30px rgba(14,22,40,.85);
  }
  .countdown::after{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,var(--alert-hot),var(--gold-hot));}
  .cd-label{flex:1 1 230px;min-width:200px;}
  .cd-label .k{font-family:var(--font);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-hot);display:block;margin-bottom:7px;}
  .cd-label .v{font-family:var(--font);font-size:20px;color:#fff;line-height:1.25;display:block;}
  .cd-label .n{font-size:12.5px;color:var(--slate-light);display:block;margin-top:7px;}
  .cd-clock{display:flex;gap:10px;flex-wrap:wrap;}
  .cd-unit{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.11);border-radius:11px;padding:12px 6px 10px;min-width:80px;text-align:center;}
  .cd-unit .num{font-family:var(--font);font-size:clamp(26px,3.6vw,34px);font-weight:700;color:#fff;line-height:1;font-variant-numeric:tabular-nums;display:block;}
  .cd-unit .u{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--slate-light);margin-top:8px;display:block;}
  .cd-unit.days{background:rgba(226,74,50,.16);border-color:rgba(226,74,50,.45);}
  .cd-unit.days .num{color:#FF8A70;}
  .cd-live{display:none;}
  .countdown.is-live .cd-clock{display:none;}
  .countdown.is-live .cd-live{display:block;}

  /* ---------- HERO META ---------- */
  .hero-meta{margin-top:38px;display:flex;gap:40px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:26px;}
  .hero-meta .item{max-width:230px;position:relative;padding-left:16px;}
  .hero-meta .item::before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:2px;background:var(--slate-light);border-radius:1px;}
  .hero-meta .item.hot::before{background:var(--alert);}
  .hero-meta .k{font-family:var(--font);font-weight:700;font-size:clamp(24px,3vw,32px);color:var(--navy);display:block;margin-bottom:4px;letter-spacing:-.01em;}
  .hero-meta .item.hot .k{color:var(--alert);}
  .hero-meta .v{font-size:13.5px;color:var(--muted);}

  /* ---------- DEADLINE STRIP ---------- */
  .strip{background:var(--navy);color:var(--paper);}
  .strip .wrap{display:flex;align-items:center;gap:20px;padding:24px 32px;flex-wrap:wrap;}
  .strip .pulse{width:15px;height:15px;border-radius:50%;background:var(--alert-hot);box-shadow:0 0 0 0 rgba(226,74,50,.6);animation:pulse 2.4s infinite;flex-shrink:0;}
  @keyframes pulse{0%{box-shadow:0 0 0 0 rgba(226,74,50,.55);}70%{box-shadow:0 0 0 18px rgba(226,74,50,0);}100%{box-shadow:0 0 0 0 rgba(226,74,50,0);}}
  .strip p{font-size:15px;color:#E9EAEE;flex:1 1 380px;}
  .strip strong{color:#fff;font-weight:700;}

  /* ---------- MARQUEE DIVIDER ---------- */
  .marquee{position:relative;overflow:hidden;background:var(--navy-deep);padding:14px 0;border-top:1px solid rgba(255,255,255,.07);border-bottom:1px solid rgba(255,255,255,.07);}
  .marquee-track{display:flex;width:max-content;animation:marquee-scroll 46s linear infinite;}
  .marquee-track .m-item{display:inline-flex;align-items:center;font-family:var(--font);font-weight:500;font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--slate-light);white-space:nowrap;padding:0 20px;}
  .marquee-track .m-item::after{content:"◆";color:var(--gold);font-size:7px;margin-left:20px;opacity:.85;}
  @keyframes marquee-scroll{from{transform:translateX(0);}to{transform:translateX(-50%);}}
  @media (prefers-reduced-motion:reduce){.marquee-track{animation:none;}}

  /* ---------- SECTION SHELL ---------- */
  section{padding:104px 0;}
  .sec-head{max-width:62ch;margin-bottom:56px;}
  .sec-head.center{margin-left:auto;margin-right:auto;text-align:center;}
  .sec-head h2{font-size:clamp(30px,4.4vw,50px);margin-bottom:18px;font-weight:700;}
  .sec-head p{color:var(--muted);font-size:17.5px;}
  .mask{overflow:hidden;display:block;padding-bottom:.2em;margin-bottom:-.2em;}
  .mask-inner{display:inline-block;will-change:transform;}

  /* ---------- STAKES (consequences) ----------
     This is the one section allowed to feel hostile. Near-black rather than
     navy, hazard banding top and bottom, and a red that only ever appears
     here and on the countdown — so the colour itself starts to mean "deadline". */
  #stakes{background:var(--navy-ink);color:var(--paper);position:relative;overflow:hidden;padding:112px 0 104px;}
  #stakes::before{
    content:"";position:absolute;inset:0;pointer-events:none;
    background:
      radial-gradient(1000px 480px at 8% -12%,rgba(192,57,43,.34),transparent 62%),
      radial-gradient(760px 430px at 96% 112%,rgba(192,57,43,.20),transparent 62%),
      radial-gradient(600px 600px at 50% 50%,transparent 40%,rgba(0,0,0,.5) 100%);
  }
  /* faint scanline grid — reads as "monitored" rather than decorative */
  #stakes::after{
    content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
    background-image:repeating-linear-gradient(0deg,rgba(255,255,255,.028) 0 1px,transparent 1px 4px);
  }
  #stakes .wrap{position:relative;z-index:2;}
  #stakes .eyebrow{color:#FF8A70;}
  #stakes .eyebrow::after{background:var(--alert-hot);width:100%;}
  #stakes .eyebrow .sec-no{color:var(--alert-hot);}
  #stakes h2{color:#fff;font-size:clamp(32px,5vw,58px);letter-spacing:-.02em;}
  #stakes .sec-head{position:relative;}
  #stakes .sec-head p{color:#AFB8C6;}

  /* hazard banding at the section edges */
  .hazard-band{
    position:absolute;left:0;right:0;height:10px;z-index:1;opacity:.55;
    background:repeating-linear-gradient(45deg,var(--alert) 0 12px,transparent 12px 24px);
  }
  .hazard-band.top{top:0;}
  .hazard-band.bottom{bottom:0;}

  /* the stamp — deliberately the loudest object on the page */
  .stamp{
    position:absolute;right:32px;top:4px;transform:rotate(-9deg);z-index:3;
    border:3px solid rgba(226,74,50,.62);border-radius:8px;padding:12px 20px 10px;
    text-align:center;pointer-events:none;
    box-shadow:inset 0 0 0 2px rgba(226,74,50,.28);
  }
  .stamp span{
    display:block;font-family:var(--font);font-size:clamp(19px,2.4vw,27px);font-weight:700;
    letter-spacing:.1em;text-transform:uppercase;color:rgba(255,120,95,.72);line-height:1;
  }
  .stamp small{
    display:block;margin-top:7px;font-family:var(--font);font-size:10px;letter-spacing:.14em;
    text-transform:uppercase;color:rgba(255,120,95,.5);
  }

  .stakes-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;}
  .stake{
    background:linear-gradient(160deg,rgba(255,255,255,.055),rgba(255,255,255,.02));
    border:1px solid rgba(255,255,255,.09);border-radius:14px;
    padding:30px 30px 28px 34px;position:relative;overflow:hidden;
    transition:border-color .35s,background .35s,transform .4s cubic-bezier(.22,1,.36,1),box-shadow .4s;
  }
  /* red rule down the left edge — grows on hover, like a level rising */
  .stake::before{
    content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--alert);
    transform:scaleY(.18);transform-origin:top;transition:transform .5s cubic-bezier(.22,1,.36,1);
  }
  /* ghosted index number */
  .stake::after{
    content:attr(data-idx);position:absolute;right:14px;bottom:-18px;
    font-family:var(--font);font-weight:700;font-size:104px;line-height:1;
    color:#fff;opacity:.045;pointer-events:none;
  }
  .stake:hover{
    border-color:rgba(226,74,50,.55);background:linear-gradient(160deg,rgba(226,74,50,.1),rgba(255,255,255,.02));
    transform:translateY(-4px);box-shadow:0 24px 50px -26px rgba(226,74,50,.75),inset 0 0 40px -20px rgba(226,74,50,.5);
  }
  .stake:hover::before{transform:scaleY(1);}
  .stake .st-top{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:18px;}
  .stake .st-ico{width:32px;height:32px;flex-shrink:0;}
  .stake h3{
    color:#fff;font-family:var(--font);font-size:clamp(22px,2.6vw,28px);font-weight:700;
    letter-spacing:-.015em;margin-bottom:12px;
  }
  .stake p{font-size:14.5px;color:#B4BDCB;position:relative;z-index:1;}
  .stake p strong{color:#fff;font-weight:700;}

  /* the 10-day alarm bar */
  .stakes-note{
    margin-top:16px;background:linear-gradient(100deg,rgba(192,57,43,.26),rgba(192,57,43,.1));
    border:1px solid rgba(226,74,50,.5);border-radius:14px;
    padding:28px 32px 28px 40px;display:flex;gap:24px;align-items:center;flex-wrap:wrap;
    position:relative;overflow:hidden;
  }
  .stakes-note::before{
    content:"";position:absolute;left:0;top:0;bottom:0;width:12px;
    background:repeating-linear-gradient(45deg,var(--alert-hot) 0 8px,transparent 8px 16px);opacity:.75;
  }
  .stakes-note .sn-k{
    font-family:var(--font);font-size:clamp(30px,4.4vw,42px);color:#FF8A70;line-height:1;
    font-weight:700;flex-shrink:0;letter-spacing:-.02em;
  }
  .stakes-note .sn-v{font-size:15px;color:#E4E8EF;flex:1 1 340px;}
  .stakes-note .sn-v strong{color:#fff;font-weight:700;}

  /* ---------- TIMELINE ---------- */
  #timeline{background:var(--paper-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden;}
  .tl-axis-wrap{position:relative;margin-bottom:14px;padding:56px 0 62px;}
  .tl-axis{position:relative;height:4px;background:var(--line);border-radius:2px;}
  .tl-axis-fill{position:absolute;left:0;top:0;bottom:0;width:0;background:linear-gradient(90deg,var(--slate),var(--alert));border-radius:2px;}
  .tl-tick{position:absolute;top:50%;transform:translate(-50%,-50%);cursor:pointer;background:none;border:none;padding:0;z-index:2;}
  .tl-tick .dot{
    display:block;width:15px;height:15px;border-radius:50%;background:#fff;border:3px solid var(--slate-light);
    transition:transform .3s cubic-bezier(.22,1,.36,1),border-color .3s,box-shadow .3s;
  }
  .tl-tick:hover .dot,.tl-tick.active .dot{transform:scale(1.32);border-color:var(--navy);box-shadow:0 0 0 6px rgba(31,42,68,.08);}
  .tl-tick.past .dot{background:var(--slate);border-color:var(--slate);}
  .tl-tick.next .dot{border-color:var(--alert);background:var(--alert);box-shadow:0 0 0 0 rgba(192,57,43,.5);animation:pulse-tick 2.2s infinite;}
  @keyframes pulse-tick{0%{box-shadow:0 0 0 0 rgba(192,57,43,.5);}70%{box-shadow:0 0 0 14px rgba(192,57,43,0);}100%{box-shadow:0 0 0 0 rgba(192,57,43,0);}}
  .tl-tick .lab{
    position:absolute;left:50%;transform:translateX(-50%);white-space:nowrap;
    font-family:var(--font);font-size:11px;font-weight:700;letter-spacing:.06em;color:#48596E;
    transition:color .25s;
  }
  .tl-tick:nth-child(odd) .lab{bottom:26px;}
  .tl-tick:nth-child(even) .lab{top:26px;}
  .tl-tick:hover .lab,.tl-tick.active .lab{color:var(--navy);}
  .tl-tick.next .lab{color:#A32C20;}
  .tl-now{position:absolute;top:50%;transform:translate(-50%,-50%);z-index:3;pointer-events:none;}
  .tl-now .bar{display:block;width:2px;height:44px;background:var(--navy);border-radius:1px;margin:0 auto;}
  .tl-now .tag{
    position:absolute;left:50%;transform:translateX(-50%);top:-42px;
    font-family:var(--font);font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
    background:var(--navy);color:#fff;border-radius:5px;padding:4px 9px;white-space:nowrap;
  }
  .tl-now .tag::after{content:"";position:absolute;left:50%;bottom:-4px;transform:translateX(-50%) rotate(45deg);width:8px;height:8px;background:var(--navy);}

  .tl-rail{
    display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 4px 26px;
    scrollbar-width:thin;scrollbar-color:var(--slate-light) transparent;
  }
  .tl-rail::-webkit-scrollbar{height:6px;}
  .tl-rail::-webkit-scrollbar-thumb{background:var(--slate-light);border-radius:3px;}
  .tl-rail::-webkit-scrollbar-track{background:rgba(91,112,137,.1);border-radius:3px;}
  .tl-card{
    scroll-snap-align:center;flex:0 0 min(400px,86vw);background:#fff;border:1px solid var(--line);
    border-radius:16px;padding:28px 26px 24px;display:flex;flex-direction:column;position:relative;overflow:hidden;
    transition:box-shadow .4s cubic-bezier(.22,1,.36,1),border-color .3s,transform .4s cubic-bezier(.22,1,.36,1);
  }
  .tl-card:hover{box-shadow:0 20px 44px -22px rgba(31,42,68,.4);transform:translateY(-3px);}
  .tl-card::before{content:"";position:absolute;left:0;top:0;right:0;height:4px;background:var(--slate-light);}
  .tl-card.past::before{background:var(--slate);}
  .tl-card.next{border-color:rgba(192,57,43,.45);box-shadow:0 20px 48px -24px rgba(192,57,43,.55);}
  .tl-card.next::before{background:linear-gradient(90deg,var(--alert),var(--gold-hot));}
  .tl-status{
    display:inline-flex;align-items:center;gap:7px;align-self:flex-start;
    font-family:var(--font);font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
    border-radius:999px;padding:4px 11px;margin-bottom:16px;
    background:rgba(91,112,137,.1);color:#43536A;border:1px solid rgba(91,112,137,.22);
  }
  .tl-status.past{background:rgba(46,125,91,.1);color:#22694A;border-color:rgba(46,125,91,.28);}
  .tl-status.next{background:var(--alert-soft);color:#9B2C1D;border-color:rgba(192,57,43,.3);}
  .tl-status .sdot{width:6px;height:6px;border-radius:50%;background:currentColor;}
  .tl-date{font-family:var(--font);font-size:15px;color:var(--alert);letter-spacing:.02em;margin-bottom:6px;font-weight:700;}
  .tl-card.past .tl-date{color:var(--slate);}
  .tl-card h3{font-size:23px;margin-bottom:12px;font-weight:700;}
  .tl-card > p{font-size:14.5px;color:var(--muted);margin-bottom:18px;}
  .tl-list{list-style:none;margin-bottom:18px;flex-grow:1;}
  .tl-list li{font-size:14px;color:var(--ink);padding:9px 0;border-top:1px dashed var(--line);display:flex;gap:11px;align-items:flex-start;}
  .tl-list li:first-child{border-top:none;padding-top:0;}
  .tl-list li .cite{margin-top:1px;flex-shrink:0;}
  .tl-foot{border-top:1px solid var(--line);padding-top:14px;font-size:12.5px;color:var(--slate);font-family:var(--font);letter-spacing:.02em;}
  .tl-hint{display:flex;align-items:center;gap:10px;font-size:12.5px;color:var(--slate);font-family:var(--font);letter-spacing:.08em;text-transform:uppercase;margin-top:4px;}
  .tl-hint svg{flex-shrink:0;}

  /* ---------- EDGE (what most companies don't know) ---------- */
  #edge{background:var(--paper);}
  .edge-list{border-top:1px solid var(--line);}
  .edge-item{border-bottom:1px solid var(--line);}
  .edge-q{
    width:100%;background:none;border:none;cursor:pointer;text-align:left;font:inherit;color:inherit;
    display:flex;align-items:flex-start;gap:20px;padding:26px 4px;transition:color .25s;
  }
  .edge-q:hover{color:var(--alert);}
  .edge-n{font-family:var(--font);font-size:12px;font-weight:700;color:var(--alert);letter-spacing:.06em;padding-top:8px;flex-shrink:0;width:34px;}
  .edge-t{font-family:var(--font);font-size:clamp(19px,2.3vw,26px);font-weight:700;color:inherit;line-height:1.28;flex-grow:1;letter-spacing:-.01em;}
  .edge-plus{position:relative;width:20px;height:20px;flex-shrink:0;margin-top:8px;}
  .edge-plus::before,.edge-plus::after{content:"";position:absolute;background:var(--slate);border-radius:1px;transition:transform .35s cubic-bezier(.22,1,.36,1),background .25s;}
  .edge-plus::before{left:0;right:0;top:9px;height:2px;}
  .edge-plus::after{top:0;bottom:0;left:9px;width:2px;}
  .edge-item.open .edge-plus::after{transform:rotate(90deg);}
  .edge-item.open .edge-plus::before,.edge-item.open .edge-plus::after{background:var(--alert);}
  .edge-a{max-height:0;overflow:hidden;transition:max-height .45s cubic-bezier(.22,1,.36,1);}
  .edge-a-inner{padding:0 4px 28px 54px;max-width:78ch;}
  .edge-a-inner p{font-size:15.5px;color:var(--muted);margin-bottom:14px;}
  .edge-a-inner p strong{color:var(--navy);font-weight:700;}
  .edge-a-inner .refs{display:flex;gap:8px;flex-wrap:wrap;}

  /* ---------- EXPOSURE TEST ---------- */
  #test{background:var(--navy);color:var(--paper);position:relative;overflow:hidden;}
  #test::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(760px 420px at 78% 8%,rgba(200,148,42,.16),transparent 62%);}
  #test .wrap{position:relative;z-index:1;}
  #test .eyebrow{color:var(--slate-light);}
  #test .eyebrow::after{background:var(--gold);}
  #test .eyebrow .sec-no{color:var(--gold-hot);}
  #test h2{color:#fff;}
  #test .sec-head p{color:#C3CAD6;}
  .quiz{background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.12);border-radius:20px;padding:34px 36px;max-width:860px;margin:0 auto;}
  .q-row{display:flex;align-items:flex-start;justify-content:space-between;gap:22px;padding:19px 0;border-top:1px solid rgba(255,255,255,.09);flex-wrap:wrap;}
  .q-row:first-of-type{border-top:none;padding-top:0;}
  .q-txt{flex:1 1 380px;font-size:15.5px;color:#E4E8EF;display:flex;gap:13px;align-items:flex-start;}
  .q-txt .qn{font-family:var(--font);font-size:12px;color:var(--gold-hot);flex-shrink:0;padding-top:3px;}
  .q-opts{display:flex;gap:8px;flex-shrink:0;}
  .q-opts button{
    font-family:var(--font);font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
    background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.18);color:#BAC4D3;
    border-radius:999px;padding:8px 18px;cursor:pointer;transition:all .25s;
  }
  .q-opts button:hover{border-color:rgba(255,255,255,.5);color:#fff;}
  .q-opts button.sel{background:#fff;color:var(--navy);border-color:#fff;}
  .q-opts button.sel[data-v="risk"]{background:var(--alert-hot);border-color:var(--alert-hot);color:#fff;}
  .quiz-foot{margin-top:26px;padding-top:24px;border-top:1px solid rgba(255,255,255,.12);}
  .quiz-meter{height:8px;border-radius:4px;background:rgba(255,255,255,.1);overflow:hidden;margin-bottom:18px;}
  .quiz-meter i{display:block;height:100%;width:0;border-radius:4px;background:linear-gradient(90deg,var(--green),var(--gold-hot),var(--alert-hot));transition:width .6s cubic-bezier(.22,1,.36,1);}
  .quiz-result{display:flex;align-items:center;gap:20px;flex-wrap:wrap;}
  .qr-band{font-family:var(--font);font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;border-radius:999px;padding:7px 15px;border:1px solid rgba(255,255,255,.25);color:var(--slate-light);white-space:nowrap;}
  .qr-band.b1{background:rgba(46,125,91,.18);border-color:rgba(46,125,91,.5);color:#7FD3AC;}
  .qr-band.b2{background:rgba(200,148,42,.18);border-color:rgba(200,148,42,.5);color:var(--gold-hot);}
  .qr-band.b3{background:rgba(226,74,50,.2);border-color:rgba(226,74,50,.55);color:#FF8A70;}
  .qr-txt{flex:1 1 320px;font-size:15px;color:#D3D8E1;}
  .qr-txt strong{color:#fff;font-weight:700;}
  .quiz-cta{margin-top:22px;display:flex;gap:14px;align-items:center;flex-wrap:wrap;}
  .quiz-note{font-size:12.5px;color:var(--slate-light);}

  /* ---------- SERVICES ---------- */
  #services{background:var(--paper-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
  .cards{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;perspective:1400px;}
  .card{position:relative;background:#fff;border:1px solid var(--line);border-radius:16px;padding:34px 30px;display:flex;flex-direction:column;overflow:hidden;transform-style:preserve-3d;will-change:transform;transition:box-shadow .4s cubic-bezier(.22,1,.36,1),border-color .3s;}
  .card:hover{box-shadow:0 18px 40px -18px rgba(31,42,68,.3);}
  .card.urgent{border-color:rgba(192,57,43,.35);}
  .card::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at var(--mx,50%) var(--my,50%),rgba(200,148,42,.16),transparent 60%);opacity:0;transition:opacity .4s;pointer-events:none;}
  .card:hover::before,.card.touch-active::before{opacity:1;}
  .card::after{content:attr(data-num);position:absolute;right:6px;bottom:-30px;font-family:var(--font);font-weight:700;font-size:120px;line-height:1;color:var(--slate);opacity:.06;pointer-events:none;z-index:0;}
  .card > *{position:relative;z-index:1;}
  .card-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px;padding-bottom:10px;border-bottom:1px solid var(--line);}
  .card .num{font-family:var(--font);font-size:14px;color:var(--slate);}
  .tag{font-family:var(--font);font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;border-radius:999px;padding:4px 10px;white-space:nowrap;}
  .tag.hot{background:var(--alert-soft);color:#9B2C1D;border:1px solid rgba(192,57,43,.3);}
  .tag.warm{background:var(--gold-soft);color:#8A6414;border:1px solid rgba(200,148,42,.35);}
  .tag.cool{background:rgba(91,112,137,.1);color:var(--slate);border:1px solid rgba(91,112,137,.24);}
  .card h3{font-size:22px;margin-bottom:12px;font-weight:700;}
  .card p{font-size:15px;color:var(--muted);margin-bottom:18px;flex-grow:1;}
  .card .deliv{font-size:13.5px;color:var(--navy);border-top:1px dashed var(--line);padding-top:14px;}
  .card .deliv span{color:var(--slate);font-weight:700;text-transform:uppercase;letter-spacing:.08em;font-size:11px;display:block;margin-bottom:6px;}
  .retainer{margin-top:22px;background:var(--navy);color:var(--paper);border-radius:16px;padding:32px 34px;display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;}
  .retainer h3{color:#fff;font-size:21px;margin-bottom:6px;font-weight:700;}
  .retainer p{color:var(--slate-light);font-size:14.5px;max-width:52ch;}
  .founding{margin-top:22px;background:linear-gradient(100deg,#fff 0%,var(--gold-soft) 100%);border:1px solid rgba(200,148,42,.4);border-radius:16px;padding:28px 32px;display:flex;align-items:center;gap:26px;}
  .founding-mark{flex-shrink:0;opacity:.95;}
  .fm-bar{transform-box:fill-box;transform-origin:50% 100%;}
  .founding-body h3{font-size:18px;margin-bottom:6px;font-weight:700;}
  .founding-body p{font-size:14.5px;color:var(--muted);max-width:64ch;}
  .founding-body .tag{display:inline-block;margin-bottom:9px;}

  /* ---------- APPROACH ---------- */
  .steps-wrap{position:relative;}
  .steps-progress{position:absolute;top:0;left:0;height:2px;width:0%;background:var(--alert);z-index:2;}
  .steps{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:#fff;}
  .step{position:relative;padding:32px 26px;border-right:1px solid var(--line);overflow:hidden;transition:background .3s,transform .4s cubic-bezier(.22,1,.36,1),box-shadow .4s cubic-bezier(.22,1,.36,1);will-change:transform;}
  .step:hover,.step.touch-active{background:var(--paper-2);transform:translateY(-3px);box-shadow:0 10px 22px -14px rgba(31,42,68,.35);z-index:3;}
  .step:last-child{border-right:none;}
  .step::after{content:attr(data-num);position:absolute;right:-4px;bottom:-22px;font-family:var(--font);font-size:72px;color:var(--slate);opacity:.06;pointer-events:none;}
  .step .s-n{position:relative;z-index:1;font-family:var(--font);font-size:13px;color:var(--alert);display:inline-block;padding-bottom:6px;border-bottom:2px solid var(--alert);margin-bottom:16px;font-weight:700;}
  .step h3{position:relative;z-index:1;font-size:17px;margin-bottom:8px;font-weight:700;}
  .step p{position:relative;z-index:1;font-size:14px;color:var(--muted);}
  .steps-after{margin-top:20px;font-size:14px;color:var(--muted);display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
  .steps-after b{color:var(--navy);font-weight:700;}

  /* ---------- ABOUT ---------- */
  #about{background:var(--navy);color:var(--paper);position:relative;overflow:hidden;}
  #about .eyebrow{color:var(--slate-light);}
  #about .eyebrow::after{background:var(--slate-light);}
  #about .eyebrow .sec-no{color:var(--gold-hot);}
  #about h2{color:#fff;font-size:clamp(30px,4.4vw,50px);margin-bottom:26px;max-width:20ch;font-weight:700;}
  .about-grid{display:grid;grid-template-columns:0.8fr 1.2fr;gap:52px;align-items:start;}
  .about-photo{position:relative;will-change:clip-path;}
  .about-photo img{width:100%;border-radius:16px;display:block;filter:saturate(.97) contrast(1.02);box-shadow:0 20px 44px -24px rgba(0,0,0,.5);}
  .about-photo .cap{margin-top:14px;font-size:12.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--slate-light);}
  .about-body p{color:#D9DCE3;font-size:16.5px;margin-bottom:18px;max-width:58ch;}
  .about-body p strong{color:#fff;font-weight:700;}
  .about-facts{position:relative;margin-top:30px;padding-top:24px;}
  .about-facts::before{content:"";position:absolute;left:0;top:0;right:0;height:1px;background:var(--slate);opacity:.4;transform:scaleX(0);transform-origin:left;transition:transform .9s cubic-bezier(.22,1,.36,1);}
  .about-facts.in-view::before{transform:scaleX(1);}
  .about-facts .row{margin-bottom:20px;}
  .about-facts .row:last-child{margin-bottom:0;}
  .about-facts .r-k{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--slate-light);margin-bottom:5px;}
  .about-facts .r-v{font-size:15.5px;color:#fff;}

  /* ---------- CONTACT ---------- */
  #contact{text-align:center;padding-bottom:64px;}
  #contact .eyebrow{display:inline-block;}
  #contact h2{font-size:clamp(32px,5vw,56px);margin-bottom:20px;font-weight:700;}
  #contact > .wrap > p{color:var(--muted);font-size:18px;max-width:50ch;margin:0 auto 30px;}
  .contact-clock{
    display:inline-flex;align-items:center;gap:12px;background:#fff;border:1px solid rgba(192,57,43,.3);
    border-radius:999px;padding:9px 20px;margin-bottom:30px;
    font-family:var(--font);font-size:13px;color:#9B2C1D;font-variant-numeric:tabular-nums;letter-spacing:.03em;
  }
  .contact-clock .dot{width:7px;height:7px;border-radius:50%;background:var(--alert);animation:pulse-dot 2s infinite;}
  .contact-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-bottom:34px;}
  .contact-mail{font-family:var(--font);font-size:clamp(22px,3.2vw,32px);color:var(--navy);border-bottom:2px solid var(--gold);padding-bottom:4px;transition:color .2s,border-color .2s;font-weight:700;}
  .contact-mail:hover{color:var(--alert);border-color:var(--alert);}
  .contact-phone{margin-top:16px;font-size:17px;color:var(--muted);}
  .contact-phone a{color:var(--navy);transition:color .2s;}
  .contact-phone a:hover{color:var(--alert);}
  .contact-note{margin-top:20px;font-size:14px;color:var(--muted);}

  /* ---------- FOOTER ---------- */
  footer{background:var(--navy-deep);color:var(--slate-light);padding:38px 0 28px;border-top:1px solid rgba(255,255,255,.08);}
  footer .wrap{max-width:900px;}
  .foot-grid{display:flex;justify-content:space-between;align-items:center;gap:30px;flex-wrap:wrap;}
  .foot-tag{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--slate-light);margin-top:14px;}
  .foot-meta{font-size:13px;color:var(--slate-light);text-align:right;line-height:1.9;}
  .foot-meta a:hover{color:#fff;}
  .foot-legal{max-width:900px;margin:30px auto 0;padding:22px 32px 0;border-top:1px solid rgba(255,255,255,.09);font-size:11.5px;line-height:1.75;color:#7C8AA0;}

  /* ---------- RESPONSIVE ---------- */
  /* Four links plus a CTA fits every desktop width, so nothing needs to be
     shed — just tighten the gap before the hamburger takes over at 640px. */
  @media (max-width:860px){
    .nav-links{gap:18px;font-size:13.5px;}
  }
  /* The hamburger used to take over at 640px, but the logo plus four links
     plus the CTA needs about 780px — so between 641 and ~760 the nav ran off
     the right edge of the screen. Collapse to the menu at 820 instead, which
     is comfortably wider than the point where the bar stops fitting. */
  @media (max-width:820px){
    .nav-links{
      display:none;position:absolute;top:74px;left:0;right:0;background:var(--paper);
      flex-direction:column;gap:0;padding:8px 0;border-bottom:1px solid var(--line);
      box-shadow:0 18px 30px -22px rgba(31,42,68,.5);
    }
    .nav-links.open{display:flex;}
    .nav-links a{padding:13px 28px;width:100%;}
    .nav-links a:not(.nav-cta)::after{display:none;}
    .nav-links a.active{color:var(--alert);}
    .nav-cta{margin:10px 28px;text-align:center;}
    .nav-toggle{display:block;}
  }

  /* ---------- LINKEDIN ---------- */
  .li-link{
    display:inline-flex;align-items:center;gap:9px;font-size:14px;font-weight:700;
    border:1px solid var(--line);border-radius:999px;padding:9px 18px 9px 15px;color:var(--navy);
    background:#fff;transition:background .25s,color .25s,border-color .25s,box-shadow .25s;
  }
  .li-link svg{width:17px;height:17px;flex-shrink:0;fill:currentColor;}
  .li-link:hover{background:#0A66C2;border-color:#0A66C2;color:#fff;box-shadow:0 10px 24px -12px rgba(10,102,194,.8);}
  .li-link.on-dark{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.18);color:var(--slate-light);}
  .li-link.on-dark:hover{background:#0A66C2;border-color:#0A66C2;color:#fff;}
  .contact-social{margin-top:22px;}
  .foot-social{margin-top:16px;}
  @media (max-width:860px){
    .logo svg{width:175px;height:47px;}
    .hero{padding:80px 0 76px;}
    .cards{grid-template-columns:1fr;}
    .stakes-grid{grid-template-columns:1fr;}
    .steps{grid-template-columns:1fr 1fr;}
    .step:nth-child(2){border-right:none;}
    .step:nth-child(1),.step:nth-child(2){border-bottom:1px solid var(--line);}
    .about-grid{grid-template-columns:1fr;gap:34px;}
    .about-photo{max-width:340px;}
    .quiz{padding:28px 24px;}
    .tl-tick .lab{font-size:10px;}
  }
  @media (max-width:640px){
    html{scroll-padding-top:92px;}
    .nav-links{display:none;position:absolute;top:74px;left:0;right:0;background:var(--paper);flex-direction:column;gap:0;padding:8px 0;border-bottom:1px solid var(--line);}
    .nav-links.open{display:flex;}
    .nav-links a{padding:13px 28px;width:100%;}
    .nav-cta{margin:10px 28px;text-align:center;}
    .nav-toggle{display:block;}
    .alertbar .wrap{padding:8px 20px;gap:10px;}
    .ab-label{font-size:10px;letter-spacing:.1em;}
    .ab-count{font-size:12px;}
    .ab-link{display:none;}
    .steps{grid-template-columns:1fr;}
    .step{border-right:none;border-bottom:1px solid var(--line);}
    .step:last-child{border-bottom:none;}
    .hero-meta{gap:26px;}
    .hero h1{max-width:none;}
    .card::after{font-size:80px;}
    section{padding:70px 0;}
    .countdown{padding:22px 20px;gap:22px;}
    .cd-unit{min-width:66px;padding:10px 4px 8px;}
    .marquee-track .m-item{font-size:11px;padding:0 14px;}
    .hero-fade{background:linear-gradient(180deg,rgba(247,245,241,.5) 0%,rgba(247,245,241,.15) 30%,transparent 55%);}
    .tl-axis-wrap{padding:52px 0 58px;}
    .tl-tick .lab{font-size:9px;}
    .edge-a-inner{padding-left:0;}
    .stake{padding:24px 22px;}
    .q-opts{width:100%;}
    .q-opts button{flex:1;}
    footer{padding:44px 0 36px;}
    .foot-grid{flex-direction:column;align-items:center;text-align:center;gap:0;}
    .foot-brand{width:100%;max-width:200px;padding-bottom:26px;margin-bottom:26px;border-bottom:1px solid rgba(255,255,255,.1);}
    .foot-brand svg{width:150px;height:40px;}
    .foot-tag{margin-top:12px;font-size:11px;}
    .foot-meta{text-align:center;line-height:1.75;}
    .foot-legal{text-align:center;padding:22px 20px 0;}
  }
  @media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important;}}

  /* ---------- ANIMATION (additive — see anti-FOUC note) ---------- */
  .anim-init .hero h1,.anim-init .hero .sub,.anim-init .hero-actions .btn,.anim-init .hero-meta .item,.anim-init .countdown{opacity:0;}
  @media (prefers-reduced-motion:reduce){
    .anim-init .hero h1,.anim-init .hero .sub,.anim-init .hero-actions .btn,.anim-init .hero-meta .item,.anim-init .countdown{opacity:1!important;}
  }

  /* =====================================================================
     MULTI-PAGE ADDITIONS
     The site is three pages now: the home page carries the argument, and
     Services / About each get their own. Everything below is what that split
     needs on top of the shared shell above.
     ===================================================================== */

  /* current-page marker in the nav */
  .nav-links a.active{color:var(--navy);font-weight:700;}
  .nav-links a.active:not(.nav-cta)::after{transform:scaleX(1);background:var(--alert);}

  /* ---------- PAGE HERO (Services / About) ---------- */
  .page-hero{position:relative;overflow:hidden;padding:66px 0 58px;border-bottom:1px solid var(--line);background:var(--paper);}
  .page-hero .wrap{position:relative;z-index:1;}
  .page-hero h1{font-size:clamp(34px,4.8vw,58px);max-width:20ch;margin-bottom:18px;font-weight:700;}
  .page-hero p{font-size:clamp(16.5px,1.6vw,19px);color:var(--muted);max-width:56ch;}
  .page-hero p strong{color:var(--navy);font-weight:700;}
  .page-hero .ph-back{
    display:inline-flex;align-items:center;gap:8px;font-family:var(--font);font-size:11.5px;
    letter-spacing:.12em;text-transform:uppercase;color:var(--slate);margin-bottom:20px;transition:color .2s,gap .25s;
  }
  .page-hero .ph-back:hover{color:var(--alert);gap:12px;}

  /* ---------- FREE BAND (step one) ---------- */
  .free-band{
    margin-top:22px;border-radius:16px;padding:24px 28px;display:flex;align-items:center;gap:24px;flex-wrap:wrap;
    background:linear-gradient(100deg,var(--navy) 0%,var(--navy-deep) 62%,#1b2b4d 100%);
    color:#fff;position:relative;overflow:hidden;
    box-shadow:0 22px 48px -28px rgba(14,22,40,.9);
  }
  .free-band::before{
    content:"";position:absolute;inset:0;pointer-events:none;
    background:linear-gradient(100deg,transparent 25%,rgba(232,179,60,.16) 50%,transparent 72%);
    transform:translateX(-100%);animation:sheen 6s linear infinite;
  }
  .free-band > *{position:relative;z-index:1;}
  .fb-tag{
    font-family:var(--font);font-size:13px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
    background:var(--gold-hot);color:var(--navy-ink);border-radius:999px;padding:8px 18px;flex-shrink:0;
    box-shadow:0 0 0 0 rgba(232,179,60,.6);animation:pulse-gold 2.6s infinite;
  }
  @keyframes pulse-gold{0%{box-shadow:0 0 0 0 rgba(232,179,60,.55);}70%{box-shadow:0 0 0 14px rgba(232,179,60,0);}100%{box-shadow:0 0 0 0 rgba(232,179,60,0);}}
  .fb-copy{flex:1 1 340px;}
  .fb-copy strong{display:block;font-family:var(--font);font-size:clamp(20px,2.4vw,26px);color:#fff;font-weight:700;line-height:1.2;margin-bottom:6px;letter-spacing:-.01em;}
  .fb-copy span{font-size:14.5px;color:#C3CAD6;}

  /* FREE pill on step 01 */
  .step .s-head{display:flex;align-items:center;gap:10px;margin-bottom:16px;position:relative;z-index:1;}
  .step .s-head .s-n{margin-bottom:0;}
  .free-pill{
    font-family:var(--font);font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
    background:var(--gold-hot);color:var(--navy-ink);border-radius:999px;padding:4px 10px;line-height:1.4;
  }

  /* ---------- NEXT STEPS (home → services / about) ---------- */
  #next{background:var(--paper-2);border-top:1px solid var(--line);padding:84px 0;}
  .next-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;}
  .next-card{
    display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:16px;
    padding:34px 32px;transition:box-shadow .4s cubic-bezier(.22,1,.36,1),transform .4s cubic-bezier(.22,1,.36,1),border-color .3s;
  }
  .next-card:hover{transform:translateY(-4px);box-shadow:0 22px 46px -24px rgba(31,42,68,.42);border-color:var(--slate-light);}
  .next-card .nc-k{font-family:var(--font);font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--alert);margin-bottom:14px;}
  .next-card h3{font-size:26px;margin-bottom:10px;font-weight:700;}
  .next-card p{font-size:15px;color:var(--muted);margin-bottom:22px;flex-grow:1;}
  .next-card .nc-go{font-size:14.5px;font-weight:700;color:var(--navy);display:inline-flex;align-items:center;gap:8px;transition:gap .25s,color .2s;}
  .next-card:hover .nc-go{gap:13px;color:var(--alert);}

  /* Wherever the stamp is visible it needs a lane of its own. Below ~1030px the
     heading's 62ch would run under it, so cap the heading against the stamp's
     width instead. Above that, 62ch is already the narrower of the two and
     this changes nothing — the wide desktop layout is untouched. */
  @media (min-width:861px){
    #stakes .sec-head{max-width:min(62ch,calc(100% - 320px));}
  }

  @media (max-width:860px){
    .next-grid{grid-template-columns:1fr;}
    .page-hero{padding:48px 0 44px;}
    /* The stamp needs room beside the heading; below this it would sit on top
       of the copy, so it goes rather than shrinks. */
    .stamp{display:none;}
    #stakes{padding:80px 0 74px;}
  }
  @media (max-width:640px){
    .free-band{padding:22px 20px;gap:16px;}
    .next-card{padding:28px 24px;}
    .stake{padding:26px 22px 24px 26px;}
    .stake::after{font-size:78px;}
    .stakes-note{padding:24px 22px 24px 34px;}
    .hazard-band{height:8px;}
  }

  /* =====================================================================
     PHONE ONLY (<=640px)
     The desktop layout is signed off — nothing above this block changes.
     On a phone the same content reads as a wall, so three sections drop to
     their headline layer: the hero loses its canvas, the stakes cards lose
     their prose, and the timeline collapses to nothing but article numbers.
     Everything hidden here is still in the DOM and still there on desktop.
     ===================================================================== */
  @media (max-width:640px){

    /* 1 — no node network behind the hero. The JS skips building it too, so
       this is belt and braces rather than a hidden-but-still-running canvas. */
    .hero-canvas,
    .hero-fade{display:none!important;}
    .hero{padding-top:40px;}

    /* 2 — stakes cards keep icon, citation and verdict; the sentence goes. */
    .stake p{display:none;}
    .stake{padding:22px 20px 20px 24px;}
    .stake .st-top{margin-bottom:14px;}
    .stake h3{margin-bottom:0;font-size:24px;}
    .stake::after{font-size:64px;bottom:-12px;right:10px;}
    .stakes-grid{gap:12px;}

    /* 3 — timeline drops to date, verdict and the article numbers themselves. */
    .tl-card > p,
    .tl-foot{display:none;}
    .tl-card{padding:22px 20px 20px;}
    .tl-card h3{margin-bottom:16px;}
    .tl-list{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:0;}
    .tl-list li{border-top:none;padding:0;display:block;}
    .tl-list li > span:not(.cite){display:none;}
    .tl-list li .cite{font-size:12px;padding:5px 10px;}

    /* 4 — the ticker between stakes and timeline reads as newsprint clutter
       on a narrow screen; on desktop it still divides the two sections. */
    .marquee{display:none;}

    /* The founding card is a flex row with a nowrap tag inside it. A flex item
       won't shrink below its min-content width, and that tag's min-content is
       the whole string — so the body overflowed the card by ~50px. Stack it,
       let the tag wrap, and allow the column to shrink. */
    .founding{flex-direction:column;align-items:flex-start;gap:16px;padding:24px 22px;}
    .founding-body{min-width:0;}
    .founding-body .tag{white-space:normal;}
  }

  /* =====================================================================
     CARD MODALS
     One shell per page, filled from data-* attributes on whichever card was
     clicked — so the copy lives in the HTML next to the card it belongs to,
     and there is only ever one dialog in the DOM. Two skins: light for the
     service cards, dark for The Stakes so the pop-up keeps that section's
     temperature instead of breaking the mood with a white box.
     ===================================================================== */
  .clickable{cursor:pointer;}
  .clickable:focus-visible{outline:3px solid var(--alert);outline-offset:3px;}

  /* the affordance — a small corner cue that the card does something */
  .card-more,.stake-more{
    position:absolute;right:16px;top:16px;width:26px;height:26px;border-radius:50%;
    display:flex;align-items:center;justify-content:center;pointer-events:none;
    font-size:15px;line-height:1;transition:transform .35s cubic-bezier(.22,1,.36,1),background .3s,color .3s;
  }
  .card-more{background:rgba(91,112,137,.1);color:#43536A;}
  .card:hover .card-more{background:var(--alert);color:#fff;transform:scale(1.12);}
  .stake-more{background:rgba(255,255,255,.08);color:var(--slate-light);}
  .stake:hover .stake-more{background:var(--alert);color:#fff;transform:scale(1.12);}
  /* the stakes cards already use the top-right corner for the citation chip */
  .stake .st-top{padding-right:34px;}
  .card .card-top{padding-right:34px;}

  .modal-root{
    position:fixed;inset:0;z-index:300;display:none;
    padding:24px;overflow-y:auto;-webkit-overflow-scrolling:touch;
  }
  .modal-root.open{display:flex;}
  .modal-backdrop{
    position:fixed;inset:0;background:rgba(10,16,30,.74);
    backdrop-filter:blur(3px);opacity:0;transition:opacity .3s ease;
  }
  .modal-root.shown .modal-backdrop{opacity:1;}
  .modal-panel{
    position:relative;margin:auto;width:100%;max-width:540px;border-radius:18px;
    padding:38px 36px 32px;overflow:hidden;
    opacity:0;transform:translateY(14px) scale(.97);
    transition:opacity .35s ease,transform .35s cubic-bezier(.22,1,.36,1);
  }
  .modal-root.shown .modal-panel{opacity:1;transform:translateY(0) scale(1);}

  /* light skin — services */
  .modal-panel.light{background:#fff;border:1px solid var(--line);box-shadow:0 40px 90px -40px rgba(31,42,68,.6);}
  .modal-panel.light .modal-kicker{color:var(--alert);}
  .modal-panel.light .modal-title{color:var(--navy);}
  .modal-panel.light .modal-body{color:var(--muted);}
  .modal-panel.light .modal-body strong{color:var(--navy);}
  .modal-panel.light .modal-note{color:var(--slate);}
  .modal-panel.light .modal-close{background:rgba(91,112,137,.1);color:var(--navy);}
  .modal-panel.light .modal-close:hover{background:var(--navy);color:#fff;}

  /* dark skin — the stakes */
  .modal-panel.dark{
    background:var(--navy-ink);border:1px solid rgba(226,74,50,.45);
    box-shadow:0 40px 90px -36px rgba(0,0,0,.9),inset 0 0 70px -30px rgba(226,74,50,.45);
  }
  .modal-panel.dark::after{
    content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
    background-image:repeating-linear-gradient(0deg,rgba(255,255,255,.03) 0 1px,transparent 1px 4px);
  }
  .modal-panel.dark > *{position:relative;z-index:1;}
  .modal-panel.dark .modal-kicker{color:#FF8A70;}
  .modal-panel.dark .modal-title{color:#fff;}
  .modal-panel.dark .modal-body{color:#B4BDCB;}
  .modal-panel.dark .modal-body strong{color:#fff;}
  .modal-panel.dark .modal-note{color:var(--slate-light);}
  .modal-panel.dark .modal-close{background:rgba(255,255,255,.09);color:#fff;}
  .modal-panel.dark .modal-close:hover{background:var(--alert);color:#fff;}
  .modal-panel.dark .btn-ghost{color:var(--slate-light);}
  .modal-panel.dark .btn-ghost:hover{color:#fff;}
  /* hazard strip across the top, echoing the section it was opened from */
  .modal-hazard{display:none;position:absolute;left:0;right:0;top:0;height:8px;opacity:.65;
    background:repeating-linear-gradient(45deg,var(--alert) 0 10px,transparent 10px 20px);}
  .modal-panel.dark .modal-hazard{display:block;}

  .modal-close{
    position:absolute;right:16px;top:16px;width:34px;height:34px;border:none;border-radius:50%;
    cursor:pointer;font:inherit;display:flex;align-items:center;justify-content:center;
    transition:background .25s,color .25s,transform .25s;z-index:2;
  }
  .modal-close:hover{transform:rotate(90deg);}
  .modal-close svg{width:14px;height:14px;}
  /* inline-block so the box hugs the text, capped so it can never run under the
     close button (which sits 50px in from the panel edge, i.e. inside the padding) */
  .modal-kicker{
    display:inline-block;font-family:var(--font);font-size:11px;font-weight:700;letter-spacing:.16em;
    text-transform:uppercase;margin-bottom:14px;max-width:calc(100% - 40px);
  }
  .modal-title{font-size:clamp(25px,3.4vw,34px);font-weight:700;letter-spacing:-.025em;line-height:1.12;margin-bottom:14px;}
  .modal-body{font-size:15.5px;line-height:1.65;margin-bottom:26px;}
  .modal-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap;}
  .modal-actions .btn{padding:13px 24px;font-size:14.5px;}
  .modal-note{font-size:12.5px;margin-top:18px;}

  @media (max-width:640px){
    .modal-root{padding:14px;}
    .modal-panel{padding:32px 22px 26px;}
    .modal-actions{flex-direction:column;align-items:stretch;}
    .modal-actions .btn{width:100%;}
    .card-more,.stake-more{right:14px;top:14px;}
  }