/**
 * Lantern CV — Global stylesheet
 * Page creation: 24/10/2026 18:30
 * Page modified: 25/10/2026 01:50
 * Served at /assets/css/site.css. Prospect palette · light only · 4px radius ceiling · 8px grid.
 * Self-hosted only — no third-party calls.
 */

/* ============================================================
   DESIGN TOKENS
   ============================================================ */
:root{
  --green:#14603b;        --green-d:#0e4a2d;   --green-dd:#0a3a23;
  --coral:#ff6b4a;        --coral-d:#e2502f;   --coral-ink:#3a1004;
  --chalk:#f3f6f1;        --paper:#ffffff;     --mist:#eaf0ea;
  --ink:#14241a;          --ink-2:#3f5146;     --ink-3:#6c7d71;
  --line:#d7e3d9;         --line-2:#c3d2c6;
  --leaf:#9fe3b8;
  --amber:#9a6b12;        --red:#9c3a33;

  --font-h:'Nunito','Trebuchet MS',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-b:'Maven Pro',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --mono:ui-monospace,'SFMono-Regular','Cascadia Mono','Consolas',monospace;

  --r-fine:2px; --r-panel:4px;

  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s8:48px;--s10:64px;--s12:96px;

  --dur-instant:80ms; --dur-quick:160ms; --dur-considered:260ms; --dur-deliberate:400ms;
  --ease:cubic-bezier(.32,.72,0,1);

  --nav-h:64px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:100px;scrollbar-gutter:stable}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation-duration:.001ms!important;transition-duration:.001ms!important}}
body{margin:0;padding-top:34px;font-family:var(--font-b);color:var(--ink);background:var(--paper);line-height:1.55;letter-spacing:-.01em;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:var(--font-h);font-weight:800;letter-spacing:-.02em;margin:0;line-height:1.12}
p{margin:0}
a{color:var(--green-d)}
img{max-width:100%}
.tnum{font-variant-numeric:tabular-nums}
.svgi{width:1em;height:1em;flex:none;vertical-align:-.12em}
.wrap{max-width:1120px;margin:0 auto;padding:0 20px}

/* accessibility */
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:#fff;padding:10px 16px;border-radius:var(--r-fine);z-index:200}
.skip:focus{left:12px;top:12px}
a:focus-visible,button:focus-visible{outline:none;box-shadow:0 0 0 1.5px var(--paper),0 0 0 4px var(--coral);border-radius:var(--r-fine)}

/* ============================================================
   BUTTONS
   ============================================================ */
.btn{display:inline-flex;align-items:center;gap:8px;cursor:pointer;font-family:var(--font-h);font-weight:800;font-size:15px;line-height:1;
  padding:14px 20px;border-radius:var(--r-fine);border:1.5px solid transparent;text-decoration:none;
  transition:transform var(--dur-instant) var(--ease),background var(--dur-quick) var(--ease),color var(--dur-quick) var(--ease),border-color var(--dur-quick) var(--ease),box-shadow var(--dur-quick) var(--ease)}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--coral);color:var(--coral-ink);border-color:var(--coral)}
