/* Dream Bezier · Home Promo Banners */
#promoBanners[hidden]{display:none}
.promo-banners{position:relative;width:100% !important;max-width:none !important;margin:0 auto;padding:0 0 2.5rem !important;background:transparent}
.promo-banners__track{position:relative;width:100%;aspect-ratio:3/1;overflow:hidden;background:#080808}
.promo-banner{position:absolute;inset:0;opacity:0;pointer-events:none;transition:opacity .55s ease}
.promo-banner.is-active{opacity:1;pointer-events:auto}
.promo-banner img{display:block;width:100%;height:100%;object-fit:cover}
.promo-banner__shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.58),rgba(0,0,0,.08) 60%,rgba(0,0,0,.28))}
.promo-banner__info{position:absolute;left:clamp(1rem,4vw,4rem);right:clamp(1rem,4vw,4rem);bottom:clamp(1rem,3vw,2.5rem);display:flex;align-items:flex-end;justify-content:space-between;gap:1rem}
.promo-banner__name{font-weight:700;font-size:clamp(1.1rem,2.2vw,2rem);letter-spacing:.04em;text-transform:uppercase;color:#fff;text-shadow:0 2px 16px rgba(0,0,0,.6)}
.promo-banner__cta{border:1px solid rgba(255,255,255,.72);background:rgba(0,0,0,.45);color:#fff;padding:.7rem 1rem;border-radius:999px;font:inherit;font-size:.82rem;cursor:pointer;backdrop-filter:blur(8px);white-space:nowrap}
.promo-banner__cta:hover{background:rgba(255,255,255,.12)}
.promo-banners__dots{display:flex;justify-content:center;gap:.45rem;padding:.8rem 0 0}
.promo-banners__dot{width:7px;height:7px;border-radius:50%;border:0;padding:0;background:rgba(255,255,255,.3);cursor:pointer}
.promo-banners__dot.is-active{background:#fff;transform:scale(1.2)}
@media(max-width:700px){
  .promo-banners{padding-bottom:1.6rem}
  .promo-banners__track{aspect-ratio:3/1}
  .promo-banner__info{align-items:center}
  .promo-banner__name{font-size:.85rem;max-width:55%}
  .promo-banner__cta{font-size:.68rem;padding:.52rem .72rem}
}
@media(prefers-reduced-motion:reduce){.promo-banner{transition:none}}
/* v1.2: the section carries both section and promo-banners classes. */
.section--promo-banners{display:block;width:100%;}

/* v1.4: never collapse the section while published content is being resolved. */
.section--promo-banners { min-height: 0; }


/* CTA alignment fix v2 — bottom-right on desktop, tablet and mobile. */
.promo-banner__info{justify-content:flex-end;}
.promo-banner__cta{margin-left:auto;}


/* CTA alignment fix v3 — force bottom-right on every breakpoint. */
#promoBanners .promo-banner__info{
  justify-content:flex-end !important;
  text-align:right !important;
}
#promoBanners .promo-banner__cta{
  margin-left:auto !important;
  margin-right:0 !important;
  align-self:flex-end !important;
}

/* Large desktop sizing fix — keep CTA readable above 1080p displays. */
@media (min-width: 1921px){
  #promoBanners .promo-banner__cta{
    font-size:clamp(.95rem,.75vw,1.25rem) !important;
    padding:clamp(.8rem,.65vw,1.1rem) clamp(1.1rem,1vw,1.6rem) !important;
    border-width:1px;
  }
}


/* v1.6.5 — full promo banner is clickable; CTA remains the explicit affordance. */
#promoBanners .promo-banner.is-active{cursor:pointer;}
#promoBanners .promo-banner img{transition:transform .25s ease,filter .25s ease;}
@media (hover:hover) and (pointer:fine){
  #promoBanners .promo-banner.is-active:hover img{transform:scale(1.004);filter:brightness(1.025);}
}
@media(prefers-reduced-motion:reduce){
  #promoBanners .promo-banner img{transition:none;}
  #promoBanners .promo-banner.is-active:hover img{transform:none;}
}


