/* NOVA para equipos · página pública. Sencilla, como fidelya.cl y nova-spaceapps: una idea por pantalla, cabina oscura,
   superficies planas con borde fino y una sola luz, la de NOVA (turquesa). Movimientos suaves y cortos, nunca mareos. */
@font-face{font-family:SG;src:url(fonts/space-grotesk-300-latin.woff2);font-weight:300;font-display:swap}
@font-face{font-family:SG;src:url(fonts/space-grotesk-400-latin.woff2);font-weight:400;font-display:swap}
@font-face{font-family:SG;src:url(fonts/space-grotesk-500-latin.woff2);font-weight:500;font-display:swap}
@font-face{font-family:SG;src:url(fonts/space-grotesk-600-latin.woff2);font-weight:600;font-display:swap}
@font-face{font-family:PM;src:url(fonts/ibm-plex-mono-400-latin.woff2);font-weight:400;font-display:swap}
@font-face{font-family:PM;src:url(fonts/ibm-plex-mono-500-latin.woff2);font-weight:500;font-display:swap}
:root{--bg:#04070b;--s1:#080d13;--s2:#0c131b;--l1:rgba(150,185,215,.1);--l2:rgba(150,185,215,.2);
  --ink:#e8eef5;--ink2:#a9b5c3;--ink3:#6a7787;--c:#46c8e8;--c2:#8fe6f5;--lila:#a898ff;--ok:#6fd6b0;
  --ease:cubic-bezier(.22,1,.36,1)}
