/*
 Theme Name:   Bricks Child Theme
 Theme URI:    https://bricksbuilder.io/
 Description:  Use this child theme to extend Bricks.
 Author:       Bricks
 Author URI:   https://bricksbuilder.io/
 Template:     bricks
 Version:      1.1
 Text Domain:  bricks
*/



/** FIX PER CHROME **/
html, body {
    overflow-x: hidden !important;
}

#brx-content {
    overflow: hidden !important;
}


a, a:focus, button, button:focus, input:focus, textarea:focus  {
    outline : none!important;
}

body.home header:not(.scrolling) .my-header * {
    color: #ffffff!important;
}



/* ==========================================================================
   MENU
   ========================================================================== */
.os_menu_unimc ul.bricks-nav-menu > li {
    margin: 0;
    transition: all 0.3s ease;
}

.os_menu_unimc ul.bricks-nav-menu > li > a {
    position: relative;
    display: inline-block;
    padding: 5px 14px !important;
    font-weight: 700;
    font-style: normal !important;
    letter-spacing: 0.5px;
    color: #ffffff;
    background-color: transparent;
    z-index: 1;
    transition: all 0.25s cubic-bezier(0.25, 0.8, 0.25, 1);
    white-space: nowrap;
}

.os_menu_unimc ul.bricks-nav-menu > li > a::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: -1;
    background-color: transparent;
    border: 2px solid transparent;
    transition: all 0.25s cubic-bezier(0.25, 0.8, 0.25, 1);
    box-shadow: 0px 0px 0px transparent;
}

.os_menu_unimc ul.bricks-nav-menu > li > a:hover {
    color: #FBBA10 !important;
    transform: translate(-2px, -2px);
}

.os_menu_unimc ul.bricks-nav-menu > li > a:hover::before {
    background-color: #2B255D !important;
    border-color: #2B255D !important;
    box-shadow: 4px 4px 0px #FBE5D1;
}

.os_menu_unimc ul.bricks-nav-menu > li.current-menu-item > a,
.os_menu_unimc ul.bricks-nav-menu > li > a:active,
.os_menu_unimc ul.bricks-nav-menu > li > a[aria-current="page"] {
    color: #2B255D !important;
    transform: translate(-2px, -2px);
}

.os_menu_unimc ul.bricks-nav-menu > li.current-menu-item > a::before,
.os_menu_unimc ul.bricks-nav-menu > li > a:active::before,
.os_menu_unimc ul.bricks-nav-menu > li > a[aria-current="page"]::before {
    background-color: #FBBA10 !important;
    border-color: #FBBA10 !important;
    box-shadow: 4px 4px 0px #FBE5D1;
}

.scrolling .os_menu_unimc ul.bricks-nav-menu > li > a,
.bricks-sticky-header .os_menu_unimc ul.bricks-nav-menu > li > a {
    color: #2B255D;
}
.scrolling .os_menu_lingue ul.bricks-nav-menu > li > a,
.bricks-sticky-header .os_menu_lingue ul.bricks-nav-menu > li > a {
    color: #2B255D;
}

.scrolling .os_menu_unimc ul.bricks-nav-menu > li > a:hover,
.bricks-sticky-header .os_menu_unimc ul.bricks-nav-menu > li > a:hover {
    color: #FBBA10 !important;
}

.scrolling .os_menu_unimc ul.bricks-nav-menu > li > a:hover::before,
.bricks-sticky-header .os_menu_unimc ul.bricks-nav-menu > li > a:hover::before {
    background-color: #2B255D !important;
    box-shadow: 4px 4px 0px #FBE5D1;
}

.scrolling .os_menu_unimc ul.bricks-nav-menu > li.current-menu-item > a,
.scrolling .os_menu_unimc ul.bricks-nav-menu > li > a[aria-current="page"],
.bricks-sticky-header .os_menu_unimc ul.bricks-nav-menu > li.current-menu-item > a,
.bricks-sticky-header .os_menu_unimc ul.bricks-nav-menu > li > a[aria-current="page"] {
    color: #2B255D !important;
}

.scrolling .os_menu_unimc ul.bricks-nav-menu > li.current-menu-item > a::before,
.scrolling .os_menu_unimc ul.bricks-nav-menu > li > a[aria-current="page"]::before,
.bricks-sticky-header .os_menu_unimc ul.bricks-nav-menu > li.current-menu-item > a::before,
.bricks-sticky-header .os_menu_unimc ul.bricks-nav-menu > li > a[aria-current="page"]::before {
    background-color: #FBBA10 !important;
    box-shadow: 4px 4px 0px #FBE5D1;
}

.os_menu_unimc .bricks-mobile-menu > li > a {
    transition: all 0.25s ease;
    font-weight: 700;
    font-style: normal !important;
    white-space: nowrap;
}

.os_menu_unimc .bricks-mobile-menu > li > a:hover {
    color: #FBBA10 !important;
    background-color: #2B255D !important;
    padding-left: 25px !important;
}

.os_menu_unimc .bricks-mobile-menu > li.current-menu-item > a {
    color: #2B255D !important;
    background-color: #FBBA10 !important;
}

.os_menu_lingue ul.bricks-nav-menu > li.wpml-ls-item > a:hover span,
.os_menu_lingue ul.bricks-mobile-menu > li.wpml-ls-item > a:hover span {
    color: #FBBA10 !important;
    background-color: transparent !important;
}


