/* Piel «web» de Hosteate (oct-2026): la web pública y las pantallas de acceso con el
   MISMO lenguaje que el panel (assets/css/v4-app.css).
   Ruben, 4-oct: «la tipografía etc también estilo ChatGPT» · «fondo fullblack» ·
   «un poco de color en los botones, es demasiado tecnológico, no entiendo bien las cosas».

   Va la ÚLTIMA: la cargan v4_cabeza() (app/v4.php), la home (index.php) y las pantallas
   de entrada del admin (admin_head con 'acceso'). No la carga el panel con sesión, que
   tiene la suya. Encima de estilo-v4.css y de la hoja de cada página, que siguen siendo
   la estructura (rejillas, posiciones, lienzos); aquí sólo la piel:
   · Inter para todo; titulares en sentence case, peso 600 y tracking -0.03em;
   · etiquetas en texto normal gris (la mono queda para datos técnicos reales);
   · superficies #141414/#1f1f1f redondeadas y separadas, en vez de rejillas de 1 px;
   · botones en píldora: azul = lo que se pulsa, gris = lo secundario;
   · color sólo donde dice algo: verde bien, ámbar pendiente, rojo mal. */

@font-face{font-family:"Inter";src:url("../fuentes/inter.woff2") format("woff2");font-weight:100 900;font-display:swap}

