/* ==========================================================================
   Settlano — settlano.com · "The Statement"
   The page set as an audited financial statement: folios, ledger rows,
   tabular figures, hairline rules, the gold set-aside wedge as the one glyph.
   Gold = the set-aside slice + the CTA. Never anything else.
   ========================================================================== */

/* ---------- Fonts (self-hosted Inter, latin subset, tnum + slashed zero) ---------- */
@font-face { font-family:'Inter'; src:url('../fonts/Inter-Regular.woff2') format('woff2'); font-weight:400; font-display:swap; }
@font-face { font-family:'Inter'; src:url('../fonts/Inter-SemiBold.woff2') format('woff2'); font-weight:600; font-display:swap; }
@font-face { font-family:'Inter'; src:url('../fonts/Inter-Bold.woff2') format('woff2'); font-weight:700; font-display:swap; }
@font-face { font-family:'Inter'; src:url('../fonts/Inter-Bold.woff2') format('woff2'); font-weight:800; font-display:swap; }
@font-face {
  font-family:'Inter Fallback'; src:local('Arial'), local('Helvetica Neue');
  size-adjust:107%; ascent-override:90%; descent-override:22.5%; line-gap-override:0%;
}

/* ---------- Tokens ---------- */
:root {
  --navy:#0E5FA8; --navy-deep:#072F52;
  --gold:#C9A227; --gold-light:#F2C94C; --gold-text:#7A5E0F;
  --ink:#14181F; --slate:#5C6470; --paper:#F7FAFD; --limestone:#F4EBD9;

  --bg:var(--paper); --band:var(--paper); --surface:#FFFFFF;
  --text:var(--ink); --text-2:var(--slate);
  --hairline:rgba(7,47,82,.14); --hairline-strong:rgba(7,47,82,.30); --leader:rgba(7,47,82,.28);
  --accent:var(--navy); --ring-keep:var(--navy);
  --on-navy:#FFFFFF; --on-navy-2:rgba(247,250,253,.82); --slice:var(--gold);

  --font:'Inter','Inter Fallback',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --wrap:1120px; --gutter:132px;
  --pad:clamp(20px,5vw,40px);
  --sec-y:clamp(72px,10vw,132px);
  --tnum:"tnum" 1,"zero" 1,"cv05" 1;
}
@media (prefers-color-scheme:dark) {
  :root {
    --paper:#061B31; --limestone:#1B1206; --surface:#0C2C4B;
    --text:#EAF2FB; --text-2:#93A4B8;
    --hairline:rgba(234,242,251,.14); --hairline-strong:rgba(234,242,251,.26); --leader:rgba(234,242,251,.24);
    --accent:#4C9BE0; --ring-keep:#4C9BE0; --gold-text:var(--gold-light);
    --on-navy-2:rgba(247,250,253,.82);
  }
}

