/* ============================================================
   ZASEBE FINANCE — "Scoreboard" design system
   Shared across all pages. One stylesheet, one look.
   ============================================================ */

:root{
  --ink:#050505;
  --ink-2:#101012;
  --ink-3:#18191d;
  --gold:#cda349;
  --gold-bright:#e8c96a;
  --paper:#f4efe4;
  --paper-dim:rgba(244,239,228,.72);
  --paper-faint:rgba(244,239,228,.48);
  --line:rgba(205,163,73,.2);
  --up:#4caf7d;
  --down:#e1584a;
  --maxw:1400px;
  --gutter:clamp(18px,4vw,56px);

  /* Light (white) section counterpart — used sparingly to break up the
     black base, the way LAFC alternates black/white blocks down the page. */
  --light-bg:#f5f2ea;
  --dark-text:#100f0c;
  --dark-text-dim:rgba(16,15,12,.68);
  --dark-text-faint:rgba(16,15,12,.45);
  --gold-deep:#96721f;
  --line-dark:rgba(150,114,31,.28);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;scrollbar-gutter:stable;}
/* Keep anchor-jump targets clear of the sticky switcher+nav stack (~110-114px tall) */
:where([id]){scroll-margin-top:130px;}
html,body{background:var(--ink) !important;}
body{
  margin:0;
  background:var(--ink);
  color:var(--paper);
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;}
a{color:inherit;}
.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter);}

.disp{font-family:'Manrope',sans-serif;text-transform:uppercase;letter-spacing:.3px;}
.mono{font-family:'IBM Plex Mono',ui-monospace,monospace;}
h1,h2,h3,h4{margin:0;text-wrap:balance;}
p{margin:0;}

::selection{background:var(--gold);color:#161006;}

/* Align the shared cross-brand switcher bar (injected by brand-switcher.js)
   to the same content column as the rest of the site, instead of centering
   across the full viewport — keeps it visually on-grid with the nav/cards below.
   The bar itself stays edge-to-edge (no max-width on the element) so its solid
   black background always fully covers the fixed strip at the top of the
   viewport — only the content inside is padded to line up with the grid. On
   a light section scrolling underneath, a narrowed bar would otherwise show
   that light background through the gaps at the corners. */
#zasebe-switcher{
  padding-inline:max(var(--gutter), calc((100vw - var(--maxw)) / 2)) !important;
  box-sizing:border-box !important;
  justify-content:center !important;
}

/* ============ TICKER ============ */
.ticker-bar{
  background:#000;
  border-bottom:1px solid var(--line);
  overflow:hidden;
  white-space:nowrap;
  position:relative;
}
.ticker-track{
  display:inline-flex;
  align-items:center;
  animation:tickerScroll 60s linear infinite;
  padding-block:9px;
}
.ticker-bar:hover .ticker-track{animation-play-state:paused;}
@keyframes tickerScroll{
  from{transform:translateX(0);}
  to{transform:translateX(-50%);}
}
.ticker-item{
  display:inline-flex;align-items:center;gap:8px;
  font-size:13px;letter-spacing:.5px;
  padding-inline:20px;
  border-right:1px solid var(--line);
  color:var(--paper-dim);
}
.ticker-item b{color:var(--paper);font-weight:600;}
.tick-up{color:var(--up);}
.tick-down{color:var(--down);}
@media (prefers-reduced-motion:reduce){.ticker-track{animation:none;}}