.os_menu_lingue ul.bricks-nav-menu > li.os_menu_iscrizioni > a,
.os_menu_lingue ul.bricks-mobile-menu > li.os_menu_iscrizioni > a {
    display: inline-block;
    background-color: #FBE5D1 !important;
    color: #2B255D !important;
    border: 2px solid transparent !important;
    border-radius: 50px !important;
    padding: 6px 20px !important;
    font-weight: 700;
    text-align: center;
    white-space: nowrap;
    transition: all 0.25s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.os_menu_lingue ul.bricks-nav-menu > li.os_menu_iscrizioni > a:hover,
.os_menu_lingue ul.bricks-mobile-menu > li.os_menu_iscrizioni > a:hover {
    background-color: #FBBA10 !important;
    border-color: #ffffff !important;
    color: #2B255D !important;
    transform: translateY(-1px);
}

.os_menu_lingue ul.bricks-nav-menu > li.os_menu_iscrizioni > a:active,
.os_menu_lingue ul.bricks-mobile-menu > li.os_menu_iscrizioni > a:active {
    transform: translateY(0);
}

.os_menu_lingue ul.bricks-nav-menu {
    display: flex;
    align-items: center;
}

.os_menu_landing ul li a {
    position: relative !important;
    text-decoration: none !important;
    border-bottom: 2px solid rgba(255, 255, 255, 0.2) !important;
    transition: border-color 0.3s ease, color 0.3s ease !important;
}

.os_menu_landing ul li a:hover,
.os_menu_landing ul li a[aria-current="page"],
.os_menu_landing ul li.current-menu-item a,
.os_menu_landing ul li.current_page_item a,
.os_menu_landing ul li.current-menu-ancestor a,
.os_menu_landing ul li.active a,
.os_menu_landing ul li a.brx-open {
    border-bottom-color: #ffffff !important;
}

.scrolling .os_menu_landing ul li a:hover,
.scrolling .os_menu_landing ul li a[aria-current="page"],
.bricks-sticky-header .os_menu_landing ul li a:hover {
    border-bottom-color: #2B255D !important;
}

/* ==========================================================================
   SLIDER (Slide Iniziali)
   ========================================================================== */
.splide__slide .os_slide_slogan {
    opacity: 0;
    transform: scale(0.3) rotateX(25deg) translateY(50px);
    transform-origin: center center;
    transition: opacity 0.4s ease-out;
}

.splide__slide .os_slide_stella {
    opacity: 0;
    transform: scale(0) rotate(-180deg);
    transform-origin: center center;
    transition: opacity 0.3s ease-out;
}

.splide__slide.is-active .os_slide_slogan {
    opacity: 1;
    animation: osPop3D 0.7s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
    animation-delay: 0.2s;
}

.splide__slide.is-active .os_slide_stella {
    opacity: 1;
    animation: osRaggioStella 1.2s cubic-bezier(0.25, 1, 0.5, 1) forwards;
    animation-delay: 0.4s;
}

@keyframes osPop3D {
    0% { transform: scale(0.3) rotateX(30deg) translateY(60px); }
    70% { transform: scale(1.08) rotateX(-5deg) translateY(-5px); }
    100% { transform: scale(1) rotateX(0deg) translateY(0); }
}

@keyframes osRaggioStella {
    0% { transform: scale(0) rotate(-180deg); }
    60% { transform: scale(1.1) rotate(20deg); }
    100% { transform: scale(1) rotate(0deg); }
}





/* ==========================================================================
   FASCIA CONTENUTI & PULSANTI (Landing)
   ========================================================================== */
#os_prima_fascia {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.os_video_box_bianco,
.os_immagine_box_bianco {
    border: 12px solid #ffffff !important;
    border-radius: 60px !important;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.12) !important;
    overflow: hidden;
    width: 100%;
    max-width: 360px;
    aspect-ratio: 1 / 1;
}

.os_immagine_box_bianco {
    aspect-ratio: 4 / 5!important;
}

.os_video_box_bianco {
    position: relative;
    z-index: 2;
    transform: translate(-40px, 20px);
}

.os_video_box_bianco .brxe-video,
.os_video_box_bianco .brxe-video video,
.os_video_box_bianco video {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: cover !important;
}

.os_immagine_box_bianco {
    position: relative;
    z-index: 1;
    transform: translate(170px, -200px);
}

.os_immagine_box_bianco img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}



.os_immagine_box_square {
    position: relative !important;
    border: 12px solid #ffffff !important;
    border-radius: 60px !important;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.12) !important;
    overflow: hidden !important;
    width: 300px !important;
    height: 300px !important;
    max-width: 300px !important;
    max-height: 300px !important;
    aspect-ratio: 1 / 1 !important;
}

.os_immagine_box_square img,
.os_immagine_box_square .brxe-image {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    transform: scale(1.35) !important;
    transform-origin: center center !important;
    margin: 0 !important;
    padding: 0 !important;
}



.os_immagine_box_rect {
    position: relative !important;
    border: 12px solid #ffffff !important;
    border-radius: 60px !important;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.12) !important;
    overflow: hidden !important;
    width: 360px !important;
    height: 240px !important;
    max-width: 360px !important;
    max-height: 240px !important;
    aspect-ratio: 3 / 2 !important;
}

.os_immagine_box_rect img,
.os_immagine_box_rect .brxe-image {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    transform: scale(1.35) !important;
    transform-origin: center center !important;
    margin: 0 !important;
    padding: 0 !important;
}



