:root{
  --ink:#0B1220;
  --ink-2:#131C2E;
  --paper:#F2F4F8;
  --paper-dim:#9AA6BC;
  --blue:#1C6DD0;
  --blue-deep:#0A3D7A;
  --gold:#FFC72C;
  --green:#3FA66B;
  --red:#E5484D;
  --line: rgba(242,244,248,0.10);
  --maxw:1180px;
  --radius:20px;
  --display:'Anton', sans-serif;
  --body:'Archivo', system-ui, sans-serif;
  --serif:'Fraunces', serif;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0; background:var(--ink); color:var(--paper); font-family:var(--body); font-weight:500; line-height:1.6; -webkit-font-smoothing:antialiased; overflow-x:clip;}
h1,h2,h3{font-family:var(--display); font-weight:400; text-transform:uppercase; letter-spacing:.01em; margin:0;}
em{font-family:var(--serif); font-style:italic; font-weight:500; color:var(--gold);}
a{color:inherit;} img,svg{display:block; max-width:100%;}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 24px;}
::selection{background:var(--blue); color:var(--paper);}
button, input{font-family:inherit;}

/* ambient fixed background */
#bg-fixed{position:fixed; inset:0; z-index:0; overflow:hidden; pointer-events:none; background:var(--ink);}
#bg-fixed .blob{position:absolute; border-radius:50%; filter:blur(90px); opacity:.28; mix-blend-mode:screen;}
#bg-fixed .b1{width:50vw; height:50vw; background:var(--blue); top:-16%; left:-10%; animation:drift1 28s ease-in-out infinite alternate;}
#bg-fixed .b2{width:42vw; height:42vw; background:var(--gold); bottom:-16%; right:-8%; animation:drift2 34s ease-in-out infinite alternate;}
@keyframes drift1{from{transform:translate(0,0) scale(1);}to{transform:translate(8vw,10vh) scale(1.15);}}
@keyframes drift2{from{transform:translate(0,0) scale(1);}to{transform:translate(-9vw,-6vh) scale(1.1);}}
@media (prefers-reduced-motion: reduce){#bg-fixed .blob{animation:none;}}

.nav, header, section, footer{position:relative; z-index:1;}

#progress{position:fixed; top:0; left:0; height:3px; width:0%; background:var(--gold); z-index:400; transition:width .05s linear;}

.nav{
  position:fixed; top:0; left:0; right:0; z-index:200; display:flex; align-items:center; justify-content:space-between;
  padding:14px 24px; background:rgba(11,18,32,.6); backdrop-filter:blur(14px) saturate(140%); -webkit-backdrop-filter:blur(14px) saturate(140%);
  border-bottom:1px solid var(--line); transition:transform .35s ease;
}
.nav.hide{transform:translateY(-100%);}
.nav .mark{display:flex; align-items:center; gap:9px; font-family:var(--display); font-size:20px;}
.nav .mark .dot{width:9px; height:9px; border-radius:50%; background:var(--gold);}

.reveal{opacity:0; transform:translateY(24px); transition:opacity .7s ease, transform .7s ease;}
.reveal.in{opacity:1; transform:translateY(0);}

/* HERO */
.hero{
  padding:160px 0 90px;
  background:
    radial-gradient(1000px 500px at 10% -10%, rgba(28,109,208,.35), transparent 60%),
    radial-gradient(800px 480px at 100% 0%, rgba(255,199,44,.14), transparent 55%);
}
.eyebrow{display:inline-flex; align-items:center; gap:10px; font-size:13px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--gold); border:1px solid rgba(255,199,44,.4); padding:7px 14px; border-radius:999px;}
.eyebrow::before{content:""; width:7px; height:7px; background:var(--gold); border-radius:50%;}
.hero h1{font-size:clamp(44px,8vw,92px); line-height:.95; margin-top:20px; max-width:900px;}
.hero h1 .accent{color:var(--gold);}
.hero p.lede{max-width:600px; margin-top:20px; font-size:17px; color:var(--paper-dim);}
.hero .stat{margin-top:36px; display:inline-flex; align-items:baseline; gap:14px; background:rgba(19,28,46,.85); border:1px solid var(--line); border-radius:999px; padding:14px 24px;}
.hero .stat b{font-family:var(--display); font-size:30px; color:var(--gold);}
.hero .stat span{font-size:13px; color:var(--paper-dim);}

