/* HERO SLIDER - promo banner slide */
.hero__content{transition:transform .8s cubic-bezier(.22,1,.36,1),opacity .6s ease}
.hero.is-promo .hero__content{transform:translateX(-80px);opacity:0;pointer-events:none}
.hero.is-promo .hero__bg,.hero.is-promo .hero__overlay{transition:transform .8s cubic-bezier(.22,1,.36,1);transform:translateX(-12%)}
.hero__bg,.hero__overlay{transition:transform .8s cubic-bezier(.22,1,.36,1)}

.hero-promo{position:absolute;inset:0;z-index:3;display:block;overflow:hidden;
  background:#fff;transform:translateX(100%);visibility:hidden;
  transition:transform .8s cubic-bezier(.22,1,.36,1),visibility 0s linear .8s;cursor:pointer}
.hero.is-promo .hero-promo{transform:translateX(0);visibility:visible;transition:transform .8s cubic-bezier(.22,1,.36,1),visibility 0s}
.hero-promo img{width:100%;height:100%;object-fit:cover;object-position:center 35%}
.hero-promo__cta{position:absolute;left:clamp(1rem,6vw,7rem);bottom:clamp(4.5rem,10vh,6.5rem);display:inline-flex;align-items:center;gap:.75rem;
  padding:.9rem 1.4rem;background:#FC0F12;color:#fff;font-family:var(--font-display,'Outfit',sans-serif);font-weight:700;
  font-size:.8rem;letter-spacing:.15em;text-transform:uppercase;box-shadow:0 10px 30px rgba(252,15,18,.45);
  opacity:0;transform:translateY(20px);transition:opacity .6s ease .6s,transform .6s ease .6s,background .2s}
.hero.is-promo .hero-promo__cta{opacity:1;transform:translateY(0)}
.hero-promo:hover .hero-promo__cta{background:#D4090C}
.hero-promo__cta svg{transition:transform .25s}
.hero-promo:hover .hero-promo__cta svg{transform:translate(3px,-3px)}

.hero-ctrl{position:absolute;z-index:5;bottom:1.5rem;right:50%;transform:translateX(50%);display:flex;align-items:center;gap:.75rem}
.hero-ctrl__btn{width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.35);background:rgba(9,9,9,.65);
  color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;backdrop-filter:blur(6px);transition:background .2s,border-color .2s,transform .2s}
.hero-ctrl__btn:hover{background:#FC0F12;border-color:#FC0F12;transform:scale(1.08)}
.hero-ctrl__dots{display:flex;gap:.5rem;padding:0 .5rem}
.hero-ctrl__dot{width:12px;height:12px;border-radius:10px;border:0;padding:0;background:rgba(255,255,255,.45);cursor:pointer;transition:width .3s,background .3s}
.hero-ctrl__dot.is-active{width:34px;background:#FC0F12}
.hero.is-promo .hero__scroll{opacity:0}

@media(max-width:768px){
  .hero-ctrl{right:50%;transform:translateX(50%);bottom:1rem}
  .hero.is-promo{
    display:block;
    min-height:0;
    max-height:none;
    padding:7rem 1rem 4.25rem!important;
  }
  .hero.is-promo .hero__bg,
  .hero.is-promo .hero__overlay,
  .hero.is-promo .hero__content{display:none}
  .hero.is-promo .hero-promo{
    position:relative;
    inset:auto;
    width:100%;
    aspect-ratio:16/9;
    border-radius:12px;
    background:#fff;
  }
  .hero-promo img{
    width:100%;
    height:auto;
    aspect-ratio:16/9;
    object-fit:contain;
    object-position:center;
  }
  .hero-promo__cta{
    position:static;
    display:flex;
    left:auto;
    bottom:auto;
    width:max-content;
    max-width:100%;
    margin:1rem auto 0;
    transform:translateY(20px);
    white-space:nowrap;
  }
  .hero.is-promo .hero-promo__cta{transform:translateY(0)}
}
@media(prefers-reduced-motion:reduce){.hero *,.hero-promo{transition:none!important}}