.btn-primary:hover{background:var(--coral-d);border-color:var(--coral-d);box-shadow:0 8px 20px -12px rgba(226,80,47,.8)}
.btn-secondary{background:transparent;color:var(--green-d);border-color:var(--green)}
.btn-secondary:hover{background:var(--mist)}
.btn-on-green{background:var(--coral);color:var(--coral-ink);border-color:var(--coral)}
.btn-on-green:hover{background:var(--coral-d);border-color:var(--coral-d);box-shadow:0 8px 22px -12px rgba(0,0,0,.45)}
.btn-ghost-green{background:transparent;color:#fff;border-color:rgba(255,255,255,.55)}
.btn-ghost-green:hover{background:rgba(255,255,255,.08);border-color:#fff}
.btn .svgi{width:18px;height:18px}

/* ============================================================
   HEADER — two-tier sticky: mono utility strip + primary nav
   ============================================================ */
/* tier 1 — mono utility strip: fixed to the top for the whole page. Only the strip is
   fixed; the nav tier scrolls with the page. body carries matching padding-top (34px)
   and html scroll-padding-top keeps in-page anchors clear of it. */
.util-strip{position:fixed;top:0;left:0;right:0;z-index:101;background:var(--green-dd);color:#bcd4c3}
.util-in{display:flex;align-items:center;justify-content:space-between;height:34px;
  font-family:var(--mono);font-size:11px;letter-spacing:.05em;text-transform:uppercase}
.util-group{display:flex;align-items:center;gap:var(--s4)}
.u-item{display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.u-item .svgi{width:13px;height:13px;color:var(--leaf)}
.u-item .dot{width:7px;height:7px;border-radius:50%;background:var(--leaf);display:inline-block;box-shadow:0 0 7px var(--leaf)}
.u-accent{color:#ffb59f}

/* tier 2 — primary nav */
/* Nav stays pinned just under the fixed utility strip, then slides up off-screen once the
   page is scrolled past 30% (JS toggles html.nav-hidden). Sticky keeps it in flow, so hiding
   it leaves no gap. */
.nav-tier{position:sticky;top:34px;z-index:100;background:var(--chalk);border-bottom:2px solid var(--green);
  transition:transform var(--dur-considered) var(--ease),box-shadow var(--dur-considered) var(--ease)}
html.nav-hidden .nav-tier{transform:translateY(calc(-100% - 12px))}
.nav{height:var(--nav-h);display:flex;align-items:stretch;gap:var(--s4)}
.brand{display:inline-flex;align-items:center;text-decoration:none}
.brand-logo{height:32px;width:auto;display:block;transition:opacity var(--dur-quick) var(--ease)}
.brand:hover .brand-logo{opacity:.82}

.nav-primary{display:flex;align-items:stretch;gap:2px;margin-left:var(--s5)}
.mnav-item{position:relative;display:flex;align-items:stretch}

/* trigger + its own underline rail (grows from the left on hover/open — graceful, never snaps between tabs) */
.nav-trigger{position:relative;display:inline-flex;align-items:center;gap:7px;height:100%;padding:0 13px;background:transparent;border:0;cursor:pointer;
  font-family:var(--font-b);font-size:14px;font-weight:600;color:var(--ink-2);letter-spacing:-.01em;transition:color var(--dur-quick) var(--ease)}
.nav-trigger .car{width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;
  transform:rotate(45deg) translateY(-2px);opacity:.55;transition:transform var(--dur-considered) var(--ease),opacity var(--dur-quick) var(--ease)}
.nav-trigger::after{content:"";position:absolute;left:11px;right:11px;bottom:0;height:3px;background:var(--coral);border-radius:2px;
  transform:scaleX(0);transform-origin:left;transition:transform var(--dur-considered) var(--ease)}
.mnav-item:hover .nav-trigger,.mnav-item:focus-within .nav-trigger,.mnav-item.is-open .nav-trigger{color:var(--green-d)}
.mnav-item:hover .nav-trigger::after,.mnav-item:focus-within .nav-trigger::after,.mnav-item.is-open .nav-trigger::after{transform:scaleX(1)}
.mnav-item:hover .nav-trigger .car,.mnav-item:focus-within .nav-trigger .car,.mnav-item.is-open .nav-trigger .car{transform:rotate(225deg) translateY(1px);opacity:1}

/* on-hover slide-down mega panel */
.mega{position:absolute;top:100%;left:0;z-index:120;width:min(840px,calc(100vw - 40px));
  background:rgba(247,248,246,.72);backdrop-filter:saturate(1.5) blur(16px);-webkit-backdrop-filter:saturate(1.5) blur(16px);
  border:1px solid var(--line);border-top:3px solid var(--coral);border-radius:0 0 var(--r-panel) var(--r-panel);
  box-shadow:0 26px 54px -30px rgba(10,58,35,.55);overflow:hidden;
  opacity:0;visibility:hidden;transform:translateY(-10px);pointer-events:none;
  transition:opacity var(--dur-considered) var(--ease),transform var(--dur-considered) var(--ease),visibility 0s linear var(--dur-considered)}
.mnav-item:hover>.mega,.mnav-item:focus-within>.mega,.mnav-item.is-open>.mega{
  opacity:1;visibility:visible;transform:none;pointer-events:auto;
  transition:opacity var(--dur-considered) var(--ease),transform var(--dur-considered) var(--ease),visibility 0s}
/* keep the right-hand panels from spilling off-screen */
.mnav-item:nth-last-child(1)>.mega,.mnav-item:nth-last-child(2)>.mega{left:auto;right:0}
.mega-inner{display:grid;grid-template-columns:232px 1fr}
.mega-rail{background:rgba(20,96,59,.82);color:#eaf4ec;padding:22px 20px;display:flex;flex-direction:column;gap:8px}
.mega-rail .k{font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--leaf)}
.mega-rail h3{color:#fff;font-size:19px;line-height:1.15}
.mega-rail p{font-size:13px;color:#d4ead9;margin-bottom:4px}
.mega-cta{margin-top:auto;align-self:flex-start;display:inline-flex;background:var(--coral);color:var(--coral-ink);
  font-family:var(--font-h);font-weight:800;font-size:13px;padding:10px 14px;border-radius:var(--r-fine);text-decoration:none;
  transition:background var(--dur-quick) var(--ease)}
.mega-cta:hover{background:var(--coral-d)}
.mega-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(176px,1fr));gap:18px 22px;padding:22px}
.mcol h4{font-family:var(--font-h);font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--green-d);margin-bottom:10px}
.mitem{display:block;padding:7px 0;text-decoration:none}
.mitem .t{display:block;font-weight:600;font-size:13.5px;color:var(--ink);transition:color var(--dur-quick) var(--ease)}
.mitem .d{display:block;font-size:11.5px;color:var(--ink-3);margin-top:1px;line-height:1.4}
.mitem:hover .t,.mitem:focus-visible .t{color:var(--coral-d)}
@media (max-width:980px){
  .mega{width:min(620px,calc(100vw - 40px))}
  .mega-inner{grid-template-columns:1fr}
  .mega-rail{border-radius:0}
}

.nav-actions{margin-left:auto;align-self:center;display:flex;align-items:center;gap:var(--s2)}
.nav-actions .signin{font-size:14px;font-weight:700;color:var(--green-d);text-decoration:none;padding:9px 12px;border-radius:var(--r-fine);transition:background var(--dur-quick) var(--ease)}
.nav-actions .signin:hover{background:var(--mist)}
.nav-actions .btn{padding:10px 16px;font-size:14px}
.nav-toggle{display:none;align-self:center;align-items:center;gap:7px;margin-left:auto;background:transparent;border:1.5px solid var(--green);color:var(--green-d);
  font-family:var(--font-h);font-weight:800;font-size:13px;padding:9px 13px;border-radius:var(--r-fine);cursor:pointer;
  transition:background var(--dur-quick) var(--ease),color var(--dur-quick) var(--ease)}
.nav-toggle:hover{background:var(--mist)}
.nav-toggle .svgi{width:16px;height:16px;transition:transform var(--dur-considered) var(--ease)}
.nav-toggle[aria-expanded="true"] .svgi{transform:rotate(90deg)}

@media (max-width:860px){
  .nav-primary,.nav-actions{display:none}
  .nav-toggle{display:inline-flex}
}

/* ============================================================
   OFF-CANVAS DRAWER (full-height, slides from the right) + accordion sub-menus
   ============================================================ */
.drawer-scrim{position:fixed;inset:0;z-index:150;background:rgba(10,36,22,.46);
  opacity:0;visibility:hidden;transition:opacity var(--dur-considered) var(--ease),visibility var(--dur-considered)}
.drawer-scrim.is-open{opacity:1;visibility:visible}
.drawer{position:fixed;top:0;right:0;z-index:160;height:100dvh;width:min(360px,88vw);
  display:flex;flex-direction:column;background:var(--paper);box-shadow:-24px 0 60px -30px rgba(10,36,22,.6);
  transform:translateX(100%);transition:transform var(--dur-considered) var(--ease);will-change:transform}
.drawer.is-open{transform:none}
body.drawer-locked{overflow:hidden}
.drawer-head{flex:none;display:flex;align-items:center;justify-content:space-between;padding:0 20px;height:var(--nav-h);
  border-bottom:2px solid var(--green);background:var(--chalk)}
.drawer-title{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--green-d)}
.drawer-close{appearance:none;width:36px;height:36px;border:1px solid var(--line);background:var(--paper);border-radius:var(--r-fine);
  cursor:pointer;color:var(--ink);font-size:16px;line-height:1;display:flex;align-items:center;justify-content:center;transition:background var(--dur-quick) var(--ease)}
.drawer-close:hover{background:var(--mist)}
.drawer-nav{flex:1 1 auto;overflow-y:auto;-webkit-overflow-scrolling:touch}
.drawer-foot{flex:none;display:flex;flex-direction:column;gap:var(--s2);padding:16px 20px;border-top:1px solid var(--line)}
.drawer-foot .btn{width:100%;justify-content:center}

/* accordion */
.acc{border-bottom:1px solid var(--line)}
.acc-trigger{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;background:transparent;border:0;cursor:pointer;
  font-family:var(--font-h);font-weight:800;font-size:16px;color:var(--ink);padding:16px 20px;text-align:left;transition:color var(--dur-quick) var(--ease)}
.acc-trigger:hover{color:var(--green-d)}
.acc-caret{flex:none;width:9px;height:9px;border-right:2px solid var(--green);border-bottom:2px solid var(--green);
  transform:rotate(45deg);transition:transform var(--dur-considered) var(--ease)}
.acc.is-open .acc-trigger{color:var(--green-d)}
.acc.is-open .acc-caret{transform:rotate(225deg)}
/* smooth height via grid-template-rows 0fr -> 1fr (no JS measurement) */
.acc-panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows var(--dur-considered) var(--ease)}
.acc.is-open .acc-panel{grid-template-rows:1fr}
.acc-inner{overflow:hidden;min-height:0}
.acc-inner a{display:block;padding:11px 20px 11px 32px;font-size:14px;color:var(--ink-2);text-decoration:none;
  border-top:1px solid var(--line);transition:color var(--dur-quick) var(--ease),background var(--dur-quick) var(--ease)}
.acc-inner a:hover{color:var(--green-d);background:var(--chalk)}
.acc-inner a:last-child{padding-bottom:16px}
@media (prefers-reduced-motion:reduce){.drawer,.drawer-scrim,.acc-panel{transition:none}}
@media (max-width:520px){
  .util-group .u-hide-sm{display:none}
  .util-in{font-size:10px}
}

/* ============================================================
   HERO
   ============================================================ */
.hero{background:var(--green);color:#eaf4ec;position:relative;overflow:hidden;display:flex;align-items:center;
  min-height:calc(100vh - var(--nav-h) - 34px);min-height:calc(100svh - var(--nav-h) - 34px);min-height:calc(100dvh - var(--nav-h) - 34px)}
.hero .wrap{position:relative;z-index:1;width:100%;padding:var(--s8) 20px}
.hero-wm{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.hero-scroll{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);z-index:1;width:40px;height:40px;
  display:grid;place-items:center;border-radius:50%;color:#cfe4d5;border:1px solid rgba(255,255,255,.22);
  background:rgba(255,255,255,.05);text-decoration:none;animation:heroBob 2.4s var(--ease) infinite}
.hero-scroll:hover{color:#fff;border-color:rgba(255,255,255,.55);background:rgba(255,255,255,.1)}
.hero-scroll .svgi{width:20px;height:20px}
@keyframes heroBob{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(4px)}}
@media (prefers-reduced-motion:reduce){.hero-scroll{animation:none}}
.hero::after{content:"";position:absolute;right:-120px;bottom:-120px;width:360px;height:360px;border-radius:50%;
  background:radial-gradient(circle at 35% 35%,rgba(255,107,74,.55),rgba(255,107,74,0) 68%);pointer-events:none}
.hero .eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--leaf);font-weight:600}
.hero h1{color:#fff;font-size:clamp(34px,7vw,58px);line-height:1.02;margin:var(--s4) 0 var(--s4);max-width:17ch}
.hero h1 em{font-style:normal;color:var(--coral)}
.hero .lede{font-size:clamp(16px,2.4vw,19px);color:#d4ead9;max-width:46ch;margin-bottom:var(--s6)}
.hero .ctas{display:flex;gap:var(--s3);flex-wrap:wrap;position:relative;z-index:1}
.hero .assure{display:flex;gap:var(--s5);flex-wrap:wrap;margin-top:var(--s6);padding-top:var(--s5);border-top:1px solid rgba(255,255,255,.18);font-size:13.5px;color:#cfe4d5}
.hero .assure span{display:inline-flex;align-items:center;gap:8px}
.hero .assure .svgi{color:var(--leaf);width:17px;height:17px}

/* ============================================================
   STAT BAND
   ============================================================ */
.band-problem{background:var(--chalk);border-bottom:1px solid var(--line)}
.band-problem .wrap{padding:var(--s10) 20px}
.band-problem .grid{display:grid;grid-template-columns:1.1fr 1fr;gap:var(--s8);align-items:center}
.band-problem .copy .kick{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--coral-d);font-weight:600}
.band-problem .copy h2{font-size:clamp(24px,4vw,34px);margin:var(--s3) 0 var(--s4);max-width:18ch}
.band-problem .copy p{font-size:16px;color:var(--ink-2);max-width:48ch}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r-panel);overflow:hidden}
.stat{background:var(--paper);padding:var(--s5)}
.stat .fig{font-family:var(--font-h);font-weight:800;font-size:clamp(30px,6vw,44px);color:var(--green);line-height:1}
.stat .lab{font-size:13px;color:var(--ink-3);margin-top:var(--s2)}
@media (max-width:760px){.band-problem .grid{grid-template-columns:1fr;gap:var(--s6)}}

