/*
 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;
}