/* ============ NAV ============ */
nav{
  position:sticky;top:0;z-index:500;
  background:rgba(5,5,5,.92);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.nav-row{
  display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:32px;
  padding-block:16px;
}
.logo{display:flex;flex-direction:column;line-height:.95;text-decoration:none;}
.logo b{
  font-family:'Manrope',sans-serif;
  font-weight:800;font-size:26px;letter-spacing:1px;
  color:var(--paper);text-transform:uppercase;
}
.logo span{
  font-size:11px;letter-spacing:4px;color:var(--gold);
  text-transform:uppercase;margin-top:3px;font-weight:600;
}
.nav-links{display:flex;gap:26px;list-style:none;margin:0;padding:0;justify-self:center;}
.nav-links a{
  position:relative;display:inline-block;
  text-decoration:none;font-size:14px;font-weight:700;
  letter-spacing:.6px;text-transform:uppercase;color:var(--paper);
  transition:color .2s;padding-bottom:4px;
}
.nav-links a::after{
  content:'';position:absolute;left:0;right:100%;bottom:0;height:2px;
  background:var(--gold-bright);transition:right .28s cubic-bezier(.3,.7,.2,1);
}
.nav-links a:hover,.nav-links a.active{color:var(--gold-bright);}
.nav-links a:hover::after,.nav-links a.active::after{right:0;}
.btn{
  display:inline-flex;align-items:center;gap:10px;
  font-family:'Inter',sans-serif;font-weight:600;
  font-size:13px;letter-spacing:1px;text-transform:uppercase;
  text-decoration:none;cursor:pointer;border:none;
  padding:13px 24px;transition:background .2s,transform .2s,border-color .2s,color .2s;
}
.btn-gold{background:var(--gold);color:#161006;}
.btn-gold:hover{background:var(--gold-bright);transform:translateY(-2px);}
.btn-ghost{background:transparent;color:var(--paper);border:1px solid var(--paper-faint);}
.btn-ghost:hover{border-color:var(--gold);color:var(--gold-bright);transform:translateY(-2px);}
.hamburger{display:none;flex-direction:column;gap:5px;background:none;border:none;padding:8px;cursor:pointer;grid-column:3;justify-self:end;}
.hamburger span{width:22px;height:2px;background:var(--gold);display:block;}
.mobile-menu{display:none;}

/* ============ HERO (homepage, full) ============ */
.hero{
  position:relative;border-bottom:1px solid var(--line);overflow:hidden;
  background:
    linear-gradient(100deg, rgba(5,5,5,.95) 0%, rgba(5,5,5,.8) 30%, rgba(5,5,5,.4) 58%, rgba(5,5,5,.18) 100%),
    url('../img/hero-bg.jpg') center right / cover no-repeat,
    var(--ink);
}
@media (max-width:760px){
  .hero{
    background:
      linear-gradient(180deg, rgba(5,5,5,.9) 0%, rgba(5,5,5,.88) 60%, rgba(5,5,5,.95) 100%),
      url('../img/hero-bg.jpg') center 35% / cover no-repeat,
      var(--ink);
  }
}
.hero-bars{
  position:absolute;inset:0;
  display:flex;align-items:flex-end;justify-content:space-between;
  gap:clamp(4px,1vw,14px);
  opacity:.55;pointer-events:none;
  mask-image:linear-gradient(to top, black 0%, black 35%, transparent 92%);
  -webkit-mask-image:linear-gradient(to top, black 0%, black 35%, transparent 92%);
}
.hero-bars i{
  display:block;flex:1;
  background:linear-gradient(to top, rgba(205,163,73,.5), rgba(205,163,73,.02));
  border-top:1px solid rgba(233,196,104,.7);
}
.hero-inner{position:relative;z-index:2;padding-block:clamp(64px,10vw,110px) clamp(40px,6vw,64px);}
.hero-eyebrow,.section-eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-size:12px;letter-spacing:3px;text-transform:uppercase;
  color:var(--gold);font-weight:600;margin-bottom:22px;
}
.hero-eyebrow::before,.section-eyebrow::before{content:'';width:34px;height:1px;background:var(--gold);}
.hero-title{
  font-family:'Manrope',sans-serif;font-weight:800;
  font-size:clamp(38px,7.4vw,96px);line-height:.98;letter-spacing:-.01em;
  text-transform:uppercase;max-width:14ch;
}
.hero-title em{font-style:normal;color:var(--gold);}
.hero-desc{
  font-size:clamp(15px,1.6vw,17px);line-height:1.75;color:var(--paper-dim);
  max-width:560px;margin-top:26px;font-weight:400;
}
.hero-actions{display:flex;flex-wrap:wrap;gap:16px;margin-top:38px;}

/* Scoreboard strip */
.scoreboard{
  position:relative;z-index:2;
  display:grid;grid-template-columns:repeat(4,1fr);
  border-top:1px solid var(--line);
  background:rgba(0,0,0,.35);
}
.score-cell{padding:26px clamp(16px,2.4vw,32px);border-left:1px solid var(--line);}
.score-cell:first-child{border-left:none;}
.score-num{
  font-family:'Manrope',sans-serif;font-weight:800;
  font-size:clamp(24px,3.2vw,38px);color:var(--gold-bright);
  font-variant-numeric:tabular-nums;line-height:1;
}
.score-label{font-size:11.5px;letter-spacing:1.6px;text-transform:uppercase;color:var(--paper-faint);margin-top:9px;font-weight:600;}

/* ============ PAGE HERO (subpages) ============ */
.page-hero{
  position:relative;border-bottom:1px solid var(--line);overflow:hidden;
  padding-block:clamp(56px,9vw,96px) clamp(40px,6vw,56px);
  background:radial-gradient(ellipse 70% 60% at 85% 0%,rgba(205,163,73,.07),transparent 65%),var(--ink);
}
.page-hero-breadcrumb{
  font-size:12px;letter-spacing:2px;text-transform:uppercase;color:var(--paper-faint);
  margin-bottom:22px;display:flex;gap:8px;align-items:center;
}
.page-hero-breadcrumb a{color:var(--paper-dim);text-decoration:none;}
.page-hero-breadcrumb a:hover{color:var(--gold-bright);}
.page-hero-title{
  font-family:'Manrope',sans-serif;font-weight:800;
  font-size:clamp(32px,5.6vw,64px);line-height:1.02;letter-spacing:-.01em;text-transform:uppercase;max-width:16ch;
}
.page-hero-title em{font-style:normal;color:var(--gold);}
.page-hero-subtitle{font-size:14px;letter-spacing:2px;text-transform:uppercase;color:var(--gold-bright);margin-top:18px;font-weight:600;}
.page-hero-desc{font-size:15.5px;line-height:1.8;color:var(--paper-dim);max-width:620px;margin-top:18px;}
.hero-bg-num{
  position:absolute;right:clamp(-20px,-2vw,20px);top:50%;transform:translateY(-50%);
  font-family:'Manrope',sans-serif;font-weight:800;
  font-size:clamp(140px,22vw,340px);color:rgba(205,163,73,.05);line-height:1;
  pointer-events:none;z-index:0;user-select:none;
}

/* ============ SECTION HEADS ============ */
.section{padding-block:clamp(56px,8vw,96px);}
.section-head{
  display:flex;justify-content:space-between;align-items:flex-end;
  gap:32px;margin-bottom:clamp(32px,5vw,52px);
  border-bottom:1px solid var(--line);padding-bottom:26px;
}
.section-title{
  font-family:'Manrope',sans-serif;font-weight:800;
  font-size:clamp(27px,3.8vw,42px);text-transform:uppercase;line-height:1.05;letter-spacing:-.005em;
}
.section-title em{font-style:normal;color:var(--gold);}
.section-sub{max-width:360px;font-size:15px;line-height:1.7;color:var(--paper-dim);}
.eyebrow{
  display:inline-flex;align-items:center;gap:10px;font-size:12px;letter-spacing:3px;
  text-transform:uppercase;color:var(--gold);font-weight:600;margin-bottom:14px;
}
.eyebrow::before{content:'';width:26px;height:1px;background:var(--gold);}
.lead{font-size:15.5px;line-height:1.85;color:var(--paper-dim);max-width:60ch;margin-top:22px;}
.lead strong{color:var(--gold-bright);font-weight:600;}
.two-col{display:grid;grid-template-columns:11fr 9fr;gap:clamp(32px,6vw,90px);align-items:center;}
@media (max-width:900px){.two-col{grid-template-columns:1fr;}}

/* ============ LIGHT (WHITE) SECTION ============
   Sparingly-used counterpart to the black base — one per page, right after
   the hero, to break the black up the way LAFC alternates black/white
   blocks instead of running one long dark page. Only used on plain text /
   feature-list / steps / quote-box content, never on components that embed
   hardcoded dark-theme colors (charts, live tables, calculators). */
.section-light{background:var(--light-bg);color:var(--dark-text);}
.section-light .eyebrow,.section-light .hero-eyebrow,.section-light .section-eyebrow{color:var(--gold-deep);}
.section-light .eyebrow::before,.section-light .section-eyebrow::before{background:var(--gold-deep);}
.section-light .section-title{color:var(--dark-text);}
.section-light .section-title em{color:var(--gold-deep);}
.section-light .section-head{border-color:var(--line-dark);}
.section-light .section-sub{color:var(--dark-text-dim);}
.section-light .lead{color:var(--dark-text-dim);}
.section-light .lead strong{color:var(--gold-deep);}
.section-light .quote-box{border-color:var(--line-dark);background:rgba(16,15,12,.035);}
.section-light .quote-text{color:var(--dark-text);}
.section-light .quote-author{color:var(--gold-deep);}
.section-light .feature-item{border-color:var(--line-dark);}
.section-light .feature-num{color:var(--gold-deep);}
.section-light .feature-title{color:var(--dark-text);}
.section-light .feature-desc{color:var(--dark-text-dim);}
.section-light .steps{background:var(--line-dark);}
.section-light .step{background:var(--light-bg);}
.section-light .step-num{color:var(--gold-deep);}
.section-light .step-title{color:var(--dark-text);}
.section-light .step-desc{color:var(--dark-text-dim);}
.section-light .article p,.section-light .article ul,.section-light .article ol{color:var(--dark-text-dim);}
.section-light .article strong{color:var(--dark-text);}
.section-light .article a{color:var(--gold-deep);}
.section-light .btn-ghost{color:var(--dark-text);border-color:rgba(16,15,12,.3);}
.section-light .btn-ghost:hover{border-color:var(--gold-deep);color:var(--gold-deep);}
.section-light .stat-grid{background:var(--line-dark);}
.section-light .stat-cell{background:var(--light-bg);}
.section-light .stat-cell.highlight{background:rgba(150,114,31,.08);}
.section-light .stat-cell.highlight .stat-label{color:var(--gold-deep);}
.section-light .stat-num{color:var(--gold-deep);}
.section-light .stat-label{color:var(--dark-text-faint);}
.section-light .callout{border-color:var(--line-dark);background:rgba(150,114,31,.05);}
.section-light .callout-label{color:var(--gold-deep);}
.section-light .callout-text{color:var(--dark-text-dim);}
.section-light .tile{background:#efece3;}
.section-light .tile:hover{background:#e7e2d3;}
.section-light .tile-title{color:var(--dark-text);}
.section-light .tile-body{color:var(--dark-text-dim);}
.section-light .grid-2,.section-light .grid-3,.section-light .grid-4{background:var(--line-dark);}
.section-light .card{background:#efece3;}
.section-light .card:hover{background:#e7e2d3;}
.section-light .card-num{color:rgba(150,114,31,.12);}
.section-light .card-icon{stroke:var(--gold-deep);}
.section-light .card-title{color:var(--dark-text);}
.section-light .card-desc{color:var(--dark-text-dim);}
.section-light .card-tag-item{color:var(--dark-text-dim);}
.section-light .card-tag-item::before{background:var(--gold-deep);}
.section-light .card-link{color:var(--gold-deep);border-top-color:var(--line-dark);}
.section-light .fp-card-tag{color:var(--gold-deep);}
.section-light table.data-table td{color:var(--dark-text-dim);}
.section-light table.data-table tr:hover td{background:rgba(150,114,31,.05);}
.section-light table.data-table td.col-highlight{color:var(--gold-deep);}
.section-light .form-label{color:var(--dark-text-faint);}
.section-light .form-input{color:var(--dark-text);border-bottom-color:rgba(16,15,12,.25);}
.section-light .form-input::placeholder{color:var(--dark-text-faint);}
.section-light .form-input:-webkit-autofill,.section-light .form-input:-webkit-autofill:hover,.section-light .form-input:-webkit-autofill:focus{
  -webkit-box-shadow:0 0 0 1000px var(--light-bg) inset !important;
  -webkit-text-fill-color:var(--dark-text) !important;caret-color:var(--dark-text) !important;
}
.section-light .topic-grid{border-color:var(--line-dark);}
.section-light .topic-grid label{color:var(--dark-text-dim);border-color:rgba(150,114,31,.12);}
.section-light .topic-grid label:hover{background:rgba(150,114,31,.06);color:var(--dark-text);}
.section-light .topic-grid label.selected{background:rgba(150,114,31,.1);color:var(--gold-deep);border-color:rgba(150,114,31,.35);}
.section-light .captcha-group{background:rgba(150,114,31,.05);border-color:var(--line-dark);}
.section-light .captcha-group .form-label{color:var(--gold-deep);}

/* Consistent hairline between every section — dark or light — so blocks
   read as clearly separated "chapters" instead of blending into a wall of
   one color, especially where two light or two dark sections sit back to back. */
.section{border-top:1px solid var(--line);}
.section-light{border-top-color:var(--line-dark);}

/* ============ CARD GRIDS ============ */
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);}

.card{
  background:var(--ink-2);padding:clamp(28px,3vw,40px);
  display:flex;flex-direction:column;gap:18px;
  position:relative;overflow:hidden;isolation:isolate;
  transition:background .25s,transform .3s cubic-bezier(.3,.7,.2,1),box-shadow .3s;
}
.card::before{
  content:'';position:absolute;top:0;left:0;right:0;height:0;
  background:var(--gold);transition:height .25s;z-index:2;
}
.card:hover{background:var(--ink-3);transform:translateY(-6px);box-shadow:0 24px 48px -24px rgba(0,0,0,.7);}
.card:hover::before{height:3px;}
.card-top{display:flex;justify-content:space-between;align-items:flex-start;}
.card-num{
  font-family:'Manrope',sans-serif;font-weight:800;
  font-size:clamp(64px,7.5vw,104px);line-height:.78;letter-spacing:0;
  color:rgba(205,163,73,.16);
  position:absolute;top:clamp(10px,1.6vw,18px);right:clamp(16px,2vw,26px);
  z-index:-1;pointer-events:none;user-select:none;
}
.card-icon{width:38px;height:38px;stroke:var(--gold);fill:none;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;}
.card-title{
  font-family:'Manrope',sans-serif;font-weight:700;
  font-size:22px;text-transform:uppercase;letter-spacing:0;
}
.card-desc{font-size:14.5px;line-height:1.75;color:var(--paper-dim);}
.card-tags{display:flex;flex-direction:column;gap:9px;margin-top:2px;}
.card-tag-item{display:flex;align-items:center;gap:10px;font-size:13.5px;color:var(--paper-dim);}
.card-tag-item::before{content:'';width:4px;height:4px;background:var(--gold);border-radius:50%;flex-shrink:0;}
.card-link{
  margin-top:auto;padding-top:14px;
  display:inline-flex;align-items:center;gap:9px;
  font-size:12.5px;letter-spacing:1.4px;text-transform:uppercase;
  color:var(--gold-bright);text-decoration:none;font-weight:700;
  border-top:1px solid var(--line);
}

/* Small info card (insights / feature tiles) */
.tile{background:var(--ink-2);padding:24px;display:flex;flex-direction:column;gap:14px;transition:background .25s;}
.tile:hover{background:var(--ink-3);}
.tile-meta{display:flex;align-items:center;gap:10px;font-size:11.5px;letter-spacing:1.2px;text-transform:uppercase;}
.tile-tag{color:var(--gold);font-weight:700;}
.tile-date{color:var(--paper-faint);font-family:'IBM Plex Mono',monospace;font-variant-numeric:tabular-nums;}
.tile-title{font-size:16px;font-weight:600;line-height:1.4;color:var(--paper);}
.tile-body{font-size:13.5px;line-height:1.65;color:var(--paper-dim);}

/* ============ PROCESS / NUMBERED STEPS ============ */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);margin-top:8px;}
.step{background:var(--ink-2);padding:28px 24px;display:flex;flex-direction:column;gap:10px;}
.step-num{font-family:'IBM Plex Mono',monospace;font-weight:700;font-size:13px;color:var(--gold);}
.step-title{font-family:'Manrope',sans-serif;font-weight:700;font-size:18px;text-transform:uppercase;}
.step-desc{font-size:14px;line-height:1.7;color:var(--paper-dim);}
.step-list{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:6px;}
.step-list li{font-size:13px;color:var(--paper-dim);display:flex;gap:8px;}
.step-list li::before{content:'';width:4px;height:4px;background:var(--gold);border-radius:50%;flex-shrink:0;margin-top:6px;}

/* ============ WHY / FEATURE LIST ============ */
.feature-list{list-style:none;display:flex;flex-direction:column;gap:0;margin:0;padding:0;}
.feature-item{
  display:grid;grid-template-columns:56px 1fr;gap:20px;align-items:start;
  padding:26px 0;border-bottom:1px solid var(--line);transition:padding-left .25s;
}
.feature-item:first-child{border-top:1px solid var(--line);}
.feature-item:hover{padding-left:8px;}
.feature-num{font-family:'IBM Plex Mono',monospace;font-size:13px;font-weight:700;color:var(--gold);padding-top:2px;}
.feature-title{font-size:15px;font-weight:600;letter-spacing:.3px;color:var(--paper);margin-bottom:6px;}
.feature-desc{font-size:14px;color:var(--paper-dim);line-height:1.7;}

.quote-box{padding:40px clamp(24px,3vw,50px);border:1px solid var(--line);background:rgba(0,0,0,.3);}
.quote-text{font-family:'Manrope',sans-serif;font-weight:700;font-size:clamp(20px,2.6vw,28px);line-height:1.35;text-transform:none;color:var(--paper);}
.quote-author{font-size:12px;letter-spacing:2px;text-transform:uppercase;color:var(--gold);margin-top:18px;display:block;}

/* ============ STAT GRID (standalone, e.g. team/company numbers) ============ */
.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);}
.stat-cell{background:var(--ink-2);padding:30px 22px;text-align:left;}
.stat-cell.highlight{background:rgba(205,163,73,.09);box-shadow:inset 3px 0 0 var(--gold);}
.stat-cell.highlight .stat-label{color:var(--gold-bright);}
.stat-num{font-family:'Manrope',sans-serif;font-weight:800;font-size:clamp(26px,3vw,36px);color:var(--gold-bright);font-variant-numeric:tabular-nums;}
.stat-label{font-size:11.5px;letter-spacing:1.4px;text-transform:uppercase;color:var(--paper-faint);margin-top:8px;font-weight:600;}

