/* ============================================================
   assurance.baklyset.no
   Baklys: light from behind. Night navy bands where the product
   is backlit; quiet paper sections for reading in between.
   Evidence, not claims: real-looking records in monospace.
   Type: Noto Serif Display (headlines), Inter (text),
   Noto Sans Mono (evidence). All self-hosted.
   ============================================================ */

@font-face { font-family:"Inter"; font-style:normal; font-display:swap; font-weight:100 900;
  src:url("fonts/inter-var.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:"Inter"; font-style:normal; font-display:swap; font-weight:100 900;
  src:url("fonts/inter-var-ext.woff2") format("woff2");
  unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family:"Baklys Display"; font-style:normal; font-weight:500; font-display:swap;
  src:url("fonts/serif-display-medium.woff2") format("woff2"); }
@font-face { font-family:"Baklys Display"; font-style:normal; font-weight:400; font-display:swap;
  src:url("fonts/serif-display-regular.woff2") format("woff2"); }
@font-face { font-family:"Baklys Mono"; font-style:normal; font-weight:400; font-display:swap;
  src:url("fonts/mono.woff2") format("woff2"); }

:root {
  /* night: the leaflet's deep colours */
  --night-0:#050c22; --night-1:#0a1738; --night-2:#102a6b; --night-3:#173a94; --cobalt:#1e48b8;
  --on-night:#ffffff; --on-night-2:#c9d3ee; --on-night-3:#93a3cc; --night-line:rgba(160,185,255,.14);
  --ember:#ff8a5c; --ember-hot:#ffb08f; --ice:#9db8ff;
  /* paper: the reading sections */
  --bg:#f5f6f9; --bg-alt:#eceff6; --surface:#ffffff;
  --ink:#0b1530; --muted:#4a5571; --faint:#67728d;
  --line:#dde2ec; --line-strong:#c6cddc;
  --accent:#1e48b8; --accent-tint:#e6ecfb;
  --ev-ink:#a3acc2; --ev-bg:transparent;
  --shadow-frame:0 1px 2px rgba(11,21,48,.06), 0 14px 30px -12px rgba(11,21,48,.16), 0 40px 80px -30px rgba(11,21,48,.24);
  --focus:0 0 0 3px #fff, 0 0 0 5px var(--cobalt);
  --radius:12px;
  --sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --serif:"Baklys Display","Iowan Old Style","Palatino Linotype",Georgia,serif;
  --mono:"Baklys Mono",ui-monospace,"SF Mono","JetBrains Mono",Menlo,Consolas,monospace;
  --wrap:1180px; --gutter:clamp(16px, 4vw, 32px);
  --section:clamp(80px, 10vw, 136px);
  --header-h:64px;
  color-scheme:light dark;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg:#121a33; --bg-alt:#0f1730; --surface:#18223f;
    --ink:#e8ecf7; --muted:#a8b3cf; --faint:#8592b3;
    --line:#24305a; --line-strong:#334273;
    --accent:#9db8ff; --accent-tint:#16224a;
    --ev-ink:#3d4b75; --ev-bg:transparent;
    --shadow-frame:0 1px 2px rgba(0,0,0,.4), 0 18px 40px -12px rgba(0,0,0,.55), 0 40px 90px -24px rgba(0,0,0,.6);
    --focus:0 0 0 3px var(--bg), 0 0 0 5px var(--ice);
  }
}

