/* Capa de motion de IZIAPPX. Se carga después del CSS del build y lo sobrescribe.
   Clases que ya trae el build: .reveal, .reveal[data-from], .bw, .hl-anim, .draw, .chk, .curtain, .page-in, .floaty, .pop */

/* Hero centrado con abanico de proyectos */
.izi-hero{position:relative;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;padding:clamp(6.5rem,13vh,8rem) 0 clamp(2rem,5vh,3.5rem);text-align:center;overflow:hidden;--w:clamp(9.5rem,min(17vw,33svh),16rem);--gap:.7}
.izi-hero-title{max-width:13em;margin-inline:auto;padding-inline:1.25rem;line-height:1.02!important;font-size:clamp(2.5rem,5.6vw,5rem)!important}
.izi-fan{position:relative;width:100%;height:calc(var(--w)*1.42);margin-block:clamp(1.25rem,3vh,2rem) clamp(.75rem,2vh,1.25rem);--sp:0}
.izi-fan-card{--ai:max(var(--i),calc(var(--i)*-1));--x:calc(var(--i)*var(--w)*var(--gap)*(1 + var(--sp)*.22));--y:calc(var(--ai)*var(--ai)*var(--w)*.022);--r:calc(var(--i)*4.6deg);position:absolute;top:calc(var(--w)*.12);left:50%;width:var(--w);margin:0 0 0 calc(var(--w)/-2);aspect-ratio:4/5;z-index:calc(10 - var(--ai));transform:translate3d(var(--x),var(--y),0) rotate(var(--r));transition:transform .55s cubic-bezier(.2,.8,.2,1);animation:izi-fan-in 1.05s cubic-bezier(.2,.8,.2,1) calc(var(--ai)*70ms + .25s) backwards}
.izi-fan-card img{width:100%;height:100%;object-fit:cover;border-radius:1.5rem;background:var(--color-ink);box-shadow:0 26px 44px -22px rgba(0,0,0,.75)}
.izi-fan-tag{position:absolute;top:-.95rem;left:50%;translate:-50% 0;rotate:calc(var(--r)*-1);padding:.3rem .85rem;border-radius:99px;background:var(--color-lime);color:var(--color-ink);font-size:.875rem;font-weight:700;white-space:nowrap;animation:izi-tag-in .5s cubic-bezier(.2,.8,.2,1) 1.2s backwards}
.izi-fan-tag:after{content:"";position:absolute;left:50%;bottom:-.3rem;width:.7rem;height:.7rem;margin-left:-.35rem;background:inherit;border-radius:2px;transform:rotate(45deg)}
@keyframes izi-fan-in{from{opacity:0;transform:translate3d(0,calc(var(--w)*.18),0) rotate(0) scale(.86)}}
@keyframes izi-tag-in{from{opacity:0;scale:.7}}
@media (hover:hover) and (pointer:fine){.izi-fan-card:hover{z-index:20;transform:translate3d(var(--x),calc(var(--y) - .9rem),0) rotate(0) scale(1.05)}}
@media (width<=767px){.izi-hero{--gap:.42;--w:clamp(8.5rem,38vw,11rem)}.izi-fan-tag{display:none}.izi-fan{height:calc(var(--w)*1.38);margin-bottom:2.25rem}}

