/*
Theme Name: Bianchi Detergenti
Author: Luca Forzan - LF Design
Author URI: https://lf-design.it/
Version: 1.0
Text Domain: bianchi
*/

/* ==================================================
   INGRES
   ================================================== */

/* ==========================================================================
   BASE & RESET
========================================================================== */
html {
    margin-top: 0!important;
    scroll-behavior: auto !important;
}
body {
	margin: 0;
    overflow-x: hidden;
    position: relative;
    font-family: var( --e-global-typography-text-font-family ), Sans-serif;
}
*:focus {
    outline: none;
}

/* ==========================================================================
   TRANSIZIONI CONDIVISE
========================================================================== */
#main-content .elementor-button, .swiper-slider .btn,
.swiper-product-categories .category-card .category-badge,
.sector-card .sector-badge {
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

/* ==========================================================================
   PADDING
========================================================================== */
.padding-top {
    padding-top: 120px!important;
}
.padding-bottom {
    padding-bottom: 120px!important;
}
.padding-top-medium {
    padding-top: 96px!important;
}
.padding-bottom-medium {
    padding-bottom: 96px!important;
}
.padding-bottom-medium-curve {
    padding-bottom: 138px!important;
}
.padmed-top { padding-top: 30px!important; }
.padmed-bot { padding-bottom: 30px!important; }
.padmed-tot { padding-top: 30px!important; padding-bottom: 30px!important; }
/* ==========================================================================
   CURVE
========================================================================== */
.curve-top {
    margin-top: -42px!important;
}
.curve-top img, .curve-bottom img {
    width: 100%!important;
    height: 42px!important;
}
.curve-bottom img {
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
}
.curve-right, .curve-left {
    position: relative;
    z-index: 2!important;
    height: 100%!important;
}
.curve-left::after,
.curve-right::after {
    position: absolute;
    top: -10px;
    content: "";
    display: block;
    width: 32px;
    height: calc(100% + 10px);
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 33 468" preserveAspectRatio="none" fill="none"><path d="M0 0C29.6067 52.3924 56.3984 298.537 0 468V0Z" fill="%23D1E3FF"/></svg>');
    background-size: 100% 100%;
    background-repeat: no-repeat;
}
.curve-right::after {
    right: -32px;
}
.curve-left::after {
    left: -32px;
    transform: scaleX(-1);
}
/* ==========================================================================
   UTILITY
========================================================================== */
.overflow-hidden {
    overflow: hidden!important;
}
.highlighted, .highlighted * {
    color: #004BBC!important;
}

/* ==========================================================================
   HEADER
========================================================================== */
.wc-custom-search-form {
    position: relative;
}
.wc-custom-search-input {
    font-family: var( --e-global-typography-text-font-family ), Sans-serif;
    padding: 12px 62px 12px 16px;
    background-color: #E6F0FF;
    border-width: 0;
    font-weight: 500;
    font-size: 14px;
    line-height: 1em;
    color: #000000;
    border-radius: 64px;
    opacity: 1;
    width: 200px;
}
.wc-custom-search-input::placeholder {
    opacity: 1;
    color: #9BB3D7;
}
/* La "X" nativa del browser per svuotare i campi type="search" si sovrapponeva
   alla lente d'ingrandimento personalizzata (entrambe sul lato destro): usiamo
   una X nostra invece (sotto), quindi quella nativa resta sempre nascosta. */
.wc-custom-search-input::-webkit-search-cancel-button {
    -webkit-appearance: none;
    appearance: none;
}
/* X personalizzata: affiancata alla lente, non sovrapposta. Visibile solo
   quando c'è del testo scritto (":not(:placeholder-shown)" è vero solo a
   campo non vuoto), non serve JS per mostrarla/nasconderla. */
.wc-custom-search-clear {
    display: none;
    align-items: center;
    justify-content: center;
    background-color: transparent;
    border-width: 0;
    position: absolute;
    right: 38px;
    top: 12px;
    cursor: pointer;
}
.wc-custom-search-input:not(:placeholder-shown) ~ .wc-custom-search-clear {
    display: flex;
}
.wc-custom-search-button {
    background-color: transparent;
    border-width: 0;
    position: absolute;
    right: 12px;
    top: 12px;
    cursor: pointer;
}
.elementor-nav-menu--dropdown {
    top: 45px!important;
}

/* ==========================================================================
   MEGA MENU "PRODOTTI" (SOLO DESKTOP)
   ==========================================================================
   Attivo solo sopra i 1024px (stesso breakpoint del passaggio a menu
   burger, vedi "RESPONSIVE - TABLET" più sotto): da tablet in giù il menu
   "Prodotti" resta quello standard di Elementor, qui non tocchiamo nulla.

   Presuppone che la prima voce del sottomenu sia "Tutti i prodotti" (link
   a /prodotti/): non serve aggiungerla a mano nel menu di WordPress, la
   inserisce in automatico custom.js (blocco "Mega menu Prodotti").

   Il pannello ha position:fixed con top/left/width forzati in !important
   perché SmartMenus (lo script che apre/chiude il menu) scrive questi
   stessi valori inline ad ogni apertura: senza !important li sovrascrive.

   Comparsa a hover (":hover"/":focus-within" da tastiera) MA ANCHE tramite
   la classe "lf-submenu-aperto", aggiunta/tolta da custom.js con un piccolo
   ritardo alla chiusura (vedi lì, sezione "Mega menu Prodotti"): il solo
   ":hover" si spegne all'istante appena il mouse esce anche di un pixel dal
   pannello o dal ponte sotto, il che rende il menu troppo fragile da
   raggiungere lungo un percorso reale (non perfettamente verticale). Il
   ritardo via JS da margine di manovra senza dover indovinare pixel esatti.

   "Ponte" invisibile (::after sulla voce "Prodotti"): rete di sicurezza
   aggiuntiva per il solo :hover CSS (utile anche senza JS attivo) - il
   pannello è position:fixed quindi NON è nel flusso subito sotto la voce
   "Prodotti", c'è uno spazio vuoto in mezzo (dalla base della voce, 92px
   da inizio pagina, fino a dove parte il pannello, 144px - numeri da una
   misurazione dal vivo sull'header).

   Il ponte è largo quanto la sola voce "Prodotti" (~101px, non tutto il
   pannello): un tentativo precedente lo allargava quanto il pannello intero
   per coprire i percorsi diagonali verso le colonne più lontane, ma così
   facendo quella fascia invisibile passava anche sotto le ALTRE voci del
   menu (Chi Siamo, Settori, Contatti) - bastava scendere leggermente sopra
   una di quelle per aprire per sbaglio il sottomenu di Prodotti. Ora che il
   ritardo JS copre già i percorsi diagonali, il ponte stretto basta come
   rete di sicurezza per chi si muove dritto verso il basso.
========================================================================== */
@media (min-width: 1025px) {
    .elementor-nav-menu--layout-horizontal .menu-item-has-children::after {
        content: "" !important;
        position: absolute !important;
        top: 100% !important; /* subito sotto la voce "Prodotti" */
        left: 0 !important;
        right: 0 !important;
        height: 60px !important; /* 144 (altezza header) - 92 (base della voce) + margine di sicurezza */
        background: none !important;
        border: 0 !important;
        z-index: 998; /* sotto al pannello (1000), non deve coprirlo quando è aperto */
    }
    /* Pannello del sottomenu: card bianca centrata sotto l'header */
    .elementor-nav-menu--layout-horizontal .menu-item-has-children > .sub-menu.sub-menu {
        display: none;
        position: fixed !important;
        top: 144px !important; /* altezza dell'header, vedi #main-content margin-top */
        left: 0 !important;
        right: 0 !important;
        margin: 0 auto !important; /* stesso centraggio del contenuto dell'header (.e-con-inner), non un transform indipendente */
        transform: none !important; /* neutralizza un transform esterno (non nostro, non identificato con certezza da dove arrivi) che altrimenti sposta il pannello fuori asse - verificato dal vivo */
        width: min(100%, 1217px) !important; /* stessa larghezza "boxed" usata nel resto del sito */
        max-width: min(100%, 1217px) !important;
        background-color: #fff !important;
        border-radius: 24px !important;
        box-shadow: 0 20px 60px 0 rgba(0, 45, 114, 0.18) !important;
        padding: 40px 48px !important;
        border: 0 !important;
        z-index: 1000; /* sopra l'header (z-index 999) e sopra lo sfondo opacizzato */

        /* Griglia: 1a colonna stretta per "Tutti i prodotti" + 3 colonne
           di categorie. 6 righe = 18 categorie / 3 colonne: se il numero
           di categorie cambia, aggiornare "repeat(6, auto)" di conseguenza
           (righe per colonna = categorie totali / 3, arrotondato per eccesso). */
        grid-template-columns: 200px repeat(3, 1fr) !important;
        grid-template-rows: repeat(6, auto) !important;
        grid-auto-flow: column !important;
        column-gap: 48px !important;
        row-gap: 14px !important;
    }
    /* Scatta con :hover/:focus-within (percorso rapido/diretto) OPPURE con
       la classe che gestisce custom.js con il ritardo alla chiusura */
    .elementor-nav-menu--layout-horizontal .menu-item-has-children:hover > .sub-menu.sub-menu,
    .elementor-nav-menu--layout-horizontal .menu-item-has-children:focus-within > .sub-menu.sub-menu,
    .elementor-nav-menu--layout-horizontal .menu-item-has-children.lf-submenu-aperto > .sub-menu.sub-menu {
        display: grid !important;
    }
    .elementor-nav-menu--layout-horizontal .menu-item-has-children > .sub-menu.sub-menu li {
        margin: 0;
        border: none !important; /* Elementor mette un bordo di default sulle voci di .elementor-nav-menu--dropdown (classe condivisa col menu hamburger) */
        box-shadow: none !important;
    }
    .elementor-nav-menu--layout-horizontal .menu-item-has-children > .sub-menu.sub-menu li > a {
        border: none !important;
        box-shadow: none !important;
    }
    /* "Tutti i prodotti": occupa da sola tutta la prima colonna (tutte le
       righe), cosi' le voci categoria non ci finiscono mai sopra */
    .elementor-nav-menu--layout-horizontal .menu-item-has-children > .sub-menu.sub-menu > li:first-child {
        grid-column: 1;
        grid-row: 1 / -1;
        padding-right: 32px;
        border: none !important;
        border-right: 1px solid #EAEEF5 !important;
    }
    .elementor-nav-menu--layout-horizontal .menu-item-has-children > .sub-menu.sub-menu > li:first-child > a {
        color: var(--e-global-color-primary) !important;
        font-weight: 700 !important;
    }
    /* Voci categoria (tutte tranne la prima) */
    .elementor-nav-menu--layout-horizontal .menu-item-has-children > .sub-menu.sub-menu > li a {
        display: block;
        padding: 0;
        color: #1A1A1A;
        font-family: var( --e-global-typography-text-font-family ), Sans-serif;
        font-weight: 500;
        font-size: 15px;
        line-height: 1.4em;
        white-space: normal;
    }
    .elementor-nav-menu--layout-horizontal .menu-item-has-children > .sub-menu.sub-menu > li a:hover {
        color: var(--e-global-color-primary) !important;
    }

    /* Sfondo opacizzato dietro al pannello, sotto il resto della pagina.
       Sempre presente nel DOM (con opacity:0) cosi' la comparsa/scomparsa
       e' animata; la classe che la attiva ("lf-menu-overlay-attivo") viene
       aggiunta/rimossa dal body via JS in custom.js al passaggio del mouse
       sulla voce "Prodotti" */
    body::after {
        content: "";
        position: fixed;
        top: 144px;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: rgba(4, 20, 45, 0.45);
        opacity: 0;
        pointer-events: none;
        z-index: 500; /* sotto l'header (999) e sotto il pannello (1000) */
        transition: opacity 0.25s ease;
    }
    body.lf-menu-overlay-attivo::after {
        opacity: 1;
    }
}

/* ==========================================================================
   FOOTER
========================================================================== */
.button-like p {
    background-color: #fff;
    border-radius: 64px;
    padding: 8px 20px;
    color: #004BBC;
    font-weight: 600;
    font-size: 16px;
    line-height: 1.5em;
    display: inline-block;
    margin: 0;
}
.footer-columns h6 {
    font-weight: 500;
    font-size: 14px;
    line-height: 1.1em;
    border-bottom: 1px solid #D6E2FF80;
    padding-bottom: 23px;
    margin-bottom: 23px;
    margin-top: 30px;
    color: #fff!important;
}
.footer-columns a {
    color: #D6E2FF!important;
    text-decoration: none;
}
.footer-columns a:hover {
    text-decoration: underline!important;
}
.wc-custom-product-categories {
    margin: 0;
    padding: 0;
    list-style-type: none;
    column-count: 2;
}
.wc-custom-product-categories li {
    margin-bottom: 8px;
}

/* ==========================================================================
   CONTENT / MAIN (#main-content)
========================================================================== */
#main-content {
    margin-top: 144px;
    display: flow-root;
}
/* Quando .curve-top è il primissimo elemento della pagina (es. inizio del
   template prodotto/archivio), il suo margin-top negativo lo fa sporgere
   sopra #main-content, finendo sotto l'header fisso - qui non deve
   sovrapporsi a nulla perché non c'è nulla sopra, quindi lo azzero */
