/* =============================================================
     Offerta Topics Disclosure Layout (Accessible Toggle Panels)
     ============================================================= */
.offerta-topics { display: flex; flex-direction: column; gap: 2.25rem; margin-top: 2rem; }
.offerta-disclosure { display: grid; gap: 1.25rem; align-items: start; grid-template-columns: minmax(230px, 320px) 1fr; position: relative; }
.offerta-disclosure-media { margin:0; position: relative; }
.offerta-disclosure-img { width:100%; height:auto; display:block; border-radius: 14px; box-shadow: 0 6px 22px rgba(11,26,43,0.18); object-fit: cover; aspect-ratio: 4 / 3; }
.offerta-disclosure-img-nobox { width:100%; height:auto; display:block; border-radius: 14px; object-fit: cover; }

/* Trigger button sits slightly outside right edge of image on large screens */
.offerta-disclosure-body { position: relative; padding-top: .5rem; }
.offerta-disclosure-trigger { 
    --btn-bg: linear-gradient(90deg, var(--primary-green) 0%, var(--partner-blue) 100%);
    border: 0; background: var(--btn-bg); color:#fff; font-weight:700; font-size: clamp(1rem, .9rem + .5vw, 1.15rem); 
    padding: .65rem 1.25rem .7rem; border-radius: 999px; letter-spacing:.5px; position: absolute; right: -18%; top: 12%;
    transform: translateX(50%);
    box-shadow: 0 6px 18px rgba(0,0,0,0.22); display:inline-flex; align-items:center; gap:.55rem; line-height:1.05; max-width: 420px; text-align:left;
}
.offerta-disclosure-trigger:focus-visible { outline:3px solid #ffffff; outline-offset:3px; box-shadow:0 0 0 4px rgba(0,71,187,0.35); }
.offerta-disclosure-trigger:hover { filter: brightness(1.07); }
.offerta-disclosure-trigger[aria-expanded="true"] { box-shadow:0 10px 28px rgba(0,0,0,0.28); }

/* Icon indicator (chevron) appended via pseudo */
.offerta-disclosure-trigger::after { content:""; width: 0.75rem; height:0.75rem; flex:0 0 auto; border: 3px solid #fff; border-left:0; border-top:0; transform: rotate(45deg) translateY(-2px); transition: transform .25s ease; }
.offerta-disclosure-trigger[aria-expanded="true"]::after { transform: rotate(225deg) translateY(2px); }

.offerta-disclosure-panel { border: 1px solid #dfe3e6; background:#ffffff; border-radius: 16px; box-shadow:0 10px 34px -4px rgba(11,26,43,.20); padding: 1.4rem 1.4rem 1.55rem; position: relative; overflow:hidden; }
.offerta-disclosure-panel2 {
    border: 1px solid #dfe3e6;
    background: #ffffff;
    border-radius: 16px;
    box-shadow: 0 10px 34px -4px rgba(11,26,43,.20);
    padding: 1.4rem 1.4rem 1.55rem;
    position: relative;
    overflow: hidden;
}
.offerta-disclosure-panel[hidden] { display:none !important; }
.offerta-disclosure-panel-inner { animation: offertaFade .35s ease; }
@keyframes offertaFade { from { opacity:0; transform: translateY(6px);} to { opacity:1; transform: translateY(0);} }

/* Governance: profilo desktop con pannello sempre aperto (riusabile) */
@media (min-width: 992px) {
    .offerta-disclosure.offerta-disclosure--desktop-open .offerta-disclosure-trigger { display:none !important; }
    /* Generalizza il pannello: mostra sempre qualsiasi .offerta-disclosure-panel interno */
    .offerta-disclosure.offerta-disclosure--desktop-open .offerta-disclosure-panel { display:block !important; visibility:visible; margin-top:0 !important; }
    .offerta-disclosure.offerta-disclosure--desktop-open .offerta-disclosure-body { padding-top:0 !important; }
    /* Heading visibile solo desktop */
    .desktop-only-heading { display:block !important; }
}
/* Mobile & tablet: le heading interne restano nascoste (verrà annunciato il testo del bottone come etichetta) */
@media (max-width: 991.98px) {
    .desktop-only-heading { display:none; }
}

    /* Storia - reusable figure/img behavior
       Desktop/tablet: image height matches adjacent content (cropped via object-fit)
       Mobile (stacked): image becomes a centered square
    */
    .storia-figure { margin: 0; }

    @media (min-width: 576px) {
        /* When layout is side-by-side, make the figure stretch and the img fill height */
        .storia-page .offerta-disclosure { align-items: stretch; }
        .storia-page .storia-figure { display: block; align-self: stretch; }
        .storia-page .storia-img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center center; }
    }

    @media (max-width: 575.98px) {
        /* Stacked mobile: force the image to be a square above the content */
        .storia-page .offerta-disclosure { grid-template-columns: 1fr !important; }
        .storia-page .storia-figure { width: 100%; display: block; }
        .storia-page .storia-img { width: 100%; aspect-ratio: 1 / 1; height: auto; object-fit: cover; object-position: center center; display: block; }
    }
/* Stili semantici extra per profilo (senza inline style) */
.offerta-profilo-nome { margin:0; font-weight:700; letter-spacing:.5px; }
.offerta-profilo-ruolo { margin:.2rem 0 .4rem; font-weight:600; }
.offerta-profilo-bio { margin:.5rem 0 0; }

/* Adjust when button wraps over image area on very wide screens */
@media (min-width: 992px) {
    /* Desktop: image left column fixed, content right column. Position trigger to overlap image edge by ~50% */
    .offerta-disclosure { grid-template-columns: minmax(280px, 360px) 1fr; align-items: start; }
    .offerta-disclosure-media { position: relative; }
    .offerta-disclosure-trigger { right: -40px; top: 16px; transform: none; }
    .offerta-disclosure-trigger { z-index: 30; }
    .offerta-disclosure-panel { margin-top: 6px; z-index: 10; }
}

/* Tablet: keep side layout but reduce offset */
@media (max-width: 991.98px) {
    .offerta-disclosure { grid-template-columns: minmax(220px, 300px) 1fr; }
    .offerta-disclosure-trigger { position: static; transform:none; margin: .25rem 0 .85rem; display:inline-flex; }
}

/* Mobile: stack vertically, button above panel */
@media (max-width: 575.98px) {
    .offerta-disclosure { grid-template-columns: 1fr; gap: 0; }
    .offerta-disclosure-trigger { position: static; transform:none; width:100%; justify-content:space-between; }
    .offerta-disclosure-panel { padding: 1.1rem 1rem 1.25rem; }
}

/* High contrast mode (forced colors) fallback */
@media (forced-colors: active) {
    .offerta-disclosure-trigger { background: ButtonFace; color: ButtonText; border: 2px solid ButtonText; }
    .offerta-disclosure-trigger::after { border-color: ButtonText; }
    .offerta-disclosure-panel { border: 1px solid ButtonText; }
}

/* Prefers reduced motion: remove animation */
@media (prefers-reduced-motion: reduce){
    .offerta-disclosure-panel-inner { animation:none; }
    .offerta-disclosure-trigger::after { transition:none; }
}
@font-face {
    font-family: 'BNPPSansCond';
    src: url('../fonts/bnpp-sans-cond-bold-v2.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'BNPP Sans Cond Regular';
    src: url('../fonts/bnpp-sans-cond-regular-v2.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'BNPP Sans Cond Bold';
    src: url('../fonts/bnpp-sans-cond-bold-v2.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* Typography mapping */
h1, h2, h3, h4, h5, h6 {
    font-family: 'BNPP Sans Cond Bold', Arial, sans-serif;
    font-weight: 400;
}
.classeApresonalizzata {
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-weight: 400;
    font-size: inherit; /* eredita la dimensione del contesto */
    line-height: inherit; /* eredita l'interlinea del contesto */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.classeApresonalizzata:hover {
    text-decoration: underline;
}
footer, nav, button, textarea, select, .btn, .dropdown-item {
    font-family: 'BNPP Sans Cond Regular', Arial, sans-serif;
    font-weight: 700;
}

:root {
    --primary-green: #076f45; /* principale */
    --partner-blue: #0047bb; /* partner commerciale */
    --header-text: #ffffff; /* testo sull'header */
    --header-accent: #0047bb; /* usato per piccoli dettagli */
    --primary-gradient: linear-gradient(90deg, var(--primary-green) 0%, var(--partner-blue) 100%);
}
.container {
    margin-top: 25px;
    margin-bottom: 15px;
}
html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
    position: relative;
}

.hero-title {
    font-family: 'BNPP Sans Cond Bold'
}
/* Accessible header color scheme
   #076f45 vs #FFFFFF contrast ≈ 7.0:1
   #0047bb vs #FFFFFF contrast ≈ 7.62:1 (entrambi AA/AAA per testo normale) */
/* Header gradient: transizione soft a destra verso il blu partner */
.header-main {
    background: linear-gradient(90deg, rgba(7,111,69,0.95) 0%, rgba(7,111,69,0.95) 55%, rgba(0,71,187,0.95) 100%);
    color: var(--header-text) !important;
    font-family: 'BNPPSansCond', Arial, sans-serif;
}

    .header-main .navbar-brand,
    .header-main .nav-link,
    .header-main .navbar-toggler {
        color: var(--header-text) !important;
        font-family: 'BNPPSansCond', Arial, sans-serif;
        letter-spacing: .5px;
    }

        .header-main .nav-link.active,
        .header-main .nav-item.active > .nav-link {
            background: #f1f5fb !important;
            color: #000000 !important;
            text-decoration: none;
        }

        .header-main .nav-link:hover,
        .header-main .nav-link:focus {
            color: #ffffff !important;
            text-decoration: underline;
        }

    .header-main .navbar-toggler {
        border-color: rgba(255,255,255,.45);
    }

        .header-main .navbar-toggler:focus {
            box-shadow: 0 0 0 .2rem rgba(0,71,187,0.25);
        }

    /* Dropdown: tono scuro uniforme per contrasto adeguato */
    .header-main .dropdown-menu .ul-dropdown-menu {
        /* Changed to white background and high-contrast black text for WCAG compliance */
        background-color: #ffffff !important;
        color: #000000 !important;
        border: 1px solid #dfe6ee !important; /* subtle light border */
        border-radius: .5rem;
        padding: .35rem 0;
        font-family: 'BNPPSCond', Arial, sans-serif;
        /* provide a visible elevation so the menu is perceptible to users with low vision */
        box-shadow: 0 10px 30px rgba(11,26,43,0.12);
    }

    /* Dropdown items: black text, clear hover/focus styles with shadow for identification */
    

    /* Ensure dropdown header non-interactive text also readable on white */
    .header-main .dropdown-header,
    .header-main .dropdown-menu #governanceHeader {
        color: #2b2b2b !important;
        background: none !important;
        pointer-events: none;
    }

    /* Keyboard focus visibility for all interactive header elements */
    .header-main a:focus,
    .header-main .nav-link:focus,
    .header-main .dropdown-item:focus,
    .header-main .navbar-toggler:focus,
    .header-main .header-search-toggle:focus {
        /* strong, reachable outline that contrasts with both dark and light backgrounds */
        outline: 3px solid #0047bb !important; /* partner blue meets contrast on white and visible on dark */
        outline-offset: 3px !important;
        box-shadow: 0 6px 18px rgba(0,71,187,0.18) !important;
    }

    /* Make sure focus-visible uses same style for browsers that support it */
    .header-main a:focus-visible,
    .header-main .nav-link:focus-visible,
    .header-main .dropdown-item:focus-visible,
    .header-main .navbar-toggler:focus-visible {
        outline: 3px solid #0047bb !important;
        outline-offset: 3px !important;
        box-shadow: 0 6px 18px rgba(0,71,187,0.18) !important;
    }
    .header-main .dropdown-item,
    .header-main .dropdown-item:hover,
    .header-main .dropdown-item:focus,
    .header-main .dropdown-item:focus-visible,
    .header-main .dropdown-item:active,
    .header-main .dropdown-item.active {
         /* grigio coerente col sito */
        color: #000000 !important;
        box-shadow: none !important; /* rimuove l'ombra grande */
        transform: none !important; /* annulla translate */
        z-index: auto !important;
        outline: none !important;
    }

        /* Mantieni un indicatore accessibile per chi usa tastiera */
        .header-main .dropdown-item:focus-visible {
            box-shadow: 0 0 0 3px rgba(0,71,187,0.12) !important;
        }
    /* Ensure toggler (mobile) remains accessible and visible when focused */
    .header-main .navbar-toggler {
        border-color: rgba(0,0,0,0.08) !important;
        background: transparent;
    }

        .header-main .navbar-toggler:focus {
            box-shadow: 0 0 0 .18rem rgba(0,71,187,0.25) !important;
        }

/* Ensure search toggle shows clear focus on both expanded and collapsed states */
.header-search-toggle:focus, .header-search-toggle:focus-visible {
    outline: 3px solid #0047bb !important;
    outline-offset: 3px !important;
    box-shadow: 0 6px 18px rgba(0,71,187,0.18) !important;
}

/* High-contrast nav links for header when menu is expanded */
.header-main .nav-link,
.header-main .navbar-brand {
    color: var(--header-text) !important;
}

@media (max-width: 575.98px) {
    .header-main .navbar-brand {
        padding-right: .25rem;
    }

    .header-main .nav-link {
        padding-left: .25rem;
        padding-right: .25rem;
    }
    /* Nav items senza dropdown: mantieni testo su una sola riga e allineato a sinistra */
    #mainNav .navbar-nav .nav-item:not(.nav-split-item) > .nav-link {
        white-space: nowrap !important;
        width: auto !important; /* annulla width:55% ereditato */
        flex: 0 0 auto !important;
        text-align: left !important;
        padding-left: .5rem !important; /* mantiene consistenza con altre voci */
        padding-right: .5rem !important;
        display: inline-flex !important;
        align-items: center;
    }
    /* Se contenitore colonna forza stretching, assicurati non spezzare la riga */
    #mainNav .navbar-nav { align-items: flex-start !important; }
}

/* Barra di ricerca header */
.header-search-toggle.btn {
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.header-search-icon {
    width: 1.15rem;
    height: 1.15rem;
    fill: #ffffff;
    transition: fill .15s ease, transform .2s ease;
}

.header-search-toggle:hover .header-search-icon {
    transform: scale(1.08);
}

.header-search-toggle:focus {
    outline: 2px solid #ffffff;
    outline-offset: 2px;
}
/* Expanded (aria-expanded=true) state: white background, dark icon for WCAG contrast */
.header-search-toggle[aria-expanded="true"] {
    background: transparent !important;
    color: var(--header-text) !important;
    border-color: transparent !important;
}

    .header-search-toggle[aria-expanded="true"] .header-search-icon {
        fill: #ffffff !important;
    }

    .header-search-toggle[aria-expanded="true"]:focus {
        stroke: #ffffff !important;
    }

.header-search-collapse {
    background: rgba(0,0,0,0.35);
    backdrop-filter: blur(4px);
}

.header-search-form {
    padding: .75rem 1rem;
}

    .header-search-form .form-control {
        max-width: 340px;
    }

        .header-search-form .form-control:focus {
            box-shadow: 0 0 0 .2rem rgba(255,255,255,.35);
            border-color: #ffffff;
        }

    

/* Prevent wrapping of header items on mobile */
.header-inline-group {
    flex-wrap: nowrap;
}

@media (max-width: 575.98px) {
    .header-inline-group {
        gap: .35rem !important;
    }

        

    .header-search-toggle {
        padding: .25rem .45rem;
    }

    .navbar .nav-link {
        padding-left: .4rem;
        padding-right: .4rem;
    }

    .header-search-form {
        padding: .65rem .75rem;
    }

        .header-search-form .form-control {
            width: 100%;
            max-width: none;
        }
}

/* Ensure search icon always visible and high contrast */
.header-search-toggle {
    background: transparent;
}

    .header-search-toggle .header-search-icon {
        fill: #ffffff;
    }

    .header-search-toggle:not([aria-expanded="true"]):hover .header-search-icon, .header-search-toggle:not([aria-expanded="true"]):focus .header-search-icon {
        fill: #ffffff;
    }
/* Already defined expanded state keeps black icon */
@media (max-width: 575.98px) {
    .header-inline-group a.nav-link.ms-2 {
        margin-left: .35rem !important;
    }

    .header-search-toggle.ms-2 {
        margin-left: .35rem !important;
    }
}

/* Search toggle contrast fix */
.header-search-toggle:hover,
.header-search-toggle:focus,
.header-search-toggle:active {
    border-color: #ffffff !important;
}

    .header-search-toggle:hover .header-search-icon,
    .header-search-toggle:focus .header-search-icon,
    .header-search-toggle:active .header-search-icon {
        fill: #0b0b0b !important;
    }
/* Focus outline scuro su sfondo bianco per contrasto WCAG */
.header-search-toggle:focus {
    outline: 2px solid #0b0b0b;
    outline-offset: 2px;
}

/* Header 40% enlargement overrides (adjusted -20%) */
.header-main {
    padding-top: .72rem;
    padding-bottom: .72rem;
}

    

    .header-main .nav-link {
        font-size: 1.12rem;
        line-height: 1.2;
    }

    .header-main .dropdown-menu {
        font-size: 0.9rem;
    }

    .header-main .dropdown-item {
        font-size: 0.9rem;
        line-height: 1.3;
    }

    .header-main .navbar-toggler-icon {
        background-size: 1.76rem 1.76rem !important;
    }

    .header-main .header-search-toggle .header-search-icon {
        width: 1.28rem;
        height: 1.28rem;
    }

@media (max-width: 991.98px) {
    .header-main .nav-link {
        font-size: 0.96rem;
    }

    .header-main .dropdown-menu {
        font-size: 0.8rem;
    }

   
}

/* Carousel & CTA accessibility enhancements
   CTA color changed to the primary green #076f45. Contrast with white text ≈ 7.0:1 (meets WCAG AA/AAA).
*/
.btn-cta {
    background-color: var(--primary-green); /* #076f45 */
    color: #ffffff;
    border: 0;
    padding: .375rem .6rem;
    font-size: 1.2rem;
    border-radius: .25rem;
    display: inline-block;
}

    .btn-cta:hover {
        background-color: #065f3b;
        color: #ffffff;
        text-decoration: none;
    }

    .btn-cta:active {
        background-color: #055032;
    }

    .btn-cta:focus {
        outline: 3px solid rgba(7,111,69,0.35); /* visible focus with primary green */
        outline-offset: 2px;
    }
/* Override: pulsanti cta grigi */
.btn-cta {
    background: #555d64 !important; /* grigio medio scuro */
    border: 2px solid #555d64 !important;
    color: #ffffff !important;
    box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}

    .btn-cta:hover {
        background: #434a50 !important;
        border-color: #434a50 !important;
        color: #ffffff !important;
    }

    .btn-cta:focus, .btn-cta:active {
        color: #ffffff !important;
        box-shadow: 0 0 0 3px rgba(85,93,100,0.45);
        outline: none;
    }



/* Thicker hamburger icon lines (mobile) */
.header-main .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255,255,255,0.95)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='3.6' d='M4 7h22M4 15h22M4 23h22' /%3e%3c/svg%3e") !important;
    background-size: 1.65rem 1.65rem; /* leggermente più grande per visibilità */
}

@media (min-width: 992px) {
    /* Mantieni hamburger normale sui desktop (se visibile) */
    .header-main .navbar-toggler-icon {
        background-size: 1.5rem 1.5rem;
    }
}

/* Focus ring migliorato per il toggler su contrasto trasparente */
.header-main .navbar-toggler:focus {
    box-shadow: 0 0 0 .18rem rgba(255,255,255,.55);
}
/* Footer accessibility enhancements */
footer a.nav-link {
    color: #f8f9fa;
}

    footer a.nav-link:hover, footer a.nav-link:focus {
        color: #ffffff;
        text-decoration: underline;
    }

    footer a.nav-link:focus {
        outline: 2px solid #ffffff;
        outline-offset: 2px;
    }

/* Footer responsive layout */
.footer-links {
    gap: .25rem;
}

    .footer-links .nav-item + .nav-item {
        position: relative;
    }

@media (min-width: 576px) {
    .footer-links {
        flex-wrap: wrap;
        gap: .5rem 1rem;
    }

        .footer-links .nav-item {
            display: flex;
            align-items: center;
        }

            .footer-links .nav-item:not(:last-child)::after {
                content: "";
                display: inline-block;
                width: 1px;
                height: 14px;
                background: rgba(255,255,255,.35);
                margin-left: .75rem;
            }
}

@media (max-width: 575.98px) {
    .footer-links .nav-link {
        padding: .5rem 0;
        border-bottom: 1px solid rgba(255,255,255,.15);
    }

    .footer-links .nav-item:last-child .nav-link {
        border-bottom: none;
    }
}

/* Carousel rounded and mobile-friendly */
.carousel-rounded {
    border-radius: 12px;
    overflow: hidden;
    max-width: 100%;
}

.carousel-image {
    object-fit: cover;
    height: 320px;
}

.carousel-caption.caption-bg {
    background: transparent; /* rimuove lo sfondo esteso del contenitore */
    padding: 0; /* lascia il padding al singolo elemento testo */
}

    /* Headline: più grande del 33% e sfondino nero aderente */
    .carousel-caption.caption-bg .carousel-headline {
        display: inline-block;
        box-sizing: border-box;
        /* dimensione fluida: minimo, valore relativo viewport, massimo */
        font-size: 80px;
        line-height: 1;
        /* padding in em per scalare con il font-size */
        padding: 0.22em 0.6em;
        color: #ffffff;
        background: rgba(0,0,0,0.65);
        border-radius: 0.375rem;
        box-shadow: 0 6px 18px rgba(0,0,0,0.28);
        -webkit-font-smoothing: antialiased;
        vertical-align: middle;
        max-width: 85ch; /* evita overflow su larghezze estreme */
        word-break: break-word;
        /* assicurare che il background segua le righe se il testo va a capo */
        box-decoration-break: clone;
    }

        .carousel-caption.caption-bg .carousel-headline.multiline {
            display: inline;
            white-space: normal;
            padding: 0.18em 0.45em;
        }

    /* Mantieni il posizionamento della caption già definito, ma forza la caption container senza sfondo */
    .carousel-caption.caption-bg.d-block,
    .carousel-caption.caption-bg.d-md-block {
        background: transparent;
        padding: 0;
    }
/* Forza dimensione fissa della headline (sostituisci 80px se vuoi un'altra misura) */
#accessibleCarousel .carousel-caption.caption-bg {
    position: absolute !important;
    left: 3.5rem !important; /* distanza dal bordo sinistro: abbassa per andare più a sinistra */
    right: auto !important;
    width: auto !important;
    padding: 0 !important;
    text-align: left !important;
    transform: none !important; /* rimuove eventuali translate centering */
    z-index: 5 !important;
    bottom: 0 !important;
}
.style-homepage-big {
    font-size: clamp(2.4rem, 3.6vw + 6rem, 6rem) !important;
}
@media (max-width: 575.98px) {
    .style-homepage-big {
        font-size: clamp(1.4rem, 8.4vw, 2.4rem) !important;
        display: block !important;
    }
}
#accessibleCarousel .carousel-caption.caption-bg .carousel-headline {
    font-size: clamp(2.4rem, 3.6vw + 6rem, 4rem) !important;
    line-height: 1 !important;
    white-space: nowrap !important; /* se vuoi evitare a capo */
    overflow: hidden !important;
    text-overflow: ellipsis !important; /* mostra ... se troncata */
    padding: 0.28rem 0.6rem !important; /* padding usa em per scalare col font */
    max-width: 95vw !important; /* spazio utilizzabile */
    box-decoration-break: clone !important;
    -webkit-box-decoration-break: clone !important;
}
/* Responsive: su schermi piccoli riduci leggermente per evitare overflow */
@media (max-width: 575.98px) {

    #accessibleCarousel .carousel-caption.caption-bg .carousel-headline {
        font-size: 80px !important;
        padding: .28rem .6rem !important;
        max-width: calc(100% - 1rem) !important;
    }

    /* mantieni la caption left-aligned come hai richiesto */
    #accessibleCarousel .carousel-caption.caption-bg {
        position: absolute !important;
        left: 0.75rem !important;
        right: auto !important;
        bottom: 1.75rem !important;
        padding: 0 0 0 1.6rem !important;
        text-align: left !important;
        width: auto !important;
        left: 0.6rem !important;
        bottom: 0 !important;
    }

        /* Headline: dimensione fluida più consistente, padding in em per scalare con il font */
        #accessibleCarousel .carousel-caption.caption-bg .carousel-headline {
            display: inline-block !important;
            white-space: normal !important;
            box-decoration-break: clone;
            -webkit-box-decoration-break: clone;
            line-height: 1.05 !important;
            font-size: clamp(1.4rem, 6.4vw, 2.4rem) !important; /* mantiene proporzioni simili al desktop */
            padding: 0.22em 0.6em !important;
            max-width: calc(100% - 1.5rem) !important;
            background: rgba(0,0,0,0.65) !important;
            box-shadow: 0 4px 12px rgba(0,0,0,0.22) !important;
            border-radius: 0.3125rem !important;
            -webkit-font-smoothing: antialiased !important;
            max-width: calc(100% - 1.2rem) !important;
        }

}


