/*
 Theme Name:   Somalaser Child Theme
 Theme URI:    https://somalaser.co.za
 Description:  Child theme for Divi
 Author:       Your Name
 Template:     Divi
 Version:      1.0.0
*/

/* Mobile header and content spacing fix */
@media (max-width: 980px) {
    #page-container {
        padding-top: 0 !important;
        overflow-y: visible !important;
    }
    #main-header {
        top: 0 !important;
    }
    .et_header_style_split #main-header {
        padding: 32px 0 7px 0 !important;
    }
    #et-main-area {
        padding-top: 154px !important;
    }
}

@media (min-width: 768px) and (max-width: 980px) {
    #page-container {
        padding-top: 0 !important;
    }
    #main-header {
        top: 0 !important;
    }
    #et-main-area {
        padding-top: 160px !important;
    }
}

/* Fallback fonts to match web font metrics - reduces CLS on swap */
@font-face {
    font-family: 'Montserrat-fallback';
    src: local('Arial');
    size-adjust: 100%;
    ascent-override: 85%;
    descent-override: 22%;
    line-gap-override: 0%;
}

@font-face {
    font-family: 'BenchNine-fallback';
    src: local('Arial Narrow');
    size-adjust: 97%;
    ascent-override: 88%;
    descent-override: 18%;
    line-gap-override: 0%;
}

body {
    font-family: 'Montserrat', 'Montserrat-fallback', sans-serif !important;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'BenchNine', 'BenchNine-fallback', sans-serif !important;
}

/* Reserve correct space for DiviPlus carousel before JS loads - prevents CLS */

/* min-height fallback for older browsers that don't support aspect-ratio */
.dipl_image_card_carousel .dipl_swiper_wrapper {
    min-height: 44vw;
}
@media (max-width: 980px) {
    .dipl_image_card_carousel .dipl_swiper_wrapper {
        min-height: calc(41.1vw + 30px) !important;
    }
}
@media (max-width: 767px) {
    .dipl_image_card_carousel .dipl_swiper_wrapper {
        min-height: calc(41.1vw + 30px) !important;
    }
}

/* Reserve space for DiviPlus carousel images before load */
.dipl_image_card_image_wrapper img {
    aspect-ratio: 2048 / 840;
    width: 100%;
    height: auto;
}

/* 2026-09-21 hero overlap fix.
   The Divi Plus carousel module carried max-height:700px while its banners render
   at natural aspect (about 41.1vw tall) with overflow:visible on every container,
   so above roughly 1706px viewport width the banner spilled over the sections below
   (81px at 1920, 344px at 2560). Below 1706px the banner is already shorter than
   700px, so this changes nothing there. */
.dipl_image_card_carousel_0 {
    max-height: none !important;
}