#main-content > [data-elementor-type] > .curve-top:first-child {
    margin-top: 0 !important;
}
#main-content h1, #main-content h2, #main-content h3, #main-content h4, #main-content h5, #main-content h6 {
    margin: 0 0 15px 0;
} 
#main-content .elementor-widget-text-editor p,
#main-content .elementor-widget-text-editor ul,
#main-content .elementor-widget-text-editor ol {
    margin: 0 0 10px 0;
}
#main-content .elementor-widget-text-editor ul,
#main-content .elementor-widget-text-editor ol {
    padding-left: 15px;
}
#main-content .invert, #main-content .invert *:not(span) {
    color: #fff!important;
}
#main-content .elementor-button {
    background-color: #004BBC;
    border: 2px solid #004BBC;
    padding: 14px 26px;
    border-radius: 64px;
}
#main-content .elementor-button:hover {
    padding-left: 32px;
    padding-right: 32px;
}
#main-content .invert .elementor-button {
    background-color: #fff;
    border-color: #fff;
}
#main-content .elementor-button .elementor-button-text {
    font-family: var( --e-global-typography-text-font-family ), Sans-serif;
    font-weight: 600;
    font-size: 16px;
    line-height: 1.5em;
    color: #C3DBFF;
}
#main-content .invert .elementor-button .elementor-button-text {
    color: #004BBC;
}
.star.star {
    position: relative!important;
    display: flex!important;
    align-items: center!important;
    gap: 0!important;
}
.star, .star p {
    font-weight: 500;
    font-size: 14px;
    color: #004BBC;
    line-height: 1.5em;
}
.star.star p {
    margin: 0!important;
}
.star::before {
    position: static;
    margin: 0 12px 0 0;
    content: "";
    width: 28px;
    height: 28px;
    flex-shrink: 0;
    display: block;
    background-image: url('data:image/svg+xml,<svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="28" height="28" rx="14" fill="%2393BEFF"/><path d="M13.8714 7C14.3309 7.32326 14.4425 7.75029 14.7053 8.313C16.3768 11.9008 17.6721 12.6371 21 13.976C20.4857 14.1916 19.9752 14.4131 19.4665 14.6405C16.3277 16.0533 15.3368 17.8672 14.1437 21C13.8431 20.8344 13.9414 20.9581 13.8033 20.6169C12.1488 16.5422 10.6683 15.4686 7 13.9621C10.9992 12.3039 12.285 11.39 13.8714 7Z" fill="%234287F1"/></svg>');
}

