/* FONTS */
@import url('./style-custom-fonts.css');
@import url('./style-aos.min.css');

/* .language-switcher-wrapper,
.language-switcher{
    display: none !important; 
} */

html,body{
    font-family: 'Silka', 'Arial', sans-serif!important;
    overflow-x: hidden;
    margin-bottom: 0!important;
}

/* Header Styles */
.site-header {
    background-color: #fff;
    padding: 10px 0;
    transition: transform 0.3s ease, opacity 0.3s ease, box-shadow 0.3s ease;
}

.header-logo {
    max-height: 75px;
}

.sticky {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
    width: 100%;
    box-shadow: 0 2px 5px rgba(0,0,0,0.2);
}

/* Stato iniziale per l'animazione quando diventa sticky */
.sticky.sticky-entering {
    transform: translateY(-100%);
    opacity: 0;
}

/* Stato finale quando è completamente sticky */
.sticky:not(.sticky-entering):not(.sticky-exiting) {
    transform: translateY(0);
    opacity: 1;
}

/* Stato di uscita quando torna normale */
.sticky.sticky-exiting {
    transform: translateY(-100%);
    opacity: 0;
}

.btn-acquista {
    background-color: #008489!important;
    color: #fff!important;
    font-weight: 700 !important;
    padding: 10px 20px !important;
    text-decoration: none;
    display: inline-block;
    transition: all 0.3s ease;
    border-radius: 0!important;
    text-transform: uppercase;
    font-size: 14px !important;
}

.btn-acquista:hover {
    background-color: #00696d!important;
    color: #fff;
    text-decoration: none;
}

/* MENU */

/* Main Navigation */
.main-navigation {
    display: flex;
    justify-content: center;
}

.main-navigation ul.menu-wrapper {
    display: flex;
    list-style: none;
    justify-content: end;
    margin: 0;
    padding: 0;
}

.main-navigation ul.menu-wrapper li {
    margin: 0 25px;
}

.main-navigation ul.menu-wrapper li a {
    color: #000;
    text-decoration: none;
    font-weight: 900;
    /* text-transform: uppercase; */
    font-size: 16px;
    padding: 5px 0;
    position: relative;
    transition: all 0.3s ease;
}

.main-navigation ul.menu-wrapper li a:hover,
.main-navigation ul.menu-wrapper li.current-menu-item a {
    color: #008489;
}
.main-navigation ul ul{
    background-color: #008489;
    flex-direction: column;
    color: #fff;
    font-weight: 400;
    padding-top: 1rem;
    padding-bottom: 1rem;
}
.main-navigation ul ul li{
    margin: 0;
}

.main-navigation ul.menu-wrapper ul li a,
.main-navigation ul.menu-wrapper ul li.current-menu-item a {
    color: #fff !important;
    font-weight: 500;
}


.main-navigation ul.menu-wrapper ul li a:hover,
.main-navigation ul.menu-wrapper ul li.current-menu-item a {
    font-weight: 700;
}

/* Mobile menu */
.menu-toggle {
    background: transparent;
    border: none;
    color: #fff;
    font-size: 24px;
    cursor: pointer;
    padding: 0;
    margin-left: 10px;
    display: flex !important;
    align-items: center;
    justify-content: center;
}

.mobile-menu {
    display: none;
    background: #008489;
    padding: 15px;
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100vh;
    overflow-y: auto;
    z-index: 99999;
    transition: all 0.3s ease;
    /* transform: translateX(110%); */
}
.mobile-menu .mobile-menu-close{
    /* margin-left: auto; */
}

.mobile-menu.active {
    display: block;
    /* transform: translateX(0); */
}

.mobile-menu ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.mobile-menu ul li {
    margin: 10px 0;
}

.mobile-menu ul li a, .mobile-menu-buttons a {
    color: #fff;
    text-decoration: none;
    font-size: 18px;
    display: block;
    padding: 5px 0;
    text-align: center;
}
.mobile-menu-buttons .buy-now-link{
    color: #D9DF20;
    font-size: 20px;
}
.mobile-menu-buttons .buy-now-link.menu-toggle{
    margin-left: 0;
}
.mobile-language-switcher .language-switcher a{
    color: #fff !important;
    font-size: 18px;
}
/* Stili per il selettore lingue e la ricerca */

.language-switcher {
    list-style: none;
    display: flex;
    margin: 0;
    padding: 0;
}

.language-switcher li {
    margin: 0 5px;
}

.language-switcher li a {
    text-decoration: none;
    font-weight: 500;
    text-transform: uppercase;
    color: #333;
}

.language-switcher li a.active {
    font-weight: 700;
    color: #0056b3;
}


.footer-bottom .language-switcher li a{
    color: #008489 !important;
}
.footer-bottom .language-switcher .language-divider{
    color: #008489 !important;
}
.footer-top .language-switcher li a,
.footer-top .language-switcher .language-divider{
    color: #fff !important;
}
.footer-top .language-switcher li{
    margin-right: 5px;
}


.search-icon-wrapper a {
    color: #333;
    font-size: 1.2rem;
}

/* Removed old header-search-form styles - replaced with full-screen overlay */

.header-line{
    width: 100%;
    height: 28px;
    background-color: #008489;
}

/* Stile per i separatori delle lingue */
.language-switcher {
    list-style: none;
    padding: 0;
    margin: 0;
}

.language-switcher li {
    margin: 0;
    padding: 0;
}

.language-switcher li a {
    padding: 0 3px;
    text-decoration: none;
    font-weight: 500;
    text-transform: uppercase;
    color: #000!important;
}

.language-switcher li a.active {
    font-weight: 700;
}

.language-divider {
    color: #000;
    margin: 0 2px;
    font-size: 0.9em;
}

/* Footer Styles */
.site-footer {
    color: #fff;
    font-size: 14px;
}

.footer-top {
    background-color: #008489!important;
    padding: 100px 0 40px 0;
}

.footer-logo {
    max-width: 300px;
    margin-bottom: 20px;
}

.site-footer h4 {
    color: #fff;
    font-weight: 600;
    /* margin-bottom: 20px; */
    font-size: 14px;
}

.footer-menu ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-menu ul li {
    margin-bottom: 5px;
}

.footer-menu ul li a {
    color: #fff;
    text-decoration: none;
}

.footer-hero {
    background-color: #7fcccf;
    padding: 60px 0;
}

.footer-slogan {
    color: #008489;
    font-size: 103px;
    font-weight: 700;
    line-height: 102px;
}

.footer-bottom {
    background-color: #7fcccf;
    padding: 20px 0 40px;
    font-size: 14px;
}

.footer-links {
    list-style: none;
    padding: 0;
    margin: 0 0 15px;
    display: flex;
}

.footer-links li {
    margin-right: 15px;
}

.footer-links li a {
    color: #008489;
    text-decoration: none;
}
.copyright {
    color: #008489;
}

.language-switcher {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: flex-end;
}

.language-switcher li {
    margin-left: 15px;
}

.language-switcher li a {
    color: #008489;
    text-decoration: none;
    font-weight: 600;
}

.language-switcher li a.active {
    text-decoration: underline;
}

.shape-bianca-footer{
    position: relative;
    top: -90px;
    max-width: 250px;

}