.indicators-responsive {
    display: flex;
    justify-content: center;
    padding-top: .5rem;
}

@media (max-width: 767.98px) {
    .carousel-image {
        height: 220px;
    }
    /* Keep caption overlay instead of static to prevent vertical stretch */
    .carousel-caption.caption-bg {
        position: absolute; /* override earlier static behavior */
        left: 0;
        right: 0;
        bottom: 3.25rem;
        margin: 0;
        background: rgba(0,0,0,0.60);
        padding: .6rem .75rem;
        border-radius: 0;
    }

        .carousel-caption.caption-bg h5, .carousel-caption.caption-bg .h5, .carousel-caption.caption-bg h2 {
            font-size: 1rem;
        }

        .carousel-caption.caption-bg p {
            font-size: .8rem;
            margin-bottom: .5rem;
        }
    /* Vertically center prev/next relative to image only */
    .carousel-control-prev, .carousel-control-next {
        top: 50%;
        bottom: auto;
        transform: translateY(-50%);
        width: 2.75rem;
        height: 2.75rem;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .carousel-control-prev-icon, .carousel-control-next-icon {
        filter: drop-shadow(0 0 3px rgba(0,0,0,0.6));
    }
    /* Indicators closer to image, always visible */
    .carousel-indicators, .indicators-responsive {
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        bottom: .5rem;
        margin: 0;
        padding: 0;
    }

        .carousel-indicators [data-bs-target] {
            width: .65rem;
            height: .65rem;
            background-color: #ffffff;
            opacity: .55;
        }

        .carousel-indicators .active {
            opacity: 1;
        }
}

@media (max-width: 479.98px) {
    .carousel-image {
        height: 180px;
    }
}

/* Feature boxes */
.feature-card {
    border: 1px solid #e6e6e6;
    border-radius: 8px;
    transition: transform .18s ease-in-out, box-shadow .18s ease-in-out;
    box-shadow: 0 0 0 rgba(0,0,0,0);
}

    .feature-card:hover, .feature-card:focus {
        transform: translateY(-4px);
        box-shadow: 0 6px 18px rgba(0,0,0,0.08);
        text-decoration: none;
    }

    .feature-card:focus {
        outline: 3px solid #0d6efd;
        outline-offset: 3px;
    }

    .feature-card h5, .feature-card h3 {
        color: #0b1a2b;
    }

    .feature-card p {
        color: #495057;
    }

@media (max-width: 575.98px) {
    .feature-card {
        padding: 1rem;
    }
}

/* Hide carousel controls on narrow mobile (Android) as requested */
@media (max-width: 575.98px) {
    .carousel-control-prev.android-hidden, .carousel-control-next.android-hidden {
        display: none !important;
    }
}

/* Mobile: hide carousel navigation controls under or equal to 768px */
@media (max-width: 768px) {
    #accessibleCarousel .carousel-control-prev,
    #accessibleCarousel .carousel-control-next {
        display: none !important; /* removed from visual and accessibility tree */
    }
}