/* ============================================================
   FEATURES
   ============================================================ */
.features .wrap{padding:var(--s12) 20px}
.sec-head{max-width:60ch;margin-bottom:var(--s8)}
.sec-head .kick{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--green);font-weight:600}
.sec-head h2{font-size:clamp(26px,4.5vw,38px);margin:var(--s3) 0 var(--s3)}
.sec-head p{font-size:16px;color:var(--ink-2)}
.feat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s4)}
.feat{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-panel);padding:var(--s5);
  transition:border-color var(--dur-quick) var(--ease),transform var(--dur-quick) var(--ease),box-shadow var(--dur-quick) var(--ease)}
.feat:hover{border-color:var(--line-2);transform:translateY(-2px);box-shadow:0 14px 30px -24px rgba(20,36,26,.5)}
.feat .ic{width:40px;height:40px;border-radius:var(--r-panel);display:flex;align-items:center;justify-content:center;background:var(--mist);color:var(--green);margin-bottom:var(--s4)}
.feat .ic.coral{background:rgba(255,107,74,.14);color:var(--coral-d)}
.feat h3{font-size:19px;margin-bottom:var(--s2)}
.feat p{font-size:14.5px;color:var(--ink-2)}
.feat .grade{display:inline-flex;gap:6px;align-items:center;margin-top:var(--s3);font-family:var(--mono);font-size:11px;letter-spacing:.04em;color:var(--green-d);background:var(--mist);border-radius:var(--r-fine);padding:4px 8px}
@media (max-width:680px){.feat-grid{grid-template-columns:1fr}.features .wrap{padding:var(--s10) 20px}}

