/* Carruseles de la campaña: videos tipo reel y coverflow 3D de imágenes */
.cv,.cf{position:relative;overflow:hidden;isolation:isolate;background:#0d0a14;color:#fff;padding:clamp(56px,8vw,100px) 0}
.cf{background:radial-gradient(900px 500px at 50% 60%,#2a1150,#0d0a14 70%)}
.cv-luz{position:absolute;z-index:-1;width:560px;height:560px;border-radius:50%;filter:blur(100px);opacity:.42;pointer-events:none;animation:cv-mueve 16s ease-in-out infinite alternate}
.cv-luz.l1{background:#7B2FF7;left:-180px;top:-160px}.cv-luz.l2{background:#C2187A;right:-200px;bottom:-200px;animation-delay:-8s}
.cv-cab{text-align:center;margin:0 auto 28px;max-width:680px}
.cv-cab h2{margin:.25em 0 .3em;font:900 clamp(2rem,1.4rem + 3vw,3.4rem)/1.05 Roboto,Poppins,sans-serif;color:#fff;letter-spacing:-.02em}
.cv-cab p{margin:0;color:#b9b3c9}
.cv-sobre{display:inline-flex;align-items:center;gap:8px;font:800 .75rem Inter,sans-serif;letter-spacing:.18em;text-transform:uppercase;color:#F6A623}
.cv-sobre i{width:9px;height:9px;border-radius:50%;background:#E8343B;box-shadow:0 0 0 0 rgba(232,52,59,.7);animation:cv-rec 1.4s ease-out infinite}
.cv-grad{background:linear-gradient(90deg,#7B2FF7,#C2187A,#F6A623,#6EE33C,#7B2FF7);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:cv-flujo 6s linear infinite}

/* ── videos ── */
.cv-pista{display:flex;gap:clamp(14px,2vw,26px);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:28px calc(50% - clamp(110px,14vw,160px)) 36px;outline:0}
.cv-pista::-webkit-scrollbar{display:none}
.cv-it{position:relative;flex:0 0 clamp(220px,28vw,320px);aspect-ratio:9/16;margin:0;scroll-snap-align:center;border-radius:26px;overflow:hidden;background:#1a1426;transform:scale(.86);opacity:.5;filter:saturate(.6);transition:transform .6s cubic-bezier(.2,1,.3,1),opacity .5s,filter .5s,box-shadow .6s;cursor:pointer}
.cv-it.on{transform:scale(1.04);opacity:1;filter:none;box-shadow:0 40px 80px -30px rgba(123,47,247,.9),0 0 0 2px rgba(255,255,255,.15)}
.cv-it.on::before{content:"";position:absolute;inset:-2px;z-index:3;border-radius:inherit;padding:3px;background:conic-gradient(from var(--cva,0deg),#7B2FF7,#C2187A,#F6A623,#6EE33C,#7B2FF7);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:cv-gira 4s linear infinite;pointer-events:none}
.cv-it video{width:100%;height:100%;object-fit:cover;display:block}
.cv-it figcaption{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:60px 18px 18px;background:linear-gradient(transparent,rgba(13,10,20,.92));transform:translateY(20px);opacity:0;transition:.5s .15s}
.cv-it.on figcaption{transform:none;opacity:1}
.cv-it figcaption b{display:block;font:800 1.05rem/1.25 Roboto,Poppins,sans-serif;margin-bottom:10px}
.cv-barra{display:block;height:4px;border-radius:4px;background:rgba(255,255,255,.2);overflow:hidden}
.cv-barra i{display:block;height:100%;width:0;background:linear-gradient(90deg,#6EE33C,#F6A623)}
.cv-son{position:absolute;top:14px;right:14px;z-index:4;width:42px;height:42px;border-radius:50%;border:0;display:grid;place-items:center;color:#fff;background:rgba(13,10,20,.55);backdrop-filter:blur(8px);cursor:pointer;opacity:0;transition:opacity .3s,transform .2s}
.cv-it.on .cv-son{opacity:1}.cv-son:hover{transform:scale(1.1)}
.cv-son .cv-ondas{display:none}.cv-son[aria-pressed=true] .cv-ondas{display:inline}.cv-son[aria-pressed=true] .cv-mute{display:none}
.cv-ctrl{display:flex;align-items:center;justify-content:center;gap:18px}
.cv-fl{width:52px;height:52px;border-radius:50%;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.06);color:#fff;font-size:1.3rem;cursor:pointer;transition:background .25s,transform .25s,box-shadow .25s}
.cv-fl:hover{background:linear-gradient(135deg,#7B2FF7,#C2187A);transform:scale(1.08);box-shadow:0 0 26px rgba(123,47,247,.7)}
.cv-pts{display:flex;gap:8px}
.cv-pts button{width:10px;height:10px;border-radius:10px;border:0;padding:0;background:rgba(255,255,255,.3);cursor:pointer;transition:width .35s,background .35s}
.cv-pts button.on{width:30px;background:linear-gradient(90deg,#6EE33C,#16C75A)}

/* ── coverflow 3D ── */
.cf-escena{position:relative;height:clamp(420px,62vw,600px);perspective:1500px;touch-action:pan-y;user-select:none;cursor:grab}
.cf-escena.arrastra{cursor:grabbing}
.cf-aro{position:absolute;inset:0;transform-style:preserve-3d}
.cf-it{position:absolute;left:50%;top:50%;width:clamp(200px,24vw,300px);aspect-ratio:9/16;margin:0;padding:0;border:0;border-radius:22px;overflow:hidden;background:#1a1426;cursor:pointer;transform-style:preserve-3d;transition:transform .8s cubic-bezier(.2,1,.3,1),opacity .6s,filter .6s,box-shadow .6s;will-change:transform}
.cf-it img{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}
.cf-it::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 40%,rgba(255,255,255,.25) 50%,transparent 60%);background-size:250% 100%;background-position:150% 0;transition:background-position 1s;pointer-events:none}
.cf-it.on{box-shadow:0 50px 90px -30px rgba(194,24,122,.9),0 0 0 3px rgba(255,255,255,.9)}
.cf-it.on::after{background-position:-50% 0}
.cf-pie{text-align:center;margin:8px 16px 18px;font:800 clamp(1.1rem,1rem + .8vw,1.5rem) Roboto,Poppins,sans-serif;min-height:1.6em;animation:cf-entra .6s cubic-bezier(.2,1.3,.4,1)}
.cf-cont{font:700 .95rem Inter,sans-serif;color:#b9b3c9;min-width:70px;text-align:center;font-variant-numeric:tabular-nums}
@property --cva{syntax:"<angle>";inherits:false;initial-value:0deg}
@keyframes cv-gira{to{--cva:360deg}}
@keyframes cv-flujo{to{background-position:-300% 0}}
@keyframes cv-mueve{to{transform:translate(140px,90px) scale(1.15)}}
@keyframes cv-rec{to{box-shadow:0 0 0 9px rgba(232,52,59,0)}}
@keyframes cf-entra{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media(max-width:600px){.cv-pista{padding-left:calc(50% - 115px);padding-right:calc(50% - 115px)}.cv-it{flex-basis:230px}.cf-it{width:56vw}}
@media(prefers-reduced-motion:reduce){.cv-luz,.cv-grad,.cv-it.on::before,.cv-sobre i{animation:none}.cv-it,.cf-it{transition:none}}
/* variante clara (catálogo): fondo suave en vez de oscuro */
.cf-claro{background:radial-gradient(900px 500px at 50% 60%,#efe7fb,#faf7f1 70%);color:#141820}
.cf-claro .cv-cab h2,.cf-claro .cf-pie{color:#141820}.cf-claro .cv-cab p,.cf-claro .cf-cont{color:#5d6270}
.cf-claro .cv-fl{color:#141820;border-color:rgba(20,24,32,.2);background:#fff}
.cf-claro .cf-it.on{box-shadow:0 50px 90px -30px rgba(123,47,247,.6),0 0 0 3px #fff}
/* movimiento continuo: el aro 3D se mece, la imagen del centro hace zoom lento y las tarjetas de video flotan */
.cf-aro{animation:cf-mece 9s ease-in-out infinite}
.cf-it.on img{animation:cf-zoom 6s ease-in-out infinite alternate}
.cv-it{animation:cv-flota 5s ease-in-out infinite}
.cv-it:nth-child(2n){animation-delay:-2.5s}
.cv-it.on video{animation:cf-zoom 7s ease-in-out infinite alternate}
@keyframes cf-mece{0%,100%{transform:rotateY(-5deg) rotateX(2deg)}50%{transform:rotateY(5deg) rotateX(-1deg)}}
@keyframes cf-zoom{from{transform:scale(1)}to{transform:scale(1.08)}}
@keyframes cv-flota{0%,100%{translate:0 0}50%{translate:0 -10px}}
@media(prefers-reduced-motion:reduce){.cf-aro,.cf-it.on img,.cv-it,.cv-it.on video{animation:none}}