/* ===== PerimeterOne inner pages · the vault. Derived from luxe.css on 19 Oct 2026: gold and navy mapped to black, greys and the vault's blue light ===== */
:root{
  --bg:#000; --fg:#f5f5f7; --dim:#a1a1a6; --faint:#86868b;
  --accent:#f5f5f7; --accent-br:#ffffff; --accent-dim:rgba(245,245,247,.10);
  --line:rgba(245,245,247,.08); --line-2:rgba(245,245,247,.14);
  /* the vault: shadows are plain black */
  --shadow-c:0,0,0;
  /* inner edge highlight */
  --edge:inset 0 1px 0 rgba(255,255,255,.04);
  --glass:#0b0b0c; --glass-2:#0b0b0c;
  --serif:"Public Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;
  --sans:"Public Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;
  --mono:"Geist Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --e:cubic-bezier(.22,1,.36,1);
  --wrap:1180px;
}
*{margin:0;padding:0;box-sizing:border-box}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}
.lenis.lenis-stopped{overflow:hidden}
body{
  background:var(--bg); color:var(--fg); font-family:var(--sans);
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  line-height:1.6; overflow-x:hidden; letter-spacing:.005em;
}
::selection{background:rgba(169,176,255,.30); color:#ffffff}
html{scrollbar-width:thin;scrollbar-color:rgba(169,176,255,.35) #000;-webkit-text-size-adjust:100%;text-size-adjust:100%}
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-track{background:#000}
::-webkit-scrollbar-thumb{background:rgba(169,176,255,.22);border-radius:4px}
::-webkit-scrollbar-thumb:hover{background:rgba(169,176,255,.4)}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.btn:focus-visible{outline-color:var(--accent-br);outline-offset:2px}
.nav-toggle:focus-visible,.nav-sub-t:focus-visible{outline-offset:4px}
.skip-link{position:fixed;top:-60px;left:16px;z-index:100;padding:11px 18px;background:var(--glass-2);border:1px solid var(--accent);border-radius:2px;color:var(--accent-br);font-size:13px;transition:top .2s var(--e)}
.skip-link:focus{top:16px}
#main:focus{outline:none}

/* ---- background stack ---- */
#water{position:fixed;inset:0;width:100vw;height:100vh;z-index:0;display:block}
.veil{position:fixed;inset:0;z-index:1;pointer-events:none;
  background:
   radial-gradient(1100px 720px at 72% 8%, rgba(169,176,255,.10), transparent 60%),
   radial-gradient(900px 900px at 15% 100%, rgba(0,0,0,.55), transparent 60%),
   linear-gradient(180deg, rgba(0,0,0,.72) 0%, rgba(0,0,0,.40) 26%, rgba(0,0,0,.44) 60%, rgba(0,0,0,.86) 100%);}
.grain{position:fixed;inset:0;z-index:2;pointer-events:none;opacity:.05;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}
main,nav,footer{position:relative;z-index:3}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 30px}

/* ---- glass ---- */
.glass{background:var(--glass);backdrop-filter:blur(22px) saturate(135%);-webkit-backdrop-filter:blur(22px) saturate(135%);border:1px solid var(--line)}
.glass-2{background:var(--glass-2);backdrop-filter:blur(34px) saturate(150%);-webkit-backdrop-filter:blur(34px) saturate(150%);border:1px solid var(--line-2)}

/* ---- nav ---- */
nav{position:sticky;top:0;z-index:40;transition:background .4s var(--e),border-color .4s}
nav.scrolled{background:rgba(0,0,0,.62);backdrop-filter:blur(20px) saturate(140%);-webkit-backdrop-filter:blur(20px) saturate(140%);border-bottom:1px solid var(--line)}
.nav-in{display:flex;align-items:center;justify-content:space-between;height:78px}
.brand{font-family:var(--serif);font-size:21px;font-weight:600;letter-spacing:.01em;display:flex;align-items:center;gap:11px}
.brand .mk{width:26px;height:26px;border-radius:50%;border:1px solid var(--accent);position:relative;display:inline-block}
.brand .mk::after{content:"";position:absolute;inset:4px;border-radius:50%;background:radial-gradient(circle at 32% 30%,var(--accent-br),rgba(169,176,255,.15));box-shadow:0 0 14px rgba(169,176,255,.5)}
.brand .logo{height:25px;width:auto;display:block;flex:none}
.nav-links{display:flex;gap:34px;align-items:center}
.nav-links a{font-size:13.5px;line-height:1;color:var(--dim);letter-spacing:.02em;position:relative;transition:color .25s}
.nav-links a::after{content:"";position:absolute;left:0;bottom:-7px;width:100%;height:1px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--e)}
.nav-links a:hover{color:var(--fg)} .nav-links a:hover::after{transform:scaleX(1)}
.nav-links a[aria-current="page"]{color:var(--fg)} .nav-links a[aria-current="page"]::after{transform:scaleX(1)}
.nav-sub-menu a[aria-current="page"]{color:var(--accent-br)}
.nav-cta{display:flex;align-items:center;gap:22px}
.signin{font-size:13.5px;color:var(--dim);text-decoration:underline;text-decoration-color:transparent;text-underline-offset:5px;transition:color .25s,text-decoration-color .25s}
.signin:hover{color:var(--fg);text-decoration-color:rgba(245,245,247,.42)}

/* ---- buttons ---- */
.btn{display:inline-flex;align-items:center;gap:10px;font-size:14px;font-weight:500;letter-spacing:.01em;
  padding:13px 24px;border-radius:2px;transition:transform .35s var(--e),box-shadow .35s,background .3s,color .3s,scale .15s var(--e);cursor:pointer;border:none}
.btn .arr{transition:transform .3s var(--e)} .btn:hover .arr{transform:translateX(4px)}
.btn:active{scale:.965}
.btn-gold{background:linear-gradient(180deg,var(--accent-br),var(--accent));color:#000;font-weight:600;position:relative;overflow:hidden;
  box-shadow:0 10px 34px -14px rgba(169,176,255,.7), inset 0 1px 0 rgba(255,255,255,.35)}
.btn-gold::after{content:"";position:absolute;top:0;left:-140%;width:55%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.5),transparent);transform:skewX(-18deg);pointer-events:none}
.btn-gold:hover::after{left:160%;transition:left .8s var(--e)}
.btn-gold:hover{box-shadow:0 16px 44px -12px rgba(169,176,255,.85), inset 0 1px 0 rgba(255,255,255,.45)}
.btn-ghost{background:transparent;color:var(--fg);border:1px solid var(--line-2)}
.btn-ghost:hover{border-color:var(--accent);color:var(--accent-br);background:rgba(169,176,255,.06)}
.link-arr{color:var(--accent);font-size:14px;font-weight:500;display:inline-flex;align-items:center;gap:8px;transition:gap .3s var(--e),color .25s}
.link-arr:hover{gap:13px;color:var(--accent-br)}
.txt-link{color:var(--accent);text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(169,176,255,.45)}
.txt-link:hover{color:var(--accent-br);text-decoration-color:var(--accent-br)}

/* ---- inline icons ----
   The webfont's latin subset covers U+2191 and U+2193 but NOT U+2192, and no U+2713 at all,
   so the arrow and the check used to fall back to whatever symbol font the OS had (Segoe UI
   Symbol on Windows, Apple Symbols on Mac). Drawing them keeps the stroke weight identical
   to the surrounding type on every machine. */
.i-arr,.i-ck{display:inline-block;flex:none;fill:none;stroke:currentColor;
  stroke-width:2;stroke-linecap:round;stroke-linejoin:round;vertical-align:-.1em}
.i-arr{width:1.02em;height:1.02em}
.i-ck{width:.95em;height:.95em;stroke-width:2.6}
/* the tiny uppercase mono connectors in the architecture diagram */
.i-arr.sm{width:1.35em;height:1.35em;vertical-align:-.34em;stroke-width:1.9}

/* ---- eyebrow ---- */
.eyebrow{display:inline-flex;align-items:center;gap:9px;font-family:var(--mono);font-size:11px;letter-spacing:.28em;
  text-transform:uppercase;color:var(--accent)}