@media (max-width: 767px) {
    .os_immagine_box_square {
        border-width: 8px !important;
        border-radius: 40px !important;
        width: 260px !important;
        height: 260px !important;
        max-width: 260px !important;
        max-height: 260px !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
}



/** PULSANTI **/

.os_cta_primario {
    display: inline-block;
    background-color: #2B255D !important;
    color: #ffffff !important;
    border: 2px solid #2B255D !important;
    border-radius: 50px !important;
    padding: 10px 26px !important;
    font-weight: 700;
    text-align: center;
    white-space: nowrap;
    transition: all 0.25s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.os_cta_primario:hover {
    background-color: #F3A108 !important;
    border-color: #F3A108 !important;
    color: #ffffff !important;
    transform: translateY(-2px);
    box-shadow: 0 10px 25px rgba(243, 161, 8, 0.35) !important;
}

.os_cta_secondario {
    display: inline-block;
    background-color: transparent !important;
    color: #2B255D !important;
    border: 2px solid #2B255D !important;
    border-radius: 50px !important;
    padding: 10px 26px !important;
    font-weight: 700;
    text-align: center;
    white-space: nowrap;
    transition: all 0.25s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.os_cta_secondario:hover {
    background-color: transparent !important;
    border-color: #F3A108 !important;
    color: #F3A108 !important;
    transform: translateY(-2px);
    box-shadow: 0 10px 25px rgba(243, 161, 8, 0.2) !important;
}

.os_cta_primario:active,
.os_cta_secondario:active {
    transform: translateY(0);
    box-shadow: 0 4px 10px rgba(243, 161, 8, 0.2) !important;
}



/* ==========================================================================
   PULSANTE SCURO BROCHURE (Stato Iniziale -> Hover Blu)
   ========================================================================== */

/* Predispone il pulsante per la transizione fluida */
.os_cta_scuro {
    display: inline-block;
    transition: all 0.25s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    box-shadow: 0 0 0 rgba(0, 0, 0, 0);
}

/* Hover: il fondo e il bordo passano al blu, si solleva e attiva l'ombra sfumata */
.os_cta_scuro:hover {
    background-color: #2B255D !important;
    border-color: #2B255D !important;
    color: #ffffff !important; /* Garantisce che il testo rimanga bianco leggibile */
    transform: translateY(-2px);
    box-shadow: 0 10px 25px rgba(43, 37, 93, 0.25) !important;
}

/* Active: feedback immediato alla pressione del click fisico */
.os_cta_scuro:active {
    transform: translateY(0);
    box-shadow: 0 4px 10px rgba(43, 37, 93, 0.15) !important;
}



.os_fascia_tre_ragazzi {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 40px 20px;
    width: 100%;
}

.os_immagine_box_orizz {
    border: 12px solid #ffffff !important;
    border-radius: 60px !important;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.12) !important;
    overflow: hidden;
    width: 100%;
    max-width: 1000px;
    height: 450px !important;
}

.os_immagine_box_orizz img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: top center !important;
}

.os_thin { font-weight: 400; }

.os_cta_chiaro {
    display: inline-block;
    transition: all 0.25s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}
.os_cta_chiaro:hover {
    background-color: #2B255D !important;
    border-color: #2B255D !important;
    color: #ffffff !important;
    transform: translateY(-2px);
    box-shadow: 0 10px 25px rgba(43, 37, 93, 0.25) !important;
}
.os_cta_chiaro:active {
    transform: translateY(0);
    box-shadow: 0 4px 10px rgba(43, 37, 93, 0.15) !important;
}


/* ==========================================================================
   PULSANTE CHIARO (Stato Iniziale -> Hover Blu con Testo Bianco)
   ========================================================================== */

/* Predispone il pulsante per la transizione fluida e morbida */
.os_cta_bianco {
    display: inline-block;
    transition: all 0.25s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    box-shadow: 0 0 0 rgba(0, 0, 0, 0);
}

/* Hover: transizione verso lo sfondo e il bordo blu, testo bianco e sollevamento */
.os_cta_bianco:hover {
    background-color: #2B255D !important;
    border-color: #2B255D !important;
    color: #ffffff !important;
    transform: translateY(-2px);
    box-shadow: 0 10px 25px rgba(43, 37, 93, 0.25) !important; /* Ombra blu coordinata */
}

/* Active: feedback immediato alla pressione fisica del click */
.os_cta_bianco:active {
    transform: translateY(0);
    box-shadow: 0 4px 10px rgba(43, 37, 93, 0.15) !important;
}



/* ==========================================================================
   ACCORDION NESTED
   ========================================================================== */
.os_accordion_elemento {
    border-bottom: 1px solid #2B255D !important;
    padding: 20px 0 !important;
}

.os_accordion_elemento .os_accordion_contenuto {
    display: none !important; 
}

.os_accordion_elemento.brx-open .os_accordion_contenuto {
    display: grid !important; 
}

.os_accordion_title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    padding: 10px 0;
}

.os_accordion_title h3 {
    color: #2B255D !important;
    font-weight: 700 !important;
    margin: 0 !important;
}

.os_accordion_icona {
    display: block !important;
    position: relative !important;
    width: 40px !important;
    height: 40px !important;
    background-color: #B50057 !important;
    border-radius: 50% !important;
    cursor: pointer;
    transition: background-color 0.3s ease !important;
}

.os_accordion_icona::before,
.os_accordion_icona::after,
.os_accordion_icona i {
    display: none !important;
}

