/* Sprint 0.65.0 — seamless cinematic banner */
:root{
  --wpm-hero-copy:#43285f;
  --wpm-hero-copy-mid:#503269;
}

/* Remove every inherited divider, outline and inner frame from the hero. */
.wpm-promo--integrated,
.wpm-promo--integrated .wpm-hero-slider,
.wpm-promo--integrated .wpm-hero-slider__slides,
.wpm-promo--integrated .wpm-hero-slide,
.wpm-promo--integrated .wpm-hero-slide__copy,
.wpm-promo--integrated .wpm-hero-slide__image,
.wpm-promo--integrated .wpm-hero-slide__image img{
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
}

.wpm-promo--integrated .wpm-hero-slide{
  overflow:hidden;
  background:var(--wpm-hero-copy)!important;
}

/* Solid copy panel plus an extended feathered edge; no hard grid seam. */
.wpm-promo--integrated .wpm-hero-slide__copy{
  position:relative;
  z-index:4;
  isolation:isolate;
  background:linear-gradient(110deg,var(--wpm-hero-copy) 0%,var(--wpm-hero-copy-mid) 100%)!important;
}
.wpm-promo--integrated .wpm-hero-slide__copy:after{
  content:"";
  position:absolute;
  z-index:-1;
  top:0;
  bottom:0;
  left:calc(100% - 2px);
  width:clamp(190px,20vw,390px);
  pointer-events:none;
  background:linear-gradient(90deg,
    var(--wpm-hero-copy-mid) 0%,
    rgba(80,50,105,.96) 12%,
    rgba(76,47,101,.82) 31%,
    rgba(72,44,97,.54) 54%,
    rgba(67,40,95,.24) 76%,
    rgba(67,40,95,0) 100%);
}

/* The photo remains underneath the feather so the transition is continuous. */
.wpm-promo--integrated .wpm-hero-slide__image{
  position:relative;
  z-index:1;
  overflow:hidden;
  margin-left:-2px;
  background:var(--wpm-hero-copy-mid);
}
.wpm-promo--integrated .wpm-hero-slide__image:before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  z-index:2!important;
  inset:0!important;
  width:auto!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  pointer-events:none;
  background:linear-gradient(90deg,
    rgba(80,50,105,.88) 0%,
    rgba(78,48,103,.68) 12%,
    rgba(74,45,99,.38) 27%,
    rgba(68,41,95,.14) 43%,
    rgba(67,40,95,0) 60%)!important;
}
.wpm-promo--integrated .wpm-hero-slide__image:after{
  content:""!important;
  position:absolute!important;
  z-index:2!important;
  inset:0!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  pointer-events:none;
  background:linear-gradient(0deg,rgba(24,14,33,.12),transparent 42%)!important;
}

/* Preserve detail with a very restrained cinematic movement. */
.wpm-promo--integrated .wpm-hero-slide__image img{
  transform:scale(1.002)!important;
  transition:transform 18s cubic-bezier(.2,.72,.25,1)!important;
}
.wpm-promo--integrated .wpm-hero-slide.is-active .wpm-hero-slide__image img{
  transform:scale(1.024)!important;
}

@media(max-width:900px){
  .wpm-promo--integrated .wpm-hero-slide__copy:after{width:240px}
  .wpm-promo--integrated .wpm-hero-slide__image:before{
    background:linear-gradient(90deg,rgba(80,50,105,.9) 0%,rgba(76,47,101,.58) 18%,rgba(68,41,95,.18) 45%,transparent 68%)!important;
  }
}

@media(max-width:700px){
  .wpm-promo--integrated .wpm-hero-slide__copy:after{display:none}
  .wpm-promo--integrated .wpm-hero-slide__image{margin-left:0}
  .wpm-promo--integrated .wpm-hero-slide__image:before{display:none!important}
  .wpm-promo--integrated .wpm-hero-slide__image:after{
    display:block!important;
    background:linear-gradient(0deg,var(--wpm-hero-copy) 3%,rgba(67,40,95,.92) 30%,rgba(67,40,95,.44) 60%,transparent 84%)!important;
  }
  .wpm-promo--integrated .wpm-hero-slide.is-active .wpm-hero-slide__image img{transform:scale(1.018)!important}
}

@media(prefers-reduced-motion:reduce){
  .wpm-promo--integrated .wpm-hero-slide__image img,
  .wpm-promo--integrated .wpm-hero-slide.is-active .wpm-hero-slide__image img{
    transform:scale(1.002)!important;
    transition:none!important;
  }
}