/* Mobile carousel indicators larger touch targets */
@media (max-width: 767.98px) {
    .carousel-indicators [data-bs-target] {
        width: 44px; /* WCAG target size */
        height: 44px;
        background: none; /* remove default dot fill */
        opacity: 1; /* manage visual via pseudo */
        position: relative;
        margin: 0 2px;
        padding: 0; /* ensure box size equals touch target */
        display: flex;
        align-items: center;
        justify-content: center;
        border: 0; /* rely on pseudo for visual */
    }

        .carousel-indicators [data-bs-target]::before {
            content: "";
            width: 14px; /* visual dot */
            height: 14px;
            border-radius: 50%;
            background: #ffffff;
            opacity: .55;
            display: block;
            transition: transform .25s ease, opacity .25s ease, background-color .25s ease;
        }

    .carousel-indicators .active::before {
        opacity: 1;
        transform: scale(1.15);
    }

    .carousel-indicators [data-bs-target]:focus::before,
    .carousel-indicators [data-bs-target]:hover::before {
        opacity: .9;
    }

    .carousel-indicators button:focus {
        outline: 3px solid rgba(255,255,255,0.85);
        outline-offset: 4px;
    }
}

/* CONTENT BODY overrides for article pages */
.content-body {
    font-family: 'BNPP Sans Cond Regular', Arial, sans-serif; /* usare il regular per il corpo del testo */
    font-weight: 400;
    color: #0b1a2b; /* testo principale scuro */
}

    /* Ensure paragraphs in content-body render at normal weight so <strong> can stand out */
    .content-body p,
    .content-body li {
        font-weight: 400;
    }

    /* Highlight strong within content-body with heavier weight */
    .content-body strong {
        font-weight: 800;
    }

    .content-body h1, .content-body h2, .content-body h3 {
        font-family: 'BNPP Sans Cond Regular', Arial, sans-serif;
        font-weight: 700; /* titoli più marcati */
    }

    /* Ensure <strong> renders as bold even if site-wide fonts use bold by default */
    .content-body strong {
        font-weight: 800; /* forzare più spessore per il grassetto */
    }

    .content-body figure {
        margin: 0;
    }

        .content-body figure img {
            width: 100%;
            height: auto;
            object-fit: cover;
        }

    .content-body .rounded.shadow-sm {
        border-radius: 8px;
    }

    .content-body figcaption {
        color: #6c757d;
    }

    /* Small layout tweaks for the page */
    .content-body .lead {
        font-size: 1.05rem;
    }

/* Responsive spacing for images */
@media (min-width: 992px) {
    .content-body .row.align-items-center .col-lg-6:first-child {
        padding-right: 2rem;
    }
}

.offerta-media-cluster {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: .65rem;
}

.offerta-figure {
    background: #ffffff;
    border: 1px solid #e3e6e9;
    padding: .4rem .4rem .55rem;
    border-radius: 10px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.05);
    display: flex;
    flex-direction: column;
    height: 100%;
}

.offerta-img {
    border-radius: 6px;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    width: 100%;
}

.offerta-figure figcaption {
    line-height: 1.2;
    margin-top: .45rem;
}

@media (min-width: 768px) {
    .offerta-media-cluster {
        gap: .9rem;
    }
}

/* Custom list markers accessible (not relying only on color) */
.offerta-list li {
    position: relative;
    padding-left: 1.35rem;
    margin-bottom: .4rem;
}
#offerta-root .offerta-list li,
#offerta-root .offerta-list li * {
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
    font-weight: 400 !important;
}

/* Restore bold for semantic <strong> / <b> inside LaNostraOfferta offerta-list (overrides the earlier `li *` rule) */
#offerta-root .offerta-list li strong,
#offerta-root .offerta-list li b,
#offerta-root .offerta-list li .fw-bold {
    font-weight: 800 !important; /* restore strong emphasis */
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
}
.offerta-list .list-marker {
    position: absolute;
    left: 0;
    top: .80em;
    transform: translateY(-50%);
    width: .65rem;
    height: .65rem;
    /* keep square marker always filled (non-interactive decorative marker) */
    border: 2px solid transparent;
    background: linear-gradient(90deg, var(--primary-green) 40%, var(--partner-blue) 60%); /* always filled */
    border-radius: 50%; /* square with slight rounding */
    box-sizing: border-box;
}

.offerta-list li:focus-within .list-marker,
.offerta-list li:hover .list-marker {
    /* keep same filled color on hover/focus */
    background: var(--primary-gradient);
}

.offerta-list a:focus {
    outline: 3px solid #0047bb;
    outline-offset: 2px;
}

/* Make offerta-list content non-selectable (read-only visual) while keeping it accessible to screen readers */
.offerta-list,
.offerta-list li,
.offerta-list .list-marker {
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror */
    -moz-user-select: none; /* Old Firefox */
    -ms-user-select: none; /* IE/Edge */
    user-select: none; /* Standard */
}

.hero-offerta {
    /* increased height to make hero image taller */
    min-height: 390px; /* original 300px -> increased for more visual impact */
    display: flex;
    align-items: flex-end;
    overflow: hidden;
    border-radius: 14px;
    position: relative;
}

.hero-offerta-bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    filter: none;
}

.hero-offerta-overlay {
    /* remove colored overlay so image stays in original color; keep overlay element for accessibility hooks */
    position: absolute;
    inset: 0;
    background: transparent;
    mix-blend-mode: normal;
}

.hero-offerta-content {
    position: relative;
    padding: 2.75rem 1.25rem 2.5rem;
    max-width: 960px;
    color: #ffffff;
}

@media (max-width: 575.98px) {
    .hero-offerta {
        min-height: 299px;
        border-radius: 10px;
    }

    .hero-offerta-content {
        padding: 1.9rem 1rem 1.6rem;
    }
}

/* TOC (Table of Contents) layout and accessibility */
html {
    scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }
}

.toc-layout {
    display: flex;
    align-items: flex-start;
    gap: 2rem;
    position: relative;
}

.toc-nav {
    position: sticky;
    top: 5.5rem;
    max-height: calc(100vh - 6rem);
    overflow: auto;
    padding: 1rem 1rem 1.25rem;
    background: #f5f7f8;
    border: 1px solid #e2e6ea;
    border-radius: .75rem;
    min-width: 230px;
}

    .toc-nav:focus-within {
        
    }

.toc-nav-title {
    font-size: 1rem;
    margin: 0 0 .75rem;
    line-height: 1.2;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .05em;
}

.toc-toggle {
    background: linear-gradient(90deg, rgba(7,111,69,0.95) 0%, rgba(7,111,69,0.95) 50%, rgba(0,71,187,0.95) 100%);
}

    .toc-toggle:hover, .toc-toggle:focus {
        background: linear-gradient(90deg, rgba(7,111,69,0.95) 0%, rgba(7,111,69,0.95) 50%, rgba(0,71,187,0.95) 100%);
    }