.home-hero{
    background: var(--hero-bg-image, linear-gradient(211.49deg, var(--hero-bg-from, #FA4616) -0.32%, var(--hero-bg-to, #000000) 63.68%));
    margin-top: 5rem;
}

.home-hero .hero-content{
    position: relative;
    color: #fff;
    padding: 6rem 0 0 0;
    margin-top: 2rem;
}

.home-hero .hero-content .left-content{
    max-width: 400px;
}

.home-hero .hero-content .hero-pre-title{
    font-size: 31px;
    color: var(--hero-accent, #FA4616);
    font-weight: 700;
}

.home-hero .hero-content .hero-title{
    font-size: 51px;
    line-height: 55px;
    font-weight: 700;
}

.home-hero .hero-content .hero-subtitle{
    font-size: 26px;
    line-height: 24px;
    font-weight: 400;
}

/* Il sottotitolo arriva dall'editor visuale, che avvolge il testo in <p>. */
.home-hero .hero-content .hero-subtitle p{
    margin: 0;
    font-size: inherit;
    line-height: inherit;
    font-weight: inherit;
}
.home-hero .hero-content .hero-cta{
    width: 200px;
    height: 50px;
    background-color: var(--hero-accent, #FA4616);
    color: #fff;
    transition: all 0.3s ease;
    border: none;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    margin-top: 20px;
    text-decoration: none;
}

.home-hero .hero-content .hero-cta:hover{
    filter: brightness(0.85);
    color: #fff;
}

.home-hero .hero-banner-text{
    font-family: Silka;
    font-weight: 700;
    font-style: italic;
    text-transform: uppercase;
    /* font-size: 25rem;
    line-height: 18rem; */
    font-size: clamp(115px, calc(25vw + 1rem), 25rem);
    line-height: 0.7;
    letter-spacing: 0px;
    text-align: center;
    color: #fff;
    margin-top: 1rem;
    margin-bottom: 0;
}

.home-hero .hero-video-container{
    position: absolute;
    top: -3rem;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: end;
    /* overflow: hidden; */
    min-height: 30rem;
}
.home-hero .hero-video-container video,
.home-hero .hero-video-container .hero-media-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    clip-path: url('#boost-video-clip');
    -webkit-clip-path: url('#boost-video-clip');
}
.home-hero .hero-video-container video::-webkit-media-controls {
    display: none !important;
}
.home-hero .hero-video-container .hero-video-block {
    z-index: 1;
    transform: translate3d(8rem, 0, 0);
    -webkit-transform: translate3d(8rem, 0, 0);
    -ms-transform: translate3d(8rem, 0, 0);
    -o-transform: translate3d(8rem, 0, 0);

}
.home-hero .hero-video-container .hero-video-overlay {
    position: absolute;
    display: flex;
    align-items: center;
    height: 100%;
    top: 0;
    width: 100%;
    flex-direction: column;
    margin-top: 7rem;
    color: #fff;
    cursor: pointer;
}
.home-hero .hero-video-container .hero-video-overlay .hero-video-pre-title{
    font-weight: 600;
    font-size: 1.2rem;
}

.home-hero .hero-video-container .hero-video-overlay .hero-video-title{
    font-weight: 400;
    font-size: 3rem;
    line-height: 1;
}

.home-hero .hero-image-container{
    position: relative;
    /* bottom: -2rem; */
    /* left: 0; */
    width: 100%;
    display: flex;
    justify-content: center;
}
.home-hero .hero-image-container img{
    position: absolute;
    transform: translateY(-50%);
    width: 60rem;
    max-width: 100%;
    height: auto;
    /* Il packshot boost e su una tela larga 2:1 e cade a 478px di altezza; un
       packshot con meno margine trasparente arriverebbe a sconfinare sulla
       sezione sotto, quindi si limita l'altezza e si conserva il rapporto. */
    max-height: 30rem;
    object-fit: contain;
}

.home-product-section{
    background-color: #008C93;
    padding: 8rem 8rem 2rem 8rem;
}
.home-product-section .home-product-title,
.home-product-section .home-product-title-2{
    font-weight: 700;
    font-size: 3rem;
    line-height: 1;
    color: #fff;
}
.home-product-section .home-product-title-2{
    font-size: 3.5rem;
}
.home-product-section .home-product-description{
    font-weight: 400;
    font-size: 1.2rem;
    color: #fff;
}
.home-product-section .bottom-paragraph{
    margin-top: 5rem;
    padding: 0 4rem;
    font-weight: 400;
    font-size: 1.2rem;
    color: #fff;
}

.buy-restricted-modal .modal-dialog{
    max-width: 600px;
}
.buy-restricted-modal .modal-content{
    border-radius: 0;
    color: #008C93;
}
.buy-restricted-modal .modal-content .modal-body{
    padding: 2rem;
}
.buy-restricted-modal .modal-content .modal-content-text{
    padding-bottom: 2rem;
    text-align: center;
    font-size: 18px;
    font-weight: 500;
}
.buy-restricted-modal .buttons-container{
    display: flex;
    justify-content: space-between;
    gap: 1rem;
}
.buy-restricted-modal .buttons-container .btn{
    width: 100%;
    border: none;
    border-radius: 0;
    background-color: white;
    color: #008C93;
    font-weight: 700;
    border: 2px solid #008C93;
    text-transform: uppercase;
}
.buy-restricted-modal .buttons-container .btn.amazon-link{
    background-color: #008C93;
    color: #fff;
}
.boost-buy-restricted-modal .modal-content{
    color: white;
    background-color: #FA4616;
}
.boost-buy-restricted-modal .buttons-container .btn{
    border: none;
    background-color: #fff;
    color: black;
}
.boost-buy-restricted-modal .buttons-container .btn.amazon-link{
    background-color: #000;
    color: #fff;
}


.video-modal{
    backdrop-filter: blur(10px);
}
.video-modal .modal-dialog{
    max-width: 99%;
    max-height: 99%;
}
.video-modal .modal-dialog .modal-content{
    background-color: transparent;
    border: none;
}
.video-modal .modal-dialog .modal-content .modal-body{
    padding: 0;
    background-color: black;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    position: relative;
    display: flex;
    width: 100%;
    margin: 0 auto;
}
.video-modal .modal-dialog .modal-content .modal-body video{
    width: 100%;
    max-height: 90vh;
    object-fit: contain;
}
.video-modal .modal-dialog .modal-content .modal-body .actions{
    position: absolute;
    bottom: 10px;
    right: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.video-modal .modal-dialog .modal-content .modal-body .actions button{
    background-color: transparent;
    color: #fff;
    font-weight: 500;
    font-size: 0.875rem;
    border: none;
    text-transform: uppercase;
    cursor: pointer;
    text-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}
.video-modal .modal-dialog .modal-content .modal-body .actions button:hover{
    color: #008489;
}
.video-modal .modal-dialog .modal-content .modal-body .actions svg{
    height: 1rem;
    width: 1rem;
}

.home-boost-video-modal .btn-close{
    position: absolute;
    top: -15px;
    right: -15px;
    background-color: #ffffff;
    border: none;
    font-size: 1rem;
    cursor: pointer;
    z-index: 999;
    opacity: 1;
    border-radius: 1rem;
    padding: 0.5rem;
}
.home-boost-video-modal .modal-content{
    background-color: #ffffff;
}
.home-boost-video-modal .modal-body{
    padding: 10px 10px 4px 10px;
}
.home-boost-video-modal .modal-body video{
    width: 100%;
    height: 100%;
    border-radius: 0.5rem;
}

.home-product-section .home-product-container{
    margin-top: 5rem;
    color: #fff;
}
.home-product-section .home-product-box{
    padding: 0 3rem;
}
.home-product-section .home-product-box .home-product-box-image{
}
.home-product-section .home-product-box .home-product-box-title{
    font-weight: 700;
    font-size: 2rem;
}
.home-product-section .home-product-box .home-product-box-subtitle{
    font-weight: 400;
    font-size: 1.2rem;
}
.home-product-section .home-product-box .home-product-box-button{
    color: #fff;
    font-weight: 700;
    font-size: 0.875rem;
    text-decoration: none;
}
.home-product-section .home-product-box .home-product-box-button:hover{
    color: #fff;
    text-decoration: none;
}
.home-product-section-without-boost{
    position: relative;
}
/* Content above the decorative corner shapes; shapes never catch clicks */
.home-product-section-without-boost .container{
    position: relative;
    z-index: 1;
}
.home-product-section-without-boost .home-product-container{
    margin-top: 0;
}
.home-product-section-without-boost .home-product-box{
    padding: 0;
}
.home-product-section-without-boost .home-product-box .home-product-box-boosted-text{
    color: #FA4616;
    font-size: 1rem;
    font-weight: 700;
    text-transform: uppercase;
}
.home-product-section-without-boost .home-product-box .home-product-box-title{
    font-weight: 700;
    font-size: 2rem;
    line-height: 1;
    margin-bottom: 0.5rem;
}
.home-product-section-without-boost .home-product-box .home-product-box-title-variant{
    display: block;
    margin-top: 0.25rem;
    text-transform: uppercase;
    font-style: italic;
}
.home-product-section-without-boost .home-product-box .home-product-box-subtitle{
    font-weight: 400;
    font-size: 1.2rem;
}
.home-product-section-without-boost .home-product-box .home-product-box-button{
    color: #fff;
    font-weight: 700;
    font-size: 0.875rem;
    text-decoration: none;
}
.home-product-section-without-boost .shape-svg{
    color: white;
    pointer-events: none;
    z-index: 0;
}
.home-product-section-without-boost .shape-svg-small{
    position: absolute;
    top: 3rem;
    right: 4%;
}
.home-product-section-without-boost .shape-svg-large{
    position: absolute;
    top: auto;
    bottom: 10rem;
    left: 2%;
}

/* Home hero products row / carousel */
.home-product-section-without-boost .home-product-title-2{
    text-align: center;
    margin-bottom: 4rem;
    padding-right: 0;
    line-height: 1.15;
}
.hero-products-swiper{
    overflow: hidden;
    width: 100%;
}
.hero-products-swiper .swiper-wrapper{
    align-items: stretch;
}
.hero-products-swiper .swiper-slide{
    height: auto;
    text-align: left;
}
/* Swiper drops its inline slide widths on destroy, so the static row sizes itself.
   Centred so a part-full row (3 products in 4 columns) is not left-hugging. */
.hero-products-swiper:not(.swiper-initialized) .swiper-wrapper{
    display: flex;
    justify-content: center;
    gap: 24px;
}
.hero-products-swiper:not(.swiper-initialized) .swiper-slide{
    flex: 0 0 calc((100% - 72px) / 4);
    max-width: calc((100% - 72px) / 4);
}
.hero-products-swiper .home-product-box{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    height: 100%;
}
/* Badge and product name are bottom-aligned as a pair, with room for a badge plus
   two lines of name. A one-line name ("Apportal®") then drops level with a two-line
   one ("Apportal® Vital"), and the badge stays tight above its own name. */
.hero-products-swiper .home-product-box-heading{
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 6.4rem;
    width: 100%;
}
.home-product-section-without-boost .hero-products-swiper .home-product-box-title{
    width: 100%;
    margin-bottom: 0;
}
/* Packshots share a bottom baseline whatever their proportions, and the subtext
   and link below stay level across the row. */
.home-product-section-without-boost .hero-products-swiper .home-product-box-image{
    flex: 1 1 auto;
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    width: 100%;
    margin: 0;
}
.hero-products-swiper .home-product-box-image img{
    max-width: 100%;
    height: auto;
    object-fit: contain;
}
/* The "in primo piano" packshot is enlarged by real width rather than a paint-only
   transform, so it occupies the space it needs and can never overlap the name
   above it. It bleeds into the gutter, as in the design. */
.home-product-section-without-boost .hero-products-swiper .home-product-boosted .home-product-box-image img{
    width: 112%;
    max-width: 112%;
}
/* Two lines reserved so a short subtext does not lift that card's packshot off
   the shared baseline. Longer subtexts still grow the block. */
.hero-products-swiper .home-product-box-subtitle{
    margin-top: 1rem;
    width: 100%;
    line-height: 1.4;
    min-height: 2.8em;
}
.hero-products-swiper .home-product-box-button{
    margin-top: 1rem;
}
/* Reserved so every product title sits on the same baseline, badge or not */
.home-product-section-without-boost .home-product-box .home-product-box-boosted-text.is-hidden{
    visibility: hidden;
}
@media only screen and (max-width : 1199px) {
    .hero-products-swiper:not(.swiper-initialized) .swiper-slide{
        flex-basis: calc((100% - 24px) / 2);
        max-width: calc((100% - 24px) / 2);
    }
}
@media only screen and (max-width : 767px) {
    .hero-products-swiper:not(.swiper-initialized) .swiper-wrapper{
        gap: 0;
    }
    .hero-products-swiper:not(.swiper-initialized) .swiper-slide{
        flex-basis: 100%;
        max-width: 100%;
    }
    /* Keep the left alignment on mobile too — the generic .home-product-section
       rules further down the file centre the cards. */
    .home-product-section-without-boost .hero-products-swiper .home-product-box{
        text-align: left;
        margin-bottom: 0;
    }
    /* Names drop to 25px on mobile, so the reserved heading area shrinks with them */
    .hero-products-swiper .home-product-box-heading{
        min-height: 4.4rem;
    }
    /* One card at a time, so there is no row to bottom-align against — let the card
       stack compactly instead of the packshot absorbing the leftover height. */
    .home-product-section-without-boost .hero-products-swiper .home-product-box-image{
        flex: 0 0 auto;
    }
    /* Neutralise the pre-carousel overlap offsets inside the slides.
       The generic .home-product-section rules sit further down the file, so these
       need the extra class to win the cascade rather than rely on order. */
    .home-product-section-without-boost .hero-products-swiper .home-product-box .home-product-box-title{
        margin-top: 0;
    }
    .home-product-section-without-boost .hero-products-swiper .home-product-box .home-product-box-subtitle{
        margin-top: 1rem;
    }
    .hero-products-swiper .home-product-box{
        margin-bottom: 2rem;
    }
}

.home-product-block{
    padding-top: 3rem;
    padding-bottom: 3rem;
}
.home-product-block .container{
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    z-index: 0;
}
.home-product-block .intro-text{
    font-weight: 400;
    font-size: 2rem;
    color: #fff;
    text-align: center;
}
.home-product-block .background-text-top,
.home-product-block .background-text-bottom{
    font-family: Silka;
    font-weight: 700;
    /* font-style: italic; */
    font-size: 10rem;
    line-height: 12rem;
    letter-spacing: 0px;
    text-align: center;
    color: #fff;
    margin-top: 1rem;
    width: 100%;
    margin-bottom: 12rem;
    padding: 0 2rem;
}
.home-product-block .background-text-bottom{
    margin-bottom: 15rem;
}
.home-product-block .product-center-image{
    position: absolute;
    left: 40%;
    transform: translateX(-40%);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1;
}
.home-product-block .product-center-image img{
    max-width: 200px;
    width: 100%;
    height: auto;
    z-index: 1;
}
.home-product-block .product-bottom{
    position: absolute;
    bottom: -5rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
}
.home-product-block .product-bottom .row{
    /* width: 60%; */
}
.home-product-block .product-bottom .product-logo img{
    max-height: 75px;
    margin-bottom: 20px;
}
.home-product-block .product-bottom .product-box-image{
    text-align: right;
    display: flex;
    justify-content: end;
    align-items: end;
    margin-top: 0.5rem;
    height: 100%;
}
.home-product-block .product-bottom .product-box-image-mobile{
    display: none;
}
.home-product-block .product-bottom .product-box-image img,
.home-product-block .product-bottom .product-box-image-mobile img{
    max-width: 200px;
    width: 100%;
}
.home-product-block .product-bottom .product-description{
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 1rem;
    padding-right: 1rem;
}
.home-product-block .product-bottom .product-description .product-description-content{
    color: #fff;
    font-weight: 400;
    font-size: 19px;
    line-height: 1.15;
}
.home-product-block .product-bottom .product-description .product-description-content small{
    font-size: 13px;
    display: inline-flex;
}
.home-product-block .product-bottom .product-description .product-description-content strong{
    font-weight: 700;
}
.home-product-block .product-bottom .product-button{
    color: #fff;
    font-weight: 700;
    font-size: 0.875rem;
    text-decoration: none;
    padding: 1rem 2rem;
    margin-top: 1rem;
}

.home-product-block .shape-svg{
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: -1;
}
.home-product-block .shape-svg svg{
    width: 15rem;
}
.home-product-block .shape-svg-small svg{
    width: 4rem;
    height: auto;
}

.home-when-to-use{
    background-color: #DBEFF0;
    padding: 8rem 2rem 0 2rem;
    color: #008C93;
}
.home-when-to-use .row{
    /* padding: 0 10rem; */
}

.home-when-to-use .title{
    font-weight: 700;
    font-size: 67px;
}
.home-when-to-use .shape-img{
    color: #008C93;
    position: absolute;
    width: 24rem;
    right: 12rem;
    margin-top: 3rem;
}
.home-when-to-use .when-to-use-item{
    padding: 1.5rem 0;
    border-bottom: 1px solid #008C93;
}
.home-when-to-use .when-to-use-item:last-of-type{
    border-bottom: none;
}
.home-when-to-use .when-to-use-item .title{
    font-weight: 700;
    font-size: 2rem;
}
.home-when-to-use .when-to-use-item .description{
    font-weight: 400;
    font-size: 1rem;
    margin-bottom: 1rem;
}
.home-when-to-use .when-to-use-item .icon-image img{
    width: 2rem;
    height: auto;
    margin-top: 1rem;
}
.home-when-to-use .when-to-use-item a{
    font-weight: 700;
    font-size: 0.875rem;
    text-decoration: none;
    color: #008C93;
    margin-bottom: 1rem;
}

.home-sucrosomial-technology{
    background-color: #008C93;
    padding: 5rem 2rem 0 2rem;
    color: #fff;
    font-size: 20px;
}
.home-sucrosomial-technology .title{
    font-weight: 700;
    font-size: 67px;
}

.home-sucrosomial-technology .sucrosomial-technology-link{
    font-weight: 700;
    font-size: 1.2rem;
    text-decoration: none;
    color: #fff;
    margin-bottom: 1rem;
}

.home-sucrosomial-technology .sucrosomial-technology-image{
    padding: 0.5rem;
    margin-top: 1rem;
}
.home-sucrosomial-technology .sucrosomial-technology-bottom-text{
    margin-bottom: -10px;
    font-size: 115px;
    font-weight: 700;
    line-height: 0.9;
    position: relative!important;
    top: 12px!important; 
}


.home-comparison-box{
    text-align: center;
    padding-top: 5rem;
}
.home-comparison-box .comparison-title{
    font-size: 67px;
    line-height: 1;
    font-weight: 700;
    color: #008C93;
    margin-bottom: 5rem;
}
.home-comparison-box .comparison-products-container{
    display: flex;
    justify-content: center;
    overflow-x: auto;
    overflow-y: hidden;
}
.home-comparison-box .comparison-products-container .comparison-product-section{
    min-width: 300px;
    width: 33.33%;
}
.home-comparison-box .comparison-products-container .comparison-product{
    display: flex;
    flex-direction: column;
    height: 18rem;
    justify-content: space-between;
    padding: 1rem;
    margin-bottom: 1rem;
}
.home-comparison-box .comparison-products-container .comparison-product .comparison-product-image{
    max-height: 10rem;
    height: auto;
    margin: 0 auto;
}
.home-comparison-box .comparison-products-container .comparison-product .comparison-product-name a{
    font-size: 25px;
    font-weight: 700;
    color: #008C93;
    text-decoration: none;
}
.home-comparison-box .comparison-products-container .comparison-box{
    padding: 2rem;
    height: 100%;
}
.home-comparison-box .comparison-products-container .comparison-feature {
    padding: 1rem;
    color: white;
}
.home-comparison-box .comparison-products-container .comparison-feature .feature-title{
    font-size: 21px;
    font-weight: 700;
}
.home-comparison-box .comparison-products-container .comparison-feature .feature-description{
    font-size: 14px;
}

.product-hero{
    position: relative;
}

.product-hero .hero-image img{
    width: 100%;
    height: auto;
    max-height: 30rem;
    object-fit: cover;
}
.product-hero .hero-content{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 1rem;
    display: flex;
    flex-direction: column;
    justify-content: end;
    align-items: center;
    color: #fff;
}
.product-hero .hero-content .container{
    max-width: 1024px;
}
.product-hero .hero-content .hero-title{
    font-size: 3rem;
    font-weight: 700;
}
.product-hero .hero-content .hero-description{
    font-size: 1.2rem;
    font-weight: 400;
}
.product-hero .hero-video-container {
    position: relative;
    width: 100%;
    height: 50vh;
}
.product-hero .hero-video {
    width: 100vw;
    max-height: 50vh;
    object-fit: cover;
}
.product-hero .hero-video-text {
    position: absolute;
    top: 0;
    width: 100%;
    height: 75%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: white;
    text-align: center;
    z-index: 1;
}
.product-hero .hero-video-text-1 {
    font-size: 20px;
    font-weight: 400;
    line-height: 1;
}
.product-hero .hero-video-text-2 {
    font-size: 23px;
    line-height: 1;
}
.product-hero .hero-video-text p{
    margin-bottom: 0.5rem;
}
.product-hero .play-button img{
    cursor: pointer;
}
.product-sub-hero {
    padding: 2rem 0;
}
.product-sub-hero .product-sub-hero-image{
    position: relative;
    height: 100%;
    display: flex;
    justify-content: end;
}
.product-sub-hero .product-sub-hero-image img{
    position: absolute;
    max-width: 10rem;
    bottom: 0;
}
.product-sub-hero .product-sub-hero-button{
    padding: 1rem 2rem;
    color: #fff;
    text-transform: uppercase;
    text-decoration: none;
    font-weight: 600;
}

.product-sub-hero .characteristics-container{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 2rem;
    margin-bottom: 1rem;
}
.product-sub-hero .characteristics-container .characteristic-item{
    display: flex;
    gap: 0.5rem;
    align-items: center;
    justify-content: center;
}
.product-sub-hero .characteristics-container .characteristic-item img{
    max-width: 2rem;
    height: auto;
}
.product-sub-hero .characteristics-container .characteristic-item .characteristic-text{
    color: #fff;
    font-weight: 600;
    font-size: 1rem;
    line-height: 1;
}
.product-sub-hero-modal .modal-dialog{
    max-width: 600px;
}
.product-sub-hero-modal .modal-content{
    border-radius: 0;
    color: #fff;
}
.product-sub-hero-modal .modal-content .modal-body{
    padding: 2rem;
}
.product-sub-hero-modal .modal-content .modal-content-text{
    padding-bottom: 2rem;
    text-align: center;
    font-size: 18px;
    font-weight: 500;
}
.product-sub-hero-modal .buttons-container{
    display: flex;
    justify-content: space-between;
    gap: 1rem;
}
.product-sub-hero-modal .buttons-container .btn{
    width: 100%;
    border: none;
    border-radius: 0;
    color: white;
    font-weight: 700;
    text-transform: uppercase;
}

.product-lateral-banner{
    position: fixed;
    top: 70%;
    right: 0;
    transform: translateY(-50%);
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    z-index: 1000;
    color: #fff;
    font-weight: 700;
    max-width: 180px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}
.product-lateral-banner .banner-text,
.product-lateral-banner .banner-text-mobile{
    font-size: 20px;
}
.product-lateral-banner .banner-text-mobile{
    display: none;
}

.product-lateral-banner .social-icons{
    display: flex;
    gap: 1rem;
    align-items: center;
    margin-top: 1rem;
}

.product-lateral-banner .social-icons.no-text{
    flex-direction: column;
}

.product-lateral-banner .social-icons a{
    color: #fff;
    font-size: 28px;
    text-decoration: none;
}

.product-page-info{
    padding: 3rem 0;
    color: #fff;
}
.product-page-info .info-left-content{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
}
.product-page-info .title{
    padding: 0 6rem;
}
.product-page-info .title h1{
    font-weight: 700;
    font-size: 5rem;
    line-height: 1;
}
.product-page-info .product-info-description{
    font-size: 2rem;
}
.product-page-info .product-info-description-2{
    font-size: 1.8rem;
}
.product-page-info .product-info-image{
    position: relative;
    height: 100%;
    width: 100%;
    margin-top: auto;
    min-height: 15rem;
}
.product-page-info .product-info-image img{
    position: absolute;
    bottom: -15rem;
    width: 100%;
    height: auto;
}
.product-page-info-bottom-box{
    height: 8rem;
}
.product-page-info-bottom-box .product-info-image-mobile{
    display: none;
}

.product-page-bottle-info{
    color: #fff;
    padding: 5rem 0;
    position: relative;
}
.product-page-bottle-info .product-bottle-info-pretitle{
    font-weight: 700;
    font-size: 26px;
    line-height: 0.5;
    margin-bottom: 0;
}
.product-page-bottle-info .product-bottle-info-title{
    font-weight: 700;
    font-size: 67px;
    margin-bottom: 0;
}
.product-page-bottle-info .product-bottle-info-subtitle{
    font-weight: 700;
    font-size: 25px;
    font-style: italic;
}
.product-page-bottle-info .product-bottle-info-description{
    font-weight: 700;
    font-size: 16px;
    line-height: 1;
}
.product-page-bottle-info .product-bottle-info-content{
    font-weight: 400;
    font-size: 14px;
}
.product-page-bottle-info .product-bottle-info-features{
    font-weight: 700;
    font-size: 16px;
}
.product-page-bottle-info .product-bottle-info-tagline, .product-page-bottle-info .product-bottle-info-tagline p{
    font-weight: 700;
    font-size: 16px;
    margin-top: 1rem;
    margin-bottom: 1rem;
}
.product-page-bottle-info .product-bottle-info-button{
    display: inline-flex;
    justify-content: center;
    align-items: center;
    padding: 0.75rem 2rem;
    color: #fff;
    gap: 8px;
    text-decoration: none;
}
.product-page-bottle-info .product-bottle-info-button svg{
    height: 30px;
    margin-top:11px;
}
.product-page-bottle-info .product-bottle-info-image{
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}
.product-page-bottle-info .product-bottle-info-image .shape-svg{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
}   
.product-page-bottle-info .product-bottle-info-image .shadow-svg{
    position: absolute;
    bottom: -12%;
    left: 50%;
}
.product-page-bottle-info .product-bottle-info-image .bottle-image-wrapper{
    transform: rotate(-26deg);
    scale: 1.2;
}
.product-page-bottle-info .product-bottle-info-image img{
    height: 367px;
    width: 367px;
    object-fit: cover;
}

.product-info-blocks{
    /* padding-top: 8rem; */
    background-color: #fff;
}
.product-info-blocks .image-content{
    padding: 0;
}
.product-info-blocks .image-content img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.product-info-blocks .text-content{
    padding: 2rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.product-info-blocks .text-content .title{
    font-weight: 400;
    font-size: 2rem;
}
.product-info-blocks .text-content .description{
    font-weight: 400;
    font-size: 1.2rem;
    line-height: 1.5;
}
.product-info-blocks .text-content .description p{
    margin-bottom: 0.5rem;
}
.product-info-blocks .text-content .description h1,
.product-info-blocks .text-content .description h2,
.product-info-blocks .text-content .description h3,
.product-info-blocks .text-content .description h4,
.product-info-blocks .text-content .description h5,
.product-info-blocks .text-content .description h6{
    font-weight: 700;
    margin-bottom: 0.5rem;
    margin-top: 0.5rem;
}

.product-marquee {
    overflow: hidden;
    white-space: nowrap;
    position: relative;
    padding: 1rem 0 0.5rem 0;
}

.marquee-wrapper {
    display: flex;
    width: fit-content;
    animation: marqueeScroll 10s linear infinite;
}

.marquee-content {
    display: flex;
    flex-shrink: 0;
}

.product-marquee-item {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: end;
    padding: 0 4rem;
    flex-shrink: 0;
    color: #fff;
}

.product-marquee-item .title {
    font-weight: 700;
    font-size: 6rem;
    padding: 0;
    line-height: 1;
}
.product-marquee-item .subtitle {
    font-size: 1.2rem;
    text-align: right;
}

.product-sucrosomial-technology{
    padding: 3rem 2rem 3px 2rem;
    color: #fff;
    font-size: 1.2rem;
}
.product-sucrosomial-technology .title{
    font-weight: 700;
    font-size: 3rem;
    white-space: pre-line;
}

.product-sucrosomial-technology .sucrosomial-technology-link{
    font-weight: 700;
    /* font-size: 1rem; */
    text-decoration: none;
    color: #fff;
    margin-bottom: 1.2rem;
}

.product-sucrosomial-technology .sucrosomial-technology-image{
    padding: 0.5rem;
    margin-top: 1rem;
}
.product-sucrosomial-technology .sucrosomial-technology-bottom-text{
    margin-bottom: -15px;
    font-size: 115px;
    font-weight: 700;
    line-height: 0.9;
    padding-right: 2rem;
}
.product-sucrosomial-technology .sucrosomial-technology-image-desktop img{
    max-width: 80rem;
    height: auto;
    width: 100%;
}
.product-sucrosomial-technology .sucrosomial-technology-image-desktop,
.product-sucrosomial-technology .sucrosomial-technology-image-mobile{
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 2rem;
    margin-bottom: 2rem;
}

.product-how-it-work{
    padding: 3rem 2rem;
    position: relative;
    color: #fff;
}
.product-how-it-work .shape-small-svg{
    position: absolute;
    left: 10%;
    top: 8%;
}
.product-how-it-work .download-btn{
    padding: 1rem;
    color: #fff;
    text-transform: uppercase;
    text-decoration: none;
    font-weight: 600;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 2rem;
    margin-bottom: 5rem;
}
.product-how-it-work .download-btn .button-icon{
    font-size: 0.8rem;
    font-weight: 400;
}
.product-how-it-work .left-content .title{
    font-weight: 700;
    font-size: 75px;
}
.product-how-it-work .left-content .description{
    font-size: 22px;
}
.product-how-it-work .left-content{
    padding: 0 4rem;
}
.product-how-it-work .left-content .shape-image{
    display: flex;
    justify-content: center;
}
.product-how-it-work .right-content .shape-image-mobile{
    display: none;
}
.product-how-it-work .left-content .shape-image svg{
    width: 20rem;
    height: auto;
}
.product-how-it-work .right-content .step{
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 1rem;
    border: none;
    border-bottom: 1px solid;
    padding: 1rem 0;
}
.product-how-it-work .right-content .step:last-child{
    border-bottom: none;
}

.product-how-it-work .right-content .step .step-title{
    font-weight: 700;
    font-size: 43px;
    margin-bottom: 0;
}
.product-how-it-work .right-content .step .step-description-lg{
    font-size: 32px;
}

.product-how-it-work .right-content .step .step-number{
    font-weight: 700;
    font-size: 3rem;
}

.product-social-banner{
    padding: 3rem 2rem;
    color: #fff;
}

.product-social-banner .social-banner-title{
    font-weight: 700;
    font-size: 75px;
    margin-bottom: 0;
}
.product-social-banner .social-banner-description{
    font-size: 30px;
    font-weight: 400;
}
.product-social-banner .social-label{
    font-size: 30px;
    margin-top: 2rem;
}
.product-social-banner .social-icons{
    display: flex;
    gap: 0.5rem;
    flex-direction: column  ;
}
.product-social-banner .social-icons a{
    display: flex;
    gap: 1rem;
    align-items: end;
    text-decoration: none;
    color: #fff;
    font-size: 20px;
    margin-bottom: 10px;
}
.product-social-banner .social-icons a i{
    font-size: 36px;
    width: 36px;
}
.product-social-banner .banner-image-content{
    display: flex;
    justify-content: center;
    align-items: center;
}


.product-related-products{
    padding: 5rem;
    color: #008C93;
}
.product-related-products .container-fluid{
    max-width: 1600px;
}
.product-related-products .title{
    font-weight: 700;
    font-size: 75px;
}
.product-related-products .description{
    font-size: 20px;
}
.product-related-products .related-products{
    margin-top: 5rem;
}
.product-related-products .related-products .product-item {
    text-align: center; 
}
.product-related-products .related-products .product-item .product-image{
    height: 15rem;
}
.product-related-products .related-products .product-item .product-image img{
    width: 100%;
    height: auto;
    object-fit: contain;
    max-height: 17rem;
}
.product-related-products .related-products .product-item .product-title{
    font-weight: 700;
    font-size: 2rem;
    text-align: center;
}
.product-related-products .related-products .product-item .product-text{
    /* font-weight: 700; */
    font-size: 16px;
    text-align: center;
}
.product-related-products .related-products .product-item .product-text strong{
    font-weight: 600;
}
.product-related-products .related-products .product-item .button{
    margin-top: 2rem;
}
.product-related-products .related-products .product-item .product-button{
    color: #fff;
    font-weight: 700;
    font-size: 0.875rem;
    text-decoration: none;
    padding: 1rem 2rem;
    background-color: #008C93;
    text-transform: uppercase;
}

.technology-hero-section{
    background-color: #008C93;
    color: #FFF;
    padding: 3rem 0;
}
.technology-hero-section .hero-title{
    font-weight: 700;
    font-size: 67px;
    padding: 0 2rem;
}
.technology-hero-section .hero-content{
    /* font-size: 1.2rem; */
}
.technology-hero-section .shape-image-mobile{
    color: #008C93;
}
.technology-hero-section .shape-image-mobile svg{
    width: 16rem;
    height: auto;
}

.technology-about-sucrosoma{
    display: flex;
    justify-content: center;
    /* align-items: center; */
}
.technology-about-sucrosoma .left-content{
    padding-top: 5rem;
    padding-bottom: 5rem;
    padding-right: 0;
    width: 100%;
    background-color: #008C93;
    color: #fff;
}
.technology-about-sucrosoma .left-content .container{
    max-width: 670px;
    margin-right: 0;
    padding-right: 2rem;
}

.technology-about-sucrosoma .left-content .title{
    font-weight: 700;
    font-size: 5rem;
    line-height: 1;
}
.technology-about-sucrosoma .left-content .content{
    font-weight: 400;
    font-size: 1.2rem;
    margin-top: 2rem;
    white-space: pre-line;
}
.technology-about-sucrosoma .left-content .image{
    margin-bottom: 0.5rem;
    margin-top: 2rem;
}

.technology-about-sucrosoma .left-content .image img{
    max-width: 30rem;
    height: auto;
    width: 100%;
}
.technology-about-sucrosoma .right-content{
    /* padding: 5rem 10rem 5rem 2rem; */
    padding-top: 5rem;
    padding-bottom: 5rem;
    padding-left: 0;
    width: 100%;
    color: #008C93;
}
.technology-about-sucrosoma .right-content .container{
    max-width: 670px;
    margin-left: 0;
    padding-left: 2rem;
}
.technology-about-sucrosoma .right-content .title{
    font-weight: 700;
    font-size: 5rem;
    line-height: 1;
}
.technology-about-sucrosoma .right-content .content{
    font-weight: 400;
    font-size: 1.2rem;
    margin-top: 2rem;
    white-space: pre-line;
}

.shape-ul ul {
  list-style: none;
  /* padding-left: 1.5em; */
  padding: 0;
  margin: 0;
}

.shape-ul ul li {
  position: relative;
  padding-left: 1.5em; /* space for SVG */
}

.shape-ul ul li::before {
  content: "";
  position: absolute;
  top: 0.4em; /* adjust as needed */
  left: 0;
  width: 13px;
  height: 11px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='13' height='11' viewBox='0 0 13 11' fill='none'><path fill-rule='evenodd' clip-rule='evenodd' d='M5.85296 6.9783V10.2289L7.48681 10.2316H12.4307V0.352173H4.26027L0 6.9783H5.85296Z' fill='%23008C93'/></svg>");
  background-repeat: no-repeat;
  background-size: contain;
  display: block;
}

.technology-why-effective{
    padding: 5rem;
    color: #008C93;
    background-color: #EDF4F3;
}
.technology-why-effective .title{
    font-weight: 700;
    font-size: 55px;
}
.technology-why-effective .content{
    font-weight: 400;
    font-size: 1.2rem;
    margin-top: 2rem;
    white-space: pre-line;
}
.technology-why-effective .image{
    display: flex;
    justify-content: end;
}
.technology-why-effective .image img{
    clip-path: url('#technology-why-effective-shape');
    max-width: 30rem;
}

.technology-innovation-science{
    background-color: #008C93;
    padding: 3rem 5rem;
    color: #fff;
}
.technology-innovation-science .left-content,
.technology-innovation-science .right-content{
    /* padding: 0 2rem; */
}

.technology-innovation-science .title{
    font-weight: 700;
    font-size: 4rem;
    line-height: 1;
}

.technology-innovation-science .left-content .content{
    font-weight: 400;
    font-size: 1.5rem;
    margin-top: 2rem;
    white-space: pre-line;
}

.technology-innovation-science .right-content{
    font-weight: 400;
    font-size: 1rem;
    white-space: pre-line;    
}
.technology-innovation-science .right-content a{
    color: #fff;
    font-weight: 700;
}
.technology-innovation-science .advantages-block{
    margin-top: 4rem;
}
.technology-innovation-science .advantages-block .advantages-title{
    font-weight: 600;
    font-size: 2.5rem;
    margin-bottom: 2rem;
}
.advantages-block .advantage-item{
    margin-bottom: 1rem;
}
.advantages-block .advantage-item img{
    max-height: 3rem;
    width: auto;
}
.advantages-block .advantage-item .title{
    font-weight: 700;
    font-size: 1.5rem;
    margin-top: 10px;
}
.advantages-block .advantage-item .description{
    font-weight: 400;
    font-size: 1.2rem;
}

.technology-at-service{
}
.technology-at-service .left-content{
    display: flex;
    justify-content: end;
    align-items: center;
}
.technology-at-service .left-content .image{
    width: 100%;
}
.technology-at-service .left-content .image img{
    clip-path: url('#technology-at-service-shape');
    /* max-width: 30rem; */
    width: 100%;
    height: auto;
    object-fit: cover;
}
.technology-at-service .right-content{
    padding: 5rem 0;
    color: #008C93;
}
.technology-at-service .right-content .title{
    font-weight: 700;
    font-size: 3rem;
    line-height: 1;
}
.technology-at-service .right-content .content{
    font-weight: 400;
    font-size: 1rem;
    margin-top: 2rem;
}
.technology-at-service .right-content a{
    color: #008C93;
    font-weight: 700;
}
.technology-at-service .right-content .at-service-link{
    font-weight: 700;
    font-size: 1rem;
    text-decoration: none;
    margin-bottom: 1.2rem;
    color: #008C93;
}

.technology-comparison{
    padding: 5rem;
    background-color: #EFF5F4;
    color: #008C93;
    text-align: center;
}
.technology-comparison .title{
    font-weight: 700;
    font-size: 2.5rem;
    padding: 0 2rem;
}
.technology-comparison .subtitle{
    font-weight: 600;
    font-size: 1.2rem;
    margin-top: 0 2rem;
}

.technology-comparison .comparisons-list{
    margin-top: 3rem;
}
.technology-comparison .comparisons-list .comparison-item{
    margin-bottom: 2rem;
}
.technology-comparison .comparisons-list .comparison-item img{
    max-width: 5rem;
    max-height: 4rem;
    height: 4rem;
    width: auto;
}
.technology-comparison .comparisons-list .comparison-item .title{
    font-weight: 700;
    font-size: 1.5rem;
    margin-top: 10px;
    margin-bottom: 1rem;
}
.technology-comparison .comparisons-list .comparison-item .apportal-content .apportal-label,
.technology-comparison .comparisons-list .comparison-item .others-content .others-label{
    font-weight: 600;
    font-size: 1.2rem;
    margin-top: 1rem;
}
.technology-comparison .comparisons-list .comparison-item .description{
    font-size: 0.875rem;
}
.technology-comparison .comparisons-list .comparison-item .apportal-content{
    border-right: 1px solid #BEE0E1;
}

.technology-applications{
    padding: 5rem;
    background-color: #008C93;
    color: #fff;
}
.technology-applications .title{
    font-weight: 700;
    font-size: 4rem;
}
.technology-applications .subtitle{
    font-weight: 400;
    font-size: 2rem;
    margin-top: 1.5rem;
}
.technology-applications .left-content{
    padding-left: 5rem;
}
.technology-applications .left-content .content{
    font-size: 1.2rem;
    margin-top: 1.5rem;
    margin-bottom: 2rem;
}
.technology-applications .right-content{
    padding-right: 5rem;
    font-size: 1.2rem;
}
.technology-applications .right-content a{
    color: #fff;
    font-weight: 700;
    text-decoration: none;
}
.technology-applications .applications-link{
    background-color: #fff;
    color: #008C93;
    padding: 1rem 2rem;
    text-decoration: none;
    font-weight: 700;
    text-transform: uppercase;
}
.technology-applications .applications-link:hover{
    background-color: #008C93;
    color: #fff;
}

.technology-cta{
    position: relative;
    padding: 5rem;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 30rem;
}
.technology-cta .color-overlay{
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background-color: #008C93;
    opacity: 0.5;
    z-index: 1;
}
.technology-cta .content{
    position: relative;
    z-index: 2;
    color: #fff;
    display: flex;
    flex-direction: column; 
    justify-content: center;
    align-items: center;
}
.technology-cta .content .title{
    font-weight: 600;
    font-size: 4rem;
    white-space: pre-line;
    line-height: 1;
    margin-bottom: 2rem;
}
.technology-cta .content .cta-link{
    text-decoration: none;
    color: #fff;
    font-weight: 500;
    font-size: 1.2rem;
}

.technology-faqs{
    padding: 5rem;
    color: #008C93;
}
.technology-faqs .title{
    font-weight: 700;
    font-size: 4rem;
}
.technology-faqs .subtitle{
    font-weight: 400;
    font-size: 1.2rem;
    margin-bottom: 3rem;
}
.faq-accordion{
    color: #008C93 !important;
}
.faq-accordion .accordion-item{
    border: none;
    border-bottom: 2px solid #008C93;
    color: #008C93 !important;
}
.faq-accordion .accordion-item .accordion-header{
    font-weight: 700;
    font-size: 1.5rem;
    background: #fff;
    border: none;
    box-shadow: none;
    padding: 1rem 0;
}
.faq-accordion .accordion-button{
    background-color: #fff !important;
    box-shadow: none !important;
    outline: none !important;
    font-weight: 700;
    font-size: 1.5rem;
    color: #008C93 !important;
}

.post-container .header{
    width: 100%;
    position: relative;
    padding: 0 0 1rem 0;
    background-color: #fff;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 30vh;
    display: flex;
    justify-content: end;
    align-items: center;
    flex-direction: column;
    color: #fff;
    height: 100%;
}
.post-container .header .overlay{
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 140, 147, 0.5);
    z-index: 0;
}
.post-container .header .header-content{
    position: relative;
    z-index: 1;
    width: 100%;
}
.post-container .header .post-title{
    font-size: 64px;
    font-weight: 700;
}
.post-container .post-content{
    padding-top: 2rem;
    padding-bottom: 2rem;
    color: #008C93;
}


/*==================================================
=            Bootstrap Media Queries             =
==================================================*/

/*==========  Non-Mobile First Method  ==========*/

/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {
    .home-hero .hero-video-container video,
    .home-hero .hero-video-container .hero-media-img {
        max-height: 27rem;
    }
}

/* Medium Devices, Desktops */
@media only screen and (max-width : 992px) {
    .home-hero .hero-video-container video,
    .home-hero .hero-video-container .hero-media-img {
        max-height: 25rem;
        width: 30rem;
        margin-right: 4rem;
    }
    .home-comparison-box{
        padding-left: 0 !important;
        padding-right: 0 !important;
        max-width: 100% !important;
    }

    .product-lateral-banner{
        width: auto;
        padding: 1rem;
    }
    
    .product-lateral-banner .banner-text{
        display: none;
    }
    .product-lateral-banner .banner-text-mobile{
        display: block;
        font-size: 17px;
        font-weight: 700;
        text-align: center;
    }

    .product-lateral-banner .social-icons{
        flex-direction: column;
        gap: 0.5rem;
        justify-content: space-between;
    }
    .product-lateral-banner .social-icons a{
        width: 16px;
    }
    
}

/* Small Devices, Tablets */
@media only screen and (max-width : 768px) {

    /* HEADER */

    .home-comparison-box .comparison-products-container{
        justify-content: start;
        overflow-x: auto;
    }
    .home-comparison-box .comparison-products-container .comparison-product-section{
        min-width: 300px;
    }

    .header-logo {
        max-height: 170px;
    }

    .header-line{
        display: none;
    }
    
    .btn-acquista {
        padding: 8px 15px;
        font-size: 14px;
    }

    .language-switcher-wrapper {
        margin-right: 10px;
    }
    .mobile-language-switcher .language-switcher-wrapper{
        margin-right: 0;
    }
    
    .language-switcher li {
        margin: 0 2px;
        font-size: 0.9rem;
    }
    
    .search-icon-wrapper {
        margin-right: 10px;
    }

    .product-hero .hero-video-text-1{
        font-size: 16px;
    }

    .product-hero .hero-video-text-2{
        font-size: 18px;
    }

    /* FOOTER  */

    .footer-logo{
        display: block;
        margin: 10px auto;
        max-width: 80vw!important;
    }

    .shape-bianca-footer{
        position: relative;
        top: -40px;
        max-width: 250px;
    
    }

    .footer-slogan {
        font-size: 55px;
        line-height: 1;
    }
    
    .language-switcher {
        justify-content: flex-start;
        margin-top: 20px;
    }
    
    .language-switcher li {
        margin-left: 0;
        margin-right: 15px;
    }

    .home-hero .hero-content{
        padding: 25rem 1rem 3rem 1rem;
        text-align: center;
    }

    .home-product-block .product-bottom .row{
        width: 100%;
    }

    .home-hero .hero-video-container{
        left: 0;
        width: 100%;
        height: auto;
        display: flex;
        justify-content: center;
    }
    .home-hero .hero-video-container .hero-video-overlay{
        left: 0;
        height: auto;
    }

    .home-hero .hero-video-container .hero-video-block{
        transform: none;
        -webkit-transform: none;
        -moz-transform: none;
        -ms-transform: none;
    }
    .home-hero .hero-video-container video,
    .home-hero .hero-video-container .hero-media-img{
        max-height: 25rem;
        clip-path: none;
        -webkit-clip-path: none;
        margin : 0;
    }
    .home-hero .hero-content .left-content{
        max-width: 100%;
    }

    .home-hero .hero-content .hero-pre-title{
        font-size: 24px;
    }
    .home-hero .hero-content .hero-title{
        font-size: 37px;
    }
    .home-hero .hero-content .hero-cta{
        margin-top: 2rem;
        margin-left: auto;
        margin-right: auto;
    }
    .home-hero .hero-banner-text{
        /* font-size: 115px; */
        text-align: left;
        line-height: 1;
        margin-bottom: -18px;
    }
    .home-hero .hero-image-container img{
        max-width: 120%;
    }
    .home-product-section{
        padding: 0;
        padding-top: 3rem;
    }
    .home-product-section .home-product-title, .home-product-section .home-product-title-2{
        font-size: 55px;
        line-height: auto;
    }
    .home-product-section .home-product-container{
        margin-top: 0;
    }
    .home-product-section .home-product-box{
        padding: 0;
        text-align: center;
        margin-bottom: 2rem;
    }
    .home-product-section .home-product-box .home-product-box-title{
        margin-top: 1rem;
        font-size: 25px;
    }
    .home-product-section .home-product-box .home-product-box-subtitle{
        font-size: 18px;
        /* font-weight: 500; */
    }
    .home-product-section-without-boost .home-product-box .home-product-box-title{
        margin-top: 1rem;
    }
    .home-product-section-without-boost .home-product-box .home-product-box-subtitle{
        margin-top: -3rem;
    }
    .home-product-section-without-boost .bottom-paragraph{
        margin-top: 0;
        padding: 0;
    }
    .home-product-block{
        padding: 4rem 1rem 0 1rem;
    }
    .home-product-section-without-boost .shape-svg{
        transform: none !important;
    }
    .home-product-section-without-boost .shape-svg-small{
        top: 12rem;
        right: 1.5rem;
    }
    .home-product-section-without-boost .shape-svg-small svg{
        height: 56px;
        width: auto;
    }
    .home-product-section-without-boost .shape-svg-large{
        position: relative;
        top: auto;
        left: auto;
        bottom: auto;
        display: flex;
        justify-content: center;
        margin-right: 2rem;
    }
    .home-product-block .intro-text{
        font-size: 26px;
    }
    .home-product-block .background-text-top, .home-product-block .background-text-bottom{
        font-size: 67px;
        margin-bottom: 0;
        line-height: 1;
    }
    .home-product-block .background-text-top{
        /* margin-bottom: 15rem; */
    }
    .home-product-block .background-text-bottom{
        margin-top: 0rem;
    }
    .home-product-block .product-center-image img{
        /* max-height: 15rem; */
    }
    .home-product-block .product-center-image{
        position: static;
        transform: none;
    }
    .home-product-block .product-bottom{
        position: static;
        margin-top: 2rem;
    }
    .home-product-block .product-bottom .product-description{
        text-align: center;
    }
    .home-product-block .product-bottom .product-description .product-description-content{
        white-space: normal;
        font-size: 20px;
    }
    .home-product-block .product-bottom .product-box-image{
        display: none;
    }
    .home-product-block .product-bottom .product-box-image-mobile{
        display: block;
        text-align: center;
        margin-bottom: 2rem;
    }
    .home-when-to-use{
        padding: 8rem 1rem 0 1rem;
    }
    .home-when-to-use .shape-img{
        top: -8rem;
        width: 6rem;
        right: 0;
    }
    .home-when-to-use .title{
        font-size: 60px;
    }
    .home-when-to-use .when-to-use-item .title{
        font-size: 43px;
    }
    .home-when-to-use .when-to-use-item .description{
        font-size: 16px;
    }
    .home-when-to-use .when-to-use-item a{
        font-size: 16px;
    }
    .home-when-to-use .when-to-use-item .icon-image img{
        width: 3rem;
    }
    .home-sucrosomial-technology{
        padding: 5rem 1rem 0 1rem;
    }
    .home-sucrosomial-technology .title{
        font-size: 45px;
    }
    .home-sucrosomial-technology .sucrosomial-technology-bottom-text{
        font-size: 55px;
        margin-bottom: -5px;
        margin-left: -1.5rem;
    }

    .product-hero .hero-content .hero-description{
        display: none;
    }
    .product-hero .hero-content .hero-title{
        font-size: 50px;
        margin-top: -8rem;
        text-align: left;
        line-height: 1;
        text-align: center;
    }
    .product-hero .hero-image img{
        min-height: 60vh;
        max-height: 100%;
    }
    .product-hero .hero-content{
        justify-content: center ;
    }
    .product-hero .hero-video-container {
        position: relative;
        width: 100%;
        height: 537px;
    }
    .product-hero .hero-video {
        width: 100vw;
        height: 537px;
        max-height: 100%;
        object-fit: cover;
    }
    .product-hero .hero-video-text{
        justify-content: start;
        height: 100%;
        padding-top: 1rem;
    }
    .product-hero .play-button img{
        width: 50px;
        height: 50px;
    }
    .product-sub-hero .product-sub-hero-image{
        justify-content: center;
    }
    .product-sub-hero .characteristics-container{
        margin-top: 1rem;
    }
    .product-sub-hero .characteristics-container .characteristic-item .characteristic-text{
        font-size: 11px;
    }
    .product-sub-hero .characteristics-container .characteristic-item img{
        max-width: 20px;
    }
    .product-sub-hero .product-sub-hero-button{
        padding: 0.5rem 2rem;
    }

    .product-lateral-banner .banner-text-mobile{
        display: none;
    }
    .product-lateral-banner .social-icons{
        margin-top: 0;
    }

    .product-page-info{
        padding-bottom: 10rem;
    }
    .product-page-info .title{
        padding: 0;
    }
    .product-page-info .title h1{
        font-size: 67px;
    }

    .product-page-info .product-info-image{
        display: none;
    }
    .product-page-info .product-info-description{
        font-size: 30px;
        margin-top: 1rem;
    }
    .product-page-info .product-info-description-2{
        font-size: 25px;
    }
    .product-sucrosomial-technology{
        padding: 3rem 0 3px 0;
        font-size: 20px;
    }
    .product-page-info-bottom-box{
        position: relative;
    }
    .product-page-info-bottom-box .product-info-image-mobile{
        display: block;
        height: 100%;
        width: 25rem;
        position: absolute!important;
        bottom: 90%; 
        left: 50%;
        transform: translateX(-50%);
    }
    .product-page-info-bottom-box .product-info-image-mobile img{
        scale: 1.2;
    }

    .product-page-bottle-info{
        text-align: center;
        padding: 3rem 0.5rem;
    }
    .product-page-bottle-info .product-bottle-info-title{
        line-height: 61px;
    }
    .product-page-bottle-info .product-bottle-info-button{
        padding: 0.5rem 2rem;
        margin-top: 1rem;
    }
    .product-page-bottle-info .product-bottle-info-button svg{
        height: 20px;
    }
    .product-page-bottle-info .product-bottle-info-image img{
        width: 289px;
        height: 294px;
    }
    .product-page-bottle-info .product-bottle-info-description{
        margin-bottom: 0;
        font-weight: 500;
        font-size: 14px;
    }
    .product-page-bottle-info .product-bottle-info-description p{
        margin-bottom: 0.5rem;
    }

    .product-info-blocks .text-content .title{
        font-size: 25px;
    }
    .product-info-blocks .text-content{
        padding: 2rem 0.5rem;    
    }
    .product-sucrosomial-technology .title{
        font-size: 58px;
    }
    .product-sucrosomial-technology .sucrosomial-technology-right-content{
        font-size: 25px;
        font-weight: 400;
    }
    .product-sucrosomial-technology .shape-svg{
        display: none;
    }
    .product-sucrosomial-technology .sucrosomial-technology-bottom-text{
        font-size: 55px;
        margin-bottom: -5px;
        margin-left: -0.75rem;
        margin-top: 2rem;
    }
    .product-sucrosomial-technology .sucrosomial-technology-right-content h3{
        font-weight: 700;
    }
    .product-how-it-work{
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }
    .product-how-it-work .download-btn{
        margin-bottom: 2rem;
    }
    .product-how-it-work .left-content{
        padding: 0 0.5rem;
    }
    .product-how-it-work .left-content .title{
        font-size: 67px;
    }
    .product-how-it-work .shape-small-svg{
        display: none;
    }
    .product-how-it-work .left-content .shape-image{
        display: none;
    }
    .product-how-it-work .right-content .shape-image-mobile{
        display: flex;
        justify-content: center;
        width: 100%;
        padding: 1rem;
    }
    .product-how-it-work .right-content .shape-image-mobile svg{
        width: 23rem;
    }
    .product-how-it-work .right-content .step .step-title{
        font-size: 37px;
    }
    .product-related-products{
        padding: 3rem 0.5rem;
    }
    .product-related-products .related-products .product-item{
        margin-bottom: 3rem;
    }
    .technology-hero-section{
        padding-bottom: 5rem;
    }
    .technology-hero-section .hero-title{
        padding: 0;
        font-size: 50px;
    }
    .technology-hero-section .hero-content{
        font-size: 18px;
    }
    .technology-about-sucrosoma{
        flex-direction: column;
    }
    .technology-about-sucrosoma .left-content{
        padding-top: 3rem;
    }
    .technology-about-sucrosoma .left-content .title{
        font-size: 55px;
    }
    .technology-about-sucrosoma .left-content .content{
        font-size: 18px;
        line-height: 19px;
    }
    .technology-about-sucrosoma .left-content .image{
        margin-top: 5rem;
    }
    .technology-about-sucrosoma .right-content{
        padding-top: 3rem;
    }
    .technology-about-sucrosoma .right-content .title{
        font-size: 55px;
    }
    .technology-about-sucrosoma .right-content .container{
        padding-left: 0.875rem;
    }
    .technology-why-effective{
        padding: 0 0 3rem 0;
    }
    .technology-why-effective .image img{
        width: 100%;
        margin-right: -2rem;
    }
    .technology-innovation-science{
        padding-left: 0;
        padding-right: 0;
    }
    .technology-innovation-science .title{
        font-size: 50px;
        line-height: 55px;
    }
    .technology-innovation-science .left-content .content{
        font-size: 23px;
    }
    .technology-innovation-science .right-content h3{
        font-size: 30px;
    }
    .technology-innovation-science .advantages-block .advantages-title{
        font-size: 37px;
    }
    .advantages-block .advantage-item .title{
        font-size: 23px;
        line-height: 1;
    }
    .advantages-block .advantage-item img{
        max-height: 2.5rem;
        width: auto;
    }
    .technology-at-service .right-content .title{
        font-size: 55px;
        line-height: 59px;
    }
    .technology-at-service .right-content .content{
        font-size: 18px;
    }
    .technology-at-service .right-content .at-service-link{
        margin-top: 2rem;
    }
    .technology-comparison{
        padding: 3rem 0;
    }
    .technology-comparison .title{
        padding: 0;
        font-size: 51px;
    }
    .technology-comparison .subtitle{
        font-size: 25px;
    }
    .technology-comparison .comparisons-list .comparison-item .apportal-content{
        border-right: none;
        border-bottom: 1px solid #BEE0E1;
        padding-bottom: 1rem;
    }
    .technology-comparison .comparisons-list .comparison-item{
        margin-bottom: 5rem;
    }
    .technology-applications{
        padding: 3rem 0 5rem 0;
    }
    .technology-applications .left-content{
        padding-left: 0.875rem;
    }
    .technology-applications .title{
        font-size: 55px;
        line-height: 59px;
    }
    .technology-applications .right-content{
        font-size: 20px;
        padding-right: 0.875rem;
    }
    .technology-cta{
        padding: 7rem 1rem;
    }
    .technology-cta .content .title{
        font-size: 59px;
    }
    .technology-faqs{
        padding: 3rem 0rem;       
    }
    .faq-accordion .accordion-button,
    .faq-accordion .accordion-body{
        padding-right: 0;
        padding-left: 0;
    }
    .faq-accordion .accordion-item .accordion-header{
        font-size: 30px;
    }
    .faq-accordion .accordion-item{
        border-bottom: 1px solid #008C93;
    }
}

/* Extra Small Devices, Phones */
@media only screen and (max-width : 480px) {
    .menu-toggle svg {
        width: 30px;
        height: auto;
    }
    .product-page-info-bottom-box .product-info-image-mobile{
        width: 100%;
    }
}

/* Custom, iPhone Retina */
@media only screen and (max-width : 320px) {

}

/* Keyframes for animation */
@keyframes marqueeScroll {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-50%);
    }
}

/* Random Posts Section Styles */
.random-posts-section {
    /* background-color: #f8f9fa;
    border-top: 1px solid #dee2e6; */
}

.random-posts-section .section-title {
    color: #008C93;
    font-weight: 600;
    font-size: 2.5rem;
    margin-bottom: 2rem;
}

.random-posts-section .card {
    border: none;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    overflow: hidden;
    border-radius: 0px;
}

.random-posts-section .card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0, 140, 147, 0.15) !important;
}

.random-posts-section .card-img-top {
    transition: transform 0.3s ease;
}

.random-posts-section .card:hover .card-img-top {
    transform: scale(1.05);
}

.random-posts-section .card-title a {
    color: #008C93;
    text-decoration: none;
    font-weight: 600;
    line-height: 1.3;
    display: block;
    font-size: 27px;
}

.random-posts-section .card-title a:hover {
    color: #008C93;
}

.random-posts-section .read-more-link {
    color: #008C93;
    transition: all 0.3s ease;
    text-decoration: none;
}

.random-posts-section .read-more-link:hover {
    transform: translateX(10px);
    text-decoration: underline;
}


/* Article Sidebar Chapters Styles */
.article-sidebar {
    position: relative; /* Default positioning for JavaScript control */
    height: fit-content;
    padding-left: 2rem;
}

/* JavaScript controlled sticky states */
.article-sidebar.js-sticky {
    position: fixed;
    top: 120px;
    z-index: 100;
    width: auto;
    max-height: calc(100vh - 40px);
    overflow-y: auto;
}

.article-sidebar.js-sticky-placeholder {
    height: 0; /* Placeholder will be dynamically sized */
    visibility: hidden;
}

.chapters-section {
    background-color: white;
    border: 1px solid #e9ecef;
    /* border-radius: 8px; */
    padding: 1.5rem;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.chapters-title {
    color: #008C93;
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid #008C93;
}

.chapters-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.chapters-list li {
    margin-bottom: 0.5rem;
}

.chapters-list li a {
    color: #6c757d;
    text-decoration: none;
    display: block;
    padding: 0.5rem 0;
    border-left: 3px solid transparent;
    padding-left: 1rem;
    transition: all 0.3s ease;
    font-size: 0.9rem;
    line-height: 1.4;
}

.chapters-list li a:hover {
    color: #008C93;
    border-left-color: #008C93;
    background-color: rgba(0, 140, 147, 0.05);
}

.chapters-list li a.active {
    color: #008C93;
    font-weight: 600;
    border-left-color: #008C93;
    background-color: rgba(0, 140, 147, 0.1);
}

/* Smooth scrolling for the whole page */
html {
    scroll-behavior: smooth;
}

/* Add some padding to h2 elements for better scroll positioning */
#article-content h2 {
    scroll-margin-top: 140px; /* Account for sticky header + some extra space */
    padding-top: 1rem;
}

#article-content .wp-block-list{
    margin-left: 10px;
}
#article-content a{
    color: #008C93;
}
#article-content a:hover{
    color: #008c93a6;
}

