/* ==============================================
   CLS Fix Styles - t_9183
   All rules removed after user interaction via
   body.user-scrolled / body.loader-visible removal.
   ============================================== */

/* Prevent CLS during page load */
body.loader-visible {
    visibility: visible !important;
}

body.no-transitions * {
    transition: none !important;
}

/* ---- Home slider ---- */
.home-slider-container {
    min-height: 400px;
}

body.user-scrolled .home-slider-container {
    min-height: unset;
}

body.loader-visible .home-slide img {
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

/* ---- Banner images ---- */
body.loader-visible .hp-baner img {
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

body.loader-visible .home-banners .row img {
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

/* ---- Info container ---- */
.info-container {
    min-height: 51px;
}

body.user-scrolled .info-container {
    min-height: unset;
}

/* ---- Header bottom ---- */
.header-bottom.affix-init {
    min-height: 80px;
}

body.user-scrolled .header-bottom.affix-init {
    min-height: unset;
}

/* ---- Speed slider ---- */
.speed-slider {
    min-height: 1000px;
    content-visibility: auto;
    contain-intrinsic-size: auto 1000px;
}
.speed-slider .item img {
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    display: block;
}
body.user-scrolled .speed-slider .item img {
    width: 100%;
    aspect-ratio: unset;
    object-fit: unset;
    display: block;
}

body.user-scrolled .speed-slider {
    min-height: unset;
    content-visibility: unset;
    contain-intrinsic-size: unset;
}

.speed-slider .owl-carousel,
.speed-slider .owl-wrapper-outer,
.speed-slider .owl-wrapper {
    height: 1000px;
}

body.user-scrolled .speed-slider .owl-carousel,
body.user-scrolled .speed-slider .owl-wrapper-outer,
body.user-scrolled .speed-slider .owl-wrapper {
    height: auto;
}

body.loader-visible .speed-slider .item img {
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

/* ---- Resp img box ---- */
body.loader-visible .resp-img-box img {
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

/* ---- Advantage ---- */
.advantage-container {
    min-height: 200px;
}

body.user-scrolled .advantage-container {
    min-height: unset;
}

body.loader-visible .advantage-img img {
    width: 110px;
    height: 110px;
    object-fit: contain;
}

/* ---- Paralax ---- */
.paralax {
    min-height: 400px;
    content-visibility: auto;
    contain-intrinsic-size: auto 400px;
}

body.user-scrolled .paralax {
    min-height: unset;
    content-visibility: unset;
    contain-intrinsic-size: unset;
}

/* ---- Banner one ---- */
body.loader-visible .banner-one-container .banner-one-img {
    min-height: 0;
}

body.loader-visible .banner-one-container .banner-one-img::before {
    content: "";
    display: block;
    width: 100%;
    aspect-ratio: 540 / 700;
    background: #f3f3f3;
}

body.loader-visible .banner-one-container .banner-one-img img {
    position: absolute;
    inset: 0;
    aspect-ratio: 540 / 700;
    object-fit: cover;
}

body.user-scrolled .banner-one-container .banner-one-img::before {
    display: none;
}

body.user-scrolled .banner-one-container .banner-one-img img {
    position: static;
    inset: unset;
}

/* ---- Banner two ---- */
body.loader-visible .banner-two-container .banner-two-img img {
    aspect-ratio: 4 / 3;
    object-fit: cover;
}

/* ---- Product description ---- */
.product-description {
    min-height: 200px;
    content-visibility: auto;
    contain-intrinsic-size: auto 200px;
    will-change: auto;
    contain: layout style paint;
}

body.user-scrolled .product-description {
    min-height: unset;
    content-visibility: unset;
    contain-intrinsic-size: unset;
    will-change: unset;
    contain: unset;
}

.product-description .collapse {
    transition: height 0.35s ease;
}

body.user-scrolled .product-description .collapse {
    transition: unset;
}

/* ---- Product inside ---- */
body.loader-visible .product-inside {
    min-height: 400px;
}

body.user-scrolled .product-inside {
    min-height: unset;
}

body.loader-visible .custom-cms-box.paralax {
    min-height: 400px;
}

body.user-scrolled .custom-cms-box.paralax {
    min-height: unset;
}

/* ---- Product name ---- */
body.loader-visible .box-product .box-product-name,
body.loader-visible .product-inside .product-name {
    min-height: 42px;
    overflow: hidden;
}


/* ---- Product buttons ---- */
body.loader-visible .product-inside .product-buttons {
    min-height: 120px;
}

/* ---- Footer newsletter ---- */
.footer-newsletter {
    min-height: 500px;
}

body.user-scrolled .footer-newsletter {
    min-height: unset;
}

/* ---- Footer informations ---- */
.footer-informations {
    content-visibility: auto;
    contain-intrinsic-size: auto 400px;
}

body.user-scrolled .footer-informations {
    content-visibility: unset;
    contain-intrinsic-size: unset;
}

/* ---- Home responsive banners ---- */
body.loader-visible .home_responsive_baners img {
    aspect-ratio: 16 / 9;
    object-fit: cover;
}


/* ==============================================
   Responsive CLS overrides
   ============================================== */

@media screen and (max-width: 768px) {
    .advantage-container {
        min-height: 600px;
    }

    body.user-scrolled .advantage-container {
        min-height: unset;
    }

    .paralax {
        min-height: 300px;
        contain-intrinsic-size: auto 300px;
    }

    body.user-scrolled .paralax {
        min-height: unset;
        contain-intrinsic-size: unset;
    }

    .speed-slider {
        min-height: 400px;
        contain-intrinsic-size: auto 400px;
    }

    body.user-scrolled .speed-slider {
        min-height: unset;
        contain-intrinsic-size: unset;
    }

    .home-slider-container {
        min-height: 250px;
    }

    body.user-scrolled .home-slider-container {
        min-height: unset;
    }

    .speed-slider .owl-carousel,
    .speed-slider .owl-wrapper-outer,
    .speed-slider .owl-wrapper {
        height: 400px;
    }

    body.user-scrolled .speed-slider .owl-carousel,
    body.user-scrolled .speed-slider .owl-wrapper-outer,
    body.user-scrolled .speed-slider .owl-wrapper {
        height: auto;
    }

    .footer-newsletter {
        min-height: 400px;
    }

    body.user-scrolled .footer-newsletter {
        min-height: unset;
    }
}

@media screen and (min-width: 991px) and (max-width: 1300px) {
    .paralax {
        min-height: 350px;
        contain-intrinsic-size: auto 350px;
    }

    body.user-scrolled .paralax {
        min-height: unset;
        contain-intrinsic-size: unset;
    }

    .speed-slider {
        min-height: 450px;
        contain-intrinsic-size: auto 450px;
    }

    body.user-scrolled .speed-slider {
        min-height: unset;
        contain-intrinsic-size: unset;
    }

    .speed-slider .owl-carousel,
    .speed-slider .owl-wrapper-outer,
    .speed-slider .owl-wrapper {
        height: 450px;
    }

    body.user-scrolled .speed-slider .owl-carousel,
    body.user-scrolled .speed-slider .owl-wrapper-outer,
    body.user-scrolled .speed-slider .owl-wrapper {
        height: auto;
    }
}