:root {
  --bg:#0d0d0c; --card:#141413; --card2:#1a1a18; --accent:#ff4d00; --text:#f4f1ea;
  --muted:#a3a09a; --line:rgba(244,241,234,0.12);
}
* { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
body { background:var(--bg); color:var(--text); font-family:'Outfit',system-ui,sans-serif; overflow-x:hidden; }
a { color:inherit; }
::selection { background:var(--accent); color:var(--text); }

.nav { position:fixed; top:16px; left:50%; transform:translateX(-50%); z-index:50;
  display:flex; align-items:center; gap:2rem; padding:0.65rem 1.4rem;
  background:rgba(13,13,12,0.7); backdrop-filter:blur(16px);
  border:1px solid var(--line); border-radius:999px; }
.logo { font-family:'Space Grotesk'; font-weight:700; font-size:1.05rem; letter-spacing:0.02em; cursor:pointer; }
.logo span { color:var(--accent); }
.navlinks { display:flex; gap:1.4rem; }
.navlinks a { color:var(--muted); text-decoration:none; font-size:0.85rem; font-weight:600; cursor:pointer; position:relative; transition:color .3s; }
.navlinks a::after { content:""; position:absolute; left:0; bottom:-5px; width:0; height:2px; background:var(--accent); border-radius:2px; transition:width .35s cubic-bezier(.16,1,.3,1); }
.navlinks a:hover, .navlinks a.active { color:var(--text); }
.navlinks a:hover::after, .navlinks a.active::after { width:100%; }
.pill-btn { background:var(--text); color:#0d0d0c; border:none; font-family:inherit; font-weight:700; font-size:0.85rem;
  padding:0.55rem 1.2rem; border-radius:999px; cursor:pointer; transition:transform .3s, box-shadow .3s; }
.pill-btn:hover { transform:translateY(-2px) scale(1.03); box-shadow:0 10px 30px rgba(0,0,0,0.5); }
.pill-btn.big { font-size:1rem; padding:0.85rem 1.8rem; }
.ghost-btn { background:transparent; color:var(--text); border:1px solid var(--line); font-family:inherit; font-weight:700;
  font-size:1rem; padding:0.85rem 1.8rem; border-radius:999px; cursor:pointer; transition:all .3s; }
.ghost-btn:hover { border-color:var(--text); transform:translateY(-2px); }
@media (max-width:900px){ .pill-btn { display:none; } }
@media (max-width:760px){
  .nav { top:0; left:0; right:0; transform:none; border-radius:0; border-left:none; border-right:none; border-top:none;
    flex-direction:column; align-items:stretch; gap:0; padding:0; }
  .nav-top { display:flex; align-items:center; justify-content:center; position:relative; padding:0.9rem 1.2rem; }
  .logo { font-size:0.95rem; display:flex; align-items:center; gap:0.8rem; padding:0.35rem 0; }
  .nav > .pill-btn { display:none; }
  .nav > .pill-btn:hover { transform:none; }
  .navlinks { display:none; flex-direction:row; flex-wrap:nowrap; justify-content:space-between; gap:0; border-top:1px solid var(--line); padding:0.7rem 1rem; }
  .navlinks a { padding:0.3rem 0; font-size:0.78rem; white-space:nowrap; }
  .navlinks a::after { display:none; }
  .nav.open .navlinks { display:flex; animation:navDrop .45s cubic-bezier(.16,1,.3,1); }
  .nav.open > .pill-btn { display:block; position:static; align-self:center; margin-top:0.6rem; margin-bottom:0.5rem; font-size:0.78rem; padding:0.55rem 1.2rem; animation:navDrop .45s cubic-bezier(.16,1,.3,1); }
  .nav.open { padding-bottom:0.4rem; }
}
@keyframes navDrop { from { opacity:0; transform:translateY(-12px); } to { opacity:1; transform:none; } }
@media (min-width:761px){ .nav-top { display:contents; } }

.view { animation:viewIn .7s cubic-bezier(.16,1,.3,1); }
@keyframes viewIn { from { opacity:0; transform:translateY(24px); } to { opacity:1; transform:none; } }

.reveal { opacity:0; transform:translateY(34px); transition:opacity .8s cubic-bezier(.16,1,.3,1), transform .8s cubic-bezier(.16,1,.3,1); }
.reveal.in { opacity:1; transform:none; }

.hero { min-height:100vh; display:flex; flex-direction:column; justify-content:center; position:relative; padding:7rem 1.5rem 0;
  border-bottom:1px solid var(--line); }
.hero-inner { max-width:1000px; margin:0 auto; width:100%; }
.kicker { display:inline-block; color:var(--muted); text-transform:uppercase; letter-spacing:0.25em; font-size:0.72rem; font-weight:600; }
.kicker::before { content:"● "; color:var(--accent); font-size:0.6rem; vertical-align:2px; }
.hero-title { font-family:'Space Grotesk'; font-size:clamp(3rem,10vw,7rem); font-weight:700; line-height:1.02; letter-spacing:-0.03em; margin:1.6rem 0; }
.hero-title > div { overflow:hidden; padding-bottom:0.14em; margin-bottom:-0.14em; }
.hero-title span { display:inline-block; }
.grad { font-family:'Instrument Serif',serif; font-style:italic; font-weight:400; color:var(--accent); font-size:1.05em; letter-spacing:0; }
.hero-sub { color:var(--muted); font-size:1.2rem; max-width:560px; line-height:1.6; margin-bottom:2rem; }
.hero-sub strong { color:var(--text); }
.hero-cta { display:flex; gap:1rem; flex-wrap:wrap; margin-bottom:1.6rem; }
.byline { color:var(--muted); font-size:0.85rem; }

.marquee { position:absolute; bottom:0; left:0; right:0; border-top:1px solid var(--line); padding:1rem 0; overflow:hidden; }
.marquee-track { display:flex; width:max-content; animation:marquee 28s linear infinite; }
.marquee:hover .marquee-track { animation-play-state:paused; }
.marquee-group { display:flex; }
.marquee span { font-family:'Space Grotesk'; font-size:0.8rem; letter-spacing:0.25em; color:var(--muted); white-space:nowrap; padding:0 1.6rem; }
.marquee em { color:var(--accent); font-style:normal; }
@keyframes marquee { from { transform:translateX(0); } to { transform:translateX(-50%); } }

.section { max-width:1080px; margin:0 auto; padding:5rem 1.5rem; position:relative; }
.page-head { padding-top:9rem; }
.big-title { font-family:'Space Grotesk'; font-size:clamp(2.2rem,6vw,4.2rem); font-weight:700; letter-spacing:-0.02em; line-height:1.08; margin:1.2rem 0; }
.lead { color:var(--muted); font-size:1.1rem; line-height:1.7; max-width:640px; }
.lead a { color:var(--text); text-decoration-color:var(--accent); text-underline-offset:4px; }
.sub-title { font-family:'Space Grotesk'; font-size:1.4rem; font-weight:700; margin-bottom:1.2rem; }

.two-col { display:grid; gap:2rem; grid-template-columns:1fr 1fr; }
.two-col p { color:var(--muted); line-height:1.75; }
.two-col strong { color:var(--text); }
@media (max-width:760px){ .two-col { grid-template-columns:1fr; } }

.stats-grid { display:grid; gap:1px; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); background:var(--line); border:1px solid var(--line); }
.stat { background:var(--bg); padding:2rem 1.6rem; transition:background .4s; }
.stat:hover { background:var(--card); }
.stat-num { font-family:'Space Grotesk'; font-size:2.8rem; font-weight:700; color:var(--text); transition:color .4s; }
.stat:hover .stat-num { color:var(--accent); }
.stat p { color:var(--muted); font-size:0.9rem; line-height:1.55; margin-top:0.5rem; }

