/* ID Marketing 360 — hoja unica. Oscuro de base, violeta de marca (#6601F1 / #8f4dff). */
:root{
  --bg:#07040f; --bg2:#0e0820; --panel:#130b2a; --panel2:#1a1036;
  --linea:rgba(190,160,255,.14); --linea2:rgba(190,160,255,.28);
  --texto:#ece8f7; --suave:#b5acd0; --tenue:#8a80a8;
  --v:#6601f1; --v2:#8f4dff; --lila:#c4a8ff; --rosa:#ff5fd2; --cian:#48e0ff;
  --grad:linear-gradient(100deg,#8f4dff 0%,#ff5fd2 45%,#48e0ff 100%);
  --radio:22px; --ancho:1200px;
  --tit:"Sora",system-ui,sans-serif; --cuerpo:"Manrope",system-ui,sans-serif;
  color-scheme:dark;
}
@view-transition{navigation:auto}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--texto);font:16px/1.65 var(--cuerpo);overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{font-family:var(--tit);line-height:1.08;letter-spacing:-.025em;margin:0 0 .5em;font-weight:700}
p{margin:0 0 1em}
::selection{background:var(--v2);color:#fff}
:focus-visible{outline:2px solid var(--lila);outline-offset:3px;border-radius:6px}
.salto{position:absolute;left:-999px;top:0;background:#fff;color:#000;padding:.6em 1em;z-index:200}
.salto:focus{left:12px;top:12px}
.cont{width:min(var(--ancho),100% - 32px);margin-inline:auto}
.sec{padding:clamp(72px,10vw,130px) 0;position:relative}
.sec--alt{background:linear-gradient(180deg,transparent,rgba(102,1,241,.07) 30%,rgba(102,1,241,.07) 70%,transparent)}
.ceja{display:inline-flex;align-items:center;gap:.55em;font:600 .78rem/1 var(--tit);letter-spacing:.16em;text-transform:uppercase;color:var(--lila);margin-bottom:1.1rem}
.ceja::before{content:"";width:26px;height:2px;background:var(--grad);border-radius:2px}
.h-sec{font-size:clamp(2rem,4.6vw,3.4rem)}
.lead{font-size:clamp(1.05rem,1.4vw,1.2rem);color:var(--suave);max-width:62ch}
.centro{text-align:center}.centro .lead{margin-inline:auto}
.grad{background:var(--grad);background-size:200% auto;-webkit-background-clip:text;background-clip:text;color:transparent;animation:fluye 6s linear infinite}
@keyframes fluye{to{background-position:200% center}}

/* ---------- barra de progreso y cursor ---------- */
.progreso{position:fixed;top:0;left:0;height:3px;width:100%;transform-origin:0 50%;transform:scaleX(var(--p,0));background:var(--grad);z-index:120}
.cursor{position:fixed;left:0;top:0;width:340px;height:340px;margin:-170px 0 0 -170px;border-radius:50%;pointer-events:none;z-index:0;
  background:radial-gradient(circle,rgba(143,77,255,.16),transparent 65%);transform:translate3d(var(--cx,-500px),var(--cy,-500px),0);transition:transform .18s ease-out}
@media (hover:none){.cursor{display:none}}

/* ---------- encabezado ---------- */
.cab{position:fixed;inset:0 0 auto;z-index:100;transition:background .3s,backdrop-filter .3s,padding .3s,border-color .3s;padding:18px 0;border-bottom:1px solid transparent}
.cab.pegada{background:rgba(7,4,15,.72);backdrop-filter:blur(16px) saturate(1.4);-webkit-backdrop-filter:blur(16px) saturate(1.4);padding:10px 0;border-color:var(--linea)}
.cab .cont{display:flex;align-items:center;justify-content:space-between;gap:20px}
.logo img{height:30px;width:auto}
.nav{display:flex;align-items:center;gap:6px}
.nav>a,.nav .desp>button{font:600 .92rem var(--cuerpo);color:var(--suave);padding:.55em .85em;border-radius:999px;background:none;border:0;cursor:pointer;transition:color .2s,background .2s}
.nav>a:hover,.nav .desp>button:hover,.nav>a[aria-current],.desp.activo>button{color:#fff;background:rgba(255,255,255,.06)}
.desp{position:relative}
.desp>button::after{content:"";display:inline-block;width:6px;height:6px;border:solid currentColor;border-width:0 1.5px 1.5px 0;transform:rotate(45deg);margin:0 0 3px 8px}
.desp-menu{position:absolute;top:calc(100% + 10px);left:50%;translate:-50% 0;width:520px;display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:10px;
  background:rgba(19,11,42,.96);backdrop-filter:blur(16px);border:1px solid var(--linea2);border-radius:18px;box-shadow:0 30px 80px rgba(0,0,0,.5);
  opacity:0;visibility:hidden;transform:translateY(8px);transition:.22s}
.desp:hover .desp-menu,.desp:focus-within .desp-menu,.desp.abierto .desp-menu{opacity:1;visibility:visible;transform:none}
.desp-menu a{display:flex;gap:12px;align-items:center;padding:10px;border-radius:12px;font-size:.92rem;font-weight:600;transition:background .2s}
.desp-menu a:hover{background:rgba(143,77,255,.14)}
.desp-menu img{width:38px;height:38px;object-fit:contain}
.desp-menu small{display:block;color:var(--tenue);font-weight:500;font-size:.78rem}
.hamb{display:none;width:44px;height:44px;border-radius:12px;border:1px solid var(--linea2);background:rgba(255,255,255,.04);cursor:pointer;position:relative}
.hamb span{position:absolute;left:12px;right:12px;height:2px;background:#fff;border-radius:2px;transition:.3s}
.hamb span:nth-child(1){top:15px}.hamb span:nth-child(2){top:21px}.hamb span:nth-child(3){top:27px}
.menu-abierto .hamb span:nth-child(1){top:21px;transform:rotate(45deg)}
.menu-abierto .hamb span:nth-child(2){opacity:0}
.menu-abierto .hamb span:nth-child(3){top:21px;transform:rotate(-45deg)}
.movil{position:fixed;inset:0;z-index:99;background:rgba(7,4,15,.97);backdrop-filter:blur(20px);padding:92px 24px 32px;display:flex;flex-direction:column;gap:4px;overflow:auto;
  clip-path:circle(0 at calc(100% - 38px) 38px);transition:clip-path .55s cubic-bezier(.7,0,.2,1);visibility:hidden}
.menu-abierto .movil{clip-path:circle(150% at calc(100% - 38px) 38px);visibility:visible}
.movil a{font:700 1.5rem var(--tit);padding:.35em 0;border-bottom:1px solid var(--linea);opacity:0;transform:translateY(12px);transition:.4s}
.movil a.sub{font:600 1.05rem var(--cuerpo);color:var(--suave);padding:.5em 0 .5em 1em;border:0}
.menu-abierto .movil a{opacity:1;transform:none;transition-delay:calc(.15s + var(--i,0)*.035s)}
.movil .boton{margin-top:20px;justify-content:center;border-bottom:0}
@media (max-width:980px){.nav{display:none}.hamb{display:block}.cab .cab-cta{display:none}}

/* ---------- botones ---------- */
.boton{--bx:0px;--by:0px;display:inline-flex;align-items:center;gap:.6em;font:700 .98rem var(--tit);padding:1em 1.6em;border-radius:999px;border:0;cursor:pointer;position:relative;isolation:isolate;
  color:#fff;background:linear-gradient(120deg,var(--v),var(--v2));box-shadow:0 10px 30px -8px rgba(102,1,241,.7),inset 0 1px 0 rgba(255,255,255,.25);
  transform:translate(var(--bx),var(--by));transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .3s;overflow:hidden}
.boton::before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 30%,rgba(255,255,255,.35) 50%,transparent 70%);transform:translateX(-120%);transition:transform .7s;z-index:-1}
.boton:hover::before{transform:translateX(120%)}
.boton:hover{box-shadow:0 16px 44px -8px rgba(143,77,255,.9),inset 0 1px 0 rgba(255,255,255,.3)}
.boton svg{width:18px;height:18px;transition:transform .25s}
.boton:hover svg{transform:translateX(4px)}
.boton--fantasma{background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px var(--linea2)}
.boton--fantasma:hover{background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px var(--lila)}
.boton--chico{padding:.72em 1.2em;font-size:.88rem}
.botones{display:flex;flex-wrap:wrap;gap:12px}

/* ---------- fondo animado (blobs) ---------- */
.aurora{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:-1}
.aurora i{position:absolute;border-radius:50%;filter:blur(80px);opacity:.55;animation:flota 18s ease-in-out infinite alternate}
.aurora i:nth-child(1){width:520px;height:520px;background:#6601f1;left:-120px;top:-80px}
.aurora i:nth-child(2){width:420px;height:420px;background:#b02cff;right:-100px;top:12%;animation-duration:22s;animation-delay:-6s;opacity:.4}
.aurora i:nth-child(3){width:360px;height:360px;background:#1d6bff;left:35%;bottom:-160px;animation-duration:26s;opacity:.3}
@keyframes flota{0%{transform:translate(0,0) scale(1)}50%{transform:translate(60px,40px) scale(1.15)}100%{transform:translate(-40px,80px) scale(.95)}}
.malla{position:absolute;inset:0;z-index:-1;pointer-events:none;
  background-image:linear-gradient(rgba(190,160,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(190,160,255,.07) 1px,transparent 1px);background-size:56px 56px;
  mask-image:radial-gradient(ellipse 70% 60% at 50% 30%,#000 30%,transparent 75%);-webkit-mask-image:radial-gradient(ellipse 70% 60% at 50% 30%,#000 30%,transparent 75%)}
#particulas{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}

/* ---------- hero ---------- */
.hero{position:relative;isolation:isolate;min-height:100svh;display:flex;align-items:center;padding:130px 0 80px;overflow:hidden}
.hero .cont{display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center}
.hero h1{font-size:clamp(2.5rem,6.2vw,5.1rem);margin-bottom:.35em}
.hero h1 .linea{display:block;overflow:hidden;padding-bottom:.06em}
.hero h1 .linea>span{display:inline-block;transform:translateY(105%);animation:sube 1s cubic-bezier(.2,.8,.2,1) forwards;animation-delay:calc(.15s + var(--i)*.12s)}
@keyframes sube{to{transform:none}}
.rota{display:inline-grid!important;vertical-align:bottom}
.rota b{grid-area:1/1;font-weight:700;opacity:0;visibility:hidden;transform:translateY(40%) rotateX(-60deg);transition:opacity .5s,transform .6s cubic-bezier(.2,.8,.2,1),visibility .6s}
.rota b.on,.rota b.fuera{visibility:visible}
.rota b.on{opacity:1;transform:none}
.rota b.fuera{opacity:0;transform:translateY(-40%) rotateX(60deg)}
.hero .lead{animation:aparece 1s .7s both}
.hero .botones{animation:aparece 1s .85s both;margin-top:28px}
@keyframes aparece{from{opacity:0;transform:translateY(20px)}}
.hero-vis{position:relative;aspect-ratio:9/12;max-height:640px;animation:aparece 1.2s .4s both}
.hero-vis .mock{position:absolute;inset:4% 6%;width:88%;height:92%;object-fit:cover;border-radius:28px;border:1px solid rgba(196,168,255,.35);box-shadow:0 40px 90px -20px rgba(102,1,241,.8),0 0 0 8px rgba(255,255,255,.03);animation:levita 7s ease-in-out infinite}
@keyframes levita{50%{transform:translateY(-16px) rotate(-1.5deg)}}
.halo{position:absolute;inset:12% 8%;border-radius:50%;background:conic-gradient(from 0deg,#6601f1,#ff5fd2,#48e0ff,#6601f1);filter:blur(60px);opacity:.45;animation:gira 14s linear infinite}
@keyframes gira{to{transform:rotate(360deg)}}
.chip{position:absolute;display:flex;align-items:center;gap:10px;padding:12px 16px;border-radius:16px;background:rgba(19,11,42,.72);border:1px solid var(--linea2);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 20px 40px rgba(0,0,0,.4);font-size:.82rem;color:var(--suave);animation:levita 6s ease-in-out infinite}
.chip strong{display:block;font:700 1.35rem/1 var(--tit);color:#fff}
.chip--1{left:-6%;top:18%;animation-delay:-2s}.chip--2{right:-4%;top:48%;animation-delay:-4s}.chip--3{left:4%;bottom:6%}
.chip .pt{width:10px;height:10px;border-radius:50%;background:#35e39a;box-shadow:0 0 0 6px rgba(53,227,154,.18)}
.bajar{position:absolute;left:50%;bottom:22px;translate:-50% 0;width:26px;height:42px;border:2px solid var(--linea2);border-radius:20px}
.bajar::after{content:"";position:absolute;left:50%;top:8px;width:4px;height:8px;margin-left:-2px;border-radius:2px;background:var(--lila);animation:rueda 1.8s infinite}
@keyframes rueda{to{transform:translateY(14px);opacity:0}}
@media (max-width:900px){
  .hero{min-height:auto;padding:110px 0 70px}
  .hero .cont{grid-template-columns:1fr}
  .hero-vis{max-width:360px;margin:10px auto 0;width:100%}
  .chip--1{left:-2%}.chip--2{right:-2%}
  .bajar{display:none}
}

/* hero de pagina interna */
.hero-in{position:relative;isolation:isolate;padding:150px 0 90px;overflow:hidden}
.hero-in .cont{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center}
.hero-in.solo .cont{grid-template-columns:1fr;text-align:center}
.hero-in.solo .lead{margin-inline:auto}.hero-in.solo .botones{justify-content:center}
.hero-in h1{font-size:clamp(2.3rem,5.4vw,4.3rem)}
.hero-in .lead{margin-bottom:28px}
.hero-in .fig{position:relative}
.hero-in .fig img{border-radius:var(--radio);animation:levita 8s ease-in-out infinite}
.hero-in .fig.transparente img{filter:drop-shadow(0 30px 60px rgba(102,1,241,.5))}
.hero-in .fig.foto img{box-shadow:0 40px 80px -20px rgba(102,1,241,.6);border:1px solid var(--linea2)}
.migas{font-size:.85rem;color:var(--tenue);margin-bottom:18px}
.migas a:hover{color:#fff}
@media (max-width:900px){.hero-in{padding:120px 0 60px}.hero-in .cont{grid-template-columns:1fr}.hero-in .fig{max-width:420px;margin-inline:auto}}

/* ---------- marquesinas ---------- */
.marq{overflow:hidden;position:relative;mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.marq-pista{display:flex;width:max-content;gap:var(--gap,56px);animation:corre var(--dur,32s) linear infinite}
.marq:hover .marq-pista{animation-play-state:paused}
.marq--rev .marq-pista{animation-direction:reverse}
@keyframes corre{to{transform:translateX(calc(-50% - var(--gap,56px)/2))}}
.confianza{padding:40px 0 30px;border-block:1px solid var(--linea);background:rgba(255,255,255,.015)}
.confianza p{text-align:center;color:var(--tenue);font-size:.9rem;margin-bottom:22px}
.insignia{height:74px;padding:12px 24px;display:grid;place-items:center;background:#fff;border-radius:16px;flex:none;box-shadow:0 8px 30px rgba(0,0,0,.25)}
.insignia img{max-height:48px;width:auto}
.palabras{padding:34px 0;border-block:1px solid var(--linea)}
.palabras .marq-pista{--gap:40px;align-items:center}
.palabras span{font:800 clamp(2.2rem,6vw,4.6rem)/1 var(--tit);letter-spacing:-.03em;white-space:nowrap;color:transparent;-webkit-text-stroke:1.2px rgba(196,168,255,.55)}
.palabras span:nth-child(4n+1){color:var(--texto);-webkit-text-stroke:0}
.palabras em{font-style:normal;color:var(--v2);font-size:2rem}

/* ---------- tarjetas (tilt + brillo) ---------- */
.rejilla{display:grid;gap:22px;grid-template-columns:repeat(3,1fr)}
.rejilla--2{grid-template-columns:repeat(2,1fr)}
.rejilla--4{grid-template-columns:repeat(4,1fr)}
@media (max-width:1000px){.rejilla,.rejilla--4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.rejilla,.rejilla--2,.rejilla--4{grid-template-columns:1fr}}
.tarjeta{--rx:0deg;--ry:0deg;--mx:50%;--my:50%;position:relative;padding:30px;border-radius:var(--radio);background:linear-gradient(160deg,var(--panel2),var(--panel) 60%);
  border:1px solid var(--linea);transform:perspective(900px) rotateX(var(--rx)) rotateY(var(--ry));transform-style:preserve-3d;transition:transform .35s cubic-bezier(.2,.8,.2,1),border-color .3s,box-shadow .3s;overflow:hidden;isolation:isolate}
.tarjeta::before{content:"";position:absolute;inset:0;z-index:-1;opacity:0;transition:opacity .3s;background:radial-gradient(420px circle at var(--mx) var(--my),rgba(143,77,255,.28),transparent 45%)}
.tarjeta::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;opacity:0;transition:opacity .3s;pointer-events:none;
  background:radial-gradient(300px circle at var(--mx) var(--my),rgba(196,168,255,.9),transparent 50%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.tarjeta:hover{border-color:var(--linea2);box-shadow:0 30px 60px -30px rgba(102,1,241,.8)}
.tarjeta:hover::before,.tarjeta:hover::after{opacity:1}
.tarjeta h3{font-size:1.35rem;margin-bottom:.45em}
.tarjeta p{color:var(--suave);font-size:.97rem}
.tarjeta .ico{width:92px;height:92px;object-fit:contain;margin-bottom:18px;transform:translateZ(40px);transition:transform .4s cubic-bezier(.2,.8,.2,1);filter:drop-shadow(0 14px 24px rgba(102,1,241,.45))}
.tarjeta:hover .ico{transform:translateZ(60px) scale(1.08) rotate(-4deg)}
.tarjeta .mas{display:inline-flex;align-items:center;gap:6px;font:700 .9rem var(--tit);color:var(--lila);margin-top:6px}
.tarjeta .mas svg{width:16px;height:16px;transition:transform .25s}
.tarjeta:hover .mas svg{transform:translateX(5px)}
.tarjeta--link{display:block;height:100%}
.num-paso{font:800 3.4rem/1 var(--tit);background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:14px;display:block}
.lista{list-style:none;padding:0;margin:0 0 1em;display:grid;gap:10px}
.lista li{display:flex;gap:10px;color:var(--suave);font-size:.96rem}
.lista li::before{content:"";flex:none;width:20px;height:20px;margin-top:3px;border-radius:50%;background:rgba(143,77,255,.2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c4a8ff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L20 7'/%3E%3C/svg%3E") center/12px no-repeat}

/* ---------- cifras ---------- */
.cifras{display:grid;grid-template-columns:repeat(var(--n,3),1fr);gap:18px}
@media (max-width:640px){.cifras{grid-template-columns:repeat(2,1fr)}}
.cifra{padding:24px;border-radius:18px;border:1px solid var(--linea);background:rgba(255,255,255,.025)}
.cifra b{display:block;font:800 clamp(2.2rem,4.5vw,3.3rem)/1 var(--tit);letter-spacing:-.03em;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.cifra span{color:var(--suave);font-size:.92rem}
.barra{height:6px;border-radius:6px;background:rgba(255,255,255,.08);margin-top:14px;overflow:hidden}
.barra i{display:block;height:100%;width:0;background:var(--grad);border-radius:inherit;transition:width 1.6s cubic-bezier(.2,.8,.2,1)}
.visto .barra i{width:var(--w)}

/* ---------- bloques partidos ---------- */
.partido{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,80px);align-items:center}
.partido--inv>:first-child{order:2}
@media (max-width:900px){.partido{grid-template-columns:1fr}.partido--inv>:first-child{order:0}}
.foto-marco{position:relative;border-radius:var(--radio);overflow:hidden;border:1px solid var(--linea2);box-shadow:0 40px 80px -30px rgba(102,1,241,.7)}
.foto-marco img{width:100%;transition:transform 1.2s cubic-bezier(.2,.8,.2,1)}
.foto-marco:hover img{transform:scale(1.05)}
.flotante{filter:drop-shadow(0 30px 50px rgba(102,1,241,.5));animation:levita 8s ease-in-out infinite}
.marco-claro{border-radius:28px;border:1px solid rgba(196,168,255,.35);box-shadow:0 40px 90px -30px rgba(102,1,241,.8)}

/* ---------- portafolio ---------- */
.casos{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
@media (max-width:1000px){.casos{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.casos{grid-template-columns:1fr}}
.caso{display:block;border-radius:var(--radio);overflow:hidden;background:var(--panel);border:1px solid var(--linea);transition:transform .4s cubic-bezier(.2,.8,.2,1),box-shadow .4s,border-color .3s}
.caso:hover{transform:translateY(-8px);box-shadow:0 40px 70px -30px rgba(102,1,241,.9);border-color:var(--linea2)}
.caso .img{aspect-ratio:4/5;overflow:hidden;position:relative}
.caso .img img{width:100%;height:100%;object-fit:cover;transition:transform 1s cubic-bezier(.2,.8,.2,1)}
.caso:hover .img img{transform:scale(1.07)}
.caso .img::after{content:"Ver caso";position:absolute;inset:auto 16px 16px auto;font:700 .82rem var(--tit);padding:.6em 1em;border-radius:999px;background:#fff;color:var(--v);opacity:0;transform:translateY(10px);transition:.3s}
.caso:hover .img::after{opacity:1;transform:none}
.caso .pie{padding:20px 22px}
.caso h3{font-size:1.25rem;margin:0 0 .25em}
.caso p{color:var(--suave);font-size:.92rem;margin:0}
.etq{display:inline-block;font:700 .72rem var(--tit);letter-spacing:.1em;text-transform:uppercase;color:#95f06c;background:rgba(149,240,108,.1);border:1px solid rgba(149,240,108,.25);padding:.35em .75em;border-radius:999px;margin-bottom:10px}
.rsr{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:34px 0}
@media (max-width:800px){.rsr{grid-template-columns:1fr}}
.rsr .tarjeta b{font:700 .78rem var(--tit);letter-spacing:.14em;text-transform:uppercase;color:var(--lila);display:block;margin-bottom:10px}

/* ---------- testimonios ---------- */
.resenas .marq-pista{--gap:20px;align-items:stretch}
.resena{width:340px;flex:none;padding:24px;border-radius:20px;background:linear-gradient(160deg,var(--panel2),var(--panel));border:1px solid var(--linea);display:flex;flex-direction:column;gap:12px}
.resena .estrellas{color:#ffc53d;letter-spacing:2px;font-size:1rem}
.resena p{color:var(--texto);font-size:.95rem;margin:0;flex:1}
.resena footer{display:flex;align-items:center;gap:10px;font-size:.85rem;color:var(--tenue)}
.resena .av{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font:700 .9rem var(--tit);background:linear-gradient(135deg,var(--v),var(--rosa));color:#fff;flex:none}
.resena strong{color:#fff;display:block;font-size:.9rem}
.g-sello{display:inline-flex;align-items:center;gap:8px;padding:.5em 1em;border-radius:999px;background:rgba(255,255,255,.05);border:1px solid var(--linea);font-size:.88rem;color:var(--suave)}
@media (max-width:640px){.resena{width:280px}}

/* ---------- fundador ---------- */
.cita{font:600 clamp(1.25rem,2.2vw,1.6rem)/1.45 var(--tit);letter-spacing:-.01em;color:#fff;position:relative;padding-left:26px;border-left:3px solid;border-image:var(--grad) 1}
.firma{margin-top:22px;display:flex;gap:14px;align-items:center}
.firma img{width:52px;height:52px;border-radius:50%;object-fit:cover;border:2px solid var(--v2)}
.firma span{display:block;color:var(--tenue);font-size:.88rem}
.collage{display:grid;grid-template-columns:1.2fr 1fr;gap:14px}
.collage img{border-radius:18px;border:1px solid var(--linea2);width:100%;height:100%;object-fit:cover}
.collage .alta{grid-row:span 2}
.collage--uno{grid-template-columns:1fr;max-width:460px;margin-left:auto}
.collage--uno .alta{grid-row:auto;aspect-ratio:4/7;max-height:720px}

/* ---------- precios ---------- */
.planes{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;align-items:stretch}
@media (max-width:1100px){.planes{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.planes{grid-template-columns:1fr}}
.plan{display:flex;flex-direction:column}
.plan .nombre{font:700 1.1rem var(--tit);color:var(--lila)}
.plan .precio{font:800 2.3rem/1 var(--tit);margin:14px 0 4px;color:#fff}
.plan .precio small{font-size:.9rem;color:var(--tenue);font-weight:600}
.plan del{color:var(--tenue);font-size:.95rem}
.plan .desc{margin:14px 0 18px}
.plan .lista{flex:1}
.plan .boton{justify-content:center;margin-top:10px}
.plan--top{border-color:var(--v2);background:linear-gradient(160deg,#2a1463,#150b33 70%);box-shadow:0 30px 70px -30px rgba(143,77,255,.9)}
.plan .cinta{position:absolute;top:18px;right:18px;font:700 .72rem var(--tit);padding:.4em .8em;border-radius:999px;background:var(--grad);color:#fff}

/* ---------- FAQ ---------- */
.faq{max-width:860px;margin-inline:auto;display:grid;gap:12px}
.faq details{border:1px solid var(--linea);border-radius:18px;background:rgba(255,255,255,.025);transition:border-color .3s,background .3s}
.faq details[open]{border-color:var(--linea2);background:rgba(143,77,255,.07)}
.faq summary{cursor:pointer;list-style:none;padding:20px 56px 20px 22px;font:700 1.05rem var(--tit);position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:20px;top:50%;translate:0 -50%;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:rgba(143,77,255,.2);color:var(--lila);font-size:1.2rem;transition:transform .3s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq .resp{padding:0 22px 20px;color:var(--suave)}
.faq .resp ul{margin:0 0 1em;padding-left:1.2em}

/* ---------- CTA final ---------- */
.cta{position:relative;isolation:isolate;border-radius:32px;overflow:hidden;padding:clamp(48px,8vw,96px) clamp(22px,6vw,80px);text-align:center;border:1px solid var(--linea2);
  background:radial-gradient(ellipse at 20% 0%,rgba(143,77,255,.55),transparent 55%),radial-gradient(ellipse at 90% 100%,rgba(255,95,210,.35),transparent 50%),linear-gradient(135deg,#1c0b47,#0d0621)}
.cta h2{font-size:clamp(2rem,5vw,3.6rem);max-width:18ch;margin-inline:auto}
.cta .lead{margin:0 auto 30px;color:#d9cffa}
.cta .botones{justify-content:center}
.cta .anillo{position:absolute;width:560px;height:560px;border-radius:50%;border:1px solid rgba(196,168,255,.18);left:50%;top:50%;translate:-50% -50%;z-index:-1;animation:pulso 5s ease-out infinite}
.cta .anillo:nth-child(2){animation-delay:-1.7s}.cta .anillo:nth-child(3){animation-delay:-3.4s}
@keyframes pulso{from{transform:scale(.3);opacity:1}to{transform:scale(1.8);opacity:0}}

/* ---------- formulario ---------- */
.form{display:grid;gap:16px;padding:clamp(22px,4vw,36px);border-radius:26px;background:linear-gradient(160deg,var(--panel2),var(--panel));border:1px solid var(--linea2)}
.form .dos{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:640px){.form .dos{grid-template-columns:1fr}}
.campo{display:grid;gap:6px}
.campo label{font:600 .85rem var(--tit);color:var(--suave)}
.campo input,.campo select,.campo textarea{font:inherit;color:#fff;background:rgba(7,4,15,.6);border:1px solid var(--linea2);border-radius:14px;padding:.85em 1em;transition:border-color .2s,box-shadow .2s;width:100%}
.campo textarea{min-height:130px;resize:vertical}
.campo input:focus,.campo select:focus,.campo textarea:focus{outline:0;border-color:var(--v2);box-shadow:0 0 0 4px rgba(143,77,255,.22)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips label{cursor:pointer}
.chips input{position:absolute;opacity:0;pointer-events:none}
.chips span{display:inline-block;padding:.5em .95em;border-radius:999px;border:1px solid var(--linea2);font-size:.88rem;color:var(--suave);transition:.2s}
.chips input:checked+span{background:linear-gradient(120deg,var(--v),var(--v2));color:#fff;border-color:transparent}
.chips input:focus-visible+span{outline:2px solid var(--lila);outline-offset:2px}
.nota{font-size:.84rem;color:var(--tenue);margin:0}
.aviso-ok{display:none;padding:14px 16px;border-radius:14px;background:rgba(53,227,154,.1);border:1px solid rgba(53,227,154,.35);color:#bff5dc;font-size:.92rem}
.aviso-ok.si{display:block}
.canales{display:grid;gap:12px}
.canal{display:flex;align-items:center;gap:14px;padding:16px 18px;border-radius:16px;border:1px solid var(--linea);background:rgba(255,255,255,.03);transition:.25s}
.canal:hover{border-color:var(--v2);background:rgba(143,77,255,.1);transform:translateX(4px)}
.canal svg{width:24px;height:24px;flex:none;color:var(--lila)}
.canal small{display:block;color:var(--tenue);font-size:.8rem}

/* ---------- pie ---------- */
.pie-sitio{border-top:1px solid var(--linea);padding:70px 0 28px;margin-top:40px;position:relative;overflow:hidden}
.pie-sitio .cols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.3fr;gap:36px}
@media (max-width:900px){.pie-sitio .cols{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.pie-sitio .cols{grid-template-columns:1fr}}
.pie-sitio h4{font-size:.95rem;color:#fff;margin-bottom:14px}
.pie-sitio p,.pie-sitio a{color:var(--suave);font-size:.93rem}
.pie-sitio ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.pie-sitio ul a:hover{color:#fff}
.redes{display:flex;gap:10px;margin-top:18px}
.redes a{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;border:1px solid var(--linea2);transition:.25s}
.redes a:hover{background:var(--v);border-color:var(--v);transform:translateY(-3px)}
.redes svg{width:18px;height:18px;fill:#fff}
.gigante{font:800 clamp(3rem,15vw,12rem)/.8 var(--tit);letter-spacing:-.05em;text-align:center;margin:60px 0 20px;color:transparent;-webkit-text-stroke:1px rgba(196,168,255,.18);user-select:none;white-space:nowrap}
.legal{border-top:1px solid var(--linea);padding-top:22px;font-size:.84rem;color:var(--tenue);display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}

/* ---------- revelado al scroll ---------- */
.js [data-rv]{opacity:0;transform:translateY(34px);transition:opacity .9s cubic-bezier(.2,.8,.2,1),transform .9s cubic-bezier(.2,.8,.2,1);transition-delay:var(--d,0s)}
.js [data-rv="izq"]{transform:translateX(-40px)}
.js [data-rv="der"]{transform:translateX(40px)}
.js [data-rv="zoom"]{transform:scale(.92)}
.js [data-rv].visto{opacity:1;transform:none}
.js .tarjeta[data-rv].visto{transform:perspective(900px) rotateX(var(--rx)) rotateY(var(--ry))}

/* WhatsApp/mensaje flotante */
.flota-msj{position:fixed;right:18px;bottom:18px;z-index:90;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,var(--v),var(--v2));box-shadow:0 14px 34px -6px rgba(102,1,241,.8);transition:transform .25s}
.flota-msj:hover{transform:scale(1.08)}
.flota-msj svg{width:26px;height:26px;fill:#fff}
.flota-msj::before{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid var(--v2);animation:pulso2 2.4s infinite}
@keyframes pulso2{to{transform:scale(1.6);opacity:0}}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .js [data-rv]{opacity:1;transform:none}
  .hero h1 .linea>span{transform:none}
  .marq-pista{animation:none!important;flex-wrap:wrap;width:auto;justify-content:center}
  .marq-pista>[aria-hidden]{display:none}
  .cursor,#particulas{display:none}
  @view-transition{navigation:none}
}
.marq-grupo{display:flex;gap:var(--gap,56px);align-items:center;flex:none}
.resenas .marq-grupo{align-items:stretch}
.rota b{white-space:nowrap}
@media (max-width:520px){.hero h1 .rota{font-size:.8em}.hero-vis{max-width:300px}.chip{padding:9px 12px}.chip strong{font-size:1.1rem}}
.chips label{position:relative}
.partido>*,.rejilla>*,.cifras>*{min-width:0}
.insignia{max-width:100%}.insignia img{max-width:100%;height:auto;object-fit:contain}
html,body{overflow-x:clip}
.insignia:has(img[src*="badge-aistudio"]){background:#1a1036;border:1px solid var(--linea2)}

/* ---------- panel ilustrado del hub de IA (seccion #hub-ia) ---------- */
.hub-panel{border:1px solid var(--linea2);border-radius:var(--radio);background:linear-gradient(160deg,#1b0e40,#0d0720 75%);padding:16px;box-shadow:0 40px 90px -40px rgba(143,77,255,.8)}
.hp-cab{display:flex;align-items:center;gap:6px;padding:2px 4px 14px;color:var(--tenue);font:600 .78rem var(--tit)}
.hp-cab i{width:9px;height:9px;border-radius:50%;background:var(--linea2)}
.hp-cab span{margin-left:8px}
.hp-fila{display:flex;align-items:center;gap:12px;padding:12px;border:1px solid var(--linea);border-radius:14px;background:rgba(255,255,255,.02);margin-bottom:8px}
.hp-fila>div{flex:1;min-width:0}
.hp-fila b{display:block;font:600 .92rem var(--tit);color:var(--texto)}
.hp-fila small{color:var(--tenue);font-size:.8rem}
.hp-ic{width:34px;height:34px;flex:none;display:grid;place-items:center;border-radius:10px;background:rgba(143,77,255,.18);color:var(--lila)}
.hp-fila em{font:700 .7rem var(--tit);font-style:normal;padding:.45em .75em;border-radius:999px;white-space:nowrap}
.hp-fila .ok{background:rgba(31,174,84,.18);color:#4ade80}
.hp-fila .rev{background:rgba(72,224,255,.14);color:var(--cian)}
.hp-fila .pro{background:rgba(143,77,255,.2);color:var(--lila)}
.hp-fila .esp{background:rgba(255,197,61,.15);color:#ffc53d}
.hp-pie{display:flex;align-items:end;justify-content:space-between;gap:16px;padding:14px 12px 4px;color:var(--tenue);font-size:.8rem}
.hp-barras{display:flex;align-items:end;gap:6px;height:54px}
.hp-barras i{width:14px;height:var(--h);border-radius:4px 4px 2px 2px;background:var(--grad)}
.hp-nota{margin:8px 4px 0;color:var(--tenue);font-size:.72rem}
@media (max-width:520px){.hp-fila{flex-wrap:wrap}.hp-fila>div{flex-basis:calc(100% - 46px)}.hp-fila em{margin-left:46px}}