/* =========== PlayNow Station – Overrides (forçados e refinados) =========== */
:root{
  --neon-rosa: #ff3ea5;
  --neon-rosa-claro: #ffd6ec;
  --rosa-subtitulo: #fc0cb4; /* alvo do subtítulo */
}

/* ---------- TÍTULO DO HERO (H1) ---------- */
.hero-title,
h1, .h1, [class*="hero-title"], [class*="hero-heading"]{
  line-height: 1.12 !important;
  padding-bottom: 0.14em !important;
  margin-bottom: 0.05em !important;
  overflow: visible !important;
  position: relative;
  z-index: 1;
  -webkit-mask-image: none !important;
  clip-path: none !important;
}
.hero-title *, [class*="hero-title"] *{ line-height: 1.04 !important; }
[class*="hero"], [class*="Hero"]{ overflow: visible !important; }

/* ---------- SUBTÍTULO (ALVO VIA custom.js) ---------- */
[data-pns-subtitle]{
  color: var(--rosa-subtitulo) !important;
  text-shadow:
    0 0 1px rgba(252,12,180,.32),
    0 0 4px rgba(252,12,180,.18) !important; /* glow sutil */
  filter: none !important;
  -webkit-filter: none !important;
  mix-blend-mode: normal !important;
  font-weight: 800 !important;
  letter-spacing: -0.01em !important;
  overflow: visible !important; /* anti-corte local */
}
[data-pns-subtitle] *{
  color: var(--rosa-subtitulo) !important;
  text-shadow:
    0 0 1px rgba(252,12,180,.32),
    0 0 4px rgba(252,12,180,.18) !important;
  overflow: visible !important;
}
[data-pns-subtitle]::before,
[data-pns-subtitle]::after{
  content: none !important; /* remove pseudo-glow forte do tema */
}

/* ---------- FALLBACK SUAVE (se o JS não marcar) ---------- */
[class*="hero"] :where(
  h2, .h2, .subtitle, [class*="subtitle"],
  [class*="subTitle"], [class*="sub-title"],
  [class*="neon"], [class*="glow"]
){
  color: var(--neon-rosa-claro) !important;
  text-shadow:
    0 0 2px rgba(255, 62, 165, .30),
    0 0 6px rgba(255, 62, 165, .18) !important;
  filter: none !important;
  -webkit-filter: none !important;
  mix-blend-mode: normal !important;
  font-weight: 800 !important;
  letter-spacing: -0.01em !important;
}
[class*="hero"] :is(
  h2, .h2, .subtitle, [class*="subtitle"],
  [class*="subTitle"], [class*="sub-title"],
  [class*="neon"], [class*="glow"]
)::before,
[class*="hero"] :is(
  h2, .h2, .subtitle, [class*="subtitle"],
  [class*="subTitle"], [class*="sub-title"],
  [class*="neon"], [class*="glow"]
)::after{
  content: none !important;
  background: var(--neon-rosa) !important;
  opacity: .16 !important;
  filter: blur(4px) !important;
}

/* wrappers que às vezes “lavavam” tudo */
[class*="hero"] [class*="wrap"],
[class*="hero"] [class*="container"],
[class*="hero"] [class*="box"]{
  filter: none !important;
  -webkit-filter: none !important;
  backdrop-filter: none !important;
}

/* ---------- DECORATIVOS NÃO SOBREPOREM O TEXTO ---------- */
[class*="accent"], [class*="decor"], [class*="shape"], [class*="square"]{
  position: relative;
  z-index: 0 !important;
}

/* =========================================================
   CARDS DO CARROSSEL — borda + clipping + overlay correto
   (o script cria .pns-card-bg dentro do card)
========================================================= */

/* Container do card clipa TUDO (evita “vazamento” ao swipar) */
.pns-card-fg{
  position: relative !important;
  border-radius: 16px !important;
  overflow: hidden !important;         /* corta filhos e overlays */
  isolation: isolate;                  /* separa contexto de pintura */
  contain: paint;                      /* melhora performance */
  transform: translateZ(0);            /* novo layer p/ evitar artefatos */
  backface-visibility: hidden;
}

/* Camada da imagem + overlay sempre herdam o raio */
.pns-card-bg,
.pns-card-bg::after{
  border-radius: inherit !important;
}