/* ============================================================
   CAMPAIGN SPLIT
   ============================================================ */
.campaign{background:var(--mist);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.campaign .wrap{padding:var(--s12) 20px;display:grid;grid-template-columns:1fr 1fr;gap:var(--s10);align-items:center}
.campaign .copy .kick{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--green);font-weight:600}
.campaign .copy h2{font-size:clamp(26px,4.5vw,36px);margin:var(--s3) 0 var(--s4);max-width:16ch}
.campaign .copy p{font-size:16px;color:var(--ink-2);max-width:46ch;margin-bottom:var(--s5)}
.campaign .copy .btn{font-size:14px}
.panel{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-panel);overflow:hidden;box-shadow:0 20px 44px -28px rgba(20,36,26,.4)}
.panel .ph{display:flex;align-items:center;justify-content:space-between;padding:var(--s3) var(--s4);border-bottom:1px solid var(--line);background:var(--chalk)}
.panel .ph h4{font-size:14px;color:var(--green-d)}
.panel .ph .tag{font-family:var(--mono);font-size:10px;letter-spacing:.06em;color:var(--ink-3)}
.panel .row{display:flex;align-items:center;justify-content:space-between;padding:var(--s3) var(--s4);border-bottom:1px solid var(--line);font-size:13.5px}
.panel .row:last-child{border-bottom:0}
.panel .row .role{font-weight:600}
.panel .row .emp{color:var(--ink-3);font-size:12px}
.pill{font-family:var(--mono);font-size:10px;letter-spacing:.04em;padding:3px 9px;border-radius:999px}
.pill.ready{background:rgba(20,96,59,.1);color:var(--green-d)}
.pill.draft{background:rgba(154,107,18,.14);color:var(--amber)}
.pill.sent{background:rgba(255,107,74,.14);color:var(--coral-d)}
@media (max-width:820px){.campaign .wrap{grid-template-columns:1fr;gap:var(--s6)}}

