:root{
  --azul-arco:#0B57D0; --azul-profundo:#071A38; --azul-frio:#5B9BFF;
  --acero:#8A97A8; --lamina:#EDF1F5; --chispa:#F2B705; --kerf:1px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--azul-profundo);color:var(--lamina);
  font-family:'Archivo',system-ui,sans-serif;font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased}
.wrap{max-width:1080px;margin:0 auto;padding:0 24px}
.mesa{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.45;
  background-image:linear-gradient(rgba(91,155,255,.07) var(--kerf),transparent var(--kerf)),
    linear-gradient(90deg,rgba(91,155,255,.07) var(--kerf),transparent var(--kerf));
  background-size:40px 40px}
main,nav,footer{position:relative;z-index:1}
a{color:var(--azul-frio)}
.mono{font-family:'IBM Plex Mono',monospace}

nav{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 0;
  border-bottom:var(--kerf) solid rgba(138,151,168,.22);flex-wrap:wrap}
.marca{display:flex;align-items:center;gap:10px;font-weight:700;font-size:20px;
  letter-spacing:-.02em;color:#fff;text-decoration:none}
.nav-links{display:flex;gap:20px;align-items:center;font-size:14px}
.nav-links a{color:#C6D2E0;text-decoration:none}
.nav-links a:hover{color:#fff}

.hero{padding:72px 0 60px}
.eyebrow{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--azul-frio);margin:0 0 18px}
h1{font-weight:700;font-size:clamp(34px,5.6vw,60px);line-height:1.04;letter-spacing:-.035em;
  margin:0 0 20px;color:#fff;max-width:18ch}
.lead{font-size:clamp(17px,2vw,20px);max-width:58ch;color:#C6D2E0;margin:0 0 30px}
.acciones{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.btn{display:inline-flex;align-items:center;gap:9px;border:0;cursor:pointer;
  background:var(--azul-arco);color:#fff;font-family:inherit;font-weight:600;font-size:15px;
  padding:14px 24px;border-radius:2px;text-decoration:none;transition:background .15s,transform .15s}
.btn:hover{background:#0946AC;transform:translateY(-1px)}
.btn:focus-visible{outline:2px solid var(--azul-frio);outline-offset:3px}
.btn:disabled{opacity:.45;cursor:not-allowed;transform:none}
.btn.sec{background:transparent;color:var(--azul-frio);box-shadow:inset 0 0 0 var(--kerf) rgba(91,155,255,.5)}
.btn.sec:hover{background:rgba(91,155,255,.08)}

.pulso{display:inline-flex;align-items:center;gap:8px;font-family:'IBM Plex Mono',monospace;
  font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--acero)}
.led{width:7px;height:7px;border-radius:50%;background:var(--acero)}
.led.ok{background:#4ADE80;box-shadow:0 0 0 3px rgba(74,222,128,.18)}
.led.mal{background:#F87171}

section{padding:60px 0;border-top:var(--kerf) solid rgba(138,151,168,.22)}
h2{font-size:clamp(23px,3vw,31px);font-weight:600;letter-spacing:-.02em;color:#fff;margin:0 0 10px}
h3{font-size:17px;color:#fff;font-weight:600;margin:0 0 8px}
.sub{color:#C6D2E0;max-width:60ch;margin:0 0 32px}
p{max-width:66ch}

.pasos{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:2px}
.paso{background:rgba(91,155,255,.05);border:var(--kerf) solid rgba(91,155,255,.16);padding:24px}
.paso .n{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.14em;
  color:var(--azul-frio);display:block;margin-bottom:12px}
.paso p{margin:0;font-size:14px;color:#B3C2D4}

table{width:100%;border-collapse:collapse;font-size:15px}
th,td{text-align:left;padding:12px;border-bottom:var(--kerf) solid rgba(138,151,168,.22)}
th{font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--acero);font-weight:600}
td.esp{font-family:'IBM Plex Mono',monospace;color:var(--azul-frio)}
.nota{font-size:13px;color:var(--acero);margin-top:16px;max-width:64ch}

ul.reglas{list-style:none;padding:0;margin:0;max-width:70ch}
ul.reglas li{border-bottom:var(--kerf) solid rgba(138,151,168,.22);padding:14px 0 14px 28px;
  position:relative;color:#C6D2E0;font-size:15px}
ul.reglas li::before{content:"\2014";position:absolute;left:0;color:var(--azul-frio)}
ul.reglas b{color:#fff;font-weight:600}
ul.reglas .med{font-family:'IBM Plex Mono',monospace;color:var(--azul-frio)}

.aviso{display:flex;gap:12px;padding:14px 16px;border-radius:2px;margin-top:24px;
  background:rgba(242,183,5,.1);border-left:3px solid var(--chispa);font-size:14px;
  max-width:64ch;color:#E6DCC0}
.aviso.info{background:rgba(91,155,255,.09);border-left-color:var(--azul-frio);color:#C9DBF5}

.ciudades{display:flex;flex-wrap:wrap;gap:2px;margin-top:8px}
.ciudades a{background:rgba(91,155,255,.06);border:var(--kerf) solid rgba(91,155,255,.16);
  padding:10px 16px;text-decoration:none;color:#C6D2E0;font-size:14px}
.ciudades a:hover{background:rgba(91,155,255,.13);color:#fff}

/* ---------- cotizador ---------- */
.panel{background:var(--lamina);color:var(--azul-profundo);padding:30px;border-radius:2px;max-width:720px}
.zona{border:2px dashed #B3C2D4;border-radius:2px;padding:40px 24px;text-align:center;
  cursor:pointer;transition:border-color .15s,background .15s;background:#fff}
.zona:hover,.zona.activa{border-color:var(--azul-arco);background:rgba(11,87,208,.04)}
.zona p{margin:0;max-width:none}
.zona .grande{font-weight:600;font-size:17px;margin-bottom:6px;display:block}
.zona .chico{font-size:13px;color:#5A6878}
.campos{display:grid;grid-template-columns:1fr 1fr auto;gap:14px;margin-top:22px}
.campo label{display:block;font-family:'IBM Plex Mono',monospace;font-size:10px;
  letter-spacing:.12em;text-transform:uppercase;color:#5A6878;margin-bottom:6px}
.campo select,.campo input{width:100%;padding:11px 12px;font-family:inherit;font-size:15px;
  border:var(--kerf) solid #C4CEDA;border-radius:2px;background:#fff;color:var(--azul-profundo)}
.campo select:focus,.campo input:focus{outline:2px solid var(--azul-arco);outline-offset:1px}
#resultado{margin-top:24px}
.geo{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:14px;
  padding:16px 0;border-top:var(--kerf) solid #C4CEDA;border-bottom:var(--kerf) solid #C4CEDA}
.geo div span{display:block;font-family:'IBM Plex Mono',monospace;font-size:10px;
  letter-spacing:.1em;text-transform:uppercase;color:#5A6878;margin-bottom:3px}
.geo div b{font-family:'IBM Plex Mono',monospace;font-size:17px;font-weight:600}
.precio-row{display:flex;justify-content:space-between;font-size:14px;padding:5px 0;color:#4A5666}
.precio-row span:last-child{font-family:'IBM Plex Mono',monospace}
.precio-row.total{font-size:25px;font-weight:700;color:var(--azul-profundo);
  border-top:var(--kerf) solid #C4CEDA;margin-top:10px;padding-top:13px}
.hallazgo{display:flex;gap:11px;padding:13px 15px;border-radius:2px;margin-bottom:8px;font-size:14px}
.hallazgo.error{background:rgba(220,60,60,.09);border-left:3px solid #C4342F;color:#7A211D}
.hallazgo.advertencia{background:rgba(242,183,5,.14);border-left:3px solid var(--chispa);color:#6B5200}
.hallazgo code{font-family:'IBM Plex Mono',monospace;font-size:11px;display:block;
  letter-spacing:.06em;opacity:.7;margin-bottom:2px}

footer{padding:44px 0 60px;border-top:var(--kerf) solid rgba(138,151,168,.22);
  font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--acero);display:flex;flex-wrap:wrap;gap:14px;justify-content:space-between}

@media (max-width:700px){
  section{padding:46px 0}.hero{padding:48px 0 44px}
  .campos{grid-template-columns:1fr}
  .nav-links{font-size:13px;gap:14px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}