/* ==========================================================================
   SWIPER SLIDER (HERO)
========================================================================== */
.swiper-slider {
    position: relative;
    width: 100%;
    overflow: hidden;
}
.swiper-slider .swiper-slide {
    position: relative;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 540px;
    padding-top: 96px;
    padding-bottom: 96px;
}
.swiper-slider .slide-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1;
}
.swiper-slider .slide-content {
    position: relative;
    z-index: 2;
    text-align: center;
    max-width: 862px;
    padding: 0 20px;
    color: #fff;
}
.swiper-slider .slide-title {
    color: #fff;
    font-size: 48px;
    font-weight: 600;
    line-height: 1.2;
    margin: 0; /* h1 e h3 hanno margini di default diversi nel browser: azzerato per non cambiare aspetto passando da h3 a h1 */
    padding-left: 20px;
    padding-right: 20px;
}
.swiper-slider .slide-description {
    color: #fff;
    line-height: 1.5em;
    margin-bottom: 32px;
    padding-left: 20px;
    padding-right: 20px;
}
.swiper-slider .slide-buttons-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    flex-wrap: wrap;
}
.swiper-slider .btn {
    display: inline-block;
    padding: 16px 30px;
    border-radius: 64px;
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
}
.swiper-slider .btn:hover {
    padding-left: 36px;
    padding-right: 36px;
}
.swiper-slider .btn-primary {
    background-color: #fff;
    color: #004BBC;
    border: 2px solid #fff;
}
.swiper-slider .btn-primary:hover {
    background-color: #fff;
    border-color: #fff;
}
.swiper-slider .btn-secondary {
    background-color: transparent;
    color: #fff;
    border: 2px solid #fff;
}
.swiper-slider .swiper-button-prev, .swiper-slider .swiper-button-next {
    background-image: url('data:image/svg+xml,<svg width="15" height="24" viewBox="0 0 15 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12 24L0 12L12 0L14.8 2.8L5.6 12L14.8 21.2L12 24Z" fill="white"/></svg>');
    background-size: contain;
    height: 24px;
    width: 15px;
    background-position: center;
    background-repeat: no-repeat;
}
.swiper-slider .swiper-button-prev {
    left: 92px;
}
.swiper-slider .swiper-button-prev::after, .swiper-slider .swiper-button-next::after {
    display: none;
}
.swiper-slider .swiper-button-next {
    right: 92px;
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
}


/* ==========================================================================
   SWIPER PRODUCT CATEGORIES
========================================================================== */
.swiper-product-categories {
    width: calc(100% - 96px);
}
.swiper-product-categories .category-card {
    display: block;
    background: #fff;
    border-radius: 16px;
    padding: 8px;
    position: relative;
    text-decoration: none;
    overflow: hidden;
}
.swiper-product-categories .category-badge {
    position: absolute;
    top: 8px;
    left: 8px;
    width: 36px;
    height: 36px;
    z-index: 2;
    background-image: url('data:image/svg+xml,<svg width="37" height="36" viewBox="0 0 37 36" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="37" height="36" rx="8" fill="%23004BBC"/><path d="M18.3071 8C18.9963 8.4618 19.1637 9.07184 19.5579 9.87572C22.0652 15.0011 24.0081 16.053 29 17.9658C28.2285 18.2736 27.4627 18.5901 26.6998 18.9151C21.9915 20.9333 20.5053 23.5245 18.7156 28C18.2646 27.7634 18.4121 27.9401 18.205 27.4527C15.7232 21.6317 13.5024 20.0981 8 17.9458C13.9988 15.577 15.9275 14.2714 18.3071 8Z" fill="%23C3DBFF"/></svg>');
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}
.swiper-product-categories .category-card:hover .category-badge {
    transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
}
.swiper-product-categories .category-image-wrapper {
    width: 100%;
    height: 156px;
    border-radius: 8px;
    overflow: hidden;
}
.swiper-product-categories .category-image-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.swiper-product-categories .category-info {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 12px;
}
.swiper-product-categories .category-title {
    font-size: 16px;
    font-weight: 600;
    color: #004BBC;
    line-height: 1.5em;
    display: flex;
    align-items: center;
}
.swiper-product-categories .category-arrow {
    color: #004BBC;
    display: flex;
    align-items: center;
}
.swiper-product-categories-parent .swiper-button-prev, .swiper-product-categories-parent .swiper-button-next {
    background-image: url('data:image/svg+xml,<svg width="10" height="16" viewBox="0 0 10 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M8 16L0 8L8 0L9.86667 1.86667L3.73333 8L9.86667 14.1333L8 16Z" fill="white"/></svg>');
    background-size: contain;
    width: 10px;
    height: 16px;
    background-position: center;
    background-repeat: no-repeat;
    top: calc(50% + 8px);
}
.swiper-product-categories-parent .swiper-button-prev {
    left: 0;
}
.swiper-product-categories-parent .swiper-button-prev::after, .swiper-product-categories-parent .swiper-button-next::after {
    display: none;
}
.swiper-product-categories-parent .swiper-button-next {
    right:0;
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
}

/* ==========================================================================
   SECTORS GRID
========================================================================== */
.sectors-grid-container {
    display: grid;
    grid-template-columns: repeat(4, 1fr); 
    gap: 16px;
    width: 100%;
    box-sizing: border-box;
}
.sector-card {
    cursor: default;
    position: relative;
    background-color: #dbe7ff;
    border-radius: 12px;
    padding: 8px 8px 20px 8px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-decoration: none !important;
    box-sizing: border-box;
}
.sector-card:hover .sector-badge {
    transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
}
.sector-card .sector-badge {
    position: absolute;
    top: 8px;
    left: 8px;
    width: 36px;
    height: 36px;
    background-image: url('data:image/svg+xml,<svg width="37" height="36" viewBox="0 0 37 36" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="37" height="36" rx="8" fill="%2393BEFF"/><path d="M18.3071 8C18.9963 8.4618 19.1637 9.07184 19.5579 9.87572C22.0652 15.0011 24.0081 16.053 29 17.9658C28.2285 18.2736 27.4627 18.5901 26.6998 18.9151C21.9915 20.9333 20.5053 23.5245 18.7156 28C18.2646 27.7634 18.4121 27.9401 18.205 27.4527C15.7232 21.6317 13.5024 20.0981 8 17.9458C13.9988 15.577 15.9275 14.2714 18.3071 8Z" fill="%23004BBC"/></svg>');
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}
.sector-card .sector-image-wrapper {
    width: 148px;
    height: 148px;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.sector-card .sector-image-wrapper img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}
.sector-card h4.sector-title {
    color: #004BBC;
    font-size: 16px;
    font-weight: 600;
    margin: 0!important;
    text-align: center;
    line-height: 1.5em;
}

/* ==========================================================================
   COUNTER
========================================================================== */
.elementor-widget-counter {
    background-color: #004BBC;
    border-radius: 16px;
    padding: 26px 10px;
}
.elementor-counter-number, .elementor-counter-number-prefix, .elementor-counter-title {
    color: #D6E2FF;
    font-family: var( --e-global-typography-text-font-family ), Sans-serif!important;
    font-size: 48px;
    font-weight: 600;
}
.elementor-counter-number-prefix {
    padding-right: 14px;
}
.elementor-counter-title {
    color: #fff!important;
    font-size: 16px!important;
    line-height: 1.5em!important;
    font-weight: 400!important;
    margin-top: 20px!important;
}

/* ==========================================================================
   SWIPER BRANDS
========================================================================== */
.swiper-brands {
    position: relative;
    width: calc(100% - 96px);
    box-sizing: border-box;
}
.swiper-brands .swiper-slide {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 60px; 
}
.brand-item {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    text-decoration: none;
}
.brand-item img {
    max-width: 80%;
    max-height: 100%;
    object-fit: contain;
}
.swiper-brands-parent .swiper-button-prev, .swiper-brands-parent .swiper-button-next {
    background-image: url('data:image/svg+xml,<svg width="10" height="16" viewBox="0 0 10 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M8 16L0 8L8 0L9.86667 1.86667L3.73333 8L9.86667 14.1333L8 16Z" fill="black"/></svg>');
    background-size: contain;
    width: 10px;
    height: 16px;
    background-position: center;
    background-repeat: no-repeat;
    top: calc(50% + 14px);
}
.swiper-brands-parent .swiper-button-prev {
    left: 0;
}
.swiper-brands-parent .swiper-button-prev::after, .swiper-brands-parent .swiper-button-next::after {
    display: none;
}
.swiper-brands-parent .swiper-button-next {
    right:0;
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
}

/* ##################################################
   ##   LF DESIGN
   ################################################## */
/* Shortcode [preventivo-contatore] - pallino numerico da mettere dentro/accanto
   a .wc-custom-quote-button (l'icona preventivo in header). Serve position:relative
   sull'icona perché il pallino si posizioni correttamente rispetto a lei. */
.wc-custom-quote-button {
    position: relative;
}
.preventivo-contatore {
    position: absolute;
    top: -8px;
    right: -10px;
    min-width: 18px;
    height: 18px;
    padding: 0 4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: var( --e-global-color-primary );
    color: #fff;
    font-family: var( --e-global-typography-text-font-family ), Sans-serif;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    border-radius: 50%;
    border: 2px solid #fff;
}

/* Shortcode [back-top-shop] - stesse caratteristiche di "Torna al negozio" in Richiedi Preventivo */
.back-top-shop-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: Montserrat, sans-serif;
    font-weight: 600;
    font-size: 16px;
    line-height: 150%;
    color: var( --e-global-color-primary );
    text-decoration: none;
    -webkit-transition: opacity 0.3s ease-in-out;
    transition: opacity 0.3s ease-in-out;
}
.back-top-shop-link::before {
    content: "";
    display: inline-block;
    width: 8px;
    height: 8px;
    border-left: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
    flex-shrink: 0;
}
.back-top-shop-link:hover {
    opacity: 0.8;
}

