/* Kynvara Technologies — estilos del sitio (tokens del sistema de diseño v1.0) */
@font-face{font-family:"Inter";src:url(../fonts/inter-400.woff) format("woff");font-weight:400;font-display:swap}
@font-face{font-family:"Inter";src:url(../fonts/inter-500.woff) format("woff");font-weight:500;font-display:swap}
@font-face{font-family:"Inter";src:url(../fonts/inter-600.woff) format("woff");font-weight:600;font-display:swap}
@font-face{font-family:"Inter Display";src:url(../fonts/interdisplay-600.woff) format("woff");font-weight:600;font-display:swap}
@font-face{font-family:"Inter Display";src:url(../fonts/interdisplay-700.woff) format("woff");font-weight:700;font-display:swap}

:root{
  /* Color */
  --k-indigo-700:#2232B0; --k-indigo-600:#2F3FD6; --k-indigo-100:#E6E9FC; --k-indigo-50:#F2F4FE;
  --k-menta-600:#0E9F73; --k-menta-500:#12B886; --k-menta-100:#DDF6EC;
  --k-tinta:#0B1220; --k-pizarra-700:#334155; --k-pizarra-500:#64748B; --k-pizarra-300:#CBD5E1;
  --k-linea:#E2E8F0; --k-fondo:#F6F7FB; --k-blanco:#FFFFFF;
  --k-ambar:#F59E0B; --k-rojo:#E5484D;
  /* Tipografía */
  --k-font-titulo:"Inter Display","Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --k-font-texto:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  /* Espaciado (base 4) */
  --k-1:4px;--k-2:8px;--k-3:12px;--k-4:16px;--k-5:24px;--k-6:32px;--k-7:48px;--k-8:64px;--k-9:96px;
  /* Radios y sombras */
  --k-radio-s:8px;--k-radio-m:12px;--k-radio-l:20px;
  --k-sombra:0 1px 2px rgba(11,18,32,.06),0 8px 24px rgba(11,18,32,.06);
  --k-ancho:1160px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--k-font-texto);font-size:17px;line-height:1.6;color:var(--k-pizarra-700);background:var(--k-blanco);-webkit-font-smoothing:antialiased}