/* Responsive adjustments for chapters sidebar */
@media only screen and (max-width: 991px) {
    .article-sidebar {
        position: static;
        margin-top: 2rem;
        padding-left: 0;
        order: 2;
    }
    
    .post-content .col-md-8 {
        order: 1;
    }
    
    .chapters-section {
        margin-bottom: 2rem;
        background-color: #008C93;
        color: #fff;
    }
    
    .chapters-title {
        font-size: 1.1rem;
        color: #fff;
        border-bottom-color: #fff;
    }
    
    .chapters-list li a {
        font-size: 0.85rem;
        color: rgba(255, 255, 255, 0.8);
    }
    
    .chapters-list li a:hover,
    .chapters-list li a.active {
        color: #fff;
        border-left-color: #fff;
        background-color: rgba(255, 255, 255, 0.1);
    }
}

/* BLOG ARCHIVE PAGE */
.blog-archive-page h1{
    font-size: 75px;
    font-weight: 700;
    color: #008C93;
}

.blog-archive-page .page-description{
    font-size: 20px;
    margin-bottom: 2rem;
    color: #008C93;
}

.blog-archive-page .page-description p{
    font-size: 13px!important;
    font-weight: 400;
}

.blog-archive-page .page-description h2{
    font-size: 21px;
    font-weight: 400;
    margin-top: 30px;
}

