/* ═══════════════════════════════════════════════════════════
   FibraTel 2027 — estilos compartidos
   Paleta: lago del sur, niebla, copihue (rojo de marca), musgo y luz de fibra
   ═══════════════════════════════════════════════════════════ */
:root{
    --lago:#0F3B4C; --lago-2:#0A2C39; --lago-3:#164C61; --lago-suave:#E3ECEF;
    --niebla:#EEF2F0; --niebla-2:#E1E8E5; --linea:#D2DCD8;
    --copihue:#C8323C; --copihue-2:#A62731; --copihue-suave:#F7E6E7;
    --musgo:#5F8F57; --musgo-2:#3F6E3A; --musgo-suave:#E6EFE3;
    --luz:#FFCF6E; --luz-2:#E8A93A;
    --tinta:#16242A; --texto-2:#46575E; --texto-3:#68777D; --blanco:#FFFFFF; --wa:#1F9D55;
    --display:'Bricolage Grotesque','Figtree',system-ui,sans-serif;
    --cuerpo:'Figtree',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
    --r-s:10px; --r-m:16px; --r-l:26px;
    --ancho:1200px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--cuerpo);font-size:17px;line-height:1.6;color:var(--tinta);background:var(--niebla);-webkit-font-smoothing:antialiased}
img,svg{max-width:100%}
a{color:inherit}
h1,h2,h3,h4{margin:0;font-family:var(--display);font-weight:700;letter-spacing:-.02em;line-height:1.08;text-wrap:balance}
p{margin:0}
ul{margin:0;padding:0;list-style:none}
:focus-visible{outline:3px solid var(--luz-2);outline-offset:3px;border-radius:6px}
.contenedor{width:100%;max-width:var(--ancho);margin:0 auto;padding:0 28px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.saltar{position:absolute;left:12px;top:-60px;z-index:100;background:var(--luz);color:var(--tinta);padding:10px 16px;border-radius:8px;font-weight:700;text-decoration:none}
.saltar:focus{top:12px}
.i{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* ── Botones ───────────────────────────────────────────── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:48px;padding:12px 22px;border-radius:999px;border:2px solid transparent;font:700 16px/1.1 var(--cuerpo);text-decoration:none;cursor:pointer;transition:background .15s,color .15s,border-color .15s;white-space:nowrap}
.btn-rojo{background:var(--copihue);color:#fff}.btn-rojo:hover{background:var(--copihue-2)}
.btn-luz{background:var(--luz);color:var(--tinta)}.btn-luz:hover{background:#FFC24A}
.btn-lago{background:var(--lago);color:#fff}.btn-lago:hover{background:var(--lago-3)}
.btn-borde{border-color:currentColor;background:transparent}
.btn-borde:hover{background:rgba(255,255,255,.1)}
.btn-wa{background:var(--wa);color:#fff}.btn-wa:hover{background:#178447}
.btn-chico{min-height:42px;padding:9px 18px;font-size:15px}

/* ── Barra superior y cabecera ─────────────────────────── */
.barra-top{background:var(--lago-2);color:#BFD3DA;font-size:14px}
.barra-top .contenedor{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:38px}
.barra-top a{color:#fff;text-decoration:none;font-weight:600;display:inline-flex;align-items:center;gap:6px}
.barra-top a:hover{text-decoration:underline}
.barra-top .lado{display:flex;gap:20px;align-items:center}
.barra-top .i{width:16px;height:16px}

header#cabecera{position:sticky;top:0;z-index:50;background:rgba(15,59,76,.97);backdrop-filter:blur(10px);color:#fff;transition:box-shadow .2s}
header#cabecera.sombra{box-shadow:0 10px 30px rgba(6,28,37,.35)}
header#cabecera > .contenedor{display:flex;align-items:center;gap:28px;min-height:74px}
.logo{display:inline-flex;align-items:center;gap:7px;font-family:var(--display);font-size:28px;font-weight:800;letter-spacing:-.035em;color:#FF6F78;text-decoration:none;flex:none}
.logo .marca span{color:#fff}
.logo .hoja{width:26px;height:26px;fill:#9CC48A;stroke:#D7EBCD;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.menu{display:flex;gap:4px;margin-right:auto}
.menu a{padding:9px 13px;border-radius:999px;text-decoration:none;font-weight:600;font-size:16px;color:#DCE8EC}
.menu a:hover,.menu a[aria-current="page"]{background:rgba(255,255,255,.1);color:#fff}
.menu a.club{color:var(--luz)}
.acciones{display:flex;gap:10px;align-items:center}
.hamburguesa{display:none;width:48px;height:48px;border-radius:12px;border:1.5px solid rgba(255,255,255,.3);background:transparent;color:#fff;align-items:center;justify-content:center;cursor:pointer}
.menu-movil{display:none;border-top:1px solid rgba(255,255,255,.12);padding:10px 20px 18px}
.menu-movil.abierto{display:grid}
.menu-movil a{padding:13px 8px;color:#fff;text-decoration:none;font-weight:600;border-bottom:1px solid rgba(255,255,255,.08)}

/* ── Portada: la línea de luz del sur ──────────────────── */
.portada{position:relative;background:var(--lago);color:#fff;overflow:hidden;padding:64px 0 80px}
.portada::before{content:"";position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='520' height='520' viewBox='0 0 520 520'%3E%3Cg fill='none' stroke='%23ffffff' stroke-opacity='.06' stroke-width='1.2'%3E%3Cpath d='M-20 120c80-40 150 30 240-10s160-70 320 0'/%3E%3Cpath d='M-20 170c90-30 160 40 250 0s150-60 310 10'/%3E%3Cpath d='M-20 230c70-50 170 20 260-20s170-50 300 20'/%3E%3Cpath d='M-20 300c100-20 150 50 250 10s160-60 310 0'/%3E%3Cpath d='M-20 370c80-40 170 30 260-10s150-40 300 10'/%3E%3Cpath d='M-20 440c90-30 150 40 250 0s170-60 310 10'/%3E%3C/g%3E%3C/svg%3E") 0 0/520px 520px;pointer-events:none}
.portada .contenedor{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,470px);gap:56px;align-items:center}
.portada h1{font-size:clamp(44px,6.2vw,84px);font-weight:800;letter-spacing:-.045em;line-height:.98;max-width:12ch}
.portada .bajada{margin-top:22px;font-size:19px;color:#C9DCE2;max-width:46ch}
.portada .precio{display:flex;align-items:flex-end;gap:16px;margin-top:30px;flex-wrap:wrap}
.portada .precio p{font-size:15px;color:#A9C3CB;line-height:1.35}
.portada .precio b{display:block;font-family:var(--display);font-size:46px;font-weight:800;letter-spacing:-.035em;color:var(--luz);line-height:1}
.portada .botones{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.ventajas{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:34px;font-size:15px;color:#C9DCE2}
.ventajas li{display:flex;align-items:center;gap:8px}
.ventajas .i{color:#9CC48A;width:18px;height:18px}

.ruta{position:relative}
.ruta svg{display:block;width:100%;max-width:420px;margin-left:auto;overflow:visible}
.ruta .parada{cursor:pointer}
.ruta .parada:focus{outline:none}
.ruta .parada:focus-visible .anillo,.ruta .parada:hover .anillo{stroke:var(--luz);stroke-width:3}
.ruta .ciudad{font:700 19px var(--display);fill:#fff;letter-spacing:-.01em}
.ruta .region{font:500 13px var(--cuerpo);fill:#9DB8C1}
.ruta .nota{font:600 14px var(--cuerpo);fill:#9DB8C1}
.ruta .pulso{filter:drop-shadow(0 0 6px var(--luz))}

/* ── Panel de contratar / pagar ────────────────────────── */
.panel{background:#fff;border-radius:var(--r-l);border:1.5px solid var(--linea);box-shadow:0 18px 40px rgba(10,44,57,.10);overflow:hidden}
.pestanas{display:flex;gap:6px;padding:8px;background:var(--niebla-2);border-bottom:1.5px solid var(--linea)}
.pestanas button{flex:1;display:flex;align-items:center;justify-content:center;gap:9px;min-height:52px;border:0;border-radius:14px;background:transparent;font:700 16px var(--cuerpo);color:var(--texto-2);cursor:pointer}
.pestanas button[aria-selected="true"]{background:#fff;color:var(--tinta);box-shadow:0 2px 8px rgba(10,44,57,.1)}
.caja{padding:26px 30px 28px}
.caja h2{font-size:24px}
.caja .sub{color:var(--texto-2);margin-top:4px;font-size:16px}
.fila-form{display:grid;grid-template-columns:1fr 1fr 1.4fr auto;gap:14px;align-items:end;margin-top:18px}
.fila-form.pago{grid-template-columns:minmax(0,340px) auto 1fr}
.campo label{display:block;font-weight:700;font-size:14px;margin-bottom:6px}
.campo input,.campo select{width:100%;min-height:50px;padding:12px 14px;border:1.5px solid var(--linea);border-radius:12px;font:500 16px var(--cuerpo);color:var(--tinta);background:#fff}
.campo input:focus,.campo select:focus{outline:none;border-color:var(--lago);box-shadow:0 0 0 3px rgba(15,59,76,.15)}
.campo input[aria-invalid="true"]{border-color:var(--copihue)}
.ayuda-campo{font-size:13px;color:var(--texto-3);margin-top:5px}
.error{display:none;color:var(--copihue-2);font-weight:600;font-size:14px;margin-top:10px}
.error.visible{display:block}
.pie-caja{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:14px;font-size:14px;color:var(--texto-3)}
.pie-caja a{color:var(--lago);font-weight:700}

/* ── Secciones generales ───────────────────────────────── */
.seccion{padding:96px 0}
.seccion.blanca{background:#fff}
.cabeza-sec{max-width:640px;margin-bottom:44px}
.cabeza-sec h2{font-size:clamp(32px,4vw,50px);letter-spacing:-.035em}
.cabeza-sec p{margin-top:14px;color:var(--texto-2);font-size:18px}

/* ── Planes ────────────────────────────────────────────── */
.uso{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:28px}
.uso > span{font-weight:700;margin-right:6px}
.uso button{min-height:44px;padding:9px 18px;border-radius:999px;border:1.5px solid var(--linea);background:#fff;font:600 15px var(--cuerpo);color:var(--tinta);cursor:pointer}
.uso button:hover{border-color:var(--lago)}
.uso button[aria-pressed="true"]{background:var(--lago);border-color:var(--lago);color:#fff}
.planes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.plan{position:relative;display:flex;flex-direction:column;background:#fff;border:1.5px solid var(--linea);border-radius:var(--r-m);padding:26px 22px 22px;transition:border-color .2s,box-shadow .2s}
.plan.elegido{border-color:var(--lago);box-shadow:0 0 0 3px rgba(15,59,76,.18)}
.plan .sello{display:none;position:absolute;top:-13px;left:22px;background:var(--luz);color:var(--tinta);font-size:13px;font-weight:800;padding:4px 12px;border-radius:999px}
.plan.elegido .sello{display:block}
.plan h3{font-size:21px}
.plan .para{color:var(--texto-3);font-size:15px;margin-top:2px}
.plan .megas{display:flex;align-items:baseline;gap:6px;margin-top:18px}
.plan .megas b{font-family:var(--display);font-size:56px;font-weight:800;letter-spacing:-.05em;line-height:.9;color:var(--lago)}
.plan .megas span{font-weight:700;color:var(--texto-2)}
.haz{height:8px;border-radius:99px;background:var(--niebla-2);margin:14px 0 6px;overflow:hidden}
.haz i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--luz-2),var(--luz));width:0;transition:width 1.1s cubic-bezier(.2,.7,.2,1)}
.plan .sim{font-size:14px;color:var(--texto-3)}
.plan ul.usos{margin:18px 0 0;display:grid;gap:8px;font-size:15px}
.plan ul.usos li{display:flex;gap:9px;align-items:flex-start}
.plan ul.usos .i{color:var(--musgo);width:18px;height:18px;margin-top:3px}
.plan details{margin-top:16px;border-top:1px dashed var(--linea);padding-top:12px;font-size:14px;color:var(--texto-2)}
.plan summary{cursor:pointer;font-weight:700;color:var(--tinta);font-size:15px;list-style:none;display:flex;justify-content:space-between}
.plan summary::-webkit-details-marker{display:none}
.plan summary::after{content:"+";font-size:20px;line-height:1}
.plan details[open] summary::after{content:"–"}
.plan details ul{margin-top:8px;display:grid;gap:4px;list-style:disc;padding-left:18px}
.plan details p{margin-top:8px}
.plan .precio-plan{margin-top:auto;padding-top:18px}
.plan .oferta{display:inline-block;background:var(--copihue-suave);color:var(--copihue-2);font-size:13px;font-weight:700;padding:3px 10px;border-radius:999px}
.plan .monto{font-family:var(--display);font-size:34px;font-weight:800;letter-spacing:-.03em;margin-top:8px;line-height:1.1}
.plan .monto small{font:600 15px var(--cuerpo);color:var(--texto-3);letter-spacing:0}
.plan .despues{font-size:14px;color:var(--texto-2)}
.plan .btn{width:100%;margin-top:16px}
.letra-chica{margin-top:22px;font-size:14px;color:var(--texto-3);max-width:900px}

/* ── Club (bloque en el inicio) ────────────────────────── */
.club-home{background:var(--lago-2);color:#fff;position:relative;overflow:hidden}
.club-home .contenedor{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:center}
.club-home h2{font-size:clamp(34px,4.4vw,56px);letter-spacing:-.04em}
.club-home .bajada{color:#C9DCE2;font-size:18px;margin-top:16px;max-width:48ch}
.club-home .botones{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.rubros{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.rubros li{padding:7px 14px;border-radius:999px;background:rgba(255,255,255,.08);font-size:15px;font-weight:600;color:#E3EEF1}

/* Carnet (se usa en inicio, club y carnet.php) */
.carnet{position:relative;width:100%;max-width:420px;aspect-ratio:1.586;border-radius:22px;padding:24px 26px;color:#fff;background:linear-gradient(135deg,#C8323C 0%,#A62731 46%,#7E1D25 100%);box-shadow:0 30px 60px rgba(0,0,0,.35);overflow:hidden;display:flex;flex-direction:column;justify-content:space-between}
.carnet::after{content:"";position:absolute;right:-60px;top:-80px;width:260px;height:260px;border-radius:50%;border:34px solid rgba(255,255,255,.07)}
.carnet .c-top{display:flex;justify-content:space-between;align-items:flex-start;position:relative;z-index:1}
.carnet .c-marca{font-family:var(--display);font-weight:800;font-size:22px;letter-spacing:-.03em;line-height:1}
.carnet .c-marca small{display:block;font:600 13px var(--cuerpo);letter-spacing:0;color:#FFD9DC;margin-top:4px}
.carnet .c-qr{background:#fff;border-radius:12px;padding:8px;width:34%;aspect-ratio:1;display:flex}
.carnet .c-qr svg,.carnet .c-qr img{width:100%;height:100%}
.carnet .c-nombre{position:relative;z-index:1;font-family:var(--display);font-size:24px;font-weight:700;letter-spacing:-.02em;line-height:1.1}
.carnet .c-dato{font-size:14px;color:#FFD9DC;margin-top:4px}
.club-home .carnet{transform:rotate(-4deg);margin:0 auto}

/* ── Megas en la práctica ─────────────────────────────── */
.dos{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:start}
.lista-ico{display:grid;gap:22px;margin-top:8px}
.lista-ico li{display:grid;grid-template-columns:48px 1fr;gap:16px}
.lista-ico .ico{width:48px;height:48px;border-radius:14px;background:var(--lago-suave);color:var(--lago);display:flex;align-items:center;justify-content:center}
.lista-ico .ico .i{width:24px;height:24px}
.lista-ico h3{font-size:19px}
.lista-ico p{color:var(--texto-2);font-size:16px;margin-top:2px}
.descarga{background:#fff;border-radius:var(--r-l);padding:30px;border:1.5px solid var(--linea)}
.descarga h3{font-size:22px}
.descarga > p{color:var(--texto-3);font-size:15px;margin-top:4px}
.barras{display:grid;gap:16px;margin-top:22px}
.barra .fila{display:flex;justify-content:space-between;font-size:15px;font-weight:600}
.barra .fila b{font-family:var(--display);font-size:18px}
.barra .pista{height:10px;border-radius:99px;background:var(--niebla-2);margin-top:6px;overflow:hidden}
.barra .relleno{height:100%;width:0;border-radius:99px;background:var(--lago);transition:width 1.2s cubic-bezier(.2,.7,.2,1)}
.descarga .nota{font-size:13px;color:var(--texto-3);margin-top:18px}

/* ── TV ────────────────────────────────────────────────── */
.tv{background:#fff;border-radius:var(--r-l);border:1.5px solid var(--linea);padding:44px;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:40px}
.tv h2{font-size:clamp(28px,3.4vw,40px);letter-spacing:-.03em}
.tv p{color:var(--texto-2);margin-top:12px}
.tv ol{margin:20px 0 0;padding-left:22px;display:grid;gap:8px}
.tv .botones{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
.tv .importante{background:var(--niebla);border-radius:var(--r-m);padding:24px;font-size:15px}
.tv .importante h3{font-size:18px}
.tv .importante p{font-size:15px}
.btn-contorno{border-color:var(--lago);color:var(--lago);background:#fff}
.btn-contorno:hover{background:var(--lago-suave)}

/* ── Medio ambiente ────────────────────────────────────── */
.sur{background:var(--musgo-2);color:#fff}
.sur .cabeza-sec p{color:#D5E6D0}
.tres{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.tres li{border-top:2px solid rgba(255,255,255,.3);padding-top:18px}
.tres h3{font-size:21px}
.tres p{color:#D5E6D0;margin-top:8px;font-size:16px}

/* ── Pasos (secuencia real) ───────────────────────────── */
.pasos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;counter-reset:paso}
.paso{position:relative;padding:28px 26px;background:#fff;border-radius:var(--r-m);border:1.5px solid var(--linea)}
.paso::before{counter-increment:paso;content:counter(paso);display:flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:50%;background:var(--lago);color:#fff;font:800 19px var(--display);margin-bottom:16px}
.paso h3{font-size:21px}
.paso p{color:var(--texto-2);margin-top:6px;font-size:16px}

/* ── Cobertura ─────────────────────────────────────────── */
.ciudades{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.ciudades li{background:#fff;border:1.5px solid var(--linea);border-radius:var(--r-m);padding:18px}
.ciudades b{display:block;font-family:var(--display);font-size:19px;letter-spacing:-.01em}
.ciudades span{font-size:14px;color:var(--texto-3)}
.empresas{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:22px}
.empresas > div{background:var(--lago);color:#fff;border-radius:var(--r-m);padding:28px;display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.empresas > div:nth-child(2){background:var(--lago-3)}
.empresas h3{font-size:23px}
.empresas p{color:#C9DCE2}

/* ── Preguntas y contacto ──────────────────────────────── */
.ayuda-grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:40px;align-items:start}
.faq details{border-bottom:1.5px solid var(--linea);padding:18px 0}
.faq summary{cursor:pointer;font-weight:700;font-size:18px;list-style:none;display:flex;justify-content:space-between;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:24px;line-height:1;color:var(--lago)}
.faq details[open] summary::after{content:"–"}
.faq details p{margin-top:10px;color:var(--texto-2)}
.faq a{color:var(--lago);font-weight:700}
.contacto{background:var(--lago);color:#fff;border-radius:var(--r-l);padding:30px;display:flex;flex-direction:column;gap:12px;position:sticky;top:100px}
.contacto h3{font-size:24px}
.contacto p{color:#C9DCE2}
.contacto .btn{justify-content:flex-start}
.contacto .horario{font-size:14px;color:#A9C3CB}

/* ── Cierre ────────────────────────────────────────────── */
.cierre{background:var(--copihue);color:#fff;border-radius:var(--r-l);padding:48px;display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
.cierre h2{font-size:clamp(28px,3.6vw,44px);letter-spacing:-.03em}
.cierre p{color:#FFDADD;margin-top:6px}
.cierre .botones{display:flex;gap:12px;flex-wrap:wrap}
.cierre .btn-luz{color:var(--tinta)}

/* ── Pie de página ─────────────────────────────────────── */
footer{background:var(--lago-2);color:#A9C3CB;padding:64px 0 28px;font-size:15px}
footer .cols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px}
footer h4{color:#fff;font-size:16px;margin-bottom:12px;font-family:var(--cuerpo)}
footer ul{display:grid;gap:8px}
footer a{color:#DCE8EC;text-decoration:none}
footer a:hover{text-decoration:underline}
footer .base{border-top:1px solid rgba(255,255,255,.1);margin-top:40px;padding-top:22px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px}

/* ── Botones flotantes ─────────────────────────────────── */
.wa-flotante{position:fixed;right:24px;bottom:24px;z-index:60;width:60px;height:60px;border-radius:50%;background:var(--wa);display:flex;align-items:center;justify-content:center;box-shadow:0 8px 22px rgba(0,0,0,.22)}
.wa-flotante svg{width:30px;height:30px;fill:#fff}
.barra-movil{display:none}

/* ── Páginas internas ──────────────────────────────────── */
.cabeza{background:var(--lago);color:#fff;padding:56px 0 64px;position:relative;overflow:hidden}
.cabeza::before{content:"";position:absolute;inset:0;background:inherit;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='520' height='260' viewBox='0 0 520 260'%3E%3Cg fill='none' stroke='%23ffffff' stroke-opacity='.06' stroke-width='1.2'%3E%3Cpath d='M-20 60c80-40 150 30 240-10s160-70 320 0'/%3E%3Cpath d='M-20 120c90-30 160 40 250 0s150-60 310 10'/%3E%3Cpath d='M-20 190c70-50 170 20 260-20s170-50 300 20'/%3E%3C/g%3E%3C/svg%3E");pointer-events:none}
.cabeza .contenedor{position:relative}
.migas{font-size:14px;color:#A9C3CB;margin-bottom:14px}
.migas a{color:#fff}
.cabeza h1{font-size:clamp(38px,5vw,62px);letter-spacing:-.04em;font-weight:800}
.cabeza p.bajada{color:#C9DCE2;font-size:19px;margin-top:12px;max-width:56ch}

.prosa-grid{display:grid;grid-template-columns:240px minmax(0,1fr);gap:48px;align-items:start}
.indice{position:sticky;top:100px;font-size:14px}
.indice b{display:block;margin-bottom:10px;font-size:15px}
.indice ol{margin:0;padding-left:20px;display:grid;gap:6px;color:var(--texto-3)}
.indice a{color:var(--texto-2);text-decoration:none}
.indice a:hover{color:var(--lago);text-decoration:underline}
.prosa{background:#fff;border-radius:var(--r-l);padding:44px 48px;border:1.5px solid var(--linea);max-width:820px}
.prosa .intro{font-size:19px;color:var(--texto-2)}
.prosa h2{font-size:26px;margin:40px 0 12px;scroll-margin-top:100px;display:flex;gap:12px;align-items:baseline}
.prosa h2 .num{font:700 15px var(--cuerpo);color:var(--copihue);min-width:24px}
.prosa p{margin:10px 0;color:var(--tinta)}
.prosa ul,.prosa ol{margin:10px 0;padding-left:22px;list-style:disc;display:grid;gap:6px}
.prosa a{color:var(--lago);font-weight:600}
.aviso{background:var(--luz);background:#FFF4DA;border-left:4px solid var(--luz-2);border-radius:10px;padding:16px 18px;margin:18px 0}
.aviso-oscuro{background:var(--lago-suave);border-left-color:var(--lago)}
.resumen{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:28px}
.resumen div{background:var(--niebla);border-radius:12px;padding:16px}
.resumen b{display:block;font-family:var(--display);font-size:18px}
.resumen span{font-size:14px;color:var(--texto-2)}

.tabla{width:100%;border-collapse:collapse;background:#fff;border-radius:var(--r-m);overflow:hidden;border:1.5px solid var(--linea)}
.tabla th,.tabla td{text-align:left;padding:16px 20px;border-bottom:1px solid var(--linea);vertical-align:top}
.tabla th{background:var(--niebla-2);font-size:14px}
.tabla td small{display:block;color:var(--texto-3);font-size:14px}
.tabla td.valor{font-family:var(--display);font-weight:700;font-size:20px;white-space:nowrap}
.tabla tr:last-child td{border-bottom:0}

/* ── Responsive ────────────────────────────────────────── */
@media (max-width:1100px){
    .menu{display:none}
    .hamburguesa{display:inline-flex}
    .acciones .btn-lago-top{display:none}
    .planes{grid-template-columns:repeat(2,minmax(0,1fr))}
    .fila-form{grid-template-columns:1fr 1fr}
    .fila-form .btn{grid-column:1/-1}
    .fila-form.pago{grid-template-columns:1fr}
    .ciudades{grid-template-columns:repeat(3,minmax(0,1fr))}
    footer .cols{grid-template-columns:1fr 1fr}
    .prosa-grid{grid-template-columns:1fr}
    .indice{position:static}
}
@media (max-width:860px){
    .portada{padding:40px 0 56px}
    .portada .contenedor,.club-home .contenedor,.dos,.tv,.ayuda-grid{grid-template-columns:1fr}
    .ruta svg{max-width:360px;margin:0 auto}
    .tres,.pasos{grid-template-columns:1fr}
    .empresas{grid-template-columns:1fr}
    .contacto{position:static}
    .resumen{grid-template-columns:1fr}
}
@media (max-width:640px){
    body{font-size:16px;padding-bottom:78px}
    .contenedor{padding:0 18px}
    .barra-top .horario,.barra-top .lado a.sop{display:none}
    .logo{font-size:24px}
    .acciones .btn-rojo{display:none}
    .seccion{padding:68px 0}
    .planes{grid-template-columns:1fr}
    .fila-form{grid-template-columns:1fr}
    .caja{padding:22px 18px}
    .ciudades{grid-template-columns:1fr 1fr}
    .tv,.prosa{padding:26px 20px}
    .cierre{padding:32px 24px}
    footer .cols{grid-template-columns:1fr}
    .wa-flotante{display:none}
    .barra-movil{display:grid;grid-template-columns:1fr 1fr;gap:10px;position:fixed;left:0;right:0;bottom:0;z-index:60;background:#fff;border-top:1px solid var(--linea);padding:10px 14px calc(10px + env(safe-area-inset-bottom));box-shadow:0 -6px 18px rgba(10,44,57,.12)}
    .barra-movil .btn{min-height:50px;padding:10px}
    .tabla th:first-child,.tabla td:first-child{display:none}
}
@media (prefers-reduced-motion:reduce){
    html{scroll-behavior:auto}
    *{transition:none !important;animation:none !important}
}
.paso.sin-num::before{display:none}
.resumen small{display:block;font-size:13px;color:var(--texto-3)}
.prosa .fecha{margin-top:28px;font-size:14px;color:var(--texto-3)}
.tabla td:first-child{width:56px;color:var(--lago)}

/* ── Club FibraTel ─────────────────────────────────────── */
.club-portada{padding:56px 0 88px}
.club-portada .migas{color:#A9C3CB}
.club-portada h1{max-width:none}
.club-portada .contenedor{align-items:center}
.filtros{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:24px}
.filtros .campo{min-width:220px}
.beneficios{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.beneficio{border:1.5px solid var(--linea);border-radius:var(--r-m);padding:22px;background:var(--niebla)}
.b-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.b-desc{font-family:var(--display);font-weight:800;font-size:40px;letter-spacing:-.04em;color:var(--copihue);line-height:1}
.b-ejemplo{font-size:12px;font-weight:700;background:var(--luz);color:var(--tinta);padding:3px 10px;border-radius:999px}
.beneficio h3{font-size:20px}
.b-meta{font-size:14px;color:var(--texto-3);margin-top:2px}
.b-detalle{margin-top:10px;font-size:15px;color:var(--texto-2)}
.b-dir{margin-top:8px;font-size:14px;font-weight:600}
.vacio{padding:24px;border:1.5px dashed var(--linea);border-radius:var(--r-m);color:var(--texto-2)}
.vacio a{color:var(--lago);font-weight:700}
.condiciones{display:grid;gap:10px;max-width:760px}
.condiciones li{position:relative;padding-left:22px}
.condiciones li::before{content:"";position:absolute;left:0;top:10px;width:8px;height:8px;border-radius:50%;background:var(--copihue)}
.condiciones a{color:var(--lago);font-weight:700}
.validar-guia{background:#fff;color:var(--tinta);border-radius:var(--r-l);padding:30px}
.validar-guia h3{font-size:24px}
.validar-guia ol{margin:16px 0 0;padding-left:22px;display:grid;gap:12px;color:var(--texto-2)}
.validar-guia ol b{color:var(--tinta)}
.validar-guia .ojo{display:flex;gap:10px;margin-top:18px;background:var(--lago-suave);border-radius:12px;padding:14px;font-size:15px}
.validar-guia .ojo .i{color:var(--lago);margin-top:2px}

/* Carnet (carnet.php) */
.caja-carnet{max-width:520px;background:#fff;border-radius:var(--r-l);padding:32px;border:1.5px solid var(--linea)}
.trampa{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.nota-seg{display:flex;gap:8px;align-items:flex-start;font-size:14px;color:var(--texto-3);margin-top:16px}
.nota-seg .i{width:18px;height:18px;color:var(--musgo);margin-top:2px}
.carnet-listo{display:grid;grid-template-columns:minmax(0,440px) minmax(0,1fr);gap:48px;align-items:start}
.carnet-real{max-width:440px}
.carnet-real .c-qr{width:40%}
.estado-carnet{display:flex;gap:10px;align-items:flex-start;margin-top:20px;padding:14px 16px;border-radius:12px;font-weight:600;font-size:15px}
.estado-carnet.ok{background:var(--musgo-suave);color:var(--musgo-2)}
.estado-carnet.no{background:var(--copihue-suave);color:var(--copihue-2);display:block}
.estado-carnet a{color:inherit;font-weight:800}
.guardar h2{font-size:30px}
.guardar ol{margin:16px 0 22px;padding-left:22px;display:grid;gap:10px;color:var(--texto-2)}
.guardar ol b{color:var(--tinta)}
.guardar > p a:not(.btn){color:var(--lago);font-weight:700}
.aviso-demo{background:var(--luz);color:var(--tinta);text-align:center;font-weight:800;font-size:14px;padding:8px 12px;position:relative;z-index:70}

/* Validación (validar.php): pantalla completa para la tienda */
.validacion{min-height:78vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:36px 22px 40px;color:#fff;background:var(--musgo-2);transition:filter .3s}
.validacion.ok{background:#1E7A3C}
.validacion.no{background:#B3262F}
.validacion.gris{background:#4A5A60}
.validacion.caducada{filter:grayscale(1) brightness(.75)}
.v-marca{font-family:var(--display);font-weight:800;font-size:20px;letter-spacing:-.02em;opacity:.95}
.v-marca .logo-txt span{color:#fff;opacity:.75}
.v-sello{width:132px;height:132px;border-radius:50%;background:rgba(255,255,255,.16);display:flex;align-items:center;justify-content:center;margin:26px 0 18px;position:relative}
.v-sello svg{width:76px;height:76px}
.validacion.ok .v-sello::after{content:"";position:absolute;inset:-10px;border-radius:50%;border:3px solid rgba(255,255,255,.5);animation:latido 1.6s ease-out infinite}
@keyframes latido{from{transform:scale(.9);opacity:1}to{transform:scale(1.25);opacity:0}}
.validacion h1{font-size:clamp(40px,10vw,64px);font-weight:800;letter-spacing:-.04em}
.v-detalle{max-width:30ch;margin-top:10px;font-size:18px;opacity:.95}
.ficha{display:grid;grid-template-columns:repeat(3,auto);gap:10px 26px;margin:26px 0 0;background:rgba(0,0,0,.18);border-radius:16px;padding:16px 22px;text-align:left}
.ficha dt{font-size:13px;opacity:.8}
.ficha dd{margin:0;font-family:var(--display);font-weight:700;font-size:22px}
.v-reloj{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px 12px;margin-top:24px;font-size:15px}
.v-reloj b{font-family:var(--display);font-size:30px;letter-spacing:.02em;font-variant-numeric:tabular-nums}
.v-reloj .punto{width:10px;height:10px;border-radius:50%;background:#fff;animation:parpadeo 1s steps(2) infinite}
@keyframes parpadeo{50%{opacity:.2}}
.v-caduca{margin-top:14px;background:#fff;color:var(--tinta);padding:10px 16px;border-radius:10px;font-weight:700}
.v-guia{max-width:640px;margin:0 auto;padding:30px 22px 48px}
.v-guia h2{font-size:22px}
.v-guia ul{margin:12px 0;padding-left:20px;list-style:disc;display:grid;gap:8px;color:var(--texto-2)}
.v-guia a{color:var(--lago);font-weight:700}

@media (max-width:1100px){.beneficios{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:860px){.carnet-listo{grid-template-columns:1fr}}
@media (max-width:640px){
    .beneficios{grid-template-columns:1fr}
    .ficha{grid-template-columns:1fr 1fr}
    .ficha div:first-child{grid-column:1/-1}
    .caja-carnet{padding:22px}
    .validacion{min-height:70vh}
}
@media (prefers-reduced-motion:reduce){.v-reloj .punto{animation:none}}

/* Panel contratar/pagar dentro de la portada (a la derecha) */
.portada .panel{color:var(--tinta);border:0;box-shadow:0 28px 60px rgba(4,22,30,.45)}
.fila-form.apilado{grid-template-columns:1fr;gap:14px}
.fila-form.apilado .btn{width:100%;grid-column:auto}
.portada .pestanas button{font-size:15px;min-height:48px}
/* Mapa de ciudades en la sección Cobertura */
.cobertura-grid{display:grid;grid-template-columns:minmax(0,400px) minmax(0,1fr);gap:28px;align-items:start}
.mapa-caja{background:var(--lago);border-radius:var(--r-l);padding:22px 18px}
.mapa-caja svg{margin:0 auto;max-width:360px}
.cobertura-grid .ciudades{grid-template-columns:1fr 1fr}
@media (max-width:1100px){.cobertura-grid{grid-template-columns:1fr}.mapa-caja svg{max-width:340px}}
@media (max-width:860px){.portada .contenedor{grid-template-columns:1fr}}
.tabla tr.grupo th{background:var(--lago);color:#fff;font-size:15px;padding:12px 20px}
.tabla td.valor.consultar{font:600 15px var(--cuerpo);color:var(--texto-3)}
@media (max-width:640px){.tabla tr.grupo th{display:table-cell}}