.prose-head .eyebrow{margin-bottom:14px}
.eyebrow i{width:5px;height:5px;border-radius:50%;background:var(--accent);box-shadow:0 0 10px var(--accent)}

/* ---- hero ---- */
.hero{min-height:100vh;min-height:100svh;display:flex;align-items:center;padding:120px 0 80px}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:64px;align-items:center}
.hero h1{font-family:var(--serif);font-weight:500;font-size:clamp(3rem,6.4vw,5.5rem);line-height:1.02;letter-spacing:-.02em;margin:26px 0 0}
.hero h1 em{font-style:normal;color:var(--accent);font-weight:600}
.hero .lead{font-size:clamp(1.05rem,1.5vw,1.28rem);color:var(--dim);max-width:30em;margin:28px 0 0;line-height:1.7}
.cta-row{display:flex;align-items:center;gap:26px;margin-top:40px;flex-wrap:wrap}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:54px;padding-top:30px;border-top:1px solid var(--line)}
.stat{text-align:center}
.stat .n{font-family:var(--serif);font-weight:500;font-size:2.9rem;color:var(--fg);line-height:1;font-variant-numeric:tabular-nums;letter-spacing:-.015em}
.stat .n b{color:var(--accent);font-weight:600}
.stat .n .cup{color:var(--accent);display:inline-block;min-width:3ch;text-align:right}
.stat .l{font-family:var(--mono);font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--faint);margin-top:11px}

/* ---- signed-evidence card ---- */
.card{border-radius:8px;overflow:hidden;position:relative;box-shadow:0 44px 130px -44px rgba(var(--shadow-c),.92),var(--edge)}
.card::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(169,176,255,.55),transparent);z-index:2}
.card-head{display:flex;align-items:center;gap:11px;padding:16px 20px;border-bottom:1px solid var(--line)}
.card-head .seal{width:13px;height:13px;border-radius:50%;border:1px solid var(--accent);position:relative;flex:none;animation:sealRing 2.6s ease-out infinite}
.card-head .seal::after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--accent-br);box-shadow:0 0 9px var(--accent);animation:sealBreathe 2.6s ease-in-out infinite}
@keyframes sealBreathe{0%,100%{opacity:.7;box-shadow:0 0 4px rgba(169,176,255,.4);transform:scale(.8)}50%{opacity:1;box-shadow:0 0 17px rgba(169,176,255,1);transform:scale(1.22)}}
@keyframes sealRing{0%{box-shadow:0 0 0 0 rgba(169,176,255,.6)}70%,100%{box-shadow:0 0 0 9px rgba(169,176,255,0)}}
@media(prefers-reduced-motion:reduce){.card-head .seal,.card-head .seal::after{animation:none}}
.card-head .t{font-family:var(--mono);font-size:11.5px;color:var(--dim);letter-spacing:.08em}
.card-head .chip{margin-left:auto;font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);border:1px solid var(--line-2);border-radius:100px;padding:4px 11px}
.card-body{padding:20px 22px 22px;font-family:var(--mono);font-size:12.5px;line-height:1.45}
.card-body .ln{padding:5px 0;color:var(--dim)}
.card-body .pr{color:var(--accent)} .card-body .cm{color:var(--fg);font-weight:500} .card-body .fl{color:var(--dim)}
.card-body .ar{color:var(--faint)}
.card-body .ok{color:var(--accent-br)}
.card-body .vf{color:var(--fg);margin-top:3px} .card-body .ck{color:var(--accent-br);font-weight:500}
.card-body .sig{color:var(--faint);font-size:10.5px;letter-spacing:.04em;margin-top:13px;padding-top:13px;border-top:1px solid var(--line)}
.card-body .cur{display:inline-block;width:7px;height:14px;background:var(--accent);margin-left:4px;vertical-align:-2px;animation:bl 1.1s steps(1) infinite}
@keyframes bl{50%{opacity:0}}
.card .ln{opacity:0;transform:translateY(6px)}
.card.in .ln{animation:lnin .55s var(--e) forwards}
.card.in .ln:nth-child(1){animation-delay:.18s}
.card.in .ln:nth-child(2){animation-delay:.36s}
.card.in .ln:nth-child(3){animation-delay:.54s}
.card.in .ln:nth-child(4){animation-delay:.72s}
.card.in .ln:nth-child(5){animation-delay:.92s}
.card.in .ln:nth-child(6){animation-delay:1.14s}
@keyframes lnin{to{opacity:1;transform:none}}

/* ---- sections ---- */
.section{padding:120px 0}
.sec-h{max-width:680px;margin:0 auto 64px;text-align:center}
.sec-h h2{font-family:var(--serif);font-weight:500;font-size:clamp(2.1rem,3.6vw,3.1rem);line-height:1.08;letter-spacing:-.01em;margin:18px 0 0}
.sec-h h2 em{font-style:normal;color:var(--accent)}
.sec-h p{color:var(--dim);margin:20px auto 0;font-size:1.06rem;max-width:58ch}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.lcard{border-radius:6px;padding:34px 30px;display:flex;flex-direction:column;box-shadow:0 18px 50px -30px rgba(var(--shadow-c),.6),var(--edge);transition:transform .5s var(--e),border-color .4s,box-shadow .5s var(--e)}
.lcard:hover{transform:translateY(-5px);border-color:rgba(169,176,255,.3);box-shadow:0 34px 72px -32px rgba(var(--shadow-c),.78),var(--edge)}
.lcard .ic{width:46px;height:46px;border-radius:50%;display:flex;align-items:center;justify-content:center;border:1px solid var(--line-2);color:var(--accent);margin-bottom:22px}
.lcard .ic svg{width:21px;height:21px}
.lcard h3{font-family:var(--serif);font-weight:500;font-size:1.45rem;letter-spacing:-.01em;line-height:1.25}
.lcard p{color:var(--dim);margin-top:13px;font-size:.96rem;line-height:1.72}
.lcard .tag{font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--faint);margin-top:auto;padding-top:22px;display:block}
.lcard .tag a{font-family:var(--sans);font-size:13.5px;letter-spacing:.02em;text-transform:none;color:var(--accent);transition:color .25s}
.lcard .tag a:hover{color:var(--accent-br);text-decoration:underline;text-underline-offset:3px}
.lcard p a:not(.link-arr){color:var(--accent);text-decoration:underline;text-decoration-color:rgba(169,176,255,.35);text-underline-offset:3px}
.lcard p a:not(.link-arr):hover{text-decoration-color:var(--accent-br)}
.lcard .tag b{color:var(--accent)}

/* ---- trust strip ---- */
.trust{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.trust-in{display:flex;flex-wrap:wrap;gap:14px 30px;justify-content:center;padding:24px 0;font-family:var(--mono);font-size:12px;letter-spacing:.05em;color:var(--dim)}
.trust-in .tk{color:var(--accent);display:inline-flex} .trust-in .dv{color:var(--faint)}
/* the strip cascades item by item instead of fading in as one lump.
   the parent keeps only the opacity fade so the two motions don't muddy each other */
.trust-in[data-reveal]{transform:none;filter:none;transition:opacity .45s var(--e)}
.trust-in>span{opacity:0;transform:translateY(9px);transition:opacity .65s var(--e),transform .65s var(--e)}
.trust-in.in>span{opacity:1;transform:none}
.trust-in.in>span:nth-child(1){transition-delay:.06s}
.trust-in.in>span:nth-child(2){transition-delay:.16s}
.trust-in.in>span:nth-child(3){transition-delay:.26s}
.trust-in.in>span:nth-child(4){transition-delay:.36s}
@media(prefers-reduced-motion:reduce){.trust-in>span{opacity:1;transform:none;transition:none}}

/* ---- statement ---- */
.statement{padding:144px 0}
.statement-in{max-width:920px;margin:0 auto;text-align:center}
.statement q{font-family:var(--serif);font-weight:500;font-size:clamp(1.8rem,3.4vw,3rem);line-height:1.32;letter-spacing:-.01em;quotes:none}
.statement q em{font-style:normal;color:var(--accent)}
.statement .by{font-family:var(--mono);font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--faint);margin-top:34px}
/* the attribution used to lead with an em dash; a gold hairline carries it instead */
.statement .by::before{content:"";display:block;width:28px;height:1px;margin:0 auto 16px;background:linear-gradient(90deg,transparent,rgba(169,176,255,.65),transparent)}

