/* Estilos de illarynet.com — diseño "Cielo de Cusco" (versión andina). */
/* Opción 1 · Cielo de Cusco (versión andina): la ciudad sigue siendo el héroe y el cielo celeste el fondo,
   pero ahora la página se teje con los tintes naturales del Cusco (cochinilla, q'olle, ch'illca, añil, nogal),
   la franja de 7 colores de la bandera, la chakana, el mayu (río en zigzag) y la ch'aska (estrella). */
:root{--marino:#13295B;--azul:#2E5E99;--celeste:#4C9BD6;--cielo:#EAF3FC;--fondo:#FFFFFF;--tinta:#0F1B33;--gris:#4A5874;--borde:#DCE5F0;--wa:#25D366;--wa-t:#0B3B1E;
--cochinilla:#A3173A;--qolle:#E8A317;--qolle-claro:#FBE7B0;--chillca:#2F6E35;--nogal:#4A2F22;
--d:Lexend,Figtree,system-ui,sans-serif;--t:Figtree,system-ui,-apple-system,"Segoe UI",sans-serif}
*{box-sizing:border-box}[hidden]{display:none!important}
html{scroll-behavior:smooth}
body{margin:0;background:var(--fondo);color:var(--tinta);font-family:var(--t);font-size:17px;line-height:1.55}
h1,h2,h3{font-family:var(--d);margin:0;color:var(--marino);text-wrap:balance}
img{max-width:100%}a{color:var(--azul)}
.wrap{max-width:1180px;margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
:focus-visible{outline:3px solid var(--celeste);outline-offset:2px}
section{scroll-margin-top:84px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-weight:700;text-decoration:none;border:0;border-radius:999px;padding:14px 26px;min-height:48px;font-size:17px;cursor:pointer;font-family:var(--t)}
.btn-marino,.btn-plan,.btn-enviar{background:var(--marino);color:#fff}.btn-marino:hover,.btn-plan:hover,.btn-enviar:hover{background:#0b1c44;color:#fff}
.btn-wa{background:var(--wa);color:var(--wa-t)}
.btn-blanco{background:#fff;color:var(--marino)}
.eyebrow{font-size:14px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;color:var(--azul)}
.h2{font-size:clamp(30px,4vw,42px)}
.sub{margin:0;color:var(--gris);font-size:18px;max-width:38em}
.cab{display:flex;flex-direction:column;gap:10px;margin-bottom:36px}
/* cabecera */
header{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--borde)}
header .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:10px}
header img{height:44px;display:block}
nav{display:flex;gap:26px}nav a{color:var(--marino);font-weight:600;text-decoration:none}
header .btn{padding:11px 20px;font-size:16px;min-height:44px}
/* hero */
.hero{position:relative;min-height:600px;display:flex;align-items:flex-end;color:#fff;overflow:hidden}
.hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,27,51,.15) 0%,rgba(15,27,51,.25) 45%,rgba(15,27,51,.78) 100%)}
.hero .wrap{position:relative;z-index:1;width:100%;padding-block:120px 64px;display:flex;flex-direction:column;gap:20px}
.hero h1{color:#fff;font-size:clamp(40px,6vw,68px);line-height:1.04;max-width:13ch}
.hero p{margin:0;font-size:20px;max-width:32em;color:#E7EEF8}
.hero .acc{display:flex;flex-wrap:wrap;gap:12px}
.chip{align-self:flex-start;background:rgba(255,255,255,.16);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.35);padding:6px 14px;border-radius:999px;font-weight:600;font-size:15px}
.chip::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:#3FE08A;margin-right:8px;vertical-align:middle}
/* tira de precios sobre el borde del hero */
.tira{position:relative;z-index:2;margin-top:-40px}
.tira .wrap{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.tira a{background:#fff;border-radius:18px;padding:18px 20px;box-shadow:0 14px 40px rgba(19,41,91,.14);text-decoration:none;color:var(--tinta);display:flex;justify-content:space-between;align-items:center;gap:10px}
.tira b{font-family:var(--d);color:var(--marino);font-size:17px}
.tira span{color:var(--gris);font-size:14px;display:block}
.tira strong{font-family:var(--d);font-size:28px;color:var(--marino);white-space:nowrap}
.tira strong small{font-size:14px;color:var(--gris);font-weight:500}
/* beneficios */
.bloque{padding-block:88px}
#beneficios{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:28px}
.beneficio{display:flex;flex-direction:column;gap:8px}
.beneficio-ico{width:52px;height:52px;border-radius:16px;background:var(--cielo);color:var(--azul);display:grid;place-items:center}
.beneficio h3{font-size:19px}.beneficio p{margin:0;color:var(--gris)}
/* armador */
.armar{background:var(--cielo)}
#armador{display:flex;flex-wrap:wrap;gap:28px;align-items:stretch}
.arm-pasos{flex:1 1 520px;min-width:0;display:flex;flex-direction:column;gap:26px;background:#fff;border-radius:24px;padding:28px}
fieldset{border:0;margin:0;padding:0}
legend{font-family:var(--d);font-weight:600;font-size:19px;color:var(--marino);padding:0;margin-bottom:14px}
.arm-vel{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}
.arm-tv{display:flex;flex-wrap:wrap;gap:10px}
.op{font-family:var(--t);cursor:pointer;border:2px solid var(--borde);background:#fff;color:var(--tinta)}
.op-vel{text-align:left;border-radius:16px;padding:16px;display:flex;flex-direction:column;gap:4px}
.op-vel b{font-family:var(--d);font-size:26px;color:var(--marino)}.op-vel em{font-style:normal;font-size:15px}
.op-vel span{color:var(--gris);font-size:15px}
.op-tv{border-radius:999px;padding:10px 22px;font-weight:700;color:var(--marino);min-height:44px}
.op[aria-pressed="true"]{border-color:var(--azul);background:#E3EFFB}
.op-tv[aria-pressed="true"]{background:var(--marino);border-color:var(--marino);color:#fff}
.arm-res{flex:1 1 340px;min-width:0;background:var(--marino);color:#fff;border-radius:24px;padding:28px;display:flex;flex-direction:column;gap:14px;justify-content:center}
.arm-eti{font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:#BFD8F0;font-weight:700}
.arm-res h3{color:#fff;font-size:26px}
.plan-precio{display:flex;align-items:baseline;gap:5px;font-variant-numeric:tabular-nums}
.plan-precio .s{font-weight:600;font-size:19px}.plan-precio .n{font-family:var(--d);font-weight:700;font-size:56px;line-height:1}.plan-precio .m{color:#BFD8F0}
.arm-primer{align-self:flex-start;background:var(--celeste);color:var(--tinta);font-weight:700;padding:5px 12px;border-radius:8px;font-size:15px}
.arm-aviso{margin:0;background:rgba(255,255,255,.1);padding:10px 12px;border-radius:10px;font-size:15px}
/* planes */
#planes-lista{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px}
.plan{border:1.5px solid var(--borde);border-radius:22px;padding:26px;display:flex;flex-direction:column;gap:12px;background:#fff}
.plan-dest{border-color:var(--azul);box-shadow:0 18px 40px rgba(46,94,153,.16)}
.plan-top{display:flex;justify-content:space-between;align-items:center;min-height:28px}
.plan-mb{font-family:var(--d);color:var(--azul);font-weight:600}
.badge{background:var(--marino);color:#fff;font-size:13px;font-weight:700;padding:4px 10px;border-radius:999px}
.plan-nombre{font-size:20px}
.plan .plan-precio{color:var(--marino)}.plan .plan-precio .n{font-size:46px}.plan .plan-precio .m{color:var(--gris)}
.plan-primer{margin:0;color:var(--azul);font-weight:600;font-size:15px}
.plan-lista{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;color:var(--gris);font-size:15px}
.plan-lista li{display:flex;gap:8px;align-items:flex-start}.plan-lista .ico{color:#1E9E57;flex:none;margin-top:2px}
.plan .btn{margin-top:auto}
/* cobertura */
.cobertura .wrap{display:flex;flex-wrap:wrap;gap:28px;align-items:center;justify-content:space-between;background:linear-gradient(120deg,var(--marino),var(--azul));border-radius:28px;padding-block:48px;color:#fff}
.cobertura h2{color:#fff;font-size:clamp(26px,3.2vw,34px)}
.cobertura p{margin:8px 0 0;color:#DCE9F6;max-width:34em}
/* faq */
.faq-wrap{display:flex;flex-wrap:wrap;gap:40px}
.faq-wrap .cab{flex:1 1 280px}
#faq-lista{flex:2 1 520px;min-width:0;display:flex;flex-direction:column}
.faq{border-bottom:1px solid var(--borde)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:16px;align-items:center;padding-block:20px;font-weight:700;font-size:18px;color:var(--marino);min-height:44px}
.faq summary::-webkit-details-marker{display:none}
.faq summary .ico{flex:none;color:var(--azul);transition:transform .2s}.faq[open] summary .ico{transform:rotate(180deg)}
.faq p{margin:0 0 20px;color:var(--gris)}
/* contacto */
.contacto{background:var(--cielo)}
.contacto .wrap{display:flex;flex-wrap:wrap;gap:40px;align-items:flex-start}
.contacto .txt{flex:1 1 320px;display:flex;flex-direction:column;gap:14px}
.tel{font-family:var(--d);font-size:30px;font-weight:700;color:var(--marino);user-select:all}
#contacto-form{flex:1 1 480px;min-width:0;background:#fff;border-radius:24px;padding:28px;box-shadow:0 18px 40px rgba(19,41,91,.08)}
.form{display:flex;flex-direction:column;gap:16px}
.fila{display:flex;flex-wrap:wrap;gap:16px}
.campo{flex:1 1 200px;min-width:0;display:flex;flex-direction:column;gap:6px}
label{font-weight:600;color:var(--marino)}
input,select,textarea{font:inherit;border:1.5px solid #C9D6E6;border-radius:12px;padding:12px 14px;min-height:46px;width:100%;color:var(--tinta);background:#fff}
.ok{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;padding-block:30px}.ok .ico{color:#1E9E57}.ok p{margin:0;color:var(--gris)}
.btn-link{background:none;border:0;color:var(--azul);font-weight:700;text-decoration:underline;cursor:pointer;min-height:44px;font:inherit}
footer .wrap{display:flex;flex-wrap:wrap;gap:12px 28px;align-items:center;justify-content:space-between;padding-block:32px;color:var(--gris)}
footer img{height:36px}
/* botones flotantes: verde = contratar (ventas), rojo = soporte técnico (clientes) */
.flotantes{position:fixed;right:calc(16px + env(safe-area-inset-right,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:40;display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.flotante,.flotante-soporte{position:relative;display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:8px 18px 8px 10px;border-radius:999px;font-weight:700;text-decoration:none;line-height:1.15;box-shadow:0 10px 24px rgba(15,27,51,.22)}
.flotante{background:var(--wa);color:var(--wa-t)}.flotante:hover{background:#1FC05C;color:var(--wa-t)}
.flotante-ico{flex:none;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.35)}
.flotante-txt{display:flex;flex-direction:column;font-size:16px}
.flotante-txt small{font-size:12px;font-weight:600;opacity:.85}
/* ===== Capa andina ===== */
.bandera{height:7px;background:linear-gradient(90deg,#D52B1E 0 14.28%,#F18A00 0 28.57%,#FFD100 0 42.85%,#2E9B3E 0 57.14%,#4FB3E8 0 71.42%,#1F4E9C 0 85.71%,#6B3FA0 0)}
.chaska{display:inline-block;flex:none;width:14px;height:14px;background:currentColor;clip-path:polygon(50% 0,61% 32%,85% 15%,68% 39%,100% 50%,68% 61%,85% 85%,61% 68%,50% 100%,39% 68%,15% 85%,32% 61%,0 50%,32% 39%,15% 15%,39% 32%)}
.eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--cochinilla)}
.eyebrow .chaska{color:var(--qolle)}
/* tejido luraypu: franjas simétricas con rombos de q'olle */
.tejido{height:46px;background:
  linear-gradient(135deg,transparent 37%,var(--qolle) 37% 50%,transparent 50%) 0 50%/24px 24px repeat-x,
  linear-gradient(45deg,transparent 37%,var(--qolle) 37% 50%,transparent 50%) 0 50%/24px 24px repeat-x,
  linear-gradient(180deg,var(--marino) 0 6px,var(--cochinilla) 6px 10px,var(--chillca) 10px 13px,var(--cochinilla) 13px 33px,var(--chillca) 33px 36px,var(--cochinilla) 36px 40px,var(--marino) 40px)}
/* mayu: río en zigzag */
.mayu{height:12px;background:linear-gradient(135deg,var(--fm,#fff) 33%,transparent 33%) 0 0/18px 12px,linear-gradient(225deg,var(--fm,#fff) 33%,transparent 33%) 0 0/18px 12px,var(--cm,var(--celeste))}
/* hero: saludo en quechua y chakana sobre el cielo */
.chip{background:rgba(251,231,176,.95);color:var(--nogal);border-color:transparent;backdrop-filter:none}
.chip b{font-style:italic;color:var(--cochinilla)}
.chip::before{background:var(--chillca)}
.hero h1 em{font-style:normal;color:var(--qolle)}
/* chakana: cruz escalonada de 12 puntas con el círculo central hueco */
.chakana-hero{position:absolute;z-index:1;right:max(12px,5vw);top:70px;width:190px;height:190px;overflow:visible;filter:drop-shadow(0 8px 22px rgba(15,27,51,.4))}
.ch-base{fill:#fff;fill-opacity:.95}
.ch-trazo{fill:none;stroke:var(--qolle);stroke-width:.38;stroke-linejoin:miter}
.ch-anillo{fill:none;stroke:var(--qolle);stroke-width:.38}
.ch-onda{fill:none;stroke:#fff;stroke-width:.22;opacity:0;transform-origin:7px 7px}
.ch-cuerpo,.ch-inti{transform-origin:7px 7px}
.ch-tocapu{transform-box:fill-box;transform-origin:center}
.hero::after{background:linear-gradient(180deg,rgba(15,27,51,.1) 0%,rgba(15,27,51,.25) 45%,rgba(19,41,91,.82) 100%)}
/* tarjetas de precio con borde tejido */
.tira a{border-bottom:6px solid var(--c,var(--azul));position:relative}
.tira a:nth-child(1){--c:var(--chillca)}.tira a:nth-child(2){--c:var(--marino)}.tira a:nth-child(3){--c:var(--cochinilla)}
/* beneficios con los colores de los tintes */
.beneficio:nth-child(1){--c:var(--cochinilla);--f:#F8E3E8}.beneficio:nth-child(2){--c:#9A6A00;--f:var(--qolle-claro)}.beneficio:nth-child(3){--c:var(--chillca);--f:#E1EEDF}.beneficio:nth-child(4){--c:var(--azul);--f:var(--cielo)}.beneficio:nth-child(5){--c:var(--nogal);--f:#EFE6DF}
.beneficio-ico{background:var(--f);color:var(--c);border-radius:0;clip-path:polygon(35.71% 0,64.29% 0,64.29% 21.43%,78.57% 21.43%,78.57% 35.71%,100% 35.71%,100% 64.29%,78.57% 64.29%,78.57% 78.57%,64.29% 78.57%,64.29% 100%,35.71% 100%,35.71% 78.57%,21.43% 78.57%,21.43% 64.29%,0 64.29%,0 35.71%,21.43% 35.71%,21.43% 21.43%,35.71% 21.43%);width:64px;height:64px}
.ayni-def{margin:6px 0 0;padding:12px 16px;border-left:5px solid var(--qolle);background:#FFFBEF;color:var(--nogal);max-width:40em}
.ayni-def i{color:var(--cochinilla);font-weight:700}
/* armador y planes */
.op[aria-pressed="true"]{box-shadow:inset 0 -5px 0 var(--qolle)}
.arm-res{position:relative;overflow:hidden}
.arm-res::before{content:"";position:absolute;inset:0 0 auto 0;height:12px;background:linear-gradient(135deg,var(--marino) 33%,transparent 33%) 0 0/18px 12px,linear-gradient(225deg,var(--marino) 33%,transparent 33%) 0 0/18px 12px,var(--qolle)}
.arm-primer{background:var(--qolle)}
.plan{overflow:hidden;padding-top:0}
.plan::before{content:"";display:block;height:12px;margin:0 -26px 10px;background:linear-gradient(90deg,var(--c) 0 20%,var(--qolle) 0 25%,var(--c) 0 75%,var(--qolle) 0 80%,var(--c) 0)}
.plan:nth-child(1){--c:var(--chillca)}.plan:nth-child(2){--c:var(--azul)}.plan:nth-child(3){--c:var(--cochinilla)}.plan:nth-child(4){--c:var(--nogal)}
.plan-dest{border-color:var(--cochinilla);box-shadow:0 18px 40px rgba(163,23,58,.14)}
.badge{display:inline-flex;align-items:center;gap:6px;background:var(--cochinilla)}
.badge::before{content:"";width:11px;height:11px;background:var(--qolle);clip-path:polygon(50% 0,61% 32%,85% 15%,68% 39%,100% 50%,68% 61%,85% 85%,61% 68%,50% 100%,39% 68%,15% 85%,32% 61%,0 50%,32% 39%,15% 15%,39% 32%)}
.plan-primer{color:var(--cochinilla)}
/* cobertura con borde de tocapus */
.cobertura .wrap{background:linear-gradient(120deg,var(--marino),var(--azul));position:relative;overflow:hidden;border-radius:6px}
.cobertura .wrap::after{content:"";position:absolute;inset:auto 0 0 0;height:14px;background:conic-gradient(from 90deg at 25% 25%,var(--cochinilla) 25%,var(--qolle) 0 50%,var(--chillca) 0 75%,var(--celeste) 0) 0 0/28px 28px}
/* formulario */
#contacto-form{border-top:8px solid var(--qolle)}
.ok h3::before{content:"Sulpayki · ";font-style:italic;color:var(--cochinilla)}
/* pie: los colores de los tintes */
footer{background:var(--marino);color:#D9E6F5}
footer img{filter:brightness(0) invert(1)}
footer .wrap{color:#D9E6F5}
footer .tintes{display:flex;flex-wrap:wrap;gap:10px 22px;align-items:center;justify-content:flex-start;padding-block:26px 0}
.tintes p{margin:0;flex:1 1 100%;max-width:52em}
.tinte{display:inline-flex;align-items:center;gap:8px;font-size:15px}
.tinte i{width:18px;height:18px;border:2px solid #fff;background:var(--c)}
/* ===== Soporte técnico (clientes) ===== */
.hdr-acc{display:flex;gap:10px;align-items:center}
.btn-soporte{background:#fff;color:var(--cochinilla);border:2px solid var(--cochinilla)}
.btn-soporte:hover{background:var(--cochinilla);color:#fff}
.btn-cochinilla{background:var(--cochinilla);color:#fff}.btn-cochinilla:hover{background:#7E0F2B;color:#fff}
.cliente-wrap{margin-top:28px}
.cliente{display:flex;flex-wrap:wrap;align-items:center;gap:16px 20px;background:#FFF6F7;border:2px solid #F1C9D2;border-radius:18px;padding:18px 22px}
.cliente-ico{width:52px;height:52px;display:grid;place-items:center;background:var(--cochinilla);color:#fff;clip-path:polygon(35.71% 0,64.29% 0,64.29% 21.43%,78.57% 21.43%,78.57% 35.71%,100% 35.71%,100% 64.29%,78.57% 64.29%,78.57% 78.57%,64.29% 78.57%,64.29% 100%,35.71% 100%,35.71% 78.57%,21.43% 78.57%,21.43% 64.29%,0 64.29%,0 35.71%,21.43% 35.71%,21.43% 21.43%,35.71% 21.43%)}
.cliente-txt{flex:1 1 260px;display:flex;flex-direction:column}
.cliente-txt b{font-family:var(--d);color:var(--marino);font-size:19px}
.cliente-txt span{color:var(--gris)}.cliente-txt strong{color:var(--cochinilla);white-space:nowrap}
.flotante-soporte{background:var(--cochinilla);color:#fff}
.flotante-soporte:hover{background:#7E0F2B;color:#fff}
/* contadores */
.contadores{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px;margin-block:4px 40px}
.contadores div{background:var(--marino);color:#fff;border-radius:14px;padding:18px 20px;display:flex;flex-direction:column;position:relative;overflow:hidden}
.contadores div::after{content:"";position:absolute;inset:auto 0 0 0;height:6px;background:linear-gradient(90deg,var(--cochinilla) 0 25%,var(--qolle) 0 50%,var(--chillca) 0 75%,var(--celeste) 0)}
.contadores b{font-family:var(--d);font-size:34px;color:var(--qolle);font-variant-numeric:tabular-nums;line-height:1.1}
.contadores small{color:#D9E6F5;font-size:15px}
/* lectura del texto sobre la foto */
.hero::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(15,27,51,.62) 0%,rgba(15,27,51,.35) 45%,rgba(15,27,51,0) 75%);pointer-events:none}
.hero .wrap{z-index:2}.chakana-hero{z-index:2}
.hero h1,.hero p{text-shadow:0 2px 16px rgba(10,20,40,.45)}

/* ===== Animación ===== */
@media (prefers-reduced-motion:no-preference){
  /* foto: movimiento lento continuo (Ken Burns) + paralaje al hacer scroll (script) */
  .hero>img{transform-origin:60% 40%;animation:kenburns 26s ease-in-out infinite alternate;will-change:transform}
  @keyframes kenburns{from{transform:scale(1.06) translate3d(0,var(--par,0px),0)}to{transform:scale(1.18) translate3d(-2%,calc(var(--par,0px) - 1%),0)}}
  /* chakana: aparece girando y luego flota; su anillo central late */
  /* chakana: entra girando, flota y se balancea; emite ondas de señal; el Inti late; los tocapus se encienden; la línea dorada se teje */
  .chakana-hero{animation:chakana-entra 1.4s cubic-bezier(.2,.9,.3,1.2) both,flotar 6s ease-in-out 1.4s infinite}
  .ch-cuerpo{animation:balanceo 8s ease-in-out 1.4s infinite}
  .ch-onda{animation:onda 3.6s cubic-bezier(.2,.6,.3,1) infinite}
  .ch-o2{animation-delay:1.2s}.ch-o3{animation-delay:2.4s}
  .ch-trazo{stroke-dasharray:100;animation:tejer-trazo 5s ease-in-out infinite,tintes 12s linear infinite}
  .ch-inti{animation:inti 3s ease-in-out infinite}
  .ch-anillo{animation:latido 3s ease-in-out infinite;transform-origin:7px 7px}
  .ch-tocapu{animation:tocapu 4s ease-in-out infinite}
  .ch-t2{animation-delay:1s}.ch-t3{animation-delay:2s}.ch-t4{animation-delay:3s}
  @keyframes balanceo{0%,100%{transform:rotate(-5deg)}50%{transform:rotate(5deg)}}
  @keyframes onda{0%{transform:scale(1);opacity:.85;stroke-width:.35}100%{transform:scale(1.65);opacity:0;stroke-width:.08}}
  @keyframes tejer-trazo{0%{stroke-dashoffset:100}55%,80%{stroke-dashoffset:0}100%{stroke-dashoffset:-100}}
  @keyframes tintes{0%,100%{stroke:#E8A317}25%{stroke:#A3173A}50%{stroke:#2F6E35}75%{stroke:#2E5E99}}
  @keyframes inti{0%,100%{transform:scale(.85);opacity:.75}50%{transform:scale(1.25);opacity:1}}
  @keyframes tocapu{0%,100%{transform:scale(1);opacity:1}12%{transform:scale(1.6);opacity:1}24%{transform:scale(1);opacity:.55}}
  @keyframes chakana-entra{from{opacity:0;transform:rotate(-90deg) scale(.4)}to{opacity:1;transform:none}}
  @keyframes flotar{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
  @keyframes latido{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.25);opacity:.55}}
  /* entrada escalonada del texto de portada y de las tarjetas de precio */
  .hero .wrap>*{animation:subir .9s cubic-bezier(.2,.8,.2,1) both}
  .hero .wrap>*:nth-child(1){animation-delay:.15s}.hero .wrap>*:nth-child(2){animation-delay:.3s}.hero .wrap>*:nth-child(3){animation-delay:.45s}.hero .wrap>*:nth-child(4){animation-delay:.6s}
  .tira a{animation:subir .8s cubic-bezier(.2,.8,.2,1) both}
  .tira a:nth-child(1){animation-delay:.75s}.tira a:nth-child(2){animation-delay:.88s}.tira a:nth-child(3){animation-delay:1s}
  @keyframes subir{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
  .hero h1 em{background:linear-gradient(90deg,var(--qolle),#FFD86B,var(--qolle));background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none;filter:drop-shadow(0 2px 10px rgba(10,20,40,.5));animation:brillo 4s linear infinite}
  @keyframes brillo{to{background-position:-200% 0}}
  /* tejidos y río en movimiento */
  .tejido{animation:tejer 18s linear infinite}
  @keyframes tejer{to{background-position:240px 50%,240px 50%,0 0}}
  .mayu{animation:fluir 6s linear infinite}
  @keyframes fluir{to{background-position:180px 0,180px 0,0 0}}
  .bandera{background-size:200% 100%;animation:ondear 14s linear infinite;background-image:linear-gradient(90deg,#D52B1E 0 7.14%,#F18A00 0 14.28%,#FFD100 0 21.42%,#2E9B3E 0 28.57%,#4FB3E8 0 35.71%,#1F4E9C 0 42.85%,#6B3FA0 0 50%,#D52B1E 0 57.14%,#F18A00 0 64.28%,#FFD100 0 71.42%,#2E9B3E 0 78.57%,#4FB3E8 0 85.71%,#1F4E9C 0 92.85%,#6B3FA0 0)}
  @keyframes ondear{to{background-position:-200% 0}}
  /* aparición al bajar (solo si el script está activo; sin script todo se ve) */
  .js-anim .anim{opacity:0;transform:translateY(34px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.8,.2,1)}
  .js-anim .anim.visible{opacity:1;transform:none}
  /* tarjetas que reaccionan */
  .beneficio,.plan,.tira a,.contadores div{transition:transform .25s ease,box-shadow .25s ease}
  .beneficio:hover,.plan:hover,.tira a:hover{transform:translateY(-6px);box-shadow:0 22px 44px rgba(19,41,91,.16)}
  .beneficio:hover .beneficio-ico{animation:girar 1s ease}
  @keyframes girar{to{transform:rotate(90deg)}}
  .badge::before{animation:titilar 1.8s ease-in-out infinite}
  @keyframes titilar{0%,100%{transform:scale(1) rotate(0)}50%{transform:scale(1.35) rotate(45deg)}}
  /* botones con destello */
  .btn{position:relative;overflow:hidden;transition:transform .2s ease,background .2s ease}
  .btn:hover{transform:translateY(-2px)}
  .btn::after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent);transform:skewX(-20deg);transition:left .6s ease}
  .btn:hover::after{left:130%}
  /* resultado del armador al cambiar */
  .arm-res.cambio .n,.arm-res.cambio h3{animation:pop .45s cubic-bezier(.2,.9,.3,1.4)}
  @keyframes pop{from{opacity:.2;transform:translateY(10px) scale(.92)}to{opacity:1;transform:none}}
  /* WhatsApp con pulso */
  .flotante::before{content:"";position:absolute;inset:0;border-radius:999px;background:var(--wa);animation:pulso-wa 2.4s ease-out infinite;z-index:-1}
  @keyframes pulso-wa{from{transform:scale(1);opacity:.55}to{transform:scale(1.18,1.45);opacity:0}}
  /* cabecera que se compacta al bajar */
  header,header img{transition:padding .3s ease,height .3s ease,box-shadow .3s ease}
  header.compacta{box-shadow:0 8px 24px rgba(19,41,91,.1)}
  header.compacta img{height:36px}
}
@media (max-width:980px){.btn-soporte{display:none}}
@media (max-width:820px){nav{display:none}.hero{min-height:620px}.chakana-hero{width:96px;height:96px;top:6px;right:6px}.hero .wrap{padding-top:110px}}
@media (max-width:420px){.flotante-txt small{display:none}.flotante,.flotante-soporte{min-height:48px;padding-right:14px}}

/* ===== Formulario real ===== */
.form-error{margin:0;padding:12px 14px;border-radius:10px;background:#FDECEF;border:1.5px solid #F1C9D2;color:#7E0F2B;font-weight:600}
.btn-enviar[disabled]{opacity:.7;cursor:wait}

/* ===== Empresas: internet dedicado con IP fija ===== */
.empresas{background:var(--marino);color:#fff;position:relative;overflow:hidden}
.empresas::before{content:"";position:absolute;inset:0 0 auto 0;height:14px;background:conic-gradient(from 90deg at 25% 25%,var(--cochinilla) 25%,var(--qolle) 0 50%,var(--chillca) 0 75%,var(--celeste) 0) 0 0/28px 28px}
.emp{display:flex;flex-wrap:wrap;gap:40px;align-items:center}
.emp-txt{flex:1 1 520px;min-width:0;display:flex;flex-direction:column;gap:16px}
.empresas .h2{color:#fff}
.empresas .sub{color:#D9E6F5}
.empresas .eyebrow{color:var(--qolle)}
.empresas .eyebrow .chaska{color:#fff}
.emp-lista{list-style:none;margin:6px 0;padding:0;display:flex;flex-direction:column;gap:14px}
.emp-lista li{display:flex;gap:14px;align-items:flex-start}
.emp-lista b{display:block;font-family:var(--d);font-size:18px}
.emp-lista span{color:#D9E6F5}
.emp-ico{flex:none;width:34px;height:34px;border-radius:50%;background:var(--qolle);color:var(--marino);display:grid;place-items:center}
.btn-qolle{background:var(--qolle);color:var(--tinta)}.btn-qolle:hover{background:#FFC233;color:var(--tinta)}
.emp-card{flex:1 1 320px;min-width:0;position:relative;overflow:hidden;background:linear-gradient(150deg,var(--azul),var(--marino));border:2px solid rgba(255,255,255,.18);border-radius:24px;padding:32px;display:flex;flex-direction:column;gap:6px;min-height:260px;justify-content:flex-end}
.emp-card svg{position:absolute;right:-30px;top:-30px;width:190px;height:190px;fill:rgba(255,255,255,.08)}
.emp-eti{font-size:13px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;color:var(--qolle)}
.emp-card b{font-family:var(--d);font-size:56px;line-height:1}
.emp-precio{color:#D9E6F5}
@media (prefers-reduced-motion:no-preference){.emp-card svg{animation:girar-lento 40s linear infinite}@keyframes girar-lento{to{transform:rotate(360deg)}}}

/* ===== Enlace "Empresas" del menú, animado y en su mismo lugar ===== */
nav a.nav-empresas{position:relative;display:inline-flex;align-items:center;gap:6px;padding:6px 14px;margin:-6px 0;border-radius:999px;background:var(--marino);color:#fff;overflow:hidden}
nav a.nav-empresas .chaska{width:11px;height:11px;color:var(--qolle)}
nav a.nav-empresas:hover{background:var(--cochinilla);color:#fff}
.btn-borde-claro{background:transparent;color:#fff;border:2px solid rgba(255,255,255,.55)}.btn-borde-claro:hover{border-color:#fff;color:#fff}
@media (prefers-reduced-motion:no-preference){
  nav a.nav-empresas{animation:empresas-latido 3.2s ease-in-out infinite}
  nav a.nav-empresas::after{content:"";position:absolute;top:0;left:-70%;width:45%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-20deg);animation:empresas-brillo 3.2s ease-in-out infinite}
  nav a.nav-empresas .chaska{animation:titilar 1.6s ease-in-out infinite}
  @keyframes empresas-latido{0%,100%{box-shadow:0 0 0 0 rgba(232,163,23,.0)}50%{box-shadow:0 0 0 5px rgba(232,163,23,.35)}}
  @keyframes empresas-brillo{0%,40%{left:-70%}70%,100%{left:130%}}
}

/* ===== Página /empresas/ ===== */
.pe-hero{min-height:640px;align-items:center}
.pe-hero::after{background:linear-gradient(180deg,rgba(15,27,51,.35) 0%,rgba(19,41,91,.7) 60%,rgba(19,41,91,.92) 100%)}
.pe-hero-in{flex-direction:row!important;flex-wrap:wrap;align-items:center;gap:36px!important}
.pe-hero-txt{flex:1 1 480px;min-width:0;display:flex;flex-direction:column;gap:20px}
.pe-hero-txt h1{color:#fff;font-size:clamp(38px,5.4vw,62px);line-height:1.05;max-width:15ch}
.pe-panel{flex:1 1 320px;min-width:0;max-width:420px;background:rgba(255,255,255,.1);backdrop-filter:blur(10px);border:1.5px solid rgba(255,255,255,.28);border-radius:22px;padding:24px;display:flex;flex-direction:column;gap:12px}
.pe-panel-eti{font-size:13px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;color:var(--qolle)}
.pe-fila{display:flex;justify-content:space-between;gap:12px;padding-block:10px;border-bottom:1px dashed rgba(255,255,255,.25);color:#D9E6F5}
.pe-fila b{font-family:var(--d);color:#fff}
.pe-senal{display:flex;align-items:flex-end;gap:6px;height:44px;margin-top:6px}
.pe-senal i{flex:1;border-radius:4px 4px 0 0;background:linear-gradient(180deg,var(--qolle),var(--cochinilla))}
.pe-senal i:nth-child(1){height:30%}.pe-senal i:nth-child(2){height:50%}.pe-senal i:nth-child(3){height:70%}.pe-senal i:nth-child(4){height:85%}.pe-senal i:nth-child(5){height:100%}
.pe-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px}
.pe-card{background:#fff;border:1.5px solid var(--borde);border-radius:20px;padding:24px;display:flex;flex-direction:column;gap:10px;border-top:6px solid var(--c,var(--azul))}
.pe-card:nth-child(1){--c:var(--cochinilla)}.pe-card:nth-child(2){--c:var(--qolle)}.pe-card:nth-child(3){--c:var(--chillca)}.pe-card:nth-child(4){--c:var(--azul)}
.pe-card h3{font-size:20px}.pe-card p{margin:0;color:var(--gris)}
.pe-ico{width:56px;height:56px;display:grid;place-items:center;background:var(--cielo);color:var(--c);clip-path:polygon(35.71% 0,64.29% 0,64.29% 21.43%,78.57% 21.43%,78.57% 35.71%,100% 35.71%,100% 64.29%,78.57% 64.29%,78.57% 78.57%,64.29% 78.57%,64.29% 100%,35.71% 100%,35.71% 78.57%,21.43% 78.57%,21.43% 64.29%,0 64.29%,0 35.71%,21.43% 35.71%,21.43% 21.43%,35.71% 21.43%)}
.pe-card:nth-child(2) .pe-ico{color:#9A6A00}
.pe-usos{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px}
.pe-uso{background:#fff;border-radius:16px;padding:18px 20px;display:flex;flex-direction:column;gap:4px;border-left:6px solid var(--qolle)}
.pe-uso b{font-family:var(--d);color:var(--marino);font-size:18px}.pe-uso span{color:var(--gris)}
.pe-sectores{display:flex;flex-wrap:wrap;gap:12px}
.pe-sector{display:inline-flex;align-items:center;gap:10px;padding:12px 18px;border-radius:999px;background:var(--cielo);color:var(--marino);font-weight:700;border:1.5px solid var(--borde)}
.pe-sector::before{content:"";width:12px;height:12px;background:var(--cochinilla);clip-path:polygon(35.71% 0,64.29% 0,64.29% 21.43%,78.57% 21.43%,78.57% 35.71%,100% 35.71%,100% 64.29%,78.57% 64.29%,78.57% 78.57%,64.29% 78.57%,64.29% 100%,35.71% 100%,35.71% 78.57%,21.43% 78.57%,21.43% 64.29%,0 64.29%,0 35.71%,21.43% 35.71%,21.43% 21.43%,35.71% 21.43%)}
.pe-pasos-sec{background:var(--marino);color:#fff}
.pe-pasos-sec .h2{color:#fff}.pe-pasos-sec .eyebrow{color:var(--qolle)}.pe-pasos-sec .eyebrow .chaska{color:#fff}
.pe-pasos{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;counter-reset:none}
.pe-paso{background:rgba(255,255,255,.07);border:1.5px solid rgba(255,255,255,.18);border-radius:20px;padding:24px;display:flex;flex-direction:column;gap:8px}
.pe-paso b{font-family:var(--d);font-size:20px}.pe-paso span{color:#D9E6F5}
.pe-num{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--qolle);color:var(--marino);font-family:var(--d);font-weight:700;font-size:20px}
.pe-acc{margin-top:28px}
@media (prefers-reduced-motion:no-preference){
  .pe-senal i{transform-origin:bottom;animation:barras 1.8s ease-in-out infinite}
  .pe-senal i:nth-child(2){animation-delay:.15s}.pe-senal i:nth-child(3){animation-delay:.3s}.pe-senal i:nth-child(4){animation-delay:.45s}.pe-senal i:nth-child(5){animation-delay:.6s}
  @keyframes barras{0%,100%{transform:scaleY(.55)}50%{transform:scaleY(1)}}
  .pe-card,.pe-uso,.pe-sector,.pe-paso{transition:transform .25s ease,box-shadow .25s ease}
  .pe-card:hover,.pe-uso:hover,.pe-paso:hover{transform:translateY(-6px);box-shadow:0 22px 44px rgba(19,41,91,.16)}
  .pe-sector:hover{transform:translateY(-3px) rotate(-1deg)}
  .pe-card:hover .pe-ico{animation:girar 1s ease}
  .pe-num{animation:latido 3s ease-in-out infinite}
}