/**
 * font-display overrides for fonts declared without it in parent themes
 * (Mgs/supro mgs_theme_fonts.less, Magento/blank _icons.less).
 * A later @font-face with the same font-family/weight/style replaces the
 * earlier one, so these must load AFTER mgs_theme_fonts.css and styles-l.css.
 */

 @font-face {
    font-family: 'icons-blank-theme';
    src: url('../fonts/Blank-Theme-Icons/Blank-Theme-Icons.woff2') format('woff2'),
        url('../fonts/Blank-Theme-Icons/Blank-Theme-Icons.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Linearicons';
    src: url('../fonts/Linearicons.woff2') format('woff2'),
        url('../fonts/Linearicons.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: IcoFont;
    src: url('../fonts/icofont.woff2') format('woff2'),
        url('../fonts/icofont.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Cerebri Sans';
    src: url('../fonts/CerebriSans-Regular.woff2') format('woff2'),
        url('../fonts/CerebriSans-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Cerebri Sans';
    src: url('../fonts/CerebriSans-Italic.woff2') format('woff2'),
        url('../fonts/CerebriSans-Italic.woff') format('woff');
    font-weight: 400;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Cerebri Sans';
    src: url('../fonts/CerebriSans-Medium.woff2') format('woff2'),
        url('../fonts/CerebriSans-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Cerebri Sans';
    src: url('../fonts/CerebriSans-SemiBold.woff2') format('woff2'),
        url('../fonts/CerebriSans-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Cerebri Sans';
    src: url('../fonts/CerebriSans-Bold.woff2') format('woff2'),
        url('../fonts/CerebriSans-Bold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Cerebri Sans';
    src: url('../fonts/CerebriSans-Heavy.woff2') format('woff2'),
        url('../fonts/CerebriSans-Heavy.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

/* ──────────────────────────────────────────────────────────────────────────
 * CLS fix (2026-06-18): reserve the homepage banner-slider height so content
 * below does not shift while Owl Carousel initialises / the hero image loads.
 * `aspect-ratio` yields to taller real content, so the steady-state layout is
 * unchanged (verified live: hero stays 810px, page height unchanged; on a
 * not-yet-loaded slide it reserves width/2.4 instead of collapsing to 0).
 * Co-located in this already-linked plain-CSS file to avoid a layout-cache
 * flush. Desktop only for now; portrait mobile rule pending verification.
 * ────────────────────────────────────────────────────────────────────────── */
@media (min-width: 992px) {
    .cms-home .page-header-sliders .slider_mgs_carousel { aspect-ratio: 12 / 5; }
}