/* Richiedi Preventivo [yith_ywraq_request_quote] - layout 2 colonne */
.ywraq-form-table-wrapper.wide {
    display: flex!important;
    flex-wrap: nowrap!important;
    gap: 60px;
    align-items: flex-start;
}
.ywraq-form-table-wrapper.wide #yith-ywraq-form,
.ywraq-form-table-wrapper.wide .yith-ywraq-mail-form-wrapper {
    flex: 1 1 45%!important;
}
.ywraq-form-table-wrapper.wide #yith-ywraq-form {
    min-width: 300px;
}
.ywraq-form-table-wrapper.wide .yith-ywraq-mail-form-wrapper {
    min-width: 300px;
    background-color: #F5F5F5;
    border-radius: 24px;
    padding: 30px;
    box-sizing: border-box;
}

/* Tabella prodotti (colonna sinistra) */
#yith-ywrq-table-list {
    width: 100%;
    border-collapse: collapse;
    border: none!important;
}
#yith-ywrq-table-list thead tr {
    border-bottom: 1px solid #CCCCCC;
}
#yith-ywrq-table-list tbody tr {
    border-top: 1px solid #CCCCCC;
    border-bottom: 1px solid #CCCCCC;
}
#yith-ywrq-table-list thead th {
    text-align: left;
    font-weight: 600;
    font-size: 16px;
    padding: 0 0px 12px 0px!important;
    border: none!important;
}
#yith-ywrq-table-list thead th.product-quantity {
    text-align: right;
}
#yith-ywrq-table-list tbody td {
    padding: 20px 8px;
    vertical-align: middle;
    border: none!important;
}
#yith-ywrq-table-list .product-thumbnail img {
    max-width: 80px;
    height: auto;
}
#yith-ywrq-table-list .product-name a {
    color: var( --e-global-color-primary );
    font-weight: 400;
    font-size: 16px;
    text-decoration: none;
}
#yith-ywrq-table-list .product-name small {
    color: var( --e-global-color-primary );
    font-weight: 600;
    font-size: 14px;
}
/* Lista attributi (es. Dimensione/Formato) sotto al nome prodotto: il markup
   arriva così dal template YITH (margin-left inline + <br> tra le voci), non
   è generato da noi - qui sovrascriviamo solo l'aspetto via CSS. */
#yith-ywrq-table-list .product-name ul {
    margin-left: 0 !important;
    font-size: 14px;
}
#yith-ywrq-table-list .product-name ul br {
    display: none;
}
#yith-ywrq-table-list .product-quantity {
    font-weight: 600;
    font-size: 16px;
}
#yith-ywrq-table-list input.qty {
    width: 70px;
    padding: 6px;
    border: 1px solid #CCCCCC;
    border-radius: 6px;
}
#yith-ywrq-table-list input.qty::-webkit-outer-spin-button,
#yith-ywrq-table-list input.qty::-webkit-inner-spin-button {
    -webkit-appearance: auto;
    opacity: 1;
    transform: scale(0.85);
    transform-origin: right center;
}
#yith-ywrq-table-list input.qty {
    -moz-appearance: auto;
    appearance: auto;
}

/* Link "Torna al negozio" */
.yith-ywraq-before-table-wc-backward {
    background: none!important;
    border: none!important;
    padding: 0!important;
    display: inline-flex!important;
    align-items: center!important;
    gap: 8px!important;
    font-family: Montserrat, sans-serif!important;
    font-weight: 600!important;
    font-size: 16px!important;
    line-height: 150%!important;
    color: var( --e-global-color-primary )!important;
    text-decoration: none!important;
    -webkit-transition: opacity 0.3s ease-in-out;
    transition: opacity 0.3s ease-in-out;
}
.yith-ywraq-before-table-wc-backward::before {
    content: "";
    display: inline-block;
    width: 8px;
    height: 8px;
    border-left: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
    flex-shrink: 0;
}
.yith-ywraq-before-table-wc-backward:hover {
    opacity: 0.8;
}
#yith-ywrq-table-list .yith-ywraq-item-remove {
    color: var( --e-global-color-primary )!important;
}
.woocommerce a.remove:hover {
    color: var( --e-global-color-primary )!important;
    background: #fff!important;
}
#yith-ywraq-form table {
    margin-top: 30px!important;
    margin-bottom: 10px;
}

/* Bottoni sotto la tabella: Guarda PDF (outline) + Aggiorna (pieno) - stesso stile di .elementor-button in home */
.update-list-wrapper {
    display: flex!important;
    justify-content: space-between;
    align-items: center;
    margin-top: 20px;
}
.update-list-wrapper input.button,
.update-list-wrapper #ywraq-list-to-pdf,
.update-list-wrapper button.ywraq_clean_list.ywraq_clean_list {
    font-family: var( --e-global-typography-text-font-family ), Sans-serif;
    font-weight: 600;
    font-size: 16px;
    line-height: 1.5em;
    padding: 14px 26px;
    border-radius: 64px;
    cursor: pointer;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.update-list-wrapper input.button:hover,
.update-list-wrapper #ywraq-list-to-pdf:hover,
.update-list-wrapper button.ywraq_clean_list.ywraq_clean_list:hover {
    padding-left: 32px;
    padding-right: 32px;
}
.update-list-wrapper input.button {
    order: 2;
    background-color: var( --e-global-color-primary );
    border: 2px solid var( --e-global-color-primary );
    color: #C3DBFF;
}
#yith-ywraq-form .update-list-wrapper input[type="submit"] {
    margin-right: 0;
    margin-top: 0px!important;
}
#yith-ywraq-form .update-list-wrapper input[type="submit"]:hover {
    background-color: #fff;
    color: var( --e-global-color-primary );
}
.update-list-wrapper .after-table-right {
    order: 1;
    display: flex;
    gap: 12px;
}
.update-list-wrapper #ywraq-list-to-pdf,
.update-list-wrapper button.ywraq_clean_list.ywraq_clean_list {
    background: transparent;
    color: var( --e-global-color-primary );
    border: 2px solid var( --e-global-color-primary );
}

