/* Ken-Ai Studio · estilos del sitio */
@font-face{font-family:'Inter';src:url('InterVariable.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap}

:root{
  --negro:#000;
  --carbon:#0e0e10;
  --grafito:#1c1c1e;
  --linea:#2c2c2e;
  --gris:#8e8e93;
  --gris-claro:#c7c7cc;
  --tinta:#f5f5f7;
  --naranja:#E8590C;
  --naranja-claro:#ff8a4c;
  --azul:#3D6BFF;
  --azul-claro:#86A5FF;
  --verde:#2FBF71;
  --verde-claro:#6EDC9F;
  --wa-fondo:#0b141a;
  --wa-entrante:#202c33;
  --wa-saliente:#005c4b;
  --ancho:1180px;
  --radio:18px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--negro);color:var(--tinta);font-family:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;font-size:17px;line-height:1.55;font-feature-settings:'cv11','ss03';-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
:focus-visible{outline:2px solid var(--naranja-claro);outline-offset:3px;border-radius:6px}
.contenedor{max-width:var(--ancho);margin:0 auto;padding:0 24px}
.oculto{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Tipografía */
h1,h2,h3{font-variation-settings:'opsz' 32;letter-spacing:-.025em;margin:0;font-weight:640}
h1{font-size:clamp(40px,6.2vw,76px);line-height:1.02;letter-spacing:-.035em}
h2{font-size:clamp(32px,4.2vw,52px);line-height:1.06}
h3{font-size:21px;line-height:1.25;letter-spacing:-.015em}
p{margin:0}
.texto-gris{color:var(--gris-claro)}
.intro{font-size:clamp(18px,1.6vw,21px);line-height:1.5;color:var(--gris-claro);max-width:60ch}

/* Botones */
.boton{display:inline-flex;align-items:center;gap:10px;padding:14px 22px;border-radius:999px;font-weight:560;font-size:16px;text-decoration:none;border:1px solid transparent;transition:background-color .2s,border-color .2s}
.boton-principal{background:var(--naranja);color:#fff}
.boton-principal:hover{background:#cf4e09}
.boton-secundario{border-color:var(--linea);color:var(--tinta)}
.boton-secundario:hover{border-color:var(--gris)}
.boton svg{width:19px;height:19px;flex:none}

/* Navegación */
.nav{position:sticky;top:0;z-index:20;background:rgba(0,0,0,.72);backdrop-filter:saturate(180%) blur(18px);-webkit-backdrop-filter:saturate(180%) blur(18px);border-bottom:1px solid rgba(255,255,255,.06)}
.nav .contenedor{display:flex;align-items:center;justify-content:space-between;height:64px;gap:24px}
.marca{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:620;letter-spacing:-.01em}
.marca .k{width:30px;height:30px;border-radius:9px;background:var(--naranja);display:grid;place-items:center;color:#fff;font-weight:700;font-size:16px}
.nav-enlaces{display:flex;gap:28px;font-size:14.5px}
.nav-enlaces a{text-decoration:none;color:var(--gris-claro)}
.nav-enlaces a:hover{color:var(--tinta)}
.nav .boton{padding:9px 16px;font-size:14.5px}


/* Hero */
.hero{padding:72px 0 40px}
.hero .contenedor{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:56px;align-items:center}
.hero h1 .hora{color:var(--naranja);font-variant-numeric:tabular-nums;white-space:nowrap}
.hero .intro{margin-top:26px}
.hero .acciones{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}
.hero .nota{margin-top:22px;font-size:14px;color:var(--gris)}
@media (max-width:960px){.hero .contenedor{grid-template-columns:1fr;gap:48px}.hero{padding-top:48px}}

/* Teléfono con la conversación */
.escena{position:relative;justify-self:center;width:100%;max-width:380px}
.telefono{background:var(--wa-fondo);border:1px solid #23272b;border-radius:44px;padding:14px;box-shadow:0 40px 120px -40px rgba(232,89,12,.35)}
.pantalla{border-radius:32px;overflow:hidden;background:var(--wa-fondo)}
.wa-cabecera{display:flex;align-items:center;gap:11px;padding:14px 16px;background:#1f2c34}
.wa-avatar{width:36px;height:36px;border-radius:50%;background:#fff;color:#0b141a;display:grid;place-items:center;font-weight:700;font-size:14px}
.wa-nombre{font-size:15px;font-weight:600;line-height:1.2}
.wa-estado{font-size:12px;color:#8696a0}
.wa-chat{height:460px;padding:16px 12px;display:flex;flex-direction:column;gap:7px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch;font-size:14.2px;line-height:1.38}
.msj{max-width:84%;padding:7px 10px 6px;border-radius:10px;position:relative}
.msj .h{display:block;text-align:right;font-size:10.5px;color:rgba(233,237,239,.6);margin-top:2px}
.msj.cliente{align-self:flex-end;background:var(--wa-saliente);border-top-right-radius:3px}
.msj.asistente{align-self:flex-start;background:var(--wa-entrante);border-top-left-radius:3px}
.msj.escribiendo{padding:11px 14px}
.puntos-escribe{display:flex;gap:4px}
.puntos-escribe i{width:6px;height:6px;border-radius:50%;background:#8696a0;animation:punto 1s infinite}
.puntos-escribe i:nth-child(2){animation-delay:.15s}.puntos-escribe i:nth-child(3){animation-delay:.3s}
@keyframes punto{0%,60%,100%{opacity:.35}30%{opacity:1}}
.wa-fecha{align-self:center;font-size:11.5px;color:#8696a0;background:#182229;padding:4px 10px;border-radius:7px;margin-bottom:6px}
.evento{position:absolute;right:-28px;background:rgba(28,28,30,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--linea);border-radius:14px;padding:11px 14px;font-size:13px;line-height:1.35;width:230px;display:flex;gap:10px;align-items:flex-start;box-shadow:0 18px 40px -18px #000}
.evento b{display:block;font-weight:600}
.evento span{color:var(--gris)}
.evento .ico{width:26px;height:26px;border-radius:8px;flex:none;display:grid;place-items:center;background:rgba(232,89,12,.16);color:var(--naranja-claro)}
.evento .ico svg{width:15px;height:15px}
.evento.e1{top:70px}.evento.e2{top:178px}
@media (max-width:520px){.evento{right:-6px;width:210px}}
.wa-chat::-webkit-scrollbar{display:none}
.wa-chat>:first-child{margin-top:auto}
.escena.anim .msj:not(.ver){display:none}
.escena.anim .msj.ver{animation:msj-entra .35s ease}
@keyframes msj-entra{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.escena.anim .evento{opacity:0;transform:translateY(8px);transition:opacity .35s ease,transform .35s ease}
.escena.anim .evento.ver{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.anim .msj,.anim .evento{opacity:1;transform:none;transition:none}.msj.escribiendo{display:none}}

/* Secciones */
.seccion{padding:120px 0}
.seccion-cabeza{max-width:760px;margin-bottom:56px}
.seccion-cabeza p{margin-top:18px}
@media (max-width:700px){.seccion{padding:84px 0}}

/* Prueba en vivo */
.prueba{border-top:1px solid var(--linea);border-bottom:1px solid var(--linea);padding:28px 0}
.prueba .contenedor{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.prueba p{font-size:18px;color:var(--gris-claro);max-width:70ch}
.prueba p b{color:var(--tinta);font-weight:600}

/* Sistema */
.partes{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--linea);border:1px solid var(--linea);border-radius:var(--radio);overflow:hidden}
.parte{background:var(--carbon);padding:34px 30px 36px}
.parte .icono{width:44px;height:44px;border-radius:12px;background:var(--grafito);display:grid;place-items:center;color:var(--naranja-claro);margin-bottom:26px}
.parte .icono svg{width:22px;height:22px}
.parte p{margin-top:12px;color:var(--gris-claro);font-size:16px}
.parte ul{margin:18px 0 0;padding:0;list-style:none;font-size:15px;color:var(--gris)}
.parte li{padding:7px 0;border-top:1px solid var(--linea)}
@media (max-width:900px){.partes{grid-template-columns:1fr}}

.vista-dashboard{margin-top:28px;border-radius:var(--radio);overflow:hidden;border:1px solid var(--linea);background:var(--carbon)}
.vista-dashboard figcaption{padding:16px 22px;font-size:14px;color:var(--gris);border-top:1px solid var(--linea)}

/* Nichos */
.nichos{display:grid;grid-template-columns:1.2fr 1.2fr 1fr;gap:16px}
.nicho{border:1px solid var(--linea);border-radius:var(--radio);padding:30px;display:flex;flex-direction:column;background:var(--carbon)}
.nicho h3{font-size:23px}
.nicho .situacion{margin-top:14px;color:var(--gris-claro);font-size:16px}
.nicho ul{margin:22px 0 0;padding:0;list-style:none;font-size:15px}
.nicho li{display:flex;gap:10px;padding:9px 0;border-top:1px solid var(--linea);color:var(--gris-claro)}
.nicho li::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--naranja);margin-top:9px;flex:none}
.nicho .plan-sugerido{margin-top:auto;padding-top:22px;font-size:14px;color:var(--gris)}
.nicho .plan-sugerido b{color:var(--tinta);font-weight:600}
@media (max-width:960px){.nichos{grid-template-columns:1fr}}

/* Proceso */
.pasos{display:grid;grid-template-columns:repeat(4,1fr);gap:0;counter-reset:paso;border-top:1px solid var(--linea)}
.paso{padding:28px 26px 0 0;position:relative}
.paso::before{counter-increment:paso;content:counter(paso);display:grid;place-items:center;width:34px;height:34px;border-radius:50%;border:1px solid var(--naranja);color:var(--naranja-claro);font-weight:600;font-size:15px;margin-bottom:20px;background:var(--negro);position:relative;top:-46px;margin-bottom:-26px}
.paso p{margin-top:10px;color:var(--gris-claro);font-size:15.5px}
.paso .tiempo{margin-top:12px;font-size:14px;color:var(--gris)}
@media (max-width:900px){.pasos{grid-template-columns:1fr 1fr;row-gap:36px}}
@media (max-width:560px){.pasos{grid-template-columns:1fr}}

/* Planes */
.planes{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;align-items:stretch}
.plan{border:1px solid var(--linea);border-radius:var(--radio);padding:32px 28px;display:flex;flex-direction:column;background:var(--carbon)}
.plan.destacado{border-color:rgba(232,89,12,.55);background:linear-gradient(180deg,rgba(232,89,12,.09),rgba(232,89,12,0) 42%),var(--carbon)}
.plan .para{margin-top:8px;color:var(--gris);font-size:15px;min-height:46px}
.precio{margin-top:26px;padding-top:22px;border-top:1px solid var(--linea)}
.precio .desde{font-size:13px;color:var(--gris)}
.precio .valor{font-size:40px;font-weight:640;letter-spacing:-.03em;line-height:1.1;font-variant-numeric:tabular-nums}
.precio .detalle{font-size:14px;color:var(--gris);margin-top:4px}
.precio .mensual{margin-top:14px;font-size:17px;font-weight:560}
.precio .mensual span{font-size:14px;color:var(--gris);font-weight:400}
.plan ul{margin:24px 0 28px;padding:0;list-style:none;font-size:15px}
.plan li{display:flex;gap:10px;padding:8px 0;color:var(--gris-claro)}
.plan li svg{width:17px;height:17px;flex:none;color:var(--naranja-claro);margin-top:3px}
.plan li.base{color:var(--tinta);font-weight:560}
.plan .boton{margin-top:auto;justify-content:center}
.letra-pequena{margin-top:28px;display:grid;grid-template-columns:1fr 1fr;gap:16px;font-size:14.5px;color:var(--gris)}
.letra-pequena div{border:1px solid var(--linea);border-radius:14px;padding:18px 20px}
.letra-pequena b{color:var(--gris-claro);font-weight:600}
@media (max-width:960px){.planes,.letra-pequena{grid-template-columns:1fr}}

/* Reporte */
.reporte .contenedor{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:64px;align-items:center}
.reporte-lista{margin-top:30px;display:grid;gap:0}
.reporte-lista div{padding:16px 0;border-top:1px solid var(--linea)}
.reporte-lista b{display:block;font-weight:600}
.reporte-lista span{color:var(--gris);font-size:15.5px}
.hojas{position:relative;height:620px}
.hoja{position:absolute;width:62%;border-radius:12px;overflow:hidden;border:1px solid var(--linea);box-shadow:0 30px 80px -30px #000}
.hoja.a{left:0;top:0}
.hoja.b{right:0;top:90px}
@media (max-width:960px){.reporte .contenedor{grid-template-columns:1fr}.hojas{height:auto;display:grid;grid-template-columns:1fr 1fr;gap:12px}.hoja{position:static;width:auto}}

/* Preguntas */
.preguntas{max-width:860px}
.preguntas details{border-top:1px solid var(--linea)}
.preguntas details:last-child{border-bottom:1px solid var(--linea)}
.preguntas summary{cursor:pointer;list-style:none;padding:24px 44px 24px 0;font-size:19px;font-weight:560;position:relative}
.preguntas summary::-webkit-details-marker{display:none}
.preguntas summary::after{content:'';position:absolute;right:6px;top:32px;width:12px;height:12px;border-right:2px solid var(--gris);border-bottom:2px solid var(--gris);transform:rotate(45deg);transition:transform .2s}
.preguntas details[open] summary::after{transform:rotate(-135deg);top:38px}
.preguntas details p{padding:0 0 26px;color:var(--gris-claro);max-width:68ch}

/* Cierre */
.cierre{padding:130px 0 120px;text-align:left;border-top:1px solid var(--linea)}
.cierre h2{max-width:16ch}
.cierre .intro{margin-top:20px}
.cierre .acciones{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}

/* Pie */
.pie{border-top:1px solid var(--linea);padding:48px 0 56px;font-size:14px;color:var(--gris)}
.pie .contenedor{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:32px}
.pie h4{margin:0 0 12px;font-size:14px;color:var(--tinta);font-weight:600}
.pie ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.pie a{text-decoration:none;color:var(--gris)}
.pie a:hover{color:var(--tinta)}
.pie .legal{grid-column:1/-1;padding-top:28px;border-top:1px solid var(--linea);display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px}
@media (max-width:760px){.pie .contenedor{grid-template-columns:1fr}}

/* Páginas legales */
.legal-pagina{padding:72px 0 110px}
.legal-pagina article{max-width:760px}
.legal-pagina h1{font-size:clamp(36px,5vw,54px)}
.legal-pagina .actualizado{margin-top:14px;color:var(--gris);font-size:15px}
.legal-pagina h2{font-size:24px;margin-top:52px;letter-spacing:-.02em}
.legal-pagina p,.legal-pagina li{color:var(--gris-claro);font-size:16.5px;line-height:1.65}
.legal-pagina p{margin-top:14px}
.legal-pagina ul{margin:14px 0 0;padding-left:20px}
.legal-pagina li{margin-top:6px}
.legal-pagina a{color:var(--naranja-claro)}
.legal-pagina .datos{margin-top:22px;border:1px solid var(--linea);border-radius:14px;padding:20px 22px}
.legal-pagina .datos p{margin:4px 0 0}
.nav .boton{white-space:nowrap}
@media (max-width:420px){.nav .boton{padding:8px 13px;font-size:13.5px}.marca{font-size:15px}.marca .k{width:26px;height:26px;font-size:14px}}

/* ───────── Escenas (imágenes y videos de Ken-Ai) ───────── */
.cuadro{position:relative;overflow:hidden;border-radius:22px;background:#0c0c0e;border:1px solid var(--linea)}
.cuadro.ancho{aspect-ratio:16/9}
.cuadro.vertical{aspect-ratio:4/5}
.cuadro video,.cuadro > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cuadro.pendiente{background:
  radial-gradient(55% 45% at 72% 78%,rgba(232,89,12,.30),transparent 70%),
  radial-gradient(35% 35% at 18% 22%,rgba(255,255,255,.06),transparent 70%),
  linear-gradient(160deg,#17171a,#060607)}
.cuadro.pendiente::after{content:attr(data-etiqueta);position:absolute;left:18px;bottom:14px;font-size:12.5px;color:var(--gris)}

/* Notificación tipo celular */
.noti{position:absolute;z-index:2;top:16px;left:50%;width:min(370px,88%);display:flex;gap:11px;align-items:center;padding:10px 12px;border-radius:16px;background:rgba(44,44,48,.74);backdrop-filter:blur(18px) saturate(160%);-webkit-backdrop-filter:blur(18px) saturate(160%);border:1px solid rgba(255,255,255,.09);box-shadow:0 14px 30px -14px rgba(0,0,0,.8);opacity:0;transform:translate(-50%,-14px);transition:opacity .45s ease .35s,transform .45s ease .35s}
.activa .noti,.ver .noti{opacity:1;transform:translate(-50%,0)}
.noti-ico{width:34px;height:34px;border-radius:9px;background:var(--naranja);color:#fff;display:grid;place-items:center;font-weight:700;font-size:16px;flex:none}
.noti-texto{display:flex;flex-direction:column;min-width:0;line-height:1.3}
.noti-texto b{font-size:13.5px;font-weight:600}
.noti-texto span{font-size:12.5px;color:var(--gris-claro)}
.noti time{align-self:flex-start;margin-left:auto;font-size:11.5px;color:var(--gris);white-space:nowrap}
@media (prefers-reduced-motion:reduce){.noti{opacity:1;transform:translate(-50%,0);transition:none}}

/* Hero con Ken-Ai detrás del chat */
.hero .escena{max-width:560px;padding-bottom:40px}
.hero-cuadro{width:76%;margin-left:auto}
.hero .telefono{position:absolute;left:0;top:64px;width:360px;zoom:.82}
.hero .wa-chat{height:420px}
.hero .evento.e1{top:24px;right:-22px}
.hero .evento.e2{top:auto;bottom:60px;right:-22px}
@media (max-width:520px){.hero-cuadro{width:82%}.hero .telefono{zoom:.7;top:60px}.hero .escena{padding-bottom:0;min-height:520px}}

/* Sistema */
.sistema-cuadro{margin-bottom:28px}

/* Reporte */
.hojas{position:relative;height:auto;padding-bottom:120px}
.hojas .hoja{width:34%;box-shadow:0 30px 60px -20px #000}
.hojas .hoja.a{left:-28px;top:auto;bottom:0}
.hojas .hoja.b{right:-28px;left:auto;top:auto;bottom:40px}
@media (max-width:960px){.hojas{display:block;padding-bottom:110px}.hojas .hoja{position:absolute;width:38%}.hojas .hoja.a{left:4px}.hojas .hoja.b{right:4px}}

/* Cierre */
.cierre-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:64px;align-items:center}
.cierre-cuadro{max-width:420px;justify-self:end;width:100%}
@media (max-width:900px){.cierre-grid{grid-template-columns:1fr}.cierre-cuadro{justify-self:start;max-width:360px}}

/* ───────── Navegación entre páginas ───────── */
.nav-enlaces a[aria-current="page"]{color:var(--tinta)}
.menu-btn{display:none;background:none;border:1px solid var(--linea);color:var(--tinta);border-radius:10px;width:40px;height:40px;align-items:center;justify-content:center}
.menu-btn svg{width:20px;height:20px}
@media (max-width:860px){
  .menu-btn{display:inline-flex}
  .nav .boton{display:none}
  .menu-abierto .nav-enlaces{display:flex;position:absolute;top:64px;left:0;right:0;flex-direction:column;gap:0;background:rgba(0,0,0,.96);border-bottom:1px solid var(--linea);padding:8px 24px 20px}
  .menu-abierto .nav-enlaces a{padding:14px 0;font-size:17px;border-bottom:1px solid var(--linea)}
}

/* Botón flotante de chat */
.flotante{position:fixed;z-index:30;right:20px;bottom:calc(20px + env(safe-area-inset-bottom,0px));display:flex;align-items:center;gap:10px;height:56px;padding:0 20px 0 16px;border-radius:999px;background:var(--naranja);color:#fff;text-decoration:none;font-weight:600;font-size:15px;box-shadow:0 14px 34px -10px rgba(232,89,12,.7)}
.flotante:hover{background:#cf4e09}
.flotante svg{width:24px;height:24px;flex:none}
@media (max-width:600px){.flotante{width:56px;padding:0;justify-content:center}.flotante span{display:none}}

/* Botones sobre los videos */
.boton-sonido{position:absolute;z-index:3;right:12px;bottom:12px;width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.18);background:rgba(0,0,0,.5);color:#fff;display:grid;place-items:center;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.boton-sonido svg{width:18px;height:18px}
.boton-sonido .ondas{display:none}
.boton-sonido.activo .ondas{display:block}
.boton-sonido.activo .mute{display:none}
.boton-play{position:absolute;z-index:3;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;align-items:center;gap:10px;padding:14px 22px;border-radius:999px;border:0;background:var(--naranja);color:#fff;font:inherit;font-weight:600;font-size:16px;cursor:pointer}
.boton-play svg{width:20px;height:20px}
.cuadro.cuadrado{aspect-ratio:1}

/* Cabecera de páginas internas */
.cabecera-pagina{padding:80px 0 40px}
.cabecera-pagina h1{font-size:clamp(40px,5.6vw,68px);max-width:16ch;text-wrap:balance}
.cabecera-pagina .intro{margin-top:22px}
h2{text-wrap:balance}

/* ───────── Recorridos con scroll ───────── */
.recorrido-grid{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);gap:56px;align-items:start}
.paso-scroll{min-height:70vh;display:flex;flex-direction:column;justify-content:center;padding:6vh 0;transition:opacity .4s ease}
.recorrido.con-js .paso-scroll{opacity:.28}
.recorrido.con-js .paso-scroll.activo{opacity:1}
.momento{color:var(--naranja-claro);font-weight:560;font-variant-numeric:tabular-nums;margin-bottom:10px}
.paso-scroll h3{font-size:clamp(24px,2.4vw,32px);letter-spacing:-.025em}
.paso-texto{margin-top:14px;color:var(--gris-claro);font-size:18px;max-width:44ch}
.paso-scroll ul{margin:22px 0 0;padding:0;list-style:none;font-size:15.5px}
.paso-scroll li{display:flex;gap:10px;padding:9px 0;border-top:1px solid var(--linea);color:var(--gris-claro)}
.paso-scroll li::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--naranja);margin-top:9px;flex:none}
.paso-scroll .plan-sugerido{margin-top:16px;font-size:14px;color:var(--gris)}
.paso-scroll .plan-sugerido b{color:var(--tinta);font-weight:600}
.paso-visual{display:none}
.escenario{position:sticky;top:calc(64px + 12vh)}
.escenario.panorama{aspect-ratio:16/9}
.escena-fija{position:absolute;inset:0;opacity:0;transition:opacity .6s ease}
.escena-fija.activa{opacity:1}
.recorrido:not(.con-js) .escena-fija:first-child{opacity:1}
.escena-fija .cuadro{height:100%}
.puntos{position:absolute;left:0;right:0;bottom:-30px;display:flex;justify-content:center;gap:8px}
.puntos i{width:6px;height:6px;border-radius:50%;background:var(--linea);transition:background .3s,width .3s}
.puntos i.on{background:var(--naranja);width:22px;border-radius:3px}
.num-paso{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;border:1px solid var(--naranja);color:var(--naranja-claro);font-size:14px;font-weight:600;margin-bottom:14px}
@media (max-width:960px){
  .recorrido-grid{grid-template-columns:1fr;gap:0}
  .escenario{display:none}
  .paso-scroll,.recorrido.con-js .paso-scroll{min-height:0;opacity:1;padding:0 0 64px}
  .paso-visual{display:block;margin-top:22px}
}

/* Mesa donde se arma el sistema */
.mesa{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:minmax(150px,auto);gap:12px;padding:16px;border-radius:24px;border:1px solid var(--linea);background:radial-gradient(70% 60% at 50% 110%,rgba(232,89,12,.16),transparent 70%),var(--carbon)}
.mesa::after{content:'';position:absolute;left:16px;right:16px;bottom:8px;height:2px;border-radius:2px;background:linear-gradient(90deg,var(--naranja) calc(var(--avance,1)*100%),var(--linea) 0)}
.pieza{border:1px solid var(--linea);border-radius:16px;background:var(--grafito);padding:14px;font-size:13px;line-height:1.4;transition:opacity .5s ease,transform .5s ease,border-color .3s}
.recorrido.con-js .pieza{opacity:.08;transform:scale(.96)}
.recorrido.con-js .pieza.puesta{opacity:1;transform:none}
.pieza.actual{border-color:rgba(232,89,12,.7)}
.pieza-t{display:flex;align-items:center;gap:8px;font-size:11.5px;color:var(--gris);margin-bottom:10px}
.pieza-t svg{width:14px;height:14px;color:var(--naranja-claro)}
.pieza .burbuja{padding:6px 9px;border-radius:9px;margin-top:6px;max-width:92%}
.pieza .burbuja.c{background:var(--wa-saliente);margin-left:auto}
.pieza .burbuja.a{background:var(--wa-entrante)}
.pieza .fila{display:flex;justify-content:space-between;gap:8px;padding:4px 0;border-bottom:1px solid var(--linea)}
.pieza .fila:last-child{border:0}
.pieza .fila span:first-child{color:var(--gris)}
.pieza .chip{display:inline-block;padding:2px 8px;border-radius:999px;background:rgba(232,89,12,.16);color:var(--naranja-claro);font-size:11.5px}
.pieza .hora-cal{display:flex;gap:8px;padding:5px 0;border-top:1px dashed var(--linea);color:var(--gris)}
.pieza .hora-cal b{color:var(--tinta);font-weight:500}
.pieza .hora-cal.ocupada{color:var(--tinta)}
.pieza .hora-cal.ocupada b{background:rgba(232,89,12,.18);border-radius:6px;padding:0 6px}
.pieza .barras{display:flex;align-items:flex-end;gap:5px;height:52px;margin-top:6px}
.pieza .barras i{flex:1;background:#4a4a4f;border-radius:3px 3px 0 0}
.pieza .barras i.alta{background:var(--naranja)}
.pieza.ancha{grid-column:span 2}
.paso-visual .pieza{opacity:1;transform:none}
@media (max-width:960px){.paso-visual .mesa{display:block;padding:0;border:0;background:none}.paso-visual .mesa::after{display:none}}

/* Personas */
.personas{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:28px}
.persona{border-top:1px solid var(--linea);padding-top:22px}
.persona h3{font-size:22px}
.persona p{margin-top:10px;color:var(--gris-claro);font-size:16px}
.persona ul{margin:16px 0 0;padding:0;list-style:none}
.persona li{display:flex;gap:10px;padding:8px 0;color:var(--gris-claro);font-size:15.5px}
.persona li::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--naranja);margin-top:9px;flex:none}
@media (max-width:900px){.personas{grid-template-columns:1fr}}

/* Capacidades (servicios) */
.capacidades{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 48px}
.capacidad{padding:24px 0;border-top:1px solid var(--linea)}
.capacidad h3{font-size:19px}
.capacidad p{margin-top:8px;color:var(--gris-claro);font-size:16px;max-width:52ch}
@media (max-width:800px){.capacidades{grid-template-columns:1fr}}
.bloques{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:28px}
.bloque{border:1px solid var(--linea);border-radius:var(--radio);padding:26px;background:var(--carbon)}
.bloque p{margin-top:10px;color:var(--gris-claro);font-size:15.5px}
@media (max-width:900px){.bloques{grid-template-columns:1fr}}

/* Tabla de planes */
.tabla-envoltura{overflow-x:auto;margin-top:40px;border:1px solid var(--linea);border-radius:var(--radio)}
.tabla-planes{width:100%;min-width:640px;border-collapse:collapse;font-size:15px}
.tabla-planes th,.tabla-planes td{padding:14px 18px;text-align:left;border-bottom:1px solid var(--linea);vertical-align:top}
.tabla-planes thead th{font-size:16px;background:var(--carbon);position:sticky;top:0}
.tabla-planes tbody th{font-weight:500;color:var(--gris-claro);width:34%}
.tabla-planes td{color:var(--tinta);font-variant-numeric:tabular-nums}
.tabla-planes td.no{color:var(--gris)}
.tabla-planes tr:last-child th,.tabla-planes tr:last-child td{border-bottom:0}
.tabla-planes .si{color:var(--naranja-claro);font-weight:600}

/* Quiénes somos */
.ken-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:center}
.ken-fotos{display:grid;grid-template-columns:1.25fr 1fr;gap:14px;align-items:end}
.ken-texto p{margin-top:16px;color:var(--gris-claro);font-size:18px;max-width:54ch}
.ken-texto ul{margin:22px 0 0;padding:0;list-style:none}
.ken-texto li{display:flex;gap:10px;padding:10px 0;border-top:1px solid var(--linea);color:var(--gris-claro)}
.ken-texto li::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--naranja);margin-top:10px;flex:none}
.fundador{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:56px;align-items:center}
.fundador .cuadro{max-width:420px}
.fundador blockquote{margin:0}
.fundador blockquote p{font-size:clamp(19px,1.7vw,22px);line-height:1.55;color:var(--gris-claro);margin-top:18px;max-width:56ch}
.fundador blockquote p:first-child{margin-top:0;color:var(--tinta);font-size:clamp(24px,2.4vw,30px);letter-spacing:-.02em;font-weight:560}
.firma{margin-top:24px;color:var(--gris);font-size:15px}
.firma b{color:var(--tinta);font-weight:600}
.valores{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 48px}
.valor{padding:24px 0;border-top:1px solid var(--linea)}
.valor p{margin-top:8px;color:var(--gris-claro);font-size:16px}
@media (max-width:900px){.ken-grid,.fundador,.valores{grid-template-columns:1fr}.fundador .cuadro{max-width:340px}}

/* Contacto */
.contacto-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:56px;align-items:start}
.canales{display:grid;gap:0}
.canal{padding:20px 0;border-top:1px solid var(--linea)}
.canal span{display:block;color:var(--gris);font-size:14px}
.canal b,.canal a{font-size:18px;font-weight:560;color:var(--tinta);text-decoration:none;user-select:all}
.formulario{border:1px solid var(--linea);border-radius:var(--radio);background:var(--carbon);padding:28px;display:grid;gap:18px}
.campo{display:grid;gap:7px}
.campo label{font-size:14px;color:var(--gris-claro)}
.campo input,.campo select,.campo textarea{font:inherit;font-size:16px;color:var(--tinta);background:var(--negro);border:1px solid var(--linea);border-radius:12px;padding:12px 14px;width:100%}
.campo textarea{min-height:120px;resize:vertical}
.campo input:focus,.campo select:focus,.campo textarea:focus{outline:2px solid var(--naranja-claro);outline-offset:1px;border-color:transparent}
.dos-campos{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.acepto{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--gris-claro)}
.acepto input{margin-top:3px;accent-color:var(--naranja);width:18px;height:18px}
.acepto a{color:var(--naranja-claro)}
.trampa{position:absolute;left:-9999px}
.formulario .boton{justify-content:center;border:0;cursor:pointer;font:inherit;font-weight:560}
.form-estado{font-size:15px;min-height:1px}
.form-estado.ok{color:#7ee2a8}
.form-estado.error{color:#ff8a7a}
@media (max-width:900px){.contacto-grid,.dos-campos{grid-template-columns:1fr}}

/* Ficha del CRM agrupada por plan */
.pieza .grupo-plan{padding-top:8px}
.pieza .grupo-plan+.grupo-plan{margin-top:8px;border-top:1px solid var(--linea)}
.pieza .tag-plan{display:inline-block;font-size:10.5px;letter-spacing:.04em;text-transform:uppercase;padding:2px 7px;border-radius:6px;margin-bottom:4px;border:1px solid var(--linea);color:var(--gris)}
.pieza .tag-plan.c{color:var(--naranja-claro);border-color:rgba(232,89,12,.35)}
.pieza .tag-plan.a{color:#000;background:var(--naranja);border-color:var(--naranja)}
.pieza .dato{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding:4px 0}
.pieza .dato span:first-child{color:var(--gris);flex:none}
.pieza .dato span:last-child{text-align:right;min-width:0}
/* Escritorio: la ficha del CRM ocupa la columna central completa */
@media (min-width:961px){
  .escenario .mesa{grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:auto;grid-template-areas:"chat crm campana" "cal crm campana" "grafica crm equipo";font-size:12.5px}
  .escenario .p-chat{grid-area:chat}.escenario .p-persona{grid-area:crm}.escenario .p-cal{grid-area:cal}
  .escenario .p-campana{grid-area:campana}.escenario .p-equipo{grid-area:equipo}.escenario .p-grafica{grid-area:grafica}
  .escenario .pieza{padding:12px}
  .escenario .p-persona .dato{flex-direction:column;gap:0;padding:3px 0}
  .escenario .p-persona .dato span:last-child{text-align:left}
}
@media (min-width:961px) and (max-height:1000px){.escenario{top:76px}.escenario .mesa{zoom:.86}}
@media (min-width:961px) and (max-height:800px){.escenario .mesa{zoom:.8}}

/* Recordatorios como llegan desde las plantillas de Meta */
.pieza .cuando{font-size:10.5px;letter-spacing:.04em;text-transform:uppercase;color:var(--gris);margin-top:8px}
.pieza .cuando:first-of-type{margin-top:0}
.pieza .plantilla{max-width:94%}
.pieza .plantilla .burbuja{max-width:100%;border-radius:9px 9px 9px 2px}
.pieza .botones-wa{display:grid;gap:3px;margin-top:3px}
.pieza .botones-wa span{display:block;text-align:center;padding:6px 8px;border-radius:8px;background:var(--wa-entrante);color:#53bdeb;font-weight:500}

.wa-repetir{align-self:center;margin-top:6px;padding:6px 12px;border-radius:999px;border:0;background:rgba(233,237,239,.12);color:#e9edef;font:inherit;font-size:12.5px;cursor:pointer}
.wa-repetir:hover{background:rgba(233,237,239,.2)}

/* Habilidades de Ken-Ai */
.selector-plan{display:inline-flex;flex-wrap:wrap;gap:4px;padding:4px;border-radius:999px;border:1px solid var(--linea);background:var(--carbon);margin-top:8px}
.selector-plan button{border:0;background:none;color:var(--gris);font:inherit;font-size:14.5px;padding:9px 18px;border-radius:999px;cursor:pointer;transition:background .2s,color .2s}
.selector-plan button[aria-pressed="true"]{background:var(--tinta);color:#000;font-weight:600}
.resumen-plan{color:var(--gris);font-size:15px;margin:16px 0 28px;max-width:70ch}
.habilidades{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.habilidad{position:relative;display:flex;flex-direction:column;border:1px solid var(--linea);border-radius:20px;background:var(--grafito);padding:20px;transition:opacity .35s,border-color .35s,transform .35s}
.habilidad h3{font-size:18px;letter-spacing:-.015em;margin:14px 0 6px}
.habilidad p{color:var(--gris);font-size:14.5px;line-height:1.5;margin:0}
.habilidad ul{list-style:none;margin:14px 0 0;padding:14px 0 0;border-top:1px solid var(--linea);display:grid;gap:7px;font-size:13.5px;color:var(--tinta)}
.habilidad li{display:flex;gap:9px}
.habilidad li::before{content:'';width:5px;height:5px;border-radius:50%;background:var(--naranja);margin-top:8px;flex:none}
.hab-cab{display:flex;justify-content:space-between;align-items:center;gap:8px}
.hab-grupo{font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--gris)}
.hab-plan{font-size:11.5px;padding:3px 9px;border-radius:999px;border:1px solid var(--linea);color:var(--gris);white-space:nowrap}
.hab-plan.p-comercial{color:var(--naranja-claro);border-color:rgba(232,89,12,.4)}
.hab-plan.p-avanzado{color:#000;background:var(--naranja);border-color:var(--naranja)}
.hab-plan.p-extra{color:var(--tinta);border-style:dashed;border-color:var(--gris)}
.habilidad[data-desde="extra"]{border-style:dashed}
.habilidad .hab-falta{display:none;margin-top:14px;font-size:12.5px;color:var(--naranja-claro)}
.habilidades.filtrado .habilidad.fuera{opacity:.32;border-color:var(--linea)}
.habilidades.filtrado .habilidad.fuera .hab-falta{display:block}
.habilidades.filtrado .habilidad.dentro{border-color:rgba(232,89,12,.55)}
@media (prefers-reduced-motion:reduce){.habilidad{transition:none}}

/* Cómo se arman los planes */
.capas{display:grid;gap:10px;margin-top:8px}
.capa{display:grid;grid-template-columns:150px minmax(0,1fr) auto;gap:24px;align-items:center;padding:22px 24px;border-radius:20px;border:1px solid var(--linea);background:var(--grafito)}
.capa h3{font-size:18px;letter-spacing:-.015em;margin:0 0 6px}
.capa p{margin:0;color:var(--gris);font-size:15px;line-height:1.55;max-width:72ch}
.capa-tag{font-size:13px;font-weight:600;color:var(--naranja-claro)}
.capa-plan{font-size:12px;padding:4px 11px;border-radius:999px;border:1px solid var(--linea);color:var(--gris);white-space:nowrap}
.c-base{border-color:var(--gris)}
.c-com .capa-plan{color:var(--naranja-claro);border-color:rgba(232,89,12,.4)}
.c-ava .capa-plan{color:#000;background:var(--naranja);border-color:var(--naranja)}
.c-ext{border-style:dashed}
.c-ext .capa-plan{border-style:dashed;color:var(--tinta)}
.c-com{margin-left:3%}.c-ava{margin-left:6%}.c-ext{margin-left:9%}
@media (max-width:760px){.capa{grid-template-columns:1fr;gap:10px;padding:18px}.capa-plan{justify-self:start}.c-com,.c-ava,.c-ext{margin-left:0}}

/* CRM y dashboard explicados */
.crm-explica{margin-top:28px}
.crm-que{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.crm-que article{border:1px solid var(--linea);border-radius:var(--radio);padding:26px;background:var(--carbon)}
.crm-que p{margin-top:10px;color:var(--gris-claro);font-size:15.5px}
.crm-planes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:16px}
.crm-planes article{border:1px solid var(--linea);border-radius:var(--radio);padding:22px 24px;background:var(--grafito)}
.crm-planes h4{font-size:16px;margin:16px 0 4px}
.crm-planes p{margin:0;color:var(--gris);font-size:14.5px;line-height:1.5}
@media (max-width:900px){.crm-que,.crm-planes{grid-template-columns:1fr}}

/* Servicios: qué es el sistema */
.sistema-dos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.sistema-lado{border:1px solid var(--linea);border-radius:24px;padding:32px;background:var(--carbon)}
.sistema-num{font-size:13px;font-weight:600;color:var(--naranja-claro);letter-spacing:.08em}
.sistema-lado h2{font-size:clamp(26px,2.6vw,34px);letter-spacing:-.03em;margin:10px 0 10px}
.sistema-lado>p{color:var(--gris-claro);font-size:16px;max-width:52ch}
.sistema-lado ul{list-style:none;margin:20px 0 0;padding:0;display:grid}
.sistema-lado li{padding:11px 0;border-top:1px solid var(--linea);color:var(--gris);font-size:15px}
.sistema-lado li b{color:var(--tinta);font-weight:600}
.sistema-cierre{margin-top:16px;border-radius:24px;padding:26px 32px;background:linear-gradient(120deg,rgba(232,89,12,.22),rgba(232,89,12,.04) 60%),var(--carbon);border:1px solid rgba(232,89,12,.35)}
.sistema-cierre p{margin:0;font-size:17px;line-height:1.55;color:var(--gris-claro);max-width:85ch}
.sistema-cierre b{color:var(--tinta)}
@media (max-width:860px){.sistema-dos{grid-template-columns:1fr}.sistema-lado,.sistema-cierre{padding:24px}}
/* Nosotros: ficha de Ken-Ai */
.ficha-empleado{margin:22px 0;border:1px solid var(--linea);border-radius:20px;background:var(--grafito);overflow:hidden}
.ficha-cab{display:flex;align-items:center;gap:12px;padding:16px 20px;border-bottom:1px solid var(--linea);background:var(--carbon)}
.ficha-cab b{display:block;font-size:16px}
.ficha-cab span{font-size:13px;color:var(--gris)}
.ficha-k{width:38px;height:38px;border-radius:11px;background:var(--naranja);color:#fff !important;display:grid;place-items:center;font-weight:700;font-size:18px !important;flex:none}
.ficha-estado{margin-left:auto;display:flex;align-items:center;gap:7px;color:#30d158 !important;font-size:12.5px !important;white-space:nowrap}
.ficha-estado::before{content:'';width:7px;height:7px;border-radius:50%;background:#30d158;box-shadow:0 0 0 4px rgba(48,209,88,.15)}
.ficha-empleado dl{margin:0;padding:6px 20px}
.ficha-empleado dl div{display:grid;grid-template-columns:110px minmax(0,1fr);gap:14px;padding:11px 0;border-top:1px solid var(--linea)}
.ficha-empleado dl div:first-child{border-top:0}
.ficha-empleado dt{color:var(--gris);font-size:13px}
.ficha-empleado dd{margin:0;font-size:14.5px}
@media (max-width:520px){.ficha-empleado dl div{grid-template-columns:1fr;gap:2px}}

/* Ayudas "?" */
.ayuda{display:inline-grid;place-items:center;width:20px;height:20px;margin-left:7px;padding:0;border-radius:50%;border:1px solid var(--gris);background:transparent;color:var(--gris-claro);font:600 12px/1 inherit;font-family:inherit;letter-spacing:0;text-transform:none;vertical-align:middle;cursor:pointer;transition:background .2s,color .2s,border-color .2s;position:relative;top:-1px}
h2 .ayuda{width:24px;height:24px;font-size:14px;top:-4px}
.ayuda:hover,.ayuda[aria-expanded="true"]{background:var(--naranja);border-color:var(--naranja);color:#fff}
.globo{position:fixed;z-index:60;width:min(340px,calc(100vw - 24px));padding:20px 20px 18px;border-radius:18px;border:1px solid var(--linea);background:rgba(28,28,30,.97);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 24px 60px -12px rgba(0,0,0,.7);color:var(--tinta);animation:globo-entra .18s ease}
.globo h4{margin:0 26px 8px 0;font-size:16px;letter-spacing:-.01em}
.globo p{margin:0;color:var(--gris-claro);font-size:14.5px;line-height:1.55}
.globo-ej{margin-top:14px;padding:12px 14px;border-radius:12px;background:rgba(232,89,12,.1);border:1px solid rgba(232,89,12,.3);font-size:14px;line-height:1.5}
.globo-ej b{display:block;font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--naranja-claro);margin-bottom:4px}
.globo-cerrar{position:absolute;top:10px;right:10px;width:30px;height:30px;border-radius:50%;border:0;background:rgba(255,255,255,.08);color:var(--tinta);font-size:18px;line-height:1;cursor:pointer}
.globo.hoja{left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));top:auto;width:auto}
.globo-fondo{position:fixed;inset:0;z-index:59;background:rgba(0,0,0,.5)}
@keyframes globo-entra{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.ejemplo-faq{margin-top:10px;padding:12px 14px;border-left:2px solid var(--naranja);background:rgba(232,89,12,.06);border-radius:0 10px 10px 0}
.ejemplo-faq b{color:var(--naranja-claro)}

/* Botón "Ver ejemplo" */
.ayuda.ayuda-texto{width:auto;height:auto;display:inline-flex;margin:8px 0 0;padding:5px 12px;border-radius:999px;border-color:rgba(232,89,12,.5);color:var(--naranja-claro);font-size:12.5px;top:0}
td .ayuda-texto{display:flex;width:max-content}
.globo.ancho{width:min(420px,calc(100vw - 24px))}
.mini-cita{margin-top:6px;border:1px solid var(--linea);border-radius:14px;background:#141416;padding:16px}
.mc-nombre{font-size:17px;font-weight:600}
.mc-sub{font-size:12.5px;color:var(--gris);margin:2px 0 12px}
.mc-datos div{display:flex;justify-content:space-between;gap:12px;padding:6px 0;border-top:1px solid var(--linea);font-size:13px}
.mc-datos div span:first-child{color:var(--gris)}
.mc-datos div span:last-child{text-align:right}
.mc-datos .mc-plus span:last-child{color:var(--naranja-claro)}
.mc-hist{margin-top:12px;font-size:13px}
.mc-hist>b{display:block;margin-bottom:6px}
.mc-ev{display:flex;gap:10px;padding:10px;border-radius:10px;background:var(--grafito)}
.mc-ev b{font-weight:600}
.mc-gris{color:var(--gris);font-size:12px}
.mc-nota{margin:12px 0 0;font-size:12.5px;color:var(--gris);line-height:1.5}
/* Flujo de datos */
.flujo-datos{margin-top:16px;border:1px solid var(--linea);border-radius:24px;padding:32px;background:var(--carbon)}
.flujo-cab h3{font-size:clamp(22px,2.2vw,28px);letter-spacing:-.025em;margin:0}
.flujo-cab p{color:var(--gris-claro);font-size:16px;max-width:70ch;margin:10px 0 0}
.flujo-pasos{list-style:none;margin:26px 0 0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;counter-reset:none}
.flujo-pasos li{position:relative;border:1px solid var(--linea);border-radius:18px;padding:18px;background:var(--grafito);display:flex;flex-direction:column}
.flujo-pasos li:not(:last-child)::after{content:'→';position:absolute;right:-12px;top:22px;width:12px;text-align:center;color:var(--naranja);font-size:14px}
.fp-n{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--naranja);color:var(--naranja-claro);font-size:13px;font-weight:600}
.flujo-pasos h4{margin:12px 0 6px;font-size:16.5px}
.flujo-pasos p{margin:0;color:var(--gris);font-size:13.5px;line-height:1.5}
.flujo-pasos .fp-ej{margin-top:auto;padding-top:12px;color:var(--naranja-claro);font-size:12.5px}
@media (max-width:1100px){.flujo-pasos{grid-template-columns:repeat(2,minmax(0,1fr))}.flujo-pasos li::after{display:none}}
@media (max-width:600px){.flujo-pasos{grid-template-columns:1fr}.flujo-datos{padding:22px}}
/* Funciones en la ficha */
.ficha-empleado dl .ficha-funciones{grid-template-columns:110px minmax(0,1fr)}
.ficha-funciones ol{margin:0;padding:0;list-style:none;display:grid;gap:9px;counter-reset:fn}
.ficha-funciones li{counter-increment:fn;position:relative;display:block;padding-left:22px;font-size:14px;line-height:1.5;color:var(--gris-claro)}
.ficha-funciones li::before{content:counter(fn);position:absolute;left:0;top:1px;color:var(--naranja-claro);font-size:12.5px;font-weight:600}
.ficha-funciones li b{color:var(--tinta)}
.ficha-funciones li i{font-style:normal;font-size:11.5px;color:var(--naranja-claro);border:1px solid rgba(232,89,12,.4);border-radius:999px;padding:1px 7px;margin-left:4px;white-space:nowrap}

/* Ficha: funciones (anula estilos de .ken-texto li) */
.ken-texto .ficha-funciones li{display:block;gap:0;border:0;padding:0 0 0 22px;position:relative;color:var(--gris-claro);font-size:14px;line-height:1.5}
.ken-texto .ficha-funciones li::before{content:counter(fn);position:absolute;left:0;top:0;width:auto;height:auto;margin:0;border-radius:0;background:none;color:var(--naranja-claro);font-size:12.5px;font-weight:600;line-height:1.7}
@media (max-width:520px){.ficha-empleado dl .ficha-funciones{grid-template-columns:1fr}}
/* Equipo completo */
.roles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.rol{border:1px solid var(--linea);border-radius:20px;padding:24px;background:var(--grafito)}
.rol-n{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--gris)}
.rol h3{font-size:19px;margin:8px 0 8px;letter-spacing:-.015em}
.rol p{margin:0;color:var(--gris);font-size:14.5px;line-height:1.55}
.comparacion{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:14px}
.comp-col{border:1px solid var(--linea);border-radius:20px;padding:24px;background:var(--carbon)}
.comp-col h4{margin:0 0 12px;font-size:16px}
.comp-col ul{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.comp-col li{display:flex;gap:10px;font-size:15px;color:var(--gris)}
.comp-col li::before{content:'×';color:var(--gris);flex:none;width:14px}
.comp-col.ken{border-color:rgba(232,89,12,.45);background:linear-gradient(140deg,rgba(232,89,12,.14),transparent 60%),var(--carbon)}
.comp-col.ken li{color:var(--tinta)}
.comp-col.ken li::before{content:'✓';color:var(--naranja-claro)}
@media (max-width:860px){.roles,.comparacion{grid-template-columns:1fr}}
/* Seguimiento */
.etiqueta-mod{display:inline-block;font-size:12px;padding:4px 11px;border-radius:999px;border:1px dashed var(--gris);color:var(--tinta);margin-bottom:14px}
.seg-como{list-style:none;counter-reset:sg;margin:0 0 18px;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.seg-como li{counter-increment:sg;border:1px solid var(--linea);border-radius:16px;padding:16px 16px 16px 50px;position:relative;font-size:14px;line-height:1.5;color:var(--gris);background:var(--carbon)}
.seg-como li::before{content:counter(sg);position:absolute;left:16px;top:15px;width:24px;height:24px;border-radius:50%;border:1px solid var(--naranja);color:var(--naranja-claro);display:grid;place-items:center;font-size:12px;font-weight:600}
.seg-como b{color:var(--tinta);font-weight:600}
.segmentos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.segmento{display:flex;flex-direction:column;border:1px solid var(--linea);border-radius:20px;padding:20px;background:var(--grafito)}
.seg-tag{align-self:flex-start;font-size:11.5px;padding:3px 9px;border-radius:999px;background:rgba(232,89,12,.16);color:var(--naranja-claro)}
.segmento h3{font-size:17px;margin:12px 0 6px}
.segmento p{margin:0;color:var(--gris);font-size:14px;line-height:1.5}
.seg-msj{margin-top:auto;padding:10px 12px;border-radius:12px 12px 12px 3px;background:var(--wa-entrante);font-size:13px;line-height:1.45;color:#e9edef}
.segmento p+.seg-msj{margin-top:14px}
@media (max-width:1100px){.seg-como,.segmentos{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.seg-como,.segmentos{grid-template-columns:1fr}}

.seg-notas{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:14px}
.seg-aviso,.seg-cuidados{border:1px solid var(--linea);border-radius:20px;padding:22px 24px;background:var(--carbon)}
.seg-aviso{border-color:rgba(232,89,12,.4)}
.seg-aviso h3,.seg-cuidados h3{font-size:17px;margin:0 0 8px;display:flex;align-items:center}
.seg-aviso p{margin:0;color:var(--gris-claro);font-size:14.5px;line-height:1.55}
.seg-aviso .seg-costo{margin-top:10px;color:var(--gris);font-size:13.5px}
.seg-cuidados ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.seg-cuidados li{display:flex;gap:10px;font-size:14.5px;color:var(--gris-claro);line-height:1.5}
.seg-cuidados li::before{content:'✓';color:var(--naranja-claro);flex:none}
@media (max-width:860px){.seg-notas{grid-template-columns:1fr}}

/* Aviso de costos de uso */
.aviso-costos{display:grid;grid-template-columns:auto minmax(0,1fr);gap:18px;margin:28px 0 0;padding:24px 26px;border-radius:22px;border:1px solid rgba(255,159,10,.55);background:linear-gradient(135deg,rgba(255,159,10,.12),rgba(255,159,10,.03) 55%),var(--carbon)}
.ac-ico{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#ff9f0a;color:#000;font-weight:800;font-size:18px}
.aviso-costos h3{margin:4px 0 8px;font-size:18px;letter-spacing:-.015em}
.aviso-costos p{margin:0;color:var(--gris-claro);font-size:15px;line-height:1.55;max-width:90ch}
.ac-dos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:16px 0}
.ac-dos div{border:1px solid var(--linea);border-radius:14px;padding:14px 16px;background:rgba(0,0,0,.25)}
.ac-dos b{display:block;margin-bottom:4px}
.ac-dos span{color:var(--gris);font-size:14px;line-height:1.5}
.aviso-costos .ac-pie{font-size:14px;color:var(--gris)}
.aviso-costos a{color:#ffb340}
@media (max-width:760px){.aviso-costos{grid-template-columns:1fr;padding:20px}.ac-dos{grid-template-columns:1fr}}
.lista-faq{margin:10px 0 0;padding-left:20px;color:var(--gris-claro)}
.lista-faq li{margin-top:6px;line-height:1.55}
.aviso-costos .ac-pie{margin-top:10px}
.planes{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:960px){.planes{grid-template-columns:minmax(0,1fr)}}
.plan li>span,.plan li{min-width:0;overflow-wrap:anywhere}
.lista-faq+p{margin-top:12px}

/* ═══ Página única ═══ */
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.grupo{scroll-margin-top:64px}
.grupo+.grupo{border-top:1px solid rgba(255,255,255,.05)}
.cabecera-pagina .titulo-grupo{font-size:clamp(40px,5.6vw,68px);max-width:16ch;text-wrap:balance;letter-spacing:-.04em;line-height:1.02}
/* Menú siempre visible y horizontal, también en celular */
.nav-enlaces{display:flex}
.nav-enlaces a{position:relative;padding:6px 0;transition:color .2s}
.nav-enlaces a[aria-current]{color:var(--tinta)}
.nav-enlaces a[aria-current]::after{content:'';position:absolute;left:0;right:0;bottom:-2px;height:2px;border-radius:2px;background:var(--naranja)}
@media (max-width:860px){
  .nav-enlaces{display:flex}
  .nav .boton{display:none}
  .nav .contenedor{flex-wrap:wrap;height:auto;padding-block:10px 0;row-gap:4px}
  .nav-enlaces{order:3;width:100%;justify-content:space-between;gap:6px;font-size:14px;overflow-x:auto;scrollbar-width:none}
  .nav-enlaces a{padding:8px 2px 10px;white-space:nowrap}
  .nav-enlaces a[aria-current]::after{bottom:2px}
  .grupo{scroll-margin-top:96px}
  [id]{scroll-margin-top:100px}
}
/* Aparición al bajar */
.rv{opacity:0;transform:translateY(28px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1);transition-delay:calc(var(--rv-i,0) * 70ms)}
.rv.visto{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}}
.ken-grid{align-items:start}

/* ═══ Menú: una sola barra, logo a la izquierda y secciones a la derecha ═══ */
.nav .contenedor{justify-content:flex-start}
.nav .marca{margin-right:auto}
.nav-enlaces{gap:26px}
@media (max-width:860px){
  .nav .contenedor{flex-wrap:nowrap;height:58px;padding-block:0;gap:12px}
  .nav-enlaces{order:0;width:auto;justify-content:flex-end;gap:16px;font-size:13.5px;overflow:visible}
  .nav-enlaces a{padding:6px 0}
  .nav-enlaces a[aria-current]::after{bottom:-1px}
  .grupo{scroll-margin-top:58px}
  [id]{scroll-margin-top:66px}
}
@media (max-width:560px){
  .marca .nombre-marca{display:none}
  .nav-enlaces{gap:13px;font-size:13px}
}
@media (max-width:360px){.nav-enlaces{gap:10px;font-size:12px}}

/* ═══ Textos que aparecen palabra por palabra, al estilo Apple ═══ */
.anima-txt .pal{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.1em;margin-bottom:-.1em}
.anima-txt .pal-i{display:inline-block;transform:translateY(105%);opacity:0;filter:blur(6px);transition:transform .9s cubic-bezier(.16,1,.3,1),opacity .9s cubic-bezier(.16,1,.3,1),filter .9s ease;transition-delay:calc(var(--p,0) * 38ms)}
.anima-txt.visto .pal-i{transform:none;opacity:1;filter:none}
/* ═══ Todo lo demás aparece en orden al bajar ═══ */
.rv{opacity:0;transform:translateY(30px);filter:blur(5px);transition:opacity 1s cubic-bezier(.16,1,.3,1),transform 1s cubic-bezier(.16,1,.3,1),filter 1s ease;transition-delay:calc(var(--rv-i,0) * 70ms)}
.rv.visto{opacity:1;transform:none;filter:none}
@media (prefers-reduced-motion:reduce){.anima-txt .pal-i,.rv{transform:none;opacity:1;filter:none;transition:none}}

/* ═══ Acentos de color: verde = Esencial, azul rey = Comercial, naranja = Avanzado y marca ═══ */
/* Planes */
.plan.p-esencial{border-color:rgba(47,191,113,.35);background:linear-gradient(180deg,rgba(47,191,113,.07),rgba(47,191,113,0) 40%),var(--carbon)}
.plan.p-comercial{border-color:rgba(61,107,255,.45);background:linear-gradient(180deg,rgba(61,107,255,.10),rgba(61,107,255,0) 42%),var(--carbon)}
.plan.p-esencial h3{color:var(--verde-claro)}
.plan.p-comercial h3{color:var(--azul-claro)}
.plan.p-avanzado h3{color:var(--naranja-claro)}
.plan.p-esencial li svg{color:var(--verde-claro)}
.plan.p-comercial li svg{color:var(--azul-claro)}
.plan.p-comercial .boton-secundario{border-color:rgba(61,107,255,.5)}
.plan.p-esencial .boton-secundario{border-color:rgba(47,191,113,.45)}
/* Tabla comparativa: cada columna con el color de su plan */
.tabla-planes thead th:nth-child(2){color:var(--verde-claro)}
.tabla-planes thead th:nth-child(3){color:var(--azul-claro)}
.tabla-planes thead th:nth-child(4){color:var(--naranja-claro)}
.tabla-planes td.si:nth-child(2){color:var(--verde-claro)}
.tabla-planes td.si:nth-child(3){color:var(--azul-claro)}
/* Etiquetas de plan en habilidades, capas, CRM y ficha */
.hab-plan.p-esencial{color:var(--verde-claro);border-color:rgba(47,191,113,.4)}
.hab-plan.p-comercial{color:var(--azul-claro);border-color:rgba(61,107,255,.5)}
.c-base .capa-tag{color:var(--verde-claro)}
.c-base{border-color:rgba(47,191,113,.35)}
.c-base .capa-plan{color:var(--verde-claro);border-color:rgba(47,191,113,.4)}
.c-com .capa-tag{color:var(--azul-claro)}
.c-com{border-color:rgba(61,107,255,.4)}
.c-com .capa-plan{color:var(--azul-claro);border-color:rgba(61,107,255,.5)}
.pieza .tag-plan.e{color:var(--verde-claro);border-color:rgba(47,191,113,.4)}
.pieza .tag-plan.c{color:var(--azul-claro);border-color:rgba(61,107,255,.5)}
.ficha-funciones li i.i-com{color:var(--azul-claro);border-color:rgba(61,107,255,.5)}
.ficha-funciones li i.i-ext{color:var(--gris-claro);border-color:var(--gris);border-style:dashed}
.habilidades.filtrado .habilidad.dentro[data-desde="esencial"]{border-color:rgba(47,191,113,.55)}
.habilidades.filtrado .habilidad.dentro[data-desde="comercial"]{border-color:rgba(61,107,255,.6)}
/* "Entiende tu negocio": el lado de los datos va en azul */
.sistema-lado.azul{border-color:rgba(61,107,255,.35);background:radial-gradient(90% 60% at 100% 0%,rgba(61,107,255,.13),transparent 70%),var(--carbon)}
.sistema-lado.azul .sistema-num{color:var(--azul-claro)}
.flujo-datos{background:radial-gradient(70% 80% at 0% 100%,rgba(61,107,255,.08),transparent 70%),var(--carbon)}
.fp-n{border-color:var(--azul);color:var(--azul-claro)}
.flujo-pasos li:not(:last-child)::after{color:var(--azul-claro)}
.flujo-pasos .fp-ej{color:var(--azul-claro)}
/* Panel: brillo azul detrás del dashboard */
.vista-dashboard{box-shadow:0 40px 120px -50px rgba(61,107,255,.45)}
/* Santiago: sección con acento azul rey */
.fundador{position:relative}
.fundador::before{content:'';position:absolute;inset:-60px -40px;z-index:-1;pointer-events:none;background:radial-gradient(45% 60% at 22% 50%,rgba(61,107,255,.20),transparent 70%)}
.fundador blockquote{border-left:2px solid var(--azul);padding-left:28px}
.fundador blockquote::before{content:'“';display:block;font-size:72px;line-height:.6;height:30px;color:var(--azul);font-weight:700}
.firma b{color:var(--azul-claro)}
@media (max-width:900px){.fundador blockquote{padding-left:20px}}
.fundador::before{inset:-60px 0}main{overflow-x:clip}

/* ═══ Ajustes de color (ronda 2) ═══ */
/* Borde degradado naranja → azul, reutilizable */
.borde-degrade,.cuadro,.c-ava,.c-ext{border:1px solid transparent;border-style:solid}
/* Cuadros de video: brillo degradado naranja → azul y marco con el mismo degradado */
.cuadro{background:linear-gradient(#0c0c0e,#0c0c0e) padding-box,linear-gradient(135deg,rgba(232,89,12,.85),rgba(61,107,255,.85)) border-box}
.cuadro.pendiente{background:
  radial-gradient(55% 60% at 72% 78%,rgba(232,89,12,.30),transparent 70%) padding-box,
  radial-gradient(55% 60% at 30% 30%,rgba(61,107,255,.28),transparent 70%) padding-box,
  linear-gradient(135deg,#121214,#0b0b0d) padding-box,
  linear-gradient(135deg,rgba(232,89,12,.85),rgba(61,107,255,.85)) border-box}
/* Capas "+ Seguimiento" y "+ A la medida": borde degradado */
.c-ava,.c-ext{background:linear-gradient(var(--grafito),var(--grafito)) padding-box,linear-gradient(120deg,var(--naranja),var(--azul)) border-box}
.c-ext .capa-plan{border-style:solid}
/* Etiquetas de plan: las tres solo con borde, cada una en su color */
.pieza .tag-plan.a,.hab-plan.p-avanzado,.c-ava .capa-plan{color:var(--naranja-claro);background:transparent;border-color:rgba(232,89,12,.55)}

/* ═══ Ajustes de color (ronda 3) ═══ */
:root{--degrade:linear-gradient(120deg,var(--naranja),var(--azul))}
.texto-degrade{background:linear-gradient(90deg,var(--naranja-claro),var(--azul-claro));-webkit-background-clip:text;background-clip:text;color:transparent}
/* Piezas de "Lo que pasa detrás": marco degradado que se queda puesto */
.pieza{border:1px solid var(--linea)}
.recorrido.con-js .pieza.puesta,.paso-visual .pieza{border-color:transparent;background:linear-gradient(var(--grafito),var(--grafito)) padding-box,var(--degrade) border-box}
.pieza.actual{border-color:transparent;box-shadow:0 0 0 1px rgba(61,107,255,.25),0 18px 50px -20px rgba(232,89,12,.45)}
.recorrido.con-js .paso-visual .pieza{opacity:1;transform:none}
/* Cuadros de escena: destello repartido en toda la superficie, negro al centro */
.cuadro.pendiente{background:
  radial-gradient(80% 70% at 0% 0%,rgba(61,107,255,.30),transparent 62%) padding-box,
  radial-gradient(80% 70% at 100% 100%,rgba(232,89,12,.30),transparent 62%) padding-box,
  radial-gradient(60% 50% at 100% 0%,rgba(61,107,255,.10),transparent 70%) padding-box,
  radial-gradient(60% 50% at 0% 100%,rgba(232,89,12,.10),transparent 70%) padding-box,
  linear-gradient(#08080a,#08080a) padding-box,
  var(--degrade) border-box}
/* "+ Recordatorios" en naranja (plan Avanzado); "+ A la medida" sigue con borde degradado */
.c-ava{background:linear-gradient(180deg,rgba(232,89,12,.07),transparent 60%),var(--grafito);border:1px solid rgba(232,89,12,.55)}
.c-ava .capa-tag{color:var(--naranja-claro)}
/* Habilidades adicionales: siempre con marco degradado; se iluminan con "+ Adicionales" */
.habilidad[data-desde="extra"]{border:1px solid transparent;background:linear-gradient(var(--grafito),var(--grafito)) padding-box,var(--degrade) border-box}
.habilidades.filtrado .habilidad.fuera[data-desde="extra"]{background:linear-gradient(var(--grafito),var(--grafito)) padding-box,linear-gradient(120deg,rgba(232,89,12,.35),rgba(61,107,255,.35)) border-box}
.habilidades.filtrado .habilidad.dentro[data-desde="extra"]{box-shadow:0 20px 60px -30px rgba(61,107,255,.6)}
.hab-plan.p-extra{border:1px solid transparent;background:linear-gradient(var(--grafito),var(--grafito)) padding-box,var(--degrade) border-box}
.selector-plan .sel-extra[aria-pressed="true"]{background:linear-gradient(120deg,rgba(232,89,12,.25),rgba(61,107,255,.25));color:var(--tinta)}
.selector-plan .sel-extra[aria-pressed="true"] .texto-degrade{color:var(--tinta);background:none}
/* Etiqueta "Adicional del plan Avanzado" */
.etiqueta-mod{border:1px solid transparent;background:linear-gradient(#000,#000) padding-box,var(--degrade) border-box}
/* Cuidados: advertencia en ámbar, como el aviso de costos */
.seg-cuidados{border-color:rgba(255,159,10,.55);background:linear-gradient(135deg,rgba(255,159,10,.10),rgba(255,159,10,.02) 55%),var(--carbon)}
.seg-cuidados h3{color:#ffb340}
.seg-cuidados h3::before{content:'!';display:inline-grid;place-items:center;width:22px;height:22px;margin-right:10px;border-radius:50%;background:#ff9f0a;color:#000;font-size:13px;font-weight:800}
.seg-cuidados li::before{color:#ffb340}
/* Reporte mensual con marco degradado */
.bloque-reporte{border:1px solid transparent;background:linear-gradient(var(--carbon),var(--carbon)) padding-box,var(--degrade) border-box}

/* ═══ Ajustes de color (ronda 4) ═══ */
/* 01 y 02, y "Del chat a tus decisiones": borde degradado */
.sistema-lado.azul,.sistema-lado{border:1px solid transparent;background:radial-gradient(90% 60% at 100% 0%,rgba(61,107,255,.10),transparent 70%) padding-box,linear-gradient(var(--carbon),var(--carbon)) padding-box,var(--degrade) border-box}
.flujo-datos{border:1px solid transparent;background:radial-gradient(70% 80% at 0% 100%,rgba(61,107,255,.08),transparent 70%) padding-box,linear-gradient(var(--carbon),var(--carbon)) padding-box,var(--degrade) border-box}
/* Persona 1, 2, 3 con los colores de Esencial, Comercial y Avanzado */
.rol.r-e{border-color:rgba(47,191,113,.45);background:linear-gradient(180deg,rgba(47,191,113,.08),transparent 60%),var(--grafito)}
.rol.r-c{border-color:rgba(61,107,255,.5);background:linear-gradient(180deg,rgba(61,107,255,.10),transparent 60%),var(--grafito)}
.rol.r-a{border-color:rgba(232,89,12,.55);background:linear-gradient(180deg,rgba(232,89,12,.09),transparent 60%),var(--grafito)}
.rol.r-e .rol-n{color:var(--verde-claro)}.rol.r-c .rol-n{color:var(--azul-claro)}.rol.r-a .rol-n{color:var(--naranja-claro)}
/* Comparación: "Con Ken-Ai" con borde degradado; "a mano" queda neutro para que el contraste se lea solo */
.comp-col.ken{border:1px solid transparent;background:linear-gradient(140deg,rgba(232,89,12,.10),rgba(61,107,255,.08) 60%,transparent) padding-box,linear-gradient(var(--carbon),var(--carbon)) padding-box,var(--degrade) border-box}
.comp-col:not(.ken){opacity:.85}
/* CRM y dashboard: borde degradado */
.crm-que article{border:1px solid transparent;background:linear-gradient(var(--carbon),var(--carbon)) padding-box,var(--degrade) border-box}
/* Selector de planes en una sola fila, con el color de cada plan */
.selector-plan{display:flex;flex-wrap:nowrap;width:max-content;max-width:100%;overflow-x:auto;scrollbar-width:none}
.selector-plan::-webkit-scrollbar{display:none}
.selector-plan button{white-space:nowrap;flex:none}
.sel-e span{background:linear-gradient(90deg,var(--verde-claro),var(--verde));-webkit-background-clip:text;background-clip:text;color:transparent}
.sel-c span{background:linear-gradient(90deg,var(--azul-claro),var(--azul));-webkit-background-clip:text;background-clip:text;color:transparent}
.sel-a span{background:linear-gradient(90deg,#ffb27f,var(--naranja));-webkit-background-clip:text;background-clip:text;color:transparent}
.selector-plan .sel-e[aria-pressed="true"]{background:rgba(47,191,113,.18)}
.selector-plan .sel-c[aria-pressed="true"]{background:rgba(61,107,255,.22)}
.selector-plan .sel-a[aria-pressed="true"]{background:rgba(232,89,12,.22)}
.selector-plan .sel-extra[aria-pressed="true"] .texto-degrade{background:linear-gradient(90deg,var(--naranja-claro),var(--azul-claro));-webkit-background-clip:text;background-clip:text;color:transparent}
@media (max-width:560px){.selector-plan{gap:2px;padding:3px}.selector-plan button{padding:8px 11px;font-size:13px}}
@media (max-width:380px){.selector-plan button{padding:7px 8px;font-size:12px}}
@media (max-width:560px){.selector-plan{width:100%;justify-content:space-between}.selector-plan button{flex:1 1 auto;padding:8px 4px;font-size:12.5px;letter-spacing:-.01em}}
@media (max-width:380px){.selector-plan button{padding:7px 2px;font-size:11.5px}}

/* ═══ Ajustes (ronda 5) ═══ */
/* Comparación: "a mano" también resaltado, en tono neutro claro, con ✕ en rojo suave */
.comp-col:not(.ken){opacity:1;border:1px solid rgba(255,255,255,.28);background:linear-gradient(140deg,rgba(255,255,255,.07),rgba(255,255,255,.02) 60%),var(--carbon)}
.comp-col:not(.ken) li{color:var(--gris-claro)}
.comp-col:not(.ken) li::before{color:#ff6b6b}
/* Separador fino entre secciones */
main section{position:relative}
.grupo > section + section::before,.grupo + .grupo > section:first-child::before{content:'';position:absolute;top:0;left:50%;transform:translateX(-50%);width:min(520px,62%);height:1px;background:linear-gradient(90deg,transparent,rgba(232,89,12,.55),rgba(61,107,255,.55),transparent);pointer-events:none}
.grupo + .grupo{border-top:0}
/* Selector: solo "Adicionales" en degradado; los planes en color plano; "Todas" translúcido */
.sel-e span,.sel-c span,.sel-a span{background:none;-webkit-background-clip:border-box;background-clip:border-box}
.sel-e span{color:var(--verde-claro)}.sel-c span{color:var(--azul-claro)}.sel-a span{color:var(--naranja-claro)}
.selector-plan button[data-ver="todas"]{color:var(--gris-claro)}
.selector-plan button[data-ver="todas"][aria-pressed="true"]{background:rgba(255,255,255,.14);color:var(--tinta);font-weight:600}
/* Vista "Todas": todas las tarjetas iguales, sin marcos de color */
.habilidades:not(.filtrado) .habilidad,.habilidades:not(.filtrado) .habilidad[data-desde="extra"]{border:1px solid var(--linea);background:var(--grafito);box-shadow:none}
/* Segmentos del seguimiento con borde degradado */
.segmento{border:1px solid transparent;background:linear-gradient(var(--grafito),var(--grafito)) padding-box,var(--degrade) border-box}
/* Tarjetas de CRM y dashboard por plan con borde iluminado de su color */
.crm-planes article:nth-child(1){border-color:rgba(47,191,113,.55);box-shadow:0 0 0 1px rgba(47,191,113,.12),0 18px 50px -28px rgba(47,191,113,.55)}
.crm-planes article:nth-child(2){border-color:rgba(61,107,255,.6);box-shadow:0 0 0 1px rgba(61,107,255,.14),0 18px 50px -28px rgba(61,107,255,.6)}
.crm-planes article:nth-child(3){border-color:rgba(232,89,12,.6);box-shadow:0 0 0 1px rgba(232,89,12,.14),0 18px 50px -28px rgba(232,89,12,.6)}

/* Ronda 6 */
.grupo > section + section::before,.grupo + .grupo > section:first-child::before{background:linear-gradient(90deg,transparent,rgba(255,255,255,.38) 50%,transparent)}
.comp-col:not(.ken){border:1px solid rgba(225,226,232,.5);background:var(--carbon);box-shadow:0 0 0 1px rgba(225,226,232,.05),0 18px 50px -30px rgba(225,226,232,.25)}
.seg-aviso,.ac-dos div{border:1px solid rgba(225,226,232,.45);background:var(--carbon)}
.hab-plan .texto-degrade,.capa-plan .texto-degrade{font-weight:600}
/* Ronda 7 */
.ac-ico,.seg-cuidados h3::before{background:transparent;color:#ffb340;border:1.5px solid #ff9f0a;box-shadow:0 0 14px -2px rgba(255,159,10,.45)}
.seg-como li,.seg-aviso,.ac-dos div{border:1px solid rgba(225,226,232,.5);box-shadow:0 0 0 1px rgba(225,226,232,.05),0 16px 44px -28px rgba(225,226,232,.3)}
.habilidades:not(.filtrado) .habilidad,.habilidades:not(.filtrado) .habilidad[data-desde="extra"]{border:1px solid rgba(225,226,232,.5);background:var(--grafito);box-shadow:0 0 0 1px rgba(225,226,232,.05),0 18px 50px -30px rgba(225,226,232,.3)}
/* Ronda 8 */
.grupo > section + section::before,.grupo + .grupo > section:first-child::before{top:var(--sep-y,0px)}
.letra-pequena div{border:1px solid rgba(225,226,232,.5);background:var(--carbon);box-shadow:0 0 0 1px rgba(225,226,232,.05),0 16px 44px -28px rgba(225,226,232,.3)}
.pieza .plantilla{max-width:100%}
.grupo > section + section::before,.grupo + .grupo > section:first-child::before{opacity:var(--sep-o,1)}
/* Ronda 9: teléfono tipo iPhone con borde claro iluminado; tabla de planes iluminada */
.telefono{position:relative;background:#050506;padding:11px;border-radius:54px;border:1px solid rgba(225,226,232,.55);box-shadow:0 0 0 1px rgba(225,226,232,.06),inset 0 0 0 2px #1b1c1f,0 24px 70px -30px rgba(225,226,232,.35),0 40px 120px -40px rgba(232,89,12,.35)}
.telefono::before{content:'';position:absolute;left:-3px;top:120px;width:3px;height:30px;border-radius:2px 0 0 2px;background:#2a2b2f;box-shadow:0 52px 0 #2a2b2f,0 104px 0 #2a2b2f}
.telefono::after{content:'';position:absolute;right:-3px;top:170px;width:3px;height:70px;border-radius:0 2px 2px 0;background:#2a2b2f}
.telefono .pantalla{position:relative;border-radius:44px;padding-top:44px;background:#1f2c34}
.telefono .pantalla::before{content:'';position:absolute;top:11px;left:50%;transform:translateX(-50%);width:104px;height:30px;border-radius:20px;background:#000;z-index:3}
.telefono .pantalla::after{content:'11:47';position:absolute;top:16px;left:30px;font-size:14px;font-weight:600;color:#fff;letter-spacing:-.01em;z-index:3}
.telefono .estado-tel{position:absolute;top:18px;right:26px;display:flex;gap:5px;align-items:center;z-index:3}
.telefono .wa-chat{background:var(--wa-fondo)}
.tabla-envoltura{border:1px solid rgba(225,226,232,.5);box-shadow:0 0 0 1px rgba(225,226,232,.05),0 18px 50px -30px rgba(225,226,232,.3)}
/* Ronda 10: teléfono con proporción de iPhone y barra para escribir */
.hero .telefono{width:318px;border-radius:50px;padding:10px}
.hero .telefono .pantalla{border-radius:41px}
.hero .wa-chat{height:478px;font-size:13px;line-height:1.36;gap:6px;padding:14px 10px}
.hero .wa-chat .msj{max-width:86%}
.hero .wa-cabecera{padding:10px 14px;gap:10px}
.hero .wa-avatar{width:32px;height:32px;font-size:12.5px}
.hero .wa-nombre{font-size:14px}
.hero .wa-estado{font-size:11.5px}
.telefono .pantalla::before{width:92px;height:27px}
.telefono .pantalla::after{left:26px;font-size:13.5px}
.telefono .estado-tel{right:22px}
.wa-escribir{display:flex;align-items:center;gap:6px;padding:7px 8px 16px;background:var(--wa-fondo);pointer-events:none;user-select:none}
.wa-caja{flex:1;display:flex;align-items:center;gap:9px;background:#1f2c34;border-radius:22px;padding:8px 11px;min-width:0}
.wa-caja span{flex:1;color:#8696a0;font-size:14px}
.wa-mic{width:38px;height:38px;flex:none;border-radius:50%;background:#00a884;display:grid;place-items:center}
.hero .escena{min-height:620px}@media (max-width:520px){.hero .escena{min-height:530px}}
/* Ronda 11: teléfono menos alargado; tabla agrupada por plan */
.hero .wa-chat{height:404px}
.hero .escena{min-height:560px}
@media (max-width:520px){.hero .escena{min-height:480px}}
.tabla-planes .fila-grupo th{padding:20px 18px 8px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;font-weight:600;border-bottom:1px solid var(--linea);background:transparent;width:auto}
.tabla-planes .fila-grupo.g-e th{color:var(--verde-claro)}
.tabla-planes .fila-grupo.g-c th{color:var(--azul-claro)}
.tabla-planes .fila-grupo.g-a th{color:var(--naranja-claro)}
.tabla-planes .fila-grupo.g-x th span{background:linear-gradient(90deg,var(--naranja-claro),var(--azul-claro));-webkit-background-clip:text;background-clip:text;color:transparent}
.tabla-planes .fila-grupo.g-p th{color:var(--gris)}
.tabla-planes td.adic{font-weight:600}
.tabla-planes tbody th .ayuda{margin-left:4px;vertical-align:1px}
/* Ronda 12: precios al final de la tabla y costos de uso aparte */
.tabla-planes tr.fila-precio th,.tabla-planes tr.fila-precio td{background:rgba(255,255,255,.025)}
.tabla-planes tr.fila-precio td{font-weight:600;font-size:16px}
.tabla-costos{margin-top:18px}
.tabla-costos .tabla-planes td{color:var(--gris-claro)}
.tabla-planes{table-layout:fixed}.tabla-planes thead th:first-child{width:34%}
/* Ronda 13: animaciones más fluidas (sin desenfoque en bloques grandes) */
.rv{opacity:0;transform:translate3d(0,26px,0);filter:none;transition:opacity .9s cubic-bezier(.16,1,.3,1),transform 1.1s cubic-bezier(.16,1,.3,1);transition-delay:calc(var(--rv-i,0) * 70ms);will-change:opacity,transform}
.rv.visto{opacity:1;transform:none}
.anima-txt .pal-i{transform:translate3d(0,105%,0);filter:none;transition:transform 1s cubic-bezier(.16,1,.3,1),opacity .8s cubic-bezier(.16,1,.3,1);will-change:transform,opacity}
.anima-txt.visto .pal-i{transform:none}
@media (prefers-reduced-motion:reduce){.anima-txt .pal-i,.rv{transform:none;opacity:1;transition:none}}
/* Barra para escribir con el mensaje tecleándose */
.wa-texto{flex:1;min-width:0;overflow:hidden;white-space:nowrap;font-size:14px;color:#e9edef;position:relative}
.wa-ph{color:#8696a0}
.wa-escribir.activa .wa-ph{display:none}
.wa-tecleo{display:inline}
.wa-escribir.activa .wa-tecleo::after{content:'';display:inline-block;width:1.5px;height:1.05em;margin-left:1px;vertical-align:-2px;background:#00a884;animation:cursor-wa 1s steps(1) infinite}
@keyframes cursor-wa{50%{opacity:0}}
.wa-escribir.activa .wa-caja svg:last-of-type{display:none}
.wa-mic{position:relative;transition:transform .18s ease}
.wa-mic svg{position:absolute;transition:opacity .2s ease,transform .2s ease}
.wa-mic .ico-enviar{opacity:0;transform:scale(.6) rotate(-20deg)}
.wa-mic.enviar .ico-enviar{opacity:1;transform:none}
.wa-mic.enviar .ico-mic{opacity:0;transform:scale(.6)}
.wa-mic.pulsa{transform:scale(.84);background:#06cf9c}
.wa-caja .wa-tecleo{color:#e9edef;flex:none}.wa-caja .wa-ph{flex:none}
/* Ronda 14: vuelve el desenfoque, con transiciones en la GPU */
.rv{filter:blur(5px);transition:opacity .9s cubic-bezier(.16,1,.3,1),transform 1.1s cubic-bezier(.16,1,.3,1),filter .9s cubic-bezier(.16,1,.3,1);will-change:opacity,transform,filter;backface-visibility:hidden}
.rv.visto{filter:blur(0)}
.anima-txt .pal-i{filter:blur(6px);transition:transform 1s cubic-bezier(.16,1,.3,1),opacity .8s cubic-bezier(.16,1,.3,1),filter .8s cubic-bezier(.16,1,.3,1)}
.anima-txt.visto .pal-i{filter:blur(0)}
@media (prefers-reduced-motion:reduce){.anima-txt .pal-i,.rv{filter:none}}
/* Ronda 15: desenfoque más marcado y transición más pausada */
.rv{filter:blur(12px);transform:translate3d(0,34px,0) scale(.985);transition:opacity 1.3s cubic-bezier(.16,1,.3,1),transform 1.5s cubic-bezier(.16,1,.3,1),filter 1.4s cubic-bezier(.22,1,.36,1);transition-delay:calc(var(--rv-i,0) * 90ms)}
.rv.visto{filter:blur(0);transform:none}
.anima-txt .pal-i{filter:blur(14px);transition:transform 1.3s cubic-bezier(.16,1,.3,1),opacity 1.1s cubic-bezier(.16,1,.3,1),filter 1.3s cubic-bezier(.22,1,.36,1);transition-delay:calc(var(--p,0) * 48ms)}
.anima-txt.visto .pal-i{filter:blur(0)}
@media (prefers-reduced-motion:reduce){.anima-txt .pal-i,.rv{filter:none;transform:none;transition:none}}

/* ═══ Ronda 16 ═══ */
/* Borde inferior cortado: al terminar la aparición se quitan el filtro y la aceleración de la tarjeta */
.rv.visto.listo{filter:none;transition:none;will-change:auto;backface-visibility:visible}
.cuadro{overflow:hidden}

/* Casos: cada uno con su propio recuadro, quieto, junto a su texto */
.casos-lista{display:grid;gap:clamp(56px,8vw,96px);margin-top:28px}
.caso{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);gap:56px;align-items:center}
.caso h3{font-size:clamp(24px,2.4vw,32px);letter-spacing:-.025em}
.caso-texto ul{margin:22px 0 0;padding:0;list-style:none;font-size:15.5px}
.caso-texto li{display:flex;gap:10px;padding:9px 0;border-top:1px solid var(--linea);color:var(--gris-claro)}
.caso-texto li::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--naranja);margin-top:9px;flex:none}
@media (max-width:960px){.caso{grid-template-columns:1fr;gap:24px}}

/* Lo que pasa detrás: cada paso con su pantalla debajo, en horizontal */
.pasos-lista{display:grid;gap:clamp(48px,6vw,76px);margin-top:28px}
.paso-h{display:grid;gap:22px}
.paso-cab{display:grid;grid-template-columns:auto minmax(0,1fr);gap:18px;align-items:start}
.paso-cab .num-paso{margin:2px 0 0}
.paso-cab h3{font-size:clamp(22px,2.2vw,28px);letter-spacing:-.025em}
.paso-cab .paso-texto{max-width:64ch;margin-top:10px;font-size:17px}
.paso-visual{display:block;margin:0}
.paso-visual .mesa{display:block;padding:0;border:0;border-radius:0;background:none}
.paso-visual .mesa::after{display:none}
.paso-visual .pieza{padding:18px 20px;font-size:14px;line-height:1.45;border-radius:18px}
@media (min-width:761px){
  .paso-visual .p-chat .burbuja{max-width:min(560px,78%)}
  .paso-visual .p-persona{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
  .paso-visual .p-persona .pieza-t{grid-column:1/-1}
  .paso-visual .p-persona .grupo-plan,.paso-visual .p-persona .grupo-plan+.grupo-plan{margin:0;padding:0 22px;border-top:0;border-left:1px solid var(--linea)}
  .paso-visual .p-persona .pieza-t + .grupo-plan{padding-left:0;border-left:0}
  .paso-visual .p-persona .dato{flex-direction:column;gap:0;padding:4px 0}
  .paso-visual .p-persona .dato span:last-child{text-align:left}
  .paso-visual .p-cal{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
  .paso-visual .p-cal .pieza-t{grid-column:1/-1;margin-bottom:2px}
  .paso-visual .p-cal .hora-cal{border:1px solid var(--linea);border-radius:10px;padding:11px 13px;margin:0}
  .paso-visual .p-cal .hora-cal.ocupada{border-color:rgba(232,89,12,.55)}
  .paso-visual .dos-col{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
  .paso-visual .p-equipo{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
  .paso-visual .p-equipo .pieza-t{grid-column:1/-1}
  .paso-visual .p-equipo .fila{flex-direction:column;gap:3px;padding:0 22px;border:0;border-left:1px solid var(--linea);font-size:15px}
  .paso-visual .p-equipo .pieza-t + .fila{padding-left:0;border-left:0}
  .paso-visual .p-grafica{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);column-gap:48px;align-items:end}
  .paso-visual .p-grafica .pieza-t{grid-column:1/-1}
  .paso-visual .p-grafica .fila{flex-direction:column;border:0;gap:2px;padding:0}
  .paso-visual .p-grafica .fila span:last-child{font-size:38px;font-weight:600;letter-spacing:-.02em;color:var(--tinta)}
  .paso-visual .p-grafica .barras{height:96px;gap:10px;margin:0}
}

/* Habilidades: las cuatro tarjetas del mismo tamaño y alineadas */
.c-com,.c-ava,.c-ext{margin-left:0}

/* Botones de los planes: rellenos con el color de cada plan */
.plan.p-esencial .boton{background:#1E9A5A;border-color:#1E9A5A;color:#fff}
.plan.p-esencial .boton:hover{background:#188049;border-color:#188049}
.plan.p-comercial .boton{background:var(--azul);border-color:var(--azul);color:#fff}
.plan.p-comercial .boton:hover{background:#2f58e0;border-color:#2f58e0}

/* Conoce a Ken-Ai: recuadros arriba y la ficha a todo el ancho */
.ken-vertical{display:grid;gap:34px}
.ken-vertical .ken-fotos{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:stretch}
.ken-vertical .ken-fotos .cuadro{aspect-ratio:4/3}
.ken-cabeza p{max-width:62ch}
.ken-ficha .ficha-empleado{margin:0}
.ken-ficha > p{margin-top:24px;max-width:70ch}
@media (min-width:761px){
  .ken-ficha .ficha-empleado dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:56px;padding:6px 24px}
  .ken-ficha .ficha-empleado dl > div:nth-child(2){border-top:0}
  .ken-ficha .ficha-empleado dl > .ficha-funciones{grid-column:1/-1}
  .ken-ficha .ficha-funciones ol{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 44px}
}
@media (max-width:760px){.ken-vertical .ken-fotos{grid-template-columns:1fr}}

/* ═══ Ronda 17: inicio con el video grande y el celular al lado, sin taparlo ═══ */
.hero{padding:60px 0 24px}
.hero .contenedor{display:grid;grid-template-columns:minmax(0,1fr);gap:44px;align-items:start}
.hero h1{font-size:clamp(38px,5.3vw,66px)}
.hero-texto{display:grid;grid-template-columns:minmax(0,1fr);align-items:center}
.hero-texto .intro{margin-top:22px}
@media (min-width:961px){
  .hero-texto{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);column-gap:56px}
  .hero-texto h1{grid-column:1;grid-row:1 / span 2}
  .hero-texto .intro{grid-column:2;grid-row:1;margin-top:0;align-self:end}
  .hero-texto .acciones{grid-column:2;grid-row:2;margin-top:28px;align-self:start}
}
.hero .escena{position:relative;width:100%;max-width:none;min-height:0;padding:0;justify-self:stretch;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:22px;align-items:stretch}
.hero .hero-cuadro{width:auto;margin:0;aspect-ratio:auto;min-height:440px}
.hero .tel-grupo{position:relative;width:318px;zoom:.9;align-self:center}
.hero .telefono{position:relative;left:auto;top:auto;width:318px;zoom:1}
/* Los avisos salen sobre la pantalla del celular, como en un teléfono real */
.hero .evento{position:absolute;left:12px;right:12px;width:auto;z-index:6;pointer-events:none;padding:10px 12px;border-radius:16px;background:rgba(40,40,44,.94);border:1px solid rgba(255,255,255,.1);box-shadow:0 14px 30px -14px #000}
.hero .evento.e1{top:62px;right:12px}
.hero .evento.e2{top:132px;bottom:auto;right:12px}
.escena.anim .evento{transform:translateY(-14px)}
.escena.anim .evento.ver{transform:none}
@media (max-width:1023px){.hero .tel-grupo{zoom:.84}.hero .hero-cuadro{min-height:400px}}
@media (max-width:760px){
  .hero{padding:40px 0 16px}
  .hero .contenedor{gap:32px}
  .hero .escena{grid-template-columns:minmax(0,1fr);justify-items:center;gap:24px;min-height:0}
  .hero .hero-cuadro{width:100%;aspect-ratio:4/5;min-height:0}
  .hero .tel-grupo{zoom:.92}
  .hero .telefono{zoom:1;top:auto}
}
/* Ronda 17b: más compacto, para ver el video casi completo en la primera pantalla */
.hero{padding:44px 0 20px}
.hero .contenedor{gap:30px}
.hero h1{font-size:clamp(36px,4.6vw,58px)}
.hero .evento{font-size:12px;gap:9px;padding:9px 11px}
.hero .evento .ico{width:24px;height:24px}
.hero .evento.e1{top:60px}
.hero .evento.e2{top:128px}
@media (min-width:1024px){.hero .tel-grupo{zoom:.86}.hero .hero-cuadro{min-height:420px}}

/* ═══ Ronda 18: habilidades en filas horizontales, una debajo de otra ═══ */
.habilidades{grid-template-columns:minmax(0,1fr);gap:12px}
@media (min-width:761px){
  .habilidad{display:grid;grid-template-columns:176px minmax(0,1.1fr) minmax(0,1fr);grid-template-areas:"cab tit lista" "cab desc lista" "cab falta falta";column-gap:36px;row-gap:0;align-items:start;padding:22px 28px}
  .habilidad .hab-cab{grid-area:cab;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:10px}
  .habilidad h3{grid-area:tit;margin:0 0 6px;font-size:19px}
  .habilidad p{grid-area:desc}
  .habilidad ul{grid-area:lista;margin:0;padding:0 0 0 30px;border-top:0;border-left:1px solid var(--linea);align-self:stretch;align-content:center;gap:8px}
  .habilidad .hab-falta{grid-area:falta;margin-top:12px}
}
@media (min-width:761px){
  .habilidad{grid-template-rows:auto 1fr auto}
  .habilidad h3,.habilidad p{align-self:start}
}
@media (min-width:761px) and (max-width:1000px){
  .habilidad{grid-template-columns:140px minmax(0,1.1fr) minmax(0,1fr);column-gap:26px;padding:20px 22px}
  .habilidad ul{padding-left:22px}
}

/* ═══ Ronda 19: inicio (texto izq + celular der, video grande debajo) · habilidades · Ken-Ai ═══ */
.hero .escena{display:contents}
.hero .contenedor{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"texto tel" "video video";column-gap:56px;row-gap:44px;align-items:center}
.hero .hero-texto{grid-area:texto;display:block}
.hero .hero-texto h1{font-size:clamp(34px,4.2vw,58px)}
.hero .hero-texto .intro{margin-top:24px;max-width:560px}
.hero .hero-texto .acciones{margin-top:32px}
.hero .tel-grupo{grid-area:tel;justify-self:center;align-self:center;zoom:1.04}
.hero .hero-cuadro{grid-area:video;width:100%;margin:0;min-height:0;aspect-ratio:16/9;align-self:start}
@media (max-width:1023px){.hero .tel-grupo{zoom:.92}.hero .contenedor{column-gap:36px}}
@media (max-width:760px){
  .hero .contenedor{grid-template-columns:minmax(0,1fr);grid-template-areas:"texto" "video" "tel";row-gap:30px}
  .hero .hero-cuadro{aspect-ratio:16/9;min-height:0}
  .hero .tel-grupo{zoom:.94}
}
.ken-vertical .ken-fotos{align-items:start}
.habilidad h3 .ayuda{margin-left:8px;vertical-align:middle}
/* Ronda 19b: animación de aparición a 1.2 s · un solo video de Ken-Ai */
.rv{transition:opacity 1.2s cubic-bezier(.16,1,.3,1),transform 1.2s cubic-bezier(.16,1,.3,1),filter 1.2s cubic-bezier(.22,1,.36,1);transition-delay:calc(var(--rv-i,0) * 90ms)}
.ken-vertical .ken-fotos{grid-template-columns:minmax(0,1fr)}
.ken-vertical .ken-fotos .cuadro{aspect-ratio:16/9}

/* Ronda 20: videos horizontales en celular → formato 1:1 (se recorta a los lados) · textos animados a 1.2 s · preguntas frecuentes de lado a lado */
@media (max-width:760px){
  .cuadro.ancho,.hero .hero-cuadro,.ken-vertical .ken-fotos .cuadro,.escenario.panorama{aspect-ratio:1/1}
}
.anima-txt .pal-i{transition:transform 1.2s cubic-bezier(.16,1,.3,1),opacity 1.2s cubic-bezier(.16,1,.3,1),filter 1.2s cubic-bezier(.22,1,.36,1);transition-delay:calc(var(--p,0) * 40ms)}
.preguntas{max-width:none}
.preguntas details p{max-width:none}
.preguntas details p.ejemplo-faq{margin:0 0 26px;padding:16px 22px;border-left:3px solid var(--naranja);background:rgba(232,89,12,.07);border-radius:0 12px 12px 0;color:var(--gris-claro);line-height:1.6}
.preguntas details p.ejemplo-faq b{display:block;margin-bottom:4px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--naranja-claro)}
.preguntas details p:not(.ejemplo-faq){padding-bottom:18px}
@media (max-width:1200px){.hojas .hoja.a{left:0}.hojas .hoja.b{right:0}}

/* ═══ Ronda 21: contornos 50/50 · brillo solo en planes y habilidades · fichas · centrado · menú ═══ */
:root{--degrade:linear-gradient(120deg,#E8590C 0%,#E8590C 32%,#3D6BFF 68%,#3D6BFF 100%);--degrade-suave:linear-gradient(120deg,rgba(232,89,12,.4) 0%,rgba(232,89,12,.4) 32%,rgba(61,107,255,.4) 68%,rgba(61,107,255,.4) 100%)}
.cuadro{background:linear-gradient(#0c0c0e,#0c0c0e) padding-box,var(--degrade) border-box}
.c-ava,.c-ext{background:linear-gradient(var(--grafito),var(--grafito)) padding-box,var(--degrade) border-box}
.habilidades.filtrado .habilidad.fuera[data-desde="extra"]{background:linear-gradient(var(--grafito),var(--grafito)) padding-box,var(--degrade-suave) border-box}
/* etiqueta "Adicional" de la ficha de Ken-Ai: mismo degradado que las demás */
.ficha-funciones li i.i-ext{border:1px solid transparent;border-style:solid;background:linear-gradient(var(--carbon),var(--carbon)) padding-box,var(--degrade) border-box}
/* sin brillo: solo borde */
.habilidades:not(.filtrado) .habilidad,.habilidades:not(.filtrado) .habilidad[data-desde="extra"],.seg-como li,.seg-aviso,.ac-dos div,.letra-pequena div,.tabla-envoltura,.comp-col:not(.ken),.crm-planes article,.pieza.actual,.vista-dashboard{box-shadow:none}
/* brillo en las fichas de los planes, según el color de cada plan */
.plan.p-esencial{box-shadow:0 0 0 1px rgba(47,191,113,.16),0 22px 60px -26px rgba(47,191,113,.6)}
.plan.p-comercial{box-shadow:0 0 0 1px rgba(61,107,255,.18),0 22px 60px -26px rgba(61,107,255,.65)}
.plan.p-avanzado{box-shadow:0 0 0 1px rgba(232,89,12,.18),0 22px 60px -26px rgba(232,89,12,.65)}
/* brillo en las habilidades cuando se elige un plan */
.habilidades.filtrado .habilidad.dentro[data-desde="esencial"]{box-shadow:0 0 0 1px rgba(47,191,113,.16),0 20px 56px -28px rgba(47,191,113,.6)}
.habilidades.filtrado .habilidad.dentro[data-desde="comercial"]{box-shadow:0 0 0 1px rgba(61,107,255,.18),0 20px 56px -28px rgba(61,107,255,.65)}
.habilidades.filtrado .habilidad.dentro[data-desde="avanzado"]{box-shadow:0 0 0 1px rgba(232,89,12,.18),0 20px 56px -28px rgba(232,89,12,.65)}
.habilidades.filtrado .habilidad.dentro[data-desde="extra"]{box-shadow:-14px 14px 52px -32px rgba(232,89,12,.65),14px 14px 52px -32px rgba(61,107,255,.7)}
/* videos verticales centrados en pantallas angostas */
@media (max-width:900px){.fundador .cuadro,.cuadro.vertical{margin-inline:auto;justify-self:center;width:100%}}
/* menú: Preguntas (FAQ en celular) */
.n-corto{display:none}
@media (max-width:520px){.n-largo{display:none}.n-corto{display:inline}.nav-enlaces{font-size:13.5px}}
/* Adicionales: contorno degradado 50/50 siempre (el borde de color anterior lo tapaba) */
.habilidades .habilidad[data-desde="extra"],.habilidades:not(.filtrado) .habilidad[data-desde="extra"],.habilidades.filtrado .habilidad.dentro[data-desde="extra"],.habilidades.filtrado .habilidad.fuera[data-desde="extra"]{border:1px solid transparent}
.habilidades .habilidad[data-desde="extra"],.habilidades:not(.filtrado) .habilidad[data-desde="extra"],.habilidades.filtrado .habilidad.dentro[data-desde="extra"]{background:linear-gradient(var(--grafito),var(--grafito)) padding-box,var(--degrade) border-box}
.habilidades.filtrado .habilidad.fuera[data-desde="extra"]{background:linear-gradient(var(--grafito),var(--grafito)) padding-box,var(--degrade-suave) border-box}
@media (max-width:520px){.nav-enlaces{font-size:13px;gap:10px;justify-content:flex-end}.nav .contenedor{gap:12px}}
@media (max-width:380px){.nav-enlaces{font-size:12px;gap:8px}.nav .contenedor{gap:8px}}

/* ═══ Ronda 22: formulario de contacto completo · foto de Santiago · brillo en todo el contorno · animaciones a 1.0 s ═══ */
.formulario select{appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--gris) 50%),linear-gradient(135deg,var(--gris) 50%,transparent 50%);background-position:calc(100% - 20px) 52%,calc(100% - 14px) 52%;background-size:6px 6px;background-repeat:no-repeat;padding-right:38px}
.formulario select:invalid{color:var(--gris)}
.formulario select option{color:#111}
.formulario input[hidden]{display:none}
.formulario input:disabled{opacity:.5}
.tel-fila{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px;align-items:stretch}
.cod-pais{position:relative}
.cod-btn{height:100%;display:inline-flex;align-items:center;gap:8px;font:inherit;font-size:16px;color:var(--tinta);background:var(--negro);border:1px solid var(--linea);border-radius:12px;padding:0 12px;cursor:pointer;white-space:nowrap}
.cod-btn .fl{font-size:20px;line-height:1}
.cod-btn i{width:6px;height:6px;border-right:1.5px solid var(--gris);border-bottom:1.5px solid var(--gris);transform:rotate(45deg) translateY(-2px);margin-left:2px}
.cod-btn:focus-visible{outline:2px solid var(--naranja-claro);outline-offset:1px}
.cod-panel{position:absolute;z-index:40;left:0;top:calc(100% + 6px);width:min(320px,calc(100vw - 48px));background:#0e0e10;border:1px solid var(--linea);border-radius:14px;box-shadow:0 24px 60px -20px #000;padding:8px}
.cod-panel input{width:100%;font:inherit;font-size:16px;color:var(--tinta);background:var(--negro);border:1px solid var(--linea);border-radius:10px;padding:9px 12px}
.cod-panel ul{list-style:none;margin:8px 0 0;padding:0;max-height:260px;overflow:auto}
.cod-panel li{display:grid;grid-template-columns:26px minmax(0,1fr) auto;align-items:center;gap:8px;padding:9px 10px;border-radius:9px;cursor:pointer;font-size:15px;color:var(--tinta)}
.cod-panel li[hidden]{display:none}
.cod-panel li:hover,.cod-panel li[aria-selected="true"]{background:rgba(255,255,255,.07)}
.cod-panel li .fl{font-size:19px}.cod-panel li .tl{color:var(--gris)}
/* foto de Santiago */
.foto-contacto{margin:34px 0 0;display:grid;justify-items:center;gap:16px;text-align:center}
.foto-circulo{position:relative;width:min(100%,300px);aspect-ratio:1/1;border-radius:50%;overflow:hidden;border:1px solid transparent;background:linear-gradient(#0c0c0e,#0c0c0e) padding-box,var(--degrade) border-box;box-shadow:-10px 0 40px -12px rgba(232,89,12,.5),10px 0 40px -12px rgba(61,107,255,.55)}
.foto-circulo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.foto-pend{position:absolute;inset:0;display:grid;place-items:center;color:var(--gris);font-size:13px;z-index:0}
.foto-circulo img{z-index:1}
.foto-contacto figcaption{display:grid;gap:3px}
.foto-contacto figcaption b{font-size:18px;font-weight:600;color:var(--tinta)}
.foto-contacto figcaption span{font-size:14px;color:var(--gris);max-width:30ch;margin-inline:auto}
@media (max-width:900px){.foto-circulo{width:min(100%,220px)}.foto-contacto{margin-top:26px}}

/* Brillo en todo el contorno (sin desplazarlo hacia arriba o abajo) */
.plan.p-esencial{box-shadow:0 0 0 1px rgba(47,191,113,.18),0 0 48px -8px rgba(47,191,113,.5)}
.plan.p-comercial{box-shadow:0 0 0 1px rgba(61,107,255,.2),0 0 48px -8px rgba(61,107,255,.55)}
.plan.p-avanzado{box-shadow:0 0 0 1px rgba(232,89,12,.2),0 0 48px -8px rgba(232,89,12,.55)}
.habilidades.filtrado .habilidad.dentro[data-desde="esencial"]{box-shadow:0 0 0 1px rgba(47,191,113,.18),0 0 36px -8px rgba(47,191,113,.5)}
.habilidades.filtrado .habilidad.dentro[data-desde="comercial"]{box-shadow:0 0 0 1px rgba(61,107,255,.2),0 0 36px -8px rgba(61,107,255,.55)}
.habilidades.filtrado .habilidad.dentro[data-desde="avanzado"]{box-shadow:0 0 0 1px rgba(232,89,12,.2),0 0 36px -8px rgba(232,89,12,.55)}
.habilidades.filtrado .habilidad.dentro[data-desde="extra"]{box-shadow:-10px 0 36px -10px rgba(232,89,12,.55),10px 0 36px -10px rgba(61,107,255,.6)}
.cuadro{box-shadow:-10px 0 40px -12px rgba(232,89,12,.45),10px 0 40px -12px rgba(61,107,255,.5)}
/* animaciones a 1.0 s */
.rv{transition:opacity 1s cubic-bezier(.16,1,.3,1),transform 1s cubic-bezier(.16,1,.3,1),filter 1s cubic-bezier(.22,1,.36,1);transition-delay:calc(var(--rv-i,0) * 80ms)}
.anima-txt .pal-i{transition:transform 1s cubic-bezier(.16,1,.3,1),opacity 1s cubic-bezier(.16,1,.3,1),filter 1s cubic-bezier(.22,1,.36,1);transition-delay:calc(var(--p,0) * 36ms)}