/* Sabora · sitio v2 (rediseño 03-11-2026). Marca A3 · Sello lima, tokens en tokens.css.
   Público adulto: cuerpo >= 1.1rem, etiquetas >= 0.9rem, buen contraste. */
*{box-sizing:border-box}
html{font-size:18px;-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--sab-hueso);color:var(--sab-verde-noche);font-family:var(--sab-fuente-texto);font-size:1.15rem;line-height:1.6}
img{max-width:100%;display:block}
a{color:inherit}
:focus-visible{outline:3px solid var(--sab-lima-profundo);outline-offset:3px}
.cont{max-width:1240px;margin:0 auto;padding:0 28px}
h1,h2,h3{font-family:var(--sab-fuente-titulos);margin:0 0 .45em;line-height:1.06;letter-spacing:-.02em}
h1{font-size:clamp(2.4rem,5.2vw,4rem);font-weight:900}
h2{font-size:clamp(1.95rem,3.8vw,3rem);font-weight:900}
h3{font-size:1.45rem;font-weight:700;line-height:1.2}
p{margin:0 0 1em}
.lead{font-size:1.3rem;line-height:1.55}
.kicker{display:inline-flex;align-items:center;gap:.55em;font-family:var(--sab-fuente-titulos);font-weight:700;font-size:.95rem;letter-spacing:.06em;text-transform:uppercase;color:var(--sab-musgo);margin-bottom:1em}
.kicker::before{content:"";width:.7em;height:.7em;border-radius:50%;background:var(--sab-lima-profundo)}
.oscuro .kicker{color:var(--sab-lima)}.oscuro .kicker::before{background:var(--sab-lima)}
.nota{font-size:1.05rem;color:var(--sab-musgo)}
.oscuro .nota{color:#C9D3CB}
.prox{display:inline-block;font-size:.9rem;font-weight:600;color:var(--sab-musgo);border:2px dashed var(--sab-musgo);border-radius:999px;padding:0 .65em;white-space:nowrap;line-height:1.55;vertical-align:.08em}
.porconfirmar{display:inline-block;font-size:.95rem;font-weight:600;color:var(--sab-musgo);background:rgba(63,94,75,.1);border-radius:999px;padding:.1em .8em}
.oscuro .porconfirmar{color:#E6EADF;background:rgba(244,243,234,.12)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* Cabecera */
.cab{background:rgba(244,243,234,.96);backdrop-filter:saturate(1.2) blur(6px);border-bottom:1px solid rgba(63,94,75,.18);position:sticky;top:0;z-index:40}
.cab .cont{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:80px}
.logo{flex-shrink:0}
.logo img{height:58px;width:auto;max-width:none;margin-left:-11px}
.nav{display:flex;align-items:center;gap:4px}
.nav a{text-decoration:none;font-weight:500;font-size:1.05rem;padding:.5em .8em;border-radius:999px}
.nav a:hover{background:rgba(63,94,75,.12)}
.nav a[aria-current=page]{background:var(--sab-verde-noche);color:var(--sab-hueso)}
.nav .boton{margin-left:8px}
.menu-movil{display:none}
.menu-movil summary{list-style:none;cursor:pointer;font-weight:600;font-size:1.05rem;border:2px solid var(--sab-verde-noche);border-radius:999px;padding:.45em 1.05em}
.menu-movil summary::-webkit-details-marker{display:none}
.menu-movil nav{position:absolute;left:0;right:0;top:80px;background:var(--sab-hueso);border-bottom:1px solid rgba(63,94,75,.25);padding:8px 24px 24px;display:flex;flex-direction:column;box-shadow:0 18px 30px rgba(11,43,34,.14)}
.menu-movil nav a{font-size:1.2rem;padding:.8em .2em;border-bottom:1px solid rgba(63,94,75,.18);text-decoration:none}

/* Botones */
.boton{display:inline-block;text-decoration:none;font-family:var(--sab-fuente-titulos);font-weight:700;font-size:1.15rem;padding:.85em 1.6em;border-radius:999px;
  border:2px solid var(--sab-verde-noche);cursor:pointer;text-align:center;line-height:1.25;background:transparent;color:var(--sab-verde-noche)}
.boton.prim{background:var(--sab-verde-noche);color:var(--sab-lima)}
.boton.prim:hover{background:#123d31}
.boton:not(.prim):hover{background:rgba(63,94,75,.1)}
.boton.chico{font-size:1rem;padding:.6em 1.15em}
.oscuro .boton.prim,.boton.lima{background:var(--sab-lima);color:var(--sab-verde-noche);border-color:var(--sab-lima)}
.oscuro .boton.prim:hover{background:#d3f56f}
.oscuro .boton:not(.prim){color:var(--sab-hueso);border-color:var(--sab-hueso)}
.oscuro .boton:not(.prim):hover{background:rgba(244,243,234,.1)}
.botones{display:flex;flex-wrap:wrap;gap:12px;margin:1.5em 0 .7em}
.enlace{font-weight:700;font-family:var(--sab-fuente-titulos);text-decoration:none;border-bottom:3px solid var(--sab-lima-profundo)}
.oscuro .enlace{border-color:var(--sab-lima)}

section{padding:104px 0}
.oscuro{background:var(--sab-verde-noche);color:var(--sab-hueso)}
.oscuro h1,.oscuro h2,.oscuro h3{color:var(--sab-hueso)}
.blanco{background:#fff}
.musgo{background:var(--sab-musgo);color:var(--sab-hueso)}
.encab{max-width:820px;margin-bottom:48px}

/* HERO */
.hero{padding:72px 0 96px;overflow:hidden;position:relative}
.hero .cont{display:grid;grid-template-columns:.95fr 1.15fr;gap:48px;align-items:center}
.hero h1 .lima{color:var(--sab-lima)}
.hero .lead{color:#E6EADF}
.hero-escena{position:relative}
.hero-ilus{border-radius:24px;overflow:hidden;box-shadow:0 30px 70px rgba(0,0,0,.35);position:relative}
.hero-ilus img{width:100%;height:auto}
.hero-demo{position:absolute;left:-14%;bottom:-12%;width:66%}
.hero-pasos{list-style:none;margin:0 0 20px;padding:0;display:flex;gap:8px;flex-wrap:wrap}
.hero-pasos li{display:flex;align-items:center;gap:.5em;background:rgba(244,243,234,.1);border:1px solid rgba(244,243,234,.25);border-radius:999px;padding:.35em .95em .35em .4em;font-weight:600;font-size:1rem;color:var(--sab-hueso)}
.hero-pasos li b{width:1.7em;height:1.7em;border-radius:50%;background:var(--sab-lima);color:var(--sab-verde-noche);display:grid;place-items:center;font-family:var(--sab-fuente-titulos);font-size:.95rem}
.chip-flota{position:absolute;display:flex;align-items:center;gap:.6em;background:#fff;color:var(--sab-verde-noche);border-radius:16px;padding:.55em .9em .55em .55em;box-shadow:0 16px 36px rgba(0,0,0,.3);font-weight:600;font-size:1rem;line-height:1.25}
.chip-flota img{width:44px;height:44px;object-fit:contain}
.chip-flota .check{width:40px;height:40px;border-radius:50%;background:var(--sab-lima);display:grid;place-items:center;font-weight:900;font-size:1.2rem;flex:none}
.chip-flota small{display:block;color:var(--sab-musgo);font-weight:500;font-size:.9rem}
.chip-inv{right:-4%;top:8%}
.chip-caja{right:4%;bottom:-6%}

/* Franja */
.franja{background:var(--sab-lima);color:var(--sab-verde-noche);padding:26px 0}
.franja ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 28px}
.franja li{font-family:var(--sab-fuente-titulos);font-weight:700;font-size:1.12rem;display:flex;align-items:center;gap:.55em}
.franja li::before{content:"✓";width:1.35em;height:1.35em;border-radius:50%;background:var(--sab-verde-noche);color:var(--sab-lima);display:grid;place-items:center;font-size:.85em}

/* Véalo funcionar: escenas */
.escenas{display:grid;gap:120px}
.escena{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.escena:nth-child(even) .escena-texto{order:2}
.escena-num{font-family:var(--sab-fuente-titulos);font-weight:900;font-size:1rem;letter-spacing:.06em;color:var(--sab-musgo);display:flex;align-items:center;gap:.7em;margin-bottom:1em}
.escena-num b{width:2.4em;height:2.4em;border-radius:50%;background:var(--sab-verde-noche);color:var(--sab-lima);display:grid;place-items:center;font-size:1.05rem}
.escena-texto ul{padding-left:1.2em;margin:0}.escena-texto li{margin-bottom:.5em}.escena-texto li::marker{color:var(--sab-lima-profundo)}
.escena-vis{position:relative;padding-bottom:18%}
.escena-ilus{border-radius:22px;overflow:hidden;position:relative;box-shadow:0 20px 50px rgba(11,43,34,.18)}
.escena-ilus img{width:100%;height:auto}
.escena-pant{position:absolute;right:-6%;bottom:0;width:72%}
.escena-vis.mon .escena-pant{width:80%;right:-8%}
.escena-vis.movil .escena-pant{width:34%;right:-2%}
.escena-vis.doble .escena-pant{width:64%;right:auto;left:-6%}
.escena-vis.doble .escena-movil{position:absolute;right:-4%;bottom:-4%;width:30%}
/* mini-pantalla encima del dispositivo de la ilustración */
.mini{position:absolute;border-radius:6px;overflow:hidden;background:var(--sab-hueso);display:grid;place-items:center}
.mini .m-check{width:44%;aspect-ratio:1;border-radius:50%;background:var(--sab-lima);display:grid;place-items:center;font-weight:900;color:var(--sab-verde-noche);font-size:clamp(18px,2.2vw,30px)}
.mini.kds{background:#123A2E;display:grid;grid-template-columns:repeat(3,1fr);gap:6%;padding:7%}
.mini.kds i{background:var(--sab-hueso);border-radius:4px;border-top:5px solid var(--sab-lima-profundo)}
.mini.kds i:nth-child(2){border-color:#E0A526}.mini.kds i:nth-child(3){border-color:#B3261E}
.mini.barras{padding:10%;display:grid;gap:9%;align-content:center}
.mini.barras i{height:10px;border-radius:99px;background:linear-gradient(90deg,var(--sab-musgo) var(--w),#E0E3D8 var(--w))}

/* Plano en celular (sección editorial) */
.dividido{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.dividido .disp-movil{max-width:340px}

/* Cifras */
.cifras{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid rgba(244,243,234,.25)}
.cifra{padding:28px 24px 8px 0;border-right:1px solid rgba(244,243,234,.2)}
.cifra:last-child{border-right:0}
.cifra + .cifra{padding-left:24px}
.cifra strong{display:block;font-family:var(--sab-fuente-titulos);font-weight:900;font-size:clamp(2.4rem,4.6vw,3.6rem);line-height:1;color:var(--sab-lima)}
.cifra span{display:block;margin-top:.5em;font-size:1.1rem;color:#E6EADF}

/* Frase grande */
.frase{font-family:var(--sab-fuente-titulos);font-weight:900;font-size:clamp(1.9rem,4vw,3.1rem);line-height:1.12;letter-spacing:-.02em;max-width:1000px;margin:0}
.frase em{font-style:normal;background:linear-gradient(transparent 62%,var(--sab-lima) 62%)}

/* Fotos */
.fotos{display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:16px;margin-top:40px}
.fotos figure{margin:0;border-radius:20px;overflow:hidden;position:relative;aspect-ratio:3/4}
.fotos figure:first-child{aspect-ratio:auto;grid-row:span 1}
.fotos img{width:100%;height:100%;object-fit:cover}
.fotos figcaption{position:absolute;left:12px;bottom:12px;background:rgba(11,43,34,.85);color:var(--sab-hueso);font-size:.95rem;font-weight:600;border-radius:999px;padding:.3em .9em}

/* Por negocio: lista editorial */
.negocios{list-style:none;margin:0;padding:0;border-top:2px solid var(--sab-verde-noche)}
.negocios li a{display:grid;grid-template-columns:minmax(150px,1fr) 2.2fr auto;gap:24px;align-items:center;padding:26px 6px;border-bottom:1px solid rgba(63,94,75,.25);text-decoration:none}
.negocios li a:hover{background:rgba(196,238,74,.18)}
.negocios h3{margin:0;font-size:1.7rem;font-weight:900}
.negocios p{margin:0}
.negocios .flecha{font-family:var(--sab-fuente-titulos);font-weight:700;white-space:nowrap}

/* Planes */
.planes{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;align-items:stretch}
.plan{background:#fff;border:1px solid rgba(63,94,75,.22);border-radius:22px;padding:30px;display:flex;flex-direction:column}
.plan.medio{border:3px solid var(--sab-verde-noche)}
.plan h3{font-size:1.6rem;margin-bottom:.15em}
.plan .ideal{color:var(--sab-musgo);font-size:1.05rem;margin-bottom:.8em}
.precio{font-family:var(--sab-fuente-titulos);font-weight:900;font-size:2.4rem;line-height:1.05;margin:.1em 0}
.precio small{font-family:var(--sab-fuente-texto);font-size:1rem;font-weight:500;color:var(--sab-musgo);white-space:nowrap}
.plan ul{padding-left:1.2em;margin:0 0 1.4em;flex:1}.plan li{margin-bottom:.5em}.plan li::marker{color:var(--sab-lima-profundo)}
.plan .boton{margin-top:auto}
.destacado-banda{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 32px;margin-top:20px;background:var(--sab-verde-noche);color:var(--sab-hueso);border-radius:22px;padding:26px 30px}
.destacado-banda strong{font-family:var(--sab-fuente-titulos);color:var(--sab-lima);font-size:1.35rem}

/* Pestañas de combos */
.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:24px}
.tab{font:inherit;font-family:var(--sab-fuente-titulos);font-weight:700;font-size:1.05rem;padding:.6em 1.15em;border-radius:999px;border:2px solid var(--sab-verde-noche);background:transparent;color:var(--sab-verde-noche);cursor:pointer}
.tab[aria-selected=true]{background:var(--sab-verde-noche);color:var(--sab-lima)}
.panel{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.panel[hidden]{display:none}
.combo{background:#fff;border:1px solid rgba(63,94,75,.22);border-radius:22px;padding:30px;display:flex;flex-direction:column}
.combo h3{font-size:1.6rem}
.combo .incluye{list-style:none;padding:0;margin:0 0 1em;flex:1}
.combo .incluye li{padding:.35em 0 .35em 1.6em;position:relative;border-bottom:1px dashed rgba(63,94,75,.22)}
.combo .incluye li::before{content:"+";position:absolute;left:0;font-weight:900;color:var(--sab-lima-profundo)}
.combo .antes{color:var(--sab-musgo);margin:.2em 0}
.ahorro{display:inline-block;align-self:flex-start;background:var(--sab-lima);color:var(--sab-verde-noche);font-family:var(--sab-fuente-titulos);font-weight:700;font-size:1rem;border-radius:999px;padding:.3em 1em;margin:.4em 0 1.3em}
.combo.reco{background:var(--sab-verde-noche);color:var(--sab-hueso);border:0}
.combo.reco h3{color:var(--sab-hueso)}
.combo.reco .precio{color:var(--sab-lima)}
.combo.reco .precio small,.combo.reco .antes{color:#C9D3CB}
.combo.reco .prox{color:#E6EADF;border-color:#C9D3CB}
.combo.reco .incluye li{border-color:rgba(244,243,234,.2)}
.combo.reco .boton{background:var(--sab-lima);color:var(--sab-verde-noche);border-color:var(--sab-lima)}
.combo .etq{align-self:flex-start;background:var(--sab-lima);color:var(--sab-verde-noche);font-family:var(--sab-fuente-titulos);font-weight:700;font-size:.95rem;border-radius:999px;padding:.2em .9em;margin-bottom:.8em}
.combo .boton{margin-top:auto}
.panel-nota{grid-column:1/-1;margin:0}

/* Plegables y tablas */
details.pleg{background:#fff;border:1px solid rgba(63,94,75,.22);border-radius:20px;margin-bottom:14px;overflow:hidden}
details.pleg>summary{list-style:none;cursor:pointer;padding:22px 26px;font-family:var(--sab-fuente-titulos);font-weight:700;font-size:1.3rem;display:flex;justify-content:space-between;align-items:center;gap:16px}
details.pleg>summary::-webkit-details-marker{display:none}
details.pleg>summary::after{content:"+";flex:none;width:1.6em;height:1.6em;border-radius:50%;background:var(--sab-lima);display:grid;place-items:center;font-weight:900}
details.pleg[open]>summary::after{content:"–"}
details.pleg>summary small{display:block;font-family:var(--sab-fuente-texto);font-weight:500;font-size:1rem;color:var(--sab-musgo)}
details.pleg .dentro{padding:0 26px 24px}
.tabla{width:100%;border-collapse:collapse;font-size:1.1rem}
.tabla th,.tabla td{padding:14px 12px;border-bottom:1px solid rgba(63,94,75,.18);text-align:left;vertical-align:top}
.tabla th{font-family:var(--sab-fuente-titulos);font-size:1rem;background:var(--sab-hueso)}
.tabla td.monto{font-family:var(--sab-fuente-titulos);font-weight:900;white-space:nowrap}
.tabla td.c,.tabla th.c{text-align:center}
.si{display:inline-grid;place-items:center;width:1.6em;height:1.6em;border-radius:50%;background:var(--sab-lima);font-weight:900}
.no{color:#9AA79E;font-weight:700}
.tabla-env{overflow-x:auto;border-radius:16px;border:1px solid rgba(63,94,75,.22);background:#fff}

/* Preguntas */
details.faq{border-bottom:1px solid rgba(63,94,75,.25)}
details.faq summary{list-style:none;cursor:pointer;padding:22px 0;font-family:var(--sab-fuente-titulos);font-weight:700;font-size:1.25rem;display:flex;justify-content:space-between;gap:16px}
details.faq summary::-webkit-details-marker{display:none}
details.faq summary::after{content:"+";flex:none;width:1.5em;height:1.5em;border-radius:50%;background:var(--sab-lima);display:grid;place-items:center;font-weight:900}
details.faq[open] summary::after{content:"–"}
details.faq p{margin:0 0 22px;max-width:820px}

/* Funciones: lista editorial de módulos */
.modulos{display:grid;grid-template-columns:repeat(2,1fr);gap:0 56px}
.modulo{padding:30px 0;border-top:2px solid var(--sab-verde-noche)}
.modulo h3{font-size:1.5rem}
.modulo ul{padding-left:1.2em;margin:0}.modulo li{margin-bottom:.45em}.modulo li::marker{color:var(--sab-lima-profundo)}
.servicios-dig{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:2px solid var(--sab-hueso)}
.servicios-dig div{padding:26px 22px 8px 0}
.servicios-dig div + div{padding-left:22px;border-left:1px solid rgba(244,243,234,.22)}
.servicios-dig h3{color:var(--sab-lima)}
.servicios-dig p{color:#E6EADF}

/* Formulario */
form .campo{margin-bottom:18px}
label{display:block;font-weight:600;font-size:1.05rem;margin-bottom:6px}
input,select,textarea{width:100%;font:inherit;font-size:1.15rem;padding:.75em .9em;border:2px solid rgba(63,94,75,.45);border-radius:12px;background:#fff;color:var(--sab-verde-noche)}
input:focus,select:focus,textarea:focus{outline:3px solid var(--sab-lima-profundo);border-color:var(--sab-verde-noche)}
.casilla{display:flex;gap:12px;align-items:flex-start;font-weight:500}
.casilla input{width:26px;height:26px;flex:none;margin-top:3px;accent-color:var(--sab-verde-noche)}
.aviso{background:#fff;border:2px dashed var(--sab-musgo);border-radius:16px;padding:14px 18px;font-size:1.05rem}
.resultado{display:none;margin-top:16px}.resultado.visible{display:block}
.trampa{position:absolute;left:-5000px;width:1px;height:1px;overflow:hidden}
.error-campo{color:var(--sab-error);font-size:1rem;font-weight:600;margin:6px 0 0}
input[aria-invalid=true],select[aria-invalid=true]{border-color:var(--sab-error)}
.resultado.ok{border:2px solid var(--sab-verde-noche);background:var(--sab-verde-noche);color:var(--sab-hueso)}
.resultado.ok strong{color:var(--sab-lima);font-family:var(--sab-fuente-titulos);font-size:1.3rem;display:block;margin-bottom:4px}
.resultado.falla{border:2px solid var(--sab-error)}
.resultado.falla strong{color:var(--sab-error)}
.resultado .boton{margin-top:12px}
button[type=submit][disabled]{opacity:.7;cursor:progress}
.pasos{list-style:none;counter-reset:p;padding:0;margin:0}
.pasos li{counter-increment:p;display:grid;grid-template-columns:2.4em 1fr;gap:14px;align-items:start;margin-bottom:18px}
.pasos li::before{content:counter(p);width:2.2em;height:2.2em;border-radius:50%;background:var(--sab-lima);color:var(--sab-verde-noche);display:grid;place-items:center;font-family:var(--sab-fuente-titulos);font-weight:900}

/* Cierre y pie */
.cierre{text-align:center}
.cierre p{max-width:720px;margin-left:auto;margin-right:auto;color:#E6EADF}
.cierre .botones{justify-content:center}
.pie{background:#071E17;color:#E6EADF;padding:60px 0 104px;font-size:1.1rem}
.pie a{color:var(--sab-hueso)}
.pie .rej{display:grid;grid-template-columns:2fr 1fr 1fr;gap:28px}
.pie ul{list-style:none;padding:0;margin:0}.pie li{margin-bottom:.6em}
.pie strong{color:var(--sab-lima);font-family:var(--sab-fuente-titulos)}
.pie .logo-pie{height:64px;width:auto;margin:0 0 12px -13px}

/* ===== Animaciones (solo con .anim, que JS pone si no hay prefers-reduced-motion) ===== */
@keyframes aparece{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes entraIzq{from{opacity:0;transform:translateX(-60%) scale(.9)}to{opacity:1;transform:none}}
@keyframes pulso{0%{box-shadow:0 0 0 0 rgba(155,201,42,.7)}100%{box-shadow:0 0 0 14px rgba(155,201,42,0)}}
@keyframes baja{from{width:var(--ini)}to{width:var(--fin)}}
@keyframes pop{0%{transform:scale(.3);opacity:0}70%{transform:scale(1.12);opacity:1}100%{transform:scale(1)}}
.anim .en-espera .a-linea1,.anim .en-espera .a-linea2,.anim .en-espera .a-linea3,.anim .en-espera .a-check,.anim .en-espera .a-burbuja,
.anim .en-espera .a-nueva,.anim .en-espera .a-menos,.anim .en-espera .m-check,.anim .en-espera .chip-flota{opacity:0}
.anim .en-espera .px-barra-stock i{width:var(--ini)}
.anim .en-vivo .a-tap{animation:pulso .9s ease-out .2s 2}
.anim .en-vivo .a-linea1{animation:aparece .5s ease-out .5s both}
.anim .en-vivo .a-tap2{animation:pulso .9s ease-out 1.1s 1}
.anim .en-vivo .a-linea2{animation:aparece .5s ease-out 1.3s both}
.anim .en-vivo .a-linea3{animation:aparece .5s ease-out 1.8s both}
.anim .en-vivo .a-enviar{animation:pulso 1s ease-out 2.4s 2}
.anim .en-vivo .m-check{animation:pop .6s ease-out 2.8s both}
.anim .en-vivo .a-nueva{animation:entraIzq .8s cubic-bezier(.2,.8,.2,1) .4s both}
.anim .en-vivo .px-barra-stock i{animation:baja 1.6s ease-in-out .6s both}
.anim .en-vivo .a-menos{animation:aparece .4s ease-out 1.2s both}
.anim .en-vivo .a-check{animation:pop .7s ease-out 1.9s both}
.anim .en-vivo .a-burbuja{animation:aparece .6s ease-out 2.6s both}
.anim .en-vivo .chip-inv{animation:aparece .6s ease-out 3.2s both}
.anim .en-vivo .chip-caja{animation:aparece .6s ease-out 4.2s both}

/* ===== Responsive ===== */
@media (max-width:1100px){
  .nav{display:none}.menu-movil{display:block}
  .planes{grid-template-columns:1fr 1fr}
  .cifras{grid-template-columns:1fr 1fr}
  .cifra:nth-child(2){border-right:0}
  .cifra:nth-child(3){padding-left:0}
  .servicios-dig{grid-template-columns:1fr 1fr}
  .servicios-dig div:nth-child(3){padding-left:0;border-left:0}
}
@media (max-width:980px){
  .hero .cont,.escena,.dividido{grid-template-columns:1fr}
  .escena:nth-child(even) .escena-texto{order:0}
  .hero-demo{position:relative;left:auto;bottom:auto;width:86%;margin:-14% auto 0}
  .chip-inv{right:2%;top:4%}
  .chip-caja{right:2%;bottom:auto;top:22%}
  .escena-vis{padding-bottom:0;max-width:720px}
  .escenas{gap:88px}
  .fotos{grid-template-columns:1fr 1fr}
  .fotos figure:first-child{grid-column:1/-1;aspect-ratio:16/10}
  .modulos{grid-template-columns:1fr}
  section{padding:80px 0}
}
@media (max-width:980px){
  /* La pantalla recreada sale de encima de la ilustración y se lee completa */
  .escena-pant,.escena-vis.mon .escena-pant,.escena-vis.movil .escena-pant,.escena-vis.doble .escena-pant{position:relative;right:auto;left:auto;width:100%;margin-top:-10%;padding:0 4%}
  .escena-vis.movil .escena-pant{width:72%;margin:-12% auto 0;max-width:320px}
  .escena-vis.doble .escena-movil{position:relative;right:auto;bottom:auto;width:62%;max-width:300px;margin:20px auto 0}
}
@media (max-width:640px){
  .cont{padding:0 16px}
  section{padding:60px 0}
  .hero{padding:44px 0 64px}
  .lead{font-size:1.2rem}
  .botones .boton{width:100%}
  .logo img{height:50px}
  .planes,.panel,.cifras,.fotos,.servicios-dig{grid-template-columns:1fr}
  .cifra,.cifra + .cifra{padding:22px 0 10px;border-right:0;border-bottom:1px solid rgba(244,243,234,.2)}
  .servicios-dig div,.servicios-dig div + div{padding:20px 0 4px;border-left:0}
  .fotos figure{aspect-ratio:4/3}
  .negocios li a{grid-template-columns:1fr;gap:6px;padding:22px 4px}
  .plan,.combo{padding:24px}
  .tabs{flex-wrap:nowrap;overflow-x:auto;padding-bottom:6px;margin-left:-16px;margin-right:-16px;padding-left:16px;padding-right:16px;scrollbar-width:none}
  .tab{flex:none}
  .pie .rej{grid-template-columns:1fr}
  .chip-flota{position:relative;right:auto;left:auto;top:auto;bottom:auto;margin-top:12px}
  .hero-demo{width:100%;margin-top:-8%}
  .tabla th,.tabla td{padding:12px 8px;font-size:1.05rem}
  details.pleg .dentro{padding:0 14px 18px}
  details.pleg>summary{padding:18px 16px}
}
.lista-f{padding-left:1.2em;margin:0}.lista-f li{margin-bottom:.5em}.lista-f li::marker{color:var(--sab-lima-profundo)}
.fotos figure:first-child{aspect-ratio:3/4}
.chip-inv{top:30%;right:-3%}
.escena-vis.doble .escena-movil{width:36%}
@media (max-width:980px){ .fotos figure:first-child{aspect-ratio:16/10} .chip-inv{top:auto} }
.hero-demo{left:-5%}
.mini.kds,.mini.barras{place-items:stretch}.mini.barras{align-content:center}

.mini.kds{border-radius:2px}
@media (max-width:640px){
  .comp thead tr,.comp tbody tr{display:grid;grid-template-columns:repeat(3,1fr)}
  .comp thead th:first-child{display:none}
  .comp thead{position:sticky;top:80px;z-index:2}
  .comp tbody td:first-child{grid-column:1/-1;border-bottom:0;padding:14px 10px 2px;font-weight:600}
  .comp td.c,.comp th.c{padding:6px 4px 14px}
}
@media (max-width:640px){ .tabs{flex-wrap:wrap;overflow:visible;margin-left:0;margin-right:0;padding:0} .tab{font-size:1rem;padding:.55em 1em} }
.plan .precio{margin-bottom:.55em}

/* =====================================================================
   v3 · Responsive y márgenes (03-11-2026)
   Margen lateral único y simétrico: 20 px celular, 32 px iPad vertical,
   48 px iPad horizontal / escritorio; respeta la zona segura del notch.
   Nada se sale del contenido: sin desplazamientos negativos.
   ===================================================================== */
:root{--margen:20px;--ancho:1240px}
@media (min-width:768px){:root{--margen:32px}}
@media (min-width:1024px){:root{--margen:48px}}
:root{--m:max(var(--margen),env(safe-area-inset-left,0px),env(safe-area-inset-right,0px))}
html,body{overflow-x:hidden}
@supports (overflow-x:clip){html,body{overflow-x:clip}}
img,svg,video,canvas,iframe,figure,.disp,.disp-wrap{max-width:100%}
.cont,.cont[class]{max-width:calc(var(--ancho) + 2*var(--m));padding-left:var(--m);padding-right:var(--m)}
.menu-movil:not([open]) nav{display:none}
.menu-movil nav{padding-left:var(--m);padding-right:var(--m)}
input,select,textarea{font-size:max(16px,1.15rem)}

/* Hero: nada sale de su columna */
.hero-ilus{width:86%;margin-left:auto}
.hero-demo{left:0;bottom:-10%;width:64%}
.chip-inv{right:0;top:28%}
.chip-caja{right:2%;bottom:-6%}

/* Escenas: la pantalla se monta sobre la ilustración sin salirse */
.escena-vis{padding-bottom:16%}
.escena-ilus{width:84%}
.escena-pant{right:0;width:70%}
.escena-vis.mon .escena-pant{right:0;width:80%}
.escena-vis.doble .escena-ilus{margin-left:auto}
.escena-vis.doble .escena-pant{left:0;right:auto;width:62%}
.escena-vis.doble .escena-movil{right:0;bottom:-6%;width:38%;min-width:220px}

/* Tablas con desplazamiento: pista visible y sin tocar el borde */
.tabla-env{position:relative}

/* ===== iPad y pantallas medianas: 768–1179 px, una columna ordenada ===== */
@media (max-width:1179px){
  .hero .cont,.escena,.dividido{grid-template-columns:1fr;gap:40px}
  .escena:nth-child(even) .escena-texto{order:0}
  .hero-escena{max-width:760px;margin:0 auto;width:100%}
  .escena-vis{max-width:760px;margin:0 auto;width:100%;padding-bottom:0}
  .escena-ilus,.hero-ilus{width:100%}
  .hero-demo{position:relative;left:auto;bottom:auto;width:84%;margin:-12% auto 0}
  .chip-flota{position:relative;right:auto;left:auto;top:auto;bottom:auto;margin:14px 0 0;display:inline-flex}
  .escena-pant,.escena-vis.mon .escena-pant,.escena-vis.doble .escena-pant{position:relative;right:auto;left:auto;width:88%;margin:-10% auto 0}
  .escena-vis.doble .escena-movil{position:relative;right:auto;bottom:auto;width:300px;min-width:0;margin:24px auto 0}
  .dividido .disp-wrap{max-width:420px;margin:0 auto;width:100%}
  .escenas{gap:96px}
}
@media (min-width:768px) and (max-width:1179px){
  .encab,.escena-texto,.hero .cont>div:first-child{max-width:760px;margin-left:auto;margin-right:auto}
  .hero .cont>div:first-child{width:100%}
  .planes{grid-template-columns:repeat(3,1fr)}
  .panel{grid-template-columns:1fr 1fr}
  .cifras{grid-template-columns:1fr 1fr}
  .fotos{grid-template-columns:repeat(3,1fr)}
  .fotos figure:first-child{grid-column:auto;aspect-ratio:3/4}
  .servicios-dig{grid-template-columns:1fr 1fr}
  .negocios li a{grid-template-columns:minmax(140px,1fr) 2fr}
  .negocios .flecha{grid-column:2}
}
@media (min-width:768px) and (max-width:900px){
  .planes{grid-template-columns:1fr;max-width:560px;margin:0 auto}
}
/* ===== Celular ===== */
@media (max-width:767px){
  .hero-demo,.escena-pant,.escena-vis.mon .escena-pant,.escena-vis.doble .escena-pant{width:100%;margin-top:-8%}
  .escena-vis.doble .escena-movil{width:min(300px,100%)}
  .planes,.panel,.cifras,.fotos,.servicios-dig{grid-template-columns:1fr}
  .negocios li a{grid-template-columns:1fr}
  .negocios .flecha{grid-column:auto}
  .botones .boton{width:100%}
}
@media (min-width:1180px){ .escena-vis.doble .escena-movil{width:42%;min-width:240px} }

/* v3.1 · Las pantallas van en el flujo (no absolutas): nunca se montan sobre otras secciones */
.escena-vis,.escena-vis[class]{padding-bottom:0}
.escena-fila{position:relative;display:flex;align-items:flex-end;justify-content:flex-end;gap:16px;margin-top:-22%}
.escena-fila .escena-pant,.escena-vis .escena-fila .escena-pant{position:relative;left:auto;right:auto;margin:0;width:74%;flex:0 0 74%}
.escena-vis.mon .escena-fila .escena-pant{width:86%;flex-basis:86%}
.escena-vis.doble .escena-fila{justify-content:flex-start}
.escena-vis.doble .escena-fila .escena-pant{width:auto;flex:1 1 60%;min-width:0}
.escena-vis.doble .escena-movil,.escena-vis.doble .escena-fila .escena-movil{position:relative;right:auto;bottom:auto;margin:0;flex:0 0 38%;width:auto;min-width:200px;max-width:280px}
.hero-escena{position:relative}
.hero-demo,.hero-demo[class]{position:relative;left:auto;bottom:auto;width:72%;margin:-30% 0 0 0}
.chip-inv{top:16%;right:0}
.chip-caja{top:auto;bottom:4%;right:0}
@media (max-width:1179px){
  .escena-fila{justify-content:center;margin-top:-10%}
  .escena-fila .escena-pant,.escena-vis .escena-fila .escena-pant,.escena-vis.mon .escena-fila .escena-pant{width:88%;flex-basis:88%}
  .hero-demo,.hero-demo[class]{width:84%;margin:-12% auto 0}
  .chip-flota{position:relative;top:auto;bottom:auto;right:auto}
}
@media (max-width:767px){
  .escena-fila{flex-direction:column;align-items:center;margin-top:-8%}
  .escena-fila .escena-pant,.escena-vis .escena-fila .escena-pant,.escena-vis.mon .escena-fila .escena-pant,.escena-vis.doble .escena-fila .escena-pant{width:100%;flex:none}
  .escena-vis.doble .escena-movil,.escena-vis.doble .escena-fila .escena-movil{flex:none;width:min(300px,100%);max-width:300px;margin-top:20px}
  .hero-demo,.hero-demo[class]{width:100%;margin-top:-8%}
}
@media (min-width:768px) and (max-width:1179px){
  .escena-vis.doble .escena-fila{align-items:flex-end}
  .escena-vis.doble .escena-movil,.escena-vis.doble .escena-fila .escena-movil{flex:0 0 240px;min-width:0;margin:0}
}
/* v3.2 · iPad: textos alineados al mismo margen; planes en filas de dos columnas internas */
@media (min-width:768px) and (max-width:1179px){
  .encab,.escena-texto,.hero .cont>div:first-child{margin-left:0;margin-right:0}
  .hero-escena,.escena-vis{margin-left:0;margin-right:auto}
  .planes,.planes[class]{grid-template-columns:1fr;max-width:none;margin:0}
  .plan{display:grid;grid-template-columns:minmax(220px,1fr) 1.6fr;column-gap:36px;align-items:start}
  .plan>h3,.plan>.ideal,.plan>.precio,.plan>p:not(.precio):not(.ideal),.plan>.boton{grid-column:1}
  .plan>ul{grid-column:2;grid-row:1 / span 6;margin:0}
  .plan .boton{margin-top:.6em;align-self:start}
  .panel{grid-template-columns:1fr 1fr}
}
@media (min-width:768px) and (max-width:1179px){ .hero-escena,.escena-vis,.hero-escena[class],.escena-vis[class]{margin-left:auto;margin-right:auto} .hero-pasos{justify-content:center} }
.correo{font-weight:700;text-decoration:underline;text-underline-offset:3px;user-select:text;-webkit-user-select:text;overflow-wrap:anywhere}

/* Aviso de cookies: banda abajo, con margen, sin tapar el contenido */
.aviso-cookies{position:fixed;z-index:50;left:var(--m);right:var(--m);bottom:max(16px,env(safe-area-inset-bottom,0px));
  max-width:calc(var(--ancho) + 0px);margin:0 auto;background:var(--sab-verde-noche);color:var(--sab-hueso);border-radius:18px;
  padding:16px 20px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 20px;box-shadow:0 14px 34px rgba(0,0,0,.3)}
.aviso-cookies p{margin:0;font-size:1rem;line-height:1.5;flex:1 1 320px}
.aviso-cookies a{color:var(--sab-lima)}
.aviso-cookies-botones{display:flex;gap:10px;flex-wrap:wrap}
.aviso-cookies .boton{color:var(--sab-hueso);border-color:var(--sab-hueso)}
.aviso-cookies .boton.prim{background:var(--sab-lima);color:var(--sab-verde-noche);border-color:var(--sab-lima)}
body.con-aviso-cookies .pie{padding-bottom:calc(var(--alto-aviso,120px) + 48px)}
@media (max-width:767px){ .aviso-cookies-botones{width:100%} .aviso-cookies-botones .boton{flex:1} }

/* =====================================================================
   v4 · Auditoría final (04-11-2026)
   ===================================================================== */
/* «Saltar al contenido» visible al recibir foco con teclado */
.sr:focus,.sr:focus-visible{position:fixed;left:16px;top:16px;width:auto;height:auto;clip:auto;overflow:visible;z-index:100;padding:12px 18px;background:var(--sab-verde-noche);color:var(--sab-hueso);border-radius:12px;font-size:1.1rem;text-decoration:none}

/* Áreas táctiles de 44 px o más */
.pie li a,.pie a.correo,.enlace-pie{display:inline-flex;align-items:center;min-height:44px}
.pie li{margin-bottom:.2em}
.enlace{display:inline-flex;align-items:center;min-height:44px}
.enlace-pie{font:inherit;color:var(--sab-hueso);background:none;border:0;padding:0;cursor:pointer;text-decoration:underline;text-underline-offset:3px;text-align:left}
.pie-legal{color:#B9C7BE;margin-top:28px;font-size:1.1rem}
#acepto{width:28px;height:28px}
label.casilla[for=acepto]{display:flex;gap:12px;min-height:44px;align-items:flex-start;cursor:pointer}
.aviso-cookies a{display:inline-block;padding:10px 0}

/* Selectores iguales a los demás campos en Safari */
select{-webkit-appearance:none;appearance:none;min-height:60px;padding-right:2.6em;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9'%3E%3Cpath d='M1 1l6 6 6-6' stroke='%230B2B22' stroke-width='2' fill='none'/%3E%3C/svg%3E") no-repeat right 16px center}

/* Menú del celular: alineado al margen y con «Cerrar» cuando está abierto */
.menu-movil nav a{padding-left:0;padding-right:0}
.menu-movil summary{display:inline-flex;align-items:center;gap:.35em;min-height:44px}
.menu-movil .m-cerrar{display:none}
.menu-movil[open] .m-cerrar{display:inline}
.menu-movil[open] .m-abrir{display:none}

/* Servicios digitales (funciones): 6 tarjetas, la última «en camino» */
.servicios-dig{grid-template-columns:repeat(3,1fr)}
.servicios-dig div,.servicios-dig div + div{padding:26px 22px 18px;border-left:1px solid rgba(244,243,234,.22);border-top:0}
.servicios-dig div:nth-child(3n+1){padding-left:0;border-left:0}
.servicios-dig div:nth-child(n+4){border-top:1px solid rgba(244,243,234,.22)}
.servicios-dig .en-camino h3{color:#C9D3CB}
.oscuro .prox{color:#E6EADF;border-color:#C9D3CB}
@media (max-width:1100px){
  .servicios-dig{grid-template-columns:1fr 1fr}
  .servicios-dig div:nth-child(n){padding:22px 22px 14px;border-left:1px solid rgba(244,243,234,.22);border-top:0}
  .servicios-dig div:nth-child(odd){padding-left:0;border-left:0}
  .servicios-dig div:nth-child(n+3){border-top:1px solid rgba(244,243,234,.22)}
}
@media (max-width:767px){
  .servicios-dig{grid-template-columns:1fr}
  .servicios-dig div:nth-child(n){padding:20px 0 8px;border-left:0;border-top:1px solid rgba(244,243,234,.22)}
  .servicios-dig div:first-child{border-top:0}
}
.en-camino-bloque{margin-top:18px;padding:16px 18px;border:2px dashed rgba(63,94,75,.45);border-radius:16px}
.en-camino-bloque p{margin:0}.en-camino-bloque p+p{margin-top:.3em}

/* Comparador: en celular la fila Básico/Plus/Pro acompaña la lectura (sticky respecto a la pantalla) */
@media (max-width:767px){
  .tabla-env.comp-env{overflow:visible}
  .comp thead th{background:var(--sab-hueso)}
}

/* Tablas de precios: en celular se leen como tarjetas, nada se desliza de lado */
@media (max-width:767px){
  .tarjetas-movil{overflow:visible}
  .tarjetas-movil thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .tarjetas-movil table,.tarjetas-movil tbody{display:block;width:100%}
  .tarjetas-movil tr{display:grid;grid-template-columns:1fr auto;gap:6px 12px;padding:14px 16px;border-bottom:1px solid rgba(63,94,75,.22)}
  .tarjetas-movil tr:last-child{border-bottom:0}
  .tarjetas-movil td{display:block;padding:0;border:0}
  .tarjetas-movil td:first-child{grid-column:1;grid-row:1}
  .tarjetas-movil td.monto{grid-column:2;grid-row:1;text-align:right;white-space:nowrap}
  .tarjetas-movil td:nth-child(2):not(.monto){grid-column:1/-1;grid-row:2}
  .tarjetas-movil td:only-child{grid-column:1/-1}
}

/* Aviso de cookies más compacto en el celular */
@media (max-width:767px){
  .aviso-cookies{padding:12px 14px;gap:8px}
  .aviso-cookies p{font-size:.95rem;flex-basis:100%;line-height:1.4}
  .aviso-cookies a{padding:4px 0}
  .aviso-cookies-botones .boton{padding:.55em .9em;min-height:48px;white-space:nowrap}
}

/* Hero de escritorio: el texto arriba y los botones dentro de la primera pantalla */
@media (min-width:1180px){
  .hero .cont{align-items:start}
  .hero .cont>div:first-child{padding-top:8px}
  .hero h1{font-size:clamp(2.5rem,3.9vw,3.6rem)}
  .hero .lead{font-size:1.22rem}
  .hero .botones{margin-top:1.1em}
  .hero{padding-top:40px}
  .hero-pasos{flex-wrap:nowrap;gap:8px}
  .hero-pasos li{font-size:.95rem;white-space:nowrap}
}
@media (max-width:1179px){ .hero-pasos,.hero-pasos[class]{justify-content:flex-start} }

/* Franja de beneficios: 4 en una fila (escritorio) o 2×2 (iPad) */
@media (min-width:1024px){ .franja ul{display:grid;grid-template-columns:repeat(4,auto);justify-content:space-between} }
@media (min-width:768px) and (max-width:1023px){ .franja ul{display:grid;grid-template-columns:1fr 1fr} }

/* Planes en iPad vertical: precio y botón sin partirse */
.precio{white-space:nowrap}
@media (min-width:768px) and (max-width:1179px){
  .plan{grid-template-columns:minmax(250px,38%) 1fr}
  .plan .boton{width:100%;white-space:normal}
}

/* Pestañas de combos en iPad: 3 + 3 */
@media (min-width:768px) and (max-width:1023px){ .tabs{display:grid;grid-template-columns:repeat(3,auto);justify-content:start} }

/* Pie en iPad: marca arriba, Producto y Legal lado a lado */
@media (min-width:768px) and (max-width:1023px){
  .pie .rej{grid-template-columns:1fr 1fr}
  .pie .pie-marca{grid-column:1/-1}
}

/* Animación: los totales de la cuenta aparecen después de las líneas; el resumen del celular sale pronto */
.anim .en-espera .px-tot{opacity:0}
.anim .en-vivo .px-tot{animation:aparece .5s ease-out 2.1s both}
.anim .en-vivo .a-burbuja{animation:aparece .5s ease-out .4s both}
@media (max-width:767px){
  .tarjetas-movil.apilada td.monto{grid-column:1/-1;grid-row:2;text-align:left;white-space:normal}
}
@media (min-width:1180px) and (max-width:1365px){
  .hero h1{font-size:2.4rem}
  .hero .lead{font-size:1.15rem}
  .hero .kicker{margin-bottom:.7em}
}