/* Link "Torna al negozio" (mostrato quando la lista preventivo è vuota) - stesso stile ghost */
.return-to-shop a.wc-backward.wc-backward {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    font-family: var( --e-global-typography-text-font-family ), Sans-serif;
    font-weight: 600;
    font-size: 16px;
    line-height: 1.5em;
    text-decoration: none;

    padding: 14px 26px;
    border-radius: 64px;
    cursor: pointer;

    background: transparent;
    color: var( --e-global-color-primary );
    border: 2px solid var( --e-global-color-primary );

    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.return-to-shop a.wc-backward.wc-backward:hover {
    padding-left: 32px;
    padding-right: 32px;
}

/* Box form di richiesta (colonna destra) */
.yith-ywraq-mail-form-wrapper h3 {
    color: #404040!important;
    font-size: 19px!important;
    font-weight: 700!important;
    margin-top: 0!important;
    margin-bottom: 24px!important;
    padding-bottom: 24px!important;
    border-bottom: 1px solid #CCCCCC!important;
}
.yith-ywraq-mail-form-wrapper form {
    display: flex;
    flex-wrap: wrap;
    gap: 0 20px;
}
.yith-ywraq-mail-form-wrapper .form-row {
    flex: 1 1 45%;
    margin-bottom: 20px;
}
.yith-ywraq-mail-form-wrapper .form-row:has(textarea),
.yith-ywraq-mail-form-wrapper .form-row-wide {
    flex-basis: 100%;
}
.yith-ywraq-mail-form-wrapper label {
    display: block;
    color: #404040;
    font-weight: 600;
    font-size: 14px;
    margin-bottom: 6px;
}
.yith-ywraq-mail-form-wrapper .input-text,
.yith-ywraq-mail-form-wrapper textarea {
    width: 100%;
    min-height: 40px;
    padding: 12px 14px;
    border: 1px solid #CCCCCC!important;
    border-radius: 0!important;
    box-sizing: border-box;
    font-family: inherit;
}
.yith-ywraq-mail-form-wrapper .raq-send-request-row {
    text-align: right;
}
.yith-ywraq-mail-form-wrapper .raq-send-request {
    font-family: var( --e-global-typography-text-font-family ), Sans-serif!important;
    font-weight: 600!important;
    font-size: 16px!important;
    line-height: 1.5em!important;
    background-color: var( --e-global-color-primary )!important;
    border: 2px solid var( --e-global-color-primary )!important;
    color: #C3DBFF!important;
    border-radius: 64px!important;
    padding: 14px 26px!important;
    cursor: pointer;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.yith-ywraq-mail-form-wrapper .raq-send-request:hover {
    padding-left: 32px!important;
    padding-right: 32px!important;
    background-color: #fff!important;
    color: var( --e-global-color-primary )!important;
}

/* Checkbox privacy */
.yith-ywraq-mail-form-wrapper input[type="checkbox"] {
    width: 20px;
    height: 20px;
    cursor: pointer;
    vertical-align: middle;
}
.yith-ywraq-mail-form-wrapper .ywraq_acceptance_label {
    display: inline-block;
    vertical-align: middle;
    margin-bottom: 0;
}

.wp-block-post.product a.button,
.wp-block-post.product .add-request-quote-button.button,
.wp-block-post.product .add-request-quote-button-addons.button,
.woocommerce .add-request-quote-button.button, .woocommerce .add-request-quote-button-addons.button {
    background-color: #004BBC!important;
}

/* Variante a 3 colonne di .sectors-grid-container, usata dallo shortcode [sector_public].
   Tablet/mobile hanno il proprio override esplicito (vedi RESPONSIVE - TABLET/MOBILE):
   la doppia classe qui ha una specificità più alta della regola singola dentro le media
   query, quindi senza un override dedicato lì restava sempre su 3 colonne. */
.sectors-grid-container.sectors-grid-container--3col {
    grid-template-columns: repeat(3, 1fr);
}

/* Fade in su tutti i titoli h1/h2/h3 al caricamento della pagina */
@-webkit-keyframes lf-fade-in {
    from { opacity: 0; -webkit-transform: translateY(35px); transform: translateY(35px); }
    to { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); }
}
@keyframes lf-fade-in {
    from { opacity: 0; transform: translateY(35px); }
    to { opacity: 1; transform: translateY(0); }
}
h1, h2, h3 {
    -webkit-animation: lf-fade-in 1.1s ease-out;
    animation: lf-fade-in 1.1s ease-out;
}

/* Duplicato di curve-right/curve-left, ma con il colore della curva legato a var(--e-global-color-primary)
   (una CSS var non può stare dentro il fill di una data-URI, quindi la forma è usata come maschera
   e il colore è applicato con background-color, che invece supporta le variabili) */
.curve-blu-right, .curve-blu-left {
    position: relative;
    z-index: 2!important;
    height: 100%!important;
}
.curve-blu-left::after,
.curve-blu-right::after {
    position: absolute;
    top: -10px;
    content: "";
    display: block;
    width: 32px;
    height: calc(100% + 10px);
    background-color: var( --e-global-color-primary );
    -webkit-mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 33 468" preserveAspectRatio="none" fill="none"><path d="M0 0C29.6067 52.3924 56.3984 298.537 0 468V0Z" fill="black"/></svg>');
    mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 33 468" preserveAspectRatio="none" fill="none"><path d="M0 0C29.6067 52.3924 56.3984 298.537 0 468V0Z" fill="black"/></svg>');
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
}
.curve-blu-right::after {
    right: -32px;
}
.curve-blu-left::after {
    left: -32px;
    transform: scaleX(-1);
}

/* Badge a stella generico - riutilizzabile in qualunque contenitore con position:relative
   (i box settori e lo swiper prodotti hanno le loro varianti scoped più sotto/altrove) */
.category-badge {
    position: absolute;
    top: 20px;
    left: 20px;
    width: 36px;
    height: 36px;
    z-index: 2;
    background-image: url('data:image/svg+xml,<svg width="37" height="36" viewBox="0 0 37 36" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="37" height="36" rx="8" fill="%23004BBC"/><path d="M18.3071 8C18.9963 8.4618 19.1637 9.07184 19.5579 9.87572C22.0652 15.0011 24.0081 16.053 29 17.9658C28.2285 18.2736 27.4627 18.5901 26.6998 18.9151C21.9915 20.9333 20.5053 23.5245 18.7156 28C18.2646 27.7634 18.4121 27.9401 18.205 27.4527C15.7232 21.6317 13.5024 20.0981 8 17.9458C13.9988 15.577 15.9275 14.2714 18.3071 8Z" fill="%23C3DBFF"/></svg>');
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.category-badge:hover {
    transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
}
/* Pagina Prodotto Singolo: l'icona ruota anche passando sopra tutta l'immagine
   (che qui è lo sfondo dello stesso contenitore dell'icona, non un tag <img>),
   non solo sopra l'icona stessa */
.elementor-element-4835a28 {
    cursor: pointer;
}
.elementor-element-4835a28:hover .category-badge {
    transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
}
.category-badge.category-badge--right {
    left: auto;
    right: 20px;
}
.category-badge.category-badge--left {
    left: 20px;
    right: auto;
}

/* Padding responsive: 36px desktop / 24px tablet / 0px mobile */
.padding-36 {
    padding: 36px!important;
}

/* Allinea il testo al bordo della griglia standard del sito (1217px, centrata) su schermi molto larghi,
   lasciando invariato lo sfondo full-bleed della colonna. Da usare insieme a .padding-36 */
.grid-align.grid-align {
    max-width: 100%;
    padding-left: max(36px, calc((100vw - 1217px) / 2))!important;
}

/* Margini negativi */
.margin-bottom-negative-10 {
    margin-bottom: -10px!important;
}
.margin-bottom-negative-20 {
    margin-bottom: -20px!important;
}
/* Spaziatura di default per tutti i bottoni (Elementor Button widget) */
.elementor-widget-button {
    margin: 5px 0 20px 0!important;
}
/* Bordatura tondeggiante contenitori (es. box "Chi Siamo") */
.rounded-24 {
    border-radius: 24px!important;
}

/* Box Settori - shortcode [sector_page] */
.sector-box-row {
    display: flex;
    align-items: stretch;
    margin-bottom: 24px;
}
.sector-box-row .sector-box-text {
    width: 50%;
    padding: 64px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 16px;
    background-color: #D1E3FF;
}
.sector-box-row .sector-box-icon {
    position: relative;
    width: 50%;
    background-color: #93BEFF;
    display: flex;
    align-items: center;
    justify-content: center;
}
.sector-box-row .sector-box-icon .category-badge {
    position: absolute;
    top: 20px;
    left: 20px;
    width: 36px;
    height: 36px;
    z-index: 2;
    background-image: url('data:image/svg+xml,<svg width="37" height="36" viewBox="0 0 37 36" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="37" height="36" rx="8" fill="%23004BBC"/><path d="M18.3071 8C18.9963 8.4618 19.1637 9.07184 19.5579 9.87572C22.0652 15.0011 24.0081 16.053 29 17.9658C28.2285 18.2736 27.4627 18.5901 26.6998 18.9151C21.9915 20.9333 20.5053 23.5245 18.7156 28C18.2646 27.7634 18.4121 27.9401 18.205 27.4527C15.7232 21.6317 13.5024 20.0981 8 17.9458C13.9988 15.577 15.9275 14.2714 18.3071 8Z" fill="%23C3DBFF"/></svg>');
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.sector-box-row .sector-box-icon--right .category-badge {
    left: auto;
    right: 20px;
}
.sector-box-row .sector-box-icon:hover .category-badge {
    transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
}
.sector-box-row .sector-box-icon img {
    max-width: 200px;
    width: 100%;
    height: auto;
}
.sector-box-description {
    font-weight: 700;
    color: #1a1a1a;
    /* margin: 0!important; */
    margin-bottom: 20px;
    margin-top: 0px!important;
}
.sector-box-text .sup-title p {
    color: var( --e-global-color-primary );
}

.white-b b,
.white-b strong {
    color: #8cbaff !important;
    font-weight: 600;
}
.dark-b b,
.dark-b strong {
    color: #004bbc !important;
    font-weight: 600;
}
/* Override per battere #main-content .invert (che usa !important) */
/* copre sia il caso "annidato" (.invert > .white-b) sia "stessa tag" (.invert.white-b) */
#main-content .invert .white-b.white-b b,
#main-content .invert .white-b.white-b strong,
#main-content .invert.white-b.white-b b,
#main-content .invert.white-b.white-b strong {
    color: #8cbaff !important;
}
#main-content .invert .dark-b.dark-b b,
#main-content .invert .dark-b.dark-b strong,
#main-content .invert.dark-b.dark-b b,
#main-content .invert.dark-b.dark-b strong {
    color: #004bbc !important;
}
/* Sopratitolo */
.sup-title p{
    font-family: var( --e-global-typography-text-font-family ), Sans-serif;
    font-weight: 600;
    font-size: 16px;
    line-height: 1.5em;
    color: #93BEFF;
}
.height-min {
    min-height: 500px!important;
}
.effetto-ombra-blu {
  background-color: #ffffff;
  box-shadow: 0 0 32px 0 rgba(0, 45, 114, 0.2);
}

/* Shortcode [blocco_preventivo] - blocco descrizione prodotto, codice, attributi e bottone "Aggiungi al preventivo" nella pagina prodotto singolo */
.lf-blocco-preventivo {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 30px;
  margin-top: 10px;
}

/* Titolo prodotto: azzero il margine di default per uniformare lo spazio col blocco sotto */
.product_title.elementor-heading-title {
  margin: 0 !important;
}

/* Descrizione prodotto */
.lf-blocco-preventivo__descrizione {
  color: var(--e-global-color-primary);
}
.lf-blocco-preventivo__descrizione p {
  margin: 0;
}

/* Codice SKU (+ eventuale attributo singolo in linea) */
.lf-blocco-preventivo__sku {
  color: var(--e-global-color-primary);
  font-weight: 700;
  margin: 0;
}

/* Attributi multipli, quando non c'è un solo valore da mettere in linea col codice */
.lf-blocco-preventivo__attributi {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 0;
}
.lf-blocco-preventivo__attributo-riga {
  color: var(--e-global-color-primary);
}

/* Form di selezione variazioni (prodotti variabili) */
.lf-blocco-preventivo__variazioni {
  width: 100%;
}
.lf-blocco-preventivo__variazioni table.variations,
.lf-blocco-preventivo__variazioni table.variations tbody,
.lf-blocco-preventivo__variazioni table.variations tr,
.lf-blocco-preventivo__variazioni table.variations th,
.lf-blocco-preventivo__variazioni table.variations td {
  display: block;
  width: 100%;
}
.lf-blocco-preventivo__variazioni table.variations {
  border-collapse: collapse;
  margin: 0 0 15px 0;
}
.lf-blocco-preventivo__variazioni table.variations th {
  text-align: left;
  color: var(--e-global-color-primary);
  font-weight: 700;
  padding: 0 0 8px 0 !important;
}
.lf-blocco-preventivo__variazioni table.variations td {
  padding: 0;
}
.lf-blocco-preventivo__variazioni select {
  width: 100%;
  min-height: 40px;
  padding: 8px 12px;
  border: 1px solid #CCCCCC;
  border-radius: 8px;
  font-family: Montserrat, sans-serif;
  font-size: 14px;
  font-weight: 400;
}

/* Nasconde quantità e bottone nativi di WooCommerce dentro al form variazioni:
   il bottone "Aggiungi al preventivo" vero è già sotto (.lf-blocco-preventivo__bottone).
   Nasconde anche il blocco che YITH inietta in automatico dentro al form variazioni
   (bottone duplicato + tutti i suoi messaggi di risposta "Prodotto aggiunto"/"Vai alla lista")
   e i contenitori vuoti di descrizione/prezzo/disponibilità variazione, che pur restando
   vuoti (i prezzi sono nascosti in tutto il sito) portano comunque margini/padding propri
   e lasciano spazio bianco - qui sotto resta visibile solo il select. */
.lf-blocco-preventivo__variazioni .quantity,
.lf-blocco-preventivo__variazioni .single_add_to_cart_button,
.lf-blocco-preventivo__variazioni button[type="submit"],
.lf-blocco-preventivo__variazioni .yith-ywraq-add-to-quote,
.lf-blocco-preventivo__variazioni .woocommerce-variation-description,
.lf-blocco-preventivo__variazioni .woocommerce-variation-price,
.lf-blocco-preventivo__variazioni .woocommerce-variation-availability,
.lf-blocco-preventivo__variazioni .reset_variations {
  display: none !important;
}
.lf-blocco-preventivo__variazioni .single_variation_wrap,
.lf-blocco-preventivo__variazioni .woocommerce-variation,
.lf-blocco-preventivo__variazioni .variation_add_to_cart_button {
  margin: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
}
.woocommerce div.product form.cart {
  margin-bottom: 0em !important;
}

/* Rimuove eventuali spazi aggiunti da YITH */
.lf-blocco-preventivo__bottone,
.lf-blocco-preventivo__bottone .yith-ywraq-add-to-quote,
.lf-blocco-preventivo__bottone .yith-ywraq-add-button {
  margin: 0;
}

/* Pulsante Aggiungi al preventivo - porta anche la classe .elementor-button
   (iniettata in PHP), quindi eredita colore, border-radius ed effetto hover
   dallo stile reale usato in home. Qui sovrascrivo solo le misure specifiche
   di questo bottone (spec: altezza 56px, padding 16/24, font 18px/600, gap 8px)
   e aggiungo il simbolo + che elementor-button di suo non ha.
   Il display NON ha !important apposta: quando YITH nasconde il bottone
   (perché la variazione è già in lista) lo fa con uno style="display:none"
   inline, che un !important esterno bloccherebbe. Per vincere comunque contro
   il CSS normale di YITH quando il bottone è visibile, alzo la specificità del
   selettore invece di usare !important (stessa tecnica delle card della griglia). */
.lf-blocco-preventivo__bottone .add-request-quote-button.add-request-quote-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 56px;
  padding: 16px 24px !important;
  font-size: 18px !important;
  font-weight: 600 !important;
}
/* Il padding !important qui sopra blocca l'hover di .elementor-button (che non ha !important),
   quindi lo riscrivo esplicitamente per farlo funzionare comunque */
