/* Novedades de la portada (oct-2026): video en duotono, app renovada con mockups, PadelSys en acción.
   Usa los tokens de la portada (--bg, --ink, --brand...) para andar en claro y oscuro. */

/* hero: video de cancha teñido con el azul de marca, detrás del contenido */
.hero-video{position:absolute;inset:0;overflow:hidden;background:var(--brand-d);pointer-events:none}
.hero-video video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.2) brightness(.8);mix-blend-mode:luminosity;opacity:.85}
.hero-video::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(5,5,7,.35) 0,var(--bg) 78%),linear-gradient(180deg,transparent 50%,var(--bg))}
[data-theme="light"] .hero-video video{opacity:.45}
.hero>.hero-logo,.hero>.hero-pill,.hero>h1,.hero>.hero-p,.hero>.hero-ctas{position:relative;z-index:1}

/* secciones nuevas */
.nv{position:relative;z-index:20;background:var(--bg);padding:110px 0;overflow:hidden;transition:background .4s}
.nv-head{display:grid;gap:14px;max-width:640px;margin-bottom:46px}
.nv-ey{font-size:.68rem;font-weight:600;letter-spacing:3px;text-transform:uppercase;color:var(--brand)}
.nv h2{font-family:var(--fh);font-size:clamp(2rem,5vw,3.6rem);font-weight:800;letter-spacing:-.03em;line-height:.95}
.nv h2 .hl{background:linear-gradient(135deg,var(--brand),var(--brand-l),#38bdf8);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.nv-head p{color:var(--ink2);line-height:1.7;max-width:52ch}

/* carrusel de mockups con giro 3D según la distancia al centro */
.mk-rail{display:flex;gap:clamp(12px,3vw,36px);overflow-x:auto;scroll-snap-type:x mandatory;padding:20px max(24px,calc(50% - 130px)) 30px;perspective:1200px;scrollbar-width:none}
.mk-rail::-webkit-scrollbar{display:none}
.mk{flex:0 0 auto;width:min(260px,68vw);scroll-snap-align:center;display:grid;gap:14px;justify-items:center;transform-style:preserve-3d;transition:transform .25s var(--ease),opacity .25s;will-change:transform}
.mk img{width:100%;height:auto;border-radius:12%/5.7%;filter:drop-shadow(0 30px 40px rgba(7,129,178,.28))}
.mk figcaption{font-family:var(--fh);font-weight:700;font-size:.95rem;text-align:center}
.mk figcaption span{display:block;font:400 .78rem/1.4 var(--fb);color:var(--ink2);margin-top:4px;max-width:28ch}
.mk-nav{display:flex;justify-content:center;gap:10px;margin-top:6px}
.mk-nav button{width:44px;height:44px;border-radius:50%;border:1px solid var(--glb);background:var(--gl);color:var(--ink);cursor:pointer;font-size:1rem;transition:background .2s,color .2s}
.mk-nav button:hover{background:var(--brand);color:#fff}
.mk-nav button:focus-visible,.nv-btn:focus-visible{outline:2px solid var(--brand);outline-offset:3px}

/* grilla de novedades */
.nv-grid{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:20px;overflow:hidden;margin-top:56px}
.nv-grid li{background:var(--card);padding:24px 22px;display:grid;gap:8px;align-content:start;transition:background .4s}
.nv-grid i{font-size:1.1rem;color:var(--brand)}
.nv-grid b{font-family:var(--fh);font-size:1.02rem;font-weight:700}
.nv-grid span{color:var(--ink2);font-size:.88rem;line-height:1.55}

/* PadelSys en acción: fondo en duotono, reel y panel */
.nv-accion{background:#050507}
.nv-accion .hero-video::after{background:linear-gradient(180deg,var(--bg),rgba(5,5,7,.55) 30%,rgba(5,5,7,.55) 70%,var(--bg))}
.nv-accion .wrap{position:relative;z-index:1}
.nv-accion h2,.nv-accion .nv-head p{color:#f5f5f7}
.nv-accion .nv-head p{opacity:.75}
.acc{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(24px,5vw,64px);align-items:center}
@media(max-width:820px){.acc{grid-template-columns:minmax(0,1fr);justify-items:center}}
.acc-tel{width:min(270px,66vw);aspect-ratio:9/16;border-radius:36px;padding:8px;background:linear-gradient(145deg,#2a3550,#0b1222);box-shadow:0 40px 80px -30px rgba(7,129,178,.6),0 0 0 1px rgba(255,255,255,.12)}
.acc-tel video{width:100%;height:100%;object-fit:cover;border-radius:29px;display:block;background:#000}
.acc-lap{width:100%;border-radius:14px;padding:10px 10px 0;background:linear-gradient(180deg,#1d2740,#0d1527);box-shadow:0 0 0 1px rgba(255,255,255,.12),0 50px 90px -40px rgba(7,129,178,.6)}
.acc-lap video{width:100%;aspect-ratio:16/9;display:block;border-radius:6px 6px 0 0;object-fit:cover;background:#000}
.acc-lap::after{content:"";display:block;height:14px;margin:0 -24px;background:linear-gradient(180deg,#2a3550,#141c30);border-radius:0 0 14px 14px}
.acc-der{display:grid;gap:22px;min-width:0;width:100%}
.nv-btn{justify-self:start;display:inline-flex;align-items:center;gap:10px;cursor:pointer;border:1px solid var(--brand-l);background:transparent;color:#f5f5f7;font:600 .8rem/1 var(--fb);letter-spacing:1px;text-transform:uppercase;padding:14px 22px;border-radius:100px;transition:background .2s}
.nv-btn:hover{background:var(--brand)}

@media(prefers-reduced-motion:reduce){.mk{transition:none;transform:none!important}}