.blog-archive-page .page-description h3{
    font-size: 18px;
    font-weight: 700;
    margin-top: 30px;
}

.blog-archive-page .blog-archive-posts{
    margin-top: 5.0rem;
}

.blog-archive-page .blog-archive-posts .post-cover-image{
    width: 100%;
    height: 276px;
    object-fit: contain;
    background-size: cover;
}

.blog-archive-page .blog-archive-posts h2 a{
    color: #008C93;
    font-size: 27px;
    font-weight: 700;
    margin-bottom: 10px;
    text-decoration: none;
}

.blog-archive-page .blog-archive-posts .read-more-link{
    color: #008C93;
    font-size: 13px;
    font-weight: 700;
    margin-bottom: 10px;
    text-decoration: none;
}

.blog-archive-page .blog-archive-posts .page-numbers{
    color: #008C93;
    font-size: 15px;
    font-weight: 700;
    margin-bottom: 10px;
    text-decoration: none;
}

.blog-archive-page .blog-archive-posts .page-numbers:hover,
.blog-archive-page .blog-archive-posts .current{
    text-decoration: underline;
}



/* MEDIA QUERIES FOR ARCHIVE PAGE */
@media only screen and (max-width: 991px) {
    .blog-archive-page h1{
        font-size: 50px;
    }
}