/* TICKER */
.ticker-outer{background:rgba(19,28,46,.9); border:1px solid var(--line); border-radius:999px; overflow:hidden; margin-top:40px; padding:15px 0;}
.ticker-track{display:flex; white-space:nowrap; animation:tickScroll 32s linear infinite; width:max-content;}
.ticker-outer:hover .ticker-track{animation-play-state:paused;}
@keyframes tickScroll{from{transform:translateX(0);}to{transform:translateX(-50%);}}
.tick{font-family:var(--serif); font-variant-numeric:tabular-nums; display:inline-flex; align-items:baseline; gap:8px; padding:0 26px; border-right:1px solid var(--line); font-size:15px; color:var(--paper-dim);}
.tick b{color:var(--paper); font-weight:600; font-family:var(--body);}
.tick em{font-style:normal; font-size:12px; font-weight:700;}
.tick em.up{color:var(--green);} .tick em.down{color:var(--red);}
@media (prefers-reduced-motion: reduce){.ticker-track{animation:none;}}

section{padding:110px 0;}
.kicker{font-size:13px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--gold); margin-bottom:14px;}
h2.section-title{font-size:clamp(30px,5vw,52px); max-width:760px;}
.section-sub{color:var(--paper-dim); max-width:600px; margin-top:16px; font-size:16px;}

.live-pill{display:inline-flex; align-items:center; gap:8px; font-size:12px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--paper-dim); border:1px solid var(--line); padding:8px 14px; border-radius:999px;}
.live-pill .dot{width:8px; height:8px; border-radius:50%; background:var(--gold);}
.live-pill.err .dot{background:var(--paper-dim);}

/* KEY FIGURES */
.kf-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:18px; margin-top:44px;}
.kf-card{background:rgba(19,28,46,.9); border:1px solid var(--line); border-radius:var(--radius); padding:26px;}
.kf-label{font-size:12px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--paper-dim);}
.kf-value{font-family:var(--display); font-size:38px; color:var(--gold); margin-top:8px;}
.kf-trend{font-size:13px; color:var(--blue); font-weight:700; margin-top:4px;}
.kf-note{font-size:14px; color:var(--paper-dim); margin-top:12px;}
.kf-source{margin-top:16px; padding-top:14px; border-top:1px solid var(--line); display:flex; justify-content:space-between; font-size:12px; color:var(--paper-dim);}
.kf-source a{color:var(--gold); text-decoration:none;}

/* INFLATION CALC */
.calc-card{background:rgba(19,28,46,.9); border:1px solid var(--line); border-radius:var(--radius); padding:32px; margin-top:44px; max-width:640px;}
.calc-row{display:flex; gap:14px; flex-wrap:wrap; align-items:flex-end;}
.calc-field{display:flex; flex-direction:column; gap:6px;}
.calc-field label{font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:var(--paper-dim);}
.calc-field input, .calc-field select{
  background:var(--ink); border:1px solid var(--line); color:var(--paper); border-radius:10px; padding:11px 14px; font-size:15px; min-width:120px;
}
.calc-btn{background:var(--blue); color:var(--paper); border:none; border-radius:10px; padding:12px 22px; font-weight:700; cursor:pointer; transition:background .2s ease;}
.calc-btn:hover{background:#2680ee;}
.calc-result{margin-top:20px; font-size:17px; line-height:1.6;}
.calc-result b{color:var(--gold);}
.calc-fine{display:block; margin-top:8px; font-size:12.5px; color:var(--paper-dim);}
.calc-fine a{color:var(--gold);}

/* LINKS */
.link-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:14px; margin-top:40px;}
.link-card{display:block; text-decoration:none; color:inherit; background:rgba(19,28,46,.9); border:1px solid var(--line); border-radius:16px; padding:20px; transition:transform .25s ease, border-color .25s ease;}
.link-card:hover{transform:translateY(-4px); border-color:rgba(255,199,44,.5);}
.link-card b{display:block; font-size:15px; margin-bottom:4px;}
.link-card span{font-size:13px; color:var(--paper-dim);}

footer{padding:60px 0 40px; border-top:1px solid var(--line); background:rgba(9,14,24,.92);}
.foot-fine{font-size:13px; color:#8a93a8; line-height:1.7; max-width:680px;}
.foot-fine a{text-decoration:underline; text-underline-offset:3px;}

@media(max-width:640px){
  section{padding:70px 0;}
  .hero{padding:130px 0 60px;}
  .calc-row{flex-direction:column; align-items:stretch;}
}
