/* Base containers */
.nesv-container{position:relative;width:100%;max-width:100vw;overflow:hidden}
.nesv-container .wp-block-group__inner-container{margin:0 auto;padding:0 clamp(16px,3vw,48px)}
.nesv-hero{aspect-ratio:16/7;width:100%;overflow:hidden}
.nesv-hero img{width:100%;height:100%;object-fit:cover;display:block}
.nesv-grid{display:grid;gap:clamp(10px,1.5vw,20px)}
.nesv-row-medium{grid-template-columns:repeat(3,1fr);margin-top:clamp(16px,2vw,24px)}
.nesv-row-small{grid-template-columns:repeat(4,1fr);margin-top:clamp(12px,1.5vw,20px)}
.nesv-square{aspect-ratio:1/1;overflow:hidden}
.nesv-square img{width:100%;height:100%;object-fit:cover;display:block}
.nesv-text-row{margin-top:clamp(16px,2vw,28px)}
.nesv-cards{margin-top:clamp(16px,2vw,28px)}
.nesv-card{padding:clamp(12px,1.5vw,18px);border-radius:16px;background:rgba(11,17,24,.5);backdrop-filter:saturate(130%) blur(2px)}

/* Effects: container-wide */
@media (prefers-reduced-motion:no-preference){
  .nesv-container::before{content:"";position:absolute;inset:0;pointer-events:none;mix-blend-mode:soft-light}
}

/* 01 Parallax */
.nesv-effect-01 .nesv-hero img{transform:translateZ(0);will-change:transform}
@media (prefers-reduced-motion:no-preference){
  .nesv-effect-01:hover .nesv-hero img{transform:scale(1.05)}
}

/* 02 Sheen */
@keyframes nesv-sheen{0%{background-position:-200% 0}100%{background-position:200% 0}}
.nesv-effect-02::before{background:linear-gradient(110deg,transparent,rgba(255,255,255,.12),transparent);background-size:200% 100%;animation:nesv-sheen 4s linear infinite}

/* 03 Soft zoom */
@keyframes nesv-softzoom{0%{transform:scale(1)}100%{transform:scale(1.04)}}
.nesv-effect-03 .nesv-hero img{animation:nesv-softzoom 12s ease-in-out infinite alternate}

/* 04 Vignette */
.nesv-effect-04::before{background:radial-gradient(ellipse at center,transparent 60%,rgba(0,0,0,.35))}

/* 05 Scanline */
.nesv-effect-05::before{background:repeating-linear-gradient(0deg,rgba(255,255,255,.04) 0 1px,transparent 1px 3px)}

/* 06 Glow border */
.nesv-effect-06{box-shadow:0 0 0 1px rgba(0,229,255,.2),0 0 24px rgba(255,46,207,.15) inset}

/* 07 Tilt */
.nesv-effect-07 .nesv-hero{transform:skewY(-1deg)}

/* 08 Mask reveal */
@keyframes nesv-reveal{0%{clip-path:inset(0 50% 0 50%)}100%{clip-path:inset(0 0 0 0)}}
.nesv-effect-08 .nesv-hero img{clip-path:inset(0 0 0 0)}
.nesv-effect-08{animation:nesv-reveal 900ms ease-out both}

/* 09 Split panels */
.nesv-effect-09 .nesv-hero img{clip-path:polygon(0 0,50% 0,50% 100%,0 100%),polygon(50% 0,100% 0,100% 100%,50% 100%);}

/* 10 Glass */
.nesv-effect-10 .nesv-card{background:rgba(255,255,255,.06);backdrop-filter:blur(6px)}