/* ---------- base ---------- */
*, *::before, *::after { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; text-size-adjust:100%; scroll-padding-top:calc(var(--header-h) + 16px); }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior:smooth; } }
body { margin:0; background:var(--bg); color:var(--ink); font-family:var(--sans); font-size:17px; line-height:1.62;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; font-feature-settings:"cv11","ss01"; overflow-x:hidden; }
img, svg, picture { display:block; max-width:100%; }
img { height:auto; }
a { color:var(--accent); text-underline-offset:.2em; text-decoration-thickness:1px; }
a:hover { text-decoration-thickness:2px; }
:focus-visible { outline:none; box-shadow:var(--focus); border-radius:6px; }
h1, h2 { margin:0; font-family:var(--serif); font-weight:500; letter-spacing:-.012em; line-height:1.12; text-wrap:balance; }
h3 { margin:0; font-weight:640; letter-spacing:-.014em; line-height:1.28; }
p { margin:0; }
ul, ol { margin:0; padding:0; list-style:none; }
figure { margin:0; }
em { font-style:normal; font-weight:620; }
::selection { background:#ffd3c0; color:#0b1530; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }
.defs { position:absolute; width:0; height:0; overflow:hidden; }
main { overflow-x:clip; }
.wrap { width:100%; max-width:calc(var(--wrap) + 2 * var(--gutter)); margin-inline:auto; padding-inline:var(--gutter); }
.skip { position:absolute; left:16px; top:-100px; z-index:100; background:#fff; color:#0b1530; padding:10px 16px; border-radius:8px; font-weight:600; }
.skip:focus { top:12px; }

/* dark bands: everything inside reads on night */
.dark { position:relative; background:var(--night-0); color:var(--on-night); isolation:isolate; }
.dark a:not(.btn) { color:#fff; }
.dark :focus-visible { box-shadow:0 0 0 2px var(--night-1), 0 0 0 4px var(--ice); }

/* ---------- type helpers ---------- */
.eyebrow { display:flex; align-items:center; gap:10px; font-family:var(--mono); font-size:12.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--accent); margin-bottom:20px; }
.dark .eyebrow { color:var(--ember-hot); }
.dot { width:7px; height:7px; border-radius:50%; background:var(--ember); box-shadow:0 0 0 3px rgba(255,138,92,.18), 0 0 12px 2px rgba(255,138,92,.55); flex:none; }
.section { padding-block:var(--section); }
.section-head { max-width:780px; margin-bottom:clamp(40px, 5vw, 64px); }
.section-head h2 { font-size:clamp(34px, 1.4rem + 2.4vw, 54px); }
.section-head .intro { margin-top:20px; font-size:clamp(17px, 1rem + .3vw, 20px); color:var(--muted); line-height:1.55; max-width:680px; }

/* evidence: one line of what the scan saw. A design element, not information:
   set close to the background so it reads as texture behind the text. */
.ev { display:block; font-family:var(--mono); font-size:12.5px; line-height:1.5; color:var(--ev-ink); letter-spacing:-.01em;
  overflow-wrap:anywhere; white-space:normal; }
.ev::before { content:"› "; color:var(--ember); opacity:.45; }

/* ---------- buttons ---------- */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:10px; border-radius:999px; font-weight:600; text-decoration:none;
  line-height:1.2; border:1px solid transparent; transition:background-color .2s, border-color .2s, box-shadow .2s; white-space:nowrap; }
.btn:hover { text-decoration:none; }
.btn-lg { padding:15px 26px; font-size:16.5px; }
.btn-sm { padding:8px 16px; font-size:14px; }
.btn-ember { background:var(--ember); color:#0a1738; box-shadow:0 0 0 1px rgba(255,176,143,.6) inset, 0 8px 30px -8px rgba(255,138,92,.6); }
.btn-ember:hover { background:var(--ember-hot); color:#0a1738; box-shadow:0 0 0 1px rgba(255,210,190,.8) inset, 0 10px 40px -6px rgba(255,138,92,.75); }
.btn-ghost { color:#fff; border-color:rgba(200,215,255,.3); background:rgba(255,255,255,.03); }
.btn-ghost:hover { background:rgba(255,255,255,.08); border-color:rgba(200,215,255,.55); color:#fff; }
.ico { width:24px; height:24px; flex:none; }
.ico-btn { width:18px; height:18px; transition:transform .2s; }
.btn:hover .ico-btn { transform:translateX(3px); }

/* ---------- header ---------- */
.site-header { position:sticky; top:0; z-index:50; background:rgba(5,12,34,.94); border-bottom:1px solid var(--night-line);
  -webkit-backdrop-filter:saturate(1.3) blur(12px); backdrop-filter:saturate(1.3) blur(12px); color:var(--on-night); }
.bar { display:flex; align-items:center; gap:28px; height:var(--header-h); }
.brand { display:flex; align-items:center; gap:10px; color:#fff; text-decoration:none; flex:none; border-radius:8px; }
.brand .mark { width:32px; height:32px; }
.brand-text { display:flex; flex-direction:column; gap:4px; }
.brand .word { font-family:var(--sans); font-weight:700; font-size:18px; line-height:1; letter-spacing:.13em; text-transform:uppercase; color:#e6dac6; margin-right:-.13em; }
.brand-sub { font-size:9.5px; font-weight:650; letter-spacing:.17em; text-transform:uppercase; color:var(--on-night-3); line-height:1; }
.nav { margin-left:auto; }
.nav ul { display:flex; gap:2px; }
.nav a { display:block; padding:8px 12px; font-size:14.5px; font-weight:500; color:var(--on-night-2); text-decoration:none; border-radius:8px; }
.nav a:hover { color:#fff; background:rgba(255,255,255,.06); }
.bar-end { display:flex; align-items:center; gap:14px; }
.lang { display:flex; border:1px solid rgba(200,215,255,.2); border-radius:999px; padding:2px; font-family:var(--mono); }
.lang a { font-size:12px; letter-spacing:.06em; padding:4px 10px; border-radius:999px; color:var(--on-night-3); text-decoration:none; }
.lang a:hover { color:#fff; }
.lang a[aria-current] { background:rgba(255,255,255,.12); color:#fff; }
.site-header a:focus-visible { box-shadow:0 0 0 2px var(--night-0), 0 0 0 4px var(--ice); }
@media (max-width: 1080px) { .nav { display:none; } .bar-end { margin-left:auto; } }
.cta-tiny { display:none; }
@media (max-width: 560px) { .cta-long { display:none; } .cta-tiny { display:inline; } .bar-cta { padding:7px 12px; } .bar { gap:12px; } .bar-end { gap:10px; } }
@media (max-width: 380px) { .brand-sub { display:none; } }

/* ---------- horizon: a thin line with light rising behind it ---------- */
.horizon { position:absolute; left:0; right:0; bottom:0; height:1px; pointer-events:none; z-index:2;
  background:linear-gradient(90deg, transparent 0%, rgba(157,184,255,.25) 18%, rgba(255,176,143,.95) 50%, rgba(157,184,255,.25) 82%, transparent 100%); }
.horizon::after { content:""; position:absolute; left:20%; right:20%; top:-28px; height:56px; border-radius:50%;
  background:radial-gradient(50% 50% at 50% 50%, rgba(255,138,92,.28), rgba(30,72,184,.12) 55%, transparent 75%); }
.horizon-top { top:0; bottom:auto; }

/* ---------- hero ---------- */
.hero { overflow:hidden;
  background:
    radial-gradient(70% 60% at 50% 100%, rgba(23,58,148,.85), transparent 70%),
    radial-gradient(40% 30% at 50% 92%, rgba(255,138,92,.22), transparent 75%),
    linear-gradient(180deg, var(--night-0) 0%, var(--night-1) 55%, #0c1d4d 100%);
  padding-bottom:clamp(48px, 6vw, 80px); }
.hero-inner { position:relative; z-index:1; padding-top:clamp(64px, 9vw, 120px); padding-bottom:clamp(48px, 6vw, 80px); }
.hero h1 { font-size:clamp(40px, 1rem + 4.2vw, 72px); line-height:1.04; letter-spacing:-.022em; max-width:780px; }
.hero .lead { margin-top:28px; max-width:620px; font-size:clamp(18px, 1rem + .45vw, 21px); line-height:1.55; color:var(--on-night-2); }
.actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:40px; }
.proof { display:flex; flex-wrap:wrap; gap:10px 28px; margin-top:36px; font-size:15px; color:var(--on-night-2); }
.proof li { display:flex; align-items:center; gap:8px; }
.ico-check { width:17px; height:17px; color:var(--ember); stroke-width:2.2; }

@media (min-width: 761px) { .hero-inner h1, .hero-inner .lead, .hero-inner .actions { max-width:min(780px, 58%); } }
/* the evidence column: records drifting behind the headline */
.evidence-col { position:absolute; z-index:0; top:0; height:min(760px, 62%); right:0; width:min(38vw, 560px); overflow:hidden; pointer-events:none;
  -webkit-mask-image:linear-gradient(180deg, transparent, #000 18%, #000 70%, transparent), linear-gradient(90deg, transparent, #000 15%, #000 85%, transparent);
  -webkit-mask-composite:source-in;
  mask-image:linear-gradient(180deg, transparent, #000 18%, #000 70%, transparent), linear-gradient(90deg, transparent, #000 15%, #000 85%, transparent);
  mask-composite:intersect;
  font-family:var(--mono); font-size:12.5px; line-height:2.3; color:rgba(157,184,255,.34); white-space:nowrap; }
.evidence-track { padding:40px 24px 0 24px; }
.evidence-col li::before { content:""; display:inline-block; width:5px; height:5px; border-radius:50%; margin-right:12px; vertical-align:middle; background:currentColor; }
.evidence-col .ev-bad { color:rgba(255,150,120,.42); }
.evidence-col .ev-warn { color:rgba(255,200,140,.32); }
.evidence-col .ev-ok { color:rgba(157,184,255,.30); }
.evidence-col .ev-info { color:rgba(210,220,255,.26); }
@media (prefers-reduced-motion: no-preference) {
  .evidence-track { animation:drift 90s linear infinite; }
  @keyframes drift { from { transform:translateY(0); } to { transform:translateY(-50%); } }
}
@media (max-width: 1240px) { .evidence-col { width:30vw; } }
@media (max-width: 900px) { .evidence-col { width:100%; opacity:.4; height:420px; } }
@media (max-width: 760px) { .evidence-col { display:none; } }

/* the product, lit from behind */
.hero-visual { position:relative; z-index:1; }
.backlight { position:absolute; z-index:-1; left:6%; right:6%; top:-14%; bottom:8%; pointer-events:none; filter:blur(48px);
  background:
    radial-gradient(45% 40% at 50% 30%, rgba(255,150,105,.70), transparent 72%),
    radial-gradient(70% 60% at 30% 45%, rgba(30,72,184,.95), transparent 72%),
    radial-gradient(70% 60% at 72% 50%, rgba(23,58,148,.95), transparent 72%); }
.frame { position:relative; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-frame); }
.frame figcaption { display:flex; gap:12px; align-items:baseline; padding:12px 18px; font-size:14px; color:var(--muted); border-top:1px solid var(--line); background:var(--surface); line-height:1.45; }
.fig { font-family:var(--mono); font-size:11.5px; letter-spacing:.06em; color:var(--faint); flex:none; }
.frame-hero { border-radius:14px; border:1px solid transparent;
  background:linear-gradient(#0d1734, #0d1734) padding-box,
             linear-gradient(180deg, rgba(255,196,170,.95) 0%, rgba(157,184,255,.55) 22%, rgba(157,184,255,.12) 60%, rgba(157,184,255,.05) 100%) border-box;
  box-shadow:0 -18px 60px -24px rgba(255,138,92,.65), 0 40px 90px -30px rgba(0,0,0,.75); }
.frame-bar { display:flex; gap:7px; align-items:center; height:34px; padding-inline:16px; background:#0d1734; border-bottom:1px solid rgba(157,184,255,.14); }
.frame-bar i { width:10px; height:10px; border-radius:50%; background:rgba(157,184,255,.28); }
.frame-bar span { margin-left:12px; font-family:var(--mono); font-size:11.5px; color:rgba(201,211,238,.6); letter-spacing:.02em; }
.zoom { display:block; cursor:zoom-in; }
.zoom:focus-visible { box-shadow:inset 0 0 0 3px var(--ember); border-radius:0; }
.zoom img, .frame-sm picture img { width:100%; }
@media (max-width: 560px) { .frame-bar { height:24px; padding-inline:10px; gap:5px; } .frame-bar i { width:7px; height:7px; } .frame-bar span { display:none; } }

/* ---------- problem ---------- */
.why { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:clamp(24px, 3.5vw, 48px); }
.why-item { border-top:1px solid var(--line-strong); padding-top:22px; }
.why-item .ev { margin-bottom:22px; min-height:3em; }
.why-item h3 { font-size:21px; margin-bottom:10px; }
.why-item p { color:var(--muted); }
@media (max-width: 860px) { .why { grid-template-columns:1fr; gap:40px; } .why-item .ev { min-height:0; } }

/* ---------- features: a ruled ledger, not cards ---------- */
.features { background:var(--bg-alt); }
.ledger { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); border-top:1px solid var(--line-strong); }
.cell { padding:30px 30px 36px; border-bottom:1px solid var(--line); border-right:1px solid var(--line); }
.cell:nth-child(3n) { border-right:0; }
.cell:nth-child(3n+1) { padding-left:0; }
.cell:nth-child(3n) { padding-right:0; }
.cell .ev { padding:0; background:var(--ev-bg); margin-bottom:20px; font-size:11.5px; }
.cell-head { display:flex; gap:14px; align-items:flex-start; margin-bottom:12px; }
.cell h3 { font-size:18.5px; padding-top:7px; }
.cell p { font-size:15.5px; color:var(--muted); line-height:1.62; }
.rim { position:relative; display:grid; place-items:center; width:40px; height:40px; flex:none; border-radius:50%;
  background:radial-gradient(circle at 50% 30%, rgba(255,138,92,.16), transparent 70%); border:1px solid var(--line-strong); }
.rim::after { content:""; position:absolute; inset:-1px; border-radius:50%; pointer-events:none;
  background:conic-gradient(from 200deg, transparent 0 55%, rgba(255,138,92,.85) 70%, rgba(157,184,255,.6) 82%, transparent 92%);
  -webkit-mask:radial-gradient(farthest-side, transparent calc(100% - 1.5px), #000 calc(100% - 1px)); mask:radial-gradient(farthest-side, transparent calc(100% - 1.5px), #000 calc(100% - 1px)); }
.rim .ico { width:21px; height:21px; }
@media (max-width: 1000px) {
  .ledger { grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .cell:nth-child(n) { padding:28px 24px 32px; border-right:1px solid var(--line); }
  .cell:nth-child(2n) { border-right:0; padding-right:0; }
  .cell:nth-child(2n+1) { padding-left:0; }
}
@media (max-width: 680px) {
  .ledger { grid-template-columns:1fr; }
  .cell:nth-child(n) { padding:26px 0 30px; border-right:0; }
}

/* ---------- tour ---------- */
.tour { padding-bottom:calc(var(--section) - 24px); }
.tour .section-head { margin-bottom:16px; }
.tour-row { display:grid; grid-template-columns:minmax(0, 4fr) minmax(0, 8fr); gap:clamp(32px, 4.5vw, 64px); align-items:center; margin-block:clamp(56px, 8vw, 104px); }
.tour-flip { grid-template-columns:minmax(0, 8fr) minmax(0, 4fr); }
.tour-flip .tour-text { order:2; }
.tour-text h3 { font-family:var(--serif); font-weight:500; font-size:clamp(28px, 1.2rem + 1.2vw, 38px); letter-spacing:-.01em; line-height:1.1; margin-bottom:16px; }
.tour-text p { color:var(--muted); font-size:17.5px; }
.tour-n { display:block; font-family:var(--mono); font-size:12.5px; color:var(--accent); margin-bottom:16px; letter-spacing:.06em; }
.tour-n::before { content:"· "; color:var(--ember); }
.term { display:inline-block; font-family:var(--mono); font-size:.42em; font-weight:400; letter-spacing:0; color:var(--faint);
  vertical-align:middle; position:relative; top:-.15em; margin-left:4px; white-space:nowrap; }
.tour-wide { grid-template-columns:1fr; gap:28px; margin-top:clamp(36px, 4vw, 48px); }
.tour-wide .tour-text { max-width:720px; }
.tour .frame { box-shadow:0 0 0 1px rgba(11,21,48,.02), 0 -10px 40px -24px rgba(255,138,92,.35), var(--shadow-frame); }
@media (max-width: 860px) {
  .tour-row, .tour-flip { grid-template-columns:1fr; gap:24px; }
  .tour-flip .tour-text { order:0; }
}
.phone { width:min(310px, 80vw); justify-self:center; position:relative; }
.phone::before { content:""; position:absolute; z-index:-1; inset:6% -18% 14%; filter:blur(40px); border-radius:50%;
  background:radial-gradient(50% 45% at 50% 35%, rgba(255,138,92,.35), transparent 70%), radial-gradient(60% 60% at 50% 55%, rgba(30,72,184,.35), transparent 70%); }
.tour-phone { isolation:isolate; }
.phone .zoom { border-radius:40px; overflow:hidden; border:9px solid #0a1738; background:#0a1738;
  box-shadow:0 0 0 1px rgba(255,196,170,.35), 0 -14px 40px -18px rgba(255,138,92,.6), var(--shadow-frame); }
.phone figcaption { margin-top:18px; font-size:14px; color:var(--muted); text-align:center; }
.phone .fig { margin-right:6px; }

/* a figure kept at its own small size (the change request: shown, not explained) */
.frame-cap { max-width:640px; width:100%; justify-self:center; }

/* change requests: the differentiator, lit from behind step by step */
.cr-band { margin-block:clamp(64px, 9vw, 120px); padding-block:clamp(72px, 9vw, 120px);
  background:
    radial-gradient(60% 50% at 50% 100%, rgba(23,58,148,.75), transparent 70%),
    linear-gradient(180deg, var(--night-0), var(--night-1)); }
.cr-head { max-width:780px; margin-bottom:48px; }
.cr-head .tour-n { color:var(--ice); }
.cr-head h3 { font-family:var(--serif); font-weight:500; font-size:clamp(32px, 1.3rem + 2vw, 50px); letter-spacing:-.012em; line-height:1.06; margin-bottom:18px; }
.cr-head .term { color:var(--on-night-3); }
.cr-head p { color:var(--on-night-2); font-size:clamp(17px, 1rem + .25vw, 19px); }
.cr-head em { color:#fff; }
.cr-steps { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:28px; }
@media (max-width: 700px) { .cr-steps { grid-template-columns:1fr; } }
.cr-step { position:relative; isolation:isolate; }
.step-glow { position:absolute; z-index:-1; inset:-6% 4% 20%; filter:blur(36px); border-radius:40%; opacity:1; transition:opacity 1.2s ease;
  background:radial-gradient(50% 50% at 50% 20%, rgba(255,138,92,.42), transparent 70%), radial-gradient(70% 60% at 50% 60%, rgba(30,72,184,.75), transparent 72%); }
.cr-step:nth-child(1) .step-glow { opacity:.55; }
.cr-step:nth-child(2) .step-glow { opacity:.7; }
.cr-step:nth-child(3) .step-glow { opacity:.85; }
.js .cr-step:not(.is-lit) .step-glow { opacity:0; }
.js .cr-step:nth-child(2) .step-glow { transition-delay:.35s; }
.js .cr-step:nth-child(3) .step-glow { transition-delay:.7s; }
.js .cr-step:nth-child(4) .step-glow { transition-delay:1.05s; }
.frame-sm { height:100%; display:flex; flex-direction:column; border:1px solid transparent;
  background:linear-gradient(#0f1a3b, #0f1a3b) padding-box, linear-gradient(180deg, rgba(255,196,170,.7), rgba(157,184,255,.18) 40%, rgba(157,184,255,.08)) border-box;
  box-shadow:0 30px 60px -30px rgba(0,0,0,.7); }
.frame-sm figcaption { display:flex; flex-direction:column; gap:6px; padding:16px 20px 20px; font-size:15px; flex:1; color:var(--on-night-2); background:transparent; border-top:1px solid rgba(157,184,255,.14); }
.frame-sm figcaption b { color:#fff; font-weight:620; }
.step-mono { font-family:var(--mono); font-size:12px; color:var(--ember-hot); letter-spacing:.04em; }

/* ---------- built differently: claims paired with evidence ---------- */
.built { padding-bottom:var(--section);
  background:
    radial-gradient(50% 40% at 85% 0%, rgba(23,58,148,.55), transparent 70%),
    linear-gradient(180deg, var(--night-1), var(--night-0)); }
.claims { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:0 clamp(32px, 5vw, 72px); }
.claim { padding:32px 0 34px; border-top:1px solid var(--night-line); display:flex; flex-direction:column; }
.claim-head { display:flex; gap:14px; align-items:flex-start; margin-bottom:12px; }
.claim h3 { font-size:19px; color:#fff; padding-top:8px; }
.claim p { color:var(--on-night-2); font-size:16px; line-height:1.62; }
.dark .rim { border-color:rgba(157,184,255,.25); background:radial-gradient(circle at 50% 25%, rgba(255,138,92,.22), transparent 70%); }
.ev-receipt { margin-top:18px; padding:0; border:0; color:rgba(157,184,255,.38); background:none; font-size:11.5px; align-self:flex-start; max-width:100%; }
@media (max-width: 860px) { .claims { grid-template-columns:1fr; } }

/* ---------- who ---------- */
.split { display:grid; grid-template-columns:minmax(0, 5fr) minmax(0, 7fr); gap:clamp(32px, 6vw, 96px); align-items:start; }
.split .section-head { margin-bottom:0; }
@media (max-width: 900px) { .split { grid-template-columns:1fr; } .split .section-head { margin-bottom:8px; } }
.who-list { counter-reset:who; }
.who-list li { counter-increment:who; display:flex; gap:18px; padding:22px 0; border-bottom:1px solid var(--line); color:var(--muted); font-size:17px; }
.who-list li::before { content:counter(who, decimal-leading-zero); font-family:var(--mono); font-size:12.5px; color:var(--accent); padding-top:4px; flex:none; }
.who-list li:first-child { padding-top:6px; }
.who-list li:last-child { border-bottom:0; }
.who-list b { color:var(--ink); font-weight:640; }

/* ---------- steps ---------- */
.start { background:var(--bg-alt); }
.steps { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:clamp(24px, 3.5vw, 48px); }
.step { position:relative; border-top:1px solid var(--line-strong); padding-top:26px; }
.step-big { display:block; font-family:var(--serif); font-size:64px; line-height:1; color:var(--accent); margin-bottom:22px; font-weight:400; }
.step::before { content:""; position:absolute; top:-1px; left:0; width:56px; height:1px; background:var(--ember); box-shadow:0 0 12px 1px rgba(255,138,92,.6); }
.step h3 { font-size:21px; margin-bottom:10px; }
.step p { color:var(--muted); }
@media (max-width: 860px) { .steps { grid-template-columns:1fr; gap:40px; } }

/* ---------- faq ---------- */
.faq-list { border-top:1px solid var(--line-strong); }
.faq details { border-bottom:1px solid var(--line); }
.faq summary { display:flex; justify-content:space-between; gap:20px; align-items:center; padding:22px 0; cursor:pointer; list-style:none; font-size:18px; font-weight:600; letter-spacing:-.01em; border-radius:6px; }
.faq summary::-webkit-details-marker { display:none; }
.faq summary:hover { color:var(--accent); }
.ico-plus { width:20px; height:20px; color:var(--faint); transition:transform .2s; }
.faq details[open] .ico-plus { transform:rotate(45deg); color:var(--ember); }
.faq details p { padding:0 40px 26px 0; color:var(--muted); }

/* ---------- final cta: the mark is a backlit ring ---------- */
.cta { padding-block:clamp(96px, 11vw, 144px); text-align:center;
  background:
    radial-gradient(50% 60% at 50% 0%, rgba(23,58,148,.7), transparent 70%),
    linear-gradient(180deg, var(--night-1), var(--night-0)); }
.cta-inner { display:flex; flex-direction:column; align-items:center; }
.cta-mark { position:relative; margin-bottom:36px; isolation:isolate; }
.cta-mark::before { content:""; position:absolute; inset:-40px; border-radius:50%; filter:blur(24px);
  background:radial-gradient(circle, rgba(255,120,80,.55), rgba(30,72,184,.35) 50%, transparent 70%); z-index:-1; }
.mark-lg { width:64px; height:64px; }
.foot-brand .mark { width:28px; height:28px; flex:none; }
.cta h2 { font-size:clamp(36px, 1.4rem + 3vw, 60px); max-width:20ch; }
.cta p { margin-top:22px; max-width:600px; color:var(--on-night-2); font-size:clamp(17px, 1rem + .3vw, 19px); }
.actions-center { justify-content:center; }
.cta .cta-or { margin-top:22px; font-size:15px; color:var(--on-night-3); }
.cta .cta-or a { font-family:var(--mono); font-size:14.5px; }

/* ---------- footer ---------- */
.site-footer { background:var(--night-0); color:var(--on-night-3); border-top:1px solid var(--night-line); font-size:14.5px; }
.foot { display:flex; flex-wrap:wrap; gap:20px 40px; justify-content:space-between; align-items:center; padding-block:36px; }
.foot-brand { display:flex; gap:12px; align-items:center; line-height:1.4; }
.foot-brand b { color:#fff; font-weight:600; }
.foot-brand a { color:var(--on-night-2); text-decoration:none; }
.foot-brand a:hover { color:#fff; text-decoration:underline; }
.foot-links { display:flex; flex-wrap:wrap; gap:8px 24px; }
.foot-links a { color:var(--on-night-2); text-decoration:none; }
.foot-links a:hover { color:#fff; text-decoration:underline; }
.site-footer a:focus-visible { box-shadow:0 0 0 2px var(--night-0), 0 0 0 4px var(--ice); }

/* ---------- lightbox (site.js) ---------- */
.lightbox { padding:0; border:0; background:transparent; max-width:none; max-height:none; width:100vw; height:100vh; margin:0; overflow:auto; }
.lightbox::backdrop { background:rgba(5,12,34,.9); }
.lightbox-inner { min-height:100%; display:flex; align-items:center; justify-content:center; padding:60px 16px 24px; }
.lightbox img { max-width:min(1600px, 100%); height:auto; border-radius:10px; box-shadow:0 -20px 80px -30px rgba(255,138,92,.6), 0 30px 80px rgba(0,0,0,.6); background:#fff; }
.lightbox-close { position:fixed; top:12px; right:12px; width:44px; height:44px; border-radius:50%; border:1px solid rgba(200,215,255,.3);
  background:rgba(10,23,56,.85); color:#fff; font:inherit; font-size:24px; line-height:1; cursor:pointer; display:grid; place-items:center; }
.lightbox-close:focus-visible { box-shadow:0 0 0 3px var(--ice); }

/* ---------- 404 ---------- */
.notfound { min-height:100vh; display:flex; align-items:center; }
.notfound h1 { font-size:clamp(36px, 1.4rem + 3vw, 60px); }
.notfound p { margin-top:18px; color:var(--on-night-2); }

/* ---------- small screens ---------- */
@media (max-width: 560px) {
  body { font-size:16.5px; }
  .actions .btn { width:100%; white-space:normal; text-align:center; }
  .btn-lg { padding:14px 18px; font-size:16px; }
  .proof { flex-direction:column; gap:10px; }
  .frame figcaption { padding:10px 14px; font-size:13.5px; }
  .faq details p { padding-right:0; }
  .term { font-size:.4em; }
  .backlight { filter:blur(30px); }
}
@media (max-width: 420px) { .actions .ico-btn { display:none; } }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition:none !important; animation:none !important; }
}
@media print {
  .site-header, .skip, .evidence-col, .backlight, .horizon { display:none; }
  .dark { background:#fff; color:#000; }
}

/* ---------- privacy pages ---------- */
.page-hero .hero-inner { padding-bottom:clamp(40px, 5vw, 64px); }
.page-hero { padding-bottom:0; }
.prose { max-width:calc(720px + 2 * var(--gutter)); }
.prose h2 { font-size:clamp(24px, 1rem + 1vw, 30px); margin:40px 0 12px; }
.prose h2:first-child { margin-top:0; }
.prose p { color:var(--muted); }
.bar > .brand + .bar-end { margin-left:auto; }
