/**
 * Static Banner Styles
 * Optimized for Rem units and Responsive Height
 */

.static-banner-section .banner-container {
    max-width: 1300px;
    margin: 0 auto;
    width: 100%;
    position: relative;
    padding-bottom: 3.125rem;
}

@media (min-width: 768px) {
    .static-banner-section .banner-container {
        padding-bottom: 5rem;
    }
}

.static-banner-section .banner-wrapper {
    width: 100%;
    display: block;
    line-height: 0; 
}

/* Image styling */
.static-banner-section .banner-image {
    width: 100%;
    height: 20.375rem; 
    display: block;
    object-fit: cover;
    object-position: center;
    border-radius: 0;
}

@media (min-width: 768px) {
    .static-banner-section .banner-image {
        height: 36.875rem;
    }
}
@media (max-width: 767px) {
    .static-banner-section .banner-container {
        width: 100vw;           
        margin-left: 50%;     
        transform: translateX(-50%);
        position: relative;
        left: 0;
        border-radius: 0; 
    }
}