/* Integra las figuras recortadas con el fondo del banner sin cortes rectos. */
.adPromo .promoArtwork{
  overflow:hidden;
  background:
    radial-gradient(ellipse 66% 88% at 70% 48%,rgba(232,47,124,.16) 0%,rgba(232,47,124,.075) 46%,transparent 76%)!important;
}

.adPromo .promoArtwork::before{
  display:block!important;
  content:"";
  position:absolute!important;
  z-index:2!important;
  inset:0!important;
  pointer-events:none!important;
  background:
    radial-gradient(ellipse 48% 70% at 68% 48%,rgba(255,132,185,.16),transparent 72%)!important;
  mix-blend-mode:normal!important;
}

.adPromo .promoArtwork::after{
  display:block!important;
  content:"";
  position:absolute!important;
  z-index:3!important;
  inset:0!important;
  width:auto!important;
  height:auto!important;
  pointer-events:none!important;
  background:
    linear-gradient(90deg,#faf7f3 0%,rgba(250,247,243,.9) 7%,rgba(250,247,243,.38) 17%,transparent 31%),
    linear-gradient(270deg,#faf7f3 0%,rgba(250,247,243,.72) 5%,rgba(250,247,243,.18) 12%,transparent 22%),
    linear-gradient(0deg,#faf7f3 0%,rgba(250,247,243,.38) 7%,transparent 17%),
    linear-gradient(180deg,#faf7f3 0%,rgba(250,247,243,.22) 5%,transparent 14%)!important;
}

.adPromo .promoArtwork img{
  z-index:1;
}

@media(max-width:900px){
  .adPromo .promoArtwork{
    background:radial-gradient(ellipse 76% 82% at 62% 42%,rgba(232,47,124,.15),transparent 76%)!important;
  }
  .adPromo .promoArtwork::after{
    background:
      linear-gradient(0deg,#faf7f3 0%,rgba(250,247,243,.92) 12%,rgba(250,247,243,.4) 26%,transparent 43%),
      linear-gradient(90deg,#faf7f3 0%,rgba(250,247,243,.25) 10%,transparent 25%),
      linear-gradient(270deg,#faf7f3 0%,rgba(250,247,243,.25) 8%,transparent 22%)!important;
  }
}

@media(max-width:640px){
  .adPromo .promoArtwork::before{
    background:radial-gradient(ellipse 70% 62% at 50% 38%,rgba(255,132,185,.14),transparent 74%)!important;
  }
  .adPromo .promoArtwork::after{
    background:
      linear-gradient(0deg,#faf7f3 0%,rgba(250,247,243,.98) 18%,rgba(250,247,243,.72) 31%,rgba(250,247,243,.14) 48%,transparent 61%),
      linear-gradient(90deg,#faf7f3 0%,rgba(250,247,243,.2) 8%,transparent 20%),
      linear-gradient(270deg,#faf7f3 0%,rgba(250,247,243,.2) 8%,transparent 20%)!important;
  }
}

/* ── El bloque va BLANCO; el rosa, solo detrás de la figura ──────────────────
   Venía en crema (#faf7f3) con el rosa derramado por todo el ancho: el tinte
   llegaba al titular y al texto, y a esa saturación tan baja no se lee como
   color de marca sino como blanco sucio.

   Ahora el fondo es blanco limpio y el rosa se concentra donde tiene sentido
   —detrás de la foto recortada, como halo— con una sombra de contacto al pie
   para que la figura se apoye en el bloque en vez de flotar sobre él. */
.adPromo,
.adPromo .promoSlide,
.adPromo .promoSlide[data-theme="blue"],
.adPromo .promoSlide[data-theme="cyan"],
.adPromo .promoSlide[data-theme="green"],
.adPromo .promoSlide[data-theme="coral"]{
  background:#fff!important;
}

/* El velo que despeja el lado del texto: blanco, no crema. */
.adPromo .promoSlide::after{
  background:linear-gradient(90deg,
    #fff 0%,
    rgba(255,255,255,.96) 34%,
    rgba(255,255,255,.3) 55%,
    transparent 72%)!important;
}

/* El halo. Elipse rosa ceñida a la figura, no una mancha de lado a lado. */
.adPromo .promoArtwork{
  background:
    radial-gradient(ellipse 52% 74% at 64% 46%,
      rgba(232,47,124,.19) 0%,
      rgba(232,47,124,.085) 48%,
      transparent 76%)!important;
}

.adPromo .promoArtwork::before{
  background:
    /* Segundo halo, más ceñido: da profundidad sin ensanchar la mancha. */
    radial-gradient(ellipse 38% 56% at 63% 44%,rgba(255,132,185,.17),transparent 72%),
    /* Sombra de contacto: la elipse aplastada al pie es lo que planta la
       figura en el suelo. Sin ella el recorte flota y se nota que es un PNG. */
    radial-gradient(ellipse 30% 6% at 62% 93%,rgba(74,18,45,.22),transparent 70%)!important;
}

/* Los cuatro fundidos de borde tienen que apagar contra BLANCO; con el crema
   viejo dejaban un cerco visible alrededor de la foto. */
.adPromo .promoArtwork::after{
  background:
    linear-gradient(90deg,#fff 0%,rgba(255,255,255,.9) 7%,rgba(255,255,255,.38) 17%,transparent 31%),
    linear-gradient(270deg,#fff 0%,rgba(255,255,255,.72) 5%,rgba(255,255,255,.18) 12%,transparent 22%),
    linear-gradient(0deg,#fff 0%,rgba(255,255,255,.38) 7%,transparent 17%),
    linear-gradient(180deg,#fff 0%,rgba(255,255,255,.22) 5%,transparent 14%)!important;
}

/* La píldora del epígrafe: rosa apenas insinuado sobre blanco. */
.adPromo .promoEyebrow{
  background:rgba(232,47,124,.07)!important;
  box-shadow:inset 0 0 0 1px rgba(232,47,124,.13)!important;
}

@media(max-width:900px){
  .adPromo .promoArtwork{
    background:radial-gradient(ellipse 74% 78% at 60% 42%,rgba(232,47,124,.17),transparent 76%)!important;
  }
  .adPromo .promoArtwork::after{
    background:
      linear-gradient(0deg,#fff 0%,rgba(255,255,255,.92) 12%,rgba(255,255,255,.4) 26%,transparent 43%),
      linear-gradient(90deg,#fff 0%,rgba(255,255,255,.25) 10%,transparent 25%),
      linear-gradient(270deg,#fff 0%,rgba(255,255,255,.25) 8%,transparent 22%)!important;
  }
}

@media(max-width:640px){
  .adPromo .promoArtwork::before{
    background:
      radial-gradient(ellipse 66% 58% at 50% 36%,rgba(255,132,185,.15),transparent 74%),
      radial-gradient(ellipse 34% 5% at 50% 92%,rgba(74,18,45,.18),transparent 70%)!important;
  }
  .adPromo .promoArtwork::after{
    background:
      linear-gradient(0deg,#fff 0%,rgba(255,255,255,.98) 18%,rgba(255,255,255,.72) 31%,rgba(255,255,255,.14) 48%,transparent 61%),
      linear-gradient(90deg,#fff 0%,rgba(255,255,255,.2) 8%,transparent 20%),
      linear-gradient(270deg,#fff 0%,rgba(255,255,255,.2) 8%,transparent 20%)!important;
  }
}

/* ════════════════════════════════════════════════════════════════════════════
   BLANCO LIMPIO: fuera el halo rosa, se queda la sombra
   ----------------------------------------------------------------------------
   El halo rosa detrás de la figura buscaba integrarla con el fondo, pero a esa
   saturación no se lee como color de marca: se lee como una mancha, y con el
   blanco de al lado parece que el banner está mal impreso.

   Se va entero. Lo que planta la figura en el suelo no era el halo sino la
   sombra de contacto —la elipse aplastada al pie—, y esa se queda: sin ella el
   recorte flota y se nota que es un PNG. Pasa de vinosa (74,18,45) a gris
   neutro, que es lo que hace una sombra de verdad sobre blanco.

   Los cuatro fundidos de borde (`::after`) NO se tocan: son los que apagan la
   foto contra el blanco y siguen haciendo falta.
   ════════════════════════════════════════════════════════════════════════════ */
.adPromo .promoArtwork{
  background:none!important;
}

.adPromo .promoArtwork::before{
  background:
    radial-gradient(ellipse 32% 7% at 62% 93%,rgba(15,23,42,.20) 0%,rgba(15,23,42,.09) 45%,transparent 72%)!important;
}

/* Las dos medidas de abajo repiten el gesto porque el archivo trae sus propias
   media queries con el halo rosa, y van antes que este bloque: sin repetirlas,
   dentro de esos anchos volvería a ganar el rosa. */
@media(max-width:900px){
  .adPromo .promoArtwork{background:none!important}
  .adPromo .promoArtwork::before{
    background:
      radial-gradient(ellipse 34% 6% at 60% 93%,rgba(15,23,42,.19) 0%,rgba(15,23,42,.08) 45%,transparent 72%)!important;
  }
}

@media(max-width:640px){
  .adPromo .promoArtwork{background:none!important}
  .adPromo .promoArtwork::before{
    background:
      radial-gradient(ellipse 36% 5% at 50% 92%,rgba(15,23,42,.17) 0%,rgba(15,23,42,.07) 45%,transparent 72%)!important;
  }
}

/* ── La píldora del epígrafe, sin contorno ───────────────────────────────────
   Llevaba dos contornos superpuestos sin querer: un `border:1px solid #f2b8ce`
   que viene de landing-brand-sides.css línea 3974, y encima el
   `box-shadow:inset 0 0 0 1px` que le añadía este mismo archivo. Los dos fuera.

   Queda el fondo rosa apenas insinuado y la letra en el tono profundo de la
   marca: el contraste del texto contra ese fondo es lo que la delimita, no una
   línea. Sale más limpia y pesa menos en la composición. */
.adPromo .promoEyebrow{
  border:0!important;
  box-shadow:none!important;
  background:rgba(232,47,124,.075)!important;
  color:#8c2858!important;
}
