/* The vertical caption must fit inside the hero, below the fixed header. */
main > .img-wrapper {
    --business-caption-height: 480px;
    height: max(350px, var(--business-caption-height));
    margin-top: var(--business-header-height, 100px);
}
main > .img-wrapper .slider,
main > .img-wrapper .slider .slide,
main > .img-wrapper .slider .slide .imgs {
    height: 100%;
}
main > .img-wrapper .slider .slide {
    width: max-content;
    display: flex;
}
main > .img-wrapper .slider .slide .imgs {
    flex-shrink: 0;
    width: auto;
}
main > .img-wrapper .slider .slide .imgs img {
    width: auto;
    height: 100%;
    flex-shrink: 0;
    object-fit: cover;
    margin-right: 10px;
}
main > .img-wrapper .tagline {
    box-sizing: border-box;
    height: 100%;
    padding: 24px 0;
    align-items: center;
    justify-content: center;
}
main > .img-wrapper .tagline p {
    flex: none;
    margin: 0;
    writing-mode: vertical-rl;
    -webkit-writing-mode: vertical-rl;
    white-space: nowrap;
    max-height: none;
    height: max-content;
}
@media screen and (max-width: 1024px) {
    main > .img-wrapper {
        height: max(40vh, var(--business-caption-height));
        margin-top: var(--business-header-height, 80px);
    }
}
@media screen and (max-width: 767px) {
    main > .img-wrapper {
        height: max(50vh, var(--business-caption-height));
        margin-top: var(--business-header-height, 60px);
    }
}