/* ---- final cta ---- */
.cta-final{padding:40px 0 128px}
.cta-card{border-radius:8px;padding:74px 40px;text-align:center;box-shadow:0 40px 120px -50px rgba(var(--shadow-c),.9),var(--edge)}
.cta-card h2{font-family:var(--serif);font-weight:500;font-size:clamp(2.2rem,4vw,3.3rem);line-height:1.06;letter-spacing:-.01em}
.cta-card h2 em{font-style:normal;color:var(--accent)}
.cta-card p{color:var(--dim);margin:20px auto 0;max-width:34em}
.cta-card .cta-row{justify-content:center}

/* ---- footer ---- */
footer{border-top:1px solid var(--line);padding:64px 0 40px;background:rgba(0,0,0,.55);backdrop-filter:blur(10px)}
.foot-top{display:grid;grid-template-columns:1.4fr repeat(5,1fr);gap:26px}
.foot-brand .brand{margin-bottom:16px}
.foot-brand p{color:var(--dim);font-size:.92rem;max-width:24em;margin-bottom:22px}
.foot-cols h3{font-family:var(--mono);font-size:10.5px;font-weight:400;letter-spacing:.18em;text-transform:uppercase;color:var(--faint);margin-bottom:16px}
.foot-cols ul{list-style:none} .foot-cols li{margin-bottom:11px}
.foot-cols a{color:var(--dim);font-size:.92rem;text-decoration:underline;text-decoration-color:transparent;text-underline-offset:4px;transition:color .25s,text-decoration-color .25s}
.foot-cols a:hover{color:var(--accent);text-decoration-color:rgba(169,176,255,.45)}
.foot-bot{display:flex;justify-content:space-between;margin-top:52px;padding-top:26px;border-top:1px solid var(--line);font-family:var(--mono);font-size:11px;letter-spacing:.05em;color:var(--faint)}

/* ---- reveal ---- */
[data-reveal]{opacity:0;transform:translateY(30px) scale(.99);filter:blur(6px);transition:opacity 1.05s var(--e),transform 1.05s var(--e),filter 1.05s var(--e)}
[data-reveal].in{opacity:1;transform:none;filter:none}
[data-reveal][data-i="1"]{transition-delay:.1s}[data-reveal][data-i="2"]{transition-delay:.2s}[data-reveal][data-i="3"]{transition-delay:.3s}
.hero h1[data-reveal]{transform:translateY(44px) scale(.975);filter:blur(13px);transition-duration:1.35s}
.hero h1[data-reveal].in{transform:none;filter:none}
@media(prefers-reduced-motion:reduce){[data-reveal]{opacity:1;transform:none;filter:none;transition:none}}

/* ===== subpage components ===== */
/* centered short hero for inner pages */
.hero.center{min-height:auto;padding:180px 0 70px;text-align:center}
.hero.center .hero-grid{display:block;max-width:780px;margin:0 auto}
.hero.center .lead{margin:28px auto 0}
.hero.center .cta-row{justify-content:center}

/* editorial numbered list */
.feat{max-width:920px;margin:0 auto;border-top:1px solid var(--line)}
.feat-row{display:grid;grid-template-columns:64px 1fr;gap:28px;padding:40px 4px;border-bottom:1px solid var(--line);align-items:start;transition:background .4s var(--e)}
.feat-row:hover{background:rgba(169,176,255,.025)}
.feat-row .n{font-family:var(--serif);font-style:normal;font-size:2.3rem;color:var(--accent);line-height:1}
.feat-row h3{font-family:var(--serif);font-weight:500;font-size:1.5rem;letter-spacing:-.01em;display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.feat-row h3 .tag{font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--faint);border:1px solid var(--line-2);border-radius:100px;padding:3px 9px}
.feat-row h3 .tag.live{color:var(--accent);border-color:rgba(169,176,255,.35);background:rgba(169,176,255,.06)}
.feat-row p{color:var(--dim);margin-top:12px;max-width:66ch;line-height:1.72}