.toc-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: .35rem;
}

    .toc-list li {
        line-height: 1.25;
    }

    .toc-list a {
        display: inline-block;
        padding: .45rem .6rem;
        border-radius: .35rem;
        text-decoration: none;
        font-size: .95rem;
        color: #ffffff; /* readable on primary color */
        background: linear-gradient(90deg, rgba(7,111,69,0.95) 0%, rgba(7,111,69,0.95) 50%, rgba(0,71,187,0.95) 100%);
        border: 0;
        box-shadow: none;
        font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
    }

        .toc-list a:hover,
        .toc-list a:focus {
            color: #ffffff;
            background: linear-gradient(90deg, rgba(7,111,69,0.95) 0%, rgba(7,111,69,0.95) 50%, rgba(0,71,187,0.95) 100%);
            box-shadow: none !important;
            text-decoration: none;
            border: 2px solid #000000 !important;
            box-sizing: border-box;
            box-shadow: none !important;
        }

        /* Selected/current: white text and sidebar gradient background */
/*        .toc-list a[aria-current="true"] {
            color: #ffffff !important;  
            border: 2px solid #000000 !important;
            box-sizing: border-box;
            box-shadow: none !important;
        }*/

        /* Accessible keyboard focus outline only (no color/shadow changes) */
        .toc-list a:focus-visible {
            outline: 3px solid rgba(0,71,187,0.18) !important;
            outline-offset: 3px !important;
        }

@media (max-width: 991.98px) {
    .toc-list a {
        display: block;
        width: 100%;
        box-sizing: border-box;
        font-size: 19px;
    }
}

.toc-content-wrapper {
    flex: 1 1 auto;
    min-width: 0;
}

.skip-link {
    position: absolute;
    left: -999px;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

    .skip-link:focus {
        position: static;
        width: auto;
        height: auto;
        margin-bottom: 1rem;
        background: #0047bb;
        color: #ffffff;
        padding: .5rem .75rem;
        border-radius: .5rem;
    }

@media (max-width: 991.98px) {
    .toc-layout {
        flex-direction: column;
    }

    .toc-nav {
        position: relative;
        top: auto;
        max-height: none;
        width: 100%;
        min-width: 0;
        padding: .75rem .9rem 1rem;
    }

    .toc-list[hidden] {
        display: none !important;
    }

    .toc-list {
        border-top: 1px solid #d5dadd;
        padding-top: .6rem;
    }
}

@media (min-width: 992px) {
    .toc-toggle {
        display: none;
    }
}
/* Ensure mobile TOC toggle text always white in all states */
.toc-toggle {
    color: #ffffff !important;
    font-size: 24px;
    border: 2px solid #ffffff;
    border-radius: 8px;
}

    .toc-toggle:hover, .toc-toggle:focus, .toc-toggle:active {
        color: #ffffff !important;
    }

    .toc-toggle[aria-expanded="true"] {
        color: #ffffff !important;
    }
/* Cessione del Quinto section styles */
.cqs-heading {
    font-weight: 700;
    line-height: 1.2;
    position: relative;
    padding-left: .75rem;
    color: #0b1a2b;
}

    .cqs-heading::before {
        display: none !important;
    }

.cqs-intro {
    max-width: 60ch;
    font-size: 1rem;
    line-height: 1.45;
    text-align: center !important;
    margin-left: auto;
    margin-right: auto;
}

.cqs-box {
    border: 1px solid #d9dee2;
    border-width: 3px !important;
    border-radius: 16px;
    padding: 1.5rem 1.4rem 1.25rem;
    background: #ffffff;
}

.home-intro-box {
    background: #f9fafb;
    border: 1px solid #edf0f2;
    border-radius: 12px;
    padding: 1.25rem 1.35rem;
    text-align: left;
}

    .home-intro-box .home-intro {
        margin: 0;
    }
/* Icona a sinistra dell'introduzione: l'icona diventa alta quanto tutto il contenuto */
.home-intro-with-icon {
    display: flex;
    gap: 1rem;
    align-items: stretch; /* permette ai figli di avere la stessa altezza */
}

.home-intro-content {
    display: flex;
    flex-direction: column;
    justify-content: center; /* centra verticalmente titolo e paragrafo */
    margin-top: 10px;
}

/* wrapper dell'icona si estende verticalmente per eguagliare il contenuto adiacente */
.home-intro-icon-wrapper {
    margin-left: -1.0rem; /* compensa il padding-left di .home-intro-box */
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: flex-start; /* lascia l'immagine attaccata a sinistra */
    overflow: hidden;
    border-top-left-radius: 12px;
    border-bottom-left-radius: 12px;
}

.home-intro-icon {
    display: block;
    height: 100%;
    width: auto;
    object-fit: contain;
    max-width: 100%;
    border: none !important; /* assicura che l'immagine non mostri bordo */
    background: transparent; /* nessun background sull'immagine */
}
@media (min-width: 992px) {
    .home-intro-icon-wrapper {
        flex: 0 0 325px;
        width: 325px;
        min-width: 325px;
        max-height: 150px;
        height: 150px;
    }

    .home-intro-icon {
        width: 100%;
        height: 100%;
        object-fit: fill !important; /* riempie il box (distorsione ammessa) */
        object-position: left center;
        display: block;
    }
}
/* mobile: icona sopra contenuto, non forzare estensione verticale */
@media (max-width: 575.98px) {
    .home-intro-with-icon {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        gap: .5rem !important;
        flex-wrap: nowrap !important;
    }
    .home-intro-icon-wrapper {
        margin-left: -1.0rem !important;
    }

    /* mantiene il comportamento mobile già impostato */
    .home-intro-icon {
        object-fit: fill !important;
    }
    .home-intro-icon-wrapper {
        flex: 0 0 auto !important; /* fixed-size box */
        width: 64px !important; /* fixed width */
        height: 290px !important; /* fixed height */
        min-width: 44px !important;
        padding: 0 !important;
        align-self: center !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        background: transparent !important;
    }

    .home-intro-content {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        text-align: left !important;
    }

    /* fill the fixed box in both dimensions; this will compress/stretch the image so it always fills the area */
    .home-intro-icon {
        width: 100% !important;
        height: 100% !important;
        object-fit: fill !important; /* allow distortion to guarantee full coverage */
        object-position: center center !important;
        display: block !important;
    }
}

/* rimuove bordi laterali del box intro (desktop e mobile) */
.home-intro-box {
    border-left: none !important;
    border-right: none !important;
}

@media (max-width: 991.98px) {
    .home-intro-box {
        box-sizing: border-box; /* evita shift quando si aggiunge il bordo */
        border-left: 1px solid #edf0f2 !important;
        border-right: 1px solid #edf0f2 !important;
    }
}

/* Dropdown menu: evidenzia GOVERNANCE come padre */
.dropdown-menu #governanceHeader {
    font-size: inherit !important;
    font-weight: inherit !important;
    padding: .25rem 1rem !important; /* Bootstrap default for .dropdown-item */
    line-height: 1.5 !important;
    display: block;
    width: 100%;
    text-align: inherit;
    color: #fff !important; /* keep requested white color */
    background: none !important;
    cursor: default;
    pointer-events: none; /* non cliccabile */
}

/* Hover neutro grigio per card articoli - leggermente scurito per contrasto */
.cqs-item:hover, .cqs-item:focus-within,
.cqs-benefit:hover, .cqs-benefit:focus-within {
    background: #e6eaed !important; /* grigio un po' più scuro */
    border-color: #cfd6da !important;
    box-shadow: 0 0 0 3px rgba(0,0,0,0.05);
    transition: background-color .12s ease;
}
/* Pulsante: hover grigio invece che verde/blu */
.btn-cta:hover, .btn-cta:focus {
    color: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(73,80,87,0.35);
}

.cqs-full-width {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
}

@media (min-width: 1400px) {
    .cqs-full-width .cqs-box {
        border-radius: 16px !important;
    }
}

/* =======================
   Header per-item shadow overrides
   - Remove glow from parent (.nav-item / .nav-link)
   - Apply visible per-item shadow on .dropdown-item hover/focus
   - Ensure dropdown/menu overflow and stacking allow the shadow to be visible
   ======================= */

/* Make sure parent elements do not apply a shared glow */
.navbar.header-main .nav-item,
.navbar.header-main .nav-link,
.navbar.header-main .nav-item:focus-within,
.navbar.header-main .nav-item.show,
.navbar.header-main .nav-link:focus,
.navbar.header-main .nav-link:focus-visible {
    box-shadow: none;
    outline: none;
    background: transparent;
}

