/* Single responsive model for hero banner viewport */
.nsh-banner-carousel {
    position: relative;
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    overflow: hidden;
    border-radius: 0;
    background: var(--nsh-theme-banner-base);
    box-shadow: none;
}

.nsh-banner-carousel__viewport {
    position: relative;
    aspect-ratio: 3 / 1;
    min-height: 0 !important;
    height: auto;
}

.nsh-banner-slide {
    height: 100%;
}

.nsh-banner-slide__media {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: none;
}

.nsh-banner-slide__inner {
    padding: clamp(10px, 2vw, 26px) 0;
}

.nsh-banner-slide__copy {
    max-width: min(62%, 720px);
    padding: clamp(10px, 1.4vw, 22px);
    gap: clamp(8px, 1.2vw, 16px);
}

@media (max-width: 480px) {
    .nsh-banner-carousel {
        width: calc(100vw - 12px);
        border-radius: 24px;
    }

    .nsh-banner-slide__inner {
        padding: 8px 0;
    }

    .nsh-banner-slide__copy {
        max-width: 72%;
        padding: 8px 10px;
        gap: 6px;
    }

    .nsh-banner-carousel__controls {
        bottom: 10px;
    }

    .nsh-banner-carousel__buttons {
        gap: 8px;
    }

    .nsh-banner-carousel__button {
        width: 38px;
        height: 38px;
    }

    .nsh-banner-carousel__dot {
        width: 10px;
        height: 10px;
    }
}