/* v1.6.6 — reliable full-banner hit target. Same action as visible CTA. */
#promoBanners .promo-banner__hitarea{
  position:absolute;
  inset:0;
  z-index:2;
  display:block;
  width:100%;
  height:100%;
  margin:0;
  padding:0;
  border:0;
  background:transparent;
  cursor:pointer;
  appearance:none;
  -webkit-appearance:none;
}
#promoBanners .promo-banner__shade{z-index:1;pointer-events:none;}
#promoBanners .promo-banner__info{z-index:3;pointer-events:none;}
#promoBanners .promo-banner__cta{position:relative;z-index:4;pointer-events:auto;}
#promoBanners .promo-banner__hitarea:focus-visible{
  outline:2px solid rgba(255,255,255,.9);
  outline-offset:-4px;
}


/* Content Badge · Promo Banner · top-left */
.db-content-badge{
  position:absolute;
  z-index:8;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:27px;
  padding:6px 10px 5px;
  border:1px solid rgba(255,255,255,.22);
  border-radius:999px;
  background:rgba(8,8,8,.72);
  -webkit-backdrop-filter:blur(12px) saturate(125%);
  backdrop-filter:blur(12px) saturate(125%);
  color:#fff;
  font-family:'Work Sans',Arial,sans-serif;
  font-size:10px;
  font-weight:650;
  line-height:1;
  letter-spacing:.09em;
  text-transform:uppercase;
  white-space:nowrap;
  box-shadow:0 6px 18px rgba(0,0,0,.2);
  pointer-events:none;
}
.db-content-badge--promo{
  top:clamp(10px,1.5vw,18px);
  left:clamp(12px,2.1vw,28px);
}
@media(max-width:768px){
  .db-content-badge{
    min-height:24px;
    padding:5px 8px 4px;
    font-size:9px;
    letter-spacing:.075em;
  }
}


/* ═══════════════════════════════════════════════════════
   DREAM BEZIER · CONTENT BADGE VISUAL POLISH v2
   Visual only — no logic changes
═══════════════════════════════════════════════════════ */
.db-content-badge{
  min-height: 26px;
  padding: 6px 11px 5px;
  border-radius: 7px;
  border: 1px solid rgba(255,255,255,.22);
  background:
    linear-gradient(180deg, rgba(26,26,26,.88), rgba(8,8,8,.84));
  -webkit-backdrop-filter: blur(14px) saturate(135%);
  backdrop-filter: blur(14px) saturate(135%);
  color: #fff;
  font-family: 'Work Sans', Arial, sans-serif;
  font-size: 10px;
  font-weight: 650;
  line-height: 1;
  letter-spacing: .075em;
  text-transform: uppercase;
  text-shadow: 0 1px 1px rgba(0,0,0,.25);
  box-shadow:
    0 8px 24px rgba(0,0,0,.24),
    inset 0 1px 0 rgba(255,255,255,.06);
  white-space: nowrap;
  pointer-events: none;
}

.db-content-badge::before{
  content: "";
  width: 5px;
  height: 5px;
  margin-right: 7px;
  border-radius: 50%;
  background: currentColor;
  opacity: .78;
  box-shadow: 0 0 8px rgba(255,255,255,.38);
}

/* KV — superior derecha */
.db-content-badge--kv{
  top: 14px;
  right: 14px;
}

/* Promo Banner — superior izquierda */
.db-content-badge--promo{
  top: clamp(12px, 1.6vw, 20px);
  left: clamp(14px, 2.2vw, 30px);
}

@media (max-width: 768px){
  .db-content-badge{
    min-height: 23px;
    padding: 5px 9px 4px;
    border-radius: 6px;
    font-size: 8.5px;
    letter-spacing: .065em;
  }

  .db-content-badge::before{
    width: 4px;
    height: 4px;
    margin-right: 6px;
  }

  .db-content-badge--kv{
    top: 10px;
    right: 10px;
  }

  .db-content-badge--promo{
    top: 10px;
    left: 12px;
  }
}


/* Content Badge status colors */
.db-content-badge[data-badge-kind="coming-soon"]::before{
  background:#F2B84B !important;
  box-shadow:0 0 9px rgba(242,184,75,.58) !important;
}
.db-content-badge[data-badge-kind="new-series"]::before{
  background:#4FD17A !important;
  box-shadow:0 0 9px rgba(79,209,122,.58) !important;
}