/* ============================================================
   PRIVACY / SECURITY BAND
   ============================================================ */
.privacy{background:var(--green-dd);color:#d6e7db}
.privacy .wrap{padding:var(--s12) 20px}
.privacy .kick{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--leaf);font-weight:600}
.privacy h2{color:#fff;font-size:clamp(26px,4.5vw,38px);margin:var(--s3) 0 var(--s6);max-width:20ch}
.privacy .plist{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s5)}
.privacy .p{border-top:1px solid rgba(255,255,255,.18);padding-top:var(--s4)}
.privacy .p .svgi{color:var(--leaf);width:22px;height:22px;margin-bottom:var(--s3)}
.privacy .p h3{color:#fff;font-size:17px;margin-bottom:var(--s2)}
.privacy .p p{font-size:14px;color:#b9d2c0}
.privacy .rated{display:inline-flex;align-items:center;gap:10px;margin-top:var(--s8);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);border-radius:var(--r-panel);padding:12px 16px;font-size:13.5px}
.privacy .rated b{color:#fff;font-family:var(--font-h)}
.privacy .rated .grade{font-family:var(--font-h);font-weight:800;color:var(--leaf);font-size:20px}
@media (max-width:760px){.privacy .plist{grid-template-columns:1fr}}

/* ============================================================
   PRICING
   ============================================================ */
.pricing .wrap{padding:var(--s12) 20px;text-align:center}
.pricing .kick{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--green);font-weight:600}
.pricing h2{font-size:clamp(26px,4.5vw,38px);margin:var(--s3) auto var(--s4);max-width:18ch}
.pricing .big{font-family:var(--font-h);font-weight:800;font-size:clamp(40px,9vw,64px);color:var(--coral-d);line-height:1}
.pricing .sub{font-size:16px;color:var(--ink-2);max-width:44ch;margin:var(--s4) auto var(--s6)}
.pricing .fine{display:flex;gap:var(--s5);justify-content:center;flex-wrap:wrap;font-family:var(--mono);font-size:12px;color:var(--ink-3)}
.pricing .fine span{display:inline-flex;align-items:center;gap:7px}

/* ============================================================
   FINAL CTA
   ============================================================ */
.final{background:var(--green)}
.final .wrap{padding:var(--s10) 20px;text-align:center;color:#eaf4ec}
.final h2{color:#fff;font-size:clamp(28px,5vw,42px);margin-bottom:var(--s4);max-width:20ch;margin-inline:auto}
.final p{color:#d4ead9;font-size:16px;max-width:42ch;margin:0 auto var(--s6)}
.final .ctas{display:flex;gap:var(--s3);justify-content:center;flex-wrap:wrap}

/* ============================================================
   ROUTED PAGES (generic content view + 404)
   ============================================================ */
.page-head{background:var(--green);color:#eaf4ec}
.page-head .wrap{padding:var(--s10) 20px}
.page-head .kick{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--leaf);font-weight:600}
.page-head h1{color:#fff;font-size:clamp(30px,6vw,46px);margin:var(--s3) 0 var(--s3);max-width:20ch}
.page-head p{font-size:clamp(15px,2.2vw,18px);color:#d4ead9;max-width:52ch}
.page-body .wrap{padding:var(--s10) 20px;max-width:760px}
.page-body p{font-size:16px;color:var(--ink-2);margin-bottom:var(--s5)}
.page-body .note{font-size:15px;color:var(--ink-3);border-left:3px solid var(--coral);background:var(--chalk);padding:14px 16px;border-radius:0 var(--r-fine) var(--r-fine) 0}

/* ============================================================
   MEMBER AUTH (signup / verify / mfa / success / member)
   ============================================================ */
.auth{min-height:calc(100dvh - 180px);display:flex;align-items:flex-start;justify-content:center;padding:var(--s10) 20px var(--s12)}
.auth-card{position:relative;width:100%;max-width:460px;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-panel);
  padding:28px 28px 26px;box-shadow:0 24px 54px -34px rgba(20,36,26,.5);overflow:hidden}
.auth-wide .auth-card{max-width:720px}
.auth-rail{position:absolute;top:0;left:0;right:0;height:4px;background:var(--coral)}
.step-meta{display:flex;justify-content:space-between;font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);margin-top:8px}
.step-meta .now{color:var(--green-d);font-weight:600}
.step-track{height:4px;background:var(--mist);border-radius:999px;margin:8px 0 18px;overflow:hidden}
.step-fill{display:block;height:100%;background:var(--green);border-radius:999px;transition:width var(--dur-deliberate) var(--ease)}
.auth-h1{font-size:26px;margin-bottom:6px}
.auth-lead{font-size:15px;color:var(--ink-2);margin-bottom:18px}
.auth-center{text-align:center}
.auth-form{display:flex;flex-direction:column;gap:14px}
.field{display:flex;flex-direction:column;gap:6px}
.field-label{font-size:13px;font-weight:600;color:var(--ink-2)}
.input{width:100%;min-height:44px;padding:0 13px;font:inherit;color:var(--ink);background:var(--surface-2);border:1px solid var(--line-2);border-radius:var(--r-fine);transition:border-color var(--dur-quick) var(--ease),box-shadow var(--dur-quick) var(--ease)}
.input:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 3px rgba(20,96,59,.14)}
.inputwrap{position:relative;display:block}
.inputwrap .input{padding-right:44px}
.pw-reveal{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:34px;height:34px;display:flex;align-items:center;justify-content:center;background:transparent;border:0;color:var(--ink-3);cursor:pointer;border-radius:var(--r-fine)}
.pw-reveal:hover{color:var(--green-d)}
.hp{position:absolute;left:-9999px;width:1px;height:1px}
.tc-field{display:flex;align-items:center;gap:11px;font-size:14px;color:var(--ink-2)}
.tc-text a{color:var(--green-d);font-weight:600}
.switch{position:relative;flex:none;width:44px;height:26px}
.switch input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer}
.switch-track{position:absolute;inset:0;background:var(--line-2);border-radius:999px;pointer-events:none;transition:background var(--dur-quick) var(--ease)}
.switch-track::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;background:#fff;border-radius:50%;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:transform var(--dur-considered) var(--ease)}
.switch input:checked + .switch-track{background:var(--green)}
.switch input:checked + .switch-track::after{transform:translateX(18px)}
.switch input:focus-visible + .switch-track{box-shadow:0 0 0 3px rgba(255,107,74,.5)}
.auth-submit{width:100%;justify-content:center;margin-top:4px}
.auth-submit:disabled{opacity:.5;cursor:not-allowed}
.auth-foot{font-size:13px;color:var(--ink-3);margin-top:14px;text-align:center}
.linkbtn{background:none;border:0;padding:0;cursor:pointer;font:inherit;color:var(--green-d);font-weight:600;text-decoration:underline}
.linkbtn[disabled]{color:var(--ink-3);text-decoration:none;cursor:default}
.auth-resend{text-align:center}
.flash{border-radius:var(--r-fine);padding:11px 13px;font-size:13.5px;margin:10px 0}
.flash.is-error{background:rgba(156,58,51,.08);border:1px solid rgba(156,58,51,.3);color:#7f2a24}
.flash.is-ok{background:rgba(20,96,59,.08);border:1px solid rgba(20,96,59,.3);color:var(--green-d)}
.banner{background:var(--mist);border:1px solid var(--line);border-radius:var(--r-fine);padding:12px 14px;font-size:13px;color:var(--ink-2);margin:4px 0 16px}
.mail-badge{display:inline-flex;align-items:center;justify-content:center;width:72px;height:72px;border-radius:50%;background:var(--mist);margin-bottom:12px}
.otp{display:flex;gap:8px;justify-content:center;margin:4px 0}
.otp-box{width:44px;height:52px;text-align:center;font-family:var(--font-h);font-weight:800;font-size:22px;color:var(--ink);background:var(--surface-2);border:1px solid var(--line-2);border-radius:var(--r-fine)}
.otp-box:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 3px rgba(20,96,59,.14)}
.setupkey{background:var(--chalk);border:1px solid var(--line);border-radius:var(--r-panel);padding:14px 16px;margin:4px 0 16px;text-align:center}
.setupkey-label{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);margin-bottom:6px}
.setupkey-code{display:block;font-family:var(--mono);font-size:17px;letter-spacing:3px;color:var(--green-d);word-break:break-all}
.setupkey-hint{font-size:12px;color:var(--ink-3);margin-top:8px}
.auth-overlay{position:fixed;inset:0;z-index:200;background:rgba(243,246,241,.92);backdrop-filter:blur(4px);display:none;flex-direction:column;align-items:center;justify-content:center;gap:16px;color:var(--green-d)}
.auth-overlay.show{display:flex}
.auth-overlay .spin{width:54px;height:54px;border:5px solid var(--mist);border-top-color:var(--green);border-radius:50%;animation:lcvspin 1s linear infinite}
@keyframes lcvspin{to{transform:rotate(360deg)}}
.check-badge{display:inline-block;margin-bottom:8px}
.check-path{stroke-dasharray:60;stroke-dashoffset:60;animation:lcvdraw .6s var(--ease) .2s forwards}
@keyframes lcvdraw{to{stroke-dashoffset:0}}
.member-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin:18px 0}
.member-tile{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-panel);padding:16px}
.member-tile h2{font-size:15px;margin-bottom:4px}
.member-tile p{font-size:13px;color:var(--ink-2)}
@media (prefers-reduced-motion:reduce){.auth-overlay .spin{animation:none}.check-path{animation:none;stroke-dashoffset:0}}