/* ---------- Base ---------- */
*,*::before,*::after { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body {
  margin:0; font-family:var(--font); font-size:1.03rem; line-height:1.65;
  color:var(--text); background:var(--bg);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
img { max-width:100%; height:auto; display:block; }
a { color:var(--accent); text-underline-offset:2px; text-decoration-thickness:1px; }
h1,h2,h3 { margin:0; font-weight:800; letter-spacing:-0.03em; line-height:1.05; }
p { margin:0 0 1em; }
.num { font-variant-numeric:tabular-nums slashed-zero; font-feature-settings:var(--tnum); }
.wrap { max-width:var(--wrap); margin-inline:auto; padding-inline:var(--pad); }
.center { text-align:center; }

.skip-link { position:absolute; left:-9999px; top:0; background:var(--gold-light); color:var(--ink); padding:10px 16px; font-weight:600; z-index:100; border-radius:0 0 8px 0; }
.skip-link:focus { left:0; }
:focus-visible { outline:3px solid var(--gold-light); outline-offset:2px; box-shadow:0 0 0 2px var(--navy-deep); border-radius:3px; }
.visually-hidden { position:absolute; width:1px; height:1px; margin:-1px; padding:0; border:0; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
/* Honeypot: off-screen (not display:none — bots skip that) and out of tab order. */
.hp { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

/* ---------- The wedge glyph + coin ---------- */
.coin { width:.72em; height:.72em; display:inline-block; }
.brand .coin { transform:translateY(2px); }
svg { --slice:var(--gold); }
.masthead svg, .hero svg, .join svg, .colophon svg, .honesty svg { --slice:var(--gold-light); }
.w { width:.62em; height:.62em; color:var(--gold); flex:none; }
.masthead .w, .hero .w, .join .w, .limestone .w { color:var(--gold); }
.hero .w, .join .w { color:var(--gold-light); }

/* ---------- Masthead ---------- */
.masthead {
  position:sticky; top:0; z-index:50;
  background:linear-gradient(180deg,var(--navy-deep),#0a3a68);
  color:var(--on-navy); border-bottom:1px solid rgba(255,255,255,.14);
}
.masthead { transition:box-shadow .2s ease; }
.masthead.scrolled { box-shadow:0 2px 18px rgba(7,47,82,.4); }
.masthead-row { display:flex; align-items:center; justify-content:space-between; padding-block:15px 10px; }
.brand { display:inline-flex; align-items:baseline; gap:1px; color:#fff; text-decoration:none; font-weight:800; font-size:1.4rem; letter-spacing:-0.03em; line-height:1; }
.masthead-nav { display:flex; align-items:center; gap:22px; }
.masthead-nav a { color:var(--on-navy-2); text-decoration:none; font-size:.82rem; font-weight:600; letter-spacing:.01em; }
.masthead-nav a:hover { color:#fff; }

/* ---------- Mobile menu: CSS-only checkbox hamburger (JS-enhanced on home) ---------- */
.masthead-row { position:relative; }           /* anchor for the mobile dropdown */
.nav-toggle, .nav-btn { display:none; }         /* desktop: hidden; the nav shows horizontally */
.nav-icon { position:relative; display:block; }
.nav-icon, .nav-icon::before, .nav-icon::after { width:22px; height:2px; background:var(--on-navy); border-radius:2px; }
.nav-icon::before, .nav-icon::after { content:''; position:absolute; left:0; transition:transform .25s cubic-bezier(.4,.05,.2,1); }
.nav-icon::before { top:-7px; }
.nav-icon::after { top:7px; }
@keyframes navDrop { from { opacity:0; transform:translateY(-10px) scale(.98); } to { opacity:1; transform:none; } }
.masthead .issue-line { margin:0; padding-bottom:9px; color:var(--on-navy-2); font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; }
.masthead .issue-line .num { letter-spacing:.06em; }

/* ---------- Buttons ---------- */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; font:inherit; font-weight:700; font-size:1rem; border:0; border-radius:10px; cursor:pointer; text-decoration:none; padding:15px 26px; letter-spacing:-0.01em; transition:transform .16s ease, box-shadow .16s ease; }
.btn-gold { background:var(--gold-light); color:var(--ink); box-shadow:inset 0 1px 0 rgba(255,255,255,.5), 0 6px 18px -6px rgba(201,162,39,.55); }
.btn-gold:hover { transform:translateY(-2px); box-shadow:inset 0 1px 0 rgba(255,255,255,.5), 0 12px 26px -8px rgba(201,162,39,.6); }
.btn-gold:active { transform:translateY(0); }
.btn-sm { padding:9px 16px; font-size:.85rem; border-radius:8px; }

/* ---------- Folio sections ---------- */
.folio { position:relative; padding-block:var(--sec-y); border-top:1px solid var(--hairline); overflow:clip; }
.folio:first-of-type { border-top:0; }
.paper { background:var(--paper); }
.limestone { background:var(--limestone); }
.limestone::before {
  content:''; position:absolute; inset:0; pointer-events:none; z-index:0; mix-blend-mode:multiply; opacity:.5;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 0.42 0 0 0 0 0.36 0 0 0 0 0.2 0 0 0 0.04 0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");
}
@media (prefers-color-scheme:dark){ .limestone::before { mix-blend-mode:screen; opacity:.4; } }
.folio > .wrap { position:relative; z-index:1; }

/* ---------- Section headers / eyebrow ---------- */
.folio-head { max-width:760px; margin-bottom:clamp(36px,5vw,60px); }
.folio-head.center { margin-inline:auto; text-align:center; }
.eyebrow { display:flex; align-items:center; gap:8px; margin:0 0 18px; font-size:.72rem; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--text-2); }
.center .eyebrow { justify-content:center; }
.eyebrow .folio-no { color:var(--text); font-variant-numeric:tabular-nums; }
h2 { font-size:clamp(2rem,4.6vw,3.4rem); line-height:1.02; letter-spacing:-0.035em; }
.folio-head .lead { margin:20px 0 0; }
.lead { font-size:clamp(1.08rem,2.1vw,1.28rem); line-height:1.55; color:var(--text-2); max-width:60ch; }

/* ---------- Ledger row (the signature) ---------- */
.ledger-group { border-top:1px solid var(--hairline); }
.ledger { display:flex; align-items:baseline; padding:13px 2px; border-bottom:1px solid var(--hairline); }
.ledger .swatch { width:11px; height:11px; border-radius:3px; align-self:center; margin-right:12px; flex:none; }
.ledger-label { font-size:1rem; color:var(--text); }
.ledger .leader { flex:1 1 auto; min-width:20px; margin:0 12px; transform:translateY(-4px); border-bottom:2px dotted var(--leader); }
.ledger-fig { font-variant-numeric:tabular-nums slashed-zero; font-feature-settings:var(--tnum); font-weight:600; font-size:1.08rem; text-align:right; min-width:6ch; }
.ledger-mark { color:var(--accent); font-weight:700; }
.trust .ledger-label { color:var(--on-navy-2); }
.trust .ledger { border-color:rgba(255,255,255,.16); }
.trust .leader { border-color:rgba(255,255,255,.28); }
.trust .ledger-mark { color:var(--on-navy); }

/* ---------- §01 Hero ---------- */
.hero { background:linear-gradient(165deg,#0B3F71,var(--navy-deep)); color:var(--on-navy); border-top:0; }
.hero-grid { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:clamp(32px,5vw,64px); align-items:center; padding-block:clamp(40px,6vw,80px); }
.hero .eyebrow { color:var(--on-navy-2); }
.hero .eyebrow .folio-no { color:#fff; }
.hero h1 { font-size:clamp(2.5rem,6vw,4.6rem); line-height:1.0; letter-spacing:-0.045em; margin-bottom:26px; text-wrap:balance; }
.hero h1 .h1-lead { display:flex; align-items:center; gap:8px; font-size:.72rem; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--on-navy-2); margin-bottom:18px; }
.hero h1 .beat { display:block; }
.hero h1 .beat-2 { color:var(--gold-light); }
.hero .lead { color:var(--on-navy-2); max-width:44ch; }
.hero-cta { margin:30px 0 8px; }
.hero-cta .cta-note { margin:14px 0 0; font-size:.82rem; color:var(--on-navy-2); max-width:46ch; }
.hero .trust { margin-top:28px; max-width:460px; }

/* gallarija frame for the screenshots */
.shot { margin:0; }
.gallarija { position:relative; padding:18px 0 0 18px; }
.gallarija::before { content:''; position:absolute; left:0; top:0; width:64%; height:3px; background:var(--gold); }
.gallarija::after { content:''; position:absolute; left:0; top:0; width:3px; height:52%; background:var(--gold); }
.gallarija img { border-radius:16px; box-shadow:0 34px 70px -24px rgba(0,0,0,.62), 0 6px 20px -8px rgba(0,0,0,.4), 0 0 0 1px rgba(255,255,255,.1); transform:rotate(-1.4deg); }
.hero .gallarija img { max-width:344px; margin-inline:auto; }
.shot figcaption { margin-top:16px; font-size:.82rem; color:var(--on-navy-2); font-variant-numeric:tabular-nums; }

/* ---------- §02 The split (statement) ---------- */
.split-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(32px,5vw,64px); align-items:start; }
.field-label { display:block; font-size:.8rem; font-weight:600; letter-spacing:.02em; color:var(--text-2); margin-bottom:8px; }
.chip-row { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:24px; }
.chip { display:inline-flex; align-items:center; justify-content:center; min-height:44px; font:inherit; font-weight:600; font-size:1rem; font-variant-numeric:tabular-nums slashed-zero; padding:10px 18px; border-radius:8px; cursor:pointer; background:var(--surface); color:var(--text); border:1px solid var(--hairline-strong); transition:background .15s,color .15s,border-color .15s; }
.chip:hover { border-color:var(--navy); }
.chip[aria-pressed="true"] { background:var(--navy); border-color:var(--navy); color:#fff; }
.amount-field { max-width:340px; }
.amount-input-wrap { position:relative; }
.amount-input-wrap .euro { position:absolute; left:0; top:50%; transform:translateY(-50%); color:var(--text-2); font-weight:700; font-size:1.6rem; }
input.amount { width:100%; font:inherit; font-weight:700; font-size:1.9rem; letter-spacing:-0.02em; padding:6px 0 10px 26px; border:0; border-bottom:2px solid var(--hairline-strong); background:transparent; color:var(--text); border-radius:0; }
input.amount:focus { outline:none; border-bottom-color:var(--navy); }
.split-note { margin:22px 0 0; font-size:.95rem; color:var(--text-2); min-height:3em; }
.split-note strong { color:var(--text); }
.footnote { margin:14px 0 0; font-size:.8rem; color:var(--text-2); line-height:1.5; }

.statement { margin:0; border:1px solid var(--hairline); border-radius:14px; padding:26px 26px 20px; background:var(--surface); }
.statement-title { margin:0 0 6px; font-size:.72rem; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:var(--text-2); text-align:center; }
.coin-fig { display:flex; justify-content:center; padding:6px 0 14px; }
.coin-ring { width:min(280px,64vw); }
.coin-ring .track { stroke:var(--hairline); }
.coin-ring .seg { transition:stroke-dasharray .5s cubic-bezier(.22,.61,.36,1); }
.coin-center-value { font-size:1.3rem; font-weight:800; fill:var(--text); font-variant-numeric:tabular-nums slashed-zero; }
.coin-center-label { font-size:.72rem; fill:var(--text-2); letter-spacing:.04em; }
.statement .ledger-group { margin-top:4px; border-top:0; }
.statement .ledger:last-child { border-bottom:0; }

/* ---------- Index lists (steps §03) ---------- */
.index-list { list-style:none; margin:0; padding:0; }
.index-list li { display:grid; grid-template-columns:auto 1fr; gap:20px; padding:26px 0; border-top:1px solid var(--hairline); align-items:baseline; }
.index-list li:last-child { border-bottom:1px solid var(--hairline); }
.idx { font-size:1rem; font-weight:700; color:var(--text-2); font-variant-numeric:tabular-nums; }
.index-body h3 { font-size:1.3rem; letter-spacing:-0.02em; margin-bottom:6px; }
.index-body p { margin:0; color:var(--text-2); max-width:60ch; }

/* ---------- §04 Deadlines ---------- */
.deadline-grid { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:clamp(32px,5vw,64px); align-items:center; }
.shot-left .gallarija img { max-width:320px; }
.big-dates { font-size:clamp(1.6rem,3.6vw,2.4rem); font-weight:800; letter-spacing:-0.03em; margin:14px 0 0; }

/* ---------- §05 Filing index ---------- */
.filing-index { list-style:none; margin:0; padding:0; border-top:1px solid var(--hairline-strong); }
.filing-index li { display:grid; grid-template-columns:auto auto 1fr auto; gap:16px 18px; padding:22px 0; border-bottom:1px solid var(--hairline); align-items:start; }
.filing-index .idx { align-self:start; padding-top:2px; }
.fi-icon { color:var(--accent); }
.fi-icon svg { width:26px; height:26px; }
.fi-body h3 { font-size:1.18rem; letter-spacing:-0.02em; margin-bottom:5px; }
.fi-body p { margin:0; color:var(--text-2); max-width:64ch; font-size:.97rem; }
.fi-ref { align-self:start; padding-top:3px; font-size:.8rem; font-weight:600; color:var(--text-2); text-align:right; letter-spacing:.02em; white-space:nowrap; }
.references { display:flex; flex-wrap:wrap; align-items:baseline; gap:8px 14px; margin-top:26px; padding-top:18px; border-top:1px solid var(--hairline-strong); }
.ref-label { font-size:.7rem; letter-spacing:.2em; text-transform:uppercase; color:var(--text-2); margin-right:6px; }
.cite { font-size:.8rem; font-weight:600; color:var(--text-2); }
.cite:not(:last-child)::after { content:' /'; color:var(--hairline-strong); margin-left:12px; }

/* ---------- §06 Privacy ---------- */
.privacy .folio-head { margin-bottom:0; }
.privacy-claims { max-width:640px; margin:44px auto 0; }
.privacy-claims .claim { padding:26px 0; border-top:1px solid var(--hairline); text-align:center; }
.privacy-claims .claim:last-child { border-bottom:1px solid var(--hairline); }
.privacy-claims h3 { font-size:clamp(1.4rem,3vw,1.9rem); letter-spacing:-0.02em; margin-bottom:8px; }
.privacy-claims p { margin:0; color:var(--text-2); max-width:48ch; margin-inline:auto; }

/* ---------- §07 Rules / honesty ---------- */
.rules-grid { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:clamp(32px,5vw,64px); align-items:start; }
.honesty { background:linear-gradient(165deg,#0B3F71,var(--navy-deep)); color:var(--on-navy); border-radius:16px; padding:32px 30px; box-shadow:0 24px 60px -26px rgba(7,47,82,.5); }
.honesty p { color:var(--on-navy-2); }
.honesty strong { color:#fff; }
.honesty .sign { display:flex; align-items:center; gap:10px; margin:18px 0 0; color:#fff; font-weight:600; }
.honesty .sign svg { width:24px; height:24px; }

/* ---------- §08 Pricing ---------- */
.price-ledger { border-top:1px solid var(--hairline-strong); max-width:720px; }
.price-row { padding:20px 2px; }
.price-row .ledger-label { font-size:1.1rem; font-weight:600; }
.price-row .tag { display:inline-block; margin-left:8px; font-size:.68rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--gold-text); vertical-align:middle; }
.price-row .ledger-fig { font-size:clamp(1.8rem,4vw,2.6rem); font-weight:800; letter-spacing:-0.03em; }
.price-row .per { font-size:1rem; font-weight:600; color:var(--text-2); letter-spacing:0; }
.price-note { margin-top:22px; font-size:1rem; color:var(--text-2); }
.gold-text { color:var(--gold-text); font-weight:700; }

/* ---------- CTA bridges (peak-intent nudges to the signup form) ---------- */
.cta-bridge { margin-top:clamp(30px,4.5vw,46px); padding-top:clamp(24px,3.5vw,36px);
  border-top:1px solid var(--hairline-strong); display:flex; flex-direction:column;
  align-items:flex-start; gap:18px; }
.cta-bridge p { margin:0; font-size:clamp(1.15rem,2.2vw,1.45rem); font-weight:800;
  letter-spacing:-0.025em; line-height:1.16; color:var(--text); max-width:26ch; text-wrap:balance; }

/* ---------- §09 Join ---------- */
.join { background:linear-gradient(200deg,var(--navy-deep),#0B3F71); color:var(--on-navy); }
.join .eyebrow { color:var(--on-navy-2); }
.join .eyebrow .folio-no { color:#fff; }
.join h2 { color:#fff; }
.join .lead { color:var(--on-navy-2); }
.signup-form { max-width:480px; margin-top:8px; display:grid; gap:22px; }
.signup-form .field-label { color:var(--on-navy-2); }
.signup-form .opt { font-weight:400; text-transform:none; letter-spacing:0; }
.signup-form input[type='email'], .signup-form select {
  width:100%; font:inherit; font-size:1.1rem; color:#fff;
  padding:8px 2px 12px; border:0; border-bottom:2px solid rgba(255,255,255,.4);
  background:transparent; border-radius:0;
}
.signup-form input::placeholder { color:rgba(247,250,253,.55); }
.signup-form input:focus, .signup-form select:focus { outline:none; border-bottom-color:var(--gold-light); }
.signup-form select { appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 6l4 4 4-4' fill='none' stroke='%23F7FAFD' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 2px center; background-size:16px; padding-right:26px; }
.signup-form select option { color:var(--ink); background:#fff; }
.signup-form .btn { margin-top:4px; }
.signup-privacy { margin:0; font-size:.82rem; color:var(--on-navy-2); }
.signup-status { max-width:480px; margin:16px 0 0; font-size:.95rem; min-height:1.4em; color:var(--on-navy-2); }
.signup-status.ok { color:var(--gold-light); font-weight:600; }
.signup-status.ok .mail-cta { color:var(--gold-light); }
.signup-status.err { color:#FFB4A8; }
.signup-alt { margin:26px 0 0; font-size:.9rem; color:var(--on-navy-2); }
.signup-alt button { font:inherit; font-weight:600; font-size:.9rem; background:none; border:0; cursor:pointer; color:#fff; text-decoration:underline; text-underline-offset:2px; padding:12px 6px; }
.signup-expect { margin:20px 0 0; font-size:.8rem; color:var(--on-navy-2); letter-spacing:.02em; }
.signup-human { margin:8px 0 0; font-size:.82rem; color:var(--on-navy-2); }

/* ---------- §10 FAQ ---------- */
.faq details { border-bottom:1px solid var(--hairline); }
.faq details:first-of-type { border-top:1px solid var(--hairline-strong); }
.faq summary { cursor:pointer; list-style:none; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:22px 2px; font-size:1.12rem; font-weight:700; letter-spacing:-0.015em; }
.faq summary::-webkit-details-marker { display:none; }
.faq summary .w { color:var(--gold); transition:transform .22s ease; }
.faq details[open] summary .w { transform:rotate(42deg); }
.faq .a { padding:0 2px 22px; color:var(--text-2); max-width:66ch; }
.faq .a p { margin:0; }

/* ---------- Watermarks ---------- */
.wm { position:absolute; z-index:0; color:#fff; pointer-events:none; opacity:.05; }
.wm-tr { width:clamp(360px,46vw,640px); right:-8%; top:-6%; }
.wm-bl { width:clamp(360px,46vw,620px); left:-10%; bottom:-16%; --slice:var(--gold-light); }
.wm-center { width:clamp(300px,40vw,460px); left:50%; top:52%; transform:translate(-50%,-50%); color:var(--ink); opacity:.05; }

/* ---------- §11 Colophon ---------- */
.colophon { background:var(--navy-deep); color:var(--on-navy-2); padding-block:52px 44px; font-size:.86rem; }
@media (prefers-color-scheme:dark){ .colophon { background:#04101d; } }
.colophon .wrap { display:grid; gap:22px; }
.colophon-top { display:flex; flex-wrap:wrap; gap:18px; align-items:center; justify-content:space-between; padding-bottom:22px; border-bottom:1px solid rgba(255,255,255,.14); }
.colophon-links { display:flex; flex-wrap:wrap; gap:20px; }
.colophon a { color:var(--on-navy-2); }
.colophon a:hover { color:#fff; }
.colophon-fine { max-width:70ch; margin:0; line-height:1.55; }
.colophon .issue-line.closing { margin:0; color:rgba(247,250,253,.55); font-size:.74rem; letter-spacing:.14em; text-transform:uppercase; }

/* ---------- Motion ---------- */
@media (prefers-reduced-motion:no-preference){
  .hero .gallarija img { animation:floaty 8s ease-in-out infinite; }
  @keyframes floaty { 0%,100%{ transform:rotate(-1.4deg) translateY(0);} 50%{ transform:rotate(-1.4deg) translateY(-9px);} }
  .reveal { opacity:0; transform:translateY(10px); }
  .reveal.in { opacity:1; transform:none; transition:opacity .6s ease, transform .6s ease; }
}
@media (prefers-reduced-motion:reduce){
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation-duration:.001ms !important; transition-duration:.001ms !important; }
}

/* ---------- Responsive ---------- */
@media (max-width:900px){
  .hero-grid, .split-grid, .deadline-grid, .rules-grid { grid-template-columns:1fr; }
  .hero .gallarija img { max-width:280px; }
  .hero .shot { margin-top:12px; }
  .deadline-grid .shot-left { order:2; }
  .filing-index li { grid-template-columns:auto 1fr; gap:6px 16px; }
  .filing-index .fi-icon { grid-row:1; grid-column:1; }
  .filing-index .idx { grid-row:1; grid-column:2; text-align:left; }
  .filing-index .fi-body { grid-column:1 / -1; }
  .filing-index .fi-ref { grid-column:1 / -1; text-align:left; padding-top:2px; }
  /* Mobile: the nav collapses into a top-right hamburger dropdown. */
  .nav-toggle { display:block; position:absolute; width:1px; height:1px; opacity:0; margin:0; }
  .nav-btn { display:flex; width:44px; height:44px; align-items:center; justify-content:center; cursor:pointer;
    border-radius:9px; margin-right:-6px; -webkit-tap-highlight-color:transparent; transition:background .15s ease; }
  .nav-btn:hover { background:rgba(255,255,255,.08); }
  .nav-toggle:focus-visible + .nav-btn { outline:3px solid var(--gold-light); outline-offset:2px; }
  .nav-toggle:checked + .nav-btn .nav-icon { background:transparent; }
  .nav-toggle:checked + .nav-btn .nav-icon::before { transform:translateY(7px) rotate(45deg); }
  .nav-toggle:checked + .nav-btn .nav-icon::after { transform:translateY(-7px) rotate(-45deg); }
  .masthead-nav { display:none; }
  .nav-toggle:checked ~ .masthead-nav {
    display:flex; position:absolute; top:calc(100% + 12px); right:0;
    flex-direction:column; align-items:stretch; gap:2px;
    width:max-content; min-width:min(72vw,240px);
    background:linear-gradient(180deg,#0b4074,var(--navy-deep));
    border:1px solid rgba(255,255,255,.16); border-radius:16px;
    box-shadow:0 26px 54px -18px rgba(0,0,0,.62), 0 2px 8px rgba(0,0,0,.3);
    padding:12px; z-index:60; animation:navDrop .22s cubic-bezier(.2,.7,.2,1) both;
  }
  .nav-toggle:checked ~ .masthead-nav a:not(.btn) {
    color:var(--on-navy-2); padding:13px 14px; border-radius:10px; font-size:1rem; letter-spacing:0;
  }
  .nav-toggle:checked ~ .masthead-nav a:not(.btn):hover,
  .nav-toggle:checked ~ .masthead-nav a:not(.btn):active { background:rgba(255,255,255,.10); color:#fff; }
  .nav-toggle:checked ~ .masthead-nav .btn { width:100%; margin-top:8px; min-height:48px; }
}
@media (max-width:520px){
  input.amount { font-size:1.6rem; }
}
/* Touch (no hover): the §05 guide links can't wait for a hover that never
   comes — show them inline instead of behind an undiscoverable tap. (The
   deadline/trust detail rows keep their tap-to-reveal from main.js.) */
@media (hover:none){
  .filing-index li.ix .fi-more { position:static; display:inline-block; opacity:1; transform:none; pointer-events:auto; margin-top:2px; }
}

/* ============================================================================
   ARTICLE / CONTENT PAGES (guides, glossary, explainers) — Statement styling
   ============================================================================ */
.article-main { background:var(--paper); }
.article { max-width:760px; padding-block:clamp(40px,6vw,72px); }
.breadcrumbs { font-size:.82rem; color:var(--text-2); margin-bottom:26px; }
.breadcrumbs a { color:var(--accent); text-decoration:none; }
.breadcrumbs a:hover { text-decoration:underline; }
.breadcrumbs span[aria-hidden] { margin:0 6px; color:var(--hairline-strong); }
.article h1 { font-size:clamp(2rem,4.6vw,3rem); line-height:1.06; letter-spacing:-0.035em; margin:6px 0 0; }
.article .lede { font-size:clamp(1.1rem,2.1vw,1.28rem); line-height:1.6; color:var(--text-2); margin-top:22px; }
.art-body { margin-top:8px; }
.art-sec { margin-top:clamp(36px,5vw,52px); }
.art-sec h2 { font-size:clamp(1.4rem,3vw,1.9rem); line-height:1.15; letter-spacing:-0.02em; margin-bottom:14px; padding-top:clamp(20px,3vw,28px); border-top:1px solid var(--hairline); }
.art-body p { font-size:1.05rem; line-height:1.7; margin:0 0 1.05em; }
.art-body ul { margin:0 0 1.2em; padding-left:1.15em; }
.art-body li { line-height:1.65; margin-bottom:.5em; }
.art-body li::marker { color:var(--accent); }
/* statement-style tables */
.table-wrap { overflow-x:auto; margin:6px 0 1.4em; border:1px solid var(--hairline); border-radius:12px; }
.article table { width:100%; border-collapse:collapse; font-size:.96rem; min-width:440px; }
.article thead th { text-align:left; font-size:.72rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--text-2); padding:13px 16px; border-bottom:1px solid var(--hairline-strong); white-space:nowrap; }
.article tbody td { padding:12px 16px; border-bottom:1px solid var(--hairline); vertical-align:top; }
.article tbody tr:last-child td { border-bottom:0; }
.article tbody td.num { font-variant-numeric:tabular-nums slashed-zero; font-feature-settings:var(--tnum); white-space:nowrap; }
.article tbody td:first-child { font-weight:600; }
/* callout / note */
.note { background:var(--surface); border:1px solid var(--hairline); border-left:3px solid var(--accent); border-radius:12px; padding:18px 20px; margin:6px 0 1.4em; }
.note p { margin:0; font-size:.98rem; line-height:1.6; color:var(--text); }
.art-disclaimer { margin-top:clamp(36px,5vw,52px); }
.art-disclaimer p { color:var(--text-2); font-size:.92rem; }
/* article FAQ reuses .faq; tighten top border */
.art-sec .faq details:first-of-type { border-top:1px solid var(--hairline-strong); }
/* CTA */
.art-cta { margin-top:clamp(40px,6vw,64px); padding:32px; text-align:center; background:linear-gradient(165deg,#0B3F71,var(--navy-deep)); color:var(--on-navy); border-radius:20px; }
.art-cta p { margin:0 0 20px; font-size:1.1rem; color:var(--on-navy-2); max-width:46ch; margin-inline:auto; }
/* related guides */
.related { margin-top:clamp(40px,5vw,56px); padding-top:26px; border-top:1px solid var(--hairline-strong); }
.related h2 { font-size:1.1rem; letter-spacing:-0.01em; margin-bottom:14px; }
.related ul { list-style:none; margin:0; padding:0; display:grid; gap:0; }
.related li { border-bottom:1px solid var(--hairline); }
.related li a { display:block; padding:14px 2px; color:var(--text); text-decoration:none; font-weight:600; }
.related li a::after { content:'→'; float:right; color:var(--accent); }
.related li a:hover { color:var(--accent); }

/* ============================================================================
   3D GLASSMORPHISM — "Statement of Set-Aside" card
   Frosted glass floating on an aurora backdrop, cursor sheen, mouse-tilt (JS).
   ============================================================================ */
.glass-stage { position:relative; perspective:1200px; padding:16px; }
/* the colourful backdrop the glass frosts over */
.glass-stage::before {
  content:''; position:absolute; inset:-4% -3%; z-index:0; border-radius:34px;
  background:
    radial-gradient(42% 46% at 16% 20%, rgba(242,201,76,.55), transparent 68%),
    radial-gradient(46% 52% at 84% 26%, rgba(18,112,196,.90), transparent 72%),
    radial-gradient(64% 62% at 72% 92%, rgba(7,47,82,.95), transparent 74%),
    radial-gradient(52% 52% at 26% 84%, rgba(76,150,221,.65), transparent 74%),
    linear-gradient(160deg,#0C4C86,#072F52);
  background-color:#0B3F71;
}
@media (prefers-reduced-motion:no-preference){
  .glass-stage::before { animation:auroraDrift 16s ease-in-out infinite alternate; }
  @keyframes auroraDrift { to { transform:translate3d(2%, -1.5%, 0) scale(1.04); } }
}
.statement.glass {
  position:relative; z-index:1; color:#fff;
  /* Navy-tinted frost (not clear): a deterministic dark substrate so white
     text stays >=4.5:1 no matter which aurora colour drifts behind it. */
  background:rgba(9,34,60,.34);
  -webkit-backdrop-filter:blur(22px) saturate(1.7);
          backdrop-filter:blur(22px) saturate(1.7);
  border:1px solid rgba(255,255,255,.38);
  border-radius:24px;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.5),
    inset 0 -1px 0 rgba(255,255,255,.08),
    0 34px 64px -26px rgba(4,20,40,.7),
    0 10px 26px -14px rgba(0,0,0,.4);
  transform:perspective(1200px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));
  transform-style:preserve-3d;
  transition:transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s ease;
}
/* Promote to its own layer only where the JS tilt actually runs (fine pointer,
   motion allowed) — avoids a permanent compositor layer on phones. */
@media (hover:hover) and (pointer:fine){
  .statement.glass { will-change:transform; }
}
.glass-stage:hover .statement.glass { box-shadow:
    inset 0 1px 0 rgba(255,255,255,.55),
    inset 0 -1px 0 rgba(255,255,255,.1),
    0 44px 80px -28px rgba(4,20,40,.78),
    0 14px 30px -16px rgba(0,0,0,.45); }
/* cursor-following specular sheen */
.glass-sheen {
  position:absolute; inset:0; z-index:3; border-radius:24px; pointer-events:none;
  background:radial-gradient(220px 220px at var(--mx,50%) var(--my,0%), rgba(255,255,255,.4), transparent 60%);
  opacity:0; transition:opacity .35s ease; mix-blend-mode:soft-light;
}
.glass-stage:hover .glass-sheen { opacity:1; }
/* floating depth on tilt */
.statement.glass .statement-title,
.statement.glass .coin-fig { transform:translateZ(46px); }
.statement.glass .ledger-group { transform:translateZ(24px); }
/* recolour internals for the dark glass surface */
.statement.glass .statement-title { color:rgba(255,255,255,.86); }
.statement.glass .coin-center-value { fill:#fff; }
.statement.glass .coin-center-label { fill:rgba(255,255,255,.82); }
.statement.glass .coin-ring .track { stroke:rgba(255,255,255,.16); }
.statement.glass #seg-keep { stroke:#8CC6FF; }
.statement.glass .row-keep .swatch { background:#8CC6FF !important; }
.statement.glass .ledger { border-color:rgba(255,255,255,.16); }
.statement.glass .ledger:last-child { border-bottom:0; }
.statement.glass .ledger-label { color:rgba(255,255,255,.8); }
.statement.glass .ledger-fig { color:#fff; }
.statement.glass .leader { border-bottom-color:rgba(255,255,255,.3); }
@media (prefers-reduced-motion:reduce){ .statement.glass { transform:none; } }

/* ============================================================================
   INTERACTIVE LISTS — hover-reveal + lift (no layout jump); tap on touch
   ============================================================================ */
/* ledger rows (trust §01, deadlines §04) */
.ledger.ix { border-radius:12px; padding-inline:12px; margin-inline:-12px; cursor:default;
  transition:transform .2s ease, background .2s ease, box-shadow .2s ease; }
.ix-mid { position:relative; flex:1 1 auto; min-width:26px; margin:0 12px; align-self:center; height:1.25em; }
.ix-mid .leader { position:absolute; left:0; right:0; top:50%; margin:0; transform:translateY(-50%); transition:opacity .22s ease; }
.ix-detail { position:absolute; right:0; top:50%; transform:translateY(-50%); opacity:0; pointer-events:none;
  font-size:.82rem; color:var(--text-2); white-space:nowrap; transition:opacity .22s ease; }
@media (hover:hover){
  .ledger.ix:hover { transform:translateY(-2px); background:var(--surface); box-shadow:0 8px 20px -10px rgba(7,47,82,.28); }
  .ledger.ix:hover .ix-mid .leader { opacity:0; }
  .ledger.ix:hover .ix-detail { opacity:1; }
}
.ledger.ix.revealed .ix-mid .leader { opacity:0; }
.ledger.ix.revealed .ix-detail { opacity:1; }
/* trust rows sit on the navy hero */
.trust .ix-detail { color:var(--on-navy-2); }
@media (hover:hover){
  .trust .ledger.ix:hover { background:rgba(255,255,255,.09); box-shadow:none; }
}

/* filing index rows (features §05) */
.filing-index li.ix { position:relative; border-radius:14px; padding-inline:16px; margin-inline:-16px;
  transition:transform .2s ease, background .2s ease, box-shadow .2s ease, border-color .2s ease; }
.fi-more { position:absolute; right:16px; bottom:10px; font-size:.78rem; font-weight:700; letter-spacing:-0.01em;
  color:var(--accent); text-decoration:none; opacity:0; transform:translateY(-3px);
  transition:opacity .2s ease, transform .2s ease; pointer-events:none; white-space:nowrap; }
@media (hover:hover){
  .filing-index li.ix:hover { transform:translateY(-3px); background:var(--surface);
    box-shadow:0 12px 30px -14px rgba(7,47,82,.3); border-bottom-color:transparent; }
  .filing-index li.ix:hover .fi-more { opacity:1; transform:none; pointer-events:auto; }
}
.filing-index li.ix:focus-within { background:var(--surface); box-shadow:0 12px 30px -14px rgba(7,47,82,.3); }
.filing-index li.ix:focus-within .fi-more,
.filing-index li.ix.revealed .fi-more { opacity:1; transform:none; pointer-events:auto; }
.fi-more:hover { text-decoration:underline; }

/* glossary terms as lift-cards with a revealed permalink */
.glossary-page .art-sec { margin-top:12px; padding:20px 22px; border-radius:16px; border:1px solid transparent;
  transition:transform .2s ease, background .2s ease, box-shadow .2s ease, border-color .2s ease; }
.glossary-page .art-sec h2 { border-top:0; padding-top:0; display:flex; align-items:baseline; gap:10px; }
.term-link { font-size:.9rem; font-weight:700; color:var(--accent); text-decoration:none; opacity:0; transition:opacity .2s ease; }
@media (hover:hover){
  .glossary-page .art-sec:hover { transform:translateY(-3px); background:var(--surface); box-shadow:0 12px 30px -14px rgba(7,47,82,.28); border-color:var(--hairline); }
  .glossary-page .art-sec:hover .term-link { opacity:1; }
}
.glossary-page .art-sec:focus-within .term-link,
.glossary-page .art-sec.revealed .term-link { opacity:1; }

/* ============================================================================
   SIMPLE PAGES (privacy · support · 404) — .site-head / .page-main / .site-foot
   These classes shipped with NO rules, leaving those pages unstyled. Give them
   the same navy header, readable article measure and colophon footer as the
   rest of the site, reusing the design tokens.
   ============================================================================ */
.site-head { position:sticky; top:0; z-index:50; background:linear-gradient(180deg,var(--navy-deep),#0a3a68);
  color:var(--on-navy); border-bottom:1px solid rgba(255,255,255,.14); }
.site-head .wrap { display:flex; align-items:center; justify-content:space-between; padding-block:14px; }
.nav-cta { display:flex; align-items:center; gap:20px; }
.nav-link { color:var(--on-navy-2); text-decoration:none; font-size:.85rem; font-weight:600; }
.nav-link:hover { color:#fff; }

.page-main { background:var(--paper); }
.page-main .wrap { max-width:760px; padding-block:clamp(40px,6vw,72px); }
.page-main h1 { font-size:clamp(2rem,4.6vw,3rem); line-height:1.06; letter-spacing:-0.035em; margin:0 0 4px; }
.page-main h2 { font-size:clamp(1.35rem,3vw,1.8rem); line-height:1.2; letter-spacing:-0.02em;
  margin:clamp(30px,4.5vw,46px) 0 12px; padding-top:clamp(18px,3vw,26px); border-top:1px solid var(--hairline); }
.page-main .lead { margin-top:14px; }
.page-main p, .page-main li { font-size:1.05rem; line-height:1.7; }
.page-main p { margin:0 0 1.05em; }
.page-main ul { margin:0 0 1.2em; padding-left:1.15em; }
.page-main li { margin-bottom:.5em; }
.page-main li::marker { color:var(--accent); }
.page-main .updated { color:var(--text-2); font-size:.92rem; margin:4px 0 0; }

.site-foot { background:var(--navy-deep); color:var(--on-navy-2); padding-block:44px; font-size:.86rem; }
.site-foot .wrap { display:grid; gap:20px; }
.site-foot .foot-top { display:flex; flex-wrap:wrap; gap:18px; align-items:center; justify-content:space-between;
  padding-bottom:20px; border-bottom:1px solid rgba(255,255,255,.14); }
.site-foot .foot-links { display:flex; flex-wrap:wrap; gap:20px; }
.site-foot a { color:var(--on-navy-2); }
.site-foot a:hover { color:#fff; }
.foot-sign { margin:0; color:rgba(247,250,253,.55); font-size:.8rem; }
@media (prefers-color-scheme:dark){ .site-foot { background:#04101d; } }