/* HOME BLOG SECTION */
.home-blog{
    padding: 5rem 0;
}

.home-blog h1{
    color: #008C93;
    font-size: 67px;
    font-weight: 700;
}

.home-blog h2{
    font-size: 39px;
    font-weight: 700;
    color: #008C93;
    margin-bottom: 10px;
    text-decoration: none;
}

.home-blog h3{
    font-weight: 700;
    color: #008C93;
    text-decoration: none;
}

.home-blog p{
    font-size: 20px;
    font-weight: 400;
    color: #008C93;
    margin-bottom: 10px;
    text-decoration: none;
    max-width: 570px;
}

.home-blog .read-more-link{
    color: #008C93;
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 10px;
    text-decoration: none;
}

.home-blog  .blog-article a{
    color: #008C93;
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 10px;
    text-decoration: none;
}

.home-blog  .blog-article a:hover{
    /* text-decoration: underline; */
}

.blog-articles .read-more-link-smaller{
    color: #008C93;
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 10px;
    text-decoration: none;
}

.blog-articles .read-more-link-smaller:hover{
    /* text-decoration: underline; */
}

/* SEARCH RESULTS PAGE */
.search-results-page .page-header{
    margin-top: .5rem;
    color: #008C93;
}

.search-results-page .page-title{
    font-size: 40px;
    color: #008C93;
}