/* Ensure dropdown/menu containers don't clip child shadows */
.header-main,
.header-main .navbar,
.header-main .dropdown,
.header-main .dropdown-menu {
    overflow: visible !important;
}

    /* Base: make each dropdown item positioned and ready for elevation */
    .header-main .dropdown-item {
        position: relative;
        z-index: 1000; /* base stacking for items */
        transition: transform .12s ease, box-shadow .18s ease;
    }

        /* Per-item elevated shadow on hover / focus (keyboard and mouse) */
        .header-main .dropdown-item:hover,
        .header-main .dropdown-item:focus,
        .header-main .dropdown-item:focus-visible {
            z-index: 2400 !important; /* bring the focused item above siblings */
            transform: translateY(-2px) !important;
            box-shadow: 0 18px 48px rgba(11,26,43,0.30) !important; /* strong per-item shadow */
            background: #f1f5fb !important;
            color: #000000 !important;
            outline: none !important; /* rely on box-shadow for visibility */
        }

    /* Ensure dropdown itself stacks above transform-created contexts if needed */
    .header-main .dropdown-menu {
        z-index: 2200 !important;
    }

        /* Keep dropdown headers readable on white */
        .header-main .dropdown-header,
        .header-main .dropdown-menu #governanceHeader {
            color: #2b2b2b !important;
        }

    /* StoriaChiSiamo page: hide article images on all viewports, show title+text on desktop, keep toggle button only on mobile */
    .storia-page .offerta-disclosure-media img.offerta-disclosure-img { display: none !important; }

    /* Desktop: show title inside panel and hide trigger button */
    @media (min-width: 992px) {
        .storia-page .offerta-disclosure .offerta-disclosure-trigger { display: none !important; }
        .storia-page .offerta-disclosure .offerta-disclosure-panel { display: block !important; visibility: visible; }
        .storia-page .desktop-only-heading { display: block !important; }
    }

    /* Mobile: keep the button visible and panels collapsible (default behavior) */
    @media (max-width: 991.98px) {
        .storia-page .desktop-only-heading { display: none !important; }
    }

    /* Make disclosures full-width (single column) for storia page so text spans the page */
    .storia-page .offerta-disclosure { grid-template-columns: 1fr !important; gap: 0 !important; }
    .storia-page .offerta-disclosure-media { display: block; margin-bottom: 0rem !important; }
    .storia-page .offerta-disclosure-trigger { position: static; transform:none; width:100%; justify-content:space-between; }
    .storia-page .offerta-disclosure-panel { padding: 1.1rem 1rem 1.25rem; border: 1px solid #dfe3e6; border-radius: 12px; box-shadow:0 10px 34px -4px rgba(11,26,43,.12); background:#ffffff; }

    /* Hide separators on mobile for a cleaner flow */
    @media (max-width: 575.98px) {
        .storia-page hr.section-separator { display: none !important; }
    }

    /* Compact mobile button spacing for storia page */
    @media (max-width: 575.98px) {
        .storia-page .offerta-disclosure-trigger { padding: .5rem .85rem; margin: .15rem 0 .5rem; font-size: .95rem; }
        .storia-page .offerta-disclosure-trigger::after { right: .35rem; }
    }

    /* Reduce vertical spacing between articles specifically for storia page */
    @media (min-width: 992px) {
        .storia-page .offerta-topics { gap: 1rem; }
        .storia-page hr.section-separator { margin: .6rem 0; }
        .storia-page .offerta-disclosure-panel { margin-bottom: 0.6rem; padding-bottom: 1rem; }
    }

    @media (max-width: 991.98px) {
        .storia-page .offerta-topics { gap: .9rem; }
        .storia-page hr.section-separator { margin: .4rem 0; }
    }

    /* Desktop: remove figure placeholders so left column doesn't reserve space when images removed */
    @media (min-width: 992px) {
        .storia-page .offerta-disclosure-media { display: none !important; }
    }

    /* Mobile/tablet: bring panel closer to the button and enlarge button text for readability */
    @media (max-width: 991.98px) {
        .storia-page .offerta-disclosure-panel { margin-top: .25rem !important; padding-top: .6rem !important; }
        .storia-page .offerta-disclosure-trigger { font-size: 1.05rem !important; padding: .6rem 1rem !important; }
    }

    @media (max-width: 575.98px) {
        /* even tighter on small phones */
        .storia-page .offerta-disclosure-panel { margin-top: .15rem !important; padding-top: .5rem !important; }
        .storia-page .offerta-disclosure-trigger { font-size: 1.08rem !important; padding: .65rem 1rem !important; }
    }

    /* End of per-item shadow overrides */
    /* Rimuove il bordo/glow blu dai contenitori parent (nav-item, navbar) mantenendo il focus visibile sugli elementi interattivi reali */
    .header-main .nav-item,
    .header-main .nav-item:focus,
    .header-main .nav-item:focus-within,
    .navbar.header-main .nav-item,
    .navbar.header-main .nav-item:focus,
    .navbar.header-main .nav-item:focus-within,
    .header-main .navbar-nav {
        outline: none !important;
        box-shadow: none !important;
        background: transparent !important;
    }

    /* Evita che il focus del link propaghi un effetto di box-shadow predefinito al parent */
    .header-main .nav-link:focus {
        outline: none !important;
        box-shadow: none !important;
    }

    /* Mantieni un indicatore di focus accessibile solo per chi usa tastiera */
    .header-main .nav-link:focus-visible,
    .header-main a:focus-visible {
        outline: 3px solid #0047bb !important;
        outline-offset: 3px !important;
        box-shadow: 0 6px 18px rgba(0,71,187,0.18) !important;
    }
/* Gradient: contenitore dei 3 articoli (cqs-box) */
.cqs-box {
    border: 3px solid transparent !important; /* sovrascrive il bordo grigio */
    border-radius: 16px !important;
    background-image: linear-gradient(#ffffff, #ffffff), linear-gradient(90deg, var(--primary-green) 0%, var(--partner-blue) 100%);
    background-origin: padding-box, border-box;
    background-clip: padding-box, border-box;
    /* mantiene padding e accessibilità già presenti */
}

    /* Assicura che il contenuto interno non erediti il gradiente */
    .cqs-box > * {
        background: transparent;
    }

    /* Stato hover/focus: lieve ombra, bordo gradiente sempre visibile */
    .cqs-box:hover,
    .cqs-box:focus-within {
        box-shadow: 0 10px 30px rgba(11,26,43,0.06);
    }

/* Gradient per pulsanti CTA */
.btn-cta,
a.btn-cta,
button.btn-cta {
    background-image: linear-gradient(90deg, var(--primary-green) 0%, var(--partner-blue) 100%) !important;
    border: 0 !important;
    color: #ffffff !important;
    box-shadow: 0 2px 6px rgba(0,0,0,0.15) !important;
    transition: transform .08s ease, box-shadow .12s ease;
}

    /* Hover/active per feedback */
    .btn-cta:hover,
    .btn-cta:active {
        background-image: linear-gradient(90deg, #065f3b 0%, #003b8a 100%) !important;
        transform: translateY(-1px);
        box-shadow: 0 8px 22px rgba(11,26,43,0.12) !important;
    }

    /* Focus-visible accessibile */
    .btn-cta:focus-visible,
    .cqs-box:focus-within {
        outline: 3px solid rgba(0,71,187,0.18) !important;
        outline-offset: 3px !important;
    }
/* Icon swap: mostra la X quando il toggle ha aria-expanded="true" */
/* Posiziona i due SVG nello stesso spazio e alterna la visibilità */

.header-search-toggle {
    position: relative;
    padding: .25rem .5rem;
}

    /* Default: mostra lente, nascondi X */
    .header-search-toggle .close-icon {
        display: none;
    }

    /* Quando aria-expanded è true, mostra X e nascondi lente */
    .header-search-toggle[aria-expanded="true"] .search-icon {
        display: none;
    }

    .header-search-toggle[aria-expanded="true"] .close-icon {
        display: inline-block;
    }

/* Mantieni dimensioni e colore coerenti */
.header-search-icon {
    width: 1.15rem;
    height: 1.15rem;
    display: inline-block;
    vertical-align: middle;
    fill: #ffffff; /* usato dalla search-icon */
}

/* Per la close-icon usiamo stroke; assicuriamone la visibilità */
.header-search-toggle .close-icon path {
    stroke: #ffffff;
}

/* Piccola transizione per cambio icona */
.header-search-toggle .search-icon,
.header-search-toggle .close-icon {
    transition: opacity .12s ease, transform .12s ease;
}
/* Mantieni icona ricerca sempre bianca: non diventare nera su hover/click/focus/expanded */
.header-search-toggle,
.header-search-toggle:hover,
.header-search-toggle:focus,
.header-search-toggle:active,
.header-search-toggle[aria-expanded="true"],
.header-search-toggle[aria-expanded="true"]:hover,
.header-search-toggle[aria-expanded="true"]:focus,
.header-search-toggle[aria-expanded="true"]:active {
    background: transparent !important; /* opzionale: evita cambio sfondo */
    color: var(--header-text) !important;
    border-color: transparent !important;
}

    /* Forza il colore della lente (SVG con fill) */
    .header-search-toggle .header-search-icon,
    .header-search-toggle .search-icon,
    .header-search-toggle[aria-expanded="true"] .header-search-icon,
    .header-search-toggle[aria-expanded="true"] .search-icon {
        fill: #ffffff !important;
        color: #ffffff !important;
    }

    /* Forza il colore della X (stroke) */
    .header-search-toggle .close-icon path,
    .header-search-toggle[aria-expanded="true"] .close-icon path,
    .header-search-toggle:hover .close-icon path,
    .header-search-toggle:focus .close-icon path,
    .header-search-toggle:active .close-icon path {
        stroke: #ffffff !important;
    }

    /* Neutralizza regole precedenti che impostano icona nera */
    .header-search-toggle:hover .header-search-icon,
    .header-search-toggle:focus .header-search-icon,
    .header-search-toggle:active .header-search-icon,
    .header-search-toggle:hover .search-icon,
    .header-search-toggle:focus .search-icon,
    .header-search-toggle:active .search-icon {
        fill: #ffffff !important;
    }

    /* Mantieni outline di focus accessibile per tastiera */
    .header-search-toggle:focus-visible,
    .header-search-toggle[aria-expanded="true"]:focus-visible {
        outline: 3px solid #0047bb !important;
        outline-offset: 3px !important;
    }
    /* Rimuove il quadrato bianco su click/mouse-focus, mantiene focus-visible per tastiera */
    .header-search-toggle:focus:not(:focus-visible),
    .header-search-toggle:active,
    .header-search-toggle[aria-expanded="true"]:active {
        outline: none !important;
        box-shadow: none !important;
        background: transparent !important;
    }

        /* Backup: neutralizza regole che forzano fill nero nelle interazioni da mouse */
        .header-search-toggle:hover .header-search-icon,
        .header-search-toggle:focus .header-search-icon,
        .header-search-toggle:active .header-search-icon {
            fill: #ffffff !important;
        }
/* Aggiunge un quadrato bianco arrotondato come bordo attorno all'icona search/close */
.header-search-toggle {
    position: relative; /* necessario per il pseudo-elemento */
    overflow: visible; /* evita che il bordo venga tagliato */
}

    /* bordo quadrato arrotondato (decorativo, non interattivo) */
    .header-search-toggle::before {
        content: "";
        position: absolute;
        left: 50%;
        top: 50%;
        width: 2.2rem; /* dimensione bordo - regola se vuoi più piccolo/grande */
        height: 2.2rem;
        transform: translate(-50%, -50%);
        border: 2px solid #ffffff;
        border-radius: 8px; /* arrotondamento angoli */
        background: transparent;
        pointer-events: none; /* non interferisce con click/focus */
        z-index: 0; /* sotto l'icona SVG */
        transition: border-color .12s ease, box-shadow .12s ease, transform .12s ease;
    }

    /* Mantieni l'SVG sopra il bordo */
    .header-search-toggle .header-search-icon,
    .header-search-toggle .close-icon {
        position: relative;
        z-index: 1;
    }

    /* Assicura che il bordo resti bianco in tutti gli stati (hover/focus/active/expanded) */
    .header-search-toggle:hover::before,
    .header-search-toggle:focus::before,
    .header-search-toggle:active::before,
    .header-search-toggle[aria-expanded="true"]::before {
        border-color: #ffffff !important;
        background: transparent !important;
    }

    /* (Opzionale) lieve elevazione al passaggio mouse senza cambiare sfondo */
    .header-search-toggle:hover::before {
        box-shadow: 0 4px 12px rgba(0,0,0,0.08);
    }
/* Search input: sfondo verde principale, testo bianco */
.header-search-form .form-control {
    background: #ffffff !important;
    color: #0b1a2b !important; /* testo scuro per contrasto */
    border: 1px solid #e6e6e9 !important;
    box-shadow: none !important;
}

    .header-search-form .form-control::placeholder {
        color: #6c757d !important;
        opacity: 1;
    }

    .header-search-form .form-control:focus {
        background: #ffffff !important;
        color: #0b1a2b !important;
        border-color: var(--primary-green) !important; /* accento verde su focus */
        box-shadow: 0 0 0 .18rem rgba(7,111,69,0.12) !important;
    }

/* Mobile: input occupa intera riga, mantenere pulsante separato */
@media (max-width: 575.98px) {
    .header-search-form .form-control {
        width: 100%;
    }

    .header-search-form .btn-search-submit {
        margin-left: 0;
    }
}

/* Pulsante Cerca: rotondo, testo bianco, sfondo verde principale */
.btn-search-submit {
    background: var(--primary-gradient) !important;
    color: #ffffff !important;
    border: 0 !important;
    border-radius: 999px !important; /* rotondo */
    padding: .375rem .9rem !important;
    font-weight: 700;
    line-height: 1;
    box-shadow: 0 4px 10px rgba(7,111,69,0.12);
    transition: transform .08s ease, box-shadow .12s ease, background .12s ease;
}

    /* Stato hover / active: leggermente più scuro per feedback */
    .btn-search-submit:hover,
    .btn-search-submit:active,
    .btn-search-submit:focus {
        color: #ffffff !important;
        transform: translateY(-1px);
        outline: none;
    }

    /* Mantieni focus-visible accessibile */
    .btn-search-submit:focus-visible {
        outline: 3px solid rgba(0,71,187,0.18) !important;
        outline-offset: 3px !important;
    }


/* Headline: sfondino aderente esatto al testo (gestisce anche wrapping) */
.carousel-caption.caption-bg {
    background: transparent !important; /* assicurarsi che il container non estenda lo sfondo */
    padding: 0 !important;
}

    .carousel-caption.caption-bg .carousel-headline {
        display: inline-block; /* riduce la larghezza al contenuto */
        box-sizing: border-box;
        white-space: nowrap; /* evita overflow orizzontale su desktop */
        line-height: 1; /* rimuove spazi verticali extra */
        margin: 0; /* rimuove eventuali margin ereditati */
        padding: .28rem .6rem; /* spazio interno attorno al testo */
        background: rgba(0,0,0,0.65); /* sfondo nero aderente */
        border-radius: 6px;
        vertical-align: middle; /* elimina spazio sotto la linea di base */
        box-shadow: 0 6px 18px rgba(0,0,0,0.28);
        -webkit-font-smoothing: antialiased;
    }

        /* Se il testo può andare su più righe: applica sfondo a ogni riga */
        .carousel-caption.caption-bg .carousel-headline.multiline {
            display: inline; /* permette il wrapping */
            white-space: normal;
            box-decoration-break: clone;
            -webkit-box-decoration-break: clone;
            padding: .18rem .45rem;
        }

/* Responsive: su schermi piccoli consenti wrapping e rimuovi ombra pesante */
@media (max-width: 767.98px) {
    .carousel-caption.caption-bg .carousel-headline {
        /* usa la classe .multiline se vuoi background per ogni riga, altrimenti lascia inline-block */
        display: inline-block;
        white-space: normal;
        padding: .22rem .5rem;
        box-shadow: none;
        font-size: 1.08em; /* dimensione mobile già prevista */
    }
}
/* home-intro-box: solo bordi laterali su desktop, box completo su mobile */
.home-intro-box {
    background: #f9fafb !important;
    padding: 0rem 1rem !important;
    box-shadow: 0 4px 12px rgba(11,26,43,0.04);
    border-top: none !important;
    border-bottom: none !important;
    border-radius: 10px; /* mantiene arrotondamento generale */
    /* evita che regole precedenti sovrascrivano visibilità */
    outline: none;
}

/* Su schermi piccoli (mobile) mostra il box completo per chiarezza */
@media (max-width: 991.98px) {
    .home-intro-box {
        border-top: 1px solid #edf0f2 !important;
        border-bottom: 1px solid #edf0f2 !important;
        border-radius: 12px !important;
        padding: 0rem 0.9rem !important;
    }
}

/* Se usi la versione sidebar sticky, assicurati che non aggiunga spazi indesiderati */
.sticky-sidebar .home-intro-box,
.home-intro-box.sticky-sidebar {
    margin: 0;
}
/* Forza font sans per i paragrafi <p> (override del font BNPP) */
p {
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
}
/* Forza font sans per i paragrafi dentro gli articoli/box (override regole BNPP) */
.cqs-item,
.cqs-item p,
.cqs-item .cqs-item-text,
.cqs-box p,
.home-intro-box p,
.content-body p,
.offerta-figure figcaption {
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
    font-weight: 400 !important; /* mantiene peso normale per i paragrafi */
}
/* Header: centra il menu su desktop senza posizionamenti assoluti */
/* Assicurati di rimuovere qualsiasi blocco precedente che usa position:absolute su .header-inline-group, #mainNav o .nav-transparency-link */

@media (min-width: 992px) {
  .header-main .container-fluid {
    display: flex;
    align-items: center;
    justify-content: center; /* centra il contenuto principale */
    gap: 0rem;
    position: relative; /* sicuro per overlay se serve */
  }

  /* Logo + utilities rimangono a sinistra */
  .header-main .header-inline-group {
    margin-right: auto; /* spinge il gruppo tutto a sinistra */
    z-index: 10;
  }

  /* Trasparenza rimane a destra */
  .header-main .nav-transparency-link{
    margin-left: auto; /* spinge l'immagine a destra */
    z-index: 10;
  }

  /* Il nav collapse/menù si comporta come centro fisso */
  .header-main #mainNav {
    position: static;
    transform: none;
    left: auto;
    right: auto;
    width: auto;
    display: flex;
    justify-content: center;
  }

  /* Assicura che le voci siano centrate orizzontalmente */
  .header-main #mainNav .navbar-nav {
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .6rem;
  }

  /* Piccola pulizia: togli spazi che Bootstrap potrebbe applicare */
  .header-main .navbar-toggler {
    /* il toggler rimane nel flusso ma non rompe il centro */
  }
}
/* Assicura il comportamento centrato senza absolute */
/* Reset centratura su schermi molto piccoli: ripristina flusso verticale del navbar */
/* Correzione layout mobile: mantiene logo/toggler in riga e collapse sotto */
@media (max-width: 575.98px) {
    /* container: flex per mantenere brand e toggler sulla stessa riga */
    .header-main .container-fluid {
        display: flex !important;
        align-items: center;
        justify-content: space-between;
        gap: .5rem;
    }

    /* Logo + utilities: non usare margin auto su mobile */
    .header-main .header-inline-group {
        margin-right: 0 !important;
        width: 80%;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    /* Trasparenza: è già nascosta su lg ma se visibile non la forzare a destra */
    .header-main .nav-transparency-link {
        margin-left: 0 !important;
    }

    /* Toggler rimane visibile e primo nell'ordine */
    .header-main .navbar-toggler {
        order: 1;
        margin-left: 0 !important;
        border: 2px solid #ffffff !important;
        border-radius: 0.5rem !important;
        padding: 0.25rem 0.45rem !important; /* regola la spaziatura intorno all'icona */
        background: transparent !important;
        box-shadow: none !important;
        margin-right: 0.5rem !important; /* regola il valore se vuoi più/meno spazio */
        margin-inline-end: 0.5rem !important;
    }
        .header-main .navbar-toggler .navbar-toggler-icon {
            background-size: 1.65rem 1.65rem !important; /* regola se vuoi l'icona più piccola/grande */
        }

    /* Collapse (menu espanso) appare sotto e occupa tutta la larghezza */
    .header-main .navbar-collapse {
        order: 2;
        width: 100%;
    }

        /* Quando il collapse è aperto mostra il blocco con padding laterale */
        .header-main .navbar-collapse.collapse {
            display: none;
        }

            .header-main .navbar-collapse.collapse.show {
                display: block !important;
                padding-top: .5rem;
            }

    /* Voci nav: colonna e allineate a sinistra */
    .header-main #mainNav .navbar-nav {
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: .25rem;
        width: 100%;
        padding-left: 0;
    }

    .header-main #mainNav .nav-link {
        width: 55%;
        padding-left: .5rem;
        padding-right: .5rem;
    }
    /* Eccezione per le voci split (link + bottone icona): evitare larghezza fissa che spinge l'icona sopra il testo */
    @media (max-width: 575.98px) {
        .header-main #mainNav .nav-split-wrapper .nav-split-link,
        .header-main #mainNav .nav-split-wrapper .nav-split-toggle {
            width: auto !important;
            padding-left: .15rem !important;
            padding-right: .15rem !important;
            display: inline-flex !important;
            align-items: center;
        }
        /* Spazio minimo controllato tra testo e icona (rimuovi margin se troppo) */
        .header-main #mainNav .nav-split-wrapper .nav-split-toggle { margin-left: 2px !important; }
    }
    .header-main .navbar-collapse .nav-link,
    .header-main .navbar-collapse .dropdown-item {
        font-size: 1.625rem !important; /* ~16px, regola se vuoi più/meno */
        line-height: 1.35 !important;
        padding: .6rem .75rem !important; /* aumenta area cliccabile */
    }

    /* Se vuoi che i titoli dropdown (se presenti) siano ancora più evidenti */
    .header-main .navbar-collapse .dropdown-header {
        font-size: 1rem !important;
        font-weight: 700 !important;
    }
    
}