.controls { display:flex; gap:1rem; align-items:center; flex-wrap:wrap; margin-bottom:1.2rem; }
.controls select { background:var(--card); color:var(--text); border:1px solid var(--line); border-radius:999px;
  padding:0.6rem 1.1rem; font-family:inherit; font-size:0.9rem; cursor:pointer; transition:border-color .3s; max-width:100%; }
.controls select:hover { border-color:var(--text); }
.mode-toggle { display:flex; background:var(--card); border:1px solid var(--line); border-radius:999px; padding:4px; }
.mode-toggle button { border:none; background:transparent; color:var(--muted); padding:0.45rem 1.2rem; border-radius:999px;
  cursor:pointer; font-family:inherit; font-weight:600; font-size:0.85rem; transition:all .3s; }
.mode-toggle button.on { background:var(--text); color:#0d0d0c; }
.chart-box { background:var(--card); border:1px solid var(--line); border-radius:8px; padding:1.6rem; height:400px; }

.table-wrap { overflow-x:auto; border:1px solid var(--line); border-radius:8px; }
table { width:100%; border-collapse:collapse; font-size:0.9rem; background:var(--card); }
th, td { padding:0.9rem 1.1rem; text-align:left; border-bottom:1px solid var(--line); white-space:nowrap; }
th { font-family:'Space Grotesk'; color:var(--muted); font-size:0.75rem; letter-spacing:0.1em; text-transform:uppercase; }
tbody tr { transition:background .25s; }
tbody tr:hover { background:var(--card2); }
tbody td { color:var(--muted); transition:color .25s; }
tbody td:first-child { color:var(--text); }
tbody tr:last-child td { border-bottom:none; }
.note { color:var(--muted); line-height:1.7; margin-top:1.4rem; }
.note strong { color:var(--text); }

.challenge-list { display:flex; flex-direction:column; }
.challenge-row { display:grid; grid-template-columns:auto 1fr; gap:2.5rem; align-items:start;
  padding:2.4rem 0.5rem; border-bottom:1px solid var(--line); cursor:default;
  transition:padding .4s cubic-bezier(.16,1,.3,1); }
.challenge-row:first-child { border-top:1px solid var(--line); }
.challenge-row:hover { padding-left:1.6rem; }
.challenge-num { font-family:'Space Grotesk'; font-size:2.6rem; font-weight:700; color:transparent;
  -webkit-text-stroke:1.5px var(--muted); line-height:1; transition:-webkit-text-stroke-color .4s; }
.challenge-row:hover .challenge-num { -webkit-text-stroke-color:var(--accent); }
.challenge-body h3 { font-family:'Space Grotesk'; font-size:1.35rem; margin-bottom:0.5rem; }
.challenge-body p { color:var(--muted); line-height:1.7; max-width:640px; }
@media (max-width:600px){ .challenge-row { grid-template-columns:1fr; gap:0.8rem; } }

.action-card { background:var(--card); border:1px solid var(--line); border-radius:8px; padding:1.8rem; height:100%;
  transition:transform .4s cubic-bezier(.16,1,.3,1), border-color .4s; }
.action-card:hover { transform:translateY(-6px); border-color:var(--muted); }
.tag { display:inline-block; font-size:0.7rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--accent); margin-bottom:1rem; }
.action-card p { color:var(--muted); line-height:1.7; }
.action-card strong { color:var(--text); }

