/* Home page hero slider [bh_hero]; sizes follow the former Revolution Slider grid (1240x900, 1024x800, 778x900, 480x800) */
.bh-hero {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: min(900px, calc(100vw * 900 / 1240));
    background: #111;
}
@media (max-width: 1024px) { .bh-hero { height: calc(100vw * 800 / 1024); } }
@media (max-width: 778px)  { .bh-hero { height: calc(100vw * 900 / 778); max-height: 100vh; } }
@media (max-width: 480px)  { .bh-hero { height: calc(100vw * 800 / 480); max-height: 100vh; } }

.bh-hero__slides { position: absolute; inset: 0; }
.bh-hero__slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 1s ease;
}
.bh-hero__slide.is-active { opacity: 1; z-index: 1; }
.bh-hero__slide img {
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
    transform: scale(1);
    will-change: transform;
}
.bh-hero__slide.is-prev img { transform: scale(1.1); }
.bh-hero__slide.is-active img {
    transform: scale(1.1);
    transition: transform 5s cubic-bezier(.33, 1, .68, 1);
}

.bh-hero__shade { position: absolute; inset: 0; z-index: 2; background: rgba(0, 0, 0, .5); }

.bh-hero__content {
    position: absolute;
    inset: 11% 0 0;
    z-index: 3;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0 20px;
    text-align: center;
}
.bh-hero__title {
    margin: 0;
    max-width: 1207px;
    color: #fff;
    font-family: 'Overpass', sans-serif;
    font-size: 54px;
    line-height: 56px;
    font-weight: 400;
    padding-bottom: 16px;
    opacity: 0;
    transform: translateY(40px);
    transition: opacity 1.5s cubic-bezier(.77, 0, .175, 1) .1s, transform 1.5s cubic-bezier(.77, 0, .175, 1) .1s;
}
.bh-hero__cta {
    margin-top: 20px;
    opacity: 0;
    transform: translateY(40px);
    transition: opacity 1.5s cubic-bezier(.77, 0, .175, 1) .39s, transform 1.5s cubic-bezier(.77, 0, .175, 1) .39s;
}
.bh-hero.is-ready .bh-hero__title,
.bh-hero.is-ready .bh-hero__cta { opacity: 1; transform: none; }
.bh-hero .a-btn.creative { color: #fff; }

@media (max-width: 778px) {
    .bh-hero__title { font-size: 50px; line-height: 50px; font-weight: 700; }
}
@media (max-width: 480px) {
    .bh-hero__title { font-size: 30px; line-height: 32px; font-weight: 700; }
}

.bh-hero__dots {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 20px;
    z-index: 4;
    display: flex;
    justify-content: center;
    gap: 5px;
}
.bh-hero__dot {
    width: 14px;
    height: 14px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: #aaa;
    transition: background-color .3s;
}
.bh-hero__dot.is-active,
.bh-hero__dot:hover { background: #000; }

@media (prefers-reduced-motion: reduce) {
    .bh-hero__slide, .bh-hero__slide.is-active img, .bh-hero__title, .bh-hero__cta { transition: none; }
    .bh-hero__slide.is-active img, .bh-hero__slide.is-prev img { transform: none; }
}