/* ============ DISCLAIMER / CALLOUT ============ */
.callout{border:1px solid var(--line);background:rgba(205,163,73,.05);padding:24px 28px;display:flex;gap:16px;align-items:flex-start;}
.callout-label{font-size:11.5px;letter-spacing:2px;text-transform:uppercase;color:var(--gold);font-weight:700;margin-bottom:8px;}
.callout-text{font-size:14px;line-height:1.75;color:var(--paper-dim);}

/* ============ TABLES (markets, cookies) ============ */
.table-wrap{overflow-x:auto;border:1px solid var(--line);}
table.data-table{width:100%;border-collapse:collapse;min-width:560px;font-size:14.5px;}
table.data-table th{
  text-align:left;padding:14px 18px;background:rgba(0,0,0,.4);
  font-size:11.5px;letter-spacing:1.4px;text-transform:uppercase;color:var(--gold);
  font-weight:700;border-bottom:1px solid var(--line);
}
table.data-table td{padding:14px 18px;border-bottom:1px solid var(--line);color:var(--paper-dim);font-family:'IBM Plex Mono',monospace;font-variant-numeric:tabular-nums;}
table.data-table tr:last-child td{border-bottom:none;}
table.data-table tr:hover td{background:rgba(205,163,73,.04);}
.mkt-up{color:var(--up);}
.mkt-down{color:var(--down);}
/* Highlight one recommended column in a comparison table (e.g. "us" vs "typical") */
table.data-table th.col-highlight{background:var(--gold);color:#161006;}
table.data-table td.col-highlight{background:rgba(205,163,73,.1);color:var(--gold-bright);font-weight:700;}

/* ============ ARTICLE / LEGAL TYPOGRAPHY ============ */
.article{max-width:760px;}
.article h2{
  font-family:'Manrope',sans-serif;font-weight:800;text-transform:uppercase;
  font-size:clamp(22px,3vw,30px);margin-top:48px;margin-bottom:16px;color:var(--paper);
}
.article h2:first-child{margin-top:0;}
.article h3{font-size:16px;font-weight:700;color:var(--gold-bright);margin-top:28px;margin-bottom:10px;}
.article p{font-size:15.5px;line-height:1.85;color:var(--paper-dim);margin-bottom:16px;}
.article ul,.article ol{color:var(--paper-dim);font-size:15.5px;line-height:1.85;padding-left:22px;margin-bottom:16px;}
.article li{margin-bottom:6px;}
.article a{color:var(--gold-bright);}
.article strong{color:var(--paper);font-weight:600;}

/* ============ CTA BANNER ============ */
.cta-band{
  position:relative;background:var(--gold);color:#161006;
  padding-block:clamp(52px,8vw,80px);
  clip-path:polygon(0 22px,100% 0,100% calc(100% - 22px),0 100%);
  margin-block:6px;
}
.cta-inner{display:flex;justify-content:space-between;align-items:center;gap:32px;flex-wrap:wrap;}
.cta-title{
  font-family:'Manrope',sans-serif;font-weight:800;
  font-size:clamp(26px,3.8vw,42px);text-transform:uppercase;line-height:1.05;letter-spacing:-.005em;max-width:16ch;
}
.cta-sub{font-size:15px;margin-top:10px;max-width:44ch;color:#3a2c0f;font-weight:500;}
.cta-band .btn-gold{background:#161006;color:var(--gold-bright);}
.cta-band .btn-gold:hover{background:#000;}

/* ============ FORMS ============ */
.topic-grid{display:grid;grid-template-columns:1fr 1fr;gap:0;margin-bottom:28px;border:1px solid var(--line);}
.topic-grid label{
  display:flex;align-items:center;gap:14px;padding:16px 20px;cursor:pointer;
  font-size:12px;letter-spacing:1.6px;text-transform:uppercase;color:var(--paper-dim);
  font-weight:600;border:1px solid rgba(205,163,73,.08);transition:all .25s;
}
.topic-grid label:hover{background:rgba(205,163,73,.06);color:var(--paper);}
.topic-grid label.selected{background:rgba(205,163,73,.1);color:var(--gold-bright);border-color:rgba(205,163,73,.35);}
.topic-grid label.full-width{grid-column:1/-1;}
.topic-grid label input[type="checkbox"]{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0;}
.topic-icon{width:18px;height:18px;opacity:.5;flex-shrink:0;}
.topic-grid label.selected .topic-icon{opacity:.95;}
.adaptive-field{max-height:0;overflow:hidden;opacity:0;transition:max-height .4s ease,opacity .3s ease,margin .3s ease;margin-top:0;}
.adaptive-field.visible{max-height:120px;opacity:1;margin-top:16px;}
.form-group{margin-bottom:22px;}
.form-label{display:block;font-size:11px;letter-spacing:2.2px;text-transform:uppercase;color:var(--paper-faint);margin-bottom:9px;}
.form-input{
  width:100%;background:transparent;border:none;border-bottom:1px solid rgba(205,163,73,.3);
  padding:13px 0;color:var(--paper);font-family:'Inter',sans-serif;font-size:15px;font-weight:400;
  outline:none;transition:border-color .25s;
}
.form-input:focus{border-color:var(--gold);}
.form-input::placeholder{color:var(--paper-faint);}
.form-input:-webkit-autofill,.form-input:-webkit-autofill:hover,.form-input:-webkit-autofill:focus{
  -webkit-box-shadow:0 0 0 1000px var(--ink-2) inset !important;
  -webkit-text-fill-color:var(--paper) !important;caret-color:var(--paper) !important;
  transition:background-color 5000s ease-in-out 0s;
}
textarea.form-input{resize:none;height:100px;}
.captcha-group{margin-top:10px;padding:18px 22px;background:rgba(205,163,73,.05);border:1px solid var(--line);}
.captcha-group .form-label{color:var(--gold);}
.form-submit{
  background:var(--gold);color:#161006;border:none;padding:15px 38px;
  font-family:'Inter',sans-serif;font-size:12px;letter-spacing:1.4px;text-transform:uppercase;
  font-weight:600;cursor:pointer;transition:background .25s;
}
.form-submit:hover{background:var(--gold-bright);}
.form-submit:disabled{opacity:.6;cursor:default;}

/* ============ FOOTER ============ */
footer{border-top:1px solid var(--line);padding-block:56px 28px;}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px;padding-bottom:40px;border-bottom:1px solid var(--line);}
.foot-brand b{font-family:'Manrope',sans-serif;font-weight:800;font-size:22px;text-transform:uppercase;color:var(--paper);}
.foot-brand p{font-size:14px;line-height:1.7;color:var(--paper-dim);max-width:34ch;margin-top:14px;}
.foot-h{font-size:12px;letter-spacing:1.6px;text-transform:uppercase;color:var(--gold);font-weight:700;margin-bottom:16px;}
.foot-links{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;}
.foot-links a{font-size:14.5px;color:var(--paper-dim);text-decoration:none;}
.foot-links a:hover{color:var(--gold-bright);}
.foot-bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;padding-top:22px;font-size:12.5px;color:var(--paper-faint);}
.foot-bottom a{color:var(--paper-faint);text-decoration:underline;}
.foot-bottom a:hover{color:var(--gold-bright);}

/* ============ PARTNERS STRIP ============ */
.partners-strip{padding-block:56px;border-top:1px solid var(--line);text-align:center;}
.partners-label{font-size:12px;letter-spacing:4px;text-transform:uppercase;color:var(--paper-dim);margin-bottom:34px;}
.partners-logos{display:grid;grid-template-columns:repeat(3,1fr);max-width:900px;margin-inline:auto;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.partners-logos a{display:flex;align-items:center;justify-content:center;height:140px;padding:20px;border-left:1px solid var(--line);}
.partners-logos a:first-child{border-left:none;}
.partner-logo-img{max-height:70px;max-width:100%;width:auto;opacity:.85;transition:opacity .25s;}
.partner-logo-img:hover{opacity:1;}

/* ============ NO-SOCIAL BAND ============ */
.no-social{padding-block:56px;border-top:1px solid var(--line);text-align:center;}
.no-social-icons{display:flex;align-items:center;justify-content:center;gap:32px;flex-wrap:wrap;margin-bottom:26px;}
.no-social-title{font-family:'Manrope',sans-serif;font-weight:800;font-size:clamp(22px,3vw,32px);text-transform:uppercase;color:var(--paper);max-width:640px;margin-inline:auto;}
.no-social-sub{font-size:13.5px;letter-spacing:2.2px;text-transform:uppercase;color:var(--gold);font-weight:600;margin-top:10px;}

/* ============ COOKIE BANNER ============ */
#cookieBanner{
  display:none;position:fixed;bottom:0;left:0;right:0;z-index:10000;
  background:rgba(5,5,5,.97);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border-top:1px solid var(--line);padding:20px 28px;
  padding-bottom:calc(20px + env(safe-area-inset-bottom,0px));font-family:'Inter',sans-serif;
}
#cookieBanner .cb-inner{max-width:1100px;margin:0 auto;display:flex;align-items:center;gap:20px;flex-wrap:wrap;justify-content:space-between;}
#cookieBanner .cb-text{display:flex;align-items:center;gap:16px;flex:1;min-width:280px;}
#cookieBanner p{font-size:14.5px;color:var(--paper-dim);line-height:1.6;font-weight:400;margin:0;}
#cookieBanner .cb-actions{display:flex;gap:12px;flex-shrink:0;}
#cookieBanner .cb-actions button{font-family:'Inter',sans-serif;font-size:12px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;padding:11px 24px;cursor:pointer;border:none;}
#cookieBanner .cb-accept{background:var(--gold);color:#161006;}
#cookieBanner .cb-accept:hover{background:var(--gold-bright);}
#cookieBanner .cb-decline{background:transparent;color:var(--paper-dim);border:1px solid var(--paper-faint) !important;}

.reveal{opacity:0;transform:translateY(24px);transition:opacity .6s ease,transform .6s ease;}
.reveal.visible{opacity:1;transform:none;}

/* Cascading entrance for repeating grids — each tile lags slightly behind
   the previous one instead of all fading in at once. */
.grid-3 > .reveal:nth-child(1),.grid-4 > .reveal:nth-child(1),.steps > .reveal:nth-child(1),.stat-grid > .reveal:nth-child(1),.scoreboard > .reveal:nth-child(1){transition-delay:0s;}
.grid-3 > .reveal:nth-child(2),.grid-4 > .reveal:nth-child(2),.steps > .reveal:nth-child(2),.stat-grid > .reveal:nth-child(2),.scoreboard > .reveal:nth-child(2){transition-delay:.09s;}
.grid-3 > .reveal:nth-child(3),.grid-4 > .reveal:nth-child(3),.steps > .reveal:nth-child(3),.stat-grid > .reveal:nth-child(3),.scoreboard > .reveal:nth-child(3){transition-delay:.18s;}
.grid-3 > .reveal:nth-child(4),.grid-4 > .reveal:nth-child(4),.steps > .reveal:nth-child(4),.stat-grid > .reveal:nth-child(4),.scoreboard > .reveal:nth-child(4){transition-delay:.27s;}
.grid-4 > .reveal:nth-child(5),.steps > .reveal:nth-child(5){transition-delay:.36s;}
.grid-4 > .reveal:nth-child(6),.steps > .reveal:nth-child(6){transition-delay:.45s;}
@media (prefers-reduced-motion:reduce){
  .grid-3 > .reveal,.grid-4 > .reveal,.steps > .reveal,.stat-grid > .reveal,.scoreboard > .reveal{transition-delay:0s !important;}
}

/* ============ RESPONSIVE ============ */
/* Tablet: a slightly narrower content column than the widened desktop one
   (1400px) — keeps grids/cards from feeling over-stretched on a ~768-1100px
   tablet viewport, between the full-bleed mobile layout and the wide desktop one. */
@media (max-width:1100px){
  :root{--maxw:1180px;}
}
/* Nav collapses to the hamburger a bit earlier than the general tablet
   breakpoint below — a centered link group needs more clear room on each
   side than an edge-pinned one to avoid crowding against the logo/CTA. */
@media (max-width:1150px){
  .nav-links,.nav-row>.btn{display:none;}
  .hamburger{display:flex;}
  .mobile-menu.open{
    display:flex;flex-direction:column;gap:22px;position:fixed;inset:0;
    background:rgba(8,9,10,.98);z-index:600;align-items:center;justify-content:center;
  }
  .mobile-menu a{font-size:20px;text-decoration:none;color:var(--paper);font-family:'Manrope',sans-serif;text-transform:uppercase;letter-spacing:1px;}
  .mobile-menu .btn{margin-top:10px;}
  .mobile-close{position:absolute;top:22px;right:22px;background:none;border:none;color:var(--gold);font-size:28px;cursor:pointer;}
}
@media (max-width:980px){
  .scoreboard,.stat-grid{grid-template-columns:repeat(2,1fr);}
  .scoreboard .score-cell:nth-child(3),.stat-grid .stat-cell:nth-child(3){border-left:none;}
  .grid-3,.grid-2{grid-template-columns:1fr;}
  .grid-4,.steps{grid-template-columns:repeat(2,1fr);}
  .foot-grid{grid-template-columns:1fr 1fr;}
  .cta-inner{flex-direction:column;align-items:flex-start;}
  .section-head{flex-direction:column;align-items:flex-start;}
  .hero-bg-num{display:none;}
}
@media (max-width:640px){
  .grid-4,.steps,.insights-grid{grid-template-columns:1fr;}
  .scoreboard,.stat-grid{grid-template-columns:1fr 1fr;}
  .foot-grid{grid-template-columns:1fr;gap:28px;}
  .topic-grid{grid-template-columns:1fr;}
  .partners-logos{grid-template-columns:1fr;}
  .partners-logos a{height:110px;border-left:none;border-top:1px solid var(--line);}
  .partners-logos a:first-child{border-top:none;}
}

/* ============ CUSTOM CURSOR ============
   Desktop-only (fine pointer + real hover) — a minimal gold dot with a
   trailing ring: the ring lags behind the dot for a smooth, comet-like
   motion instead of literal particle trail. Enabled by JS adding
   .zf-custom-cursor to <body> only once it has set the cursor up, so a
   failed/blocked script never leaves the visitor without any cursor. */
@media (hover:hover) and (pointer:fine){
  body.zf-custom-cursor,
  body.zf-custom-cursor a,
  body.zf-custom-cursor button,
  body.zf-custom-cursor input,
  body.zf-custom-cursor textarea,
  body.zf-custom-cursor select,
  body.zf-custom-cursor label{cursor:none;}

  .zf-cursor-dot,.zf-cursor-ring{
    position:fixed;top:0;left:0;border-radius:50%;
    pointer-events:none;z-index:9999;
    transform:translate(var(--zf-x,-100px),var(--zf-y,-100px)) translate(-50%,-50%);
    opacity:0;transition:opacity .25s ease;
  }
  .zf-cursor-dot.is-visible,.zf-cursor-ring.is-visible{opacity:1;}
  .zf-cursor-dot{
    width:6px;height:6px;background:var(--gold-bright);
    box-shadow:0 0 10px 2px rgba(232,201,106,.55);
    transition:opacity .25s ease,width .2s ease,height .2s ease;
  }
  .zf-cursor-dot.is-down{width:4px;height:4px;}
  .zf-cursor-ring{
    width:26px;height:26px;border:1px solid var(--gold);
    transition:opacity .25s ease,width .25s cubic-bezier(.2,.8,.2,1),height .25s cubic-bezier(.2,.8,.2,1),border-color .25s ease;
  }
  .zf-cursor-ring.is-down{width:20px;height:20px;}
  .zf-cursor-ring.is-hover-link{width:36px;height:36px;border-color:var(--gold-bright);}
  .zf-cursor-ring.is-hover-btn{width:56px;height:56px;border-color:rgba(205,163,73,.85);}
  .zf-cursor-ring.is-hover-btn::after{
    content:'';position:absolute;inset:0;border-radius:50%;
    border:1px solid rgba(205,163,73,.6);
    animation:zfCursorRadar 1.6s ease-out infinite;
  }

  /* One-shot expanding ring spawned on click — three, lightly staggered,
     read together as a single "wave" radiating out from the click point. */
  .zf-click-wave{
    position:fixed;top:0;left:0;width:8px;height:8px;border-radius:50%;
    border:1.5px solid var(--gold-bright);
    pointer-events:none;z-index:9998;
    transform:translate(-50%,-50%);
    animation:zfClickWave .65s cubic-bezier(.2,.7,.3,1) forwards;
  }
}
@keyframes zfCursorRadar{
  0%{transform:scale(1);opacity:.8;}
  100%{transform:scale(1.7);opacity:0;}
}
@keyframes zfClickWave{
  0%{width:8px;height:8px;opacity:.85;}
  100%{width:64px;height:64px;opacity:0;}
}
@media (prefers-reduced-motion:reduce){
  .zf-cursor-ring.is-hover-btn::after{animation:none;}
  .zf-cursor-dot,.zf-cursor-ring{transition:opacity .25s ease;}
}