.search-results-page .entry-title, .search-results-page .entry-title a{
    font-size: 30px;
    color: #008C93;
}

.search-results-page .navigation {
    color: #008C93;
}

.search-results-page .navigation .nav-links{
    color: #008C93;
}

.search-results-page .navigation .nav-links a{
    color: #008C93;
}

.search-results-page .navigation .nav-links a{
    text-decoration: underline;
}

.search-results-page .read-more-link-smaller{
    color: #008C93;
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 10px;
    text-decoration: none;
}

#search-toggle{
    color: #008C93;
}
@media screen and (min-width: 37.5em) {
	.menu-toggle {
		display: flex !important;
	}
}

/* Hide anchor tags marked with hide-products-link class in mobile menu */
.mobile-menu a.hide-products-link {
    display: none !important;
}

.mobile-menu a{
    font-weight: 700!important;
    font-size: 25px!important;
}

.mobile-menu ul{
    margin-top: 15vh!important;
}
.mobile-menu .mobile-language-switcher ul{
    margin-top: 0 !important;
}
.mobile-menu .mobile-language-switcher ul{
    gap: 10px;
}
.mobile-menu .mobile-language-switcher .language-divider{
    font-size: 20px;
    font-weight: 700;
    color: #fff;
}

.otgs-development-site-front-end{
    display: none!important;
}