*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-tap-highlight-color:transparent;overflow-x:clip;scroll-behavior:smooth;background:var(--bg)}
body{overflow-x:clip;background:var(--bg);color:var(--ink);font-family:SG,system-ui,sans-serif;-webkit-font-smoothing:antialiased;line-height:1.5}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
.wrap{width:min(1180px,100% - 32px);margin:0 auto}
.g{background:linear-gradient(95deg,#c4f4fb 0%,#8fe6f5 35%,#46c8e8 75%,#a898ff 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.rot{display:inline-block;font:500 12.5px PM;letter-spacing:.18em;color:var(--c2);text-transform:uppercase;margin-bottom:16px}
:focus-visible{outline:2px solid var(--c2);outline-offset:3px;border-radius:8px}
h1{font-weight:500;font-size:clamp(44px,5.6vw,84px);line-height:.98;letter-spacing:-.05em;margin:22px 0 22px}
h2{font-weight:500;font-size:clamp(34px,4.2vw,58px);line-height:1.03;letter-spacing:-.045em}
h3{font-weight:500;font-size:clamp(20px,1.8vw,24px);line-height:1.2;letter-spacing:-.025em;margin-bottom:8px}
.sub{font-size:clamp(16.5px,1.3vw,19px);color:var(--ink2);max-width:560px;line-height:1.55}
.sec{padding:clamp(80px,10vw,130px) 0 0}
.cab{margin-bottom:clamp(32px,4vw,52px)}
.cab-c{text-align:center}
.k{display:block;font:500 12px PM;letter-spacing:.14em;text-transform:uppercase;color:var(--c2);margin-bottom:10px}

/* nav */
#nav{position:fixed;top:0;left:0;right:0;z-index:50;padding:14px 0;transition:background .4s var(--ease),border-color .4s var(--ease);border-bottom:1px solid transparent}
#nav.solido{background:rgba(4,7,11,.82);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom-color:var(--l1)}
#nav .wrap{display:flex;align-items:center;gap:28px}
.marca{display:flex;align-items:center;gap:8px;font:600 18px SG;letter-spacing:.14em}
.marca svg{width:34px;height:34px;overflow:visible}
.links{display:flex;gap:26px;margin-left:auto;font-size:14.5px;color:var(--ink2)}
.links a:hover{color:var(--ink)}
.nav-cta{display:inline-flex;align-items:center;height:38px;padding:0 16px;border-radius:999px;background:var(--c2);color:#032029;font-weight:600;font-size:14px}

/* botones */
.ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.btn{display:inline-flex;align-items:center;gap:10px;height:52px;padding:0 22px;border-radius:999px;font-weight:600;font-size:15.5px;transition:transform .3s var(--ease),background .3s var(--ease),box-shadow .3s var(--ease)}
.btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.btn-g svg{fill:currentColor;stroke:none}
.btn-p{background:var(--c2);color:#032029;box-shadow:0 10px 36px -10px rgba(70,200,232,.6)}
.btn-p:hover{transform:translateY(-2px);box-shadow:0 14px 46px -10px rgba(70,200,232,.8)}
.btn-g{border:1px solid var(--l2);color:var(--ink)}
.btn-g:hover{background:rgba(255,255,255,.05)}

/* teléfono con la app real */
.tel{position:relative;aspect-ratio:560/1218;border-radius:38px;padding:7px;background:linear-gradient(150deg,#1d252f,#0b1118 30%,#0b1118 75%,#1a222b);border:1px solid var(--l2);box-shadow:0 40px 90px -30px rgba(0,0,0,.9)}
.tel video{display:block;width:100%;height:100%;object-fit:cover;border-radius:31px;background:#05080c}

/* 1 · héroe */
.heroe{position:relative;min-height:100svh;display:flex;align-items:center;padding:110px 0 60px;overflow:hidden;isolation:isolate}
.h-fondo{position:absolute;inset:0;z-index:-1}
.h-fondo canvas{position:absolute;inset:0;width:100%;height:100%}
.h-fondo::after{content:"";position:absolute;inset:0;background:radial-gradient(42% 55% at 74% 50%,rgba(15,74,92,.55),transparent 70%),radial-gradient(30% 40% at 90% 82%,rgba(66,48,130,.28),transparent 70%),linear-gradient(180deg,transparent 78%,var(--bg))}
.h-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;width:min(1180px,100% - 32px)}
.badge{display:inline-flex;align-items:center;gap:10px;padding:8px 14px 8px 11px;border:1px solid var(--l2);border-radius:999px;background:rgba(8,13,19,.6);font:500 12.5px PM;color:var(--ink2)}
.badge i{width:8px;height:8px;border-radius:50%;background:var(--c);box-shadow:0 0 10px var(--c)}
.sellos{list-style:none;display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:26px;font-size:14px;color:var(--ink2)}
.sellos li{display:flex;align-items:center;gap:7px}
.sellos li::before{content:"";width:16px;height:16px;border-radius:50%;background:rgba(111,214,176,.15) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236fd6b0' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/10px no-repeat}
.h-vis{position:relative;height:min(640px,78vh);display:flex;justify-content:center;align-items:center}
.tel-h{height:100%;width:auto}
#hNova{position:absolute;left:2%;top:4%;width:30%;aspect-ratio:1;overflow:visible;z-index:3}
.flot{position:absolute;z-index:4;display:flex;align-items:center;gap:11px;padding:11px 15px 11px 11px;border-radius:16px;background:rgba(10,16,23,.88);border:1px solid var(--l2);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 20px 40px -20px rgba(0,0,0,.8);animation:flota 6s ease-in-out infinite}
.flot b{display:block;font-size:14px;font-weight:600}.flot small{display:block;font-size:12.5px;color:var(--ink2)}
.fi{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:color-mix(in srgb,var(--c) 16%,transparent)}
.fi svg{width:17px;height:17px;fill:none;stroke:var(--c);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.f1{right:-2%;top:16%}.f2{left:-4%;top:56%;animation-delay:-2s}.f3{right:2%;bottom:10%;animation-delay:-4s}
@keyframes flota{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}

/* 2 · la frase */
.frase p{font-size:clamp(24px,3vw,40px);line-height:1.25;letter-spacing:-.03em;color:var(--ink3);max-width:940px;font-weight:400}
.frase .g2{color:var(--ink);margin-top:14px;font-weight:500}

/* 3 · tres pasos (y privacidad) */
.pasos3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.p3{padding:28px 26px 30px;border-radius:24px;background:var(--s1);border:1px solid var(--l1)}
.p3 .n{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:rgba(143,230,245,.1);color:var(--c2);font:600 17px SG;margin-bottom:20px}
.p3 .n.ico svg{width:20px;height:20px;fill:none;stroke:var(--c2);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.p3 p{color:var(--ink2);font-size:15.5px}

/* 4 · capítulos: el texto a la izquierda, el teléfono queda fijo a la derecha */
.caps{display:grid;grid-template-columns:1fr 360px;gap:clamp(40px,7vw,110px)}
.cap{min-height:62vh;display:flex;flex-direction:column;justify-content:center;opacity:.28;transition:opacity .5s var(--ease)}
.cap.activo{opacity:1}
.cap:first-child{min-height:48vh;justify-content:flex-start;padding-top:6vh}
.cap:last-child{min-height:70vh}
.cap h3{font-size:clamp(28px,3vw,42px);letter-spacing:-.04em;line-height:1.06;max-width:540px;margin-bottom:12px}
.cap p{color:var(--ink2);font-size:18px;max-width:500px}
.cap .solo-m{display:none}
.c-tel{position:sticky;top:calc(50vh - 350px);height:700px;display:flex;align-items:center;gap:20px}
.c-tel .tel{width:320px}
.tel-g::before{content:"";position:absolute;inset:-60px;z-index:-1;background:radial-gradient(closest-side,rgba(70,200,232,.22),transparent);pointer-events:none}
.tel-g video{transition:opacity .25s}
.tel-g video.cambia{opacity:0}
.c-prog{display:flex;flex-direction:column;gap:9px}
.c-prog i{width:4px;height:20px;border-radius:4px;background:var(--l2);transition:background .3s,height .35s var(--ease)}
.c-prog i.on{background:var(--c2);height:38px}

/* 5 · video */
.vmarco{position:relative;aspect-ratio:16/9;border-radius:24px;overflow:hidden;border:1px solid var(--l2);background:#04070b;box-shadow:0 40px 120px -40px rgba(70,200,232,.3)}
.vmarco video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#04070b}
.v-play{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;background:radial-gradient(closest-side,rgba(4,7,11,.2),rgba(4,7,11,.6));transition:opacity .4s}
.v-play span{width:84px;height:84px;border-radius:50%;display:grid;place-items:center;background:var(--c2);box-shadow:0 0 0 12px rgba(143,230,245,.12),0 20px 60px -10px rgba(70,200,232,.7);transition:transform .3s var(--ease)}
.v-play:hover span{transform:scale(1.06)}
.v-play svg{width:32px;height:32px;fill:#032029;margin-left:4px}
.v-play b{font:500 12.5px PM;letter-spacing:.14em;text-transform:uppercase}
.vmarco.corre .v-play{opacity:0;pointer-events:none}
.v-ctl{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;gap:12px;padding:14px 16px;background:linear-gradient(transparent,rgba(4,7,11,.85));opacity:0;transition:opacity .3s}
.vmarco.corre .v-ctl{opacity:1}.vmarco.corre.quieto .v-ctl{opacity:0}
.v-ctl button{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;flex:none}
.v-ctl button:hover{background:rgba(255,255,255,.08)}
.v-ctl svg{width:20px;height:20px;fill:none;stroke:var(--ink);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
#vPausa .p2{display:none;fill:var(--ink)}#vPausa.pausado .p1{display:none}#vPausa.pausado .p2{display:block}
#vSon .off{display:none}#vSon.mudo .on{display:none}#vSon.mudo .off{display:block}
.v-prog{flex:1;height:4px;border-radius:4px;background:rgba(255,255,255,.15);cursor:pointer;position:relative}
.v-prog::before{content:"";position:absolute;inset:-10px 0}
.v-prog i{display:block;height:100%;width:0;border-radius:4px;background:var(--c2)}
#vT{font:500 12px PM;color:var(--ink2);min-width:38px}


/* 8 · preguntas */
.faq-w{max-width:820px}
.faq details{border-bottom:1px solid var(--l1)}
.faq details:first-child{border-top:1px solid var(--l1)}
.faq summary{list-style:none;cursor:pointer;padding:22px 40px 22px 0;font-size:19px;font-weight:500;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:6px;top:50%;width:11px;height:11px;border-right:2px solid var(--c2);border-bottom:2px solid var(--c2);transform:translateY(-70%) rotate(45deg);transition:transform .3s var(--ease)}
.faq details[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
.faq p{color:var(--ink2);padding:0 0 22px;max-width:680px;font-size:16.5px}

/* 9 · cierre */
.cierre{padding-bottom:clamp(80px,10vw,120px)}
.c-caja{display:grid;grid-template-columns:1.2fr .8fr;align-items:center;gap:30px;padding:clamp(32px,5vw,64px);border-radius:32px;background:radial-gradient(70% 90% at 80% 50%,rgba(15,74,92,.45),transparent 70%),var(--s1);border:1px solid var(--l2)}
.c-caja h2{margin-bottom:14px}
#finNova{width:100%;max-width:320px;aspect-ratio:1;overflow:visible;justify-self:center}

/* pie */
.pie{border-top:1px solid var(--l1);padding:30px 0 40px}
.pie .wrap{display:flex;gap:30px;align-items:center}
.pie .eco{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;font-size:13.5px;font-weight:600}.pie .eco span{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink3)}.pie .eco a{text-decoration:none;color:var(--ink2)}.pie .eco a:hover{color:var(--ink)}
.pie p{font-size:13px;color:var(--ink3);max-width:720px;margin-left:auto}
.pie a{color:var(--ink2);text-decoration:underline;text-underline-offset:3px}

/* NOVA flotante + chat (como en nova-spaceapps) */
.fab{position:fixed;right:28px;bottom:26px;z-index:60;width:110px;height:110px;opacity:0;transform:scale(.5) translateY(20px);pointer-events:none;transition:opacity .45s var(--ease),transform .55s var(--ease)}
.fab.on{opacity:1;transform:none;pointer-events:auto}
.fab svg{width:100%;height:100%;overflow:visible;pointer-events:none}
.globo{position:absolute;right:calc(100% - 6px);top:42%;transform:translateY(-50%) translateX(8px);white-space:nowrap;padding:10px 15px;border-radius:16px 16px 4px 16px;background:#0f151d;border:1px solid rgba(143,230,245,.35);font:600 14px SG;color:var(--ink);opacity:0;transition:opacity .4s,transform .4s var(--ease);pointer-events:none}
.globo.on{opacity:1;transform:translateY(-50%)}
.velo{position:fixed;inset:0;z-index:70;background:rgba(2,4,7,.5);opacity:0;pointer-events:none;transition:opacity .35s}
.velo.on{opacity:1;pointer-events:auto}
.chat{position:fixed;right:24px;bottom:24px;z-index:80;width:390px;max-height:min(620px,calc(100svh - 48px));display:flex;flex-direction:column;border-radius:24px;background:#080d13;border:1px solid var(--l2);box-shadow:0 30px 90px -20px rgba(0,0,0,.8),0 0 60px -30px rgba(70,200,232,.5);opacity:0;transform:translateY(20px) scale(.97);transform-origin:bottom right;pointer-events:none;transition:opacity .35s var(--ease),transform .45s var(--ease)}
.chat.on{opacity:1;transform:none;pointer-events:auto}
.c-cab{display:flex;align-items:center;gap:12px;padding:15px 18px;border-bottom:1px solid var(--l1)}
.c-cab svg{width:40px;height:40px;overflow:visible}
.c-cab b{display:block;font-size:16px}.c-cab small{color:var(--ok);font:500 12px PM}
.c-cab button{margin-left:auto;width:34px;height:34px;border-radius:50%;color:var(--ink2);font-size:15px}
.c-cab button:hover{background:rgba(255,255,255,.06)}
.c-msgs{flex:1;overflow-y:auto;padding:18px;display:flex;flex-direction:column;gap:10px;min-height:180px}
.m{max-width:86%;padding:11px 14px;border-radius:16px;font-size:15px;line-height:1.45;animation:entraM .4s var(--ease) both}
.m.n{background:var(--s2);border:1px solid var(--l1);border-bottom-left-radius:5px}
.m.u{align-self:flex-end;background:var(--c2);color:#032029;border-bottom-right-radius:5px;font-weight:500}
.m a{color:var(--c2);text-decoration:underline}
.m.esc{display:flex;gap:5px;padding:14px}
.m.esc i{width:6px;height:6px;border-radius:50%;background:var(--ink3);animation:pt 1s infinite}
.m.esc i:nth-child(2){animation-delay:.15s}.m.esc i:nth-child(3){animation-delay:.3s}
@keyframes pt{50%{transform:translateY(-4px);background:var(--c2)}}
@keyframes entraM{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.c-chips{display:flex;flex-wrap:wrap;gap:8px;padding:12px 16px 16px;border-top:1px solid var(--l1)}
.c-chips button{padding:8px 13px;border-radius:999px;border:1px solid rgba(143,230,245,.3);font-size:13.5px;color:var(--c2)}
.c-chips button:hover{background:rgba(143,230,245,.08)}

/* aparición suave al llegar (corta, sin desplazamientos grandes) */
.js .rv{opacity:0;transform:translateY(16px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.js .rv.visto{opacity:1;transform:none}

@media (max-width:1000px){
  .links{display:none}.nav-cta{margin-left:auto}
  .sec{padding-top:72px}
  .heroe{min-height:auto;padding:100px 0 40px}
  .h-grid{grid-template-columns:1fr;gap:34px}
  .h-vis{height:min(132vw,560px)}
  #hNova{left:auto;right:0;top:0;width:28%}
  .f1{right:0;top:14%}.f2{left:0;top:54%}.f3{right:2%;bottom:6%}
  .frase p{font-size:24px}
  .pasos3{grid-template-columns:1fr;gap:12px}
  .p3{padding:22px 20px 24px;display:grid;grid-template-columns:40px 1fr;column-gap:16px}
  .p3 .n{margin:0;grid-row:1/span 2}
  .p3 h3{margin-bottom:4px}
  /* capítulos: uno debajo del otro, cada uno con su teléfono (nada se desliza de lado) */
  .caps{display:block}
  .c-tel{display:none}
  .cap,.cap:first-child,.cap:last-child{min-height:0;opacity:1;padding:0 0 56px;justify-content:flex-start}
  .cap h3{font-size:27px}
  .cap p{font-size:16px}
  .cap .solo-m{display:block;width:min(62%,280px);margin:22px auto 0;box-shadow:0 30px 60px -28px rgba(70,200,232,.45)}
  .c-caja{grid-template-columns:1fr;text-align:center}
  .c-caja .sub{margin:0 auto}
  .c-caja .ctas{justify-content:center}
  #finNova{max-width:220px;order:-1}
}
@media (max-width:640px){
  h1{font-size:clamp(42px,12.4vw,58px)}
  .btn{height:50px;font-size:15px}
  .ctas .btn{flex:1 1 100%;justify-content:center}
  .flot{padding:9px 12px 9px 9px}.flot b{font-size:13px}.flot small{font-size:11.5px}.fi{width:30px;height:30px}
  .vmarco{border-radius:16px}.v-play span{width:66px;height:66px}.v-play b{display:none}
  .pie .wrap{flex-direction:column;align-items:flex-start;gap:12px}.pie p{margin-left:0}
  .fab{right:12px;bottom:calc(14px + env(safe-area-inset-bottom));width:80px;height:80px}
  .globo{font-size:13px;padding:8px 12px}
  .chat{left:0;right:0;bottom:0;width:auto;max-height:78svh;border-radius:24px 24px 0 0;transform:translateY(30px);transform-origin:bottom center;border-bottom:0}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition-duration:.01s!important}
  html{scroll-behavior:auto}
  .js .rv{opacity:1;transform:none}
}

/* ═══ v4: asistente personal + equipo ═══ */
/* selector del héroe: cambia el contenido en el mismo lugar (fundido, sin desplazar nada) */
.modo{position:relative;display:inline-grid;grid-template-columns:1fr 1fr;padding:4px;border-radius:999px;background:rgba(8,13,19,.7);border:1px solid var(--l2);isolation:isolate}
.modo button{position:relative;z-index:1;height:38px;padding:0 18px;border-radius:999px;font-weight:600;font-size:14.5px;color:var(--ink2);transition:color .35s var(--ease)}
.modo button[aria-selected="true"]{color:#032029}
.modo-luz{position:absolute;z-index:0;top:4px;bottom:4px;left:4px;width:calc(50% - 4px);border-radius:999px;background:var(--c2);box-shadow:0 6px 24px -6px rgba(70,200,232,.7);transition:transform .45s var(--ease),background .45s var(--ease)}
[data-modo="equipo"] .modo-luz{transform:translateX(100%);background:#c2b8ff;box-shadow:0 6px 24px -6px rgba(168,152,255,.7)}
.cambia-txt{display:grid}
.cambia-txt>*{grid-area:1/1}
.heroe .solo-ti,.heroe .solo-eq{transition:opacity .45s var(--ease)}
[data-modo="ti"] .solo-eq,[data-modo="equipo"] .solo-ti{opacity:0;pointer-events:none}
.tel-h{position:relative}
.tel-h video{position:absolute;inset:7px;width:calc(100% - 14px);height:calc(100% - 14px)}
.h-txt h1{margin-top:26px}

/* háblale: la conversación que se escribe sola */
.habla{display:grid;grid-template-columns:1fr 440px;gap:clamp(40px,6vw,90px);align-items:center}
.ejemplos{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px}
.ejemplos button{height:36px;padding:0 14px;border-radius:999px;border:1px solid var(--l2);font-size:13.5px;color:var(--ink2);display:inline-flex;align-items:center;gap:7px;transition:all .3s var(--ease)}
.ejemplos button i{width:7px;height:7px;border-radius:50%;background:var(--c)}
.ejemplos button.on{border-color:rgba(143,230,245,.5);color:var(--ink);background:rgba(143,230,245,.07)}
.conv{border-radius:28px;background:var(--s1);border:1px solid var(--l2);box-shadow:0 40px 100px -40px rgba(70,200,232,.35);overflow:hidden;min-height:440px;display:flex;flex-direction:column}
.conv-cab{display:flex;align-items:center;gap:12px;padding:16px 18px;border-bottom:1px solid var(--l1)}
.conv-cab svg{width:42px;height:42px;overflow:visible}
.conv-cab b{display:block;font-size:16px}.conv-cab small{color:var(--ok);font:500 12px PM}
.conv-tag{margin-left:auto;font:500 11.5px PM;letter-spacing:.1em;text-transform:uppercase;padding:6px 10px;border-radius:999px;color:var(--c2);background:rgba(143,230,245,.08);transition:all .4s}
.conv-tag.eq{color:#c2b8ff;background:rgba(168,152,255,.1)}
.conv-msgs{flex:1;padding:20px 18px 22px;display:flex;flex-direction:column;justify-content:flex-end;gap:10px}
.cm{max-width:88%;padding:12px 15px;border-radius:18px;font-size:15.5px;line-height:1.45;animation:entraM .45s var(--ease) both}
.cm.u{align-self:flex-end;background:var(--c2);color:#032029;border-bottom-right-radius:6px;font-weight:500}
.cm.n{background:var(--s2);border:1px solid var(--l1);border-bottom-left-radius:6px}
.cm.esc{display:flex;gap:5px;padding:15px}
.cm.esc i{width:6px;height:6px;border-radius:50%;background:var(--ink3);animation:pt 1s infinite}
.cm.esc i:nth-child(2){animation-delay:.15s}.cm.esc i:nth-child(3){animation-delay:.3s}
.cm.mic{display:flex;align-items:center;gap:10px;font-weight:500}
.cm.mic .ondas{display:flex;gap:3px;align-items:center;height:16px}
.cm.mic .ondas b{width:3px;border-radius:2px;background:#032029;animation:onda .9s ease-in-out infinite}
.cm.mic .ondas b:nth-child(2){animation-delay:.12s}.cm.mic .ondas b:nth-child(3){animation-delay:.24s}.cm.mic .ondas b:nth-child(4){animation-delay:.36s}
@keyframes onda{0%,100%{height:4px}50%{height:15px}}
.accion{align-self:flex-start;display:flex;align-items:center;gap:10px;padding:10px 14px 10px 10px;border-radius:14px;border:1px solid color-mix(in srgb,var(--c) 35%,transparent);background:color-mix(in srgb,var(--c) 8%,transparent);font-size:14px;animation:entraM .45s var(--ease) both}
.accion .fi{width:30px;height:30px;border-radius:9px}
.accion b{font-weight:600}

/* bloques «para ti» y «para tu equipo» */
.bloque-cab{margin-bottom:clamp(30px,4vw,48px)}
.chip-bloque{display:inline-flex;align-items:center;gap:9px;height:34px;padding:0 15px;border-radius:999px;font:600 14px SG;color:var(--c);background:color-mix(in srgb,var(--c) 10%,transparent);border:1px solid color-mix(in srgb,var(--c) 30%,transparent);margin-bottom:18px}
.chip-bloque::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--c);box-shadow:0 0 12px var(--c)}
#para-equipo .cap .k{color:#c2b8ff}
#para-equipo .c-prog i.on{background:#c2b8ff}
#para-equipo .tel-g::before{background:radial-gradient(closest-side,rgba(168,152,255,.22),transparent)}
.sub-c{margin:12px auto 0;text-align:center}

@media (max-width:1000px){
  .modo{width:100%}
  .modo button{height:42px}
  .habla{grid-template-columns:1fr;gap:28px}
  .conv{min-height:400px}
  .ejemplos{margin-top:18px}
}

/* ═══ v5: el video es el héroe (como nova-spaceapps). Vertical en el celular, horizontal en pantallas grandes;
       pantalla completa en el celular = el horizontal girado ═══ */
.oculto{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.historia{position:relative}
.h-pin{position:relative;height:100svh;display:flex;flex-direction:column;padding-top:66px;overflow:hidden}
.h-escena{flex:1;min-height:0;display:grid;place-items:center;padding:14px 16px 52px}
.h-marco{width:min(100% - 32px,calc((100svh - 150px) * 1.7778));aspect-ratio:16/9;position:relative;border-radius:22px;overflow:visible;cursor:pointer}
#hVid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#04070b;display:block;border-radius:22px;border:1px solid var(--l2);box-shadow:0 40px 120px -40px rgba(70,200,232,.35)}
.h-aviso{position:absolute;top:17px;right:144px;z-index:4;padding:8px 14px;border-radius:14px 14px 4px 14px;background:var(--c2);color:#032029;font:600 13.5px SG;opacity:0;transform:translateX(8px);transition:opacity .5s var(--ease),transform .5s var(--ease);pointer-events:none;white-space:nowrap}
.h-aviso.on{opacity:1;transform:none}
.h-ctl3{position:absolute;top:14px;right:14px;z-index:4;display:flex;gap:8px}
.h-ctl3 button{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:rgba(4,7,11,.7);border:1px solid rgba(255,255,255,.14);color:#fff;transition:background .25s,border-color .25s,transform .25s var(--ease)}
.h-ctl3 button:hover{background:rgba(4,7,11,.9);border-color:rgba(143,230,245,.5)}
.h-ctl3 button:active{transform:scale(.92)}
.h-ctl3 svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
#hPlay .p2{display:none;fill:currentColor}#hPlay.pausa .p1{display:none}#hPlay.pausa .p2{display:inline}
#hSon .on{display:none}#hSon[aria-pressed="true"] .on{display:inline}#hSon[aria-pressed="true"] .off{display:none}
#hSon[aria-pressed="true"]{background:var(--c2);color:#032029;border-color:var(--c2)}
#hFull .co{display:none}#hFull.dentro .ex{display:none}#hFull.dentro .co{display:inline}
.h-pie{position:absolute;left:0;right:0;top:calc(100% + 10px);display:flex;align-items:center;gap:16px;height:28px;font:500 12px PM;color:var(--ink3);letter-spacing:.08em;z-index:4}
.h-prog{flex:1;height:14px;cursor:pointer;background:linear-gradient(var(--l1),var(--l1)) center/100% 2px no-repeat;position:relative}
.h-prog i{position:absolute;left:0;top:6px;display:block;height:2px;width:0;background:var(--c)}
.h-prog:hover{background-size:100% 4px}.h-prog:hover i{top:5px;height:4px}
/* pantalla completa propia (celular): capa fija, el marco se gira 90° si el teléfono está vertical */
.h-escena.full{position:fixed!important;inset:0;z-index:300;background:#000;padding:0!important;display:block}
.h-escena.full .h-marco{position:absolute!important;left:50%;top:50%;border-radius:0}
.h-escena.full #hVid,.h-escena:fullscreen #hVid{object-fit:contain;border:0;border-radius:0;box-shadow:none}
.h-escena.full .h-pie,.h-escena:fullscreen .h-pie{top:auto;bottom:6px;padding:0 16px}
.h-escena:fullscreen{background:#000;padding:0;display:grid!important;place-items:center}
.h-escena:fullscreen .h-marco{width:100vw;height:100vh;aspect-ratio:auto;border-radius:0}

/* la propuesta, en corto (debajo del video) */
.intro{padding:clamp(60px,8vw,110px) 0 0}
.intro-g{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(30px,5vw,80px);align-items:end}
.intro h2{font-size:clamp(34px,4.4vw,62px)}
.intro .ctas{margin-top:24px}

/* el video vertical solo cuando la pantalla está parada (celular); una ventana angosta de PC sigue con el horizontal */
@media (max-width:1000px) and (max-aspect-ratio:4/5){
  .h-pin{padding-top:60px;height:100svh}
  .h-escena:not(.full){padding:0;display:block}
  .h-escena:not(.full) .h-marco{width:100%;height:100%;aspect-ratio:auto;border-radius:0}
  .h-escena:not(.full) #hVid{border-radius:0;border:0;box-shadow:none;object-fit:contain;object-position:50% 45%;background:#020407}
  .h-escena:not(.full){background:#020407}
  /* el anuncio (4:5) va centrado y con los bordes de arriba y abajo difuminados: se funde con la página */
  .h-escena:not(.full){display:grid;place-items:center;position:relative}
  .h-escena:not(.full) .h-marco{display:flex;align-items:center;justify-content:center;height:auto;position:static}
  .h-escena:not(.full) #hVid{position:relative;inset:auto;height:auto;width:100%;aspect-ratio:4/5;max-height:100%;-webkit-mask-image:linear-gradient(transparent 0,#000 13%,#000 87%,transparent);mask-image:linear-gradient(transparent 0,#000 13%,#000 87%,transparent)}
  .h-escena:not(.full) .h-pie{top:auto;bottom:0;padding:0 16px 10px;height:34px;background:linear-gradient(transparent,rgba(4,7,11,.9))}
  .h-aviso{right:142px}
  .h-ctl3 button{background:rgba(4,7,11,.85)}
}
@media (max-width:1000px){ .intro-g{grid-template-columns:1fr;gap:16px} }

/* ═══ integraciones: lista por grupos + lo que hace NOVA con la elegida ═══ */
.int{display:grid;grid-template-columns:1.25fr 1fr;gap:clamp(24px,4vw,56px);align-items:start;margin-top:8px}
.int-lista{display:flex;flex-direction:column;gap:26px}
.int-g{display:flex;flex-wrap:wrap;gap:8px}
.int-g>span{flex-basis:100%;font:500 11.5px PM;letter-spacing:.16em;text-transform:uppercase;color:var(--ink3);margin-bottom:2px}
.int-f{display:flex;align-items:center;gap:10px;padding:8px 16px 8px 8px;border-radius:14px;background:var(--s1);border:1px solid var(--l1);color:var(--ink2);font:500 15px SG,system-ui,sans-serif;cursor:pointer;transition:border-color .3s,background .3s,color .3s}
.int-f:hover{border-color:var(--l2);color:var(--ink)}
.int-f.on{color:var(--ink);border-color:color-mix(in srgb,var(--c) 45%,transparent);background:color-mix(in srgb,var(--c) 7%,var(--s1))}
.int-f b{font-weight:500}
.int-f i,.ii{width:34px;height:34px;border-radius:10px;flex:none;background:color-mix(in srgb,var(--c) 13%,transparent);position:relative;display:block}
.int-f i::after,.ii::after{content:"";position:absolute;inset:8px;background:var(--c);-webkit-mask:var(--u) center/contain no-repeat;mask:var(--u) center/contain no-repeat}
.int-demo{position:sticky;top:100px;border-radius:26px;background:var(--s1);border:1px solid var(--l2);box-shadow:0 40px 100px -40px rgba(70,200,232,.3);padding:22px;display:flex;flex-direction:column;gap:16px;min-height:340px}
.int-demo>*{animation:entraM .45s var(--ease) both}
.int-demo>*:nth-child(2){animation-delay:.05s}.int-demo>*:nth-child(3){animation-delay:.12s}.int-demo>*:nth-child(4){animation-delay:.2s}
.id-cab{display:flex;align-items:center;gap:14px}
.id-cab .ii{width:48px;height:48px;border-radius:14px}.id-cab .ii::after{inset:12px}
.id-cab b{display:block;font-size:19px;font-weight:600}
.id-cab small{font:500 12px PM;color:var(--ok)}
.id-d{color:var(--ink2);font-size:15.5px;line-height:1.5}
.id-not{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:18px;background:var(--s2);border:1px solid var(--l1)}
.id-not svg{width:40px;height:40px;flex:none;overflow:visible}
.id-not span{font:500 11.5px PM;color:var(--ink3);letter-spacing:.06em}
.id-not p{font-size:15.5px;line-height:1.45;margin-top:3px}
.id-acc{align-self:flex-start;display:flex;align-items:center;gap:10px;padding:8px 14px 8px 8px;border-radius:14px;border:1px solid color-mix(in srgb,var(--c) 35%,transparent);background:color-mix(in srgb,var(--c) 7%,transparent);font-size:14px}
.id-acc .ii{width:28px;height:28px;border-radius:8px}.id-acc .ii::after{inset:7px}
.id-acc b{font-weight:600}
.int-pie{text-align:center;color:var(--ink3);font-size:14.5px;margin-top:34px}
.int-pie span{color:var(--ink2)}
@media (max-width:1000px){
  .int{grid-template-columns:1fr}
  .int-g{gap:7px}
  .int-f{font-size:14px;padding:6px 13px 6px 6px}
  .int-f i{width:30px;height:30px}.int-f i::after{inset:7px}
  .int-demo{position:static;flex-basis:100%;min-height:0;padding:18px;border-radius:22px;margin:4px 0 6px}
  .int-pie{text-align:left}
}

/* ═══ pedir acceso: conversación con NOVA → pase ═══ */
.pa{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(24px,4vw,60px);align-items:center;margin-top:10px}
.pa-izq{position:relative;display:flex;flex-direction:column;align-items:center;gap:18px}
.pa #finNova{max-width:340px}
.pa-pasos{display:flex;gap:8px}.pa-pasos i{width:34px;height:6px;border-radius:4px;background:var(--l1);transition:background .5s,width .5s}.pa-pasos i.on{background:linear-gradient(90deg,#8fe6f5,#a898ff);width:46px}
.pa-nota{font:500 12.5px PM;letter-spacing:.1em;text-transform:uppercase;color:var(--ink3);text-align:center}
.pa-ventana{border-radius:30px;background:var(--s1);border:1px solid var(--l2);box-shadow:0 40px 100px -40px rgba(70,200,232,.35);display:flex;flex-direction:column;height:min(620px,78svh);overflow:hidden}
.pa-cab{display:flex;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid var(--l1)}.pa-cab svg{width:40px;height:40px;overflow:visible}.pa-cab b{display:block;font-size:16px}.pa-cab small{color:var(--ok);font:500 12px PM}
.pa-tag{margin-left:auto;font:500 11px PM;letter-spacing:.1em;text-transform:uppercase;padding:6px 10px;border-radius:999px;color:var(--c2);background:rgba(143,230,245,.08)}
.pa-chat{flex:1;overflow-y:auto;padding:18px 18px 8px;display:flex;flex-direction:column;gap:10px;scrollbar-width:none}.pa-chat::-webkit-scrollbar{display:none}
.pm{max-width:86%;padding:12px 15px;border-radius:18px;font-size:15.5px;line-height:1.45;animation:paEntra .5s var(--ease) both}
.pm.n{background:var(--s2);border:1px solid var(--l1);border-bottom-left-radius:6px}
.pm.u{align-self:flex-end;background:linear-gradient(160deg,#c4f5fc,#8fe6f5);color:#032029;font-weight:500;border-bottom-right-radius:6px}
.pm.esc{display:flex;gap:5px;padding:15px}.pm.esc i{width:6px;height:6px;border-radius:50%;background:var(--ink3);animation:pt 1s infinite}.pm.esc i:nth-child(2){animation-delay:.15s}.pm.esc i:nth-child(3){animation-delay:.3s}
@keyframes paEntra{from{opacity:0;transform:translateY(12px) scale(.97);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
.pa-resp{padding:12px 16px 16px;border-top:1px solid var(--l1);min-height:76px;display:flex;flex-direction:column;justify-content:center;gap:10px}
.pa-resp:empty{display:none}
.pr-txt{display:flex;gap:8px}.pr-txt input{flex:1;min-width:0;height:48px;border-radius:14px;border:1px solid var(--l2);background:var(--s2);color:var(--ink);padding:0 14px;font:inherit;font-size:16px}
.pr-txt input:focus{outline:none;border-color:var(--c2);box-shadow:0 0 0 3px rgba(143,230,245,.15)}
.pr-txt button{width:48px;height:48px;border-radius:14px;border:0;background:linear-gradient(160deg,#c4f5fc,#6fd3ea);display:grid;place-items:center;cursor:pointer}.pr-txt button svg{width:20px;height:20px;fill:none;stroke:#032029;stroke-width:2.2;stroke-linejoin:round}
.pr-txt.mal{animation:paMal .35s}@keyframes paMal{25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}
.pr-err{font-size:13px;color:#ec6aa8;min-height:0}.pr-err:empty{display:none}
.pr-chips{display:flex;flex-wrap:wrap;gap:8px}.pr-chips button{padding:10px 16px;border-radius:999px;border:1px solid var(--l2);background:var(--s2);color:var(--ink);font:inherit;font-size:14.5px;cursor:pointer;animation:paEntra .45s var(--ease) both;animation-delay:var(--d);transition:border-color .2s,background .2s}
.pr-chips button:hover{border-color:var(--c2)}.pr-chips button[aria-pressed="true"]{background:rgba(143,230,245,.14);border-color:var(--c2);color:#fff}
.pr-listo{align-self:flex-end;padding:10px 22px;border-radius:999px;border:0;background:linear-gradient(160deg,#c4f5fc,#6fd3ea);color:#032029;font:600 14.5px SG,system-ui,sans-serif;cursor:pointer}.pr-listo:disabled{opacity:.35;cursor:default}
.chispa{position:absolute;width:9px;height:9px;border-radius:50%;pointer-events:none;box-shadow:0 0 12px currentColor;animation:chispa var(--t) cubic-bezier(.2,.8,.3,1) forwards}
@keyframes chispa{from{transform:translate(-50%,-50%) scale(1);opacity:1}to{transform:translate(calc(-50% + var(--dx)),calc(-50% + var(--dy))) scale(.2);opacity:0}}
/* el pase */
.pase-m{max-width:100%;align-self:stretch;padding:0;background:none;border:0;animation:paPase .9s var(--ease) both}
@keyframes paPase{from{opacity:0;transform:perspective(900px) rotateX(24deg) translateY(30px) scale(.94);filter:blur(8px)}to{opacity:1;transform:none;filter:none}}
.pase{position:relative;overflow:hidden;border-radius:24px;padding:20px 22px 18px;background:radial-gradient(120% 90% at 0% 0%,rgba(70,200,232,.22),transparent 55%),radial-gradient(100% 80% at 100% 100%,rgba(168,152,255,.22),transparent 55%),#0a1219;border:1px solid rgba(143,230,245,.35);box-shadow:0 30px 70px -30px rgba(70,200,232,.6)}
.pase-brillo{position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.14) 48%,transparent 60%);transform:translateX(-120%);animation:paBrillo 2.6s 1s ease-in-out infinite}
@keyframes paBrillo{0%{transform:translateX(-120%)}55%,100%{transform:translateX(120%)}}
.pase-cab{display:flex;justify-content:space-between;font:500 11.5px PM;letter-spacing:.14em;text-transform:uppercase;color:var(--c2)}
.pase-num{font-size:58px;font-weight:300;letter-spacing:-.04em;line-height:1;margin:14px 0 6px;color:var(--ink2)}.pase-num b{font-weight:600;color:#fff;font-variant-numeric:tabular-nums}
.pase-nom{font-size:24px;font-weight:600;letter-spacing:-.02em}.pase-para{font-size:14.5px;color:var(--ink2);margin-top:2px}
.pase-usos{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}.pase-usos span{padding:5px 11px;border-radius:999px;background:rgba(168,152,255,.16);color:#d6ceff;font-size:12.5px;font-weight:600}
.pase-const{display:block;width:100%;height:auto;margin:12px 0 6px;opacity:.95}
.pase-pie{font-size:12.5px;color:var(--ink3);border-top:1px dashed rgba(143,230,245,.25);padding-top:10px}
.pase-acc{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.pase-acc .btn{font-size:14px;padding:10px 16px}
@media (max-width:1000px){
  .pa{grid-template-columns:1fr;gap:14px}
  .pa-izq{flex-direction:row;justify-content:center;gap:14px}.pa #finNova{max-width:120px;order:0}.pa-nota{display:none}.pa-pasos{flex-direction:column;gap:6px}.pa-pasos i{width:6px;height:22px}.pa-pasos i.on{width:6px;height:30px}
  .pa-ventana{height:min(560px,72svh)}
}