/* ── 1. Tokens ─────────────────────────────────────── */
:root{
  --fondo:#000000;
  --fondo-2:#141414;
  --fondo-3:#1f1f1f;
  --sup:#141414;
  --sup-2:#1a1a1a;
  --sup-3:#1f1f1f;
  --tinta:#ececec;
  --tinta-2:#b4b4b4;
  --tinta-3:#8e8e8e;
  --linea:#222222;
  --linea-2:#2c2c2c;
  --inv:#3b5bff; --inv-t:#ffffff;
  --rgb:236,236,236;
  --acento-rgb:124,147,255;           /* el azul de los lienzos (hosteate-v4.js) */
  --azul:#3b5bff; --azul-h:#5571ff; --azul-claro:#7c93ff; --azul-tx:#b3c0ff;
  --verde:#22c55e; --verde-tx:#4ade80; --ambar:#f59e0b; --ambar-tx:#fbbf24; --rojo:#ef4444; --rojo-tx:#f87171;
  --verde-f:rgba(34,197,94,.12); --ambar-f:rgba(245,158,11,.12); --rojo-f:rgba(239,68,68,.12); --azul-f:rgba(59,91,255,.14);
  --r-gran:24px; --r-tarjeta:20px; --r-caja:16px; --r-campo:12px;
  --mono-real:"JetBrains Mono",ui-monospace,Menlo,monospace;
  --disp:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;   /* las etiquetas «mono» pasan a texto normal */
  color-scheme:dark;
}
body{background:#000;color:var(--tinta);font:400 16px/1.6 var(--disp);font-feature-settings:"cv11","ss01";transition:none}
::selection{background:rgba(59,91,255,.4)}
:focus-visible{outline:2px solid var(--azul-claro);outline-offset:3px}

/* Fuera las MAYÚSCULAS con tracking: decenas de reglas en las hojas de cada página.
   La única forma de cubrirlas todas (también las que aún no existen) es ésta. */
*,*::before,*::after{text-transform:none!important;letter-spacing:normal!important}
:is(h1,h2,h3,.logo,.cifra b,.num,.lect b,.dd-cifra b,.grande-n,.dial-nom,.ubi .ms,.selector .ms,.c-plan b,.c-precio b,.so .cod,.dm-tabla .ext,.dm-tabla .num,.gfila .gprecio b,.co-proto b,.precio-esq b,.grandes a,.hs-op .ms b,.cita,.palabra-pie,.pregs summary){letter-spacing:-.02em!important}
:is(.hero h1,.cab h2,.red-tx h2,.donde-tx h2,.faq-tit h2,.cierre h2,.legal-hero h1,.gran h3,.dial-nom,.acceso-caja h1,.acceso-vis .cita,.cifra b,.num,.lect b,.dd-cifra b,.grande-n,.palabra-pie,.dm-tabla .ext){letter-spacing:-.03em!important}

/* La mono, sólo para datos técnicos de verdad */
code,kbd,samp,pre,.terminal,.mini-term,.arec-cuenta,.mono{font-family:var(--mono-real)}
.eventos td:nth-child(2){font-family:var(--mono-real)}   /* IPs del registro anti-DDoS */
.ascii pre{font-family:var(--mono-real)!important}

/* Etiquetas (.ojo) → texto normal gris, sin punto */
.ojo{font:500 14px/1.3 var(--disp);color:var(--tinta-3);gap:8px}
.ojo::before{content:none}
.gris,.tenue{color:var(--tinta-3)}

/* ── 2. Botones: píldora con color ─────────────────── */
.btn{height:44px;padding:0 20px;gap:8px;border-radius:999px;border:1px solid transparent;background:var(--sup-3);color:var(--tinta);font:500 15px/1 var(--disp);justify-content:center;transition:background .15s,border-color .15s,color .15s,box-shadow .15s}
.btn:hover{background:#2a2a2a;border-color:transparent}
.btn:has(.fl){padding-right:17px}
.btn .fl,.btn.lleno .fl,.btn.chico .fl{width:auto;height:auto;background:transparent;color:inherit;opacity:.9}
.btn .fl svg{width:15px;height:15px;stroke-width:2}
.btn.chico{height:38px;font-size:14px;padding:0 16px;gap:7px}
.btn.chico:has(.fl){padding-right:14px}
.btn.lleno,.btn.azul{background:var(--azul);border-color:var(--azul);color:#fff;opacity:1}
.btn.lleno:hover,.btn.azul:hover{background:var(--azul-h);border-color:var(--azul-h);opacity:1}
.btn.fantasma{background:transparent;border-color:var(--linea-2);color:var(--tinta)}
.btn.fantasma:hover{background:var(--sup-3)}
:is(.ctas,.plan,.c-btn,.dm-tabla .ir,.gfila,.dial-btn,.acceso-caja,.login-reenviar) .btn{justify-content:center}

/* ── 3. Barra y menú ───────────────────────────────── */
.barra{background:rgba(0,0,0,.82);-webkit-backdrop-filter:blur(16px) saturate(1.3);backdrop-filter:blur(16px) saturate(1.3)}
.barra.borde{border-bottom-color:#1a1a1a}
.logo{font:600 19px/1 var(--disp)}
.menu{gap:2px}
.menu a{padding:9px 14px;border-radius:999px;font:400 15px/1 var(--disp);color:var(--tinta-2);transition:background .15s,color .15s}
.menu a:hover{background:#141414;color:var(--tinta)}
.menu a.activa{background:var(--sup-3);color:var(--tinta);font-weight:500}
.ib{border-radius:999px}
.ib:hover{background:var(--sup-3);color:var(--tinta)}
.acciones{gap:8px}
.barra .acceder{height:38px}
@media (max-width:1000px){
  .menu.abierto{background:#000;border-bottom:1px solid #1a1a1a;gap:2px;padding:10px var(--pad) 18px}
  .menu.abierto a{font:500 18px/1.2 var(--disp);padding:14px 14px;border-bottom:0;border-radius:14px;color:var(--tinta)}
  .menu.abierto a:hover,.menu.abierto a.activa{background:var(--sup)}
}

/* Banderas: una píldora con las dos */
.idiomas{border:0;background:var(--sup);border-radius:999px;padding:3px;gap:2px;margin-right:0}
.idi{height:30px;padding:0 10px;border-radius:999px;font:600 12.5px/1 var(--disp);color:var(--tinta-3)}
.idi+.idi{border-left:0}
.idi svg{border-radius:3px}
.idi.activo{background:#2a2a2a;color:var(--tinta)}

/* ── 4. Hero ───────────────────────────────────────── */
.hero h1{font:600 clamp(40px,5.8vw,82px)/1.06 var(--disp);max-width:15em}
.hero h1 .l{display:inline-block;vertical-align:top;padding-bottom:.08em;margin-right:.24em}
.hero h1 .hueco,.cierre h2 .hueco,.acceso-vis .cita .hueco{-webkit-text-stroke:0;color:transparent;background:linear-gradient(90deg,#6f86ff,#b3c0ff);-webkit-background-clip:text;background-clip:text}
.hero h1 .tenue{color:var(--tinta-3)}
.hero::after{height:30%}
.chip-fila{padding-left:110px;font-size:16px;color:var(--tinta-2)}
.chip-fila .k{top:2px;width:96px;padding:0;height:27px;line-height:27px;border:0;border-radius:999px;background:var(--azul-f);color:var(--azul-tx);font:500 13px/27px var(--disp)}
.hero .letra{font:400 14px/1.5 var(--disp);color:var(--tinta-3)}
.cinta-h{border:0}
.cinta-h .t{font-size:15px}
@media (max-width:560px){
  .hero h1{font-size:clamp(36px,10vw,46px)}
  .chip-fila{font-size:15px;padding-left:100px}
  .chip-fila .k{width:88px}
}

/* ── 5. Cifras ─────────────────────────────────────── */
.cifras{gap:12px;border:0}
.cifras .cifra{border:0;border-radius:var(--r-tarjeta);background:var(--sup);padding:26px 26px 22px}
.cifra b{font:600 clamp(34px,3.6vw,48px)/1 var(--disp)}
.cifra b small{color:var(--tinta-3);font-weight:500}
.cifra>span{font:400 14.5px/1.4 var(--disp);color:var(--tinta-2);margin-top:10px}

/* ── 6. Cabeceras de sección ───────────────────────── */
.cab h2,.red-tx h2,.donde-tx h2,.faq-tit h2{font:600 clamp(30px,3.6vw,48px)/1.1 var(--disp);margin-top:14px}
.cab p,.red-tx p,.faq-tit p{font-size:17px;line-height:1.6;color:var(--tinta-2)}
:is(.cab,.red-tx,.donde-tx,.faq-tit) h2 :is(.tenue,.gris){color:var(--tinta-3)}

/* ── 7. Bento ──────────────────────────────────────── */
.bento{gap:12px;background:transparent;border:0}
.celda{background:var(--sup);border-radius:var(--r-gran)}
.celda.con-foto{background:#0a0a0a}
.celda h3{font:600 clamp(21px,1.9vw,26px)/1.2 var(--disp);margin-top:10px}
.celda p{font-size:15.5px;line-height:1.55}
.celda .grande-n{font:600 clamp(60px,6.4vw,92px)/.95 var(--disp);color:var(--azul-claro)}
.celda .grande-n small{font-weight:500;color:var(--tinta-3)}
.celda.con-foto .ojo{color:rgba(236,236,236,.7)}
.puntos{background-image:none}
.foco::after{background:radial-gradient(420px circle at var(--mx) var(--my),rgba(var(--acento-rgb),.10),transparent 60%)}

/* ── 8. Red: globo ─────────────────────────────────── */
.red{gap:12px;border:0}
.red .red-tx{border:0;border-radius:var(--r-gran);background:var(--sup)}
.red-vis{border-radius:var(--r-gran);background:radial-gradient(70% 70% at 50% 50%,#141414,#070707)}
.ubis{gap:8px;background:transparent;border:0}
.ubi{background:var(--sup-3);border-radius:var(--r-caja);padding:16px 18px}
.ubi .cod,.selector .cod,.hs-op .cod{border:0;border-radius:999px;background:#2a2a2a;color:var(--tinta);font:600 12.5px/1 var(--disp);padding:8px 11px}
.ubi b{font-weight:600;font-size:17px}
.ubi .ms{font:600 24px/1 var(--disp)}
.ubi .ms i,.selector .ms i{font:400 12.5px/1.2 var(--disp);color:var(--tinta-3)}
.marca-esq,.red-vis .marca-esq,.donde-vis .marca-esq{font:500 12.5px/1 var(--disp);color:var(--tinta-3)}
.donde-vis .marca-esq{color:rgba(236,236,236,.7)}

/* ── 9. Anti-DDoS ──────────────────────────────────── */
.dd{border:0;border-radius:var(--r-gran);background:#070707}
.dd-escena{background:radial-gradient(90% 70% at 42% 46%,#161616,#050505 72%)}
.dd-hud{font:500 13px/1.2 var(--disp);color:var(--tinta-3)}
.dd-esq{display:none}
.dd-top .vivo b,.dd-ruta b{color:var(--tinta);font-weight:600}
.dd-ilus{border:0;border-radius:999px;padding:7px 12px;background:rgba(31,31,31,.85);color:var(--tinta-2)}
.vivo::before{background:var(--verde);box-shadow:0 0 0 0 rgba(34,197,94,.5);animation:latido-v 1.6s infinite}
@keyframes latido-v{0%{box-shadow:0 0 0 0 rgba(34,197,94,.45)}70%{box-shadow:0 0 0 8px rgba(34,197,94,0)}100%{box-shadow:0 0 0 0 rgba(34,197,94,0)}}
.dd-ley i{height:2px;border-radius:2px;background:var(--tinta-3)}
.dd-ley i.l{background:var(--azul-claro);box-shadow:0 0 8px rgba(124,147,255,.8)}
.dd-cifras{border-top:0;background:rgba(10,10,10,.72);gap:0}
.dd-cifra{border-right:1px solid rgba(255,255,255,.06)}
.dd-cifra .et{font:500 13px/1.25 var(--disp);color:var(--tinta-2)}
.dd-cifra .sub{font:400 12.5px/1.25 var(--disp);color:var(--tinta-3);opacity:1}
.dd-cifra b{font:600 clamp(28px,2.8vw,40px)/1 var(--disp)}
.dd-cifra:nth-child(3) b{color:var(--verde-tx)}
@media (max-width:860px){
  .dd-cifras{gap:8px;padding:8px;background:#070707}
  .dd .dd-cifra{border:0;border-radius:var(--r-caja);background:var(--sup)}
  .dd-ruta{font-size:12.5px}
}
@media (max-width:420px){
  .dd-hud{font-size:12px}
  .dd-cifra .et{font-size:12.5px}
}
/* Registro de eventos: tarjeta aparte, estados con color */
.eventos{margin-top:12px;border:0;border-radius:var(--r-tarjeta);background:var(--sup)}
.dd-evcab,.consola-cab{border-bottom:1px solid var(--linea);font:500 14px/1.3 var(--disp);color:var(--tinta-3)}
.dd-evcab span:first-child,.consola-cab>span:first-child{color:var(--tinta)}
.eventos table{font:400 14px/1.3 var(--disp);font-variant-numeric:tabular-nums}
.eventos td:nth-child(2){font-size:13px}
.eventos th{font:500 13px/1.3 var(--disp);color:var(--tinta-3);border-bottom-color:var(--linea)}
.eventos td{border-bottom-color:#1c1c1c}
.eventos tbody tr:hover td{background:#181818}
.eventos .est{border:0;border-radius:999px;padding:4px 10px;font:500 12.5px/1 var(--disp);background:var(--rojo-f);color:var(--rojo-tx);display:inline-flex;align-items:center;gap:6px}
.eventos .est::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.eventos tr.ok .est{background:var(--verde-f);color:var(--verde-tx);border:0}
.eventos .bar i{height:4px;border-radius:4px;background:#2a2a2a;overflow:hidden}
.eventos .bar i::after{background:var(--rojo);border-radius:4px}
.eventos tr.ok .bar i::after{background:var(--verde)}

/* ── 10. Catálogo y terminal ───────────────────────── */
.filtros{gap:8px}
.filtro{height:38px;padding:0 16px;border:0;border-radius:999px;background:var(--sup);color:var(--tinta-2);font:500 14px/1 var(--disp)}
.filtro:hover{background:var(--sup-3);color:var(--tinta)}
.filtro[aria-pressed="true"]{background:var(--azul-f);color:var(--azul-tx);box-shadow:inset 0 0 0 1px rgba(59,91,255,.55)}
.filtro .n{font:500 12px/1 var(--disp);opacity:.7}
.catalogo{gap:10px;background:transparent;border:0}
.tec{background:var(--sup);border-radius:18px}
.tec:hover{background:var(--sup-2)}
.tec .n{font-weight:500}
.tec .k{font:400 12.5px/1 var(--disp);color:var(--tinta-3)}
.tec.fuera{opacity:.15}
.terminal{margin-top:12px;border:0;border-radius:var(--r-caja);background:#0d0d0d;box-shadow:inset 0 0 0 1px #1f1f1f}
.terminal .cur{background:var(--azul-claro)}

/* ── 11. Migración y pasos ─────────────────────────── */
.mudanza{gap:12px;border:0}
.mudanza .ft{border:0;border-radius:var(--r-gran)}
.mudanza .pasos{gap:12px}
.paso{border:0;border-radius:var(--r-tarjeta);background:var(--sup);overflow:hidden;grid-template-columns:auto 1fr;gap:22px;align-items:start}
.paso .n{font:600 12.5px/1 var(--disp);color:var(--azul-tx);background:var(--azul-f);border-radius:999px;padding:7px 11px;white-space:nowrap}
.paso h3{font:600 21px/1.25 var(--disp)}
.paso p{font-size:15.5px;line-height:1.55}
.paso::before{width:3px;background:var(--azul)}
@media (max-width:860px){.mudanza .ft{border:0}}
@media (max-width:560px){.paso{grid-template-columns:1fr;gap:12px}.paso .n{justify-self:start}}

/* ── 12. Tarjetas grandes con foto ─────────────────── */
.dos{gap:12px;background:transparent;border:0}
.gran{border-radius:var(--r-gran)}
.gran .ojo{color:rgba(236,236,236,.7)}
.gran h3{font:600 clamp(28px,3vw,42px)/1.1 var(--disp);margin-top:12px}
.gran p{font-size:16.5px;line-height:1.55}
.gran .btn{background:var(--azul);border-color:var(--azul);color:#fff}
.gran:hover .btn{background:var(--azul-h);border-color:var(--azul-h)}
.gran .btn .fl{background:transparent;color:inherit}
.gran .precio-esq{font:400 13px/1.5 var(--disp);color:rgba(236,236,236,.7)}
.gran .precio-esq b{font:600 32px/1.05 var(--disp);color:#fff}

/* ── 13. Precios ───────────────────────────────────── */
.planes{gap:12px;background:transparent;border:0}
.plan{background:var(--sup);border-radius:var(--r-gran);border:1px solid transparent}
.plan.dest{background:linear-gradient(180deg,rgba(59,91,255,.16),rgba(59,91,255,0) 55%),var(--sup);color:var(--tinta);border-color:rgba(59,91,255,.55);box-shadow:0 0 0 1px rgba(59,91,255,.18),0 24px 60px -30px rgba(59,91,255,.45)}
.plan .ojo{opacity:1;color:var(--tinta-3)}
.plan .badge,.badge{border:0;border-radius:999px;padding:6px 11px;background:var(--azul);color:#fff;font:600 12px/1 var(--disp)}
.plan h3{font:600 26px/1.1 var(--disp);margin-top:22px}
.plan .desc{opacity:1;color:var(--tinta-2);font-size:15px;line-height:1.55}
.plan .precio{border-top:1px solid #262626}
.plan .desde{font:400 13px/1 var(--disp);opacity:1;color:var(--tinta-3)}
.plan .num{font:600 52px/1 var(--disp)}
.plan .mo{opacity:1;color:var(--tinta-3)}
.plan li{opacity:1;color:var(--tinta-2);gap:10px}
.plan li::before{width:16px;height:16px;margin-top:3px;background:var(--verde-tx);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/contain no-repeat}
.plan .btn{border-color:transparent;background:var(--sup-3);color:var(--tinta)}
.plan .btn:hover{background:#2a2a2a}
.plan.dest .btn,.plan .btn.lleno{background:var(--azul);border-color:var(--azul);color:#fff}
.plan.dest .btn:hover,.plan .btn.lleno:hover{background:var(--azul-h);border-color:var(--azul-h)}
.plan.dest .btn .fl{background:transparent;color:inherit}
.bajo-precios{color:var(--tinta-3)}
.pagos{gap:6px}
.pagos span{border:0;border-radius:999px;background:var(--sup);color:var(--tinta-2);font:500 12.5px/1 var(--disp);padding:8px 12px}

/* ── 14. FAQ ───────────────────────────────────────── */
.pregs{border-top:0;display:grid;gap:8px}
.pregs details{border:0;border-radius:var(--r-caja);background:var(--sup);padding:0 22px;transition:background .15s}
.pregs details:hover{background:var(--sup-2)}
.pregs summary{padding:20px 0;font:500 clamp(16px,1.4vw,18px)/1.35 var(--disp)}
.pregs summary .n{font:500 13px/1 var(--disp);color:var(--tinta-3)}
.pregs summary .mas::before,.pregs summary .mas::after{background:var(--tinta-2);border-radius:2px}
.pregs .resp{padding:0 36px 22px 0;font-size:15.5px;line-height:1.65}
@media (max-width:560px){.pregs details{padding:0 18px}.pregs .resp{padding:0 0 20px}}

/* ── 15. Cierre ────────────────────────────────────── */
.cierre{border:0;border-radius:var(--r-gran);background:#070707}
.cierre h2{font:600 clamp(34px,4.4vw,60px)/1.06 var(--disp)}
.eco{border:0;border-radius:999px;background:var(--azul-f);color:var(--azul-tx);font:500 13.5px/1 var(--disp);padding:9px 14px}
.eco b{color:#fff;font-weight:600}
.ascii pre{color:rgba(var(--acento-rgb),.6)}

/* ── 16. Pie ───────────────────────────────────────── */
.pie{border-top:1px solid #1a1a1a}
.grandes a{font:600 clamp(24px,2.6vw,34px)/1.2 var(--disp);border-bottom:1px solid #1a1a1a;padding:12px 0}
.grandes a:hover{color:var(--azul-tx)}
.grandes a span{font:400 13.5px/1 var(--disp);color:var(--tinta-3)}
.pie-col h3{font:600 14px/1.2 var(--disp);color:var(--tinta);margin-bottom:14px}
.pie-col p,.pie-col ul{font-size:14.5px}
.pie-bot{border-top:1px solid #1a1a1a;font:400 13px/1.5 var(--disp);color:var(--tinta-3)}
.palabra-pie{font:700 clamp(80px,21vw,330px)/.8 var(--disp);-webkit-text-stroke:0;color:transparent;background:linear-gradient(180deg,#161616,#000 85%);-webkit-background-clip:text;background-clip:text}

/* Cookies (app/medicion.php trae su <style> en línea: se gana por especificidad) */
html body .ck{background:#1a1a1a;border:1px solid #2c2c2c;border-radius:var(--r-tarjeta);box-shadow:0 24px 60px rgba(0,0,0,.55);font-family:var(--disp)}
html body .ck-t a{color:var(--azul-tx);text-decoration:none}
html body .ck .btn{height:38px;padding:0 16px;border-radius:999px}

/* ── 17. Páginas de producto ───────────────────────── */
/* VPS · dónde */
.donde{gap:12px;border:0}
.donde .donde-tx{border:0;border-radius:var(--r-gran);background:var(--sup)}
.donde-vis{border-radius:var(--r-gran)}
.selector{gap:8px;background:transparent;border:0}
.selector .op{background:var(--sup-3);border-radius:var(--r-caja);box-shadow:inset 0 0 0 1px transparent;transition:background .15s,box-shadow .15s}
.selector .op:hover{background:#262626}
.selector .op:has(input:checked){background:var(--azul-f);color:var(--tinta);box-shadow:inset 0 0 0 1px var(--azul)}
.selector .op:has(input:checked) .cod{background:var(--azul);color:#fff}
.selector .op:has(input:checked) .nom small,.selector .op:has(input:checked) .ms i{color:var(--tinta-2);opacity:1}
.selector .op:has(input:focus-visible){outline:2px solid var(--azul-claro);outline-offset:2px}
.selector .nom b{font-weight:600}
.selector .ms{font:600 22px/1 var(--disp)}
.selector .marca{border-radius:50%;border:1.5px solid #4a4a4a}
.selector .marca::after{border-radius:50%}
.selector .op:has(input:checked) .marca{border-color:var(--azul)}
.selector .op:has(input:checked) .marca::after{background:var(--azul-claro)}
.selector .nota{background:transparent;padding:6px 4px 0;font:400 14px/1.55 var(--disp);color:var(--tinta-3)}
.selector .nota::before{content:none}
/* VPS · dial */
.dial{gap:12px;border:0}
.dial .dial-izq{border:0;border-radius:var(--r-gran);background:var(--sup)}
.dial-nom{font:600 clamp(48px,6.4vw,96px)/.95 var(--disp)}
.dial-precio{border-top:1px solid #262626}
.dial-precio .num{font:600 clamp(42px,4.6vw,60px)/1 var(--disp)}
.marcas button{font:500 12.5px/1 var(--disp);color:var(--tinta-3);padding-top:8px}
.marcas button.act{color:var(--azul-tx)}
.marcas button.act::before{background:var(--azul-claro)}
.rango{height:30px}
.rango::-webkit-slider-runnable-track{height:6px;border-radius:999px;background:linear-gradient(90deg,var(--azul) var(--p),#2c2c2c var(--p))}
.rango::-moz-range-track{height:6px;border-radius:999px;background:#2c2c2c}
.rango::-moz-range-progress{height:6px;border-radius:999px;background:var(--azul)}
.rango::-webkit-slider-thumb{width:22px;height:22px;margin-top:-8px;border-radius:50%;background:#fff;border:0;outline:0;box-shadow:0 0 0 4px rgba(59,91,255,.45),0 2px 8px rgba(0,0,0,.5)}
.rango::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:#fff;border:0;outline:0;box-shadow:0 0 0 4px rgba(59,91,255,.45)}
.rango:focus-visible::-webkit-slider-thumb{outline:2px solid var(--azul-claro);outline-offset:3px}
.dial-der{gap:12px;background:transparent}
.lect{background:var(--sup);border-radius:var(--r-tarjeta)}
.lect .k{font:500 14px/1.2 var(--disp);color:var(--tinta-2)}
.lect b{font:600 clamp(38px,4.2vw,58px)/1 var(--disp)}
.lect b small{color:var(--tinta-3);font-weight:500}
.nucleos i{border:0;border-radius:4px;background:#262626}
.nucleos i.on{background:var(--azul)}
.barra-r{height:6px;border-radius:999px;background:#262626;overflow:hidden}
.barra-r i{background:var(--azul);border-radius:999px}
@media (max-width:960px){.dial .dial-izq{border:0}}
.siempre{gap:8px;border:0;margin-top:12px}
.siempre span{border:0;border-radius:999px;background:var(--sup);padding:10px 16px}
.siempre span:not(.k)::before{width:7px;height:7px;border-radius:50%;background:var(--verde)}
.siempre .k{background:var(--azul-f);color:var(--azul-tx);font:500 14px/1 var(--disp)}
@media (max-width:560px){.siempre span{width:auto;border:0}}
/* VPS · tabla de planes */
.tabla{border:0;border-radius:var(--r-gran);background:var(--sup);overflow:hidden}
.tabla .fila{border-bottom-color:var(--linea)}
.fila.cabeza{background:transparent;font:500 13px/1.25 var(--disp);color:var(--tinta-3)}
.fila:not(.cabeza):hover{background:var(--sup-2)}
.c-plan .n{font:500 13px/1 var(--disp);color:var(--tinta-3)}
.c-plan b{font:600 21px/1 var(--disp)}
.c-rec b{font:600 16px/1 var(--disp)}
.br{height:4px;border-radius:4px;background:#2a2a2a;color:var(--azul-claro);overflow:hidden}
.br::after{border-radius:4px}
.c-precio b{font:600 23px/1 var(--disp)}
.fila.dest{background:var(--azul-f);color:var(--tinta);box-shadow:inset 3px 0 0 var(--azul)}
.fila.dest:hover{background:rgba(59,91,255,.18)}
.fila.dest .n,.fila.dest .c-precio small{color:var(--tinta-3);opacity:1}
.fila.dest .br{background:rgba(255,255,255,.1)}
.fila.dest .btn.lleno{background:var(--azul);border-color:var(--azul);color:#fff}
.fila.dest .btn.lleno .fl{background:transparent;color:inherit}
@media (max-width:960px){.c-rec{border-top-color:#262626}.fila.dest .c-rec{border-top-color:rgba(255,255,255,.1)}.c-rec::before{font:400 13px/1 var(--disp);opacity:1;color:var(--tinta-3)}}
/* VPS · bento y sistemas */
.rasgos{border-top-color:#262626}
.rasgos li{border-bottom-color:#262626}
.rasgos b{font:600 18px/1.25 var(--disp)}
.mini-term{border:0;border-radius:12px;background:#0b0b0b;box-shadow:inset 0 0 0 1px #262626}
.mini-term .cur{background:var(--azul-claro)}
.pila i{border:0;border-radius:6px;background:#2a2a2a}
.pila i:last-child{background:var(--azul)}
.sistemas{gap:10px;background:transparent;border:0}
.so{background:var(--sup);border-radius:var(--r-tarjeta)}
.so:hover{background:var(--sup-2)}
.so .cod{font:600 clamp(32px,3.2vw,46px)/1 var(--disp)}
.so .nom{font:400 14px/1.3 var(--disp);color:var(--tinta-3)}

/* Hosting · ubicación, barras, comparativa, pila */
.hs-donde{gap:12px;border:0;background:transparent;margin-bottom:12px}
.hs-donde .hs-donde-tx{border:0;border-radius:var(--r-tarjeta);background:var(--sup)}
.hs-donde-op{gap:12px;background:transparent}
.hs-op{background:var(--sup);border-radius:var(--r-tarjeta);box-shadow:inset 0 0 0 1px transparent;transition:background .15s,box-shadow .15s}
.hs-op:hover{background:var(--sup-2)}
.hs-op:has(input:checked),.hs-op.sel{background:var(--azul-f);color:var(--tinta);box-shadow:inset 0 0 0 1px var(--azul)}
.hs-op:has(input:checked) .cod,.hs-op.sel .cod{background:var(--azul);color:#fff}
.hs-op:has(input:checked) .nom small,.hs-op:has(input:checked) .ms i,.hs-op.sel .nom small,.hs-op.sel .ms i{color:var(--tinta-2);opacity:1}
.hs-op .nom strong{font-weight:600}
.hs-op .ms{border-top-color:#2a2a2a}
.hs-op:has(input:checked) .ms,.hs-op.sel .ms{border-color:rgba(124,147,255,.25)}
.hs-op .ms b{font:600 23px/1 var(--disp)}
.hs-op .ms i{font:400 12.5px/1.2 var(--disp);color:var(--tinta-3)}
.hs-op:has(input:focus-visible){outline:2px solid var(--azul-claro);outline-offset:2px}
@media (max-width:860px){.hs-donde .hs-donde-tx{border:0}}
.hs-planes .plan h3{font-size:clamp(28px,2.6vw,36px)}
.hs-planes .plan .num,.co-planes .num{font-size:clamp(46px,4.4vw,60px)}
.hs-barras i{height:5px;border-radius:999px;background:#2a2a2a}
.hs-barras i::after{background:var(--azul-claro);border-radius:999px}
.hs-barras em{font:400 13px/1 var(--disp);opacity:1;color:var(--tinta-3)}
.hs-compara{border:0;border-radius:var(--r-tarjeta);background:var(--sup)}
.hs-compara th,.hs-compara td{border-bottom-color:var(--linea)}
.hs-compara thead th{font:500 13.5px/1.2 var(--disp);color:var(--tinta-3)}
.hs-compara thead th.dest{color:var(--azul-tx)}
.hs-compara td.dest,.hs-compara th.dest{background:rgba(59,91,255,.09)}
.hs-n{font:600 12.5px/1 var(--disp);color:var(--azul-tx);background:var(--azul-f);border-radius:999px;padding:7px 11px;white-space:nowrap}
.hs-pila{gap:8px;background:transparent;border:0;margin-top:12px}
.hs-pila span{background:var(--sup);border-radius:var(--r-caja)}
.hs-pila span:hover{background:var(--sup-2)}
.hs-pila i{font:400 13px/1 var(--disp);color:var(--tinta-3)}

/* Dominios · anillo, buscador, tabla, calendario */
.dm-anillo span{font:600 clamp(14px,1.3vw,18px)/1 var(--disp);border:1px solid #2c2c2c;border-radius:999px;padding:9px 14px;background:rgba(20,20,20,.72)}
.dm-busca{height:72px;border:1px solid #2c2c2c;border-radius:999px;background:rgba(20,20,20,.85);padding:0 7px 0 0}
.dm-busca:focus-within{border-color:var(--azul);box-shadow:0 0 0 4px rgba(59,91,255,.2)}
.dm-busca::after{content:none}
.dm-busca .pre{font:500 16px/1 var(--disp);color:var(--tinta-3);padding-left:26px}
.dm-busca input{font:500 clamp(19px,2vw,24px)/1 var(--disp)}
.dm-busca .btn{height:58px;padding:0 24px;border-radius:999px;font-size:16px}
.dm-sug .dm-ext{border:0;border-radius:999px;background:rgba(31,31,31,.85);font:500 14px/34px var(--disp);padding:0 14px}
.dm-sug .dm-ext i{font-size:12.5px;color:var(--tinta-3)}
.dm-sug .dm-ext:hover,.dm-sug .dm-ext[aria-pressed="true"]{background:var(--azul-f);color:var(--azul-tx);box-shadow:inset 0 0 0 1px rgba(59,91,255,.55)}
.dm-sug .dm-ext:hover i,.dm-sug .dm-ext[aria-pressed="true"] i{color:inherit;opacity:.75}
.dm-tabla{gap:0;background:var(--sup);border:0;border-radius:var(--r-gran);overflow:hidden}
.dm-tabla .fila{background:transparent;border-bottom:1px solid var(--linea)}
.dm-tabla .fila:last-child{border-bottom:0}
.dm-tabla .fila.cabeza{font:500 13px/1 var(--disp);color:var(--tinta-3)}
.dm-tabla .fila:not(.cabeza):hover{background:var(--sup-2)}
.dm-tabla .fila:not(.cabeza)::before{width:3px;background:var(--azul)}
.dm-tabla .ext{font:600 clamp(28px,3vw,42px)/1 var(--disp)}
.dm-tabla .ext .n{font:500 13px/1 var(--disp);color:var(--tinta-3)}
.dm-tabla .num{font:600 clamp(19px,1.8vw,24px)/1 var(--disp)}
.dm-tabla .num small{font:400 13px/1 var(--disp);color:var(--tinta-3)}
.dm-aviso .cal{gap:5px;background:transparent;border:0}
.dm-aviso .cal i{background:var(--sup-3);border-radius:8px}
.dm-aviso .cal i::after{background:#3a3a3a}
.dm-aviso .cal i.av{background:var(--azul)}
.dm-aviso .cal i.av::after{background:#fff}
.dm-aviso .cal i.fin::after{background:var(--ambar)}
.dm-aviso .cal i:last-child{outline:0;background:var(--ambar-f);box-shadow:inset 0 0 0 1px rgba(245,158,11,.5)}

/* Correo */
.co-dir{border:1px solid #2c2c2c;border-radius:var(--r-caja);background:rgba(20,20,20,.75);font-weight:500}
.co-cur{background:var(--azul-claro)}
.co-bandeja{border:0;border-radius:var(--r-tarjeta);background:var(--sup);overflow:hidden}
.co-bandeja .eventos{margin-top:0;border-radius:0;background:transparent}
.co-ev tr.fuera .est{background:var(--ambar-f);color:var(--ambar-tx);border:0}
.co-ev tr.fuera td:nth-child(2),.co-ev tr.fuera td:nth-child(3){color:var(--tinta-3)}
.co-clientes{gap:10px;background:transparent;border:0}
.co-proto{gap:10px;border:0;margin-top:10px}
.co-proto>div{border:0;border-radius:var(--r-tarjeta);background:var(--sup)}
.co-proto>div:last-child{border:0}
.co-proto .k{font:500 14px/1 var(--disp);color:var(--tinta-3)}
.co-proto b{font:600 28px/1 var(--disp)}
@media (max-width:860px){.co-proto>div{border:0}}
.co-medidor{height:5px;border-radius:999px;background:#2a2a2a}
.co-medidor i{background:var(--azul-claro);border-radius:999px}
.co-nota a{color:var(--azul-tx);text-decoration:none}

/* Servidores IA */
.ia-hero .ia-nv{font:500 13px/1 var(--disp);color:var(--tinta-3)}
.ia-modelos{gap:12px;background:transparent;border:0}
.ia-mod{background:var(--sup);border-radius:var(--r-gran)}
.ia-mod:hover{background:var(--sup-2)}
.ia-mod .badge{background:var(--azul-f);color:var(--azul-tx)}
.ia-mod h3{font:600 clamp(23px,2.1vw,29px)/1.15 var(--disp)}
.ia-mod .pie-m{border-top-color:#262626}
.ia-mod .pie-m:hover{border-color:#3a3a3a}
.ia-mod .pie-m .v{font:500 13px/1 var(--disp);color:var(--tinta-3)}
.ia-mod .pie-m .p b{font-weight:600}
.ia-buscar{height:46px;border:0;border-radius:999px;background:var(--sup);padding:0 18px;box-shadow:inset 0 0 0 1px #262626}
.ia-buscar:focus-within{box-shadow:inset 0 0 0 1px var(--azul),0 0 0 4px rgba(59,91,255,.2)}
.gpu-chip{height:42px;border:0;border-radius:999px;background:var(--sup);color:var(--tinta-2);font:500 14px/1 var(--disp)}
.gpu-chip:hover{background:var(--sup-3);color:var(--tinta)}
.gpu-chip.act{background:var(--azul-f);color:var(--azul-tx);box-shadow:inset 0 0 0 1px rgba(59,91,255,.55)}
.gpu-chip .n{font:500 12px/1 var(--disp);opacity:.75}
.ia-lista{border:0;border-radius:var(--r-gran);background:var(--sup);overflow:hidden}
.ia-lista-cab,.ia-cols{border-bottom-color:var(--linea);font:500 13.5px/1.2 var(--disp);color:var(--tinta-3)}
.ia-lista-cab b{color:var(--tinta);font-weight:600}
.gfila{border-bottom-color:var(--linea)}
.gfila:hover{background:var(--sup-2)}
.gfila .gi{font:500 13px/1 var(--disp);color:var(--tinta-3)}
.gfila h3{font:600 20px/1.15 var(--disp)}
.gfila .desc{font:400 13px/1.4 var(--disp);color:var(--tinta-3)}
.gfila .gv b{font:600 19px/1 var(--disp)}
.barra-v{height:5px;border-radius:999px;background:#2a2a2a;overflow:hidden}
.barra-v i{background:var(--azul-claro);border-radius:999px}
.gfila .gp small{font:400 12.5px/1.3 var(--disp);color:var(--tinta-3)}
.gfila .gprecio b{font:600 23px/1 var(--disp)}
.gpu-sin-resultados{border-top-color:var(--linea)}
.gpu-sin-resultados a{color:var(--azul-tx);text-decoration:none}
.ia-vacio{border:1px dashed #333;border-radius:var(--r-gran);background:var(--sup)}
.ia-vacio .ic{border:0;border-radius:50%;background:var(--azul-f);color:var(--azul-claro)}
.ia-vacio h3{font:600 clamp(23px,2.4vw,30px)/1.15 var(--disp)}
.ia-ent-l li::before{width:16px;height:16px;margin-top:4px;background:var(--verde-tx);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/contain no-repeat}

/* ── 18. Legales ───────────────────────────────────── */
.legal-hero{border-bottom:0;padding-bottom:12px}
.legal-hero h1{font:600 clamp(36px,4.8vw,64px)/1.06 var(--disp);margin-top:14px}
.legal-hero .meta{gap:8px;margin-top:22px;font:500 13.5px/1 var(--disp);color:var(--tinta-2)}
.legal-hero .meta span{background:var(--sup);border-radius:999px;padding:9px 14px}
.legal{padding-top:40px}
.legal-indice{border-top:0;background:var(--sup);border-radius:var(--r-tarjeta);padding:8px}
.legal-indice a{border-bottom:0;border-radius:12px;padding:9px 12px;font-size:14px;color:var(--tinta-2);transition:background .15s,color .15s}
.legal-indice a:hover{background:var(--sup-3);color:var(--tinta)}
.legal-indice a.activa{background:var(--azul-f);color:var(--tinta)}
.legal-indice a span,.legal-indice a.activa span{font:500 13px/1.55 var(--disp);color:var(--tinta-3)}
.legal-indice a.activa span{color:var(--azul-tx)}
.legal-texto{font-size:16.5px;line-height:1.75;color:var(--tinta-2)}
.legal-texto h2{font:600 clamp(23px,2.2vw,30px)/1.2 var(--disp)}
.legal-texto h3{font:600 19px/1.3 var(--disp)}
.legal-texto a{color:var(--azul-tx);text-decoration:none}
.legal-texto a:hover{text-decoration:underline;text-underline-offset:3px}
.legal-texto strong,.legal-texto b{font-weight:600}
.legal-texto table{border:0;border-radius:var(--r-caja);background:var(--sup);overflow:hidden;display:block;overflow-x:auto}
.legal-texto th,.legal-texto td{border-bottom-color:var(--linea)}
.legal-texto th{font:500 13px/1.3 var(--disp);color:var(--tinta-3)}
.legal-ficha{gap:8px;background:transparent;border:0}
.legal-ficha div{background:var(--sup);border-radius:var(--r-caja)}
.legal-ficha span{font:500 13px/1 var(--disp);color:var(--tinta-3)}
.legal-ficha b{font-weight:600}
.legal-texto .legal-ficha a,.legal-ficha b a{color:var(--tinta)}
.legal-otras{border-top:1px solid var(--linea);font:400 14.5px/1.9 var(--disp);color:var(--tinta-3)}
.legal-otras a{color:var(--azul-tx)}
@media (max-width:860px){.legal-indice{columns:auto}}

/* ── 19. Acceso: login, registro, recuperar (cliente y admin) ── */
.acceso-vis{margin:12px;border:0;border-radius:var(--r-gran);min-height:calc(100svh - 24px)}
.acceso-vis::before{background:linear-gradient(180deg,rgba(0,0,0,.25),rgba(0,0,0,.82))}
.acceso-vis .cita{font:600 clamp(30px,3.2vw,46px)/1.1 var(--disp);max-width:13ch}
.acceso-vis .ojo{color:rgba(236,236,236,.72)}
.registro .acceso-vis{top:12px;height:calc(100svh - 24px)}
:is(.login-lista,.reg-ventajas,.rec-pasos,.a-acceso-lista){border-top:0}
:is(.login-lista,.reg-ventajas,.rec-pasos,.a-acceso-lista) li{border-bottom:1px solid rgba(255,255,255,.1)}
:is(.login-lista,.a-acceso-lista) .n,.reg-ventajas li span,.rec-pasos b{font:600 12.5px/1 var(--disp);color:var(--azul-tx);background:rgba(59,91,255,.22);border-radius:999px;padding:5px 9px;align-self:center}
.rec-pasos li.activo b{background:var(--azul);color:#fff}
.acceso-caja h1{font:600 clamp(28px,2.8vw,36px)/1.15 var(--disp);margin-top:10px}
.acceso-caja .sub{color:var(--tinta-2);line-height:1.55}
.campo{margin-top:16px}
.campo>span,.reg-ubi legend{font:500 14px/1.3 var(--disp);color:var(--tinta-2);margin-bottom:8px}
.campo input,.campo select,.campo textarea{height:48px;border-radius:var(--r-campo);background:var(--sup);border:1px solid var(--linea-2);font:400 16px var(--disp);transition:border-color .15s,box-shadow .15s}
.campo textarea{height:auto}
.campo input::placeholder,.campo textarea::placeholder{color:#6f6f6f}
.campo input:focus,.campo select:focus,.campo textarea:focus{border-color:var(--azul);box-shadow:0 0 0 3px rgba(59,91,255,.22)}
.acceso-caja .btn.lleno,.registro .acceso-caja>.btn.lleno,.registro .acceso-caja form>.btn,.rec .acceso-caja .btn.rec-btn,.arec .acceso-caja .btn.arec-btn{height:50px;justify-content:center;margin-top:24px;font-size:15.5px}
.login-reenviar .btn{justify-content:center}
.reg-btn-borde{text-align:center}
.acceso-caja .enlaces{color:var(--tinta-3)}
.acceso-caja .enlaces a,.login-olvido,.login-alta a,.registro .acceso-caja .sub a,.aviso-form a,.consiente-txt a{color:var(--azul-tx);text-decoration:none}
.acceso-caja .enlaces a:hover,.login-olvido:hover,.login-alta a:hover,.consiente-txt a:hover{text-decoration:underline;text-underline-offset:3px}
.rec .acceso-caja .enlaces,.arec .acceso-caja .enlaces{border-top-color:var(--linea)}
.aviso-form{border:1px solid #2c2c2c;border-radius:var(--r-campo);background:var(--sup);color:var(--tinta);line-height:1.5}
.aviso-form.error{border-color:rgba(239,68,68,.4);background:rgba(239,68,68,.08);color:#fca5a5}
.aviso-form.ok,.rec-ok,.arec-ok{border:1px solid rgba(34,197,94,.32);background:rgba(34,197,94,.08);color:#bbf7d0}
.arec-ok svg{color:var(--verde-tx)}
.marca-check input,.login-fila .marca-check input{accent-color:var(--azul)}
.login-ayuda,.reg-ayuda,.rec-ayuda{font:500 14px/1 var(--disp);color:var(--tinta-2);padding:9px 12px;border-radius:999px}
.login-ayuda:hover,.reg-ayuda:hover,.rec-ayuda:hover{background:var(--sup);color:var(--tinta)}
.login-cifrado,.reg-cifrado,.a-acceso-nota{border-top:1px solid var(--linea);font:400 13.5px/1.3 var(--disp);color:var(--tinta-3)}
.login-cifrado svg,.reg-cifrado svg,.a-acceso-nota svg{color:var(--verde-tx)}
.a-marca{border-radius:999px;font:600 11.5px/1 var(--disp);font-style:normal;padding:4px 8px;background:var(--azul-f);color:var(--azul-tx)}
/* Registro: ubicación y casilla */
.reg-ubi-op{border:1px solid var(--linea-2);border-radius:14px;background:var(--sup)}
.reg-ubi-op:hover{border-color:#3a3a3a}
.reg-ubi-cod{border:0;border-radius:10px;background:#2a2a2a;color:var(--tinta);font:600 12px/1 var(--disp)}
.reg-ubi-txt b{font-weight:600}
.reg-ubi-ms{font:400 12px/1.2 var(--disp);color:var(--tinta-3)}
.reg-ubi-op:has(input:checked){border-color:var(--azul);background:var(--azul-f)}
.reg-ubi-op input:checked~.reg-ubi-cod{background:var(--azul);color:#fff}
.reg-ubi-op:has(input:focus-visible){outline:2px solid var(--azul-claro)}
.consiente-box{border-radius:6px;border:1.5px solid #4a4a4a;background:var(--sup)}
.consiente-box svg{stroke:#fff}
.consiente-input:checked~.consiente-box{background:var(--azul);border-color:var(--azul)}
.consiente-input:focus-visible~.consiente-box{outline:2px solid var(--azul-claro)}
/* Captcha deslizante */
.captcha-pista{height:50px;border:1px solid var(--linea-2);border-radius:999px;background:var(--sup)}
.captcha-relleno{background:var(--azul-f);border-right:0;border-radius:999px}
.captcha-hueco{border:1.5px dashed #4a4a4a;border-radius:999px}
.captcha-tirador{border-radius:50%;background:var(--azul);color:#fff;box-shadow:0 4px 14px rgba(59,91,255,.4)}
.captcha-lbl{font:500 14px/1 var(--disp);color:var(--tinta-3)}
.captcha.ok .captcha-pista{border-color:rgba(34,197,94,.5);background:rgba(34,197,94,.06)}
.captcha.ok .captcha-hueco{border-style:solid;border-color:var(--verde)}
.captcha.ok .captcha-tirador{background:var(--verde);box-shadow:none}
.captcha.ok .captcha-relleno{background:rgba(34,197,94,.14)}
.captcha-marca-txt{font:500 10.5px/1.3 var(--disp)}
.captcha-marca-txt i{font-size:9.5px}
@media (max-width:900px){.acceso-vis{margin:0}}
/* El cierre es una tarjeta: el velo que funde la foto va al color de la tarjeta, no al de la página */
.cierre{background:#0b0b0b}
.cierre::before{background:linear-gradient(90deg,#0b0b0b 25%,transparent)}
@media (max-width:860px){.cierre::before{background:linear-gradient(180deg,#0b0b0b 40%,transparent)}}
@media (max-width:560px){
  .hero h1{font-size:clamp(30px,8.6vw,40px)}
  .eventos table{font-size:12.5px}
  .eventos th,.eventos td{padding:10px 10px}
  .eventos .est{padding:3px 8px;font-size:11.5px;gap:5px}
}
.hero h1 .l{margin-right:0}
.hs-pila{display:grid;grid-template-columns:repeat(5,minmax(0,1fr))}
@media (max-width:860px){.hs-pila{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* Correo: la dirección es para leerla, no código: Inter */
.co-ev td:nth-child(2){font-family:var(--disp);font-size:13.5px}
/* Catálogo de GPU: 38 filas con un botón azul cada una es ruido; en gris y azul al pasar */
.gfila .btn.lleno{background:var(--sup-3);border-color:transparent;color:var(--tinta)}
.gfila:hover .btn.lleno,.gfila .btn.lleno:focus-visible{background:var(--azul);border-color:var(--azul);color:#fff}
.hs-n{justify-self:start;align-self:start}
.hs-hero h1{max-width:none}   /* el titular de hosting va en dos líneas también en inglés */

/* Banderas (app/banderas.php: SVG autoalojados, nunca emoji). Igual que en v4-app.css */
.bandera{display:inline-block;border-radius:3px;box-shadow:0 0 0 1px rgba(255,255,255,.12);vertical-align:-.18em;object-fit:cover;flex:none}
.idi .bandera{width:20px;height:15px;vertical-align:middle;opacity:.6;filter:saturate(.7);transition:opacity .2s,filter .2s}
.idi:hover .bandera,.idi.activo .bandera{opacity:1;filter:none}
:is(.ubi,.selector .nom,.hs-op .nom,.reg-ubi-txt) .bandera{margin-right:3px}
.gfila .gp .bandera{margin-right:4px}
.reg-ubi-txt b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* «Consola» visible también en móvil (Ruben, 4-oct): compacta junto al menú */
@media (max-width:560px){.barra .acceder{height:36px;padding:0 12px;font-size:14px}.barra .acceder .fl{display:none}}

/* ── Hero: píldoras con icono + línea de precio (estilo ChatGPT, oct-2026) ── */
.hero .hb2{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:30px;margin-top:clamp(28px,4.5vh,48px)}
.pildoras{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.pildoras li{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 15px 0 12px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.09);font:500 14px/1 var(--disp);color:var(--tinta);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.pildoras svg{width:16px;height:16px;flex:none;fill:none;stroke:var(--azul-tx);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.hero-accion{display:flex;align-items:center;gap:14px 24px;flex-wrap:wrap}
.precio-hero{margin:0;font:400 14px/1.55 var(--disp);color:var(--tinta-3)}
.precio-hero b{font-weight:600;color:var(--tinta)}
.precio-hero span::before{content:"·";margin:0 .45em 0 .2em;opacity:.7}
@media (max-width:700px){
  .hero .hb2{align-items:stretch;gap:24px}
  .pildoras{gap:7px}
  .pildoras li{height:32px;padding:0 12px 0 10px;font-size:13px;gap:7px}
  .pildoras svg{width:15px;height:15px}
  .hero-accion{flex-direction:column;align-items:stretch}
  .precio-hero b{display:block;font-size:15px;margin-bottom:2px}
  .precio-hero span:first-of-type::before{content:none}
  .precio-hero span:first-of-type{margin-left:0}
}

/* Tres cifras en vez de cuatro (precios/hosting y precios/correo, al quitar la de la
   migración gratis, que no se ofrece): rejilla de tres y, en móvil, la tercera a lo ancho
   para que no quede un hueco a su lado. */
.cifras.tres{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:860px){.cifras.tres{grid-template-columns:1fr 1fr}.cifras.tres .cifra:last-child{grid-column:1/-1}}