/* Desktop: Hide characteristics marquee, ensure regular container is visible */
.product-sub-hero .characteristics-marquee {
    display: none !important;
}

.product-sub-hero-image-mobile {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.product-sub-hero-image-mobile.animate-fade-up {
    opacity: 1;
    transform: translateY(0);
}

.blog-archive-page .archive-title{
    font-size: 40px;
    font-weight: 700;
    color: #008C93;
}

/* Media query on mobile */
@media only screen and (max-width: 768px) {

    .blog-archive-page h1{
        font-size: 40px!important;
    }

    .header-content h1{
        font-size: 40px!important;
    }

    .product-sub-hero .characteristics-marquee {
        display: flex !important;
    }

   /* Hide desktop characteristics container on mobile */
    .product-sub-hero .characteristics-container {
        display: none;
    }

    .product-sub-hero-button-wrapper {
        opacity: 0;
        transform: translateY(30px);
        transition: opacity 0.8s ease-out, transform 0.8s ease-out;
    }

    .product-sub-hero-button-wrapper.animate-fade-up {
        opacity: 1;
        transform: translateY(0);
    }

    /* Show mobile characteristics marquee only on mobile */
    /* .product-sub-hero .characteristics-marquee {
        display: block;
        overflow: hidden;
        white-space: nowrap;
        position: relative;
        padding: 1rem 0;
        margin-top: 1rem;
    } */

    .characteristics-marquee .marquee-wrapper {
        display: flex;
        width: 100%;
    }

    .characteristics-marquee .marquee-content {
        display: flex;
        animation: characteristicsMarqueeScroll 15s linear infinite;
        gap: 2rem;
    }

    .characteristics-marquee .characteristic-item {
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: center;
        padding: 0 1rem;
        flex-shrink: 0;
        color: #fff;
        text-align: left;
        min-width: 120px;
        gap: 0.5rem;
    }

    .characteristics-marquee .characteristic-item img {
        max-width: 30px;
        height: auto;
        flex-shrink: 0;
    }

    .characteristics-marquee .characteristic-item .characteristic-text {
        font-size: 15px;
        font-weight: 600;
        line-height: 1.2;
        white-space: normal;
        text-align: left;
    }

    /* Keyframes for characteristics marquee */
    @keyframes characteristicsMarqueeScroll {
        0% {
            transform: translateX(0%);
        }
        100% {
            transform: translateX(-50%);
        }
    }

    .random-posts-section .section-title {
        font-size: 2rem;
        margin-bottom: 1.5rem;
    }
    
    .random-posts-section {
        padding: 3rem 0 !important;
    }

    

}

@media only screen and (max-width: 1200px) {

    .background-text-bottom, 
    .background-text-top,
    .sucrosomial-technology-bottom-text
    {
        font-size: 12vw!important;
    }

    .home-product-section .home-product-title, 
    .home-product-section .home-product-title-2, 
    .technology-hero-section h1,
    .technology-about-sucrosoma h2,
    .technology-innovation-science h2,
    .technology-at-service h1,
    .technology-applications h1,
    .page-template-page-blog-archive .site-main h1,
    .product-page-info .title h1,
    /* .home-when-to-use h1, */
    .product-how-it-work h1,
    .product-sucrosomial-technology h3
    {
        font-size: clamp(1rem, 12vw, 2.5rem)!important;
    }
    
    .product-page-info .info-right-content p{
        font-size: 1.3rem!important;
    }

    


}

/* BLOG ARCHIVE LOAD MORE BUTTON */
.load-more-btn {
    color: #008489!important;
    font-weight: 700!important;
    padding: 12px 30px!important;
    text-decoration: none;
    border: none;
    border-radius: 0!important;
    font-size: 17px!important;
    transition: all 0.3s ease;
    cursor: pointer;
}

.load-more-btn:hover {
    color: #008489!important;
    transform: translateY(-2px);
}

.load-more-btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

#loading-spinner .spinner-border {
    color: #008489;
    width: 1.5rem;
    height: 1.5rem;
}

/* Blog post cards styling */
.blog-archive-posts .post-cover-image {
    height: 200px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 8px;
    margin-bottom: 1rem;
}

.blog-archive-posts article {
    border: none;
    background: transparent;
}

.blog-archive-posts article h2 {
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.3;
    margin-bottom: 1rem;
}

.blog-archive-posts article h2 a {
    color: #333;
    text-decoration: none;
    transition: color 0.3s ease;
}

.blog-archive-posts article h2 a:hover {
    color: #008489;
}

.blog-archive-posts .read-more-link {
    color: #008489;
    font-weight: 700;
    font-size: 14px;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    transition: all 0.3s ease;
}

.blog-archive-posts .read-more-link:hover {
    color: #00696d;
    text-decoration: none;
}

.blog-archive-posts .read-more-link svg {
    transition: transform 0.3s ease;
}

.blog-archive-posts .read-more-link:hover svg {
    transform: translateX(3px);
}

@media only screen and (max-width: 768px) {
    .load-more-btn {
        padding: 10px 25px!important;
        font-size: 13px!important;
    }
    
    .blog-archive-posts .post-cover-image {
        height: 180px;
    }
}

/* FULL-SCREEN SEARCH OVERLAY */
.search-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(255, 255, 255, 0.95);
    z-index: 99999;
    display: none;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.search-overlay.active {
    opacity: 1;
}