/* 11 Gradient flow */
@keyframes nesv-gradflow{0%{background-position:0% 50%}100%{background-position:100% 50%}}
.nesv-effect-11::before{background:linear-gradient(90deg,#0B1118,#00E5FF,#FF2ECF,#0B1118);background-size:200% 100%;opacity:.12;animation:nesv-gradflow 14s linear infinite}

/* 12 Noise film */
.nesv-effect-12::before{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="80" height="80"><filter id="n"><feTurbulence type="fractalNoise" baseFrequency="0.9" numOctaves="2"/></filter><rect width="100%" height="100%" filter="url(%23n)" opacity="0.06"/></svg>')}

/* 13 Paper */
.nesv-effect-13{background:linear-gradient(180deg,rgba(255,255,255,.02),rgba(0,0,0,.02))}

/* 14 Panorama */
.nesv-effect-14 .nesv-hero img{object-position:center 30%}

/* 15 Grid waves */
@keyframes nesv-waves{0%{transform:translateY(0)}100%{transform:translateY(-2px)}}
.nesv-effect-15 .nesv-square img{animation:nesv-waves 3s ease-in-out infinite alternate}

/* 16 Pulse */
@keyframes nesv-pulse{0%{opacity:.9}100%{opacity:1}}
.nesv-effect-16::before{background:radial-gradient(circle at 50% 50%,rgba(255,46,207,.12),transparent 60%);animation:nesv-pulse 3s ease-in-out infinite alternate}

/* 17 Orbit */
@keyframes nesv-orbit{to{transform:rotate(360deg)}}
.nesv-effect-17::before{background:conic-gradient(from 0deg,rgba(0,229,255,.12),transparent,rgba(255,46,207,.12),transparent);animation:nesv-orbit 40s linear infinite}

/* 18 Rays */
.nesv-effect-18::before{background:repeating-conic-gradient(from 0deg,rgba(255,255,255,.06) 0 10deg,transparent 10deg 20deg)}

/* 19 Warp */
.nesv-effect-19 .nesv-hero img{transform-origin:center}
@media (prefers-reduced-motion:no-preference){
  .nesv-effect-19:hover .nesv-hero img{transform:perspective(1200px) rotateX(2deg)}
}

/* 20 Slide-pan */
@keyframes nesv-slidepan{0%{background-position:0 0}100%{background-position:100% 0}}
.nesv-effect-20::before{background:linear-gradient(90deg,rgba(255,255,255,.04) 0 2px,transparent 2px 10px);background-size:120px 100%;animation:nesv-slidepan 12s linear infinite}

/* 21 Blur-pan */
@keyframes nesv-blur{0%{backdrop-filter:blur(0)}100%{backdrop-filter:blur(2px)}}
.nesv-effect-21::before{animation:nesv-blur 6s ease-in-out infinite alternate}

/* 22 Dot matrix */
.nesv-effect-22::before{background:radial-gradient(circle at 2px 2px,rgba(255,255,255,.07) 1px,transparent 2px);background-size:8px 8px}

/* 23 Stripe shift */
.nesv-effect-23::before{background:repeating-linear-gradient(135deg,rgba(255,255,255,.06) 0 8px,transparent 8px 16px)}

/* 24 Shadow sweep */
@keyframes nesv-sweep{0%{box-shadow:inset 0 0 0 rgba(0,0,0,0)}100%{box-shadow:inset 0 30px 60px rgba(0,0,0,.25)}}
.nesv-effect-24{animation:nesv-sweep 1.2s ease-out both}

/* 25 Neon border */
.nesv-effect-25{outline:2px solid rgba(255,46,207,.3);box-shadow:0 0 18px rgba(255,46,207,.25),0 0 28px rgba(0,229,255,.25) inset}

/* 26 Holographic */
.nesv-effect-26::before{background:conic-gradient(from 180deg at 50% 50%,rgba(0,229,255,.12),rgba(255,46,207,.12),rgba(255,255,255,.08),transparent)}

/* 27 Chrome shine */
.nesv-effect-27 .nesv-hero{filter:contrast(1.05) saturate(1.05)}

/* 28 Depth shift */
.nesv-effect-28 .nesv-grid{transform:translateZ(0)}
@media (prefers-reduced-motion:no-preference){
  .nesv-effect-28:hover .nesv-grid{transform:translateY(-2px)}
}

/* 29 Moire */
.nesv-effect-29::before{background:repeating-linear-gradient(0deg,rgba(255,255,255,.05) 0 2px,transparent 2px 4px),repeating-linear-gradient(90deg,rgba(255,255,255,.03) 0 2px,transparent 2px 4px)}

/* 30 Lens */
.nesv-effect-30::before{background:radial-gradient(circle at 70% 20%,rgba(255,255,255,.12),transparent 30%)}

/* 31 Spotlight */
.nesv-effect-31::before{background:radial-gradient(circle at 40% 30%,rgba(255,255,255,.18),transparent 35%)}

/* 32 Curtain */
.nesv-effect-32::before{background:linear-gradient(90deg,rgba(0,0,0,.25),transparent 20% 80%,rgba(0,0,0,.25))}

/* 33 Rise */
@keyframes nesv-rise{0%{transform:translateY(12px);opacity:.9}100%{transform:translateY(0);opacity:1}}
.nesv-effect-33 .nesv-card{animation:nesv-rise .6s ease-out both}

/* 34 Skew slice */
.nesv-effect-34 .nesv-hero{transform:skewX(-1.5deg)}

/* 35 Flip scroll */
@keyframes nesv-flip{0%{transform:rotateX(0)}100%{transform:rotateX(6deg)}}
.nesv-effect-35 .nesv-hero{transform-origin:top center}
@media (prefers-reduced-motion:no-preference){
  .nesv-effect-35:hover .nesv-hero{animation:nesv-flip 900ms ease-out both}
}

/* 36 Parallax deep */
.nesv-effect-36 .nesv-hero img{transform:translateY(0)}
@media (prefers-reduced-motion:no-preference){
  .nesv-effect-36:hover .nesv-hero img{transform:translateY(-2%)}
}

/* 37 Afterglow */
.nesv-effect-37::before{background:radial-gradient(60% 60% at 50% 40%,rgba(255,46,207,.18),transparent 70%)}

/* Responsive */
@media (max-width: 1024px){
  .nesv-row-medium{grid-template-columns:repeat(3,1fr)}
  .nesv-row-small{grid-template-columns:repeat(3,1fr)}
}
@media (max-width: 768px){
  .nesv-row-medium{grid-template-columns:repeat(2,1fr)}
  .nesv-row-small{grid-template-columns:repeat(2,1fr)}
}