/* Ensure 10px gap between content and footer, avoid margin collapse */
main, main[role="main"], #main {
  display: flow-root !important;
  margin-bottom: 0 !important;
  padding-bottom: 10px !important; /* requested gap */
}

/* Remove margin-bottom from last child elements inside main to prevent extra spacing */
main > *:last-child,
main > .container > *:last-child,
main > .container-fluid > *:last-child {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* Ensure footer has no extra top margin and minimal padding if needed */
footer, footer.site-footer, .footer {
  margin-top: 0 !important;
  padding-top: 6px !important; /* reduce default pt-4 to minimal visual padding */
}

/* Also ensure body has no bottom padding/margin */
html, body {
  min-height: 0 !important;
  height: auto !important;
}

footer.bg-dark.text-light { padding-top:4px !important; }
/* Eliminare spazio tra ultimo contenuto e footer */
.cqs-box { padding-bottom: .35rem !important; }
footer.bg-dark.text-light { padding-top: 0 !important; margin-top: 0 !important; }
.cqs-box { margin-bottom: 0 !important; }
.footer-large {
    font-size: 1.65rem;
}
@media (min-width: 768px) {
    .footer-large {
        font-size: 1.65rem;
    }
}
.header-main .navbar-brand {
    font-size: 2.1rem;
}
.header-main .nav-link {
    font-size: 1.35rem;
}
@media (max-width: 991.98px) {
    .header-main .navbar-brand {
        font-size: 1.5rem;
    }
    .header-main .nav-link {
        font-size: 1.15rem;
    }
}
/* Ingrandisce anche i tab/dropdown dell'header */
.header-main .dropdown-menu {
    font-size: 1.25rem;
}
.header-main .dropdown-item {
    font-size: 1.25rem;
}
@media (max-width: 991.98px) {
    .header-main .dropdown-menu {
        font-size: 1.1rem;
    }
    .header-main .dropdown-item {
        font-size: 1.1rem;
    }
}
.header-main .dropdown-item:hover,
.header-main .dropdown-item:focus,
.header-main .dropdown-item:focus-visible {
    background: #fff !important;
    color: #000 !important;
    opacity: 1;
}

/* Scurisce il background degli altri dropdown-item quando uno è selezionato */
.header-main .dropdown-menu:hover .dropdown-item:not(:hover):not(:focus):not(:focus-visible) {
    background: #e3e6ea !important; /* grigio scuro */
    color: #000 !important;
    opacity: 0.85;
}



/* Nasconde il ring su click/touch, mostra il ring nero solo per navigazione da tastiera */
.header-main a:focus:not(:focus-visible),
.header-main .nav-link:focus:not(:focus-visible),
.header-main .navbar-toggler:focus:not(:focus-visible),
.header-main .header-search-toggle:focus:not(:focus-visible),
.header-search-form .btn-search-submit:focus:not(:focus-visible),
.nav-transparency-link:focus:not(:focus-visible) {
    outline: none !important;
    box-shadow: none !important;
}

/* Assicurati di avere il focus-visible nero (già presente o ripeti se necessario) */
.header-main a:focus-visible,
.header-main .nav-link:focus-visible,
.header-main .navbar-toggler:focus-visible,
.header-main .header-search-toggle:focus-visible,
.header-search-form .btn-search-submit:focus-visible,
.nav-transparency-link:focus-visible {
    outline: 3px solid #000 !important;
    outline-offset: 3px !important;
    box-shadow: 0 6px 18px rgba(0,0,0,0.18) !important;
}
.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}
/* ================= Custom overrides richiesti ================= */
/* ---- Fix for storia image sizing (global within offerta-disclosure) ---- */
@media (min-width: 576px) {
    /* Make the figure and the body stretch to the same height so the image fills the panel height */
    .offerta-disclosure { align-items: stretch; }
    .offerta-disclosure .storia-figure { display: block; align-self: stretch; }
    .offerta-disclosure .storia-figure + .offerta-disclosure-body { display: block; align-self: stretch; }
    .offerta-disclosure .storia-img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center center; }
}

@media (max-width: 575.98px) {
    /* Stacked mobile: make the image a centered square and limit max height */
    .offerta-disclosure { grid-template-columns: 1fr; }
    .offerta-disclosure .storia-figure { width: 100%; display: block; }
    .offerta-disclosure .storia-img { width: 100%; aspect-ratio: 1 / 1; height: auto; max-height: 50vw; object-fit: cover; object-position: center center; display: block; }
}