/* ============================================================
   FOOTER
   ============================================================ */
.site-foot{background:var(--chalk);border-top:1px solid var(--line)}
.site-foot .wrap{padding:var(--s10) 20px var(--s6)}
.foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:var(--s6)}
.foot-brand .brand{margin-bottom:var(--s3)}
.foot-brand .brand-logo{height:30px}
.foot-brand p{font-size:13.5px;color:var(--ink-3);max-width:34ch}
.foot-col h4{font-family:var(--font-h);font-size:13px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-3);margin-bottom:var(--s3)}
.foot-col a{display:block;font-size:14px;color:var(--ink-2);text-decoration:none;padding:5px 0;transition:color var(--dur-quick) var(--ease)}
.foot-col a:hover{color:var(--green-d)}
.foot-strip{display:flex;justify-content:space-between;flex-wrap:wrap;gap:var(--s3);margin-top:var(--s8);padding-top:var(--s5);border-top:1px solid var(--line);font-family:var(--mono);font-size:11px;color:var(--ink-3);letter-spacing:.03em}
.foot-strip .lock{display:inline-flex;align-items:center;gap:7px}
@media (max-width:760px){.foot-grid{grid-template-columns:1fr 1fr}.foot-brand{grid-column:1/-1}}
@media (max-width:460px){.foot-grid{grid-template-columns:1fr}}

