/* stopperroflautas.es — estilos. Fuentes autoalojadas (OFL). Sin dependencias externas. */
@font-face{font-family:"Barlow Condensed";font-weight:600;font-display:swap;src:url(barlow-condensed-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Barlow Condensed";font-weight:700;font-display:swap;src:url(barlow-condensed-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"Barlow Condensed";font-weight:800;font-display:swap;src:url(barlow-condensed-latin-800-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-weight:400;font-display:swap;src:url(ibm-plex-sans-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-weight:600;font-display:swap;src:url(ibm-plex-sans-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-weight:500;font-display:swap;src:url(ibm-plex-mono-latin-500-normal.woff2) format("woff2")}

:root{
  --bg:#0b0d10;--bg2:#12161b;--bg3:#1a2027;--line:#2a323b;
  --fg:#f4f5f6;--mut:#a9b2bc;
  --red:#f70413;--red-d:#c4000e;--green:#3ddc84;--amber:#ffb020;--blue:#5aa9ff;
  --der:#63be21;--izq:#e5484d;--otros:#8b95a1;
  --f-h:"Barlow Condensed","Arial Narrow",Impact,sans-serif;
  --f-b:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --f-m:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);font:400 1rem/1.6 var(--f-b);padding-inline:0}
img{max-width:100%;height:auto}
a{color:var(--fg)}
a:hover{color:var(--red)}
:focus-visible{outline:3px solid var(--amber);outline-offset:2px;border-radius:4px}
.skip{position:absolute;left:-999px;top:0;background:var(--amber);color:#000;padding:.6rem 1rem;z-index:100}
.skip:focus{left:8px;top:8px}
.wrap{width:min(1120px,100%);margin-inline:auto;padding-inline:max(16px,4vw)}
h1,h2,h3{font-family:var(--f-h);font-weight:800;line-height:1.02;text-transform:uppercase;letter-spacing:.01em;margin:0 0 .5em;text-wrap:balance}
h1{font-size:clamp(2.6rem,7vw,5.2rem)}
h2{font-size:clamp(2rem,4.6vw,3.4rem)}
h3{font-size:1.45rem;font-weight:700}
p{margin:0 0 1em;max-width:68ch}
.eyebrow{font:600 .85rem/1 var(--f-h);letter-spacing:.2em;text-transform:uppercase;color:var(--red);margin-bottom:1rem;display:block;font-size:1rem}
.mut{color:var(--mut)}
.num{font-family:var(--f-m);font-variant-numeric:tabular-nums}

/* topbar */
.top{position:fixed;inset:0 0 auto 0;z-index:50;background:rgba(11,13,16,.88);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);padding-top:env(safe-area-inset-top,0px)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;height:56px}
.brand{display:flex;align-items:center;gap:.7rem;text-decoration:none}
.brand img{width:36px;height:36px;border-radius:50%}
.brand b{font:800 1.25rem var(--f-h);letter-spacing:.04em;text-transform:uppercase}
.brand b i{color:var(--red);font-style:normal}
.top nav{display:flex;gap:1.2rem}
.top nav a{font:600 1rem var(--f-h);letter-spacing:.1em;text-transform:uppercase;text-decoration:none;color:var(--mut)}
.top nav a:hover{color:var(--fg)}
@media(max-width:760px){.top nav{display:none}}

/* diapositivas */
main{scroll-snap-type:y proximity}
.slide{min-height:100svh;scroll-snap-align:start;display:flex;align-items:center;padding-block:96px 64px;position:relative;border-bottom:1px solid var(--line)}
.slide>.wrap{width:100%}
.slide:nth-child(even){background:var(--bg2)}
.dots{position:fixed;right:14px;top:50%;transform:translateY(-50%);z-index:40;display:flex;flex-direction:column;gap:10px}
.dots a{width:11px;height:11px;border-radius:50%;border:2px solid var(--mut);display:block;background:transparent}
.dots a.on{background:var(--red);border-color:var(--red)}
@media(max-width:900px){.dots{display:none}}
.counter{position:fixed;left:16px;bottom:calc(14px + env(safe-area-inset-bottom,0px));font:500 .8rem var(--f-m);color:var(--mut);z-index:40;background:rgba(11,13,16,.8);padding:4px 8px;border-radius:6px}

/* portada */
.hero{background:radial-gradient(900px 500px at 78% 40%,rgba(247,4,19,.22),transparent 60%),var(--bg)!important}
.hero .wrap{display:grid;grid-template-columns:1.15fr .85fr;gap:3rem;align-items:center}
.hero .lead{font-size:1.2rem;color:#dfe3e7}
.hero-img{justify-self:center;position:relative}
.hero-img img{width:min(440px,78vw);border-radius:50%;display:block;box-shadow:0 0 0 6px rgba(247,4,19,.18),0 30px 80px rgba(247,4,19,.28)}
.wordmark{width:min(560px,100%);margin-bottom:1.4rem;display:block}
@media(max-width:860px){.hero .wrap{grid-template-columns:1fr}.hero-img{order:-1}.hero-img img{width:min(260px,64vw)}}
.btns{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.4rem}
.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.9rem 1.5rem;border-radius:10px;background:var(--red);color:#fff;text-decoration:none;font:700 1.15rem var(--f-h);letter-spacing:.08em;text-transform:uppercase;border:2px solid var(--red);cursor:pointer}
.btn:hover{background:var(--red-d);border-color:var(--red-d);color:#fff}
.btn.ghost{background:transparent;color:var(--fg);border-color:var(--line)}
.btn.ghost:hover{border-color:var(--fg);background:transparent;color:var(--fg)}
.pill{display:inline-block;font:600 .8rem var(--f-m);padding:.25rem .6rem;border:1px solid var(--line);border-radius:99px;color:var(--mut)}

/* rejillas y tarjetas */
.grid{display:grid;gap:1.2rem}
.g3{grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
.g2{grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr))}
.card{background:var(--bg3);border:1px solid var(--line);border-radius:14px;padding:1.4rem;min-width:0}
.card .big{font:800 3.2rem/1 var(--f-h);color:var(--red)}
.step{counter-increment:s}
.step::before{content:counter(s);font:800 2.6rem/1 var(--f-h);color:var(--red);display:block;margin-bottom:.4rem}
.steps{counter-reset:s}

/* calculadora */
.ctrl{display:flex;flex-wrap:wrap;gap:.8rem;align-items:end;margin-bottom:1.2rem}
label{font:600 .85rem var(--f-h);letter-spacing:.14em;text-transform:uppercase;color:var(--mut);display:block;margin-bottom:.3rem;font-size:.95rem}
select,input[type=number]{background:var(--bg);color:var(--fg);border:1px solid var(--line);border-radius:10px;padding:.7rem .9rem;font:1rem var(--f-b);min-width:min(100%,260px)}
.seg{display:flex;flex-wrap:wrap;gap:6px}
.seg button{background:var(--bg);color:var(--fg);border:1px solid var(--line);border-radius:10px;padding:.65rem .9rem;font:600 1rem var(--f-h);letter-spacing:.06em;text-transform:uppercase;cursor:pointer}
.seg button[aria-pressed=true]{background:var(--red);border-color:var(--red)}
.verdict{border-radius:14px;padding:1.2rem 1.4rem;border:1px solid var(--line);border-left:6px solid var(--mut);background:var(--bg3);margin-bottom:1rem}
.verdict h3{margin-bottom:.3rem}
.verdict.seguro{border-left-color:var(--green)}.verdict.riesgo{border-left-color:var(--amber)}
.verdict.cerca{border-left-color:var(--red)}.verdict.alcanzable{border-left-color:var(--amber)}.verdict.lejos{border-left-color:var(--otros)}
.stat{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:.8rem;margin-bottom:1rem}
.stat div{background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:.7rem .9rem}
.stat b{display:block;font:800 1.9rem/1 var(--f-h)}
.stat small{color:var(--mut);font-size:.8rem}
.tw{overflow-x:auto;border:1px solid var(--line);border-radius:12px}
table{border-collapse:collapse;width:100%;font-size:.92rem}
th,td{padding:.5rem .7rem;text-align:left;border-bottom:1px solid var(--line);white-space:nowrap}
th{font:600 .85rem var(--f-h);letter-spacing:.12em;text-transform:uppercase;color:var(--mut);background:var(--bg)}
tr.won td{background:rgba(61,220,132,.06)}
tr.cut td{border-bottom:2px dashed var(--red)}
.chip{display:inline-block;padding:.1rem .55rem;border-radius:6px;font:600 .85rem var(--f-m)}
.bar{display:flex;height:22px;border-radius:6px;overflow:hidden;background:var(--bg);margin:.4rem 0 .2rem}
.bar i{display:block;min-width:2px}
.legend{display:flex;flex-wrap:wrap;gap:.8rem;font-size:.85rem;color:var(--mut)}

/* simulador */
.sl{display:grid;grid-template-columns:90px 1fr 70px;gap:.6rem;align-items:center;margin:.4rem 0}
.sl span{font:600 1rem var(--f-h);letter-spacing:.08em;text-transform:uppercase}
input[type=range]{width:100%;accent-color:var(--red)}
.seats{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1rem}
.seats div{flex:1 1 90px;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:.6rem .8rem}
.seats b{display:block;font:800 2rem/1 var(--f-h)}


/* mapa de provincias */
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.5rem}
.pbtn{text-align:left;background:var(--bg3);border:1px solid var(--line);color:var(--fg);border-radius:10px;padding:.55rem .7rem;cursor:pointer;font:400 .9rem var(--f-b);border-left-width:5px;min-width:0}
.pbtn small{display:block;color:var(--mut)}
.pbtn.seguro{border-left-color:var(--green)}.pbtn.riesgo{border-left-color:var(--amber)}.pbtn.cerca{border-left-color:var(--red)}
.pbtn.alcanzable{border-left-color:var(--amber)}.pbtn.lejos,.pbtn.nodata{border-left-color:var(--otros)}
.pbtn:hover{border-color:var(--fg)}

/* fases / banner */
.phase{background:var(--amber);color:#000;padding:.7rem 0;font-weight:600;margin-top:56px;display:none}
.phase.on{display:block}
body.noaction .cta{display:none}

/* texto legal */
.legal{padding-block:96px 64px}
.legal h1{font-size:clamp(2.2rem,5vw,3.6rem)}
.legal h2{font-size:1.8rem;margin-top:2rem}
.legal li{margin-bottom:.4rem;max-width:68ch}
.legal table td,.legal table th{white-space:normal;vertical-align:top}
.ph{background:#ffe08a;color:#000;padding:0 .3em;border-radius:3px;font-family:var(--f-m);font-size:.9em}

footer{background:#07090b;padding-block:2.5rem 3rem;color:var(--mut);font-size:.9rem}
footer .wrap{display:grid;gap:1.2rem}
footer nav{display:flex;flex-wrap:wrap;gap:1rem}
footer small{display:block;max-width:90ch}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
@media print{.top,.dots,.counter{display:none}.slide{min-height:0;break-inside:avoid}}