/* Rende trasparente ogni dropdown-menu (usa none/transparent) */
.dropdown-menu { background: none !important; background-color: transparent !important; }
/* Rimuove puntini/bullet dai <li> all'interno degli ul con classe ul-dropdown-menu */
ul.ul-dropdown-menu, .ul-dropdown-menu { list-style: none !important; padding-left: 0 !important; margin-left: 0 !important; }
.ul-dropdown-menu li { list-style: none !important; }
/* Mantiene padding orizzontale uniforme per i link interni se necessario */
.ul-dropdown-menu li > a.dropdown-item { padding-left: 0.85rem; }
/* ============================================================= */
/* Rimozione bordo/ombra residui dai dropdown (regole più specifiche in altri file) */
.header-main .dropdown-menu,
.nav-split-item > .dropdown-menu,
.header-main .dropdown-menu {
    border: none !important;
    box-shadow: none !important;
    background: none !important;
    background-color: transparent !important;
}
/* Override definitivo logo: max-width 20px */
#siteLogo img,
.header-main .navbar-brand img {
    max-width: 180px !important;
    width: auto !important;
    height: auto !important;
    margin-right: -25px;
}
@media (max-width: 991.98px) {
    #siteLogo img {
        max-width: 180px !important;
        width: auto !important;
        height: auto !important;
        margin-right:-25px;
    }
}
/* Override: transparency image same height as logo (40px) on desktop, consistent scaling */
.nav-transparency-img {
    height: 42px;
    width: auto;
    display: block;
    object-fit: contain;
    border-radius: 15px;
}
@media (max-width: 575.98px) {
    #siteLogo img {
        max-width: 100px !important;
        width: auto !important;
        height: auto !important;
    }
    .nav-transparency-img {
        height: 22px;
        width: auto;
        display: block;
        object-fit: contain;
    }
}

/* =============================================================
     Accessible Header Live Search Styles
     Injected markup IDs / classes:
     - #headerSearchListbox.header-search-results (role=listbox)
     - .header-search-option (role=option)
     - .hs-title / .hs-desc inside each option
     ============================================================= */
.header-search-results[hidden] { display: none !important; }
.header-search-results {
        position: relative; /* stays in normal flow under input */
        width: 100%;
        display: flex;
        flex-direction: column;
        margin-top: .25rem;
        border: 1px solid rgba(0,0,0,0.18);
        background: #ffffff;
        border-radius: .55rem;
        box-shadow: 0 4px 14px rgba(0,0,0,.18);
        max-height: 20rem; /* ~320px */
        overflow-y: auto;
        padding: .25rem 0;
        z-index: 3050; /* above gradient / collapse content */
        scrollbar-width: thin;
        -webkit-overflow-scrolling: touch;
}
.header-search-results::-webkit-scrollbar { width: .55rem; }
.header-search-results::-webkit-scrollbar-track { background: #f4f4f6; }
.header-search-results::-webkit-scrollbar-thumb { background: #b4bcc8; border-radius: 6px; }
.header-search-results::-webkit-scrollbar-thumb:hover { background: #8994a2; }

.header-search-option {
        padding: .45rem .85rem .5rem;
        display: flex;
        flex-direction: column;
        gap: .15rem;
        cursor: pointer;
        line-height: 1.15;
        font-size: .85rem;
        color: #0b1a2b;
        background: transparent;
        outline: none;
        transition: background .12s ease, color .12s ease;
}
.header-search-option .hs-title { font-weight:600; text-transform: capitalize; letter-spacing: .25px; }
.header-search-option .hs-desc { font-size: .7rem; white-space: normal; }
.header-search-option:hover { background: rgba(0,71,187,0.06); }
    .header-search-option.active,
    .header-search-option:focus,
    .header-search-option[aria-selected="true"] {
        border: 2px solid black;
        border-radius: 10px;
    }
.header-search-option.active .hs-desc,
.header-search-option:focus .hs-desc,
.header-search-option[aria-selected="true"] .hs-desc { opacity: .95; }

@media (max-width: 575.98px) {
    .header-search-results { max-height: 16rem; }
    .header-search-option { font-size: .9rem; }
    .header-search-option .hs-desc { font-size: .72rem; }
}

@media (prefers-color-scheme: dark) {
    .header-search-results { background:#1c1f24; border-color:#39414d; }
    .header-search-option { color:#f3f5f7; }
    .header-search-option:hover { background: rgba(255,255,255,0.08); }
    .header-search-option.active,
    .header-search-option:focus,
    .header-search-option[aria-selected="true"] { background:#0a5dd8; }
}

@media (prefers-reduced-motion: reduce) {
    .header-search-option { transition:none; }
}

/*ACCORDION*/
/* Offerta accordion (accessibile, responsive) - con freccia e background gradient */
.offerta-accordion {
    width: 100%;
    margin: .6rem 0;
}

    .offerta-accordion .acc-item {
        border-bottom: 1px solid #e6e6e6;
    }

    /* Summary come bottone: sfondo gradient, testo bianco, spazio per freccia */
    .offerta-accordion summary.acc-summary {
        cursor: pointer;
        display: flex !important;
        align-items: center !important;
        padding: .7rem 2.4rem .7rem .9rem; /* spazio a destra per la freccia */
        font-weight: 500;
        background: var(--primary-gradient);
        color: #ffffff;
        border: none;
        border-radius: .4rem;
        position: relative; /* per posizionare la freccia */
        line-height: 1.15;
        font-size: 20px;
    }

        /* Nasconde marker nativo dei browser */
        .offerta-accordion summary.acc-summary::-webkit-details-marker {
            display: none;
        }

        .offerta-accordion summary.acc-summary::marker {
            font-size: 0;
        }

        /* Focus visibile accessibile */
        .offerta-accordion summary.acc-summary:focus {
            outline: 3px solid #0047bb;
            outline-offset: 3px;
            box-shadow: 0 6px 18px rgba(0,71,187,0.12);
        }

    /* Pannello contenuto */
    .offerta-accordion .acc-panel {
        padding: .45rem 0 1rem;
        color: #0b1a2b;
        line-height: 1.45;
        background: transparent;
    }

    /* Freccia (chevron) - creato con bordi; bianca per contrasto sul gradient */
    .offerta-accordion summary.acc-summary::after {
        content: "";
        position: absolute;
        right: .85rem;
        top: 50%;
        width: .7rem;
        height: .7rem;
        transform: translateY(-50%) rotate(45deg);
        border-right: 2px solid #fff;
        border-bottom: 2px solid #fff;
        transition: transform .18s ease, border-color .18s ease;
        pointer-events: none;
        box-sizing: content-box;
    }

    /* Stato aperto: freccia ruota per indicare 'aperto' (punta verso il basso) */
    .offerta-accordion details[open] > summary.acc-summary::after {
        transform: translateY(-50%) rotate(135deg);
    }

/* Riduci dimensione freccia su mobile e aggiusta padding */
@media (max-width: 575.98px) {
    .offerta-accordion summary.acc-summary {
        font-size: 1rem;
        padding: .55rem 2.2rem .55rem .7rem;
        border-radius: .3rem;
    }

        .offerta-accordion summary.acc-summary::after {
            width: .62rem;
            height: .62rem;
            right: .7rem;
            border-right-width: 1.8px;
            border-bottom-width: 1.8px;
        }
}

/* Forced-colors / high contrast fallback */
@media (forced-colors: active) {
    .offerta-accordion summary.acc-summary {
        background: ButtonFace;
        color: ButtonText;
    }

        .offerta-accordion summary.acc-summary::after {
            border-color: ButtonText;
        }
}

/*EFFETTO IMMAGINE VERTICALE*/
/* immagine effetto: due varianti per comportamento */
.immagineEffettoVerticale--cover {
    display: block;
    width: 100%; /* lunghezza per tutta la pagina / contenitore */
    height: 100px; /* altezza massima visibile */
    max-height: 100px;
    object-fit: cover; /* mantiene proporzioni, ritaglia se necessario */
    object-position: center;
    border: none;
    background: transparent;
}

.immagineEffettoVerticale--contain {
    display: block;
    width: 100%;
    height: auto;
    max-height: 100px; /* non superare 100px di altezza */
    object-fit: contain; /* mantiene intera immagine, nessun crop */
    object-position: center;
    border: none;
    background: transparent;
}

    /* fallback per browser che non supportano object-fit (mostra comunque limitazione altezza) */
    .immagineEffettoVerticale--cover[style*="object-fit"],
    .immagineEffettoVerticale--contain[style*="object-fit"] {
        /* noop — mantiene compatibilità; object-fit gestito sopra */
    }

/* minor adjustments for very small viewports */
@media (max-width: 575.98px) {
    .immagineEffettoVerticale--cover,
    .immagineEffettoVerticale--contain {
        max-height: 100px;
        height: auto; /* su mobile preferiamo lasciare height:auto se necessario */
    }
}


.immagineEffettoVerticale {
    display: block;
    width: 100% !important;
    height: 100px !important;
    max-height: 100px !important;
    object-fit: fill !important;
    object-position: center center !important;
    border: none !important;
    background: transparent !important;
}
@media (min-width: 1024px) {
    .offerta-disclosure-body div:has(img.immagineEffettoVerticale) {
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .immagineEffettoVerticale {
        display: block;
        width: 60% !important;
        height: 100px !important;
        max-height: 100px !important;
        object-fit: fill !important;
        object-position: center center !important;
        border: none !important;
        background: transparent !important;
    }
}
p[aria-hidden="true"], li[aria-hidden="true"], ul[aria-hidden="true"],li {
    user-select: text !important;
    pointer-events: auto !important;
}
/* Wrapper immagine destra: estendi fino al bordo destro */
.home-intro-icon-wrapper.right {
    justify-content: flex-end; /* Allinea immagine a destra */
    margin-right: -1.0rem; /* Estendi fino al bordo del container (come margin-left per sinistra) */
    margin-left: 0; /* Rimuovi margin sinistro */
    border-top-right-radius: 12px; /* Arrotondamento destro */
    border-bottom-right-radius: 12px;
    border-top-left-radius: 0; /* Rimuovi arrotondamento sinistro */
    border-bottom-left-radius: 0;
}

    /* Immagine destra: posizione per riempire correttamente */
    .home-intro-icon-wrapper.right .home-intro-icon {
        object-position: right center; /* Posiziona immagine a destra per effetto orizzontale */
    }

/* Su desktop: assicurati che l'immagine destra riempia il box */
@media (min-width: 992px) {
    .home-intro-icon-wrapper.right {
        flex: 0 0 325px;
        width: 325px;
        min-width: 325px;
        max-height: 150px;
        height: 150px;
    }

        .home-intro-icon-wrapper.right .home-intro-icon {
            width: 100%;
            height: 100%;
            object-fit: fill !important;
            object-position: right center; /* Mantieni destra per orizzontale */
            display: block;
        }
}
.homepageimage {
    aspect-ratio: 16 / 9 !important; /* Forza rapporto 16:9 con priorità */
    object-fit: cover !important; /* Ritaglia se necessario per riempire il box */
    width: 100% !important; /* Occupa tutta la larghezza */
    height: auto !important; /* Altezza automatica basata su aspect-ratio, sovrascrive fisse */
    max-height: 500px !important; /* Limita altezza su desktop per evitare overflow */
}

/* Su schermi piccoli (mobile), riduci max-height per migliore visibilità */
@media (max-width: 575.98px) {
    .homepageimage {
        max-height: 40vh !important; /* Riduce a 40% viewport per spazi limitati */
    }
}

/* Centra e uniforma le figure dei loghi partner */
.partner-logo-figure {
    height: 120px; /* Altezza fissa per uniformità */
    display: flex;
    align-items: center; /* Centra immagine verticalmente nella figure */
    justify-content: center; /* Centra immagine orizzontalmente nella figure */
    margin: 0; /* Rimuovi margini extra se necessario */
}
@media (max-width: 575.98px) {
    .partner-logo-figure {
        height: 80px !important; /* Riduci altezza per avvicinare le icone */
    }

}

.figure-logo {
    background: transparent;
    text-align: center
}

    .figure-logo img {
        width: 400px;
        height: 250px;
        object-fit: contain;
        display: inline-block;
        background: transparent;
    }

/* Hero caption: left-start and vertically centered; AGID-friendly contrast + keyboard focus */
#accessibleCarouselHome .hero-caption {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    top: 50% !important;
    transform: translateY(-10%) !important; /* centra verticalmente rispetto all'immagine */
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    padding: 0 1rem !important; /* margine interno */
    z-index: 10 !important;
    text-align: left !important; /* parte da sinistra */
    pointer-events: none; /* lascia interazione all'immagine/controlli; rendi focusable il figcaption stesso */
}

    

/* Headline: blocco full-width, background per contrasto e dimensione baseline desktop = 6rem */
#accessibleCarouselHome .carousel-headline,
#accessibleCarouselHome .style-homepage-big {
    
    box-sizing: border-box !important;
    white-space: normal !important;
    word-break: break-word !important;
}

/* Desktop: baseline 6rem, ma con max-width per non estendersi troppo */
@media (min-width: 992px) {
    #accessibleCarouselHome .style-homepage-big {
        font-size: 6rem !important; /* richiesta: senza zoom mostra 6rem */
        line-height: 1 !important;
        margin: 0 0 .2rem 0 !important;
        padding: .22rem .6rem !important;
        color: #ffffff !important;
        border-radius: .375rem !important;
        max-width: 70ch !important; /* evita righe troppo lunghe */
        pointer-events: auto;
    }
}

/* Tablet e mobile: riduci progressivamente la max-size con clamp per adattarsi allo schermo */
@media (max-width: 991.98px) {
    #accessibleCarouselHome .hero-caption {
        top: auto !important;
        bottom: 1.6rem !important;
        transform: none !important;
    }

    #accessibleCarouselHome .style-homepage-big {
        font-size: clamp(1.4rem, 6.4vw, 2.8rem) !important;
        padding: .18rem .45rem !important;
        max-width: calc(100% - 1.6rem) !important;
    }
}

@media (max-width: 575.98px) {
    #accessibleCarouselHome .style-homepage-big {
        font-size: clamp(1.0rem, 8vw, 1.8rem) !important;
        padding: .14rem .35rem !important;
        display: block !important;
    }
}

/* Subtitle: background leggermente più leggero ma contrastato */
#accessibleCarouselHome .hero-sub {
    display: block;
    margin: .25rem 0 0 0;
    color: #ffffff !important;
    padding: .12rem .4rem !important;
    border-radius: .25rem !important;
    font-size: clamp(1rem,2.8vw,2.6rem) !important;
    pointer-events: auto;
}