.os_accordion_icona {
    background-image: linear-gradient(to right, #ffffff, #ffffff) !important;
    background-size: 14px 2px !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
}

.os_accordion_elemento:not(.brx-open) .os_accordion_icona {
    background-image: 
        linear-gradient(to right, #ffffff, #ffffff),
        linear-gradient(to bottom, #ffffff, #ffffff) !important;
    background-size: 14px 2px, 2px 14px !important;
    background-repeat: no-repeat !important;
    background-position: center center, center center !important;
}

.brx-icon-transform,
.os_accordion_elemento.brx-open .os_accordion_icona {
    transform: none !important;
    animation: none !important;
}

.os_accordion_col_video,
.os_accordion_col_img {
    width: 100% !important;
}

.os_accordion_col_video .brxe-video,
.os_accordion_col_img {
    border: 12px solid #ffffff !important;
    border-radius: 40px !important;
    box-shadow: 0 15px 42px rgba(0, 0, 0, 0.12) !important;
    overflow: hidden;
    width: 100% !important; 
    max-width: 100% !important; 
    aspect-ratio: 4 / 3 !important;
}

.os_accordion_col_video video,
.os_accordion_col_img img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
}

.os_accordion_contenuto {
    padding: 30px 0 10px 0 !important;
    gap: 50px !important;
    align-items: center;
}

.os_accordion_col_text {
    max-width: 85% !important; 
}

.os_testo_base {
    margin-bottom: 24px !important;
    color: #2B255D !important;
}

.os_accordion_col_text .os_cta_secondario {
    display: inline-block;
    background-color: transparent !important;
    color: #2B255D !important;
    border: 2px solid #2B255D !important;
    transition: all 0.25s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}

.os_accordion_col_text .os_cta_secondario:hover {
    background-color: #2B255D !important;
    border-color: #2B255D !important;
    color: #ffffff !important;
    transform: translateY(-2px);
    box-shadow: 0 10px 25px rgba(43, 37, 93, 0.25) !important;
}

.os_accordion_col_text .os_cta_secondario:active {
    transform: translateY(0);
    box-shadow: 0 4px 10px rgba(43, 37, 93, 0.15) !important;
}


/* Forza l'allineamento verticale di tutta la griglia interna */
.os_accordion_contenuto {
    align-items: center !important;
}

/* Configura la colonna di testo per auto-allinearsi al centro del suo spazio */
.os_accordion_col_text {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    height: 100% !important;
}


/* ==========================================================================
   VARIANTE ACCORDION LIGHT (Icona Arancio & Testi Bianchi)
   ========================================================================== */


/* Cambia il colore della linea di separazione inferiore in bianco */
.os_accordion_light .os_accordion_elemento {
    border-bottom: 1px solid #ffffff !important;
	padding: 10px 0px !important; 
}

/* Forza il titolo H3 dell'accordion in bianco */
.os_accordion_light .os_accordion_title h3 {
    color: #ffffff !important;
}

/* Cambia lo sfondo del cerchio dell'icona in Arancio #E25411 */
.os_accordion_light .os_accordion_icona {
    background-color: #E25411 !important;
}

/* Sovrascrive il colore del testo base interno e dei paragrafi in bianco */
.os_accordion_light .os_testo_base,
.os_accordion_light .brxe-text-basic,
.os_accordion_light p {
    color: #ffffff !important;
	margin-bottom: 0px !important;
}


.os_accordion_light .os_accordion_title h3 {
    font-size: 22px !important;
    line-height: 1.3 !important;
	color: #FBE5D1 !important;
}




/* ==========================================================================
   ANIMAZIONI FLUIDE LIVE (Raggio Blu e Raggio Arancio) & VISIBILITÀ EDITOR
   ========================================================================== */
.bricks-is-frontend .os_raggio_sfondo_blu,
.bricks-is-frontend .os_raggio_sfondo_giallo,
.bricks-is-frontend .os_raggio_sfondo_arancio,
.bricks-is-frontend .os_raggio_sfondo_grigio {
    opacity: 0 !important;
    transform: rotate(-15deg) !important;
    transform-origin: center center !important;
    transition: opacity 0.4s ease-out !important;
}

.os_raggio_sfondo_blu.is-animated,
.os_raggio_sfondo_giallo.is-animated,
.os_raggio_sfondo_arancio.is-animated,
.os_raggio_sfondo_grigio.is-animated {
    opacity: 1 !important;
    transform: rotate(0deg) !important;
    transition: opacity 0.6s ease-out, transform 0.8s cubic-bezier(0.25, 1, 0.5, 1) !important;
}


/* FASCIA E-LEARNING */
/* Forza il contenitore principale a fare da punto di riferimento */
#brxe-rmfxto {
    position: relative !important;
    z-index: 1 !important;
}

/* Isola i blocchi dei contenuti forzandoli sopra allo sfondo */
#brxe-fjrejd, 
#brxe-vmotls {
    position: relative !important;
    z-index: 3 !important;
}
/* Spinge il raggio arancione dietro a tutto e lo àncora geometricamente */
.os_raggio_sfondo_arancio {
    position: absolute !important;
    z-index: 2 !important;
    /* Se noti che si sposta dalla sua posizione originaria, regola questi valori top/left/right */
    bottom: 0;
    right: 0; 
    pointer-events: none !important; /* Evita che copra i link o renda i testi non evidenziabili */
}


/* ==========================================================================
   PULSANTE TORNA SU (Variante Soft-Orange con freccia ridotta)
   ========================================================================== */

/* Stato iniziale: fisso in basso a destra, cerchio a 58px e nascosto sul live */
.bricks-is-frontend .os_back_to_top {
    position: fixed !important;
    bottom: 30px !important;
    right: 30px !important;
    z-index: 9999 !important; /* Resta sopra a ogni elemento o raggio di sfondo */
    background-color: #FBE5D1 !important; /* Colore di sfondo richiesto */
    color: #E25411 !important; /* Colore della freccia interna */
    border: 2px solid #E25411 !important; /* Bordo sottile arancio */
    width: 58px !important; /* Dimensione fissa del cerchio */
    height: 58px !important; /* Dimensione fissa del cerchio */
    border-radius: 50% !important; /* Geometria perfettamente circolare */
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    cursor: pointer !important;
    opacity: 0;
    visibility: hidden;
    transform: translateY(20px); /* Micro-spostamento iniziale verso il basso */
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    box-shadow: 0 4px 15px rgba(226, 84, 17, 0.12) !important;
}

/* Stato attivo: classe iniettata dal JavaScript durante lo scroll */
.bricks-is-frontend .os_back_to_top.is-visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* Hover: inversione dei colori (pieno arancio) e leggero balzo verso l'alto */
.os_back_to_top:hover {
    background-color: #E25411 !important; /* Lo sfondo si riempie di arancio */
    color: #ffffff !important; /* La freccia interna diventa bianca */
    transform: translateY(-3px) scale(1.03) !important;
    box-shadow: 0 8px 20px rgba(226, 84, 17, 0.3) !important;
}

/* Feedback tattile al click */
.os_back_to_top:active {
    transform: translateY(0) scale(1) !important;
}

/* Forza la proporzione visiva della freccia interna (Icona a 30px) */
.os_back_to_top i, 
.os_back_to_top svg {
    width: 30px !important; /* Dimensione icona richiesta */
    height: 30px !important; /* Dimensione icona richiesta */
    font-size: 30px !important; /* Dimensione font icona richiesta */
    fill: currentColor !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
}



/* ==========================================================================
   BLOCCO TASSETTIVO SCROLL ORIZZONTALE (Anti-Overflow Raggi)
   ========================================================================== */

/* Impedisce il breakdown del layout causato dalle rotazioni degli SVG */
.bricks-is-frontend body,
.bricks-is-frontend #brx-content {
    overflow-x: hidden !important;
}

/* Se il raggio è dentro una sezione specifica, applichiamo il blocco anche lì per sicurezza */
.bricks-is-frontend .os_elearning_sfondo,
.bricks-is-frontend #brxe-rmfxto {
    overflow: hidden !important;
}



/* VIDEO TRA ATENEO E BORSE DI STUDIO */

#ateneo.brxe-section {
    position: relative !important;
    overflow: visible !important;
}