/* ============================================================
   NIGHT MODE — soft, warm deep green-grey (no hard black).
   Explicit toggle only; prefers-color-scheme is ignored by design.
   ============================================================ */
:root[data-theme="night"]{
  --green:#1d7a4b;    --green-d:#14603b;   --green-dd:#0e4a2d;
  --coral:#ff7a5c;    --coral-d:#ff6b4a;   --coral-ink:#2a0d02;
  --chalk:#141a16;    --paper:#1b241f;     --mist:#223029;
  --ink:#e8efe9;      --ink-2:#b4c4ba;     --ink-3:#869a8e;
  --line:#2d3b33;     --line-2:#3a4a41;
  --leaf:#9fe3b8;
  --amber:#d6a24a;    --red:#e2756b;
}
:root[data-theme="night"] body{background:var(--chalk);color:var(--ink)}
/* soften the few hardcoded-light surfaces so night stays consistent */
:root[data-theme="night"] .nav-tier{background:var(--paper)}
:root[data-theme="night"] .mega{background:rgba(27,36,31,.86)}
:root[data-theme="night"] .mega-rail{background:rgba(14,74,45,.9)}

/* ============================================================
   THEME TOGGLE — premium day/night slide switch (lives in the util strips)
   ============================================================ */
.theme-toggle{appearance:none;-webkit-appearance:none;border:0;background:none;padding:0;margin:0;cursor:pointer;display:inline-flex;align-items:center;line-height:0}
.theme-toggle .tt-track{position:relative;width:48px;height:24px;border-radius:999px;display:inline-flex;align-items:center;justify-content:space-between;padding:0 5px;
  background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);transition:background var(--dur-considered) var(--ease),border-color var(--dur-considered) var(--ease)}
.theme-toggle .tt-sun,.theme-toggle .tt-moon{z-index:1;color:#aec4b6;display:grid;place-items:center;transition:color var(--dur-quick) var(--ease)}
.theme-toggle .tt-sun svg,.theme-toggle .tt-moon svg{width:13px;height:13px;display:block}
.theme-toggle .tt-knob{position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:var(--leaf);
  box-shadow:0 1px 3px rgba(0,0,0,.45);transition:transform var(--dur-considered) var(--ease),background var(--dur-considered) var(--ease)}
.theme-toggle:hover .tt-track{background:rgba(255,255,255,.16)}
.theme-toggle:focus-visible{outline:none}
.theme-toggle:focus-visible .tt-track{box-shadow:0 0 0 3px rgba(159,227,184,.45)}
:root[data-theme="day"] .theme-toggle .tt-sun{color:#fff}
:root[data-theme="night"] .theme-toggle .tt-moon{color:#fff}
:root[data-theme="night"] .theme-toggle .tt-knob{transform:translateX(24px);background:#d7efdf}
@media (prefers-reduced-motion:reduce){.theme-toggle .tt-track,.theme-toggle .tt-knob{transition:none}}