.chip-grid { display:grid; gap:0.9rem; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); }
.chip { display:flex; align-items:center; gap:0.8rem; border-bottom:1px solid var(--line);
  padding:0.9rem 0.2rem; font-size:0.92rem; color:var(--muted); cursor:default;
  transition:transform .35s cubic-bezier(.16,1,.3,1), color .35s, padding .35s; }
.chip:hover { transform:translateX(8px); color:var(--text); }
.chip-dot { width:7px; height:7px; border-radius:50%; background:var(--muted); flex-shrink:0; transition:background .35s, transform .35s; }
.chip:hover .chip-dot { background:var(--accent); transform:scale(1.4); }

.src-rows { display:flex; flex-direction:column; }
.src-row { display:grid; grid-template-columns:auto 1fr auto auto; gap:1.4rem; align-items:center;
  padding:1.4rem 0.5rem; border-bottom:1px solid var(--line); text-decoration:none; cursor:pointer;
  transition:padding .35s cubic-bezier(.16,1,.3,1); }
.src-row:first-child { border-top:1px solid var(--line); }
.src-row:hover { padding-left:1.6rem; }
.src-idx { font-family:'Space Grotesk'; color:var(--muted); font-size:0.85rem; transition:color .3s; }
.src-row:hover .src-idx { color:var(--accent); }
.src-title { font-family:'Space Grotesk'; font-size:1.15rem; font-weight:600; }
.src-host { color:var(--muted); font-size:0.85rem; }
.src-arrow { color:var(--muted); font-size:1.2rem; transition:transform .35s cubic-bezier(.16,1,.3,1), color .35s; }
.src-row:hover .src-arrow { transform:translateX(6px); color:var(--accent); }
@media (max-width:600px){ .src-host { display:none; } }

.sources { display:flex; gap:1.4rem; flex-wrap:wrap; margin-top:1.6rem; }
.sources a { color:var(--text); font-size:0.9rem; text-decoration:none; border-bottom:1px solid var(--line); transition:border-color .3s, color .3s; }
.sources a:hover { border-color:var(--accent); color:var(--accent); }

.footer { border-top:1px solid var(--line); margin-top:2rem; }
.footer-inner { max-width:1080px; margin:0 auto; padding:2.4rem 1.5rem; display:flex; justify-content:space-between;
  align-items:center; flex-wrap:wrap; gap:1rem; }
.footer p { color:var(--muted); font-size:0.85rem; }