.os_video_box_bianco.os_video_across {
    position: relative !important;
    z-index: 10 !important;
    width: 100% !important;
    max-width: 400px !important;
    aspect-ratio: 5 / 4 !important;
    margin-left: auto !important;
    margin-right: 0 !important;
    transform: none !important;
    top: 200px;
    border: 12px solid #ffffff !important;
    border-radius: 60px !important;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.15) !important;
    overflow: hidden;
}

.os_video_across video,
.os_video_across .brxe-video {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}




/** LISTA MAPPA MACERATA **/

.os_mappa_punti {
    display: grid !important;
    grid-template-columns: 1fr 1fr 1fr 1.3fr !important;
    gap: 30px 0 !important;
}

.os_mappa_punti > div:nth-child(1),
.os_mappa_punti > div:nth-child(2) {
    padding-right: 30px !important;
}

.os_mappa_punti > div:nth-child(3) {
    padding-right: 0 !important;
}

.os_mappa_punti .os_lista_sfondo {
    margin-left: 0 !important;
}

@media (max-width: 991px) {
    .os_mappa_punti {
        grid-template-columns: 1fr 1fr !important;
        gap: 30px !important;
    }

    .os_mappa_punti > div:nth-child(1),
    .os_mappa_punti > div:nth-child(2),
    .os_mappa_punti > div:nth-child(3) {
        padding-right: 0 !important;
    }
}

@media (max-width: 767px) {
    .os_mappa_punti {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }
}


.os_lista_mappa {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    padding: 0 !important;
    margin: 0 !important;
    list-style: none !important;
}

.os_lista_mappa li {
    display: grid !important;
    grid-template-columns: 30px 1fr !important;
    align-items: baseline !important;
    margin: 0 !important;
    padding: 0 !important;
}

.os_lista_mappa li::before {
    color: #FBBA10 !important;
    font-weight: 600 !important;
    font-size: 16px !important; 
    display: inline-block;
}

.os_lista_mappa li:nth-child(1)::before { content: "1"; }
.os_lista_mappa li:nth-child(2)::before { content: "1a"; }
.os_lista_mappa li:nth-child(3)::before { content: "2"; }
.os_lista_mappa li:nth-child(4)::before { content: "3"; }
.os_lista_mappa li:nth-child(5)::before { content: "4"; }

.os_lista_mappa li > div {
    grid-column: 2 !important;
}

.os_lista_mappa .title {
    color: #FBBA10 !important;
    font-weight: 600 !important;
    font-size: 16px !important;
	line-height: 1.4em !important;
}

.os_lista_mappa li:nth-child(2) .title,
.os_lista_mappa li:nth-child(2) .description {
    color: #ffffff !important;
}


.os_lista_mappa_col2 {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    padding: 0 !important;
    margin: 0 !important;
    list-style: none !important;
}

.os_lista_mappa_col2 li {
    display: grid !important;
    grid-template-columns: 30px 1fr !important;
    align-items: baseline !important;
    margin: 0 !important;
    padding: 0 !important;
}

.os_lista_mappa_col2 li::before {
    color: #FBBA10 !important;
    font-weight: 600 !important;
    font-size: 16px !important; 
    display: inline-block;
}

.os_lista_mappa_col2 li:nth-child(1)::before { 
    content: "5"; 
}

.os_lista_mappa_col2 li:nth-child(2)::before { 
    content: "6"; 
}

.os_lista_mappa_col2 li:nth-child(3)::before { 
    content: "" !important;
    background-image: url('/wp-content/uploads/2026/06/ico_mensa.svg') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center 2px !important;
    width: 16px !important;
    height: 26px !important;
    transform: translateY(4px);
}

.os_lista_mappa_col2 li:nth-child(4)::before { 
    content: "8"; 
}

.os_lista_mappa_col2 li > div {
    grid-column: 2 !important;
}

.os_lista_mappa_col2 .title {
    color: #FBBA10 !important;
    font-weight: 600 !important;
    font-size: 16px !important;
	line-height: 1.4em !important;
}


.os_lista_mappa_col3 {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    padding: 0 !important;
    margin: 0 !important;
    list-style: none !important;
}

.os_lista_mappa_col3 li {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    margin: 0 !important;
    padding: 0 !important;
}

.os_lista_mappa_col3 li::before {
    content: "" !important;
    background-image: url('/wp-content/uploads/2026/06/icon_bus.svg') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: left center !important;
    width: 73px !important;
    height: 51px !important;
    display: block !important;
    margin-bottom: 8px !important;
}

.os_lista_mappa_col3 li > div {
    width: 100% !important;
}

.os_lista_mappa_col3 .title {
    color: #FBBA10 !important;
    font-weight: 600 !important;
    font-size: 16px !important;
}



.os_lista_sfondo {
    background-color: #FBBA10 !important;
    border-radius: 40px !important;
    padding: 25px !important;
    box-shadow: 0 15px 35px rgba(251, 186, 16, 0.15) !important;
    width: 100% !important;
    box-sizing: border-box !important;
}


/* ==========================================================================
   CONFIGURAZIONE GENERALE STRUTTURA LISTA COL4
   ========================================================================== */
.os_lista_mappa_col4 {
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
    padding: 0 !important;
    margin: 0 !important;
    list-style: none !important;
}

/* Linea di separazione scura tra gli elementi */
.os_lista_mappa_col4 li {
    margin: 0 !important;
    padding-bottom: 20px !important;
    border-bottom: 1px solid #1D1D1B !important;
}

/* Rimuove la linea di separazione dall'ultimo elemento */
.os_lista_mappa_col4 li:last-child {
    border-bottom: none !important;
    padding-bottom: 0 !important;
}

/* Stile comune per le descrizioni in grassetto */
.os_lista_mappa_col4 .description {
    font-weight: 700 !important;
}

/* ==========================================================================
   PRIMO ELEMENTO: Gestione Span (A capo e Bianco)
   ========================================================================== */
.os_lista_mappa_col4 li:nth-child(1) {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
}

.os_lista_mappa_col4 li:nth-child(1)::before {
    content: "" !important;
    background-image: url('/wp-content/uploads/2026/06/ico_cinque.svg') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: left center !important;
    width: 28px !important;
    height: 34px !important;
    display: block !important;
    margin-bottom: 8px !important;
}