/* pricing */
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;max-width:1100px;margin:0 auto;align-items:stretch}
.price{display:flex;flex-direction:column;border-radius:14px;padding:40px 34px;position:relative;cursor:pointer;box-shadow:0 22px 55px -34px rgba(var(--shadow-c),.7),var(--edge);transition:transform .5s var(--e),border-color .4s,box-shadow .5s var(--e)}
.price:hover{transform:translateY(-6px);border-color:rgba(169,176,255,.3);box-shadow:0 38px 74px -34px rgba(var(--shadow-c),.85),var(--edge)}
.price.feat{border-color:rgba(169,176,255,.5);box-shadow:0 38px 86px -38px rgba(169,176,255,.4),inset 0 0 0 1px rgba(169,176,255,.1)}
.price.feat::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(169,176,255,.6),transparent)}
.price .badge{position:absolute;top:-11px;left:50%;transform:translateX(-50%);font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#000;background:linear-gradient(180deg,var(--accent-br),var(--accent));border-radius:100px;padding:5px 13px;white-space:nowrap}
.price .pname{font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--accent)}
.price .amt{font-family:var(--serif);font-size:3.25rem;letter-spacing:-.01em;line-height:1;margin:18px 0 4px;color:var(--fg);background:linear-gradient(176deg,#ffffff,#a1a1a6);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.price .amt span{font-family:var(--sans);font-size:1rem;color:var(--dim);font-weight:400;-webkit-text-fill-color:var(--dim)}
.price .pdesc{color:#a1a1a6;font-size:.9rem;margin-bottom:24px;padding-bottom:24px;border-bottom:1px solid var(--line)}
.price ul{list-style:none;margin-bottom:28px}
.price li{color:#a1a1a6;font-size:.92rem;padding:7px 0 7px 30px;position:relative;line-height:1.5}
/* drawn, not typed: the webfont has no U+2713 so the old content:"✓" fell back to a system font */
.price li::before{content:"";position:absolute;left:0;top:8px;width:18px;height:18px;border-radius:50%;
  background-color:rgba(169,176,255,.13);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f5f5f7' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12.5l5.5 5.5L20 7'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:center;background-size:10px 10px}
.price .btn{width:100%;justify-content:center;margin-top:auto}

/* two-up cards */
.cards.two{grid-template-columns:repeat(2,1fr)}
/* neutralize the .feat editorial rule leaking onto the featured PRICE card */
.price.feat{max-width:none;margin:0}

/* long-form / legal prose */
.prose-wrap{max-width:760px;margin:0 auto;background:var(--glass);backdrop-filter:blur(22px) saturate(135%);-webkit-backdrop-filter:blur(22px) saturate(135%);border:1px solid var(--line);border-radius:10px;padding:56px 48px;box-shadow:0 30px 90px -46px rgba(var(--shadow-c),.8),var(--edge)}
.prose-head{margin-bottom:44px;padding-bottom:30px;border-bottom:1px solid var(--line)}
.prose-head h1{font-family:var(--serif);font-weight:500;font-size:clamp(2.2rem,4vw,3.2rem);letter-spacing:-.015em;line-height:1.05}
.prose-head h2{font-family:var(--serif);font-weight:500;font-size:clamp(2rem,3.5vw,2.7rem);letter-spacing:-.015em;line-height:1.06;margin:0}
.prose-head .upd{margin-top:16px;font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:var(--dim)}
.prose h2{font-family:var(--serif);font-weight:500;font-size:1.4rem;line-height:1.3;margin:56px 0 14px;color:var(--fg)}
.prose h3{font-size:1.05rem;font-weight:600;margin:24px 0 8px;color:var(--fg)}
.prose p{color:#a1a1a6;margin-bottom:14px;line-height:1.8;font-size:1.0625rem;max-width:65ch}
.prose p.caps{font-size:.92rem;letter-spacing:.03em;line-height:1.75}
.prose ul{list-style:none;color:#a1a1a6;margin:0 0 16px 2px;line-height:1.8;font-size:1.0625rem;max-width:65ch}
.prose li{position:relative;padding-left:20px;margin-bottom:8px}
.prose li::before{content:"";position:absolute;left:0;top:.72em;width:5px;height:5px;border-radius:50%;background:var(--accent);opacity:.6}
.prose a{color:var(--accent);text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(169,176,255,.45)}
.prose a:hover{text-decoration-color:var(--accent-br)}
.prose strong{color:var(--fg);font-weight:600}

/* ---- live export verifier (verify.html) ---- */
.vf{max-width:960px;margin:0 auto}
.vf-panel{border-radius:10px;overflow:hidden;position:relative;
  box-shadow:0 44px 130px -44px rgba(var(--shadow-c),.92),var(--edge)}
.vf-panel::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;z-index:2;
  background:linear-gradient(90deg,transparent,rgba(169,176,255,.55),transparent)}
.vf-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  padding:16px 22px;border-bottom:1px solid var(--line)}
.vf-head .f{font-family:var(--mono);font-size:12px;color:var(--fg);letter-spacing:.02em}
.vf-head .tagline{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--faint)}
.vf-head .eng{margin-left:auto;font-family:var(--mono);font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--accent);border:1px solid var(--line-2);
  border-radius:100px;padding:4px 11px;white-space:nowrap}
.vf-rows{padding:8px 0;font-family:var(--mono);font-size:12.5px}
.vf-row{display:grid;grid-template-columns:30px 20px 1fr auto;gap:12px;align-items:center;
  padding:9px 22px;border-left:2px solid transparent;transition:background .3s var(--e),border-color .3s}
.vf-row .sq{color:var(--faint);font-size:11px;text-align:right;font-variant-numeric:tabular-nums}
.vf-row .mk{width:15px;height:15px;display:flex;align-items:center;justify-content:center}
.vf-row .ev{color:var(--dim);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vf-row .hs{color:var(--faint);font-size:10.5px;letter-spacing:.03em;white-space:nowrap}
.vf-row.is-ok{border-left-color:rgba(120,190,150,.5);background:rgba(120,190,150,.05)}
.vf-row.is-ok .ev{color:var(--fg)}
.vf-row.is-bad{border-left-color:#e0705f;background:rgba(224,112,95,.09)}
.vf-row.is-bad .ev,.vf-row.is-bad .hs{color:#f0a89b}
.vf-row.is-run{background:rgba(169,176,255,.07);border-left-color:var(--accent)}
.vf-dot{width:9px;height:9px;border-radius:50%;background:var(--line-2)}
.vf-row.is-ok .vf-dot{background:#7fc79b;box-shadow:0 0 9px rgba(127,199,155,.55)}
.vf-row.is-bad .vf-dot{background:#e0705f;box-shadow:0 0 9px rgba(224,112,95,.6)}
.vf-row.is-run .vf-dot{background:var(--accent);animation:vfpulse .8s ease-in-out infinite}
@keyframes vfpulse{0%,100%{opacity:.35;transform:scale(.8)}50%{opacity:1;transform:scale(1.15)}}
@media(prefers-reduced-motion:reduce){.vf-row.is-run .vf-dot{animation:none;opacity:1}}
.vf-foot{padding:18px 22px;border-top:1px solid var(--line);display:flex;gap:16px;
  align-items:center;flex-wrap:wrap}
.vf-verdict{font-family:var(--mono);font-size:12px;letter-spacing:.04em;color:var(--faint)}
.vf-verdict b{font-weight:500}
.vf-verdict.ok b{color:#7fc79b} .vf-verdict.bad b{color:#e0705f}
.vf-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px;align-items:center}
.vf-btn{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;
  padding:10px 15px;border-radius:2px;border:1px solid var(--line-2);background:transparent;
  color:var(--dim);cursor:pointer;transition:color .25s,border-color .25s,background .25s}
.vf-btn:hover{color:var(--fg);border-color:var(--accent);background:rgba(169,176,255,.06)}
.vf-btn[disabled]{opacity:.4;cursor:not-allowed}
.vf-btn.danger:hover{color:#f0a89b;border-color:rgba(224,112,95,.6);background:rgba(224,112,95,.07)}
.vf-note{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--faint);margin-top:16px}
.vf-explain{margin-top:44px;display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.vf-explain .x{border-radius:6px;padding:22px 20px}
.vf-explain h3{font-family:var(--serif);font-weight:500;font-size:1.12rem;margin-bottom:9px}
.vf-explain p{color:var(--dim);font-size:.9rem;line-height:1.66}
@media(max-width:820px){
  .vf-explain{grid-template-columns:1fr}
  .vf-row{grid-template-columns:26px 18px 1fr;gap:9px;padding:9px 16px}
  .vf-row .hs{display:none}
  .vf-head,.vf-foot{padding:14px 16px}
  .vf-head .eng{margin-left:0}
}

/* easter-egg flash */
body.egg::after{content:"";position:fixed;inset:0;z-index:80;pointer-events:none;background:radial-gradient(circle at 50% 32%,rgba(169,176,255,.16),transparent 62%);animation:eggflash .65s ease-out forwards}
@keyframes eggflash{from{opacity:1}to{opacity:0}}

/* ===== responsive nav — Solutions dropdown + mobile hamburger ===== */
.nav-toggle{display:none;background:none;border:0;cursor:pointer;width:44px;height:44px;flex-direction:column;justify-content:center;align-items:center;gap:5px;padding:0}
.nav-toggle span{display:block;height:1.5px;width:22px;background:var(--fg);border-radius:2px;transition:transform .3s var(--e),opacity .25s}
.nav-sub{position:relative}
.nav-sub-t{font-family:var(--sans);font-size:13.5px;line-height:1;color:var(--dim);letter-spacing:.02em;background:none;border:0;cursor:pointer;padding:0;display:inline-flex;align-items:center;gap:6px;transition:color .25s}
.nav-sub-t:hover,.nav-sub.open .nav-sub-t,.nav-sub:hover .nav-sub-t{color:var(--fg)}
/* Solutions is a <button>, so it never picked up the gold underline its sibling
   <a> nav items get. Same rule, same timing, plus a persistent one when you are
   already on a Solutions page. */
.nav-sub-t{position:relative}
.nav-sub-t::after{content:"";position:absolute;left:0;bottom:-7px;width:100%;height:1px;
  background:var(--accent);transform:scaleX(0);transform-origin:left;
  transition:transform .3s var(--e)}
.nav-sub-t:hover::after,.nav-sub:hover .nav-sub-t::after,
.nav-sub.open .nav-sub-t::after,.nav-sub:focus-within .nav-sub-t::after{transform:scaleX(1)}
.nav-sub:has(a[aria-current="page"]) .nav-sub-t::after{transform:scaleX(1)}
.nav-sub .caret{font-size:9px;transition:transform .3s var(--e)}
.nav-sub:hover .caret,.nav-sub.open .caret{transform:rotate(180deg)}
.nav-sub-menu{position:absolute;top:calc(100% + 16px);left:50%;transform:translateX(-50%) translateY(8px);min-width:250px;padding:8px;border-radius:11px;background:rgba(10,10,11,.86);backdrop-filter:blur(24px) saturate(140%);-webkit-backdrop-filter:blur(24px) saturate(140%);border:1px solid var(--line-2);box-shadow:0 26px 64px -26px rgba(var(--shadow-c),.88),var(--edge);opacity:0;visibility:hidden;transition:opacity .28s var(--e),transform .28s var(--e),visibility .28s}
.nav-sub:hover .nav-sub-menu,.nav-sub.open .nav-sub-menu,.nav-sub:focus-within .nav-sub-menu{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.nav-sub-menu a{display:block;padding:9px 13px;border-radius:7px;font-size:13.5px;color:var(--dim);letter-spacing:.01em;transition:color .2s,background .2s}
.nav-sub-menu a:hover{color:var(--fg);background:rgba(169,176,255,.08)}
.nav-sub-menu a::after{display:none}
.nav-signin-m{display:none}

@media(max-width:900px){
  .nav-toggle{display:flex}
  nav.nav-open .nav-toggle span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
  nav.nav-open .nav-toggle span:nth-child(2){opacity:0}
  nav.nav-open .nav-toggle span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
  .nav-cta .signin{display:none}
  .nav-links{display:flex;flex-direction:column;align-items:flex-start;gap:2px;position:absolute;top:100%;left:0;right:0;padding:0 30px;background:rgba(10,10,11,.94);backdrop-filter:blur(24px) saturate(140%);-webkit-backdrop-filter:blur(24px) saturate(140%);border-bottom:1px solid transparent;max-height:0;overflow:hidden;opacity:0;visibility:hidden;pointer-events:none;transition:max-height .42s var(--e),opacity .35s,padding .42s var(--e),border-color .42s,visibility .42s}
  nav.nav-open .nav-links{max-height:84vh;max-height:84dvh;visibility:visible;opacity:1;pointer-events:auto;overflow:auto;padding:12px 30px 22px;border-bottom-color:var(--line)}
  .nav-links>a,.nav-sub-t{padding:12px 0;font-size:16px;width:100%}
  .nav-links>a::after,.nav-sub-t::after{display:none}
  .nav-sub{width:100%}
  .nav-sub-t{justify-content:flex-start}
  .nav-sub .caret{display:none}
  .nav-sub-menu{position:static;transform:none;opacity:1;visibility:visible;min-width:0;padding:0 0 6px 14px;background:none;backdrop-filter:none;-webkit-backdrop-filter:none;border:0;box-shadow:none}
  .nav-sub-menu a{padding:8px 0;font-size:14.5px}
  .nav-signin-m{display:block;color:var(--accent)}
}

/* reduced motion + pricing cross-link */
@media(prefers-reduced-motion:reduce){#water{display:none}}
.price-see{display:block;text-align:center;margin-top:14px;font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);transition:opacity .2s}
.price-see:hover{opacity:.65}

@media(max-width:900px){
  .hero-grid{grid-template-columns:1fr;gap:44px}
  .cards,.cards.two{grid-template-columns:1fr}
  .foot-top{grid-template-columns:1fr 1fr}
  /* mobile nav-links handled by the responsive nav block above */
  .stats{gap:30px}
  .price-grid{grid-template-columns:1fr}
  .feat-row{grid-template-columns:1fr;gap:8px}
}

/* ---- pricing heat ---- */
.price-grid{position:relative}
.price-grid::before{content:"";position:absolute;left:50%;top:46%;width:72%;height:76%;transform:translate(-50%,-50%);background:radial-gradient(ellipse at center,rgba(169,176,255,.15),transparent 66%);filter:blur(54px);pointer-events:none;z-index:0}
.price{z-index:1;background-image:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,0) 40%)}
.price::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:linear-gradient(180deg,rgba(169,176,255,.42),rgba(169,176,255,.05) 55%,transparent);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;transition:background .45s var(--e)}
.price:hover{box-shadow:0 42px 82px -34px rgba(var(--shadow-c),.85),0 0 60px -18px rgba(169,176,255,.3),var(--edge)}
.price:hover::after{background:linear-gradient(180deg,rgba(169,176,255,.75),rgba(169,176,255,.22) 60%,rgba(169,176,255,.06))}
.price.feat{background-image:linear-gradient(180deg,rgba(169,176,255,.1),rgba(255,255,255,0) 44%);box-shadow:0 34px 92px -32px rgba(169,176,255,.5),inset 0 1px 0 rgba(255,255,255,.07)}
.price.feat::after{background:linear-gradient(180deg,rgba(169,176,255,.9),rgba(169,176,255,.3) 50%,rgba(169,176,255,.09))}
.price.feat:hover{box-shadow:0 40px 104px -30px rgba(169,176,255,.64),inset 0 1px 0 rgba(255,255,255,.09)}
.price .amt{filter:drop-shadow(0 3px 22px rgba(169,176,255,.22))}
.price .btn-gold{box-shadow:0 12px 32px -12px rgba(169,176,255,.55)}
.price.feat .btn-gold{box-shadow:0 16px 42px -12px rgba(169,176,255,.78)}
.price.feat::before{background-size:200% 100%;animation:price-shimmer 6s linear infinite}
@keyframes price-shimmer{0%{background-position:160% 0}100%{background-position:-160% 0}}
@media(prefers-reduced-motion:reduce){.price.feat::before{animation:none}}
/* click-to-select glow + magnetic pop (middle stays gold on its own via .feat) */
.price.selected{border-color:rgba(169,176,255,.6);box-shadow:0 38px 100px -30px rgba(169,176,255,.6),inset 0 1px 0 rgba(255,255,255,.09);animation:pricePop .42s var(--e)}
.price.selected::after{background:linear-gradient(180deg,rgba(169,176,255,.98),rgba(169,176,255,.34) 50%,rgba(169,176,255,.1))}
.price.selected:hover{box-shadow:0 42px 108px -28px rgba(169,176,255,.68),inset 0 1px 0 rgba(255,255,255,.1)}
.price.selected .btn-gold{box-shadow:0 16px 46px -12px rgba(169,176,255,.82)}
@keyframes pricePop{0%{scale:1}38%{scale:1.045}68%{scale:.99}100%{scale:1}}
@media(prefers-reduced-motion:reduce){.price.selected{animation:none}}

/* veteran-owned badge */
.vet-badge{display:inline-flex;align-items:center;white-space:nowrap;gap:7px;margin:0 0 22px;padding:6px 13px 6px 11px;border:1px solid var(--line-2);border-radius:100px;font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);background:rgba(169,176,255,.06)}
.vet-badge svg{flex:none;opacity:.95}

/* ===== final polish pass ===== */
/* anchor targets clear the sticky nav */
html{scroll-padding-top:96px}

/* balanced display heads / clean body rag */
.hero h1,.sec-h h2,.cta-card h2,.statement q,.prose-head h1,.prose-head h2,.lcard h3{text-wrap:balance}
.hero .lead,.sec-h p,.cta-card p,.lcard p,.feat-row p,.prose p{text-wrap:pretty}

/* reveal-cascade fix — keep hover transitions crisp while cards fade/rise in */
.lcard[data-reveal]{transition:opacity 1.05s var(--e),filter 1.05s var(--e),transform .5s var(--e),border-color .4s,box-shadow .5s var(--e)}
.feat-row[data-reveal]{transition:opacity 1.05s var(--e),filter 1.05s var(--e),transform 1.05s var(--e),background .4s var(--e)}
.price[data-reveal]{transition:opacity 1.05s var(--e),filter 1.05s var(--e),transform .5s var(--e),border-color .4s,box-shadow .5s var(--e)}
/* glass keeps its backdrop-blur; skip the element-blur reveal on it (jank + double-blur) */
[data-reveal].glass,[data-reveal].glass-2{filter:none}

/* collapse doubled vertical rhythm */
.statement + .statement{padding-top:0}
.hero.center + .section{padding-top:56px}

/* terminal component (quickstart) */
/* min-width:0 is load-bearing: a grid item defaults to min-width:auto, so a nowrap
   scroller inside one widens the whole track and pushes the PAGE sideways on phones.
   Scroll the terminal, never the document. */
.feat-row>div{min-width:0}
.term{font-family:var(--mono);font-size:12.5px;line-height:1.7;margin-top:16px;padding:12px 16px;border:1px solid var(--line);border-radius:6px;background:rgba(10,10,11,.6);color:var(--fg);overflow-x:auto;white-space:nowrap;min-width:0}
.term .p{color:var(--faint);margin-right:8px}
.term .ok{color:var(--accent-br)}

/* pricing: only one card reads "chosen" at a time */
.price-grid.has-sel .price.feat:not(.selected){border-color:var(--line);box-shadow:0 22px 55px -34px rgba(var(--shadow-c),.7),var(--edge);background-image:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,0) 40%)}
.price-grid.has-sel .price.feat:not(.selected)::before{animation:none;opacity:.35}
.price-grid.has-sel .price.feat:not(.selected)::after{background:linear-gradient(180deg,rgba(169,176,255,.42),rgba(169,176,255,.05) 55%,transparent)}

/* reduced-motion: still the evidence card + cursor */
@media(prefers-reduced-motion:reduce){.card .ln,.card.in .ln{opacity:1;transform:none;animation:none}.card-body .cur{animation:none}}

/* laptop-height desktop: keep the hero CTA *and the trust stat row* above the fold
   (1366×768 and the very common 1440×900 / 1536×864 laptop panes) */
@media(min-width:901px) and (max-height:960px){.hero{padding:48px 0 56px}.hero h1{font-size:clamp(3rem,5.6vw,4.6rem);margin-top:18px}.hero .lead{margin-top:20px}.hero .cta-row{margin-top:30px}.hero .stats{margin-top:28px;padding-top:24px}}
/* only the SHORTEST laptops trade stat scale for the fold; 1440x900 keeps the full size */
@media(min-width:901px) and (max-height:860px){.hero .stat .n{font-size:2.4rem}.hero .stat .l{margin-top:8px}.hero .stats{margin-top:22px;padding-top:20px}}

/* tablet squeeze 901–1180: scale chrome, keep 3-up composition */
@media(min-width:901px) and (max-width:1180px){.lcard{padding:26px 22px}.lcard h3{font-size:1.3rem}.price{padding:32px 26px}.hero-grid{gap:44px}.cards{gap:18px}
  /* keep each signed-run event on ONE line: a wrapped terminal line reads like a bug */
  .card-body{font-size:11.5px;padding:18px 18px 20px}.card-head{padding:14px 18px}}

/* nav never overflows narrow phones */
.nav-cta .btn{white-space:nowrap}
@media(max-width:480px){nav .brand{font-size:17px}nav .brand .logo{height:22px}.nav-cta{gap:12px}.nav-cta .btn{padding:12px 16px;font-size:13px}}
@media(max-width:390px){nav .brand{font-size:0;gap:0}nav .brand .logo{height:26px}}

/* phone hero: softer clamp (keep the forced break — hiding it jams adjacent words) */
@media(max-width:560px){.hero h1{font-size:clamp(2.4rem,10.5vw,3rem);line-height:1.07}}

/* phone stat ledger */
@media(max-width:480px){.stats{grid-template-columns:1fr;gap:14px;padding-top:24px}.stat{display:flex;align-items:baseline;gap:16px;text-align:left}.stat .l{margin-top:0}
  /* fixed numeral column so the three labels start on one line, like a ledger */
  .stat .n{min-width:4.2ch}}

/* one mobile rhythm scale — roughly halves scroll-to-content */
@media(max-width:640px){
  .wrap{padding:0 22px}
  .section{padding:72px 0}
  .statement{padding:88px 0}
  .hero{padding:96px 0 64px}
  .hero.center{padding:128px 0 48px}
  .sec-h{margin-bottom:44px}
  .cta-card{padding:52px 26px}
  .cta-final{padding:24px 0 88px}
  .prose-wrap{padding:40px 22px}
  .foot-brand{grid-column:1/-1}
  .foot-bot{flex-wrap:wrap;gap:6px 16px}
}


/* clickable story cards (why.html) */
a.lcard { display: block; text-decoration: none; color: inherit; }
a.lcard:hover { text-decoration: none; }
a.lcard .src-note {
  display: inline-block; margin-top: .9rem;
  font-size: .74rem; letter-spacing: .1em; text-transform: uppercase;
  color: var(--gold, #f5f5f7); opacity: .85;
}
a.lcard:hover .src-note, a.lcard:focus-visible .src-note { opacity: 1; text-decoration: underline; }
a.lcard:focus-visible { outline: 2px solid var(--gold, #f5f5f7); outline-offset: 3px; }


/* why-block + nav fit */
/* Nav gained an item, so it overflowed just above the 900px collapse point.
   Tighten spacing in that band and stop labels wrapping mid phrase. */
.nav-links a, .nav-sub-t { white-space: nowrap; }
.nav-cta a { white-space: nowrap; }
@media (min-width: 901px) and (max-width: 1180px) {
  .nav-links { gap: 20px; }
  .nav-links a, .nav-sub-t { font-size: 12.5px; }
  .nav-cta { gap: 14px; }
}
@media (min-width: 901px) and (max-width: 1010px) {
  .nav-links { gap: 15px; }
  .nav-links a, .nav-sub-t { font-size: 12px; }
}

/* The "Why Halo" label should carry, not whisper. */
.eyebrow.eyebrow-lg {
  font-size: 13px;
  letter-spacing: .22em;
  color: var(--accent, #f5f5f7);
  opacity: 1;
}

/* Close the dead air between the why block and the line that pays it off. */
#why { padding-bottom: 34px; }
#why + .statement { padding-top: 18px; }

/* ═══════════ the vault layer · the inner pages speak the home page's language ═══════════
   Black, Apple greys, white type, Public Sans; the only colour is the vault's blue light.
   Everything above this line is the old luxe system with its gold and navy mapped to that palette. */
:root{ --t1:#f5f5f7; --t2:#a1a1a6; --t3:#86868b; --bg2:#0b0b0c; --led:#3f3ea1; --led-hi:#a9b0ff;
  --quote:"Baskervville","Iowan Old Style",Georgia,"Times New Roman",serif;
  --gl:max(16px,env(safe-area-inset-left,0px)); --gr:max(16px,env(safe-area-inset-right,0px));
  --ease:cubic-bezier(.22,1,.36,1); color-scheme:dark }
html{background:#000}
body{font-size:17px;line-height:1.55;letter-spacing:0;text-rendering:optimizeLegibility}
#water,.veil,.grain{display:none!important}
.wrap{max-width:1180px;padding-left:var(--gl);padding-right:var(--gr)}
::selection{background:rgba(169,176,255,.3);color:#fff}
:focus-visible{outline-color:var(--t1)}

/* nav: the home page's bar */
nav,nav.scrolled{background:rgba(0,0,0,.66);backdrop-filter:blur(18px) saturate(1.2);-webkit-backdrop-filter:blur(18px) saturate(1.2);border-bottom:1px solid var(--line)}
.nav-in{height:60px}
.brand{font-family:var(--sans);font-size:16px;font-weight:600;letter-spacing:-.01em;gap:10px}
.brand .logo{height:22px}
.nav-links a,.nav-sub-t{color:var(--t1);opacity:.8;font-weight:500;letter-spacing:0}
.nav-links a:hover,.nav-sub-t:hover,.nav-sub.open .nav-sub-t,.nav-sub:hover .nav-sub-t,.nav-links a[aria-current="page"]{color:var(--t1);opacity:1}
.nav-links a::after,.nav-sub-t::after{background:currentColor}
.nav-sub-menu{background:rgba(14,14,15,.94);border:0;box-shadow:inset 0 0 0 1px var(--line-2),0 24px 48px -24px #000}
.nav-sub-menu a{color:var(--t2);opacity:1}
.nav-sub-menu a:hover,.nav-sub-menu a[aria-current="page"]{color:var(--t1);background:rgba(245,245,247,.06)}
.signin{color:var(--t1);opacity:.8;font-weight:500}.signin:hover{opacity:1;color:var(--t1)}
.nav-cta{gap:18px}
.nav-cta .btn{height:34px;padding:0 16px;font-size:13px}
@media (min-width:1181px){ .nav-links{gap:26px} .nav-links a,.nav-sub-t,.signin{font-size:14px} }
@media (max-width:900px){ nav.nav-open .nav-links{background:#000;padding-left:var(--gl);padding-right:var(--gr)} }

/* buttons and links: white pill, hairline ghost, a quiet chevron */
.btn{height:46px;padding:0 22px;border-radius:999px;font-size:15px;font-weight:600;letter-spacing:0;gap:8px}
.btn .arr{display:none}
.btn-gold{background:var(--t1);color:#000;box-shadow:none}
.btn-gold::after{display:none}
.btn-gold:hover{background:#fff;box-shadow:none;transform:translateY(-1px)}
.btn-ghost{background:transparent;color:var(--t1);border:0;box-shadow:inset 0 0 0 1px rgba(245,245,247,.5)}
.btn-ghost:hover{color:var(--t1);background:rgba(245,245,247,.06);box-shadow:inset 0 0 0 1px var(--t1)}
.link-arr{color:var(--t1);font-size:15px;font-weight:600;gap:6px}
.link-arr:hover{gap:6px;color:var(--t1)}
.link-arr .i-arr,.link-arr .arr{display:none}
.link-arr::after{content:"\203A";font-size:1.25em;line-height:1;transform:translateY(-1px);transition:transform .3s var(--ease)}
.link-arr:hover::after{transform:translate(3px,-1px)}
.txt-link,.lcard p a:not(.link-arr),.lcard .tag a,.prose a{color:var(--t1);text-decoration-color:rgba(245,245,247,.4)}
.txt-link:hover,.lcard p a:not(.link-arr):hover,.prose a:hover{color:#fff;text-decoration-color:var(--t1)}
.cta-row{gap:12px 22px;margin-top:36px}

/* type: the kicker, the big sans, the grey lead */
.eyebrow{font-size:12px;letter-spacing:.08em;color:var(--t3)}
.eyebrow i{display:none}
.hero h1{font-family:var(--sans);font-weight:600;font-size:clamp(38px,5.2vw,80px);line-height:1.02;letter-spacing:-.03em;margin-top:18px}
.sec-h h2,.cta-card h2,.prose-head h1,.prose-head h2{font-family:var(--sans);font-weight:600;font-size:clamp(30px,3.6vw,52px);line-height:1.08;letter-spacing:-.025em}
.hero h1 em,.sec-h h2 em,.cta-card h2 em,.prose-head h1 em,.prose-head h2 em,.lcard h3 em,.feat-row h3 em{font-style:normal;color:inherit;font-weight:inherit}
.lcard h3,.feat-row h3,.prose h2,.vf-explain h3{font-family:var(--sans);font-weight:600;letter-spacing:-.015em}
.hero .lead,.sec-h p,.cta-card p{color:var(--t2);font-size:clamp(17px,1.35vw,21px);line-height:1.45}

/* inner heroes: one left edge, under a soft fall of the vault's light */
.hero.center{text-align:left;position:relative;isolation:isolate;overflow:hidden;padding:clamp(150px,20vh,200px) 0 clamp(64px,9vh,100px)}
.hero.center::before{content:"";position:absolute;left:0;right:0;top:0;height:82%;z-index:-1;pointer-events:none;opacity:.62;
  background:url(img/shoot/light_pool_top-1200.jpg) 50% 30%/cover no-repeat;
  -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 22%,#000 40%,transparent 92%),linear-gradient(90deg,transparent 0,#000 22%,#000 78%,transparent 100%);-webkit-mask-composite:source-in;
  mask-image:linear-gradient(180deg,transparent 0,#000 22%,#000 40%,transparent 92%),linear-gradient(90deg,transparent 0,#000 22%,#000 78%,transparent 100%);mask-composite:intersect}
.hero.center .hero-grid{display:block;width:100%;max-width:1180px;margin:0 auto}   /* the grid IS the .wrap: keep it centred */
.hero.center .hero-grid > div{max-width:880px}
.hero.center .lead{margin:24px 0 0;max-width:60ch}
.hero.center .cta-row{justify-content:flex-start}
.hero.center + .section{padding-top:clamp(40px,6vh,64px)}

/* sections: left-aligned heads, home spacing */
.section{padding:clamp(80px,11vh,136px) 0}
.sec-h{max-width:none;margin:0 0 52px;text-align:left}
.sec-h h2{max-width:20ch;margin-top:18px}
.sec-h p{margin:18px 0 0;max-width:60ch}

/* cards: the home page's dark panels, no glass, no lift */
.glass,.glass-2{backdrop-filter:none;-webkit-backdrop-filter:none}
.glass{background:var(--bg2);border:1px solid var(--line-2)}
.glass-2{background:var(--bg2);border:1px solid var(--line-2)}
.cards{gap:16px}
.lcard{border-radius:16px;padding:30px 28px 32px;box-shadow:none}
.lcard:hover{transform:none;border-color:rgba(245,245,247,.26);box-shadow:none}
.lcard .ic{width:auto;height:auto;border:0;border-radius:0;justify-content:flex-start;color:var(--t1);margin-bottom:18px}
.lcard .ic svg{width:24px;height:24px}
.lcard h3{font-size:21px;line-height:1.25}
.lcard p{color:var(--t2);font-size:15.5px;line-height:1.6;margin-top:12px}
.lcard .tag{font-size:12px;letter-spacing:.08em;color:var(--t3)}
.lcard .tag b{color:var(--t2);font-weight:500}
@media (min-width:901px) and (max-width:1180px){ .lcard{padding:26px 22px} .lcard h3{font-size:19px} }

/* the trust strip and the signed-evidence card */
.trust{border:0}
.trust-in{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--t2)}
.trust-in .tk{color:var(--led-hi)}
.card{background:rgba(10,10,11,.8);border:1px solid var(--line-2);border-radius:14px;box-shadow:0 40px 120px -50px rgba(63,62,161,.55)}
.card::before{background:linear-gradient(90deg,transparent,rgba(169,176,255,.5),transparent)}
.card-body .pr,.card-head .chip{color:var(--t2)}
.card-body .ok,.card-body .ck,.term .ok{color:var(--led-hi);text-shadow:0 0 14px rgba(63,62,161,.95)}
.card-head .seal{border-color:var(--led-hi)}
.card-head .seal::after{background:var(--led-hi);box-shadow:0 0 9px var(--led)}
.card-body .cur{background:var(--t1)}
.term{background:#0b0b0c;border-color:var(--line-2)}
.stat .n{font-family:var(--sans);font-weight:600;letter-spacing:-.03em}
.stat .n b,.stat .n .cup{color:var(--t1)}
.stat .l{font-size:12px;letter-spacing:.08em;color:var(--t3)}

/* statements: the home page's serif quote */
.statement{padding:clamp(96px,14vh,150px) 0}
.statement-in{max-width:900px}
.statement q{font-family:var(--quote);font-weight:400;font-size:clamp(26px,3vw,42px);line-height:1.22;letter-spacing:-.01em;color:var(--t2)}
.statement q em{font-style:italic;color:var(--t1)}
.statement .by{font-size:12px;letter-spacing:.08em;color:var(--t3);margin-top:24px}
.statement .by::before{display:none}
.statement + .statement{padding-top:0}

/* numbered rows: mono numerals like the home's steps */
.feat{max-width:none;border-top:1px solid var(--line)}
.feat-row{grid-template-columns:88px 1fr;padding:36px 0}
.feat-row:hover{background:none}
.feat-row .n{font-family:var(--mono);font-style:normal;font-size:clamp(30px,3vw,44px);color:var(--t3);letter-spacing:-.02em}
.feat-row h3{font-size:21px}
.feat-row h3 .tag{font-size:11px;letter-spacing:.08em;color:var(--t3)}
.feat-row h3 .tag.live{color:var(--led-hi);border-color:rgba(169,176,255,.35);background:rgba(63,62,161,.14)}
.feat-row p{color:var(--t2)}

/* pricing */
.price{border-radius:16px;box-shadow:none}
.price:hover{transform:none;border-color:rgba(245,245,247,.26);box-shadow:none}
.price.feat{border-color:rgba(169,176,255,.45);box-shadow:0 0 0 1px rgba(169,176,255,.1),0 30px 80px -40px rgba(63,62,161,.6)}
.price .badge{background:var(--t1);color:#000}
.price .pname{color:var(--t2)}
.price .amt{font-family:var(--sans);font-weight:600;letter-spacing:-.03em}
.price .pdesc,.price li{color:var(--t2)}
.price li::before{background-color:rgba(245,245,247,.08)}

/* prose: a plain reading column on black */
.prose-wrap{background:none;border:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;border-radius:0;padding:0;max-width:760px;margin:0}
.prose-head{border-bottom-color:var(--line)}
.prose-head .upd{color:var(--t3)}
.prose h2{font-size:22px}
.prose p,.prose ul{color:var(--t2)}
.prose li::before{background:var(--t3);opacity:1}
@media (max-width:640px){ .prose-wrap{padding:0} }

/* the closing call: the home page's blue floor light, no card */
.cta-final{position:relative;isolation:isolate;overflow:hidden;padding:clamp(110px,16vh,180px) 0 clamp(120px,18vh,200px)}
.cta-final::before{content:"";position:absolute;left:0;right:0;bottom:0;height:80%;z-index:-1;pointer-events:none;opacity:.9;
  background:url(img/shoot/cta_floor-1900.jpg) 50% 85%/cover no-repeat;
  -webkit-mask-image:linear-gradient(180deg,transparent 0,rgba(0,0,0,.65) 45%,#000 80%,transparent 100%);mask-image:linear-gradient(180deg,transparent 0,rgba(0,0,0,.65) 45%,#000 80%,transparent 100%)}
.cta-card,.cta-card.glass-2{background:none;border:0;border-radius:0;box-shadow:none;padding:0;text-align:left}
.cta-card h2{max-width:24ch}
.cta-card p{margin:22px 0 0;max-width:60ch}
.cta-card .cta-row{justify-content:flex-start}

/* footer: the home page's */
footer{border-top:0;background:none;backdrop-filter:none;-webkit-backdrop-filter:none;padding:64px 0 calc(40px + env(safe-area-inset-bottom,0px));font-size:14px}
.foot-top{grid-template-columns:1.6fr repeat(5,1fr);gap:36px 28px}
.foot-brand{display:flex;flex-direction:column;align-items:flex-start;gap:14px;max-width:30ch}
.foot-brand .brand{margin-bottom:0}
.foot-brand p{color:var(--t2);font-size:14px;margin:0}
.foot-brand .btn{display:none}
.vet-badge{border:0;padding:0;margin:0;border-radius:0;font-size:12px;letter-spacing:.08em;color:var(--t3);background:none}
.vet-badge svg{display:none}
.foot-cols h3{font-family:var(--sans);font-size:13px;font-weight:600;letter-spacing:0;text-transform:none;color:var(--t1);margin-bottom:12px}
.foot-cols li{margin-bottom:9px}
.foot-cols a{color:var(--t2);font-size:14px}
.foot-cols a:hover{color:var(--t1);text-decoration-color:transparent}
.foot-bot{font-family:var(--sans);font-size:13px;letter-spacing:0;color:var(--t3);border-top:1px solid var(--line);margin-top:52px;padding-top:24px}
@media (max-width:980px){ .foot-top{grid-template-columns:repeat(3,1fr)} .foot-brand{grid-column:1/-1} }
@media (max-width:640px){ .foot-top{grid-template-columns:repeat(2,1fr)} .hero.center{padding:120px 0 48px} .section{padding:72px 0} }
/* inline code in prose and cards: the house mono */
code{font-family:var(--mono);font-size:.9em;color:var(--t1)}
.price-grid{max-width:none}   /* the plans span the same edges as everything else */
.hero.center > .wrap{width:100%}   /* the hero is a flex box: its container must not shrink to its text and centre */
/* the split hero (for builders): the headline sized to its column, like the home hero */
.hero:not(.center) h1{font-size:clamp(38px,4vw,62px)}
/* hero numbers: the home page's quiet stats, left-aligned, label underneath */
.stats{border-top-color:var(--line);gap:12px 40px;display:flex;flex-wrap:wrap}
.stat{text-align:left}
.stat .n{font-size:30px;line-height:1.1}
.stat .l{font-family:var(--sans);font-size:13px;letter-spacing:0;text-transform:none;color:var(--t3);margin-top:4px}
/* the promise strip: the home page's band, LED marks, spread edge to edge */
.trust-in{justify-content:space-between;font-family:var(--sans);font-size:15px;letter-spacing:0;text-transform:none;color:var(--t2);padding-block:22px}
.trust-in .tk{color:var(--led-hi);filter:drop-shadow(0 0 6px rgba(63,62,161,.9))}
@media (max-width:390px){ nav .brand{font-size:16px;gap:10px} nav .brand .logo{height:22px} }   /* the home keeps the name beside the mark on phones */
/* phone menu: full-screen black like the home page, the Solutions list plain, not boxed */
@media (max-width:900px){ nav.nav-open .nav-links{max-height:none;height:calc(100vh - 60px);height:calc(100svh - 60px)} .nav-sub-menu{background:none;box-shadow:none} }
/* a card opened from a number on the home page (why.html#records, #fake-users, #billing): it lands clear of the bar and the
   vault's blue light rings it once, then lets go (21 Oct) */
.lcard{scroll-margin-top:120px}
.lcard:target{animation:cardLand 2.8s cubic-bezier(.22,1,.36,1) .5s both}
@keyframes cardLand{0%{box-shadow:0 0 0 1px rgba(169,176,255,0),0 0 0 0 rgba(63,62,161,0)}
  22%{box-shadow:0 0 0 1px rgba(169,176,255,.75),0 0 56px -4px rgba(63,62,161,.95)}
  100%{box-shadow:0 0 0 1px rgba(169,176,255,0),0 0 0 0 rgba(63,62,161,0)}}
@media (prefers-reduced-motion:reduce){ .lcard:target{animation:none;box-shadow:0 0 0 1px rgba(169,176,255,.6)} }

/* ===== the finishing pass (21 Oct, his "the entire website looked over ... personal touch, finishing polish everything needs"):
   the home page's touches carried to every page, plus the fixes the measured audit found ===== */
/* selecting text glows in the vault's own blue */
::selection{background:rgba(63,62,161,.92);color:#fff}
/* read in: the serif statements light word by word on scroll (luxe.js); long ones wrap "pretty" so no word is left alone on a line */
.statement q{text-wrap:pretty}
/* doors: a card that opens something lifts a touch under the pointer, the others step back, and its source line shows a chevron */
a.lcard .src-note::after{content:"\203A";display:inline-block;margin-left:7px;opacity:0;translate:-4px 0;transition:opacity .5s ease,translate .6s cubic-bezier(.22,1,.36,1)}
a.lcard > *{transition:opacity .6s ease}
a.lcard[data-reveal]{transition:opacity 1.05s var(--e),filter 1.05s var(--e),transform .5s var(--e),translate .6s cubic-bezier(.22,1,.36,1),border-color .6s,box-shadow .5s var(--e)}
@media (hover:hover) and (pointer:fine){
  a.lcard.is-lit{translate:0 -4px}
  a.lcard:hover .src-note{text-decoration:none}
  a.lcard.is-lit .src-note::after{opacity:1;translate:0 0}
  .cards.has-lit a.lcard:not(.is-lit) > *{opacity:.4}
}
@media (hover:none){ a.lcard .src-note::after{opacity:1;translate:0 0} }
a.lcard:focus-visible .src-note::after{opacity:1;translate:0 0}
/* the next door: every story page ends by opening the next one, so the site reads like a tour */
.next-door{padding:clamp(12px,2.6vh,32px) 0 clamp(16px,3vh,40px)}   /* balanced: about the same space above (to the content) and below (to the call) */
.next-link{display:inline-flex;flex-direction:column;gap:12px;text-decoration:none;color:var(--t1);-webkit-tap-highlight-color:transparent}
.next-link .nk{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--t3)}
.next-link .nt{font-family:var(--sans);font-weight:600;font-size:clamp(28px,3vw,44px);line-height:1.1;letter-spacing:-.025em;color:var(--t2);text-wrap:balance;transition:color .3s cubic-bezier(.22,1,.36,1)}
.next-link .nt::after{content:"\203A";display:inline-block;margin-left:.28em;transition:translate .35s cubic-bezier(.22,1,.36,1)}
@media (hover:hover) and (pointer:fine){ .next-link:hover .nt{color:var(--t1)} .next-link:hover .nt::after{translate:6px 0} }
.next-link:focus-visible .nt{color:var(--t1)}
/* the light comes up as you arrive: the closing call's blue floor light is faint until the call reaches the screen (luxe.js sets --light) */
.cta-final::before{opacity:calc(.9 * var(--light,1))}
/* phones: the terminal line wraps instead of hiding its verdict off the side */
@media (max-width:600px){ .term{white-space:normal} }
@media (prefers-reduced-motion:reduce){ a.lcard:hover{translate:none} .next-link .nt::after{transition:none} }
/* a page with no closing call (verify) ends on its next door: give it the room the call would have had before the footer */
main > .next-door:last-child{padding-bottom:clamp(96px,14vh,160px)}