img,svg{max-width:100%;display:block}
a{color:var(--k-indigo-600);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3{font-family:var(--k-font-titulo);color:var(--k-tinta);line-height:1.15;margin:0 0 var(--k-4);letter-spacing:-.02em}
h1{font-size:clamp(2.2rem,4.6vw,3.6rem);font-weight:700}
h2{font-size:clamp(1.7rem,3vw,2.4rem);font-weight:700}
h3{font-size:1.2rem;font-weight:600;letter-spacing:-.01em}
p{margin:0 0 var(--k-4)}
.contenedor{width:min(100% - 40px,var(--k-ancho));margin-inline:auto}
.etiqueta{display:inline-flex;align-items:center;gap:8px;font-size:.8rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--k-indigo-600)}
.etiqueta::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--k-menta-500)}
.saltar{position:absolute;left:-999px;top:8px;background:var(--k-tinta);color:#fff;padding:8px 12px;border-radius:8px;z-index:100}
.saltar:focus{left:8px}

/* Botones */
.boton{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:600 1rem/1 var(--k-font-texto);padding:14px 22px;border-radius:var(--k-radio-m);border:1.5px solid transparent;cursor:pointer;transition:background .15s,border-color .15s,transform .15s}
.boton:hover{text-decoration:none;transform:translateY(-1px)}
.boton:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--k-menta-500);outline-offset:2px}
.boton-primario{background:var(--k-indigo-600);color:#fff}
.boton-primario:hover{background:var(--k-indigo-700)}
.boton-secundario{background:transparent;color:var(--k-tinta);border-color:var(--k-pizarra-300)}
.boton-secundario:hover{border-color:var(--k-tinta)}
.boton-whatsapp{background:var(--k-menta-500);color:#05261b}
.boton-whatsapp:hover{background:var(--k-menta-600);color:#fff}

/* Encabezado */
.encabezado{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--k-linea)}
.encabezado .contenedor{display:flex;align-items:center;justify-content:space-between;height:72px;gap:var(--k-5)}
.marca img{height:40px;width:auto}
.nav{display:flex;align-items:center;gap:var(--k-5)}
.nav a{color:var(--k-pizarra-700);font-weight:500;font-size:.95rem}
.nav a:hover{color:var(--k-tinta)}
.nav .boton{color:#fff;padding:11px 18px}
.menu-boton{display:none;background:none;border:1.5px solid var(--k-linea);border-radius:10px;padding:8px 10px;cursor:pointer}
@media (max-width:880px){
  .menu-boton{display:block}
  .nav{position:absolute;top:72px;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;background:#fff;border-bottom:1px solid var(--k-linea);display:none;padding:var(--k-3) 20px var(--k-5)}
  .nav.abierto{display:flex}
  .nav a{padding:12px 0;border-bottom:1px solid var(--k-linea)}
  .nav .boton{margin-top:var(--k-4);border-bottom:0}
}

/* Hero */
.hero{padding:var(--k-9) 0 var(--k-8);background:radial-gradient(900px 400px at 85% -10%,var(--k-indigo-50),transparent 70%)}
.hero .contenedor{display:grid;grid-template-columns:1.1fr .9fr;gap:var(--k-8);align-items:center}
.hero p.bajada{font-size:1.2rem;max-width:560px}
.hero .acciones{display:flex;flex-wrap:wrap;gap:var(--k-3);margin-top:var(--k-5)}
.hero .nota{font-size:.9rem;color:var(--k-pizarra-500);margin-top:var(--k-4)}
@media (max-width:960px){.hero .contenedor{grid-template-columns:1fr;gap:var(--k-7)}.hero{padding-top:var(--k-8)}}

/* Tarjeta del proceso (hero) */
.proceso{background:#fff;border:1px solid var(--k-linea);border-radius:var(--k-radio-l);box-shadow:var(--k-sombra);padding:var(--k-5)}
.proceso h2{font-size:1rem;margin-bottom:var(--k-4);font-family:var(--k-font-texto);font-weight:600;letter-spacing:0}
.paso{display:grid;grid-template-columns:36px 1fr auto;gap:var(--k-3);align-items:center;padding:12px 0;border-top:1px solid var(--k-linea)}
.paso:first-of-type{border-top:0}
.paso .num{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;font-weight:600;background:var(--k-indigo-50);color:var(--k-indigo-600)}
.paso strong{display:block;color:var(--k-tinta);font-weight:600}
.paso span{font-size:.88rem;color:var(--k-pizarra-500)}
.estado{font-size:.75rem;font-weight:600;padding:4px 10px;border-radius:999px;white-space:nowrap}
.estado.ok{background:var(--k-menta-100);color:#06664a}
.estado.curso{background:var(--k-indigo-100);color:var(--k-indigo-700)}
.estado.pend{background:var(--k-fondo);color:var(--k-pizarra-500)}

/* Secciones */
.seccion{padding:var(--k-9) 0}
.seccion.gris{background:var(--k-fondo)}
.seccion .intro{max-width:720px;margin-bottom:var(--k-7)}
.seccion .intro p{font-size:1.1rem}
.grilla{display:grid;gap:var(--k-5)}
.g3{grid-template-columns:repeat(3,1fr)}
.g2{grid-template-columns:repeat(2,1fr)}
@media (max-width:960px){.g3{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.g3,.g2{grid-template-columns:1fr}.seccion{padding:var(--k-8) 0}}
.tarjeta{background:#fff;border:1px solid var(--k-linea);border-radius:var(--k-radio-l);padding:var(--k-6)}
.tarjeta p{margin:0;font-size:.98rem}
.icono{width:44px;height:44px;border-radius:12px;background:var(--k-indigo-50);display:grid;place-items:center;margin-bottom:var(--k-4)}
.icono svg{width:22px;height:22px;stroke:var(--k-indigo-600);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.tarjeta.destacada{border-color:var(--k-indigo-600);box-shadow:0 0 0 3px var(--k-indigo-100)}

/* Puertas */
.puertas{display:grid;grid-template-columns:repeat(5,1fr);gap:var(--k-3);counter-reset:p}
.puerta{background:#fff;border:1px solid var(--k-linea);border-radius:var(--k-radio-m);padding:var(--k-5);position:relative}
.puerta small{display:block;font-weight:600;font-size:.75rem;letter-spacing:.06em;text-transform:uppercase;color:var(--k-menta-600);margin-bottom:6px}
.puerta h3{margin-bottom:6px}
.puerta p{font-size:.92rem;margin:0}
.puerta.abono{background:var(--k-tinta);border-color:var(--k-tinta)}
.puerta.abono h3{color:#fff}.puerta.abono p{color:#C7CEDB}.puerta.abono small{color:var(--k-menta-500)}
@media (max-width:960px){.puertas{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.puertas{grid-template-columns:1fr}}

/* Lista de diferenciales */
.lista-check{list-style:none;padding:0;margin:0;display:grid;gap:var(--k-4)}
.lista-check li{display:grid;grid-template-columns:28px 1fr;gap:var(--k-3)}
.lista-check li::before{content:"";width:22px;height:22px;margin-top:3px;border-radius:50%;background:var(--k-menta-100) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230E9F73' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L20 7'/%3E%3C/svg%3E") center/14px no-repeat}
.lista-check strong{color:var(--k-tinta)}

/* Rubros */
.rubro{display:flex;flex-direction:column;gap:6px}
.rubro .pill{align-self:flex-start;font-size:.72rem;font-weight:600;padding:3px 10px;border-radius:999px;background:var(--k-menta-100);color:#06664a;margin-bottom:6px}

/* Producto */
.producto{display:grid;grid-template-columns:1fr 1fr;gap:var(--k-7);align-items:center;background:var(--k-tinta);color:#C7CEDB;border-radius:28px;padding:var(--k-8)}
.producto h2{color:#fff}
.producto .etiqueta{color:var(--k-menta-500)}
.producto ul{margin:0;padding-left:1.1em}
.producto li{margin-bottom:8px}
.producto .maqueta{background:#121b2e;border:1px solid #24304a;border-radius:var(--k-radio-l);padding:var(--k-5);font-size:.9rem}
.maqueta .fila{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-top:1px solid #24304a}
.maqueta .fila:first-child{border-top:0}
.maqueta b{color:#fff;font-weight:600}
@media (max-width:900px){.producto{grid-template-columns:1fr;padding:var(--k-6)}}

/* Contacto */
.contacto{display:grid;grid-template-columns:.9fr 1.1fr;gap:var(--k-7)}
@media (max-width:900px){.contacto{grid-template-columns:1fr}}
form .campos{display:grid;grid-template-columns:1fr 1fr;gap:var(--k-4)}
form .ancho{grid-column:1/-1}
@media (max-width:560px){form .campos{grid-template-columns:1fr}}
label{display:block;font-size:.9rem;font-weight:600;color:var(--k-tinta);margin-bottom:6px}
input,select,textarea{width:100%;font:inherit;font-size:1rem;color:var(--k-tinta);background:#fff;border:1.5px solid var(--k-pizarra-300);border-radius:var(--k-radio-s);padding:12px 14px}
textarea{min-height:130px;resize:vertical}
input:focus,select:focus,textarea:focus{border-color:var(--k-indigo-600)}
.trampa{position:absolute;left:-9999px}
.aviso{margin-top:var(--k-4);padding:12px 16px;border-radius:var(--k-radio-s);display:none}
.aviso.ok{display:block;background:var(--k-menta-100);color:#06664a}
.aviso.error{display:block;background:#FDECEC;color:#9B1C1F}
.legal{font-size:.85rem;color:var(--k-pizarra-500);margin-top:var(--k-3)}

/* Pie */
.pie{background:var(--k-tinta);color:#9AA6BC;padding:var(--k-8) 0 var(--k-6);font-size:.92rem}
.pie .contenedor{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:var(--k-6)}
.pie img{height:38px;width:auto;margin-bottom:var(--k-4)}
.pie h3{color:#fff;font-size:.95rem;font-family:var(--k-font-texto)}
.pie a{color:#C7CEDB}
.pie ul{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.pie .base{grid-column:1/-1;border-top:1px solid #24304a;padding-top:var(--k-5);margin-top:var(--k-5);display:flex;justify-content:space-between;flex-wrap:wrap;gap:var(--k-3)}
@media (max-width:760px){.pie .contenedor{grid-template-columns:1fr}}

/* Página legal */
.legal-pagina{padding:var(--k-8) 0}
.legal-pagina .contenedor{max-width:760px}
.legal-pagina h2{font-size:1.3rem;margin-top:var(--k-6)}

/* WhatsApp flotante */
.wa-flotante{position:fixed;right:20px;bottom:20px;width:56px;height:56px;border-radius:50%;background:var(--k-menta-500);display:grid;place-items:center;box-shadow:0 8px 24px rgba(11,18,32,.25);z-index:60}
.wa-flotante svg{width:28px;height:28px;fill:#05261b}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* Motor Kynvara en acción */
.motor-sec{background:var(--k-tinta);color:#C7CEDB}
.motor-sec h2,.motor-sec h3{color:#fff}
.motor-sec .etiqueta{color:var(--k-menta-500)}
.motor-sec .intro p{color:#C7CEDB}
.motor{display:grid;grid-template-columns:.8fr 1.6fr .9fr;gap:var(--k-5);align-items:stretch}
.motor-col{background:#121b2e;border:1px solid #24304a;border-radius:var(--k-radio-l);padding:var(--k-5);position:relative}
.motor-col h3{font-size:1rem;font-family:var(--k-font-texto);margin-bottom:var(--k-4)}
.motor-entrada ul{list-style:none;padding:0;margin:0;display:grid;gap:10px;font-size:.95rem}
.motor-entrada li{padding:10px 12px;border:1px solid #24304a;border-radius:10px}
.motor-flecha{position:absolute;right:-22px;top:50%;width:20px;height:2px;background:#3A4866}
.motor-flecha::after{content:"";position:absolute;right:-1px;top:-4px;border:5px solid transparent;border-left-color:#3A4866}
.motor-hub{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:14px;background:rgba(47,63,214,.18);border:1px solid rgba(124,139,255,.45);margin-bottom:var(--k-4)}
.motor-hub strong{display:block;color:#fff}
.motor-estado{font-size:.88rem;color:#A3AEFF}
.motor-hub-punto{width:14px;height:14px;border-radius:50%;background:#7C8BFF;box-shadow:0 0 0 0 rgba(124,139,255,.6);animation:k-latido 1.6s ease-out infinite;flex:none}
@keyframes k-latido{0%{box-shadow:0 0 0 0 rgba(124,139,255,.6)}70%{box-shadow:0 0 0 12px rgba(124,139,255,0)}100%{box-shadow:0 0 0 0 rgba(124,139,255,0)}}
.motor-agentes{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.agente{display:flex;align-items:center;gap:10px;padding:11px 12px;border-radius:10px;border:1px solid #24304a;font-size:.92rem;color:#8A96AB;transition:color .35s,border-color .35s,background .35s}
.ag-luz{width:9px;height:9px;border-radius:50%;background:#3A4866;flex:none;transition:background .35s,box-shadow .35s}
.agente.activo{color:#fff;border-color:rgba(124,139,255,.7);background:rgba(47,63,214,.16)}
.agente.activo .ag-luz{background:#7C8BFF;box-shadow:0 0 0 4px rgba(124,139,255,.25)}
.agente.hecho{color:#C7CEDB}
.agente.hecho .ag-luz{background:var(--k-menta-500)}
.motor-pista{position:relative;height:4px;border-radius:4px;background:#24304a;margin:var(--k-5) 0 var(--k-3);overflow:hidden}
.motor-pulso{position:absolute;left:0;top:0;height:100%;width:0;background:linear-gradient(90deg,#7C8BFF,var(--k-menta-500));border-radius:4px;transition:width .8s ease}
.motor-log{min-height:1.5em;margin:0;font-size:.88rem;color:#A3AEFF}
.motor-puertas ol{list-style:none;padding:0;margin:0 0 var(--k-4);display:grid;gap:10px}
.motor-puertas li,.motor-salida{display:flex;align-items:center;gap:10px;padding:11px 12px;border-radius:10px;border:1px solid #24304a;font-size:.95rem;transition:all .35s}
.pt-marca{width:20px;height:20px;border-radius:50%;border:2px solid #3A4866;flex:none;display:grid;place-items:center;transition:all .35s}
.motor-puertas li.espera{border-color:rgba(245,158,11,.6);color:#fff}
.motor-puertas li.espera .pt-marca{border-color:var(--k-ambar);animation:k-latido-a 1.2s ease-out infinite}
@keyframes k-latido-a{0%{box-shadow:0 0 0 0 rgba(245,158,11,.5)}70%{box-shadow:0 0 0 8px rgba(245,158,11,0)}100%{box-shadow:0 0 0 0 rgba(245,158,11,0)}}
.motor-puertas li.ok,.motor-salida.ok{color:#fff;border-color:rgba(18,184,134,.55)}
.motor-puertas li.ok .pt-marca,.motor-salida.ok .pt-marca{background:var(--k-menta-500);border-color:var(--k-menta-500)}
.motor-puertas li.ok .pt-marca::after,.motor-salida.ok .pt-marca::after{content:"";width:8px;height:5px;border-left:2px solid #05261b;border-bottom:2px solid #05261b;transform:rotate(-45deg) translate(1px,-1px)}
.motor-salida{background:rgba(18,184,134,.06)}
@media (max-width:960px){.motor{grid-template-columns:1fr}.motor-flecha{right:50%;top:auto;bottom:-22px;width:2px;height:20px}.motor-flecha::after{right:-4px;top:auto;bottom:-1px;border-left-color:transparent;border-top-color:#3A4866}}
@media (max-width:480px){.motor-agentes{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.motor-hub-punto,.motor-puertas li.espera .pt-marca{animation:none}}