:root{
  --bg:#050507; --panel:#0b0b0e; --line:rgba(255,255,255,.07); --line2:rgba(255,255,255,.13);
  --text:#f2f0ee; --mute:#8e8b87; --dim:#837f77; --flame:#ff6a2b;
  --disp:'Archivo',system-ui,sans-serif; --sans:'IBM Plex Sans',system-ui,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,monospace;
  color-scheme:dark;
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{overflow-x:clip;scrollbar-gutter:stable}
body{background:var(--bg);color:var(--text);font-family:var(--sans);font-weight:300;
  font-size:17px;line-height:1.68;-webkit-font-smoothing:antialiased;overflow-x:clip}
::selection{background:var(--flame);color:#000}
.wrap{max-width:760px;margin:0 auto;padding:0 24px}

nav{border-bottom:1px solid var(--line);background:rgba(5,5,7,.92)}
nav .wrap{display:flex;align-items:center;justify-content:space-between;height:72px;max-width:1240px;padding:0 32px}
.logo{font-family:var(--mono);font-size:13px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--text);text-decoration:none;display:flex;align-items:center;gap:9px;min-height:44px}
.logo .sl{color:var(--flame);font-weight:500}
.back{font-family:var(--mono);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--mute);text-decoration:none;display:inline-flex;align-items:center;min-height:44px}
.back:hover{color:var(--text)}

header{padding:76px 0 0}
.kick{font-family:var(--mono);font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;
  color:var(--flame);margin-bottom:20px;display:flex;align-items:center;gap:14px}
.kick::after{content:"";flex:0 0 56px;height:1px;background:linear-gradient(90deg,rgba(255,106,43,.5),transparent)}
h1{font-family:var(--disp);font-weight:800;font-size:clamp(2rem,5vw,2.9rem);
  line-height:1.05;letter-spacing:-.038em;margin-bottom:18px}
.updated{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
.lede{color:var(--mute);font-size:1.05rem;margin-top:26px;padding-top:26px;border-top:1px solid var(--line)}

main{padding:14px 0 90px}
section{margin-top:46px}
h2{font-family:var(--disp);font-weight:700;font-size:1.28rem;letter-spacing:-.025em;margin-bottom:14px}
h2 .n{font-family:var(--mono);font-size:.72em;font-weight:400;color:var(--flame);margin-right:12px;letter-spacing:.08em}
p{margin-bottom:14px;color:var(--mute)}
p strong{color:var(--text);font-weight:500}
ul{list-style:none;margin:0 0 14px}
li{color:var(--mute);padding:7px 0 7px 24px;position:relative}
li::before{content:"—";position:absolute;left:0;color:var(--dim)}
li strong{color:var(--text);font-weight:500}
main a, .box a{color:var(--flame);text-decoration:none;border-bottom:1px solid rgba(255,106,43,.3)}
main a:hover, .box a:hover{border-bottom-color:var(--flame)}
a{color:var(--flame);text-decoration:none}
nav a, footer a, .cta{border-bottom:0}
.box{background:var(--panel);border:1px solid var(--line2);border-radius:5px;padding:26px 24px;margin:22px 0}
.box p:last-child{margin-bottom:0}
.box .h{font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--flame);margin-bottom:12px}

footer{border-top:1px solid var(--line);padding:34px 0;font-family:var(--mono);font-size:11px;
  letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
footer .wrap{display:flex;flex-wrap:wrap;gap:18px;justify-content:space-between;max-width:1240px}
footer a{color:var(--dim);border:0}
footer a:hover{color:var(--text)}

@media(max-width:760px){
  body{font-size:16px}
  nav .wrap{padding:0 22px}
  header{padding-top:52px}
  section{margin-top:38px}
  main{padding-bottom:64px}
}

/* ---------- richer page components ---------- */
.hero-line{font-family:var(--disp);font-weight:700;font-size:clamp(1.3rem,3vw,1.7rem);
  line-height:1.32;letter-spacing:-.025em;color:var(--text);margin:34px 0;
  border-left:3px solid var(--flame);padding:4px 0 4px 22px}
.figures{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(190px,100%),1fr));
  gap:1px;background:var(--line);border:1px solid var(--line);border-radius:5px;
  overflow:hidden;margin:30px 0}
.fig{background:var(--panel);padding:24px 22px}
.fig .v{font-family:var(--disp);font-weight:800;font-size:1.85rem;letter-spacing:-.04em;
  line-height:1;color:var(--text)}
.fig .l{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--dim);margin-top:9px;line-height:1.5}
.split{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr));gap:14px;margin:24px 0}
.card{background:var(--panel);border:1px solid var(--line);border-radius:5px;padding:24px 22px}
.card h3{font-family:var(--disp);font-weight:700;font-size:1.02rem;letter-spacing:-.02em;
  color:var(--text);margin-bottom:9px}
.card p{font-size:.94rem;margin-bottom:0}
.card .n{font-family:var(--mono);font-size:10px;letter-spacing:.16em;color:var(--flame);margin-bottom:12px}
.rulebox{border-top:1px solid var(--line);padding-top:22px;margin-top:26px}
.rulebox h3{font-family:var(--disp);font-weight:700;font-size:1.05rem;letter-spacing:-.02em;
  color:var(--text);margin-bottom:8px}
.stamp{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--flame);margin-bottom:10px}
.cta{display:inline-block;font-family:var(--mono);font-size:12px;letter-spacing:.11em;
  text-transform:uppercase;text-decoration:none;padding:16px 28px;border-radius:3px;
  background:var(--text);color:#000;border:0;margin-top:8px}
.cta:hover{background:var(--flame);color:#fff;border-bottom:0}
.entry{border-left:1px solid var(--line);padding:0 0 30px 26px;position:relative;margin-left:4px}
.entry::before{content:"";position:absolute;left:-4.5px;top:7px;width:8px;height:8px;
  border-radius:50%;background:var(--flame)}
.entry:last-child{padding-bottom:0}
.entry .when{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--dim);margin-bottom:8px}
.entry h3{font-family:var(--disp);font-weight:700;font-size:1.05rem;letter-spacing:-.02em;
  color:var(--text);margin-bottom:8px}
@media(max-width:760px){
  .fig .v{font-size:1.6rem}
  .hero-line{padding-left:18px;margin:28px 0}
}

.navright{display:flex;align-items:center;gap:22px}
.navlink{font-family:var(--mono);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--mute);text-decoration:none;display:inline-flex;align-items:center;min-height:44px}
.navlink:hover{color:var(--text)}
.navlink[aria-current="page"]{color:var(--text);box-shadow:inset 0 -1px 0 var(--flame)}
.navright .back{color:#fff;background:var(--flame);padding:10px 17px;border-radius:3px;font-size:11px;letter-spacing:.1em}
.navright .back:hover{background:#ff7d45}
@media(max-width:900px){.navlink{display:none}}