/* High-contrast fallback */
@media (forced-colors: active) {
    #accessibleCarouselHome .style-homepage-big,
    #accessibleCarouselHome .hero-sub {
        color: Window !important;
        border: 2px solid Window !important;
    }
}
/* Responsive accessible table: horizontal scroll on small screens + stacked cards for very small viewports */
.table-responsive {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* Optional visual improvements */
.responsive-table {
    border-collapse: collapse;
    width: 100%;
    min-width: 480px; /* permette scorrimento su mobile se necessario */
}

    /* Caption */
    .responsive-table caption {
        caption-side: top;
        text-align: left;
        font-weight: 700;
        margin-bottom: .5rem;
    }

    /* Rimozione definitiva dei delimitatori (colonne + righe) mantenendo padding e accessibilità */
    .responsive-table,
    .responsive-table thead,
    .responsive-table tbody,
    .responsive-table tr,
    .responsive-table th,
    .responsive-table td {
        border: none !important;
        box-shadow: none !important;
        background: transparent !important;
        padding: 0 !important; /* reset per poi riallineare singole celle */
    }

        .responsive-table th,
        .responsive-table td {
            padding: .6rem .75rem !important;
            text-align: left;
        }

/* Mobile stacked (card-like): vista leggibile senza linee */
@media (max-width: 575.98px) {
    .responsive-table {
        width: 100%;
        min-width: auto;
    }
    .responsive-table thead {
        display: none;
    }

    .responsive-table,
    .responsive-table tbody,
    .responsive-table tr,
    .responsive-table td,
    .responsive-table th {
        display: block;
        width: 160px;
    }
    .rowprinc {
        width: 100% !important;
    }

    .responsive-table tr {
        margin-bottom: .75rem;
        border: none !important; /* nessun bordo esterno per il blocco riga */
        border-radius: .375rem;
        padding: .5rem 0 !important; /* spazio verticale fra le righe */
        background: transparent !important; /* mantiene nessuna linea di separazione */
    }

        .responsive-table td {
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
            padding: .5rem .75rem !important;
            border: none !important; /* nessuna linea separatrice */
        }

            /* etichetta visuale nei blocchi mobile; utile anche a screen reader come fallback */
            .responsive-table td::before {
                content: attr(data-label);
                font-weight: 700;
                margin-right: .5rem;
                color: #0b1a2b;
                width: 45%;
                flex: 0 0 45%;
            }

            .responsive-table td > * {
                flex: 1 1 55%;
            }
}

/* Focus visibility per accessibilità (link dentro la tabella) */
.responsive-table a:focus,
.responsive-table button:focus {
    outline: 3px solid #0047bb !important;
    outline-offset: 2px !important;
}
/* --- Privacy page: scope-specific always-open disclosure (no conflicts) ---
   Inserire questo blocco dopo tutte le regole esistenti in site.css. */

/* Nasconde eventuale trigger solo per il componente privacy */
.privacy-disclosure .offerta-disclosure-trigger,
.privacy-disclosure .privacy-disclosure-trigger {
    display: none !important;
}

/* Forza il pannello sempre visibile nella sola area privacy, anche se JS imposta hidden/aria-hidden */
.privacy-disclosure .offerta-disclosure-panel,
.privacy-disclosure .privacy-disclosure-panel,
.privacy-disclosure .offerta-disclosure-panel[hidden],
.privacy-disclosure .offerta-disclosure-panel[aria-hidden="true"] {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
}

/* Assicura heading visibile sulla pagina privacy (desktop look preservato su tutte le view) */
.privacy-disclosure .offerta-article-title,
.privacy-disclosure .privacy-disclosure-heading {
    display: block !important;
}

/* Layout mobile ottimizzato per il componente privacy */
@media (max-width: 575.98px) {
    .privacy-disclosure {
        grid-template-columns: 1fr !important;
        gap: 0 !important;
    }

        .privacy-disclosure .offerta-disclosure-media {
            display: block !important; /* se preferisci rimuoverla solo per privacy: display:none; */
            margin-bottom: .5rem !important;
        }

        .privacy-disclosure .offerta-disclosure-panel,
        .privacy-disclosure .privacy-disclosure-panel {
            padding: 1rem !important;
            margin-top: .25rem !important;
        }

        /* Migliora leggibilità lista su mobile per il componente privacy */
        .privacy-disclosure .offerta-list {
            padding-left: .25rem !important;
        }

            .privacy-disclosure .offerta-list li {
                margin-bottom: .45rem !important;
            }
}
/* Utility: break-anywhere — riutilizzabile per email, URL, parole lunghe
   Uso:
     - Inline:   <span class="break-anywhere break-anywhere--inline">longword</span>
     - Block:    <div class="break-anywhere break-anywhere--block">longword</div>
   Scopo: forzare il wrap solo dove serve, senza modificare il flusso globale. */
.break-anywhere {
    /* Preferenze moderne per spezzare testi lunghi */
    overflow-wrap: anywhere !important; /* Firefox/modern */
    word-break: break-word !important; /* WebKit fallback */
    white-space: normal !important; /* garantisce che il testo possa andare a capo */
    hyphens: auto !important; /* opzionale: consente sillabazione dove supportata */
    max-width: 100% !important; /* non superare il contenitore */
    box-sizing: border-box !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Variante per elementi inline (aiuta il wrap degli inline senza trasformarli in block) */
.break-anywhere--inline {
    display: inline-block !important;
    vertical-align: baseline;
}

/* Variante per elementi di tipo block (se vuoi forzare comportamento a blocco) */
.break-anywhere--block {
    display: block !important;
    width: 100% !important;
}

/* Piccolo fallback più aggressivo per casi estremi (usa solo se necessario) */
.break-anywhere--force {
    word-break: break-all !important; /* rompe anche nel mezzo delle parole — usare con cautela */
}

/* Scope ristretto: garantisce comportamento coerente solo dentro articoli (protezione da override globali) */
#offerta-root .break-anywhere,
.article-body .break-anywhere,
.content-body .break-anywhere {
    /* mantiene le regole sopra, utile quando ci sono regole più specifiche altrove */
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
    white-space: normal !important;
}

.script_height_h2 {
    font-size: 3rem !important;
}
.custom-width {
    display: inline-block; /* si ridimensiona al contenuto */
    width: auto; /* non forzare larghezza fissa */
    max-width: 100%; /* non superare la larghezza del genitore */
    box-sizing: border-box; /* include padding/boroder nel calcolo */
    white-space: normal; /* permette il wrapping quando raggiunge il max-width */
    overflow-wrap: anywhere; /* spezza parole molto lunghe per non rompere il layout */
    margin-right: 0;
    margin-left: 0;
}
@media (max-width: 575.98px) {
    .script_height_h2 {
        font-size: 2rem !important;
    }
    .custom-width {
        max-width: 100%;
        margin-right: auto;
        margin-left: auto;
    }
}

.background-solitario {
    background:#f3f4f6 !important;
}
.palline-image-mini {
    max-width: 20rem;
}

/* Rimane larga solo quanto il contenuto, senza forzare 100% */
.fit-content {
    display: inline-block; /* si ridimensiona al contenuto */
    width: auto; /* non forzare larghezza */
    max-width: 100%; /* non oltrepassare il genitore */
    box-sizing: border-box;
    vertical-align: middle;
    text-align: left;
    white-space: normal; /* permettere il wrap se necessario */
    overflow-wrap: anywhere; /* evita overflow con parole/URL molto lunghi */
}

/* Su telefoni, se preferisci che i link diventino full-width per usabilità:
   (decommenta la regola se vuoi questo comportamento) */
@media (max-width: 575.98px) {
    .fit-content.block-on-mobile {
        display: block;
        width: 100%;
    }
}

/* StoriaChiSiamo alternating image disclosures (non-invasive modifiers) */
@media (min-width: 992px) {
    /* Re-enable two-column grid for sections that explicitly carry images */
    .storia-page .offerta-disclosure.offerta-disclosure--with-img { grid-template-columns: minmax(260px, 30px) 1fr !important; gap: 1.25rem !important; }
    /* Show media column again (overrides earlier desktop hide) */
    .storia-page .offerta-disclosure.offerta-disclosure--with-img .offerta-disclosure-media { display: block !important; }
    /* Right-aligned image variant: swap column order */
    .storia-page .offerta-disclosure.offerta-disclosure--with-img.offerta-disclosure--img-right { grid-template-columns: 1fr minmax(260px, 30px) !important; }
    .storia-page .offerta-disclosure.offerta-disclosure--with-img.offerta-disclosure--img-right .offerta-disclosure-media { order: 2; }
    .storia-page .offerta-disclosure.offerta-disclosure--with-img.offerta-disclosure--img-right .offerta-disclosure-body { order: 1; }
}

/* Image styling */
.storia-page .offerta-disclosure.offerta-disclosure--with-img .disclosure-img { width: 100%; height: 90%; object-fit: cover; aspect-ratio: 1 / 1; border-radius: 12px; box-shadow: 0 10px 34px -6px rgba(11,26,43,.18); }

@media (max-width: 991.98px) {
    /* Mobile: ensure image sits above button; figure already before body so no extra changes */
    .storia-page .offerta-disclosure.offerta-disclosure--with-img .disclosure-img { aspect-ratio: 1 / 1; height: auto; }
}