.os_lista_mappa_col4 li:nth-child(1) .title {
    color: #ffffff !important;
    font-weight: 600 !important;
    font-size: 16px !important;
}

.os_lista_mappa_col4 li:nth-child(1) .description {
    color: #2B255D !important;
    display: block !important; /* Costringe la descrizione a fare da blocco unico */
    width: 100% !important;
}

/* Forza lo span interno ad andare sotto e diventare bianco */
.os_lista_mappa_col4 li:nth-child(1) .description span {
    display: block !important;
    color: #ffffff !important;
    margin-top: 4px !important; /* Opzionale: un minimo di stacco visivo */
}

/* ==========================================================================
   SECONDO ELEMENTO: Icona a sinistra (62x36), Titolo Blu
   ========================================================================== */
.os_lista_mappa_col4 li:nth-child(2) {
    display: grid !important;
    grid-template-columns: 75px 1fr !important;
    align-items: center !important;
}

.os_lista_mappa_col4 li:nth-child(2)::before {
    content: "" !important;
    background-image: url('/wp-content/uploads/2026/06/ico_bus.svg') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: left center !important;
    width: 62px !important;
    height: 36px !important;
    display: inline-block !important;
}

.os_lista_mappa_col4 li:nth-child(2) > .content {
    grid-column: 2 !important;
}

.os_lista_mappa_col4 li:nth-child(2) .title {
    color: #2B255D !important;
    font-weight: 600 !important;
    font-size: 16px !important;
}

/* ==========================================================================
   TERZO ELEMENTO: Icona (26x42), Allineamento perfetto a sinistra e compatto
   ========================================================================== */
.os_lista_mappa_col4 li:nth-child(3) {
    display: grid !important;
    grid-template-columns: 75px 1fr !important;
    align-items: start !important;
}

.os_lista_mappa_col4 li:nth-child(3)::before {
    content: "" !important;
    background-image: url('/wp-content/uploads/2026/06/ico_mensa_black.svg') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: left center !important;
    width: 26px !important;
    height: 42px !important;
    display: inline-block !important;
}

/* Allineamento rigido orizzontale */
.os_lista_mappa_col4 li:nth-child(3) .content,
.os_lista_mappa_col4 li:nth-child(3) .description {
    grid-column: 2 !important;
    margin: 0 !important;
	margin-top: -15px !important;
    padding: 0 !important;
}

/* Nasconde lo span separatore nativo di Bricks che spinge giù il testo */
.os_lista_mappa_col4 li:nth-child(3) .separator {
    display: none !important;
}

.os_lista_mappa_col4 li:nth-child(3) .title {
    color: #2B255D !important;
    font-weight: 600 !important;
    font-size: 16px !important;
    line-height: 1.1 !important;
    display: block !important;
    margin: 10px 0 2px 0 !important;
}

.os_lista_mappa_col4 li:nth-child(3) .description {
    color: #ffffff !important;
    line-height: 1.3 !important;
    margin-top: -25px !important;
}





/* ==========================================================================
   OVERLAY NERO SU VIDEO DI SFONDO (SECTION BEST TRAVEL)
   ========================================================================== */
.os_best_travel.has-bg-video .bricks-background-video-wrapper {
    position: relative !important;
}

.os_best_travel.has-bg-video .bricks-background-video-wrapper::after {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background-color: rgba(0, 0, 0, 0.50) !important; /* Nero al 50% */
    z-index: 1 !important; /* Si posiziona sopra il tag video */
    pointer-events: none !important;
}

/* Isola il container dei testi per spingerlo visivamente sopra l'overlay scuro */
.os_best_travel .brxe-container {
    position: relative !important;
    z-index: 2 !important;
}



/* ==========================================================================
   FAQ CON ACCORDION
   ========================================================================== */


/* Contenitore principale Flex per affiancare gli elementi */
.os_app_container {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 12px;
  margin-top: 24px;
}

/* Stile base del pulsante */
.os_app_button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: transparent !important;
  border: 2px solid #ffffff !important;
  border-radius: 8px;
  padding: 8px 16px;
  transition: border-color 0.3s ease, transform 0.2s ease;
  text-decoration: none;
}

/* Gestione delle icone SVG all'interno */
.os_app_button img {
  display: block;
  height: 32px;
  width: auto;
}

/* Effetto Hover: Il bordo diventa Giallo */
.os_app_button:hover {
  border-color: #FBBA10 !important;
  transform: translateY(-2px);
}



.os_tabs_contenuto_wrapper .os_cta_info {
    background-color: transparent !important;
    border: none !important;
    padding: 0 0 4px 0 !important;
    margin-bottom: 10px !important;
    color: #ffffff !important;
    font-weight: 600 !important;
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    transition: color 0.3s ease !important;
}

.os_tabs_contenuto_wrapper .os_cta_info::after {
    content: "" !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 2px !important;
    background-color: rgba(255, 255, 255, 0.3) !important;
    transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1) !important;
    transform-origin: left center !important;
}

.os_tabs_contenuto_wrapper .os_cta_info::before {
    content: "" !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 2px !important;
    background-color: #FBBA10 !important;
    transform: scaleX(0) !important;
    transform-origin: left center !important;
    transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1) !important;
    z-index: 1 !important;
}

.os_tabs_contenuto_wrapper .os_cta_info:hover {
    color: #FBBA10 !important;
    background-color: transparent !important;
}

.os_tabs_contenuto_wrapper .os_cta_info:hover::before {
    transform: scaleX(1) !important;
}

.os_tabs_contenuto_wrapper .os_cta_info:nth-of-type(2) {
    margin-bottom: 40px !important;
}

.os_tabs_contenuto_wrapper .os_cta_youtube {
    margin-bottom: 20px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-direction: row !important;
}

.os_tabs_contenuto_wrapper .os_cta_youtube i {
    margin-left: 15px !important;
    margin-right: 0 !important;
    order: 2 !important;
}


.os_tabs_contenuto_wrapper ul li,
.os_tabs_contenuto_wrapper ol li {
    color: #ffffff !important;
}

