/* ════════════════════════════════════════════════════════════════════
   linq · PUBLIC MARKETING SITE KIT — interior hero, mid-page blocks,
   furniture, nav chrome and footer. Serves linqsystem.com only.

   Provenance: verbatim from the Linq_2_11 design handoff
   (WEBSITE/_kit/linq-kit.css), with WEBSITE/_kit/site-chrome.css folded
   in at the foot and the missing nav-dropdown / mobile-drawer rules
   reconstructed (see the NAV CHROME section).

   NOT to be confused with static/css/linq-kit.css — that is the in-app
   CRM brand kit (.lq-*, .sidebar, .kanban). The two share a lineage in
   name only: zero common selectors, and nine --custom-properties that
   collide with DIFFERENT values (--bg, --card, --page, --line, --line-d,
   --muted, --faint, --mono, --r-lg). Never load both on one page.
   ════════════════════════════════════════════════════════════════════ */
:root{--r-sm:8px;--r-md:12px;--r-lg:20px;--r-pill:999px;--ink:#18181B;--bone:#F4F0E8;--page:#EEEEF0;--card:#FBFBFC;--muted:#6E7076;--faint:#A1A1AA;--line:rgba(24,24,27,.10);--line-d:rgba(24,24,27,.18);--ocean:#3B5BDB;--ocean-lt:#8FA6F5;--signal:#EA6A2C;--night:#0A0C14;--green:#1F8A5B;--green-lt:#5FD39B;--mono:'Archivo Narrow',ui-monospace,sans-serif}
*{box-sizing:border-box;margin:0;padding:0}
/* The UA `[hidden]{display:none}` is the weakest rule there is, so ANY author
   `display` beats it and `el.hidden = true` silently does nothing. That is why
   the calculator's email gate stayed on screen after unlocking and its share
   button painted while still locked. One line, sitewide, so `hidden` means
   hidden — the pricing tabs below rely on it too. */
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;overflow-x:hidden;scroll-behavior:smooth}
body{font-family:'Public Sans',system-ui,sans-serif;background:var(--page);color:var(--ink);-webkit-font-smoothing:antialiased}
a{color:var(--ocean);text-decoration:none}a:hover{color:#2C46B0}
img{max-width:100%}
/* ── shared type ── */
.wrap{max-width:1440px;margin:0 auto;padding:0 clamp(20px,3.6vw,54px);width:100%}
.eb{display:inline-flex;align-items:center;gap:9px;font:600 .68rem/1.3 var(--mono);letter-spacing:.19em;text-transform:uppercase;color:var(--signal)}
.dsp{font-size:clamp(1.8rem,3.2vw,2.9rem);font-weight:800;letter-spacing:-.036em;line-height:1.06;text-wrap:balance}
.dsp em{font-style:italic;font-weight:500;letter-spacing:-.024em}
.dsp i{color:var(--signal);font-style:normal}
.bd{font-size:.98rem;line-height:1.66;color:var(--muted);text-wrap:pretty;max-width:62ch}
.bd+.bd{margin-top:12px}
.todo{color:var(--signal);background:rgba(234,106,44,.1);border-radius:5px;padding:1px 6px;font:600 .82em/1.5 var(--mono);letter-spacing:.03em}
.btn{display:inline-flex;align-items:center;gap:9px;white-space:nowrap;font-size:.92rem;font-weight:700;padding:13px 24px;border-radius:999px;border:1px solid transparent;cursor:pointer;transition:transform .16s,box-shadow .16s,background .16s,border-color .16s,color .16s}
.btn:hover{transform:translateY(-1px)}
.btn svg{width:15px;height:15px;flex:0 0 auto}
.slink{display:inline-flex;align-items:center;gap:8px;font-size:.88rem;font-weight:700;color:var(--ink);border-bottom:1.5px solid var(--line-d);padding-bottom:3px}
.slink:hover{color:var(--ocean);border-color:var(--ocean)}
.slink svg{width:14px;height:14px}
/* ── sky layers ── */
.sky,.rays,.stars,.glow{position:absolute;inset:0;pointer-events:none}
.rays{background:repeating-linear-gradient(90deg,rgba(255,255,255,.085) 0 1px,transparent 1px 8px);-webkit-mask-image:radial-gradient(46% 78% at 50% 76%,#000 0%,rgba(0,0,0,.6) 46%,transparent 84%);mask-image:radial-gradient(46% 78% at 50% 76%,#000 0%,rgba(0,0,0,.6) 46%,transparent 84%)}

/* ════ NAV ════ */
.phnav{position:relative;z-index:5;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;max-width:1440px;margin:0 auto;padding:20px clamp(20px,3.6vw,54px) 0;width:100%;flex:0 0 auto}
/* The brand is now the lockup ASSET, not a flex row of mark + type, so this
   sizes an <img>. Height matches the 30px inline mark it replaced; the
   lockup is 660x221, so width follows the ratio. */
.brand{display:block;height:30px;width:auto}
.nlinks{display:flex;align-items:center;justify-content:center;gap:clamp(14px,2vw,30px)}
.nlinks a{display:flex;align-items:center;gap:7px;font-size:.9rem;font-weight:500;color:rgba(255,255,255,.74);transition:color .16s;white-space:nowrap}
.nlinks a:hover,.nlinks a.on{color:#fff}
.nlinks a.on::before{content:'';width:5px;height:5px;border-radius:50%;background:var(--signal)}
.nact{display:flex;align-items:center;justify-content:flex-end;gap:2px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:999px;padding:5px;justify-self:end}
.nact .sign{font-size:.88rem;font-weight:600;color:rgba(255,255,255,.82);padding:10px 16px;border-radius:999px}
.nact .sign:hover{color:#fff}
.pill{display:inline-flex;align-items:center;gap:8px;background:#fff;color:#111;font-size:.86rem;font-weight:700;padding:10px 17px;border-radius:999px;transition:transform .16s,box-shadow .16s;white-space:nowrap}
.pill:hover{color:#111;transform:translateY(-1px);box-shadow:0 10px 26px rgba(255,255,255,.24)}
.burger{display:none;width:40px;height:40px;border-radius:12px;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.06);color:#fff;align-items:center;justify-content:center;cursor:pointer;justify-self:end}
.burger svg{width:19px;height:19px}
.ph.dk .brand{color:var(--ink)}
.ph.dk .brand .wm{color:var(--ink)}
.ph.dk .nlinks a{color:var(--muted)}
.ph.dk .nlinks a:hover,.ph.dk .nlinks a.on{color:var(--ink)}
.ph.dk .nact{background:rgba(24,24,27,.05);border-color:var(--line-d)}
.ph.dk .nact .sign{color:var(--muted)}.ph.dk .nact .sign:hover{color:var(--ink)}
.ph.dk .pill{background:var(--ink);color:#fff}
.ph.dk .pill:hover{color:#fff;box-shadow:0 12px 26px -10px rgba(24,24,27,.5)}
.ph.dk .burger{border-color:var(--line-d);background:rgba(24,24,27,.04);color:var(--ink)}

/* ════ 01 · PAGE HERO ════ */
.ph{position:relative;isolation:isolate;overflow:hidden;background:#05060C;color:var(--bone);display:flex;flex-direction:column;min-height:clamp(430px,42vw,560px)}
.ph .sky{z-index:0;background:
radial-gradient(86% 116% at 50% 126%,rgba(255,250,244,.9) 0%,rgba(255,224,190,.6) 8%,rgba(255,188,138,.5) 17%,rgba(234,106,44,.46) 28%,rgba(234,106,44,.26) 42%,rgba(234,106,44,.1) 56%,transparent 72%),
radial-gradient(80% 54% at 50% 0%,rgba(22,34,96,.82),transparent 74%),
linear-gradient(180deg,#03040A 0%,#05081A 34%,#0A1230 66%,#14173A 100%)}
.ph .sky::after{content:'';position:absolute;inset:0;background:radial-gradient(78% 118% at 50% 82%,transparent 40%,rgba(3,4,10,.62) 100%)}
.ph .stars{z-index:1;opacity:.5;background-image:radial-gradient(1.4px 1.4px at 14% 20%,#fff,transparent),radial-gradient(1.2px 1.2px at 76% 13%,#fff,transparent),radial-gradient(1.5px 1.5px at 36% 34%,#fff,transparent),radial-gradient(1.1px 1.1px at 62% 27%,#fff,transparent),radial-gradient(1.3px 1.3px at 90% 38%,#fff,transparent),radial-gradient(1.2px 1.2px at 24% 48%,#fff,transparent),radial-gradient(1.1px 1.1px at 50% 9%,#fff,transparent),radial-gradient(1.3px 1.3px at 6% 40%,#fff,transparent);-webkit-mask-image:linear-gradient(180deg,#000 0%,rgba(0,0,0,.45) 46%,transparent 68%);mask-image:linear-gradient(180deg,#000 0%,rgba(0,0,0,.45) 46%,transparent 68%)}
.ph .rays{z-index:1}
.ph .horizon{position:absolute;left:0;right:0;bottom:0;height:2px;z-index:2;background:linear-gradient(90deg,transparent,rgba(255,214,178,.46) 16%,rgba(255,246,232,.82) 50%,rgba(255,214,178,.46) 84%,transparent);box-shadow:0 0 22px 4px rgba(255,178,116,.2);pointer-events:none}
.phbody{position:relative;z-index:3;margin-top:auto;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(24px,4vw,64px);align-items:end;padding:clamp(48px,6vw,86px) clamp(20px,3.6vw,54px) clamp(30px,3.6vw,46px);max-width:1440px;margin-left:auto;margin-right:auto;width:100%}
.crumb{display:flex;align-items:center;gap:8px;font:600 .62rem/1 var(--mono);letter-spacing:.15em;text-transform:uppercase;color:rgba(255,255,255,.44)}
.crumb a{color:rgba(255,255,255,.68)}.crumb a:hover{color:#fff}
.crumb s{text-decoration:none;color:rgba(255,255,255,.28)}
.crumb b{color:#fff;font-weight:600}
.eb em,.promo em,.scl em{display:none}
.ph .eb{margin-top:clamp(18px,2.2vw,26px);color:rgba(255,255,255,.62)}
.ph .eb em{width:5px;height:5px;border-radius:50%;background:var(--signal);font-style:normal;flex:0 0 auto}
.ph .dsp{margin-top:14px;color:#fff;font-size:clamp(2rem,4.3vw,3.5rem);letter-spacing:-.04em;max-width:20ch}
.ph .lede{margin-top:clamp(14px,1.6vw,20px);max-width:56ch;font:500 .88rem/1.72 var(--mono);letter-spacing:.05em;color:rgba(255,255,255,.74);text-wrap:pretty}
.phcta{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:clamp(20px,2.4vw,28px)}
.ph .btn.primary{background:#fff;color:#12141C;box-shadow:0 10px 30px rgba(255,255,255,.18)}
.ph .btn.ghost{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.22);color:#fff}
.ph .btn.ghost:hover{background:rgba(255,255,255,.12)}
.micro{margin-top:14px;font:600 .64rem/1.5 var(--mono);letter-spacing:.15em;text-transform:uppercase;color:rgba(255,255,255,.5)}
.promo{display:flex;width:max-content;max-width:100%;align-items:center;gap:8px;font:700 .6rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--signal);background:rgba(234,106,44,.14);border:1px solid rgba(234,106,44,.34);padding:8px 12px;border-radius:999px;margin-top:16px}
.promo em{width:6px;height:6px;border-radius:50%;background:var(--signal);font-style:normal;flex:0 0 auto;animation:blink 2.4s ease-in-out infinite}
.ph .promo+.eb{margin-top:14px}
.jump{min-width:min(280px,80vw);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);border-radius:16px;padding:16px 18px 8px;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.jump .jl{font:700 .6rem/1 var(--mono);letter-spacing:.15em;text-transform:uppercase;color:rgba(255,255,255,.46)}
.jump ol{list-style:none;counter-reset:j;margin-top:10px}
.jump li{counter-increment:j;border-top:1px solid rgba(255,255,255,.1)}
.jump li:first-child{border-top:0}
.jump a{display:flex;align-items:center;gap:10px;padding:10px 0;font-size:.88rem;font-weight:600;color:rgba(255,255,255,.8)}
.jump a::before{content:'0' counter(j);font:700 .58rem/1 var(--mono);letter-spacing:.08em;color:var(--signal);flex:0 0 auto}
.jump a::after{content:'';width:6px;height:6px;border-right:1.5px solid rgba(255,255,255,.35);border-bottom:1.5px solid rgba(255,255,255,.35);transform:rotate(-45deg);margin-left:auto;transition:transform .16s}
.jump a:hover{color:#fff}.jump a:hover::after{transform:rotate(-45deg) translate(2px,-2px)}
.ph.dk{background:var(--bone);color:var(--ink)}
.ph.dk .sky{background:radial-gradient(86% 112% at 50% 124%,rgba(234,106,44,.32) 0%,rgba(234,106,44,.18) 20%,rgba(234,106,44,.07) 40%,transparent 64%),radial-gradient(78% 62% at 50% -8%,rgba(59,91,219,.13),transparent 70%),linear-gradient(180deg,#F7F4EE 0%,#F4F0E8 62%,#EFEAE0 100%)}
.ph.dk .sky::after,.ph.dk .stars{display:none}
.ph.dk .rays{background:repeating-linear-gradient(90deg,rgba(24,24,27,.075) 0 1px,transparent 1px 8px)}
.ph.dk .horizon{background:linear-gradient(90deg,transparent,rgba(234,106,44,.4) 26%,rgba(234,106,44,.68) 50%,rgba(234,106,44,.4) 74%,transparent);box-shadow:none}
.ph.dk .crumb{color:var(--faint)}
.ph.dk .crumb a{color:var(--muted)}.ph.dk .crumb a:hover{color:var(--ink)}
.ph.dk .crumb s{color:rgba(24,24,27,.24)}
.ph.dk .crumb b{color:var(--ink)}
.ph.dk .eb{color:var(--signal)}
.ph.dk .dsp{color:var(--ink)}
.ph.dk .lede{color:var(--muted)}
.ph.dk .micro{color:var(--faint)}
.ph.dk .btn.primary{background:var(--ink);color:#fff;box-shadow:0 12px 28px -12px rgba(24,24,27,.5)}
.ph.dk .btn.ghost{background:transparent;border-color:var(--line-d);color:var(--ink)}
.ph.dk .btn.ghost:hover{background:rgba(24,24,27,.045)}
.ph.dk .jump{background:var(--card);border-color:var(--line);-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:0 22px 48px -26px rgba(24,24,27,.32)}
.ph.dk .jump .jl{color:var(--faint)}
.ph.dk .jump li{border-color:var(--line)}
.ph.dk .jump a{color:var(--ink)}
.ph.dk .jump a::after{border-color:rgba(24,24,27,.3)}

/* ════ 02 · PROOF LEDGER ════ */
.lg{--bg:var(--page);--fg:var(--ink);--mu:var(--muted);--fa:var(--faint);--ln:rgba(24,24,27,.055);position:relative;background:var(--bg);color:var(--fg);padding:clamp(48px,6vw,86px) 0;overflow:hidden}
.lg.dk{--bg:var(--night);--fg:var(--bone);--mu:rgba(244,240,232,.66);--fa:rgba(244,240,232,.4);--ln:rgba(244,240,232,.09)}
.lghead{position:relative;display:flex;align-items:flex-end;gap:clamp(20px,3vw,48px);flex-wrap:wrap}
.lghead .dsp{max-width:22ch;margin-top:14px}
.lghead .side{margin-left:auto;max-width:34ch}
.lghead .side .bd{color:var(--mu);font-size:.92rem}
.lgrow{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:clamp(30px,3.8vw,52px);border-top:1px solid var(--ln)}
.lgc{position:relative;padding:clamp(22px,2.6vw,34px) clamp(14px,1.8vw,26px) clamp(6px,1vw,12px) 0}
.lgc+.lgc{border-left:1px solid var(--ln);padding-left:clamp(14px,1.8vw,26px)}
.lgc+.lgc::before{content:'';position:absolute;left:-1px;top:0;width:1px;height:46%;background:linear-gradient(180deg,var(--bg),transparent)}
.lgc .k{display:block;font:700 .6rem/1.3 var(--mono);letter-spacing:.15em;text-transform:uppercase;color:var(--fa)}
.lgc .v{display:flex;align-items:baseline;gap:2px;margin-top:14px;font-size:clamp(2.2rem,4.2vw,3.4rem);font-weight:800;letter-spacing:-.045em;line-height:1;font-variant-numeric:tabular-nums}
.lgc .v u{text-decoration:none;font-size:.44em;font-weight:700;letter-spacing:-.01em;color:var(--signal);align-self:flex-start;margin-top:.24em}
.lgc .cap{margin-top:12px;font-size:.87rem;line-height:1.55;color:var(--mu);max-width:26ch;text-wrap:pretty}
.lgc .bar{margin-top:16px;height:3px;border-radius:2px;background:var(--ln);overflow:hidden}
.lgc .bar i{display:block;height:100%;width:0;border-radius:2px;background:var(--ocean);transition:width 1.1s cubic-bezier(.22,1,.32,1)}
.lgc:nth-child(2) .bar i{background:var(--signal)}
.lgc:nth-child(4) .bar i{background:var(--green)}
.lg.dk .lgc .bar i{background:var(--ocean-lt)}
.lg.dk .lgc:nth-child(2) .bar i{background:var(--signal)}
.lg.dk .lgc:nth-child(4) .bar i{background:var(--green-lt)}
.lgfoot{position:relative;display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:clamp(24px,3vw,38px);padding-top:clamp(16px,2vw,24px);border-top:1px solid var(--ln);font:600 .66rem/1.4 var(--mono);letter-spacing:.13em;text-transform:uppercase;color:var(--fa)}
.lgfoot .slink{margin-left:auto;text-transform:none;letter-spacing:.02em;color:var(--fg);border-color:var(--ln)}
.lg.dk .lgfoot .slink:hover{color:var(--ocean-lt);border-color:var(--ocean-lt)}

/* ════ 03 · SPOTLIGHT ════ */
.sp{--bg:var(--page);--fg:var(--ink);--mu:var(--muted);--fa:var(--faint);--ln:var(--line);--cd:var(--card);background:var(--bg);color:var(--fg);padding:clamp(48px,6vw,92px) 0}
.sp.dk{--bg:var(--night);--fg:var(--bone);--mu:rgba(244,240,232,.68);--fa:rgba(244,240,232,.42);--ln:rgba(244,240,232,.14);--cd:#15161C}
.spgrid{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.12fr);gap:clamp(26px,4vw,70px);align-items:center}
.spgrid.rev>.spcopy{order:2}
.sp .dsp{margin-top:15px;max-width:20ch}
.sp .bd{margin-top:14px;color:var(--mu);max-width:46ch}
.checks{list-style:none;margin-top:clamp(18px,2.2vw,26px);display:flex;flex-direction:column;gap:2px}
.checks li{display:flex;align-items:flex-start;gap:11px;padding:11px 0;border-top:1px solid var(--ln,var(--line));font-size:.9rem;font-weight:600;line-height:1.5}
.checks li em{flex:0 0 auto;width:18px;height:18px;border-radius:50%;background:rgba(59,91,219,.12);color:var(--ocean);display:grid;place-items:center;margin-top:1px}
.sp.dk .checks li em{background:rgba(143,166,245,.18);color:var(--ocean-lt)}
.checks li em svg{width:10px;height:10px}
.checks li span{color:var(--mu,var(--muted));font-weight:500}
.sp .slink{margin-top:clamp(18px,2.2vw,24px);color:var(--fg);border-color:var(--ln)}
.sp.dk .slink:hover{color:var(--ocean-lt);border-color:var(--ocean-lt)}
.surface{position:relative;max-width:100%;isolation:isolate;padding:clamp(16px,2.2vw,30px)}
.surface::before{content:'';position:absolute;inset:0;z-index:0;border-radius:20px;border:1px solid var(--ln);background:radial-gradient(120% 118% at 50% 0%,#FCFAF7 0%,#F3EFE8 58%,#EDE8DF 100%);box-shadow:0 34px 66px -32px rgba(24,24,27,.4),0 4px 12px -6px rgba(24,24,27,.1)}
.sp.dk .surface::before{background:radial-gradient(120% 118% at 50% 0%,#1B1D28 0%,#12141D 58%,#0C0E16 100%);box-shadow:0 40px 80px -34px rgba(0,0,0,.8)}
.surface>*{position:relative;z-index:2}
.chip{position:absolute;z-index:4;background:var(--cd);border:1px solid var(--ln);border-radius:13px;padding:11px 14px;box-shadow:0 18px 40px -18px rgba(24,24,27,.42);animation:drift 7s ease-in-out infinite}
.sp.dk .chip{box-shadow:0 20px 44px -16px rgba(0,0,0,.7)}
@keyframes drift{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
.chip .ck{font:700 .54rem/1 var(--mono);letter-spacing:.13em;text-transform:uppercase;color:var(--fa)}
.chip .cv{margin-top:6px;font-size:1.02rem;font-weight:800;letter-spacing:-.03em;font-variant-numeric:tabular-nums;color:var(--fg)}
.chip.c1{left:-3%;top:auto;bottom:58%}
.chip.c2{right:-2%;bottom:-3%;animation-delay:-2.4s}
.chip.c2 .cv{color:var(--green)}
.sp.dk .chip.c2 .cv{color:var(--green-lt)}
.chip .dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--signal);margin-right:6px}

/* ════ 04 · SWITCHBOARD ════ */
.sw{--bg:var(--page);--fg:var(--ink);--mu:var(--muted);--fa:var(--faint);--ln:var(--line);--cd:var(--card);background:var(--bg);color:var(--fg);padding:clamp(48px,6vw,92px) 0}
.sw.dk{--bg:var(--night);--fg:var(--bone);--mu:rgba(244,240,232,.68);--fa:rgba(244,240,232,.42);--ln:rgba(244,240,232,.14);--cd:rgba(244,240,232,.04)}
.swtop{max-width:58ch}
.swtop .dsp{margin-top:15px;max-width:26ch}
.swtop .bd{margin-top:14px;color:var(--mu)}
.swgrid{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:clamp(16px,2vw,28px);align-items:stretch;margin-top:clamp(28px,3.6vw,46px)}
.col{background:var(--cd);border:1px solid var(--ln);border-radius:18px;padding:clamp(18px,2.2vw,26px)}
.col .ch{display:flex;align-items:center;gap:9px;font:700 .62rem/1.3 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--fa);padding-bottom:14px;border-bottom:1px solid var(--ln)}
.col .ch b{color:var(--fg);font-weight:700}
.col.now .ch em{width:7px;height:7px;border-radius:50%;background:var(--fa);font-style:normal;flex:0 0 auto}
.rowz{display:flex;flex-direction:column}
.rw{display:flex;align-items:center;gap:11px;padding:14px 0;border-bottom:1px solid var(--ln);font-size:.9rem;font-weight:600;line-height:1.4}
.rw:last-child{border-bottom:0;padding-bottom:2px}
.rw .t{font:700 .58rem/1.2 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--fa);flex:0 0 auto;min-width:52px}
.col.now .rw span:not(.t):not(.x){color:var(--fa);text-decoration:line-through;text-decoration-thickness:1px;font-weight:500}
.col.now .rw .x{margin-left:auto;flex:0 0 auto;font:700 .58rem/1.2 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--fa)}
.col.linq{background:#15161C;border-color:rgba(244,240,232,.16);color:var(--bone);box-shadow:0 30px 64px -30px rgba(24,24,27,.5)}
.sw.dk .col.linq{background:#fff;border-color:transparent;color:var(--ink);box-shadow:0 30px 70px -28px rgba(0,0,0,.8)}
.col.linq .ch{color:rgba(244,240,232,.5);border-color:rgba(244,240,232,.14)}
.col.linq .ch b{color:#fff}
.sw.dk .col.linq .ch{color:var(--faint);border-color:var(--line)}
.sw.dk .col.linq .ch b{color:var(--ink)}
.col.linq .ch em{width:7px;height:7px;border-radius:50%;background:var(--green-lt);font-style:normal;flex:0 0 auto;animation:blink 2s ease-in-out infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.35}}
.col.linq .rw{border-color:rgba(244,240,232,.12)}
.sw.dk .col.linq .rw{border-color:var(--line)}
.col.linq .rw .t{color:var(--signal)}
.col.linq .rw span:not(.t){color:#fff;font-weight:600}
.sw.dk .col.linq .rw span:not(.t){color:var(--ink)}
.col.linq .rw .ok{margin-left:auto;flex:0 0 auto;width:18px;height:18px;border-radius:50%;background:rgba(95,211,155,.18);color:var(--green-lt);display:grid;place-items:center}
.sw.dk .col.linq .rw .ok{background:rgba(31,138,91,.12);color:var(--green)}
.col.linq .rw .ok svg{width:10px;height:10px}
.arw{align-self:center;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1px solid var(--ln);background:var(--cd);color:var(--fa);flex:0 0 auto}
.arw svg{width:16px;height:16px}
.swfoot{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:clamp(22px,2.6vw,32px)}
.swfoot .note{font:600 .66rem/1.6 var(--mono);letter-spacing:.11em;text-transform:uppercase;color:var(--fa);max-width:42ch}
.swfoot .slink{margin-left:auto;color:var(--fg);border-color:var(--ln)}
.sw.dk .swfoot .slink:hover{color:var(--ocean-lt);border-color:var(--ocean-lt)}
.sw .btn.primary{margin-left:auto;background:var(--ocean);color:#fff;box-shadow:0 12px 28px -12px rgba(59,91,219,.6)}
.sw .btn.primary:hover{background:#4A68E4}

/* ════ 05 · QUOTE SPOTLIGHT ════ */
.qt{--bg:var(--bone);--fg:var(--ink);--mu:var(--muted);--fa:var(--faint);--ln:var(--line);position:relative;isolation:isolate;overflow:hidden;background:var(--bg);color:var(--fg);padding:clamp(52px,6.4vw,100px) 0}
.qt.dk{--bg:#05060C;--fg:var(--bone);--mu:rgba(244,240,232,.7);--fa:rgba(244,240,232,.44);--ln:rgba(244,240,232,.14)}
.qt .glow{z-index:0;background:radial-gradient(46% 70% at 78% 118%,rgba(234,106,44,.2),transparent 62%),radial-gradient(50% 60% at 12% -10%,rgba(59,91,219,.1),transparent 66%)}
.qt.dk .glow{background:radial-gradient(46% 76% at 78% 122%,rgba(234,106,44,.42),transparent 60%),radial-gradient(56% 66% at 14% -12%,rgba(22,34,96,.9),transparent 70%)}
.qt .rays{z-index:0;background:repeating-linear-gradient(90deg,rgba(24,24,27,.06) 0 1px,transparent 1px 8px);-webkit-mask-image:radial-gradient(50% 80% at 76% 100%,#000,transparent 78%);mask-image:radial-gradient(50% 80% at 76% 100%,#000,transparent 78%)}
.qt.dk .rays{background:repeating-linear-gradient(90deg,rgba(255,255,255,.09) 0 1px,transparent 1px 8px)}
.qtgrid{position:relative;z-index:2;display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(24px,3.6vw,56px);align-items:start}
.qtwho{display:flex;flex-direction:column;gap:14px;min-width:150px}
.qtwho img{width:clamp(84px,9vw,116px);height:clamp(84px,9vw,116px);border-radius:50%;object-fit:cover;border:2px solid rgba(255,255,255,.7);box-shadow:0 20px 44px -20px rgba(24,24,27,.5)}
.qt.dk .qtwho img{border-color:rgba(244,240,232,.28)}
.qtwho b{display:block;font-size:1rem;font-weight:800;letter-spacing:-.02em}
.qtwho span{display:block;margin-top:5px;font:600 .62rem/1.5 var(--mono);letter-spacing:.13em;text-transform:uppercase;color:var(--fa)}
.qtmark{font-size:clamp(2.6rem,5vw,4rem);line-height:.6;font-weight:800;color:var(--signal);letter-spacing:-.06em}
blockquote.big{margin-top:clamp(10px,1.4vw,18px);font-size:clamp(1.32rem,2.5vw,2.15rem);font-weight:500;letter-spacing:-.028em;line-height:1.32;max-width:36ch;text-wrap:pretty}
blockquote.big i{font-style:normal;font-weight:700;box-shadow:inset 0 -.42em 0 rgba(234,106,44,.22)}
.qt.dk blockquote.big i{box-shadow:inset 0 -.42em 0 rgba(234,106,44,.42)}
.qtstats{display:flex;gap:clamp(20px,3vw,44px);flex-wrap:wrap;margin-top:clamp(24px,3vw,38px);padding-top:clamp(18px,2.2vw,26px);border-top:1px solid var(--ln)}
.qtstats div b{display:block;font-size:clamp(1.24rem,2vw,1.7rem);font-weight:800;letter-spacing:-.035em;font-variant-numeric:tabular-nums}
.qtstats div span{display:block;margin-top:6px;font:600 .6rem/1.4 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--fa)}
.qtstats div b i{font-style:normal;color:var(--signal)}
.qt .slink{margin-top:clamp(20px,2.4vw,28px);color:var(--fg);border-color:var(--ln)}
.qt .slink:hover{color:var(--signal);border-color:var(--signal)}

/* ════ BAND (generic light / night section) ════ */
.band{position:relative;--bg:var(--page);--fg:var(--ink);--mu:var(--muted);--fa:var(--faint);--ln:var(--line);--cd:var(--card);background:var(--page);color:var(--ink);padding:clamp(48px,6vw,92px) 0}
.band.night{--bg:var(--night);--fg:var(--bone);--mu:rgba(244,240,232,.68);--fa:rgba(244,240,232,.42);--ln:rgba(244,240,232,.14);--cd:rgba(244,240,232,.05);background:var(--night);color:var(--bone)}
.band.bone{background:var(--bone)}
.band.night .dsp{color:#fff}
.band.night .bd{color:rgba(244,240,232,.72)}
.band .dsp{margin-top:15px}
.band .bd{margin-top:14px}
.bhead{max-width:60ch}
.bsplit{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.06fr);gap:clamp(26px,4vw,64px);align-items:center}

/* ════ MOCK PRIMITIVES (product surfaces) ════ */
.mock{background:#fff;border:1px solid rgba(24,24,27,.09);border-radius:14px;overflow:hidden;box-shadow:0 18px 44px -26px rgba(24,24,27,.34)}
.sp.dk .mock,.band.night .mock{background:#15161C;border-color:rgba(244,240,232,.13);box-shadow:0 24px 54px -24px rgba(0,0,0,.7)}
.mbar{display:flex;align-items:center;gap:6px;padding:10px 13px;border-bottom:1px solid rgba(24,24,27,.08);background:linear-gradient(#FDFDFE,#F6F6F8)}
.sp.dk .mbar,.band.night .mbar{background:#1B1D26;border-color:rgba(244,240,232,.1)}
.mbar i{width:8px;height:8px;border-radius:50%;background:#E1E1E5;flex:0 0 auto}
.sp.dk .mbar i,.band.night .mbar i{background:#33353F}
.mbar .u{margin-left:8px;flex:1;min-width:0;height:20px;border-radius:6px;background:rgba(24,24,27,.05);display:flex;align-items:center;padding:0 9px;font:600 .6rem/1 var(--mono);letter-spacing:.05em;color:var(--faint);white-space:nowrap;overflow:hidden}
.sp.dk .mbar .u,.band.night .mbar .u{background:rgba(244,240,232,.07);color:rgba(244,240,232,.5)}
.mbar .tg{margin-left:auto;font:700 .55rem/1 var(--mono);letter-spacing:.11em;text-transform:uppercase;color:var(--green);background:rgba(31,138,91,.1);padding:5px 8px;border-radius:6px;flex:0 0 auto}
.mpad{padding:clamp(13px,1.5vw,18px)}
.mh{display:flex;align-items:center;gap:9px;font:700 .6rem/1.3 var(--mono);letter-spacing:.13em;text-transform:uppercase;color:var(--faint)}
.sp.dk .mh,.band.night .mh{color:rgba(244,240,232,.45)}
.mh b{color:var(--ink);font-weight:700;letter-spacing:-.01em;font-size:.86rem;text-transform:none;font-family:'Public Sans'}
.sp.dk .mh b,.band.night .mh b{color:#fff}
.mh .r{margin-left:auto;color:var(--ocean)}
.sp.dk .mh .r,.band.night .mh .r{color:var(--ocean-lt)}
/* page tiles */
.mtiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-top:13px}
.mtile{border:1px solid rgba(24,24,27,.09);border-radius:10px;padding:11px;background:#FCFCFD;min-width:0}
.sp.dk .mtile,.band.night .mtile{background:rgba(244,240,232,.05);border-color:rgba(244,240,232,.11)}
.mtile .tn{font:700 .52rem/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--faint)}
.mtile b{display:block;margin-top:7px;font-size:.76rem;font-weight:700;letter-spacing:-.012em;line-height:1.3}
.sp.dk .mtile b,.band.night .mtile b{color:#fff}
.mtile .ln{margin-top:8px;display:flex;flex-direction:column;gap:4px}
.mtile .ln i{height:3px;border-radius:2px;background:rgba(24,24,27,.1)}
.sp.dk .mtile .ln i,.band.night .mtile .ln i{background:rgba(244,240,232,.14)}
.mtile .ln i:nth-child(2){width:72%}
.mtile.add{border-style:dashed;background:transparent;display:grid;place-items:center;color:var(--faint);font:700 .58rem/1.4 var(--mono);letter-spacing:.1em;text-transform:uppercase;text-align:center}
.mtile.bk{background:rgba(59,91,219,.06);border-color:rgba(59,91,219,.24)}
.mtile.bk .tn{color:var(--ocean)}
/* data rows */
.mrows{margin-top:12px;display:flex;flex-direction:column}
.mrow{display:flex;align-items:center;gap:11px;padding:11px 0;border-top:1px solid rgba(24,24,27,.08);font-size:.82rem;font-weight:600;min-width:0}
.sp.dk .mrow,.band.night .mrow{border-color:rgba(244,240,232,.1);color:var(--bone)}
.mrow:first-child{border-top:0}
.mrow .kw{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mrow .pos{margin-left:auto;font:700 .74rem/1 var(--mono);color:var(--faint);flex:0 0 auto;font-variant-numeric:tabular-nums}
.mrow .up{flex:0 0 auto;display:inline-flex;align-items:center;gap:4px;font:800 .62rem/1 var(--mono);letter-spacing:.06em;color:var(--green);background:rgba(31,138,91,.1);padding:5px 7px;border-radius:6px}
.sp.dk .mrow .up,.band.night .mrow .up{color:var(--green-lt);background:rgba(95,211,155,.14)}
.mrow .act{margin-left:auto;display:flex;gap:6px;flex:0 0 auto}
.mrow .act button{border:0;cursor:pointer;font:700 .58rem/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;padding:7px 10px;border-radius:7px;background:rgba(24,24,27,.06);color:var(--muted)}
.sp.dk .mrow .act button,.band.night .mrow .act button{background:rgba(244,240,232,.08);color:rgba(244,240,232,.6)}
.mrow .act button.ok{background:var(--ocean);color:#fff}
.mrow .act button.ok:hover{background:#4A68E4}
.mrow .st{margin-left:auto;flex:0 0 auto;font:700 .58rem/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--signal)}
/* stat grid */
.mstat{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-top:13px}
.mstat div{border:1px solid rgba(24,24,27,.08);border-radius:10px;padding:11px}
.sp.dk .mstat div,.band.night .mstat div{border-color:rgba(244,240,232,.11);background:rgba(244,240,232,.04)}
.mstat span{display:block;font:700 .5rem/1.3 var(--mono);letter-spacing:.11em;text-transform:uppercase;color:var(--faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mstat b{display:block;margin-top:6px;font-size:1.14rem;font-weight:800;letter-spacing:-.032em;font-variant-numeric:tabular-nums}
.band.night .mstat b,.sp.dk .mstat b{color:#fff}
.mstat b u{text-decoration:none;font-size:.6em;color:var(--signal)}
/* slot picker */
.mslots{margin-top:13px;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px}
.mslots .d{aspect-ratio:1;border-radius:8px;display:grid;place-items:center;font:700 .68rem/1 var(--mono);color:var(--muted);background:rgba(24,24,27,.04)}
.sp.dk .mslots .d,.band.night .mslots .d{background:rgba(244,240,232,.06);color:rgba(244,240,232,.62)}
.mslots .d.hd{background:transparent;font-size:.52rem;letter-spacing:.08em;text-transform:uppercase;color:var(--faint)}
.mslots .d.on{background:var(--ocean);color:#fff}
.mslots .d.free{box-shadow:inset 0 0 0 1px rgba(59,91,219,.3);color:var(--ocean)}
.mtimes{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px}
.mtimes span{font:700 .66rem/1 var(--mono);letter-spacing:.06em;padding:9px 11px;border-radius:8px;border:1px solid rgba(24,24,27,.12);color:var(--ink)}
.sp.dk .mtimes span,.band.night .mtimes span{border-color:rgba(244,240,232,.16);color:var(--bone)}
.mtimes span.on{background:var(--ink);border-color:var(--ink);color:#fff}
.sp.dk .mtimes span.on,.band.night .mtimes span.on{background:#fff;color:var(--ink);border-color:#fff}
.mnote{margin-top:12px;display:flex;align-items:center;gap:8px;font:600 .68rem/1.4 var(--mono);letter-spacing:.09em;text-transform:uppercase;color:var(--faint)}
.mnote em{width:6px;height:6px;border-radius:50%;background:var(--green);font-style:normal;flex:0 0 auto}

/* ════ POSTS (social) ════ */
.posts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.6vw,20px);margin-top:clamp(26px,3.4vw,42px)}
.post{background:var(--card);border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:0 1px 2px rgba(24,24,27,.05);transition:transform .2s,box-shadow .2s}
.post:hover{transform:translateY(-3px);box-shadow:0 18px 40px -20px rgba(24,24,27,.28)}
.band.night .post{background:rgba(244,240,232,.04);border-color:rgba(244,240,232,.13)}
.post .ig{display:flex;align-items:center;gap:8px;padding:11px 13px;border-bottom:1px solid var(--line);font:700 .6rem/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--faint)}
.band.night .post .ig{border-color:rgba(244,240,232,.1);color:rgba(244,240,232,.45)}
.post .ig em{width:20px;height:20px;border-radius:6px;background:linear-gradient(135deg,#EA6A2C,#B32E7A);flex:0 0 auto}
.post .ig .st{margin-left:auto;color:var(--ocean)}
.band.night .post .ig .st{color:var(--ocean-lt)}
.post .im{aspect-ratio:4/3;background:rgba(24,24,27,.05);position:relative}
.band.night .post .im{background:rgba(244,240,232,.06)}
.post .im image-slot{position:absolute;inset:0}
.post .cap2{padding:13px 14px 15px;font-size:.85rem;line-height:1.55;color:var(--muted)}
.band.night .post .cap2{color:rgba(244,240,232,.7)}
.post .cap2 b{color:var(--ink);font-weight:700}
.band.night .post .cap2 b{color:#fff}
.post .tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px;font:700 .58rem/1 var(--mono);letter-spacing:.06em;color:var(--ocean)}
.band.night .post .tags{color:var(--ocean-lt)}

/* ════ CHAIN (numbered steps) ════ */
.chain{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(12px,1.2vw,16px);margin-top:clamp(26px,3.4vw,44px)}
.chain.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.step{position:relative;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:20px 19px 22px;display:flex;flex-direction:column;transition:transform .2s,box-shadow .2s}
.step:hover{transform:translateY(-3px);box-shadow:0 16px 36px -18px rgba(24,24,27,.26)}
.band.night .step{background:rgba(244,240,232,.05);border-color:rgba(244,240,232,.13)}
.step .n{display:flex;align-items:center;gap:8px;font:700 .66rem/1 var(--mono);letter-spacing:.14em;color:var(--faint)}
.step .n::after{content:'';flex:1;height:1px;background:var(--line)}
.band.night .step .n::after{background:rgba(244,240,232,.14)}
.step .n em{width:6px;height:6px;border-radius:50%;background:var(--ocean);font-style:normal;flex:0 0 auto}
.step:last-child .n em{background:var(--signal)}
.step h3{margin:15px 0 0;font-size:1.04rem;font-weight:800;letter-spacing:-.02em}
.band.night .step h3{color:#fff}
.step p{margin:9px 0 0;font-size:.87rem;line-height:1.58;color:var(--muted);text-wrap:pretty}
.band.night .step p{color:rgba(244,240,232,.7)}

/* ════ SWAP CARDS (plugin out, agent in — divs only, no headings) ════ */
.swaps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(12px,1.2vw,16px);margin-top:clamp(26px,3.4vw,44px)}
.swap{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:20px 19px 22px;transition:transform .2s,box-shadow .2s}
.swap:hover{transform:translateY(-3px);box-shadow:0 16px 36px -18px rgba(24,24,27,.26)}
.band.night .swap{background:rgba(244,240,232,.05);border-color:rgba(244,240,232,.13)}
.swap .sw2{display:flex;align-items:center;gap:9px;font:700 .62rem/1.3 var(--mono);letter-spacing:.11em;text-transform:uppercase}
.swap .sw2 .out{color:var(--faint);text-decoration:line-through;text-decoration-thickness:1px}
.band.night .swap .sw2 .out{color:rgba(244,240,232,.4)}
.swap .sw2 svg{width:13px;height:13px;color:var(--signal);flex:0 0 auto}
.swap .sw2 .in{color:var(--ocean)}
.band.night .swap .sw2 .in{color:var(--ocean-lt)}
.swap .sn{margin:14px 0 0;font-size:1.02rem;font-weight:800;letter-spacing:-.02em}
.band.night .swap .sn{color:#fff}
.swap p{margin:9px 0 0;font-size:.87rem;line-height:1.58;color:var(--muted);text-wrap:pretty}
.band.night .swap p{color:rgba(244,240,232,.7)}
/* checks in a band context */
.band.night .checks li{border-color:rgba(244,240,232,.14);color:var(--bone)}
.band.night .checks li span{color:rgba(244,240,232,.66)}
.band.night .checks li em{background:rgba(143,166,245,.18);color:var(--ocean-lt)}
.band .checks{max-width:52ch}
/* quoted visitor line inside a mock */
.mquote{margin-top:13px;background:rgba(59,91,219,.06);border:1px solid rgba(59,91,219,.18);border-radius:12px;border-bottom-left-radius:4px;padding:12px 14px;font-size:.86rem;font-weight:600;line-height:1.45;color:var(--ink)}
.sp.dk .mquote,.band.night .mquote{background:rgba(143,166,245,.1);border-color:rgba(143,166,245,.22);color:#fff}

/* ════ GUARDS (3-up cards) ════ */
.guards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.6vw,20px);margin-top:clamp(26px,3.4vw,42px)}
.guard{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:22px}
.band.night .guard{background:rgba(244,240,232,.05);border-color:rgba(244,240,232,.13)}
.guard .gi{width:34px;height:34px;border-radius:10px;background:rgba(59,91,219,.1);color:var(--ocean);display:grid;place-items:center}
.band.night .guard .gi{background:rgba(143,166,245,.16);color:var(--ocean-lt)}
.guard .gi svg{width:17px;height:17px}
.guard h3{margin:15px 0 0;font-size:1.02rem;font-weight:800;letter-spacing:-.02em}
.band.night .guard h3{color:#fff}
.guard p{margin:9px 0 0;font-size:.88rem;line-height:1.6;color:var(--muted);text-wrap:pretty}
.band.night .guard p{color:rgba(244,240,232,.7)}

/* ════ ROADMAP ════ */
.road{margin-top:clamp(24px,3vw,38px);border-top:1px solid rgba(244,240,232,.14);max-width:96ch}
.band:not(.night) .road{border-color:var(--line)}
.road .ri{display:flex;align-items:flex-start;gap:clamp(14px,2vw,26px);padding:18px 0;border-bottom:1px solid rgba(244,240,232,.14)}
.band:not(.night) .road .ri{border-color:var(--line)}
.road .ri .rn{font:700 .62rem/1.6 var(--mono);letter-spacing:.13em;text-transform:uppercase;color:var(--signal);flex:0 0 auto;min-width:64px}
.road .ri b{display:block;font-size:1rem;font-weight:800;letter-spacing:-.02em;color:#fff}
.band:not(.night) .road .ri b{color:var(--ink)}
.road .ri p{margin:7px 0 0;font-size:.89rem;line-height:1.6;color:rgba(244,240,232,.7);max-width:70ch;text-wrap:pretty}
.band:not(.night) .road .ri p{color:var(--muted)}

/* ════ PLANS ════ */
.plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.8vw,22px);margin-top:clamp(26px,3.4vw,42px);max-width:1240px}
.plan{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:clamp(22px,2.4vw,30px);display:flex;flex-direction:column}
.plan.hot{background:#15161C;border-color:transparent;color:var(--bone);box-shadow:0 30px 64px -30px rgba(24,24,27,.55)}
.plan .pn{display:flex;align-items:center;gap:9px;font:700 .64rem/1 var(--mono);letter-spacing:.15em;text-transform:uppercase;color:var(--faint)}
.plan.hot .pn{color:rgba(244,240,232,.5)}
.plan .pn .bdg{margin-left:auto;font-size:.55rem;padding:5px 8px;border-radius:6px;background:var(--signal);color:#fff;letter-spacing:.1em}
.plan .pr{display:flex;align-items:baseline;gap:6px;margin-top:16px;font-size:clamp(2rem,3.4vw,2.8rem);font-weight:800;letter-spacing:-.045em;line-height:1}
.plan.hot .pr{color:#fff}
.plan .pr span{font:600 .68rem/1 var(--mono);letter-spacing:.11em;text-transform:uppercase;color:var(--faint)}
.plan.hot .pr span{color:rgba(244,240,232,.5)}
.plan ul{list-style:none;margin-top:18px;display:flex;flex-direction:column;gap:2px;flex:1}
.plan li{display:flex;align-items:flex-start;gap:10px;padding:10px 0;border-top:1px solid var(--line);font-size:.88rem;line-height:1.5;color:var(--muted)}
.plan.hot li{border-color:rgba(244,240,232,.12);color:rgba(244,240,232,.76)}
.plan li em{flex:0 0 auto;width:16px;height:16px;border-radius:50%;background:rgba(31,138,91,.12);color:var(--green);display:grid;place-items:center;margin-top:2px}
.plan.hot li em{background:rgba(95,211,155,.16);color:var(--green-lt)}
.plan li em svg{width:9px;height:9px}
.plan .btn{margin-top:20px;justify-content:center}
.plan .btn.primary{background:var(--ink);color:#fff}
.plan.hot .btn.primary{background:#fff;color:#12141C}
.plans+.slink{margin-top:clamp(18px,2.2vw,26px)}

/* ════ SHOWCASE · site-card rail, right of the hero copy ════ */
.showcase{position:relative;z-index:4;margin-top:calc(-1 * clamp(180px,21vw,310px));pointer-events:none}
.showcase .scrail,.showcase .scfoot{pointer-events:auto}
.scfoot .scl{flex:0 1 auto}
.scstage{max-width:1440px;margin:0 auto;width:100%;padding-left:clamp(20px,3.6vw,54px)}
.scfoot{max-width:1440px;margin:0 auto;width:100%;display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:14px clamp(20px,3.6vw,54px) 0}
.scfoot .scl{font:700 .62rem/1.4 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--faint)}
.scsw{margin-left:auto;display:flex;gap:2px;background:rgba(24,24,27,.05);border:1px solid var(--line);border-radius:999px;padding:3px}
.scsw button{border:0;background:transparent;font:700 .58rem/1 var(--mono);letter-spacing:.13em;text-transform:uppercase;color:var(--muted);padding:8px 13px;border-radius:999px;cursor:pointer;transition:background .18s,color .18s}
.scsw button:hover{color:var(--ink)}
.scsw button[aria-pressed=true]{background:var(--ink);color:#fff}
.scnav{display:flex;gap:7px}
.scfoot .scnav{margin-left:auto}
.scnav button{width:32px;height:32px;border-radius:50%;border:1px solid var(--line-d);background:transparent;color:var(--ink);display:grid;place-items:center;cursor:pointer;transition:background .16s,border-color .16s}
.scnav button:hover{background:rgba(24,24,27,.05)}
.scnav button svg{width:14px;height:14px}
.scrail{display:flex;gap:clamp(12px,1.4vw,20px);overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;scroll-behavior:smooth;scroll-padding-left:26px;padding:30px 0 52px 26px;-ms-overflow-style:none;scrollbar-width:none;cursor:grab;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 26px,#000 calc(100% - 54px),transparent);mask-image:linear-gradient(90deg,transparent 0,#000 26px,#000 calc(100% - 54px),transparent)}
.scrail::-webkit-scrollbar{display:none}
.scrail::after{content:'';flex:0 0 clamp(20px,3.6vw,54px)}
.scrail{margin-right:calc(-1 * max((100vw - 1440px) / 2,0px))}
.scrail.drag{cursor:grabbing;scroll-behavior:auto;scroll-snap-type:none}
.scard{position:relative;z-index:1;flex:0 0 auto;width:clamp(178px,19vw,244px);scroll-snap-align:center;display:flex;flex-direction:column;gap:11px}
.scframe{position:relative;display:flex;flex-direction:column;aspect-ratio:3/4.1;background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 34px 62px -28px rgba(3,4,10,.7),0 4px 14px -5px rgba(3,4,10,.45),0 0 0 1px rgba(255,255,255,.1);transition:transform .34s cubic-bezier(.34,1.14,.44,1),box-shadow .34s}
.scard:hover{z-index:6}
.scard:hover .scframe{transform:translateY(-8px);box-shadow:0 50px 80px -30px rgba(3,4,10,.75),0 6px 18px -5px rgba(3,4,10,.5),0 0 0 1px rgba(255,255,255,.18)}
.scbar{flex:0 0 auto;display:flex;align-items:center;gap:5px;padding:9px 11px;border-bottom:1px solid rgba(24,24,27,.08);background:linear-gradient(#FDFDFE,#F5F5F7)}
.scbar i{width:6px;height:6px;border-radius:50%;background:#E3E3E7;flex:0 0 auto}
.scbar .u{margin-left:6px;flex:1;min-width:0;height:16px;border-radius:5px;background:rgba(24,24,27,.05);display:flex;align-items:center;padding:0 8px;font:600 .52rem/1 var(--mono);letter-spacing:.05em;color:var(--faint);white-space:nowrap;overflow:hidden}
.scscreen{position:relative;flex:1;min-height:0;background:var(--bone)}
.scscreen image-slot{position:absolute;inset:0}
.scsoon{position:absolute;inset:0;z-index:2;display:grid;place-items:center;background:radial-gradient(120% 100% at 50% 118%,#1E2030 0%,#12141C 60%);color:rgba(244,240,232,.9);pointer-events:none;font:700 .8rem/1 var(--mono);letter-spacing:.22em;text-transform:uppercase}
image-slot[data-filled]+.scsoon{display:none}
.scmeta{padding-left:2px;transition:opacity .2s}
.scmeta b{display:block;font-size:.84rem;font-weight:800;letter-spacing:-.02em;color:var(--ink)}
.scmeta span{display:block;margin-top:5px;font:600 .56rem/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--faint)}
/* version B · fanned deck */
.showcase.vb{margin-top:calc(-1 * clamp(150px,18vw,270px))}
.showcase.vb .scrail{gap:0;padding-top:34px;padding-bottom:72px}
.showcase.vb .scard{width:clamp(210px,24vw,310px)}
.showcase.vb .scard+.scard{margin-left:calc(-1 * clamp(52px,6vw,96px))}
.showcase.vb .scframe{aspect-ratio:4/3.1;transform:rotate(-1.7deg)}
.showcase.vb .scard:nth-child(even) .scframe{transform:rotate(1.5deg) translateY(10px)}
.showcase.vb .scard:hover .scframe,.showcase.vb .scard:nth-child(even):hover .scframe{transform:translateY(-12px) rotate(0deg) scale(1.035)}
.showcase.vb .scmeta{position:absolute;top:100%;left:2px;right:0;padding-top:14px;opacity:0;pointer-events:none}
.showcase.vb .scard:hover .scmeta{opacity:1}
.lg.below-showcase{padding-top:clamp(22px,2.6vw,40px)}
.ph.with-showcase .phbody{padding-bottom:clamp(60px,7vw,110px)}
@media (min-width:1081px){.scstage{padding-left:calc(clamp(20px,3.6vw,54px) + 50%)}
.ph.with-showcase .phbody{padding-bottom:calc(clamp(80px,8vw,116px) + 52px)}
.showcase,.showcase.vb{margin-top:calc(-1 * clamp(80px,8vw,116px))}
.scfoot{position:absolute;top:-20px;bottom:6px;left:50%;transform:translateX(-50%);max-width:1440px;width:100%;padding:0 clamp(20px,3.6vw,54px);display:flex;flex-direction:column;align-items:flex-end;justify-content:space-between;gap:14px;pointer-events:none}
.scfoot .scl,.scfoot .scnav{pointer-events:auto}
.scfoot .scl{max-width:40%;color:rgba(255,255,255,.55)}
.scfoot .scnav{margin-left:0}
.lg.below-showcase{margin-top:calc(-1 * clamp(172px,13vw,186px));padding-top:0}
.lg.below-showcase .lghead{display:block}
.lg.below-showcase .lghead .side{margin-left:0;margin-top:18px;max-width:44ch}
.lg.below-showcase .lgrow{margin-top:clamp(36px,4.2vw,58px)}}
@media (max-width:1080px){.showcase,.showcase.vb{margin-top:calc(-1 * clamp(56px,8vw,110px))}}
@media (max-width:640px){
.scfoot{padding-left:22px}
.scfoot .scl{font-size:.55rem;letter-spacing:.12em}
.scard{width:clamp(150px,44vw,182px)}
.showcase.vb .scard{width:clamp(190px,58vw,240px)}
}

/* ════ FAQ ════ */
.faq{margin-top:clamp(24px,3vw,38px);border-top:1px solid var(--line);max-width:88ch}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:19px 40px 19px 0;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary h3{font-size:1.04rem;font-weight:700;letter-spacing:-.02em}
.faq summary::after{content:'';position:absolute;right:8px;top:50%;width:9px;height:9px;border-right:2px solid var(--faint);border-bottom:2px solid var(--faint);transform:translateY(-70%) rotate(45deg);transition:transform .22s}
.faq details[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
.faq details p{margin:0 0 20px;font-size:.92rem;line-height:1.65;color:var(--muted);max-width:74ch;text-wrap:pretty}

/* ════ FINAL CTA BAND ════ */
.ctawrap{background:var(--page);padding:clamp(34px,5vw,74px) 0 0}
.ctaband{position:relative;isolation:isolate;overflow:hidden;background:#05060C;border-radius:clamp(20px,2.2vw,30px) clamp(20px,2.2vw,30px) 0 0;padding:clamp(56px,7.4vw,104px) clamp(20px,3.6vw,48px)}
.ctaband::before{content:'';position:absolute;left:0;right:0;top:0;height:2px;z-index:2;background:linear-gradient(90deg,transparent,rgba(255,214,178,.46) 16%,rgba(255,246,232,.82) 50%,rgba(255,214,178,.46) 84%,transparent);box-shadow:0 0 22px 4px rgba(255,178,116,.25);pointer-events:none}
.ctaband>.sky{background:
radial-gradient(86% 116% at 50% -26%,rgba(255,250,244,.9) 0%,rgba(255,224,190,.6) 8%,rgba(255,188,138,.5) 17%,rgba(234,106,44,.46) 28%,rgba(234,106,44,.26) 42%,rgba(234,106,44,.1) 56%,transparent 72%),
radial-gradient(80% 54% at 50% 100%,rgba(22,34,96,.82),transparent 74%),
linear-gradient(0deg,#03040A 0%,#05081A 34%,#0A1230 66%,#14173A 100%)}
.ctaband>.rays{-webkit-mask-image:radial-gradient(46% 78% at 50% 24%,#000 0%,rgba(0,0,0,.6) 46%,transparent 84%);mask-image:radial-gradient(46% 78% at 50% 24%,#000 0%,rgba(0,0,0,.6) 46%,transparent 84%)}
.ctaband>.sky,.ctaband>.rays,.ctaband>.stars{border-radius:inherit}
.ctaband .inner{position:relative;z-index:3;max-width:1440px;margin:0 auto;display:flex;flex-direction:column;align-items:center;text-align:center}
.ctaband .eb{color:rgba(255,255,255,.62)}
.ctaband .dsp{margin-top:16px;max-width:20ch;color:#fff;font-size:clamp(2rem,3.9vw,3.4rem)}
.ctaband .bd{color:rgba(255,255,255,.72);max-width:46ch}
.ctaband .micro{color:rgba(255,255,255,.5)}

/* ════ FOOTER ════ */
.foot2{background:var(--night);color:var(--bone);padding:clamp(44px,5vw,72px) 0 clamp(28px,3vw,40px);border-top:1px solid rgba(244,240,232,.1)}
.fgrid{display:grid;grid-template-columns:1.6fr repeat(3,1fr);gap:clamp(20px,3vw,44px)}
.fcol .fl{font:700 .64rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:rgba(244,240,232,.44);margin-bottom:14px}
.fcol a{display:block;font-size:.88rem;color:rgba(244,240,232,.76);padding:5px 0}
.fcol a:hover{color:#fff}
.fbrand{display:flex;align-items:center;gap:10px;margin-bottom:14px}
/* Wordmark asset, standing alone — it carries its own orange period. */
.fbrand .wm{display:block;height:24px;width:auto}
.fnote{font-size:.86rem;line-height:1.6;color:rgba(244,240,232,.6);max-width:36ch}
.fbot{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:clamp(30px,3.4vw,46px);padding-top:20px;border-top:1px solid rgba(244,240,232,.1);font-size:.8rem;color:rgba(244,240,232,.46)}
.fbot .fl2{display:flex;gap:16px;margin-left:auto;flex-wrap:wrap}
.fbot a{color:rgba(244,240,232,.6)}
.fbot a:hover{color:#fff}

/* ════ RESPONSIVE ════ */
@media (max-width:1080px){
.nlinks,.nact{display:none}
.burger{display:flex}
.phnav{grid-template-columns:1fr auto}
.ph{min-height:0}
.phbody{grid-template-columns:minmax(0,1fr);align-items:start;gap:26px}
.jump{min-width:0;width:100%;max-width:420px}
.lgrow{grid-template-columns:repeat(2,minmax(0,1fr))}
.lgc:nth-child(3){border-left:0;padding-left:0}
.lgc:nth-child(3)::before{display:none}
.lgc:nth-child(3),.lgc:nth-child(4){border-top:1px solid var(--ln);margin-top:-1px}
.spgrid,.bsplit{grid-template-columns:minmax(0,1fr);gap:30px}
.spgrid>.spcopy,.spgrid.rev>.spcopy{order:2}
.swgrid{grid-template-columns:minmax(0,1fr);gap:14px}
.arw{transform:rotate(90deg);justify-self:center}
.qtgrid{grid-template-columns:minmax(0,1fr)}
.qtwho{flex-direction:row;align-items:center;gap:16px}
.chain{grid-template-columns:repeat(2,minmax(0,1fr))}
.swaps{grid-template-columns:repeat(2,minmax(0,1fr))}
.plans{grid-template-columns:repeat(2,minmax(0,1fr))}
.fgrid{grid-template-columns:1fr 1fr;gap:28px}
}
@media (max-width:640px){
.phbody{padding:40px 20px 30px}
.ph .dsp{font-size:clamp(1.86rem,8.4vw,2.5rem);max-width:none}
.ph .lede{font-size:.84rem}
.phcta .btn{flex:1;justify-content:center}
.lgrow{grid-template-columns:minmax(0,1fr)}
.lgc,.lgc+.lgc{border-left:0;padding-left:0;padding-right:0;border-top:1px solid var(--ln);margin-top:-1px}
.lgc+.lgc::before{display:none}
.lgc:first-child{margin-top:0}
.lgc .v{font-size:2.5rem}
.lghead .side{margin-left:0}
.chip.c1{left:0;top:auto;bottom:62%}
.chip.c2{right:0;bottom:-2%}
.mtiles,.mstat{grid-template-columns:repeat(2,minmax(0,1fr))}
.posts,.guards,.chain,.chain.three,.plans,.swaps{grid-template-columns:minmax(0,1fr)}
.qtstats{gap:18px 26px}
.road .ri{flex-direction:column;gap:6px}
.ctaband{padding-left:20px;padding-right:20px}
.ctaband .inner{align-items:flex-start;text-align:left}
.ctaband .dsp,.ctaband .bd{max-width:none}
.fgrid{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ══════════════════════════════════════════════════════════════════
   SITE LAYER — added for the full-site build (WEBSITE/)
   Overrides sit at the end of the file on purpose: later wins.
   ══════════════════════════════════════════════════════════════════ */

/* ── announcement label · replaces the pill ──────────────────────────
   A masthead rule, not a capsule: signal bar, mono smallcaps, hairline
   trailing off. No fill, no radius, no blinking dot. ── */
.promo{display:flex;align-items:center;gap:13px;width:100%;max-width:min(560px,100%);padding:0;background:none;border:0;border-radius:0;font:700 .625rem/1 var(--mono);letter-spacing:.22em;text-transform:uppercase;color:rgba(255,255,255,.9);animation:none}
.promo::before{content:'';width:2px;height:14px;background:var(--signal);flex:0 0 auto;border-radius:1px}
.promo::after{content:'';flex:1 1 auto;min-width:24px;height:1px;background:linear-gradient(90deg,rgba(255,255,255,.28),transparent)}
.promo em{display:none}
.promo u{text-decoration:none;color:var(--signal)}
.promo.ink{color:rgba(24,24,27,.72)}
.promo.ink::after{background:linear-gradient(90deg,var(--line-d),transparent)}

/* ══ STUB PAGES — the page exists, is linked, and states what copy it needs ══ */
.stub{background:var(--bone);padding:clamp(52px,7vw,92px) 0 clamp(56px,8vw,104px)}
.stubhead{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:26px;padding-bottom:26px;border-bottom:1px solid var(--line-d)}
.stubhead .dsp{max-width:20ch}
.stubgrid{display:grid;grid-template-columns:1.15fr 1fr;gap:clamp(28px,4vw,64px);margin-top:clamp(30px,4vw,48px);align-items:start}
.slab{font:700 .64rem/1 var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin-bottom:18px}
.plan-list{list-style:none;counter-reset:s}
.plan-list li{counter-increment:s;display:flex;gap:16px;align-items:baseline;padding:13px 0;border-bottom:1px solid var(--line);font-size:1rem;font-weight:600;letter-spacing:-.012em}
.plan-list li::before{content:counter(s,decimal-leading-zero);font:700 .68rem/1 var(--mono);letter-spacing:.1em;color:var(--faint);flex:0 0 22px}
.uniq{background:var(--night);color:#fff;border-radius:20px;padding:clamp(24px,2.8vw,34px);box-shadow:0 26px 60px -30px rgba(10,12,20,.7)}
.uniq .slab{color:rgba(255,255,255,.42);margin-bottom:14px}
.uniq p{font-size:1.06rem;line-height:1.5;font-weight:600;letter-spacing:-.018em;color:#fff;text-wrap:pretty}
.uniq .hair{height:1px;background:rgba(255,255,255,.14);margin:22px 0}
.uniq .cap{font-size:.86rem;line-height:1.6;color:rgba(255,255,255,.56)}
.asks{margin-top:clamp(34px,4.4vw,56px);padding-top:clamp(28px,3.4vw,40px);border-top:2px solid var(--ink)}
.askgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2px;margin-top:20px;background:var(--line);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.ask{background:var(--card);padding:18px 20px;display:flex;gap:13px;align-items:flex-start}
.ask i{flex:0 0 auto;width:7px;height:7px;border-radius:50%;background:var(--signal);margin-top:7px}
.ask span{font-size:.94rem;line-height:1.5;font-weight:500;color:var(--ink);text-wrap:pretty}
.stubcta{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin-top:clamp(30px,3.6vw,44px)}
.stubcta .btn.primary{background:var(--ink);color:#fff}
.stubcta .btn.primary:hover{background:#000}
@media (max-width:900px){.stubgrid{grid-template-columns:1fr}.npg{grid-template-columns:1fr}}
@media (max-width:1080px){.npanel{display:none}}

/* ══ HUMAN SITEMAP (/sitemap) ══
   Its own vocabulary rather than the footer's. The anatomy matches `.npg a`
   — a label over its URL — but the colours cannot be reused: .npg is the dark
   nav panel (white on ink) and .foot2 is bone-on-night, while this page is a
   light band. Auto-fit rather than the stub page's fixed 2 columns, because
   the section count comes from the tree and changes as pages ship. */
.smgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(268px,1fr));
  gap:clamp(16px,2vw,24px);margin-top:clamp(26px,3.4vw,42px);align-items:start}
.smgroup{background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);
  padding:clamp(16px,1.8vw,24px)}
.smgroup>.eb{margin-bottom:12px}
.smls{display:flex;flex-direction:column}
.smls a{display:flex;flex-direction:column;gap:1px;padding:7px 8px;margin:0 -8px;
  border-radius:var(--r-sm);transition:background .14s,color .14s}
.smls a:hover{background:var(--bone)}
.smls a b{font-size:.88rem;font-weight:600;letter-spacing:-.01em;color:var(--ink)}
.smls a span{font:500 .6rem/1.3 var(--mono);letter-spacing:.1em;text-transform:uppercase;
  color:var(--faint)}
.smls a:hover span{color:var(--muted)}
/* pages that exist in the tree but are not built yet carry the signal dot,
   the same marker the nav panel and footer use */
.smls a[data-soon] b::after{content:'';display:inline-block;width:4px;height:4px;
  border-radius:50%;background:var(--signal);margin-left:6px;vertical-align:2px;opacity:.7}

.eb.ink{color:var(--signal)}
.ph .promo+.eb{margin-top:16px}

/* ════ CARD GRID (H3 feature cards) ════ */
.cgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(288px,1fr));gap:2px;margin-top:clamp(26px,3.4vw,44px);background:var(--line);border:1px solid var(--line);border-radius:16px;overflow:hidden}
.cgrid>article{background:var(--card);padding:clamp(20px,2.2vw,28px);display:flex;flex-direction:column;gap:10px}
.cgrid h3{font-size:1.04rem;font-weight:700;letter-spacing:-.022em;line-height:1.25}
.cgrid p{font-size:.92rem;line-height:1.6;color:var(--muted);text-wrap:pretty}
.band.bone .cgrid{background:rgba(24,24,27,.12);border-color:rgba(24,24,27,.12)}
.band.bone .cgrid>article{background:#FBF8F2}
.sp.dk .cgrid,.band.night .cgrid{background:rgba(244,240,232,.12);border-color:rgba(244,240,232,.12)}
.sp.dk .cgrid>article,.band.night .cgrid>article{background:#12141C}
.sp.dk .cgrid h3,.band.night .cgrid h3{color:var(--bone)}
.sp.dk .cgrid p,.band.night .cgrid p{color:rgba(244,240,232,.62)}
/* ════ TIMELINE RAIL ════ */
.tline{list-style:none;counter-reset:t;margin-top:clamp(26px,3.4vw,44px);max-width:86ch}
.tline li{counter-increment:t;position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);gap:18px;padding:0 0 24px 0}
.tline li::before{content:counter(t,decimal-leading-zero);font:700 .66rem/1 var(--mono);letter-spacing:.1em;color:var(--signal);width:24px;padding-top:5px}
.tline li::after{content:'';position:absolute;left:8px;top:20px;bottom:0;width:1px;background:var(--line-d)}
.tline li:last-child{padding-bottom:0}
.tline li:last-child::after{display:none}
.tline span{font-size:1rem;line-height:1.58;color:var(--ink);text-wrap:pretty}
.tline b{font-weight:700}
.sp.dk .tline span,.band.night .tline span{color:var(--bone)}
.sp.dk .tline li::after,.band.night .tline li::after{background:rgba(244,240,232,.16)}
/* ════ RELATED RAIL ════ */
.rel{background:var(--bone);padding:clamp(38px,4.6vw,64px) 0}
.relhead{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:14px;padding-bottom:16px;border-bottom:2px solid var(--ink)}
.relhead .dsp{font-size:clamp(1.2rem,1.9vw,1.6rem)}
.relgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2px;margin-top:20px;background:rgba(24,24,27,.1);border:1px solid rgba(24,24,27,.1);border-radius:14px;overflow:hidden}
.relgrid a{background:#FBF8F2;padding:16px 18px;display:block;transition:background .15s}
.relgrid a:hover{background:#fff}
.relgrid b{display:block;font-size:.97rem;font-weight:700;letter-spacing:-.016em;color:var(--ink)}
.relgrid a:hover b{color:var(--ocean)}
.relgrid span{display:block;margin-top:4px;font:600 .68rem/1.4 var(--mono);letter-spacing:.06em;color:var(--faint)}
/* ════ GATE / VERIFY MARKERS ════ */
.gate{display:inline-flex;align-items:center;gap:7px;font:700 .58rem/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--signal)}
.gate::before{content:'';width:2px;height:11px;background:var(--signal)}
.vfy{background:var(--night);color:var(--bone);padding:clamp(34px,4.4vw,58px) 0}
.vfy .eb{color:var(--signal)}
.vfy .dsp{color:#fff;margin-top:12px}
.vfylist{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2px;margin-top:22px;background:rgba(244,240,232,.12);border:1px solid rgba(244,240,232,.12);border-radius:14px;overflow:hidden}
.vfylist div{background:#12141C;padding:15px 18px;display:flex;gap:12px;align-items:flex-start;font-size:.9rem;line-height:1.52;color:rgba(244,240,232,.8)}
.vfylist i{flex:0 0 auto;width:6px;height:6px;border-radius:50%;background:var(--signal);margin-top:7px}
@media (max-width:640px){.cgrid{grid-template-columns:1fr}}

/* hero H1 eyebrow takes the masthead rule: orange bar + trailing hairline.
   Two things above the display line, never three. */
.ph h1.eb{display:flex;align-items:center;gap:13px;width:100%;max-width:min(600px,100%);margin-top:clamp(14px,1.6vw,18px);letter-spacing:.2em;color:rgba(255,255,255,.9)}
.ph h1.eb::before{content:'';flex:0 0 auto;width:2px;height:14px;border-radius:1px;background:var(--signal)}
.ph h1.eb::after{content:'';flex:1 1 auto;min-width:24px;height:1px;background:linear-gradient(90deg,rgba(255,255,255,.28),transparent)}
.ph.dk h1.eb{color:rgba(24,24,27,.78)}
.ph.dk h1.eb::after{background:linear-gradient(90deg,var(--line-d),transparent)}
.ph h1.eb+.dsp{margin-top:clamp(14px,1.8vw,20px)}

/* ════ PROSE SPLIT — copy one side, a framed product shot the other ════ */
.bsplit.rev>*:first-child{order:2}
.bsplit .scopy{max-width:56ch}
.shotwrap{position:relative}
.shotframe{background:var(--card);border:1px solid var(--line-d);border-radius:16px;overflow:hidden;box-shadow:0 28px 64px -36px rgba(24,24,27,.5),0 2px 5px rgba(24,24,27,.05)}
.shotframe .sfbar{display:flex;align-items:center;gap:6px;padding:10px 13px;border-bottom:1px solid var(--line);background:linear-gradient(#FDFDFE,#F7F7F9)}
.shotframe .sfbar i{width:9px;height:9px;border-radius:50%;background:#E1E1E5;flex:0 0 auto}
.shotframe .sfbar .u{margin-left:8px;flex:1;height:20px;border-radius:5px;background:rgba(24,24,27,.045);display:flex;align-items:center;padding:0 9px;font:600 .62rem/1 var(--mono);letter-spacing:.05em;color:var(--faint);white-space:nowrap;overflow:hidden}
.shotslot{position:relative;aspect-ratio:16/10;background:repeating-linear-gradient(135deg,rgba(24,24,27,.028) 0 10px,transparent 10px 20px),#F2F2F4;display:block}
.shotslot image-slot{position:absolute;inset:0;width:100%;height:100%}
.shotcap{display:flex;align-items:center;gap:9px;margin-top:13px;font:600 .63rem/1.4 var(--mono);letter-spacing:.15em;text-transform:uppercase;color:var(--faint)}
.shotcap::before{content:'';width:2px;height:11px;background:var(--signal);flex:0 0 auto;border-radius:1px}
.sp.dk .shotframe,.band.night .shotframe{background:#12141C;border-color:rgba(244,240,232,.14)}
.sp.dk .shotframe .sfbar,.band.night .shotframe .sfbar{background:rgba(255,255,255,.04);border-bottom-color:rgba(244,240,232,.1)}
.sp.dk .shotframe .sfbar i,.band.night .shotframe .sfbar i{background:rgba(244,240,232,.18)}
.sp.dk .shotframe .sfbar .u,.band.night .shotframe .sfbar .u{background:rgba(255,255,255,.05);color:rgba(244,240,232,.42)}
.sp.dk .shotslot,.band.night .shotslot{background:repeating-linear-gradient(135deg,rgba(244,240,232,.035) 0 10px,transparent 10px 20px),#0E1018}
.sp.dk .shotcap,.band.night .shotcap{color:rgba(244,240,232,.42)}
.band.bone .shotframe{background:#FBF8F2}
@media (max-width:900px){.bsplit{grid-template-columns:1fr}.bsplit.rev>*:first-child{order:0}}

/* ════ MID-PAGE TRIAL CTA — dark band with a sweeping light ════ */
.midcta{position:relative;isolation:isolate;overflow:hidden;background:#080A11;padding:clamp(46px,5.6vw,78px) 0;margin:0}
.midcta::before,.midcta::after{content:'';position:absolute;left:0;right:0;height:1px;z-index:3;background:linear-gradient(90deg,transparent,rgba(255,214,178,.42) 18%,rgba(255,246,232,.72) 50%,rgba(255,214,178,.42) 82%,transparent)}
.midcta::before{top:0}.midcta::after{bottom:0}
.midcta .sky{background:radial-gradient(70% 130% at 50% 118%,rgba(234,106,44,.34) 0%,rgba(234,106,44,.16) 26%,transparent 62%),radial-gradient(60% 80% at 50% -20%,rgba(59,91,219,.26),transparent 70%),linear-gradient(180deg,#0A0C14,#12141C)}
.midcta .rays{-webkit-mask-image:radial-gradient(52% 90% at 50% 100%,#000,transparent 78%);mask-image:radial-gradient(52% 90% at 50% 100%,#000,transparent 78%)}
.mcnum{position:absolute;right:-2.5%;bottom:-14%;z-index:1;font-size:clamp(190px,27vw,380px);font-weight:800;letter-spacing:-.075em;line-height:.72;color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.07);pointer-events:none;-webkit-user-select:none;user-select:none}
.mcnum span{display:inline-block;background:linear-gradient(100deg,transparent 40%,rgba(255,214,178,.45) 47%,rgba(255,246,232,.9) 50%,rgba(234,106,44,.5) 54%,transparent 61%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;background-size:300% 100%;background-repeat:no-repeat;animation:mcsweep 6.3s linear infinite;will-change:background-position}
@keyframes mcsweep{0%{background-position:210% 50%}38%{background-position:-110% 50%}100%{background-position:-110% 50%}}
.mcinner{position:relative;z-index:4;display:flex;align-items:flex-end;justify-content:space-between;gap:clamp(24px,4vw,64px);flex-wrap:wrap;min-height:clamp(150px,15vw,210px)}
.mcinner .eb{color:var(--signal)}
.mcinner .dsp{color:#fff;margin-top:13px;max-width:17ch}
.mcinner .bd{color:rgba(255,255,255,.62);margin-top:13px;max-width:44ch}
.mcact{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.mcact .btn.primary{background:#fff;color:#12141C}
.mcact .btn.primary:hover{box-shadow:0 14px 34px rgba(255,214,178,.26)}
.mcact .micro{margin-top:0;color:rgba(255,255,255,.5)}
.mcdots{display:flex;gap:5px;margin-bottom:4px;padding:7px 11px;border-radius:999px;background:rgba(8,10,17,.5);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.1)}
.mcdots i{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.16);animation:mcfill 6.3s linear infinite;animation-delay:calc(var(--i) * .45s - 5.85s)}
@keyframes mcfill{0%,90%{background:rgba(255,255,255,.16)}95%{background:var(--signal);box-shadow:0 0 8px rgba(234,106,44,.7)}100%{background:rgba(255,255,255,.16)}}
@media (prefers-reduced-motion:reduce){.mcnum span,.mcdots i{animation:none}}
@media (max-width:760px){.mcinner{align-items:flex-start}.mcnum{opacity:.55}}

/* ════ DUO — consecutive prose sections pair up instead of running full width ════ */
.duo{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:clamp(30px,3.6vw,60px);align-items:start}
.duo>div{position:relative;padding-top:22px;border-top:2px solid var(--ink)}
.duo>div .dsp{font-size:clamp(1.45rem,2.3vw,2.05rem);margin-top:13px;max-width:20ch}
.duo>div .bd{margin-top:13px}
.band.night .duo>div,.sp.dk .duo>div{border-top-color:rgba(244,240,232,.45)}
.duo .anchor{position:absolute;top:-90px}
.shotslot{aspect-ratio:16/10}

/* ════ LEGAL — long-form document with a sticky section index ════ */
.legal{background:var(--bone);padding:clamp(40px,5vw,72px) 0 clamp(60px,8vw,110px)}
.lgrid{display:grid;grid-template-columns:248px minmax(0,1fr);gap:clamp(32px,5vw,80px);align-items:start}
.lidx{position:sticky;top:26px;max-height:calc(100vh - 52px);overflow:auto;padding-right:8px}
.lidx .jl{font:700 .6rem/1 var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--faint);padding-bottom:12px;border-bottom:2px solid var(--ink);margin-bottom:6px}
.lidx a{display:block;padding:7px 0;font-size:.845rem;line-height:1.35;font-weight:500;color:var(--muted);border-bottom:1px solid rgba(24,24,27,.08)}
.lidx a:hover{color:var(--ocean)}
.lidx a.on{color:var(--ink);font-weight:700}
.ldoc{max-width:78ch}
.ldoc h2{scroll-margin-top:26px;margin-top:clamp(34px,4vw,54px);padding-top:20px;border-top:2px solid var(--ink);font-size:clamp(1.28rem,2.1vw,1.72rem);font-weight:800;letter-spacing:-.03em;line-height:1.16}
.ldoc h2:first-of-type{margin-top:0}
.ldoc h3{margin-top:26px;font-size:1rem;font-weight:700;letter-spacing:-.015em}
.ldoc p{margin-top:14px;font-size:1rem;line-height:1.68;color:var(--muted);text-wrap:pretty}
.ldoc p b,.ldoc li b{color:var(--ink);font-weight:700}
.ldoc ul{margin-top:14px;list-style:none}
.ldoc ul li{position:relative;padding:7px 0 7px 20px;font-size:1rem;line-height:1.62;color:var(--muted);text-wrap:pretty}
.ldoc ul li::before{content:'';position:absolute;left:2px;top:16px;width:6px;height:1.5px;background:var(--signal)}
.ldoc .dl{margin-top:16px;display:grid;gap:2px;background:var(--line);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.ldoc .dl>div{background:#FBF8F2;padding:14px 17px;font-size:.95rem;line-height:1.6;color:var(--muted)}
.ldoc .dl b{display:block;color:var(--ink);font-weight:700;margin-bottom:3px}
.ldoc a{border-bottom:1px solid rgba(59,91,219,.3)}
.leff{display:inline-flex;align-items:center;gap:10px;font:700 .63rem/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--muted);padding-left:11px;border-left:2px solid var(--signal)}
@media (max-width:900px){.lgrid{grid-template-columns:1fr}.lidx{position:static;max-height:none;display:flex;flex-wrap:wrap;gap:0 16px;border-bottom:1px solid var(--line-d);padding-bottom:12px}.lidx .jl{width:100%;margin-bottom:2px}.lidx a{border:0;padding:5px 0;font-size:.8rem}}

/* legal notices and numbered sections */
.lnote{margin-top:18px;padding:18px 20px;border-left:2px solid var(--signal);background:rgba(234,106,44,.055);border-radius:0 10px 10px 0}
.lnote p{margin-top:0;color:var(--ink);font-size:.93rem;line-height:1.6;font-weight:500}
.lnote p+p{margin-top:11px}
.lnote .lt{display:block;font:700 .6rem/1 var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--signal);margin-bottom:10px}
.ldoc .caps{font-size:.87rem;line-height:1.62;letter-spacing:.005em;color:var(--muted)}
.ldoc h2 .n{display:block;font:700 .6rem/1 var(--mono);letter-spacing:.18em;color:var(--signal);margin-bottom:9px}
.lidx a .n{font:700 .58rem/1 var(--mono);letter-spacing:.1em;color:var(--faint);margin-right:7px}

/* the rounded CTA sits flush against the block above it: no empty band */
.ctawrap{padding-top:0;background:transparent}
.rel+.ctawrap .ctaband,.band+.ctawrap .ctaband,.sp+.ctawrap .ctaband{margin-top:0}
/* build notes: a collapsed strip under the CTA, not a section pretending to be content */
.vstrip{background:#0A0C14;border-top:1px solid rgba(244,240,232,.1);color:var(--bone)}
.vstrip summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:14px;max-width:1440px;margin:0 auto;padding:16px clamp(20px,3.6vw,54px)}
.vstrip summary::-webkit-details-marker{display:none}
.vstrip .vt{font:700 .6rem/1 var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--signal);padding-left:11px;border-left:2px solid var(--signal);flex:0 0 auto}
.vstrip summary b{font-size:.88rem;font-weight:600;color:rgba(244,240,232,.66)}
.vstrip summary:hover b{color:#fff}
.vstrip .vx{margin-left:auto;width:8px;height:8px;border-right:1.5px solid rgba(244,240,232,.45);border-bottom:1.5px solid rgba(244,240,232,.45);transform:rotate(45deg) translate(-2px,-2px);transition:transform .2s}
.vstrip[open] .vx{transform:rotate(-135deg) translate(-2px,-2px)}
.vwrap{max-width:1440px;margin:0 auto;padding:0 clamp(20px,3.6vw,54px) 26px}
.vstrip .vfylist{margin-top:0}

/* ════ COMPARISON TABLE ════ */
.ctable{margin-top:clamp(24px,3vw,40px);overflow-x:auto;border:1px solid var(--line);border-radius:14px;background:var(--card)}
.ctable table{width:100%;border-collapse:collapse;min-width:620px}
.ctable th{text-align:left;padding:14px 18px;font:700 .62rem/1.3 var(--mono);letter-spacing:.15em;text-transform:uppercase;color:var(--faint);border-bottom:1px solid var(--line-d);white-space:nowrap;vertical-align:bottom}
.ctable th:last-child{color:var(--signal)}
.ctable td{padding:15px 18px;font-size:.92rem;line-height:1.55;color:var(--muted);border-bottom:1px solid var(--line);vertical-align:top;text-wrap:pretty}
.ctable tr:last-child td{border-bottom:0}
.ctable td:first-child{color:var(--ink);font-weight:700;white-space:nowrap}
.ctable td:last-child{background:rgba(59,91,219,.04);color:var(--ink)}
.band.bone .ctable{background:#FBF8F2}
/* ════ GATED BLOCK — an authored section still waiting on a number ════ */
.gaterow{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2px;margin-top:clamp(22px,2.6vw,34px);background:var(--line);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.gate-item{background:var(--card);padding:18px 20px}
.band.bone .gate-item{background:#FBF8F2}
.gate-item .gl{display:block;font:700 .6rem/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--signal);padding-left:10px;border-left:2px solid var(--signal);margin-bottom:11px}
.gate-item p{font-size:.93rem;line-height:1.6;color:var(--muted);text-wrap:pretty}
@media (max-width:640px){.ctable{border-radius:12px}}

/* confirmed this round — spot-check marker */
.conf{background:rgba(31,138,91,.1);border-radius:4px;padding:1px 5px;box-shadow:inset 0 -1.5px 0 rgba(31,138,91,.45)}
/* ════ PLANS ════ */
.pricehead{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:20px}
.curswitch{display:flex;gap:3px;background:rgba(24,24,27,.055);border-radius:10px;padding:3px}
.curswitch button{border:0;background:transparent;font:700 .7rem/1 'Public Sans';color:var(--muted);padding:8px 14px;border-radius:7px;cursor:pointer;transition:background .15s,color .15s}
.curswitch button[aria-pressed=true]{background:var(--card);color:var(--ink);box-shadow:0 1px 2px rgba(24,24,27,.1)}
.billswitch{display:inline-flex;align-items:center;gap:10px;margin-top:14px;font-size:.86rem;color:var(--muted)}
.billswitch button{border:0;cursor:pointer;width:44px;height:24px;border-radius:999px;background:rgba(24,24,27,.14);position:relative;transition:background .18s}
.billswitch button[aria-pressed=true]{background:var(--ocean)}
.billswitch button::after{content:'';position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:transform .18s}
.billswitch button[aria-pressed=true]::after{transform:translateX(20px)}
.billswitch em{font-style:normal;font-weight:700;color:var(--green);font-size:.78rem}
/* The product-line switch reuses .curswitch's shape (same two-button group,
   same aria-pressed contract) and only sizes up, because it is the primary
   choice on the page rather than a display preference. */
.lineswitch{margin-bottom:10px}
.lineswitch button{font-size:.78rem;padding:9px 18px;letter-spacing:-.01em}
.tiernote{margin-top:16px;font-size:.86rem;line-height:1.55;color:var(--muted);text-wrap:pretty}
.tiernote a{font-weight:700}
.tiers{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:2px;margin-top:clamp(26px,3.2vw,42px);background:var(--line);border:1px solid var(--line);border-radius:16px;overflow:hidden}
.tier{background:var(--card);padding:clamp(20px,2.2vw,26px);display:flex;flex-direction:column;gap:12px}
.tier.hot{background:var(--night);color:var(--bone)}
.tier .tn{display:flex;align-items:center;gap:9px;font-size:1.02rem;font-weight:800;letter-spacing:-.022em}
/* The badge is an <em> — _blocks.html has emitted one since the tier cards
   started rendering from tier data. This rule said `span`, so it matched
   nothing and "First 100" rendered as plain italic body text. `em` also needs
   font-style reset, which a span never did. */
.tier .tn em{font:700 .53rem/1 var(--mono);font-style:normal;letter-spacing:.13em;text-transform:uppercase;color:var(--signal);background:rgba(234,106,44,.12);padding:4px 7px;border-radius:4px;white-space:nowrap}
.tier .tn em.gone{color:var(--muted);background:rgba(24,24,27,.08)}
.tier.hot .tn em{color:var(--bone);background:rgba(244,240,232,.14)}
.tier.hot .tn em.gone{color:rgba(244,240,232,.6);background:rgba(244,240,232,.1)}
/* The free-tier countdown: how much of the promotion is gone. */
.tier .tpromo{display:flex;flex-direction:column;gap:6px;margin-top:-4px}
.tier .tpromo span{font:600 .58rem/1.3 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--faint)}
.tier.hot .tpromo span{color:rgba(244,240,232,.5)}
.tier .tpbar{height:4px;border-radius:999px;background:rgba(24,24,27,.1);overflow:hidden}
.tier.hot .tpbar{background:rgba(244,240,232,.16)}
.tier .tpbar i{display:block;height:100%;border-radius:999px;background:var(--signal)}
.tier.soldout .tp{opacity:.55}
.tier .tp{display:flex;align-items:baseline;gap:3px;font-size:2rem;font-weight:800;letter-spacing:-.045em;line-height:1;font-variant-numeric:tabular-nums}
.tier .tp u{text-decoration:none;font-size:.42em;font-weight:700;color:var(--muted);letter-spacing:0}
.tier.hot .tp u{color:rgba(244,240,232,.6)}
.tier .tu{font:700 .6rem/1.4 var(--mono);letter-spacing:.13em;text-transform:uppercase;color:var(--faint)}
.tier.hot .tu{color:rgba(244,240,232,.5)}
.tier .td{font-size:.88rem;line-height:1.55;color:var(--muted);text-wrap:pretty}
.tier.hot .td{color:rgba(244,240,232,.66)}
.tier ul{list-style:none;display:flex;flex-direction:column;gap:8px;margin-top:2px}
.tier li{display:flex;gap:9px;align-items:flex-start;font-size:.86rem;line-height:1.45;color:var(--muted)}
.tier.hot li{color:rgba(244,240,232,.78)}
.tier li em{flex:0 0 auto;width:14px;height:14px;border-radius:50%;background:rgba(59,91,219,.13);color:var(--ocean);display:flex;align-items:center;justify-content:center;margin-top:2px}
.tier.hot li em{background:rgba(95,211,155,.16);color:var(--green-lt)}
.tier li em svg{width:9px;height:9px}
.tier .tb{margin-top:auto;padding-top:6px}
.tier .tb .btn{width:100%;justify-content:center;background:rgba(24,24,27,.06);color:var(--ink)}
.tier.hot .tb .btn{background:#fff;color:#12141C}
.tier .tb .btn:hover{background:var(--ocean);color:#fff}
.pricefoot{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:22px;padding-top:18px;border-top:1px solid var(--line-d);font-size:.85rem;color:var(--muted)}
.pricefoot b{color:var(--ink);font-weight:700}
@media (max-width:900px){.tiers{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}}

/* the closing band: ghost button has to read on a dark surface */
.ctaband .btn.primary{background:#fff;color:#12141C}
.ctaband .btn.primary:hover{background:#fff;color:#12141C;box-shadow:0 14px 34px rgba(255,214,178,.26)}
.ctaband .btn.ghost{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.28);color:#fff}
.ctaband .btn.ghost:hover{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.5);color:#fff}
.ctaband .inner .bd{color:rgba(255,255,255,.62);max-width:56ch;margin-top:14px}
.ctaband .inner .phcta{margin-top:26px}
/* belt and braces: no two dark blocks may sit against each other */
.sp.dk+.midcta,.midcta+.sp.dk{border-top:1px solid rgba(255,255,255,.12)}
.midcta+.ctawrap .ctaband,.sp.dk+.ctawrap .ctaband{border-radius:0}

.shotwrap.wide{margin-top:clamp(26px,3.2vw,42px);max-width:760px}

/* ════ HELP CENTRE ════ */
.hsearch{display:flex;align-items:center;gap:12px;max-width:640px;margin-top:clamp(22px,2.6vw,32px);background:var(--card);border:1px solid var(--line-d);border-radius:999px;padding:14px 22px;box-shadow:0 14px 34px -22px rgba(24,24,27,.4)}
.hsearch svg{width:17px;height:17px;color:var(--faint);flex:0 0 auto}
.hsearch input{flex:1;border:0;background:none;font:500 .96rem/1 'Public Sans';color:var(--ink);outline:0}
.hsearch input::placeholder{color:var(--faint)}
.hgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(268px,1fr));gap:2px;margin-top:clamp(26px,3.2vw,42px);background:var(--line);border:1px solid var(--line);border-radius:16px;overflow:hidden}
.hcard{background:var(--card);padding:clamp(20px,2.2vw,26px);display:block;transition:background .15s}
.hcard:hover{background:#fff}
.hcard h3{font-size:1.02rem;font-weight:700;letter-spacing:-.02em;color:var(--ink)}
.hcard:hover h3{color:var(--ocean)}
.hcard p{margin-top:7px;font-size:.9rem;line-height:1.55;color:var(--muted)}
.hcard .n{display:block;margin-top:11px;font:700 .58rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}
.human{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:2px;margin-top:clamp(26px,3vw,40px);background:rgba(244,240,232,.12);border:1px solid rgba(244,240,232,.12);border-radius:16px;overflow:hidden}
.human>div{background:#12141C;padding:20px 22px}
.human .hk{display:block;font:700 .58rem/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--signal);margin-bottom:9px}
.human b{display:block;font-size:1.05rem;font-weight:700;color:#fff;letter-spacing:-.02em}
.human span:not(.hk){display:block;margin-top:6px;font-size:.86rem;line-height:1.5;color:rgba(244,240,232,.6)}
/* ════ CALCULATOR ════ */
.calc{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.85fr);gap:clamp(28px,4vw,60px);margin-top:clamp(26px,3.2vw,44px);align-items:start}
.cfields{display:flex;flex-direction:column;gap:22px}
.cf label{display:flex;align-items:baseline;justify-content:space-between;gap:12px;font-size:.92rem;font-weight:600;color:var(--ink)}
.cf label b{font:700 1rem/1 var(--mono);letter-spacing:-.01em;color:var(--ocean);font-variant-numeric:tabular-nums}
.cf input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:4px;margin-top:12px;border-radius:2px;background:var(--line-d);outline:0}
.cf input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;border-radius:50%;background:var(--ocean);border:3px solid #fff;box-shadow:0 2px 8px rgba(24,24,27,.28);cursor:pointer}
.cf input[type=range]::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:var(--ocean);border:3px solid #fff;cursor:pointer}
.cf .cx{margin-top:7px;font-size:.82rem;color:var(--muted)}
.cout{background:var(--night);color:#fff;border-radius:20px;padding:clamp(24px,2.8vw,32px);box-shadow:0 26px 60px -30px rgba(10,12,20,.7)}
.cout .ck{display:block;font:700 .58rem/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--signal);margin-bottom:12px}
.cbig{font-size:clamp(2.4rem,5vw,3.4rem);font-weight:800;letter-spacing:-.045em;line-height:1;font-variant-numeric:tabular-nums}
.csub{margin-top:10px;font-size:.9rem;line-height:1.55;color:rgba(255,255,255,.6)}
.crow{display:flex;justify-content:space-between;gap:12px;margin-top:16px;padding-top:14px;border-top:1px solid rgba(255,255,255,.14);font-size:.86rem;color:rgba(255,255,255,.66)}
.crow b{color:#fff;font-variant-numeric:tabular-nums}
.cout .btn{width:100%;justify-content:center;margin-top:20px;background:#fff;color:#12141C}
.cnote{margin-top:14px;font-size:.78rem;line-height:1.5;color:rgba(255,255,255,.44)}
@media (max-width:900px){.calc{grid-template-columns:1fr}}

/* channels block on a light surface */
.band.bone .human{background:rgba(24,24,27,.1);border-color:rgba(24,24,27,.1)}
.band.bone .human>div{background:#FBF8F2}
.band.bone .human b{color:var(--ink)}
.band.bone .human b a{color:var(--ocean)}
.band.bone .human span:not(.hk){color:var(--muted)}

/* ════ CONTACT FORM ════ */
.cform{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 20px;margin-top:clamp(24px,3vw,36px);max-width:720px}
.cfrow{display:flex;flex-direction:column;gap:7px}
.cfrow.wide,.cfoot{grid-column:1/-1}
.cfrow label{font-size:.86rem;font-weight:600;color:var(--ink)}
.cfrow label span{font-weight:500;color:var(--faint)}
.cfrow input,.cfrow select,.cfrow textarea{font:500 .96rem/1.45 'Public Sans';color:var(--ink);background:var(--card);border:1px solid var(--line-d);border-radius:var(--r-sm);padding:12px 14px;outline:0;transition:border-color .15s,box-shadow .15s}
.cfrow textarea{resize:vertical;min-height:118px}
.cfrow input:focus,.cfrow select:focus,.cfrow textarea:focus{border-color:var(--ocean);box-shadow:0 0 0 3px rgba(59,91,219,.14)}
.cfrow input::placeholder,.cfrow textarea::placeholder{color:var(--faint)}
.cfoot{display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin-top:2px}
.cfoot .micro{margin:0}
.ftoast{grid-column:1/-1;margin:0;padding:13px 16px;border-radius:var(--r-sm);font-size:.9rem;font-weight:600;background:rgba(31,138,91,.1);color:var(--green);border:1px solid rgba(31,138,91,.24)}
.ftoast[data-err]{background:rgba(234,106,44,.1);color:#B24A17;border-color:rgba(234,106,44,.28)}
@media (max-width:640px){.cform{grid-template-columns:1fr}}

/* ── help: contact row in the hero, search empty state ── */
.hrow{display:flex;flex-wrap:wrap;gap:2px;margin-top:clamp(22px,2.6vw,30px);background:rgba(244,240,232,.14);border:1px solid rgba(244,240,232,.14);border-radius:14px;overflow:hidden;max-width:760px}
.hrow>*{flex:1 1 200px;background:rgba(12,14,22,.5);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:14px 17px;display:block;transition:background .15s}
.hrow>a:hover{background:rgba(12,14,22,.75)}
.hrow .hk{display:block;font:700 .56rem/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--signal);margin-bottom:7px}
.hrow b{display:block;font-size:.95rem;font-weight:700;color:#fff;letter-spacing:-.016em}
.hrow em{display:block;margin-top:5px;font-style:normal}
.hempty{margin-top:16px;font-size:.94rem;color:var(--muted)}
.hcard .n{color:var(--signal)}

/* ── calculator: assumption note, advanced field, formula line, fix block ── */
.asmp{font-size:.86rem;line-height:1.55;color:var(--muted);padding-left:13px;border-left:2px solid var(--signal);margin-bottom:6px;text-wrap:pretty}
.adv{border-top:1px solid var(--line);padding-top:16px}
.adv>summary{cursor:pointer;list-style:none;font:700 .62rem/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--muted);display:flex;align-items:center;gap:9px}
.adv>summary::-webkit-details-marker{display:none}
.adv>summary::before{content:'+';font-size:1rem;line-height:1;color:var(--signal)}
.adv[open]>summary::before{content:'\2212'}
.adv>summary:hover{color:var(--ink)}
.adv .cf{margin-top:16px}
.cform-line{margin-top:16px;padding-top:14px;border-top:1px solid rgba(255,255,255,.14);font:600 .78rem/1.5 var(--mono);letter-spacing:.02em;color:rgba(255,255,255,.62);text-wrap:pretty}
.cfix{margin-top:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,.14)}
.cfix p{font-size:.9rem;line-height:1.55;color:rgba(255,255,255,.72);margin-bottom:14px}
.cfix .btn{width:100%;justify-content:center}
.cfix .btn.primary{background:#fff;color:#12141C}
.cfix .btn.ghost.light{margin-top:8px;border-color:rgba(255,255,255,.28);color:#fff}
.cfix .btn.ghost.light:hover{background:rgba(255,255,255,.1)}
.cshare{margin-top:16px;width:100%;border:0;background:none;padding:0;text-align:left;font:700 .6rem/1 var(--mono);letter-spacing:.15em;text-transform:uppercase;color:rgba(255,255,255,.5);cursor:pointer}
.cshare:hover{color:#fff}

/* ════ SOFTWARE COST CALCULATOR ════ */
.pricebanner{display:block;padding:15px 19px;margin-bottom:clamp(22px,2.6vw,32px);background:rgba(234,106,44,.08);border:1px solid rgba(234,106,44,.26);border-radius:var(--r-md);font-size:.9rem;line-height:1.55;color:var(--ink);text-wrap:pretty}
.pricebanner code{font:600 .84rem/1 var(--mono);background:rgba(24,24,27,.07);padding:2px 5px;border-radius:3px}
.tco{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(28px,4vw,56px);align-items:start}
.tcoinputs{display:flex;flex-direction:column;gap:22px}
.tcofeat .slab{display:block;margin-bottom:12px}
.togs{display:flex;flex-direction:column;gap:2px;background:var(--line);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden}
.tog{display:flex;align-items:center;gap:11px;background:var(--card);padding:11px 15px;cursor:pointer;transition:background .14s}
.tog:hover{background:#fff}
.tog input{appearance:none;-webkit-appearance:none;width:17px;height:17px;flex:0 0 auto;border:1.5px solid var(--line-d);border-radius:4px;background:#fff;cursor:pointer;position:relative;transition:background .14s,border-color .14s}
.tog input:checked{background:var(--ocean);border-color:var(--ocean)}
.tog input:checked::after{content:'';position:absolute;left:4.5px;top:1.5px;width:5px;height:9px;border:2px solid #fff;border-top:0;border-left:0;transform:rotate(42deg)}
.tog span{font-size:.92rem;font-weight:600;color:var(--ink);letter-spacing:-.012em}
.billtog{display:inline-flex;gap:3px;background:rgba(24,24,27,.055);border-radius:10px;padding:3px;align-self:flex-start}
.billtog button{border:0;background:transparent;font:600 .8rem/1 'Public Sans';color:var(--muted);padding:9px 16px;border-radius:8px;cursor:pointer;transition:background .15s,color .15s}
.billtog button[aria-pressed=true]{background:var(--card);color:var(--ink);box-shadow:0 1px 2px rgba(24,24,27,.1)}
.tcoout{display:flex;flex-direction:column;gap:2px;background:var(--line);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden}
.tcorow{background:var(--card);padding:clamp(18px,2vw,24px)}
.tcorow.flat{background:var(--night);color:#fff}
.tv{display:flex;align-items:center;gap:10px;font-size:1.02rem;font-weight:700;letter-spacing:-.02em}
.tcorow.flat .tv{color:#fff}
.fb{font:700 .55rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--signal)}
.tt{margin-top:6px;font-size:clamp(1.6rem,3vw,2.1rem);font-weight:800;letter-spacing:-.042em;line-height:1;font-variant-numeric:tabular-nums}
.tt em{font-size:.42em;font-weight:600;font-style:normal;letter-spacing:-.01em;color:var(--faint);margin-left:3px}
.tcorow.flat .tt em{color:rgba(255,255,255,.5)}
.tt .na{font-size:.5em;font-weight:700;letter-spacing:-.01em;color:var(--muted)}
.tw{list-style:none;margin-top:12px;display:flex;flex-direction:column;gap:5px}
.tw li{font-size:.85rem;line-height:1.5;color:var(--muted);padding-left:13px;position:relative}
.tw li::before{content:'';position:absolute;left:0;top:8px;width:5px;height:1px;background:var(--faint)}
.tcorow.flat .tw li{color:rgba(255,255,255,.62)}
.tcorow.flat .tw li::before{background:rgba(255,255,255,.4)}
.tw li.good{color:var(--green);font-weight:600}
.tcorow.flat .tw li.good{color:#6FD3A2}
.tw li.warn{color:#B24A17}
.tcofoot{display:flex;flex-wrap:wrap;align-items:center;gap:10px 22px;margin-top:clamp(20px,2.4vw,30px);padding-top:16px;border-top:1px solid var(--line-d);font:600 .74rem/1.5 var(--mono);letter-spacing:.06em;color:var(--faint)}
.cshare.dark{width:auto;margin:0;color:var(--ocean)}
.cshare.dark:hover{color:#2C46B0}
.corr{font:600 .74rem/1.5 var(--mono);letter-spacing:.06em;margin-left:auto}
@media (max-width:900px){.tco{grid-template-columns:1fr}.corr{margin-left:0}}

/* ── related rail home card: same height as its siblings, the word HOME flush in the
      top-right corner with no padding of its own, and the mark bled into the glow.
      Hover only shifts opacity, so it never repaints white or grows the row. ── */
.relgrid .relhome{position:relative;overflow:hidden;background:var(--night)}
.relgrid .relhome::before{content:'';position:absolute;inset:0;background:
  radial-gradient(120% 90% at 78% 118%,rgba(234,106,44,.5),transparent 62%),
  radial-gradient(90% 70% at 12% 108%,rgba(212,84,58,.34),transparent 66%);
  pointer-events:none;transition:opacity .18s}
.relgrid .relhome:hover{background:var(--night)}
.relgrid .relhome:hover::before{opacity:.7}
.relgrid .relhome>b,.relgrid .relhome>.rhs{position:relative}
.relgrid .relhome b{color:#fff}
.relgrid .relhome:hover b{color:#fff}
.relgrid .relhome .rhs{color:rgba(255,255,255,.58)}
.relgrid .relhome .rhtag{position:absolute;top:0;right:0;margin:0;padding:0;line-height:1;font:700 .56rem/1 var(--mono);letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.42);transition:color .18s}
.relgrid .relhome:hover .rhtag{color:var(--signal)}
.relgrid .relhome .rhmark{position:absolute;bottom:-26px;right:-16px;width:64px;height:64px;margin:0;color:rgba(255,255,255,.13);pointer-events:none;transition:color .18s}
.rhmark svg{width:100%;height:100%;display:block}
.relgrid .relhome:hover .rhmark{color:rgba(255,255,255,.22)}

/* ════ GRID ROWS ALWAYS FILL ════
   These grids draw their hairlines by letting a background show through a 2px gap,
   so an incomplete last row reads as a grey slab. Column count comes from the card
   count instead of auto-fit, and the last card spans any leftover columns.
   Any new grid built on that hairline trick must be added to this selector list. */
@media (min-width:1000px){
.cgrid[data-n="1"],.hgrid[data-n="1"],.askgrid[data-n="1"],.human[data-n="1"],.relgrid[data-n="1"],.gaterow[data-n="1"],.vfylist[data-n="1"]{grid-template-columns:repeat(1,minmax(0,1fr))}
.cgrid[data-n="2"],.hgrid[data-n="2"],.askgrid[data-n="2"],.human[data-n="2"],.relgrid[data-n="2"],.gaterow[data-n="2"],.vfylist[data-n="2"]{grid-template-columns:repeat(2,minmax(0,1fr))}
.cgrid[data-n="3"],.hgrid[data-n="3"],.askgrid[data-n="3"],.human[data-n="3"],.relgrid[data-n="3"],.gaterow[data-n="3"],.vfylist[data-n="3"]{grid-template-columns:repeat(3,minmax(0,1fr))}
.cgrid[data-n="4"],.hgrid[data-n="4"],.askgrid[data-n="4"],.human[data-n="4"],.relgrid[data-n="4"],.gaterow[data-n="4"],.vfylist[data-n="4"]{grid-template-columns:repeat(4,minmax(0,1fr))}
.cgrid[data-n="5"],.hgrid[data-n="5"],.askgrid[data-n="5"],.human[data-n="5"],.relgrid[data-n="5"],.gaterow[data-n="5"],.vfylist[data-n="5"]{grid-template-columns:repeat(3,minmax(0,1fr))}
.cgrid[data-n="5"]>:last-child,.hgrid[data-n="5"]>:last-child,.askgrid[data-n="5"]>:last-child,.human[data-n="5"]>:last-child,.relgrid[data-n="5"]>:last-child,.gaterow[data-n="5"]>:last-child,.vfylist[data-n="5"]>:last-child{grid-column:span 2}
.cgrid[data-n="6"],.hgrid[data-n="6"],.askgrid[data-n="6"],.human[data-n="6"],.relgrid[data-n="6"],.gaterow[data-n="6"],.vfylist[data-n="6"]{grid-template-columns:repeat(3,minmax(0,1fr))}
.cgrid[data-n="7"],.hgrid[data-n="7"],.askgrid[data-n="7"],.human[data-n="7"],.relgrid[data-n="7"],.gaterow[data-n="7"],.vfylist[data-n="7"]{grid-template-columns:repeat(4,minmax(0,1fr))}
.cgrid[data-n="7"]>:last-child,.hgrid[data-n="7"]>:last-child,.askgrid[data-n="7"]>:last-child,.human[data-n="7"]>:last-child,.relgrid[data-n="7"]>:last-child,.gaterow[data-n="7"]>:last-child,.vfylist[data-n="7"]>:last-child{grid-column:span 2}
.cgrid[data-n="8"],.hgrid[data-n="8"],.askgrid[data-n="8"],.human[data-n="8"],.relgrid[data-n="8"],.gaterow[data-n="8"],.vfylist[data-n="8"]{grid-template-columns:repeat(4,minmax(0,1fr))}
.cgrid[data-n="9"],.hgrid[data-n="9"],.askgrid[data-n="9"],.human[data-n="9"],.relgrid[data-n="9"],.gaterow[data-n="9"],.vfylist[data-n="9"]{grid-template-columns:repeat(3,minmax(0,1fr))}
.cgrid[data-n="10"],.hgrid[data-n="10"],.askgrid[data-n="10"],.human[data-n="10"],.relgrid[data-n="10"],.gaterow[data-n="10"],.vfylist[data-n="10"]{grid-template-columns:repeat(3,minmax(0,1fr))}
.cgrid[data-n="10"]>:last-child,.hgrid[data-n="10"]>:last-child,.askgrid[data-n="10"]>:last-child,.human[data-n="10"]>:last-child,.relgrid[data-n="10"]>:last-child,.gaterow[data-n="10"]>:last-child,.vfylist[data-n="10"]>:last-child{grid-column:span 3}
.cgrid[data-n="11"],.hgrid[data-n="11"],.askgrid[data-n="11"],.human[data-n="11"],.relgrid[data-n="11"],.gaterow[data-n="11"],.vfylist[data-n="11"]{grid-template-columns:repeat(4,minmax(0,1fr))}
.cgrid[data-n="11"]>:last-child,.hgrid[data-n="11"]>:last-child,.askgrid[data-n="11"]>:last-child,.human[data-n="11"]>:last-child,.relgrid[data-n="11"]>:last-child,.gaterow[data-n="11"]>:last-child,.vfylist[data-n="11"]>:last-child{grid-column:span 2}
.cgrid[data-n="12"],.hgrid[data-n="12"],.askgrid[data-n="12"],.human[data-n="12"],.relgrid[data-n="12"],.gaterow[data-n="12"],.vfylist[data-n="12"]{grid-template-columns:repeat(4,minmax(0,1fr))}
.cgrid[data-n="13"],.hgrid[data-n="13"],.askgrid[data-n="13"],.human[data-n="13"],.relgrid[data-n="13"],.gaterow[data-n="13"],.vfylist[data-n="13"]{grid-template-columns:repeat(4,minmax(0,1fr))}
.cgrid[data-n="13"]>:last-child,.hgrid[data-n="13"]>:last-child,.askgrid[data-n="13"]>:last-child,.human[data-n="13"]>:last-child,.relgrid[data-n="13"]>:last-child,.gaterow[data-n="13"]>:last-child,.vfylist[data-n="13"]>:last-child{grid-column:span 4}
.cgrid[data-n="14"],.hgrid[data-n="14"],.askgrid[data-n="14"],.human[data-n="14"],.relgrid[data-n="14"],.gaterow[data-n="14"],.vfylist[data-n="14"]{grid-template-columns:repeat(4,minmax(0,1fr))}
.cgrid[data-n="14"]>:last-child,.hgrid[data-n="14"]>:last-child,.askgrid[data-n="14"]>:last-child,.human[data-n="14"]>:last-child,.relgrid[data-n="14"]>:last-child,.gaterow[data-n="14"]>:last-child,.vfylist[data-n="14"]>:last-child{grid-column:span 3}
.cgrid[data-n="15"],.hgrid[data-n="15"],.askgrid[data-n="15"],.human[data-n="15"],.relgrid[data-n="15"],.gaterow[data-n="15"],.vfylist[data-n="15"]{grid-template-columns:repeat(4,minmax(0,1fr))}
.cgrid[data-n="15"]>:last-child,.hgrid[data-n="15"]>:last-child,.askgrid[data-n="15"]>:last-child,.human[data-n="15"]>:last-child,.relgrid[data-n="15"]>:last-child,.gaterow[data-n="15"]>:last-child,.vfylist[data-n="15"]>:last-child{grid-column:span 2}
.cgrid[data-n="16"],.hgrid[data-n="16"],.askgrid[data-n="16"],.human[data-n="16"],.relgrid[data-n="16"],.gaterow[data-n="16"],.vfylist[data-n="16"]{grid-template-columns:repeat(4,minmax(0,1fr))}
.cgrid[data-n="17"],.hgrid[data-n="17"],.askgrid[data-n="17"],.human[data-n="17"],.relgrid[data-n="17"],.gaterow[data-n="17"],.vfylist[data-n="17"]{grid-template-columns:repeat(4,minmax(0,1fr))}
.cgrid[data-n="17"]>:last-child,.hgrid[data-n="17"]>:last-child,.askgrid[data-n="17"]>:last-child,.human[data-n="17"]>:last-child,.relgrid[data-n="17"]>:last-child,.gaterow[data-n="17"]>:last-child,.vfylist[data-n="17"]>:last-child{grid-column:span 4}
.cgrid[data-n="18"],.hgrid[data-n="18"],.askgrid[data-n="18"],.human[data-n="18"],.relgrid[data-n="18"],.gaterow[data-n="18"],.vfylist[data-n="18"]{grid-template-columns:repeat(4,minmax(0,1fr))}
.cgrid[data-n="18"]>:last-child,.hgrid[data-n="18"]>:last-child,.askgrid[data-n="18"]>:last-child,.human[data-n="18"]>:last-child,.relgrid[data-n="18"]>:last-child,.gaterow[data-n="18"]>:last-child,.vfylist[data-n="18"]>:last-child{grid-column:span 3}
.cgrid[data-n="19"],.hgrid[data-n="19"],.askgrid[data-n="19"],.human[data-n="19"],.relgrid[data-n="19"],.gaterow[data-n="19"],.vfylist[data-n="19"]{grid-template-columns:repeat(4,minmax(0,1fr))}
.cgrid[data-n="19"]>:last-child,.hgrid[data-n="19"]>:last-child,.askgrid[data-n="19"]>:last-child,.human[data-n="19"]>:last-child,.relgrid[data-n="19"]>:last-child,.gaterow[data-n="19"]>:last-child,.vfylist[data-n="19"]>:last-child{grid-column:span 2}
.cgrid[data-n="20"],.hgrid[data-n="20"],.askgrid[data-n="20"],.human[data-n="20"],.relgrid[data-n="20"],.gaterow[data-n="20"],.vfylist[data-n="20"]{grid-template-columns:repeat(4,minmax(0,1fr))}
.cgrid[data-n="21"],.hgrid[data-n="21"],.askgrid[data-n="21"],.human[data-n="21"],.relgrid[data-n="21"],.gaterow[data-n="21"],.vfylist[data-n="21"]{grid-template-columns:repeat(4,minmax(0,1fr))}
.cgrid[data-n="21"]>:last-child,.hgrid[data-n="21"]>:last-child,.askgrid[data-n="21"]>:last-child,.human[data-n="21"]>:last-child,.relgrid[data-n="21"]>:last-child,.gaterow[data-n="21"]>:last-child,.vfylist[data-n="21"]>:last-child{grid-column:span 4}
.cgrid[data-n="22"],.hgrid[data-n="22"],.askgrid[data-n="22"],.human[data-n="22"],.relgrid[data-n="22"],.gaterow[data-n="22"],.vfylist[data-n="22"]{grid-template-columns:repeat(4,minmax(0,1fr))}
.cgrid[data-n="22"]>:last-child,.hgrid[data-n="22"]>:last-child,.askgrid[data-n="22"]>:last-child,.human[data-n="22"]>:last-child,.relgrid[data-n="22"]>:last-child,.gaterow[data-n="22"]>:last-child,.vfylist[data-n="22"]>:last-child{grid-column:span 3}
.cgrid[data-n="23"],.hgrid[data-n="23"],.askgrid[data-n="23"],.human[data-n="23"],.relgrid[data-n="23"],.gaterow[data-n="23"],.vfylist[data-n="23"]{grid-template-columns:repeat(4,minmax(0,1fr))}
.cgrid[data-n="23"]>:last-child,.hgrid[data-n="23"]>:last-child,.askgrid[data-n="23"]>:last-child,.human[data-n="23"]>:last-child,.relgrid[data-n="23"]>:last-child,.gaterow[data-n="23"]>:last-child,.vfylist[data-n="23"]>:last-child{grid-column:span 2}
.cgrid[data-n="24"],.hgrid[data-n="24"],.askgrid[data-n="24"],.human[data-n="24"],.relgrid[data-n="24"],.gaterow[data-n="24"],.vfylist[data-n="24"]{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (min-width:641px) and (max-width:999px){
.cgrid[data-n],.hgrid[data-n],.askgrid[data-n],.human[data-n],.relgrid[data-n],.gaterow[data-n],.vfylist[data-n]{grid-template-columns:repeat(2,minmax(0,1fr))}
.cgrid[data-n]>:last-child,.hgrid[data-n]>:last-child,.askgrid[data-n]>:last-child,.human[data-n]>:last-child,.relgrid[data-n]>:last-child,.gaterow[data-n]>:last-child,.vfylist[data-n]>:last-child{grid-column:auto}
.cgrid[data-n="1"]>:last-child,.hgrid[data-n="1"]>:last-child,.askgrid[data-n="1"]>:last-child,.human[data-n="1"]>:last-child,.relgrid[data-n="1"]>:last-child,.gaterow[data-n="1"]>:last-child,.vfylist[data-n="1"]>:last-child,.cgrid[data-n="3"]>:last-child,.hgrid[data-n="3"]>:last-child,.askgrid[data-n="3"]>:last-child,.human[data-n="3"]>:last-child,.relgrid[data-n="3"]>:last-child,.gaterow[data-n="3"]>:last-child,.vfylist[data-n="3"]>:last-child,.cgrid[data-n="5"]>:last-child,.hgrid[data-n="5"]>:last-child,.askgrid[data-n="5"]>:last-child,.human[data-n="5"]>:last-child,.relgrid[data-n="5"]>:last-child,.gaterow[data-n="5"]>:last-child,.vfylist[data-n="5"]>:last-child,.cgrid[data-n="7"]>:last-child,.hgrid[data-n="7"]>:last-child,.askgrid[data-n="7"]>:last-child,.human[data-n="7"]>:last-child,.relgrid[data-n="7"]>:last-child,.gaterow[data-n="7"]>:last-child,.vfylist[data-n="7"]>:last-child,.cgrid[data-n="9"]>:last-child,.hgrid[data-n="9"]>:last-child,.askgrid[data-n="9"]>:last-child,.human[data-n="9"]>:last-child,.relgrid[data-n="9"]>:last-child,.gaterow[data-n="9"]>:last-child,.vfylist[data-n="9"]>:last-child,.cgrid[data-n="11"]>:last-child,.hgrid[data-n="11"]>:last-child,.askgrid[data-n="11"]>:last-child,.human[data-n="11"]>:last-child,.relgrid[data-n="11"]>:last-child,.gaterow[data-n="11"]>:last-child,.vfylist[data-n="11"]>:last-child,.cgrid[data-n="13"]>:last-child,.hgrid[data-n="13"]>:last-child,.askgrid[data-n="13"]>:last-child,.human[data-n="13"]>:last-child,.relgrid[data-n="13"]>:last-child,.gaterow[data-n="13"]>:last-child,.vfylist[data-n="13"]>:last-child,.cgrid[data-n="15"]>:last-child,.hgrid[data-n="15"]>:last-child,.askgrid[data-n="15"]>:last-child,.human[data-n="15"]>:last-child,.relgrid[data-n="15"]>:last-child,.gaterow[data-n="15"]>:last-child,.vfylist[data-n="15"]>:last-child,.cgrid[data-n="17"]>:last-child,.hgrid[data-n="17"]>:last-child,.askgrid[data-n="17"]>:last-child,.human[data-n="17"]>:last-child,.relgrid[data-n="17"]>:last-child,.gaterow[data-n="17"]>:last-child,.vfylist[data-n="17"]>:last-child,.cgrid[data-n="19"]>:last-child,.hgrid[data-n="19"]>:last-child,.askgrid[data-n="19"]>:last-child,.human[data-n="19"]>:last-child,.relgrid[data-n="19"]>:last-child,.gaterow[data-n="19"]>:last-child,.vfylist[data-n="19"]>:last-child,.cgrid[data-n="21"]>:last-child,.hgrid[data-n="21"]>:last-child,.askgrid[data-n="21"]>:last-child,.human[data-n="21"]>:last-child,.relgrid[data-n="21"]>:last-child,.gaterow[data-n="21"]>:last-child,.vfylist[data-n="21"]>:last-child,.cgrid[data-n="23"]>:last-child,.hgrid[data-n="23"]>:last-child,.askgrid[data-n="23"]>:last-child,.human[data-n="23"]>:last-child,.relgrid[data-n="23"]>:last-child,.gaterow[data-n="23"]>:last-child,.vfylist[data-n="23"]>:last-child{grid-column:span 2}
}
@media (max-width:640px){.cgrid[data-n],.hgrid[data-n],.askgrid[data-n],.human[data-n],.relgrid[data-n],.gaterow[data-n],.vfylist[data-n]{grid-template-columns:1fr}.cgrid[data-n]>:last-child,.hgrid[data-n]>:last-child,.askgrid[data-n]>:last-child,.human[data-n]>:last-child,.relgrid[data-n]>:last-child,.gaterow[data-n]>:last-child,.vfylist[data-n]>:last-child{grid-column:auto}}

/* ════ PROSE LINKS ON DARK SURFACES ════
   The global a{} rule carries --ocean, which is the light-surface link colour: on
   --night it measures 3.44:1 and reads darker than the copy around it. Dark prose
   gets --ocean-lt (8.31:1) plus an underline, since colour alone is a weak
   affordance here. Scoped to prose containers so chrome and buttons are untouched. */
.ph .lede a,.ph .bd a,.ph .dsp a,.ph .micro a,
.ctaband a:not(.btn),.midcta a:not(.btn),
.band.night a:not(.btn),.sp.dk a:not(.btn),
.uniq a:not(.btn),.cout a:not(.btn),.tcorow.flat a:not(.btn){
  color:var(--ocean-lt);text-decoration:underline;text-decoration-thickness:1px;
  text-decoration-color:rgba(143,166,245,.45);text-underline-offset:2px;
  transition:color .15s,text-decoration-color .15s}
.ph .lede a:hover,.ph .bd a:hover,.ph .dsp a:hover,.ph .micro a:hover,
.ctaband a:not(.btn):hover,.midcta a:not(.btn):hover,
.band.night a:not(.btn):hover,.sp.dk a:not(.btn):hover,
.uniq a:not(.btn):hover,.cout a:not(.btn):hover,.tcorow.flat a:not(.btn):hover{
  color:#fff;text-decoration-color:currentColor}
/* Non-prose anchors on dark surfaces: the brand wordmark and the rail's home card.
   Their children already override to white, but resetting the inherited colour keeps
   the light-surface link blue from reaching a dark surface if copy is added later. */
.brandlink{color:var(--bone)}
.relgrid .relhome{color:rgba(255,255,255,.72)}

/* ════════════════════════════════════════════════════════════════════
   NAV CHROME — dropdown panels, mobile drawer, footer.

   The footer block below is folded in verbatim from the handoff's
   _kit/site-chrome.css. The dropdown and drawer rules are NOT in the
   handoff: site-chrome.js emits .ndrop/.npanel/.npg/.npfoot/.nchev and
   .ndrawer/.ndx/.ndbody/.ndh/.ndk/.ndcta markup, but no CSS for any of
   it was ever written, so the shipped design renders every dropdown
   open at once with 200px chevrons and no working mobile menu.

   Reconstructed here from the handoff's own vocabulary and the two
   orphan rules that survived — .npanel{display:none} below 1080px and
   .npg{grid-template-columns:1fr} below 900px — which establish the
   intent: a multi-column panel on desktop, drawer takes over on mobile.
   ════════════════════════════════════════════════════════════════════ */

/* ── dropdown ──
   Opens on hover and on focus-within, so the panel is reachable by
   keyboard. A padded ::before bridges the gap between the trigger and
   the panel so the pointer can travel without the panel closing. */
.ndrop{position:relative}
.nchev{width:11px;height:11px;flex:0 0 auto;opacity:.55;transition:transform .18s,opacity .18s}
.ndrop:hover .nchev,.ndrop:focus-within .nchev{transform:rotate(180deg);opacity:1}
.npanel{
  position:absolute;top:100%;left:50%;transform:translate(-50%,8px);
  /* Self-sizing: the grid uses max-content columns and the URL captions
     never wrap, so the panel is exactly as wide as its longest slug
     (/FEATURES/INVOICING-PAYMENTS/) instead of relying on a magic width
     that breaks the next time a page is added. */
  z-index:40;margin-top:12px;padding:20px;
  width:max-content;min-width:280px;max-width:min(92vw,760px);
  background:rgba(8,10,18,.93);
  -webkit-backdrop-filter:blur(18px) saturate(1.3);backdrop-filter:blur(18px) saturate(1.3);
  border:1px solid rgba(255,255,255,.13);border-radius:var(--r-lg);
  box-shadow:0 30px 70px -24px rgba(0,0,0,.75),0 0 0 1px rgba(255,255,255,.04) inset;
  opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .18s,transform .18s,visibility .18s}
.npanel::before{content:'';position:absolute;left:0;right:0;top:-14px;height:14px}
.ndrop:hover>.npanel,.ndrop:focus-within>.npanel{
  opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0)}
.npg{display:grid;grid-template-columns:repeat(var(--npcols,1),max-content);gap:2px 22px}
/* `.nlinks a` sets align-items:center and gap:7px for the horizontal top-nav
   row. Panel rows are nested inside .nlinks, so both leak in and centre every
   label. Reset them here rather than loosening the parent, which the top nav
   still needs. */
.npg a{display:flex;flex-direction:column;align-items:flex-start;gap:1px;
  padding:8px 10px;border-radius:var(--r-sm);white-space:normal;
  color:rgba(255,255,255,.9);transition:background .14s,color .14s}
.npg a:hover{background:rgba(255,255,255,.07);color:#fff}
.npg a b{font-size:.86rem;font-weight:600;letter-spacing:-.01em;white-space:nowrap}
.npg a span{font:500 .6rem/1.3 var(--mono);letter-spacing:.1em;text-transform:uppercase;
  white-space:nowrap;color:rgba(255,255,255,.36)}
.npg a:hover span{color:rgba(255,255,255,.55)}
/* pages that exist in the tree but are not built yet carry the signal dot */
.npg a[data-soon] b::after{content:'';display:inline-block;width:4px;height:4px;border-radius:50%;
  background:var(--signal);margin-left:6px;vertical-align:2px;opacity:.7}
.npfoot{margin-top:12px;padding-top:12px;border-top:1px solid rgba(255,255,255,.11);
  grid-column:1/-1}
.npfoot a{display:inline-flex;align-items:center;gap:7px;padding:2px 10px;
  font:700 .6rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;
  color:rgba(255,255,255,.55)}
.npfoot a:hover{color:#fff}
.npfoot a i{font-style:normal;transition:transform .16s}
.npfoot a:hover i{transform:translateX(3px)}

/* light-hero variant — .ph.dk flips the nav to ink on bone */
.ph.dk .npanel{background:rgba(251,251,252,.97);border-color:var(--line-d);
  box-shadow:0 30px 70px -26px rgba(24,24,27,.3),0 0 0 1px rgba(24,24,27,.03) inset}
.ph.dk .npg a{color:var(--ink)}
.ph.dk .npg a:hover{background:rgba(24,24,27,.05)}
.ph.dk .npg a span{color:var(--faint)}
.ph.dk .npg a:hover span{color:var(--muted)}
.ph.dk .npfoot{border-top-color:var(--line)}
.ph.dk .npfoot a{color:var(--muted)}
.ph.dk .npfoot a:hover{color:var(--ink)}

/* ── mobile drawer ──
   Always in the DOM so the toggle is a class flip, never a reflow.
   Full-height, right-anchored, with the CTA pinned to the safe-area
   floor so it survives an iOS home indicator. */
.ndrawer{position:fixed;inset:0;z-index:120;display:flex;flex-direction:column;
  background:linear-gradient(180deg,#05070F 0%,#0A1230 62%,#14173A 100%);
  color:var(--bone);
  transform:translateX(100%);visibility:hidden;
  transition:transform .28s cubic-bezier(.4,0,.2,1),visibility .28s}
.ndrawer.open{transform:translateX(0);visibility:visible}
.ndx{display:flex;justify-content:flex-end;padding:18px clamp(18px,5vw,26px) 6px;flex:0 0 auto}
.ndclose{width:42px;height:42px;border-radius:12px;border:1px solid rgba(255,255,255,.2);
  background:rgba(255,255,255,.06);color:#fff;font-size:1.5rem;line-height:1;
  display:flex;align-items:center;justify-content:center;cursor:pointer}
.ndclose:active{background:rgba(255,255,255,.14)}
.ndbody{flex:1 1 auto;overflow-y:auto;-webkit-overflow-scrolling:touch;
  padding:6px clamp(18px,5vw,26px) 26px}
.ndbody section{padding:14px 0;border-bottom:1px solid rgba(255,255,255,.09)}
.ndbody section:last-child{border-bottom:0}
.ndh{display:flex;align-items:center;min-height:44px;
  font:800 1.15rem/1.2 'Public Sans',system-ui,sans-serif;letter-spacing:-.03em;color:#fff}
.ndk{display:flex;align-items:center;min-height:42px;padding-left:2px;
  font-size:.95rem;color:rgba(255,255,255,.72)}
.ndk:active{color:#fff}
.ndk.sub{padding-left:16px;font-size:.9rem;color:rgba(255,255,255,.56)}
.ndcta{flex:0 0 auto;padding:16px clamp(18px,5vw,26px) calc(18px + env(safe-area-inset-bottom));
  border-top:1px solid rgba(255,255,255,.11);background:rgba(3,4,10,.6)}
.ndcta .btn{width:100%;justify-content:center;background:#fff;color:#12141C}
/* the drawer is a mobile affordance only */
@media (min-width:1081px){.ndrawer{display:none}}

/* ════ FOOTER — folded in verbatim from the handoff's site-chrome.css ════
   Curated, not exhaustive. Scoped to .foot2 so nothing leaks into page
   content.
   Desktop  brand on its own row, five short columns beneath, each capped
            at five links and ending in a "view all" handoff to its hub.
   Mobile   one column of accordion rows. Product stays open so the
            pattern is legible on arrival; the rest are one tap. No grid
            gap, so a closed row leaves a hairline, never a hole. */
.foot2 .fgrid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(18px,2.4vw,36px);align-items:start}
.foot2 .fgrid>.fcol:first-child{grid-column:1/-1;max-width:46ch;padding-bottom:clamp(10px,1.4vw,18px);border-bottom:1px solid rgba(244,240,232,.1)}
.foot2 .fgrid>.fbot{grid-column:1/-1}
.foot2 details.fcol{border:0}
.foot2 details.fcol>summary{display:block;list-style:none;cursor:default;font:700 .62rem/1 var(--mono);letter-spacing:.15em;text-transform:uppercase;color:rgba(244,240,232,.42);margin-bottom:13px}
.foot2 details.fcol>summary::-webkit-details-marker{display:none}
.foot2 details.fcol>summary::marker{content:''}
.foot2 details.fcol>summary::after{content:none}
.foot2 .fls{display:flex;flex-direction:column}
.foot2 .fcol a{display:block;font-size:.85rem;line-height:1.35;color:rgba(244,240,232,.76);padding:5px 0}
.foot2 .fcol a:hover{color:#fff}
.foot2 .fall{margin-top:9px;padding-top:10px;border-top:1px solid rgba(244,240,232,.11);font:700 .6rem/1 var(--mono);letter-spacing:.13em;text-transform:uppercase;color:rgba(244,240,232,.48);display:flex;align-items:center;gap:6px}
.foot2 .fall i{font-style:normal;transition:transform .16s}
.foot2 .fall:hover{color:#fff}
.foot2 .fall:hover i{transform:translateX(3px)}
.foot2 .fcol a[data-soon]::after{content:'';display:inline-block;width:4px;height:4px;border-radius:50%;background:var(--signal);margin-left:6px;vertical-align:2px;opacity:.6}
@media (max-width:1080px){.foot2 .fgrid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:720px){
  .foot2{padding-top:34px;padding-bottom:26px}
  .foot2 .fgrid{grid-template-columns:1fr;gap:0}
  .foot2 .fgrid>.fcol:first-child{max-width:none;padding-bottom:20px;border-bottom-color:rgba(244,240,232,.14)}
  .foot2 details.fcol{border-bottom:1px solid rgba(244,240,232,.1)}
  .foot2 details.fcol>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:46px;cursor:pointer;margin:0;padding:14px 2px;font-size:.7rem;color:rgba(244,240,232,.92);-webkit-tap-highlight-color:transparent}
  .foot2 details.fcol>summary::after{content:'';display:block;flex:0 0 auto;width:9px;height:9px;border-right:1.5px solid var(--signal);border-bottom:1.5px solid var(--signal);transform:rotate(45deg) translate(-2px,-2px);transition:transform .2s}
  .foot2 details.fcol[open]>summary::after{transform:rotate(225deg) translate(-3px,-3px)}
  .foot2 details.fcol>summary:active{color:#fff}
  .foot2 details.fcol .fls{padding:2px 2px 15px}
  .foot2 .fcol a{display:flex;align-items:center;min-height:44px;padding:4px 0;font-size:.9rem}
  .foot2 .fall{margin-top:6px;padding-top:11px}
  .foot2 .fbot{margin-top:24px}
}

/* Motion opt-out — the drawer, panels and chevrons all animate. */
@media (prefers-reduced-motion:reduce){
  .npanel,.nchev,.ndrawer,.npfoot a i,.foot2 .fall i{transition:none}
}

/* Skip link — off-screen until focused, then pinned top-left over the hero. */
.skip{position:absolute;left:-9999px;top:0;z-index:200;padding:12px 18px;
  background:var(--card);color:var(--ink);font-weight:700;font-size:.9rem;
  border-radius:0 0 var(--r-md) 0}
.skip:focus{left:0}

/* ── Early access ── the name/email capture that replaces the buy buttons
   while selling is paused. Rendered by the `early_access` macro in
   site/_blocks.html and anchored at #early-access, which is where every
   paused plan CTA on the site points. */
.eacc{margin-top:clamp(26px,3.2vw,42px);padding:clamp(22px,2.6vw,32px);
  background:var(--card);border:1px solid var(--line);border-radius:16px;
  scroll-margin-top:96px}
.eacc h2{font-size:clamp(1.15rem,2vw,1.5rem);font-weight:800;letter-spacing:-.028em;
  margin:0 0 16px;text-wrap:balance}
.eacc-form{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end}
.eacc-f{display:flex;flex-direction:column;gap:6px;flex:1 1 220px}
/* --muted, not --faint: --faint (#A1A1AA) on the .eacc card measured 2.48:1
   at 9.28px, and these are the ONLY visible labels on the form. */
.eacc-f span{font:700 .62rem/1 var(--mono);letter-spacing:.13em;
  text-transform:uppercase;color:var(--muted)}
.eacc-f input{background:var(--bg-soft,rgba(24,24,27,.04));border:1px solid var(--line-d);
  border-radius:10px;padding:11px 13px;font:inherit;font-size:.95rem;color:var(--ink);
  outline:none;width:100%}
/* A real focus ring, not just a recoloured 1px border. The border alone was
   ~3.08:1 against the card — technically passing SC 1.4.11 and a weak signal
   on the site's only conversion form. */
.eacc-f input:focus-visible{border-color:var(--signal);
  outline:2px solid var(--signal);outline-offset:2px}
.eacc-form .btn{flex:0 0 auto}
/* The honeypot's own off-screen rule lived here. It moved out with the field:
   the form now includes _partials/_form_antispam.html, which carries its own
   inline positioning so the partial works on any page that includes it rather
   than only where a matching stylesheet happens to be loaded. */
/* Two-class selector so it outranks `.eacc-f span` (0,1,1). At one class the
   error inherited the label's mono/uppercase/--faint `font:` shorthand and
   rendered as grey 9px micro-type identical to the field labels. */
.eacc-f .eacc-err,.eacc .eacc-err{display:block;margin-top:5px;
  font:500 .78rem/1.4 var(--sans,inherit);letter-spacing:0;text-transform:none;
  color:var(--red,#D14848)}
.eacc .eacc-err-top{margin:0 0 14px}
/* linq-site.css has no bare `.btn.primary` — every variant is parent-scoped —
   so the submit button fell back to browser chrome inside .eacc.
   Ink fill, matching `.plan .btn.primary` / `.dk .btn.primary` — the site's
   established primary on a light surface. Not --signal: orange on white is
   ~3.4:1, and this is the only conversion control on a paused storefront. */
.eacc .eacc-btn{background:var(--ink);color:#fff;border-color:transparent}
.eacc .eacc-btn:hover{background:var(--signal);color:#fff}
.eacc-ok{margin:14px 0 0;font-weight:700;color:var(--green,#1F9D55)}