.lf-blocco-preventivo__bottone .add-request-quote-button:hover {
  padding-left: 32px !important;
  padding-right: 32px !important;
}

/* Simbolo + */
.lf-blocco-preventivo__bottone .add-request-quote-button::after {
  content: "+";
  display: inline-block;
  font-size: 30px;
  font-weight: 500;
  line-height: 0.7;
}

/* Link "Vai alla lista" mostrato dopo l'aggiunta al preventivo - stesso stile
   ghost di "Visualizza PDF" (bordo/testo primary, sfondo trasparente, hover che si allarga) */
.lf-blocco-preventivo__bottone
.yith_ywraq_add_item_browse_message a {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;

  background: transparent;
  color: var(--e-global-color-primary);
  border: 2px solid var(--e-global-color-primary);
  border-radius: 64px;
  padding: 14px 26px;

  font-family: var(--e-global-typography-text-font-family), Sans-serif;
  font-weight: 600;
  font-size: 16px;
  line-height: 1.5em;
  text-decoration: none !important;

  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.lf-blocco-preventivo__bottone
.yith_ywraq_add_item_browse_message a:hover {
  padding-left: 32px;
  padding-right: 32px;
}

/* Messaggi mostrati dopo il click su Aggiungi al preventivo:
   "Prodotto aggiunto alla lista" e "Questo prodotto è già stato inserito..." */
.lf-blocco-preventivo__bottone .yith_ywraq_add_item_response_message,
.lf-blocco-preventivo__bottone .yith_ywraq_add_item_product_message {
  /* border: 2px solid #004bbc; */
  /* padding: 20px; */
  /* background-color: #004bbc; */
  /* border-radius: 24px; */
  /* color: #fff; */
  margin-bottom: 20px;
  margin-top: -10px;
  font-size: 14px;
}

/* Nasconde l'icona di caricamento quando non attiva */
.lf-blocco-preventivo__bottone .ajax-loading {
  width: 18px;
  height: 18px;
  margin-left: 10px;
}
.woocommerce ul.products li.product a.add-request-quote-button.button, .wp-block-post.product a.add-request-quote-button.button, a.add-request-quote-button.button {
    margin-top: 0rem!important;
}
.woocommerce div.product form.cart .variations {
    margin-bottom: 0em!important;
}

/* Shortcode [product_grid] - griglia prodotti con "Mostra altri prodotti" via AJAX */
.lf-griglia-prodotti__elenco {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    align-items: stretch;
    gap: 24px;
}
.lf-prodotto-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    background-color: #fff;
    border-radius: 24px!important;
    overflow: hidden;
    box-shadow: 0 0 32px 0 rgba(0, 45, 114, 0.1);
}
.lf-prodotto-card__immagine {
    position: relative;
    display: block;
    aspect-ratio: 1 / 1;
    background-color: #F5F5F5;
    flex-shrink: 0;
}
.lf-prodotto-card__immagine img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
/* L'icona ruota passando sopra l'intera immagine, non solo sopra l'icona stessa */
.lf-prodotto-card__immagine:hover .category-badge {
    transform: rotate(90deg);
}
.lf-prodotto-card__corpo {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    gap: 12px;
    padding: 20px;
}
.lf-prodotto-card__titolo.lf-prodotto-card__titolo {
    margin: 0 !important;
    font-weight: 600 !important;
    font-size: 16px !important;
    line-height: 1.5 !important;
}
.lf-prodotto-card__titolo a {
    color: var(--e-global-color-primary) !important;
    text-decoration: none !important;
}
.lf-prodotto-card__descrizione.lf-prodotto-card__descrizione {
    margin: 0 !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
    color: var(--e-global-color-primary) !important;
}
.lf-prodotto-card__sku.lf-prodotto-card__sku {
    margin: 0 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.5 !important;
    color: var(--e-global-color-primary) !important;
}
.lf-prodotto-card__azione {
    margin-top: auto;
    padding-top: 8px;
}