/* IZICHAT: pantalla Inicio real dentro de la sección */
.izi-crm{position:relative;aspect-ratio:5/4;overflow:hidden;border-radius:1.5rem;background:#0d0e10;box-shadow:0 0 0 1px rgba(255,255,255,.1),0 40px 80px -30px rgba(0,0,0,.9)}
.izi-crm iframe{position:absolute;top:0;left:0;border:0;transform-origin:0 0;pointer-events:none}
/* Toma de entrada: la pantalla llega de cerca y en ángulo, y la cámara se abre hasta verla de frente */
.izi-crm{transform:perspective(1400px) rotateX(calc(var(--ty,0)*-5deg)) rotateY(calc(var(--tx,0)*7deg));transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.izi-crm:after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(125deg,#ffffff1f 0%,#ffffff00 32%,#416ad81f 100%);box-shadow:inset 0 1px 0 #ffffff33}
.izi-crm.is-shot{animation:izi-crm-shot 2.8s cubic-bezier(.16,.8,.2,1) backwards}
/* Las entradas desde un costado no deben abrir scroll horizontal en el celular */
html,body{overflow-x:clip}

/* Hero: tarjetas en video */
.izi-fan-card video{width:100%;height:100%;object-fit:cover;border-radius:1.5rem;background:var(--color-ink);box-shadow:0 26px 44px -22px rgba(0,0,0,.75)}

/* Home: video del proceso */
.izi-video{position:relative;background:var(--color-ink);color:#fff;padding:clamp(4rem,9vh,6.5rem) max(1rem,2vw) clamp(3rem,7vh,5rem)}
.izi-video-head{max-width:46rem;margin:0 auto clamp(2rem,5vh,3rem);padding-inline:.25rem;text-align:center}
.izi-video-head h2{margin:0;font-size:clamp(2.2rem,4.6vw,4rem);line-height:1.05;font-weight:700;letter-spacing:-.03em}
.izi-video-head .fm{background:var(--color-lime);color:var(--color-ink);padding:0 .16em .04em;border-radius:.16em}
.izi-video-head p{margin:1.1rem auto 0;max-width:36rem;font-size:clamp(1.05rem,1.5vw,1.25rem);color:#ffffffc7}
.izi-video-frame{position:relative;max-width:1600px;margin:0 auto;aspect-ratio:16/9;overflow:hidden;border-radius:clamp(1rem,2vw,1.75rem);background:#000;box-shadow:0 40px 90px -40px #000}
.izi-video-frame video{display:block;width:100%;height:100%;object-fit:cover}
.izi-video-sound{position:absolute;right:1rem;bottom:1rem;padding:.55rem 1rem;border:0;border-radius:99px;background:#ffffffe6;color:var(--color-ink);font:600 .9rem/1 inherit;cursor:pointer;transition:transform .2s ease}
.izi-video-sound:active{transform:scale(.96)}
@media (width<=767px){.izi-video-sound{right:.6rem;bottom:.6rem;padding:.4rem .75rem;font-size:.8125rem}}
.izi-video-sound:focus-visible{outline:2px solid var(--color-lime);outline-offset:2px}

/* Servicios: piezas reales que se alternan solas */
.izi-rot{position:relative;height:100%;background:var(--color-ink)}
.izi-rot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 20%;opacity:0;animation:izi-rot-2 10s infinite;animation-delay:calc(var(--i)*5s)}
.izi-rot-3 img{animation-name:izi-rot-3;animation-duration:12s;animation-delay:calc(var(--i)*4s)}
.izi-rot img:first-child{opacity:1}
@keyframes izi-rot-2{0%,45%{opacity:1}55%,100%{opacity:0}}
@keyframes izi-rot-3{0%,30%{opacity:1}38%,92%{opacity:0}100%{opacity:1}}
/* SEO y GEO: búsqueda en Google a la izquierda, respuesta de la IA a la derecha (ciclo de 9 s) */
.izi-seo{display:grid;grid-template-columns:1fr 1fr;gap:4%;height:100%;padding:7% 6%;background:var(--color-ink) radial-gradient(90% 100% at 50% 110%,#0c7a1a 0%,#0a2c11 45%,var(--color-ink) 80%);color:#fff;font-size:clamp(.62rem,.95vw,.8rem)}
.sg-col{display:flex;flex-direction:column;gap:.8em;min-width:0}
.sg-col+.sg-col{border-left:1px solid #ffffff1f;padding-left:8%}
.sg-lbl{font-size:2.1em;font-weight:700;letter-spacing:-.03em;color:var(--color-lime)}
.sg-geo{color:var(--color-lilac,#e894ff)}
.sg-serp{flex:1;display:flex;flex-direction:column;gap:.7em;padding:.9em;border-radius:.9em;background:#fff;color:var(--color-ink)}
.sg-q{padding:.45em .7em;border-radius:99px;box-shadow:inset 0 0 0 1.5px #23232333;white-space:nowrap;overflow:hidden}
.sg-q span{display:inline-block;overflow:hidden;vertical-align:bottom;width:0;border-right:1.5px solid var(--color-ink);animation:sg-type 9s steps(21) infinite}
.sg-r i,.sg-r s{display:block;height:.5em;border-radius:9px;background:#23232326}
.sg-r i{width:45%;margin-bottom:.35em}.sg-r s{width:85%}
.sg-hit{padding:.45em .55em;margin:-.45em -.55em;border-radius:.6em;opacity:0;animation:sg-hit 9s infinite}
.sg-hit i{background:var(--color-lime);width:30%}
.sg-hit u{display:block;text-decoration:none;font-weight:700;font-size:1em}
.sg-ai{flex:1;display:flex;flex-direction:column;justify-content:center;gap:.6em}
.sg-brain{width:2.6em;height:2.6em;border-radius:50%;background:radial-gradient(circle at 35% 35%,#f4c6ff,var(--color-lilac,#e894ff) 55%,#a14ec4);box-shadow:0 0 22px #e894ff80;animation:sg-pulse 2.2s ease-in-out infinite}
.sg-ask,.sg-ans{padding:.6em .8em;border-radius:.9em;line-height:1.3;opacity:0}
.sg-ask{background:#ffffff1f;border-bottom-right-radius:.2em;animation:sg-ask 9s infinite}
.sg-ans{background:#fff;color:var(--color-ink);border-bottom-left-radius:.2em;animation:sg-ans 9s infinite}
.sg-ans mark{background:var(--color-lime);color:var(--color-ink);padding:0 .25em;border-radius:.3em;font-weight:700}
@keyframes sg-type{0%{width:0}22%,90%{width:13.5em}100%{width:0}}
@keyframes sg-hit{0%,24%{opacity:0;transform:translateY(6px)}30%,90%{opacity:1;transform:none;box-shadow:inset 0 0 0 2px var(--color-lime)}100%{opacity:0}}
@keyframes sg-ask{0%,36%{opacity:0;transform:translateY(8px)}42%,90%{opacity:1;transform:none}100%{opacity:0}}
@keyframes sg-ans{0%,52%{opacity:0;transform:translateY(8px)}58%,90%{opacity:1;transform:none}100%{opacity:0}}
@keyframes sg-pulse{50%{transform:scale(1.08);box-shadow:0 0 34px #e894ffb3}}

/* Página IZICHAT: celular con la conversación real, sobre la pantalla en vivo */
.izi-crm-phone{position:absolute;right:-3%;bottom:-11%;z-index:2;width:25%;aspect-ratio:9/18;overflow:hidden;padding:.3rem;border-radius:1.6rem;background:linear-gradient(150deg,#4a4a52,#141417 55%);box-shadow:inset 0 1px 0 #ffffff4d,0 34px 50px -18px #000;animation:izi-phone-in 2.4s cubic-bezier(.16,.8,.2,1) .7s backwards}
.izi-crm-phone img{width:100%;height:100%;object-fit:cover;object-position:top;border-radius:1.35rem}
@keyframes izi-phone-in{from{opacity:0;transform:translate3d(0,44px,0) rotate(4deg)}}
@media (width<=767px){.izi-crm-phone{display:none}}
@media (prefers-reduced-motion:reduce){.izi-crm-phone{animation:none}}
/* Adopta2: misma toma de cámara, de cerca hasta el plano completo */
.izi-cine{transform:perspective(1400px);transform-style:flat}
.izi-cine.is-shot{animation:izi-cine-shot 3s cubic-bezier(.16,.8,.2,1) backwards}
.izi-cine.is-shot img{animation:izi-cine-zoom 3s cubic-bezier(.16,.8,.2,1) backwards}
@keyframes izi-cine-shot{from{opacity:0;transform:perspective(1400px) translate3d(3%,5%,160px) rotateX(14deg) rotateY(-22deg) rotateZ(3deg)}35%{opacity:1}}
@keyframes izi-cine-zoom{from{transform:scale(1.45)}}
@media (prefers-reduced-motion:reduce){.izi-cine.is-shot,.izi-cine.is-shot img{animation:none}}
@keyframes izi-crm-shot{from{opacity:0;transform:perspective(1400px) translate3d(4%,6%,260px) rotateX(20deg) rotateY(-30deg) rotateZ(4deg)}35%{opacity:1}}
@media (prefers-reduced-motion:reduce){.izi-crm{transform:none;transition:none}.izi-crm.is-shot{animation:none}}
@media (width<=767px){.izi-crm{aspect-ratio:4/5}}

/* Equipo: mini gráfico de la marketera */
.izi-mini-bars{position:absolute;right:1.25rem;bottom:1.25rem;display:flex;align-items:flex-end;gap:.25rem;width:7rem;height:3.75rem;padding:.5rem;border-radius:.75rem;background:#000000a6;backdrop-filter:blur(6px)}

/* Sin parpadeo tecnológico en la palabra resaltada */
.glitch:before,.glitch:after{display:none}

/* Nada que se deba leer por debajo de 13 px */
.text-xs{font-size:.8125rem}

@media (prefers-reduced-motion:reduce){
  .izi-rot img{animation:none}
  .izi-seo *{animation:none!important;opacity:1!important}
  .sg-q span{width:auto}
  .izi-fan-card,.izi-fan-tag{animation:none;transition:none}
}