.os_tabs_contenuto_wrapper ul,
.os_tabs_contenuto_wrapper ol {
    margin-top: 0 !important;
	margin-bottom: 30px !important;
}


/* ==========================================================================
   STILE BASE E COLORI DEI LINK
   ========================================================================== */
.os_tabs_contenuto_wrapper .os_testo_base a {
    color: #ffffff !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    position: relative !important;
    display: inline !important;
    transition: color 0.3s ease !important;
}

.os_subtitle a {
    color: var(--arancio) !important; /* Il testo di partenza resta arancio */
    font-weight: 700 !important;
    text-decoration: none !important;
    position: relative !important;
    display: inline !important;
    transition: color 0.3s ease !important;
}

/* ==========================================================================
   STRUTTURA DELLA SOTTOLINEATURA (SEPARATA PER COLORE)
   ========================================================================== */
/* Sottolineatura fissa di partenza */
.os_tabs_contenuto_wrapper .os_testo_base a::after {
    content: "" !important;
    position: absolute !important;
    bottom: -2px !important;
    left: 0 !important;
    width: 100% !important;
    height: 2px !important;
    background-color: rgba(255, 255, 255, 0.3) !important;
    transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1) !important;
    transform-origin: left center !important;
}

.os_subtitle a::after {
    content: "" !important;
    position: absolute !important;
    bottom: -2px !important;
    left: 0 !important;
    width: 100% !important;
    height: 2px !important;
    background-color: rgba(43, 37, 93, 0.3) !important; /* Linea di partenza blu semi-trasparente */
    transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1) !important;
    transform-origin: left center !important;
}

/* Strato animato che si riempie all'hover */
.os_tabs_contenuto_wrapper .os_testo_base a::before {
    content: "" !important;
    position: absolute !important;
    bottom: -2px !important;
    left: 0 !important;
    width: 100% !important;
    height: 2px !important;
    background-color: #FBBA10 !important; /* Giallo per i testi standard */
    transform: scaleX(0) !important;
    transform-origin: left center !important;
    transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1) !important;
    z-index: 1 !important;
}

.os_subtitle a::before {
    content: "" !important;
    position: absolute !important;
    bottom: -2px !important;
    left: 0 !important;
    width: 100% !important;
    height: 2px !important;
    background-color: var(--blu) !important; /* La linea dell'hover diventa blu */
    transform: scaleX(0) !important;
    transform-origin: left center !important;
    transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1) !important;
    z-index: 1 !important;
}

/* ==========================================================================
   STATO HOVER ANIMAZIONE
   ========================================================================== */
.os_tabs_contenuto_wrapper .os_testo_base a:hover {
    color: #FBBA10 !important;
}

.os_subtitle a:hover {
    color: var(--blu) !important; /* Il testo all'hover diventa blu */
}

.os_tabs_contenuto_wrapper .os_testo_base a:hover::before,
.os_subtitle a:hover::before {
    transform: scaleX(1) !important;
}


/* ==========================================================================
   MACRO STRUTTURA: GRID A 2 COLONNE
   ========================================================================= */
.os_wrapper_aiuto {
    display: grid !important;
    grid-template-columns: 1fr auto !important;
    gap: 0 !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: 1200px;
    margin: 0 auto !important;
    position: relative !important;
	overflow: visible !important;
}

.os_colonna_sinistra_tabs {
    display: flex !important;
    flex-direction: column !important;
	min-height: 550px !important;
}

.os_sezione_aiuto, 
#brx-content main section:has(.os_wrapper_aiuto) {
    overflow: hidden !important;
}

/* ==========================================================================
   MENU TABS: BOTTONI CON TESTO ANCORATO A SINISTRA E PADDING 30PX
   ========================================================================= */
.os_tabs_menu_wrapper {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    justify-content: center !important;
    gap: 0px !important;
    margin: 0 auto !important;
    padding: 0 40px !important;
    border: none !important;
    width: auto !important;
}

.os_tab_bottone {
    background-color: #47417C !important;
    opacity: 1 !important;
    border-radius: 16px 16px 0 0 !important;
    padding: 12px 30px !important; /* 30px di padding a destra e sinistra */
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    border: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important; /* Spinge il contenuto nativamente a sinistra */
    flex: 1 !important;
    min-width: 240px !important;
    max-width: 240px !important;
}

.os_tab_titolo {
    color: #ffffff !important;
    opacity: 0.20 !important;
    font-weight: 700 !important;
    font-size: 16px !important;
    text-transform: uppercase !important;
    text-align: left !important;
    line-height: 1.3 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    width: 100% !important; /* Prende tutto lo spazio interno utile a sinistra */
}

/* STATO ATTIVO: Tab Selezionata */
.os_tab_bottone.brx-open {
    background-color: #2b255d !important;
}

.os_tab_bottone.brx-open .os_tab_titolo {
    color: #E25411 !important;
    opacity: 1 !important;
}

/* STATO HOVER: Passaggio del mouse su qualsiasi Tab o Titolo */
.os_tab_bottone:hover .os_tab_titolo,
.os_tab_titolo:hover {
    color: #E25411 !important;
    opacity: 1 !important;
}

/* ==========================================================================
   CONTENITORE CONTENUTO: IL GRANDE BOX BLU SCURO (4 BORDI ARROTONDATI)
   ========================================================================= */
.os_tabs_contenuto_wrapper {
    background-color: #2b255d !important;
    border-radius: 40px !important;
	border: 0px solid !important;
    padding: 40px !important;
    margin: 0 !important;
    width: 100% !important;
}


/* ==========================================================================
   COLONNA DESTRA: TOTALMENTE IMMUNE E ANCORATA A RETRO-AZIONE (ASSOLUTA)
   ========================================================================= */
.os_colonna_destra_testo {
    position: absolute !important;
    top: 110px !important;
    right: -42px !important;
    display: flex !important;
    align-items: flex-start !important;
    justify-content: center !important;
    width: 45px !important;
    z-index: 10 !important;
}