/* Bottoni della scheda (Aggiungi al preventivo / Leggi tutto) - stessi colori/hover
   del bottone della pagina prodotto singolo, ma in scala più piccola per stare in card.
   Il CSS del plugin YITH ha una regola (.woocommerce .add-request-quote-button.button)
   con la STESSA specificità e lo STESSO !important della nostra - a parità vince chi
   viene caricato per ultimo (YITH), quindi qui serve una specificità volutamente più
   alta per essere sicuri di vincere sempre, non solo !important (verificato dal vivo). */
.lf-griglia-prodotti .lf-prodotto-card .lf-prodotto-card__azione a.add-request-quote-button.add-request-quote-button.add-request-quote-button.button,
.lf-prodotto-card__leggi-tutto {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    width: 100% !important;
    box-sizing: border-box !important;

    background-color: var(--e-global-color-primary) !important;
    border: 2px solid var(--e-global-color-primary) !important;
    color: #fff !important;

    padding: 16px 24px !important;
    border-radius: 64px !important;
    box-shadow: none !important;

    font-family: var(--e-global-typography-text-font-family), Sans-serif !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.5em !important;
    text-decoration: none !important;

    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.lf-griglia-prodotti .lf-prodotto-card .lf-prodotto-card__azione a.add-request-quote-button.add-request-quote-button.add-request-quote-button.button::after {
    content: "+";
    display: inline-block;
    font-size: 14px;
    font-weight: 500;
    line-height: 0.7;
}
.lf-prodotto-card__leggi-tutto span {
    font-size: 14px;
    font-weight: 500;
}
/* I contenitori che YITH genera attorno al bottone sono larghi solo quanto il loro
   contenuto: li forziamo a piena larghezza così il bottone (width:100% sopra) si
   allarga davvero quanto la card, non solo quanto il wrapper stretto di YITH */
.lf-prodotto-card__azione,
.lf-prodotto-card__azione .yith-ywraq-add-to-quote,
.lf-prodotto-card__azione .yith-ywraq-add-button {
    display: block !important;
    width: 100% !important;
}
.lf-griglia-prodotti .lf-prodotto-card .lf-prodotto-card__azione a.add-request-quote-button.add-request-quote-button.add-request-quote-button.button:hover,
.lf-prodotto-card__leggi-tutto:hover {
    opacity: 0.8 !important;
}
.lf-prodotto-card__azione .add-request-quote-button::after,
.lf-prodotto-card__leggi-tutto span {
    font-weight: 500;
}
/* In card il messaggio dopo il click resta semplice: non c'è spazio per il box blu grande */
.lf-prodotto-card__azione .yith_ywraq_add_item_response_message,
.lf-prodotto-card__azione .yith_ywraq_add_item_product_message {
    margin-top: 8px;
    font-size: 12px;
    color: var(--e-global-color-primary);
}
.lf-prodotto-card__azione .yith_ywraq_add_item_browse_message a {
    font-size: 12px;
    font-weight: 700;
    color: var(--e-global-color-primary);
}

/* Bottone "Mostra altri prodotti" */
.lf-griglia-prodotti__carica-altri-wrap {
    display: flex;
    justify-content: center;
    margin-top: 40px;
}
.lf-griglia-prodotti__carica-altri {
    display: inline-flex;
    align-items: center;
    gap: 8px;

    background-color: var(--e-global-color-primary);
    border: 2px solid var(--e-global-color-primary);
    color: #fff;
    cursor: pointer;

    padding: 16px 32px;
    border-radius: 64px;

    font-family: var(--e-global-typography-text-font-family), Sans-serif;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.5em;

    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.lf-griglia-prodotti__carica-altri:hover {
    padding-left: 40px;
    padding-right: 40px;
}
.lf-griglia-prodotti__carica-altri.is-loading {
    opacity: 0.6;
    cursor: default;
}

/* Shortcode [related_categories] - 2 categorie prodotto casuali */
.lf-categorie-correlate {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    align-items: stretch;
    gap: 24px;
}
.lf-categoria-correlata {
    display: flex;
    flex-direction: column;
    height: 100%;
    cursor: pointer;
    background-color: #fff;
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 0 32px 0 rgba(0, 45, 114, 0.1);
}
.lf-categoria-correlata__immagine {
    position: relative;
    display: block;
    height: 300px !important;
    max-height: 300px !important;
    overflow: hidden;
    background-color: #F5F5F5;
    flex-shrink: 0;
    margin: 16px 16px 0 16px;
    border-radius: 8px;
}
.lf-categoria-correlata__immagine img {
    width: 100% !important;
    height: 100% !important;
    max-height: none !important;
    object-fit: cover !important;
}
/* Icona badge: stesso stile degli altri utilizzi, ruota passando sopra tutto il box.
   Qui però va appoggiata proprio sul bordo dell'immagine (non 20px/20px più dentro
   come nel resto del sito) - regola scoped solo a questo componente, non tocchiamo
   la classe condivisa .category-badge che deve restare invariata altrove. */
.lf-categoria-correlata .category-badge {
    top: 0 !important;
    left: 0 !important;
}
.lf-categoria-correlata:hover .category-badge {
    transform: rotate(90deg);
}
.lf-categoria-correlata__corpo {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    gap: 12px;
    padding: 24px;
}
.lf-categoria-correlata__titolo.lf-categoria-correlata__titolo {
    margin: 0;
    font-size: 24px !important;
    line-height: 1.2 !important;
}
.lf-categoria-correlata__titolo.lf-categoria-correlata__titolo a {
    color: var(--e-global-color-primary) !important;
    font-weight: 600 !important;
    font-size: 24px !important;
    line-height: 1.2 !important;
    text-decoration: none !important;
}
/* Il campo ACF del titolo può contenere <strong>/<b> per evidenziare una parola:
   qui li neutralizziamo, stesso peso/dimensione/interlinea del resto del testo,
   niente più grassetto extra che sballa anche la spaziatura tra le righe */
.lf-categoria-correlata__titolo.lf-categoria-correlata__titolo strong,
.lf-categoria-correlata__titolo.lf-categoria-correlata__titolo b,
.lf-categoria-correlata__titolo.lf-categoria-correlata__titolo a strong,
.lf-categoria-correlata__titolo.lf-categoria-correlata__titolo a b {
    font-weight: 600 !important;
    font-size: inherit !important;
    line-height: inherit !important;
    color: inherit !important;
}
.lf-categoria-correlata__descrizione,
.lf-categoria-correlata__descrizione p {
    margin: 0;
    color: var(--e-global-color-primary);
}
.lf-categoria-correlata__azione {
    margin-top: auto;
    padding-top: 15px;
}
.lf-categoria-correlata__bottone.lf-categoria-correlata__bottone {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    background-color: var(--e-global-color-primary) !important;
    border: 2px solid var(--e-global-color-primary) !important;
    color: #fff !important;

    padding: 14px 26px;
    border-radius: 64px;

    font-family: var(--e-global-typography-text-font-family), Sans-serif;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.5em;
    text-decoration: none !important;

    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.lf-categoria-correlata:hover .lf-categoria-correlata__bottone {
    padding-left: 32px;
    padding-right: 32px;
}

/* Pagina contatti */
.box-grigio {
    background-color: #F5F5F5;
    padding: 40px!important;
    border-radius: 24px!important;
}
.heading-contact-light h2 {
    color: var(--e-global-color-primary)!important;
    font-weight: 500!important;
    font-size: 14px!important;
    line-height: 1.1!important;
}
.heading-contact-dark h2 {
    color: #404040!important;
    font-weight: 700!important;
    font-size: 19px!important;
    line-height: 1.1!important;
}
.elementor-field-subgroup input[type="checkbox"],
.elementor-field-subgroup input[type="radio"] {
    background-color: #ffffff;
    border-color: #CCCCCC;
    border-radius: 0px 0px 0px 0px;
    width: 20px;
    height: 20px;
    cursor: pointer;
    vertical-align: middle;
}
.elementor-field-subgroup label {
    font-size: 14px;
    font-weight: 600!important;
    line-height: 1.5em;
    display: inline-block!important;
    cursor: pointer;
}

/* ==========================================================================
   RESPONSIVE - TABLET
========================================================================== */
@media (max-width: 1024px) {
    /* Header */
    .elementor-nav-menu--dropdown {
        top: 75px!important;
    }
    /* Tutto il pannello (voci principali + sottomenù aperto) scorre insieme
       come un unico blocco, invece di far scorrere solo il sottomenù: così
       "Prodotti" resta sempre raggiungibile per richiuderlo, e lo scroll non
       "sfonda" più nella pagina sotto una volta arrivati in fondo alla lista */
    nav.elementor-nav-menu--dropdown {
        position: fixed !important;
        bottom: 0 !important;
        max-height: none !important;
        height: auto !important;
        overflow-y: auto;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
    }
    nav.elementor-nav-menu--dropdown .sub-menu a {
        font-size: 16px !important;
    }
    .wc-custom-quote-button svg, .elementor-menu-toggle svg {
        height: 30px!important;
        width: 30px!important;
    }

    /* Content / Main */
    #main-content {
        margin-top: 140px;
    }

    /* Padding */
    .padding-top-medium {
        padding-top: 64px!important;
    }
    .padding-bottom-medium {
        padding-bottom: 64px!important;
    }
    .padding-bottom {
        padding-bottom: 80px!important;
    }

    /* Sectors grid */
    .sectors-grid-container {
        grid-template-columns: repeat(2, 1fr);
    }
    .sectors-grid-container.sectors-grid-container--3col {
        grid-template-columns: repeat(2, 1fr);
    }

    /* LF DESIGN */
    .grid-align.grid-align {
        max-width: none;
        padding-left: 10px!important;
    }
    .sector-box-row .sector-box-text {
        padding: 32px;
    }
    .sector-box-row .sector-box-icon img {
        max-width: 150px;
    }
    .height-min {
        min-height: 350px!important;
    }

    /* Shortcode [griglia_prodotti] */
    .lf-griglia-prodotti__elenco {
        grid-template-columns: repeat(2, 1fr);
    }

    /* Pagina contatti */
    .box-grigio {
        padding: 20px!important;
    }
}

/* Shortcode [search_results] */
.lf-risultati-ricerca__sezione {
    margin-bottom: 48px;
}
.lf-risultati-ricerca__titolo-sezione {
    color: var(--e-global-color-primary)!important;
    margin: 0 0 24px 0!important;
}
.lf-risultati-ricerca__vuoto {
    color: var(--e-global-color-primary);
    font-size: 16px;
}

/* ==========================================================================
   RESPONSIVE - MOBILE
========================================================================== */
@media (max-width: 767px) {
    /* Content / Main */
    #main-content {
        margin-top: 109px;
    }

    /* Padding */
    .padding-top-medium {
        padding-top: 40px!important;
    }
    .padding-bottom-medium {
        padding-bottom: 40px!important;
    }
    .padding-bottom {
        padding-bottom: 48px!important;
    }
    /* Padding responsive: 36px desktop / 24px tablet / 0px mobile */
    .padding-36 {
        padding: 24px!important;
    }

    /* Footer */
    .wc-custom-product-categories {
        column-count: 1;
    }

    /* Swiper slider (hero) */
    .swiper-slider .swiper-slide {
        min-height: 540px;
        padding-top: 60px;
        padding-bottom: 76px;
    }
    .swiper-slider .btn {
        width: 100%;
        max-width: 250px;
    }
    .swiper-slider .swiper-button-prev,
    .swiper-slider .swiper-button-next {
        display: none;
    }
    .swiper-slider .slide-content {
        padding-left: 10px;
        padding-right: 10px;
    }
    .swiper-slider .slide-title {
        font-size: 35px;
        padding-left: 10px;
        padding-right: 10px;
    }
    .swiper-slider .slide-description {
        padding-left: 10px;
        padding-right: 10px;
    }

    /* Sectors grid */
    .sectors-grid-container {
        grid-template-columns: 1fr;
    }
    .sectors-grid-container.sectors-grid-container--3col {
        grid-template-columns: 1fr;
    }

    /* Curve */
    .curve-right,
    .curve-left,
    .curve-blu-right,
    .curve-blu-left {
        height: auto!important;
    }
    .curve-right::after,
    .curve-left::after,
    .curve-blu-right::after,
    .curve-blu-left::after {
        display: none;
    }

    /* LF DESIGN: Richiedi Preventivo [yith_ywraq_request_quote] */
    #yith-ywrq-table-list thead th.product-quantity {
        text-align: left;
    }
    #yith-ywrq-table-list tbody td {
        padding: 15px 5px;
        vertical-align: middle;
        border: none !important;
    }
    #yith-ywrq-table-list .product-name a {
        color: var(--e-global-color-primary);
        font-weight: 400;
        font-size: 14px;
        text-decoration: none;
    }
    #yith-ywraq-form .update-list-wrapper input[type="submit"] {
        display: none !important;
    }
    .update-list-wrapper input.button,
    .update-list-wrapper #ywraq-list-to-pdf,
    .update-list-wrapper button.ywraq_clean_list.ywraq_clean_list {
        font-size: 14px;
    }
    .ywraq-form-table-wrapper.wide {
        flex-direction: column;
        gap: 32px;
    }
    .ywraq-form-table-wrapper.wide .yith-ywraq-mail-form-wrapper {
        padding: 24px;
    }
    .yith-ywraq-mail-form-wrapper .form-row {
        flex-basis: 100%;
    }

    /* LF DESIGN: allineamento griglia larghi schermi */
    .grid-align.grid-align {
        padding: 20px!important;
    }

    /* LF DESIGN: Box Settori [sector_page] */
    .sector-box-row {
        flex-direction: column!important;
    }
    .sector-box-row .sector-box-text,
    .sector-box-row .sector-box-icon {
        width: 100%;
        padding: 32px;
    }
    .sector-box-row .sector-box-icon {
        order: 1;
    }
    .sector-box-row .sector-box-text {
        order: 2;
    }
    .sector-box-row .sector-box-icon img {
        max-width: 100px;
    }

    /* Shortcode [blocco_preventivo] */
    .lf-blocco-preventivo {
        gap: 22px;
        margin-top: 0px;
    }

    /* Shortcode [product_grid] */
    .lf-griglia-prodotti__elenco {
        grid-template-columns: repeat(2, 1fr);
        gap: 8px;
    }
    /* Badge più piccolo solo nelle card prodotto: la classe .category-badge è condivisa
       con altre pagine (chi siamo, settori, ecc.) che devono restare a 36px */
    .lf-prodotto-card .category-badge {
        width: 20px;
        height: 20px;
        top: 15px;
    }
    .category-badge.category-badge--left {
        left: 15px;
        right: auto;
    }
    .lf-prodotto-card {
        border-radius: 10px !important;
    }
    .lf-griglia-prodotti .lf-prodotto-card .lf-prodotto-card__azione a.add-request-quote-button.add-request-quote-button.add-request-quote-button.button,
    .lf-prodotto-card__leggi-tutto {
        padding: 5px 10px !important;
        border-radius: 10px !important;
        font-size: 12px !important;
        line-height: 1.3 !important;
    }
    .lf-prodotto-card__titolo.lf-prodotto-card__titolo {
        font-size: 16px !important;
        line-height: 1.3 !important;
    }
    .lf-prodotto-card__descrizione.lf-prodotto-card__descrizione {
        font-size: 12px !important;
    }
    .lf-prodotto-card__sku.lf-prodotto-card__sku {
        font-size: 12px !important;
    }
    .lf-prodotto-card__corpo {
        gap: 8px;
        padding: 12px;
    }

    /* Shortcode [related_categories] */
    .lf-categorie-correlate {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    .lf-categoria-correlata__immagine {
        height: 250px !important;
        max-height: 250px !important;
    }

    /* Pagina contatti */
    .box-grigio {
        padding: 20px!important;
    }
}