.search-overlay-content {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.search-close-btn {
    position: absolute;
    top: 30px;
    right: 30px;
    background: transparent;
    border: none;
    color: #008C93;
    font-size: 24px;
    cursor: pointer;
    padding: 10px;
    transition: all 0.3s ease;
    z-index: 100000;
}

.search-close-btn:hover {
    color: #2c9373;
    transform: scale(1.1);
}

.search-container {
    width: 100%;
    max-width: 600px;
    padding: 0 20px;
}

.search-input-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    background-color: #fff;
    border-radius: 0;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

.search-overlay .search-field {
    width: 100%;
    padding: 20px 25px;
    border: none;
    background: transparent;
    font-size: 18px;
    color: #333;
    outline: none;
    font-weight: 400;
}

.search-overlay .search-field::placeholder {
    color: #999;
}

.search-submit-btn {
    background-color: #fff;
    border: none;
    color: #008C93;
    padding: 20px 25px;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 70px;
}

.search-submit-btn:hover {
    background-color: #008C93;
    color: #fff;
}

.search-submit-btn i {
    font-size: 18px;
}


.blog-archive-page .page-description p.category-page-excert{
    font-size: 21px !important;
    font-weight: 400 ;
    color: #008C93;
}

/* Mobile adjustments for search overlay */
@media only screen and (max-width: 768px) {
    .search-close-btn {
        top: 20px;
        right: 20px;
        font-size: 20px;
    }
    
    .search-container {
        max-width: 90%;
    }
    
    .search-overlay .search-field {
        padding: 15px 20px;
        font-size: 16px;
    }
    
    .search-submit-btn {
        padding: 15px 20px;
        min-width: 60px;
    }
    
    .search-submit-btn i {
        font-size: 16px;
    }
}
/* BLOG MASONRY PAGE */
.blog-masonry-page{
    padding-top: 2rem;
}
.blog-masonry-page .blog-giant-title{
    color: #008C93;
    font-weight: 700;
    font-size: 180px;
    line-height: 1;
    overflow-wrap: break-word;
    position: relative;
    z-index: 2;
    pointer-events: none;
    margin-bottom: 1.5rem;
}
.blog-masonry-grid{
    column-count: 4;
    column-gap: 16px;
    position: relative;
    z-index: 1;
    margin-top: -60px;
}
.blog-masonry-card{
    display: inline-block;
    width: 100%;
    break-inside: avoid;
    margin-bottom: 16px;
    position: relative;
    overflow: hidden;
}
.blog-masonry-card .blog-masonry-card-link{
    display: block;
    position: relative;
    text-decoration: none;
    aspect-ratio: 3 / 4.2;
    overflow: hidden;
}
/* alternate card heights for the staggered masonry look */
.blog-masonry-card:nth-child(4n+2) .blog-masonry-card-link{
    aspect-ratio: 3 / 5;
}
.blog-masonry-card:nth-child(4n+3) .blog-masonry-card-link{
    aspect-ratio: 3 / 3.6;
}
.blog-masonry-card img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.blog-masonry-card .blog-masonry-card-placeholder{
    width: 100%;
    height: 100%;
    background-color: #008C93;
}
.blog-masonry-card .blog-masonry-card-overlay{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: flex-end;
    padding: 16px;
    background: linear-gradient(to top, rgba(0, 140, 147, 0.85) 0%, rgba(0, 140, 147, 0.35) 35%, rgba(0, 140, 147, 0) 65%);
}
.blog-masonry-card .blog-masonry-card-overlay h2{
    color: #fff;
    font-weight: 700;
    font-size: 20px;
    line-height: 1.25;
    margin: 0;
}
.blog-masonry-page .load-more-link{
    color: #008C93;
    font-weight: 700;
    font-size: 18px;
    cursor: pointer;
    text-decoration: none;
}
.blog-masonry-page .load-more-link:hover{
    color: #005f63;
    text-decoration: underline;
}
@media (max-width: 992px){
    .blog-masonry-grid{
        column-count: 2;
        margin-top: -30px;
    }
}
@media (max-width: 576px){
    .blog-masonry-grid{
        column-count: 1;
        margin-top: 0;
    }
    .blog-masonry-card .blog-masonry-card-link,
    .blog-masonry-card:nth-child(4n+2) .blog-masonry-card-link,
    .blog-masonry-card:nth-child(4n+3) .blog-masonry-card-link{
        aspect-ratio: 4 / 3.4;
    }
    .blog-masonry-card .blog-masonry-card-overlay h2{
        font-size: 20px;
    }
}

/* QUIZ APPORTAL PAGE */
.quiz-hero{
    background: #fff;
    padding: 80px 0 100px;
}
.quiz-hero-title{
    color: #008C93;
    font-weight: 700;
    /* Figma: 140px/132px on a 1920 frame -> fluid, capped at the design size */
    font-size: clamp(42px, 7.3vw, 140px);
    line-height: 0.943;
    margin: 0;
}
.quiz-hero .quiz-hero-body{
    margin-top: 2rem;
}
.quiz-hero-title sup{
    font-size: 0.45em;
    top: -0.9em;
}
.quiz-hero-image img{
    width: 100%;
    height: auto;
    aspect-ratio: 3 / 3.9;
    object-fit: cover;
}
.quiz-screen{
    display: none;
}
.quiz-screen.is-active{
    display: block;
    animation: quizScreenFade 0.3s ease;
}
@keyframes quizScreenFade{
    from{ opacity: 0; }
    to{ opacity: 1; }
}
.quiz-intro-text{
    color: #008C93;
    font-size: 23px;
    line-height: 1.5;
}
.quiz-result-description{
    color: #008C93;
    font-size: 16px;
    line-height: 1.5;
}
.quiz-question,
.quiz-result-lead{
    color: #008C93;
    font-weight: 700;
    font-size: 28px;
    line-height: 1.2;
    margin-bottom: 32px;
}
.quiz-result-lead{
    margin-bottom: 8px;
}
.quiz-result-name{
    color: #008C93;
    font-weight: 700;
    font-size: 30px;
    line-height: 1.2;
    margin-bottom: 24px;
}
.quiz-answers .quiz-answer{
    display: block;
    width: 100%;
    text-align: left;
    background: #fff;
    border: 1px solid #008C93;
    border-radius: 0;
    color: #008C93;
    font-weight: 700;
    font-size: 16px;
    line-height: 1.35;
    padding: 18px 24px;
    margin-bottom: 16px;
    cursor: pointer;
    transition: all 0.3s ease;
}
.quiz-answers .quiz-answer:hover,
.quiz-answers .quiz-answer:focus-visible,
.quiz-answers .quiz-answer.is-selected{
    background: #008C93;
    color: #fff;
}

[data-quiz-multiple] .quiz-answers .quiz-answer{
    display: flex;
    align-items: center;
    gap: 14px;
}
[data-quiz-multiple] .quiz-answers .quiz-answer::before{
    content: '';
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    border: 1px solid currentColor;
    font-size: 14px;
    line-height: 18px;
    text-align: center;
}
[data-quiz-multiple] .quiz-answers .quiz-answer.is-selected::before{
    content: '\2713';
    background: #fff;
    color: #008C93;
}
.quiz-confirm{
    margin-top: 8px;
}
/* Keep the back arrow on its own line under the confirm button. */
.quiz-confirm + .quiz-back{
    display: block;
}
.quiz-confirm:disabled,
.quiz-confirm:disabled:hover,
.quiz-confirm:disabled:focus{
    background: #b3d9db;
    border-color: #b3d9db;
    color: #fff;
    cursor: not-allowed;
}
.quiz-back{
    background: none;
    border: none;
    padding: 0;
    margin-top: 24px;
    color: #008C93;
    cursor: pointer;
    transition: transform 0.3s ease;
}
.quiz-back:hover{
    transform: translateX(-4px);
}
.quiz-btn{
    display: inline-block;
    min-width: 190px;
    border-radius: 0;
    border: 1px solid transparent;
    font-weight: 700;
    font-size: 14px;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    text-decoration: none;
    text-align: center;
    padding: 16px 48px;
    cursor: pointer;
    transition: all 0.3s ease;
}
.quiz-btn-solid,
.quiz-btn-solid:visited{
    background: #008C93;
    border-color: #008C93;
    color: #fff;
}
.quiz-btn-solid:hover,
.quiz-btn-solid:focus,
.quiz-btn-solid:active{
    background: #005f63;
    border-color: #005f63;
    color: #fff;
}
.quiz-btn-outline{
    background: transparent;
    border-color: #008C93;
    color: #008C93;
}
.quiz-btn-outline:hover,
.quiz-btn-outline:focus,
.quiz-btn-outline:active{
    background: #008C93;
    color: #fff;
}
.quiz-result-actions{
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-top: 32px;
}
.quiz-product-section{
    padding: 110px 0;
    color: #fff;
    scroll-margin-top: 90px;
}
.quiz-product-title{
    color: #fff;
    font-weight: 700;
    font-size: 45px;
    line-height: 1.15;
    text-align: center;
    margin: 0;
}
.quiz-product-intro{
    text-align: center;
    max-width: 920px;
    margin: 24px auto 0;
    font-size: 14px;
    line-height: 1.6;
}
/* Icon + caption row under the intro. Below 768px a row of three or more turns
   into a carousel; the :not(.swiper-initialized) rules keep the same markup
   working as a plain centred row on desktop and for shorter rows. */
.quiz-product-features{
    margin: 45px auto;
    overflow: hidden;
}
.quiz-product-features .swiper-wrapper{
    align-items: flex-start;
}
.quiz-product-features:not(.swiper-initialized) .swiper-wrapper{
    display: flex;
    justify-content: center;
}
/* Swiper styles .swiper-slide globally at width 100%, so the static row has to
   take its own width back — both before init and after destroy. Equal columns
   spread the icons across the whole section, as the design has them, instead of
   letting the longest caption decide the spacing. */
.quiz-product-features:not(.swiper-initialized) .swiper-slide{
    flex: 1 1 0;
    width: auto;
    min-width: 0;
    padding: 0 12px;
}
.quiz-product-feature{
    height: auto;
    text-align: center;
}
/* Fixed icon box so captions start on the same line whatever the icon's aspect
   ratio — a tall thermometer next to a wide battery otherwise staggers them. */
.quiz-product-feature-icon{
    display: flex;
    align-items: center;
    justify-content: center;
    height: 64px;
}
.quiz-product-feature-icon img{
    max-width: 64px;
    max-height: 100%;
    width: auto;
    height: auto;
}
.quiz-product-feature-text{
    margin-top: 24px;
    font-size: 16px;
    line-height: 1.35;
    color: #fff;
}
/* Bullets only exist while the carousel is live, so the extra room they need is
   reserved on the initialised container only. */
.quiz-product-features .swiper-pagination{
    display: none;
}
.quiz-product-features.swiper-initialized{
    padding-bottom: 30px;
}
.quiz-product-features.swiper-initialized .swiper-pagination{
    display: block;
    --swiper-pagination-color: #fff;
    --swiper-pagination-bullet-inactive-color: #fff;
    --swiper-pagination-bullet-inactive-opacity: 0.45;
    --swiper-pagination-bullet-size: 8px;
    --swiper-pagination-bullet-horizontal-gap: 5px;
}
.quiz-product-row{
    margin-top: 70px;
}
.quiz-product-section.is-reversed .quiz-product-row{
    flex-direction: row-reverse;
}
.quiz-product-image{
    text-align: center;
}
.quiz-product-image img{
    max-width: 100%;
    height: auto;
}
.quiz-product-description{
    font-size: 18px;
    line-height: 1.55;
}
.quiz-product-actions{
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-top: 32px;
}
.quiz-product-disclaimer{
    font-size: 10px;
    line-height: 1.5;
    text-align: center;
    color: #fff;
}
.quiz-btn-buy,
.quiz-btn-buy:visited{
    color: #fff;
    border: none;
}
.quiz-btn-buy:hover,
.quiz-btn-buy:focus,
.quiz-btn-buy:active{
    color: #fff;
    opacity: 0.85;
}
.quiz-btn-discover{
    background: transparent;
    border-color: #fff;
    color: #fff !important;
}
.quiz-btn-discover:hover,
.quiz-btn-discover:focus,
.quiz-btn-discover:active{
    background: #fff;
    color: #333 !important;
}
.quiz-product-section.is-recommended{
    box-shadow: inset 0 0 0 5px rgba(255, 255, 255, 0.85);
    animation: quizRecommendedPulse 1.2s ease 2;
}
@keyframes quizRecommendedPulse{
    50%{ box-shadow: inset 0 0 0 14px rgba(255, 255, 255, 0.5); }
}
@media (prefers-reduced-motion: reduce){
    .quiz-screen.is-active,
    .quiz-product-section.is-recommended{
        animation: none;
    }
}
@media (max-width: 992px){
    .quiz-hero{
        padding: 50px 0 70px;
    }
    .quiz-hero .quiz-hero-body{
        margin-top: 40px;
    }
    .quiz-hero-image{
        margin-top: 40px;
    }
    .quiz-product-section{
        padding: 70px 0;
    }
    .quiz-product-title{
        font-size: 32px;
    }
    .quiz-product-features{
        margin-top: 40px;
    }
    .quiz-product-feature-icon{
        height: 48px;
    }
    .quiz-product-feature-icon img{
        max-width: 48px;
    }
    .quiz-product-feature-text{
        margin-top: 16px;
        font-size: 14px;
    }
    .quiz-product-row{
        margin-top: 40px;
    }
    .quiz-product-content{
        margin-top: 32px;
    }
}
@media (max-width: 576px){
    .quiz-question,
    .quiz-result-lead{
        font-size: 23px;
    }
    .quiz-product-features:not(.swiper-initialized) .swiper-slide{
        padding: 0 6px;
    }
    .quiz-result-name{
        font-size: 26px;
    }
    .quiz-btn{
        width: 100%;
    }
}