.os_testo_verticale_aiuto {
    color: #2b255d !important;
    font-size: 40px !important;
    font-weight: 700 !important;
    white-space: nowrap !important;
    writing-mode: vertical-rl !important;
    transform: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* ==========================================================================
   HOVER BOTTONI INTERNI OS_CTA_BIANCO (CAMBIO IN GIALLO)
   ========================================================================= */
.os_tabs_contenuto_wrapper .os_cta_bianco:hover {
    background-color: #FBBA10 !important;
    border-color: #FBBA10 !important;
    color: #2b255d !important;
}

/* ==========================================================================
   STILIZZAZIONE ACCORDION INTERNI
   ========================================================================= */
.os_accordion_light .os_accordion_elemento {
    border-bottom: 1px solid rgba(255, 255, 255, 0.2) !important;
    padding: 20px 0 !important;
    margin: 0 !important;
}

.os_accordion_light .os_accordion_elemento:last-child {
    border-bottom: none !important;
}

.os_accordion_light .accordion-title-wrapper h3 {
    color: #ffffff !important;
    font-size: 22px !important;
    font-weight: 600 !important;
}

.os_accordion_light .os_accordion_icona {
    color: #fbba10 !important;
    font-size: 24px !important;
}

.os_accordion_light .os_testo_base {
    color: #ffffff !important;
    font-size: 16px !important;
    line-height: 1.6 !important;
}



.os_tabs_contenuto_wrapper .bricks-button.bricks-background-info {
    background-color: transparent !important;
    border: none !important;
    padding: 0 0 4px 0 !important;
    margin-bottom: 15px !important;
    color: #ffffff !important;
    font-weight: 600 !important;
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    transition: color 0.3s ease !important;
    width: max-content !important;
}

.os_tabs_contenuto_wrapper .bricks-button.bricks-background-info::after {
    content: "" !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 2px !important;
    background-color: rgba(255, 255, 255, 0.3) !important;
    transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1) !important;
    transform-origin: left center !important;
}

.os_tabs_contenuto_wrapper .bricks-button.bricks-background-info::before {
    content: "" !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 2px !important;
    background-color: #FBBA10 !important;
    transform: scaleX(0) !important;
    transform-origin: left center !important;
    transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1) !important;
    z-index: 1 !important;
}

.os_tabs_contenuto_wrapper .bricks-button.bricks-background-info:hover {
    color: #FBBA10 !important;
    background-color: transparent !important;
}

.os_tabs_contenuto_wrapper .bricks-button.bricks-background-info:hover::before {
    transform: scaleX(1) !important;
}




/* ==========================================================================
   RESPONSIVE LAYOUTS
   ========================================================================== */
@media (max-width: 991px) {
	
	.scrolling button.os_menu_mobile_attiva i,
	.bricks-sticky-header button.os_menu_mobile_attiva i {
		color: #2B255D !important;
	}
	
	html:has(button.os_menu_mobile_attiva[aria-expanded="true"]),
	body:has(button.os_menu_mobile_attiva[aria-expanded="true"]) {
		overflow: hidden !important;
		height: 100vh !important;
	}
	
    .os_immagine_box_orizz {
        height: auto !important;
        aspect-ratio: 5 / 4;
        border-width: 8px !important;
        border-radius: 40px !important;
		max-width: 100% !important;
    }
	
    .os_wrapper_aiuto {
        grid-template-columns: 1fr !important;
        gap: 30px !important;
    }
    
    .os_colonna_destra_testo {
        grid-column: 1 !important;
        order: -1 !important;
        padding-left: 0 !important;
    }
    
    .os_testo_verticale_aiuto {
        writing-mode: horizontal-tb !important;
        text-align: center !important;
        font-size: 24px !important;
    }
    
    .os_tabs_menu_wrapper {
        flex-wrap: wrap !important;
        padding: 0 !important;
    }
    
    .os_tab_bottone {
        max-width: none !important;
    }
    
    .os_tabs_contenuto_wrapper {
        border-radius: 24px !important;
        padding: 25px !important;
    }
	
}

@media (max-width: 767px) {
	
    .os_accordion_contenuto {
        grid-template-columns: 1fr !important;
        gap: 25px !important;
    }
    .os_accordion_col_text {
        max-width: 100% !important;
    }
    .os_video_box_bianco {
        transform: translate(0px, 0px) !important;
    }
	
	.os_immagine_box_rect {
		border-width: 8px !important;
		border-radius: 40px !important;
		width: 260px !important;
		height: 173px !important;
		max-width: 260px !important;
		max-height: 173px !important;
		margin-left: auto !important;
		margin-right: auto !important;
	}
	
	

	.os_lista_mappa_col4 li:nth-child(2),
    .os_lista_mappa_col4 li:nth-child(3) {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }
    .os_lista_mappa_col4 li:nth-child(2) > .content,
    .os_lista_mappa_col4 li:nth-child(3) .content,
    .os_lista_mappa_col4 li:nth-child(3) .description {
        grid-column: 1 !important;
    }
	

    .os_tab_bottone {
        flex: 1!important;
        border-radius: 8px !important;
        padding: 10px 15px !important;
        min-width: 140px !important;
    }
    
    .os_tabs_contenuto_wrapper {
        border-radius: 16px !important;
    }
	
	.brxe-block.os_tabs_menu_wrapper.tab-menu {
        display: flex !important;
        flex-direction: column !important;
        width: 90% !important;
        gap: 0px !important;
    }

    .brxe-div.os_tab_bottone.tab-title {
        width: 100% !important;
        max-width: 100% !important;
        display: block !important;
        text-align: center !important;
    }
	
	.os_accordion_light .os_testo_base {
	  font-size: 15px !important;
	}
	
	
    a.brxe-button.os_cta_youtube {
        padding: 10px 16px !important;
        font-size: 14px !important;
        line-height: 1.2 !important;
        text-align: center !important;
        display: inline-flex !important;
        justify-content: center !important;
        align-items: center !important;
    }

    a.brxe-button.os_cta_youtube i {
        display: none !important;
    }
	
	.os_lista_col_bordo.brxe-block {
	  padding-left: 0px !important;
	  border-left: 0px solid !important;
	}
	
	.os_lista_mappa_col4 li:nth-child(3) .description {
	  margin-top: 0px !important;
	}
	
	
	.os_accordion_light .os_accordion_title h3 {
    max-width: 80% !important;
	}
	
	

	
}