/* a camada da imagem CLIPA e carrega a borda */
.pns-card-bg{
  position: absolute;
  inset: 0;
  overflow: hidden !important;
  z-index: 0;
  box-shadow: inset 0 0 0 4px var(--accent, #00e5ff); /* borda acompanha o card */
}

/* gradiente por cima da imagem — com micro inset para matar subpixel */
.pns-card-bg::after{
  content:"";
  position:absolute;
  inset: .75px;                        /* 0.5–1px: evita “canto quadrado” */
  background: linear-gradient(180deg, rgba(0,0,0,.10), rgba(0,0,0,.28));
  pointer-events: none;
}

@media (max-width:640px){
  .pns-card-bg{ box-shadow: inset 0 0 0 5px var(--accent, #00e5ff); }
}

/* garante conteúdo acima da imagem */
.pns-card-fg > *{ position: relative; z-index: 1; }

/* Fallback global: caso o slider clone nós sem classe, o 1º filho também clipa */
.swiper-slide > *,
.slick-slide > *,
[class*="keen-slider__slide"] > *{
  border-radius: 16px;
  overflow: hidden;
}

/* ===================== MOBILE TUNING (até 480px) ===================== */
@media (max-width: 480px){
  /* safe-area (notch) */
  body{ padding-top: max(8px, env(safe-area-inset-top)); }

  /* padding lateral padrão para evitar “grudar” nas bordas */
  .section, [class*="section"], main, .container, [class*="container"]{
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  /* H1 mais contido e com folga */
  .hero-title,
  h1, .h1, [class*="hero-title"], [class*="hero-heading"]{
    font-size: clamp(26px, 7.2vw, 40px) !important;
    line-height: 1.12 !important;
    letter-spacing: -0.01em !important;
    margin-top: .15rem !important;
    margin-bottom: .35rem !important;
    padding-bottom: .08em !important;
    word-break: keep-all !important;
  }

  /* Subtítulo alvo (rosa) */
  [data-pns-subtitle]{
    font-size: clamp(18px, 4.8vw, 24px) !important;
    color: var(--rosa-subtitulo) !important;
    text-shadow:
      0 0 1px rgba(252,12,180,.30),
      0 0 3px rgba(252,12,180,.18) !important;
    margin-top: .35rem !important;
    margin-bottom: .6rem !important;
  }

  /* Parágrafos de apoio mais legíveis */
  p, .body, [class*="paragraph"]{
    font-size: 16px !important;
    line-height: 1.6 !important;
    letter-spacing: 0 !important;
  }

  /* CTA full-width com glow contido */
  [class*="cta"], .cta, a.button, button.primary{
    display: block !important;
    width: 100% !important;
    min-height: 56px !important;
    padding: 14px 18px !important;
    border-radius: 16px !important;
    box-shadow:
      0 0 8px rgba(0,255,255,.16),
      0 0 18px rgba(0,255,255,.10) !important;
  }

  /* Timer: labels menores e cards coesos */
  [class*="timer"] [class*="label"], .countdown .label{
    font-size: 12px !important;
    letter-spacing: .08em !important;
    opacity: .9 !important;
  }
  [class*="timer"] [class*="card"], .countdown .card{
    padding: 10px 14px !important;
    border-radius: 14px !important;
    box-shadow: 0 6px 24px rgba(0,0,0,.25) !important;
  }

  /* Reduz neon geral no mobile para não “lavar” o texto */
  .neon, .glow, [class*="neon"], [class*="glow"]{
    text-shadow:
      0 0 1px rgba(0,255,255,.25),
      0 0 4px rgba(0,255,255,.15) !important;
  }
}

/* ===== MOBILE-ONLY: máscara neutra por slide (até 768px) ===== */
@media (max-width: 768px){
  .swiper-slide,
  .slick-slide,
  [class*="keen-slider__slide"]{
    position: relative !important;
  }

  .swiper-slide::before,
  .slick-slide::before,
  [class*="keen-slider__slide"]::before{
    content: "";
    position: absolute;
    inset: 0;
    background: var(--bg, #0f1118);
    z-index: 0;
  }

  .swiper-slide > *,
  .slick-slide > *,
  [class*="keen-slider__slide"] > *{
    position: relative;
    z-index: 1;
  }

  .swiper-slide > *:first-child,
  .slick-slide > *:first-child,
  [class*="keen-slider__slide"] > *:first-child{
    border-radius: 16px !important;
    overflow: hidden;
    box-shadow: inset 0 0 0 5px var(--accent, #00e5ff) !important;
  }
}

/* ---------- MODO “super clean” (opcional)
[class*="hero"] :where(h2,.h2,.subtitle,[class*="subtitle"],[class*="neon"],[class*="glow"]){
  text-shadow: none !important;
}
*/
