/* ==========================================================================
   1. BASE E STILI COMUNI
   ========================================================================== */
body {
    color: #5d4129;
}
main {
    width: 100%;
}
.gabbia-component {
    display: flex;
    width: 100%;
}
.card {
    border: 0;
}
.fascia-fluida {
    width: 100% !important;
    max-width: 100% !important;
}
body.wrapper-fluid .site-grid {
    grid-gap: 0;
}
.container-component > * + * {
    margin-top: 0 !important;
}

/* Link generali */
a {
    color: #583e1c;
    text-decoration: none;
}
a:hover {
    color: #583e1c;
    outline: 2px dotted #f00;
    text-decoration: underline;
}
a.esterno {
    background: url("../images/icone/blank.png") no-repeat left center;
    padding-left: 18px;
    color: #444;
    text-decoration: none;
}
a.esterno:hover {
    color: #008ba9;
    text-decoration: underline;
}
a.wf_file {
    display: inline-block;
    border: 1px solid #583e1c;
    text-align: center;
    padding: 5px;
    color: #583e1c;
    text-decoration: none;
}
a.wf_file:hover {
    background-color: #583e1c;
    color: #fff;
    text-decoration: underline;
}
a.button,
a.btn {
    display: inline-block;
    margin-bottom: 0;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    line-height: 20px;
    text-decoration: none;
    border: 2px solid #583e1c;
    background: transparent;
    box-sizing: border-box;
    border-radius: 2px;
    font-family: 'Droid Sans', sans-serif;
    font-size: 14px;
    font-weight: 400;
    padding: 8px 44px;
    height: auto;
    color: inherit;
    text-transform: uppercase;
}
a.button:hover,
a.btn:hover {
    text-decoration: none;
    transition: all .2s ease-in;
    color: #fff;
    background: #583e1c;
}
figure.center.item-image {
    text-align: center;
}

/* ==========================================================================
   2. LAYOUT
   ========================================================================== */
@supports (display: grid) {
    .site-grid {
        grid-template-areas:
            ". banner banner banner banner ."
            ". top-a top-a top-a top-a ."
            ". top-b top-b top-b top-b ."
            ". top-c top-c top-c top-c ."
            ". top-d top-d top-d top-d ."
            ". comp comp comp comp ."
            ". side-r side-r side-r side-r ."
            ". side-l side-l side-l side-l ."
            ". bot-a bot-a bot-a bot-a ."
            ". bot-b bot-b bot-b bot-b ."
            ". bot-c bot-c bot-c bot-c .";
    }
}


/* ==========================================================================
   3. HEADER & NAVIGATION
   ========================================================================== */
.container-header {
    background-color: #fff;
    background-image: none;
}
.header.container-header.full-width.position-sticky.sticky-top {
    z-index: 1000;
}
.container-header .container-below-top {
    background-color: #008aad;
}
.container-header .container-below-top .social ul {
    padding: 0;
    margin: 0;
    list-style: none;
}
.container-header .container-below-top .social ul li {
    display: block;
    background-image: none;
    position: relative;
    padding: 4px 0;
    float: left;
    margin: 0 4px;
}
.djacc-popup.djacc--static .djacc__openbtn {
    margin: 0 !important;
}
.container-header .navbar-brand {
    margin: 0 auto;
}
.container-header .container-nav {
    background-color: #bca88e;
    padding-bottom: 0.5em;
}
.container-header .container-nav .form-control,
.container-header .container-nav .btn {
    padding: .3rem 1rem;
}
.container-header .mod-menu > li > a {
    font-size: 15px;
    font-weight: bold;
    color: #fff;
    text-transform: uppercase;
}
.container-header .mod-menu > li.current > a {
    color: #5b4126;
}
.container-header .metismenu > li.active > a::after {
    height: 0;
}
.metismenu.mod-menu .metismenu-item {
    padding: .3em 0.7em;
}
.navbar-toggler {
    background-color: transparent;
    border: 1px solid rgba(255, 255, 255, 0.7);
    padding: 5px 10px;
    border-radius: 4px;
    color: #fff;
}
.container-header .container-search,
.container-header nav {
    margin-top: 0px;
}
.container-search .btn {
    border: 2px solid #ffffff;
    color: #ffffff !important;
    background-color: transparent;
}
.is-scrolled .container-below-top {
    display: none;
}
.is-scrolled .navbar-brand img{
   /* width: 350px;*/
}

/* ==========================================================================
   4. HEADER BACKGROUNDS (HERO IMAGES)
   ========================================================================== */
.header-bg {
    margin-top: 0 !important;
    background-size: cover;
    background-position: center center;
    height: 0; /* Default: altezza zero se non ha classi specifiche */
}

/* Pagine ad altezza 450px */
.header-bg.chi-siamo,
.header-bg.statuto,
.header-bg.comprensorio,
.header-bg.governance,
.header-bg.storia,
.header-bg.servizi-online,
.header-bg.regolamenti-normative,
.header-bg.gare-e-appalti,
.header-bg.tutela-ambiente,
.header-bg.irrigazione,
.header-bg.lavori,
.header-bg.didattica,
.header-bg.contatti,
.header-bg.news {
    height: 450px;
}

/* Pagine ad altezza ridotta (145px) */
.header-bg.amministrazione-trasparente,
.header-bg.modulistica,
.header-bg.bollettino-fonti-idriche,
.header-bg.piano-classifica {
    height: 145px;
}

/* Immagini specifiche */
.header-bg.chi-siamo { background-image: url("../images/headers/chisiamo.jpg"); }
.header-bg.statuto { background-image: url("../images/headers/statuto.jpg"); }
.header-bg.comprensorio { background-image: url("../images/headers/comprensorio.jpg"); }
.header-bg.governance { background-image: url("../images/headers/governance.jpg"); }
.header-bg.storia { background-image: url("../images/headers/storia.jpg"); }
.header-bg.amministrazione-trasparente { background-image: url("../images/headers/amministrazionetrasparente.png"); }
.header-bg.servizi-online { background-image: url("../images/headers/servizionline.jpg"); }
.header-bg.regolamenti-normative { background-image: url("../images/headers/regolamenti_normative.jpg"); }
.header-bg.gare-e-appalti { background-image: url("../images/headers/gare_appalti.jpg"); }
.header-bg.modulistica { background-image: url("../images/headers/modulistica.png"); }
.header-bg.bollettino-fonti-idriche { background-image: url("../images/headers/bollettino.png"); }
.header-bg.piano-classifica { background-image: url("../images/headers/pianodiclassifica.png"); }
.header-bg.tutela-ambiente { background-image: url("../images/headers/tutela_ambiente.jpg"); }
.header-bg.irrigazione { background-image: url("../images/headers/irrigazione.jpg"); }
.header-bg.lavori { background-image: url("../images/headers/lavori.jpg"); }
.header-bg.didattica { background-image: url("../images/headers/didattica.jpg"); }
.header-bg.contatti { background-image: url("../images/headers/contatti.jpg"); }
.header-bg.news { background-image: url("../images/headers/news.jpg"); }

/* ==========================================================================
   5. BREADCRUMBS
   ========================================================================== */
.mod-breadcrumbs__wrapper {
    width: 100%;
}
.breadcrumb {
    background-color: transparent;
    font-size: 0.8rem;
    color: #5d4129;
}
.breadcrumb a,
.breadcrumb-item.active {
    color: #5d4129;
}
.breadcrumb a {
    text-decoration: none;
}
.breadcrumb a:hover {
    text-decoration: underline;
}

/* ==========================================================================
   6. SECTIONS & HOMEPAGE BLOCKS
   ========================================================================== */
.container-banner {
    margin-bottom: 0;
}

/* TOP A - CONTATORI */
.container-top-a > * {
    margin: 0;
}
h3.card-header {
    background-color: #ebe5dd;
    padding: 40px;
    color: #5d4129;
    text-align: center;
    font-size: 28px;
    text-transform: uppercase;
}
.top-a.card.numeri .jmm-counter {
    width: 100%;
}
.top-a.card.numeri .jmm-counter .item-1,
#jm-top1 .jmm-counter .item-4,
.top-a.card.numeri .jmm-counter .item-2,
#jm-top1 .jmm-counter .item-3 {
    background-color: #fff;
    min-height: 382px;
}
.top-a.card.numeri .jmm-counter.default .jm-count {
    height: 205px;
    width: 205px;
    padding: 60px 25px 0;
    margin: 20px auto;
    font-size: 54px;
    background-image: url("../images/sfondo-contatori.png");
    color: #279cb4;
    text-align: center;
    font-family: Tahoma, Geneva, Verdana, sans-serif;
    font-weight: 400;
}
.top-a.card.numeri .jmm-counter.default .jm-count .jmm-unit {
    font-size: 30px;
    display: block;
}
.top-a.card.numeri .jmm-counter .jmm-subtitle {
    color: #5d4129 !important;
    font-family: Tahoma, Verdana, sans-serif;
    font-size: 17px;
    font-weight: bold;
    text-transform: uppercase;
    padding: 0 10px 10px;
    line-height: 18px;
}
.top-a.card.numeri .jmm-counter .jmm-alt {
    color: #5d4129 !important;
    font-family: Tahoma, Verdana, sans-serif;
    font-size: 15px;
    text-transform: none;
    line-height: 20px;
}
.top-a.card.numeri .jmm-alt span {
    display: block;
    font-size: 25px;
    font-weight: bold;
    line-height: 40px;
}

/* TOP B - VIDEO */
.top-b.card.video .card-body {
    padding: 0;
    background-color: #008aad;
}

/* TOP C - LINK STRUTTURATI */
.container-top-c {
    grid-area: top-c;
    position: relative;
}
.container-top-c > * {
    flex: 1;
    margin: auto !important;
}
.container-top-c > * + * {
    flex: 1;
    margin: .5em 0;
}
.grid-child.container-top-c {
    background-image: url("../images/background-altrilink.jpg");
    background-size: cover;
    padding-top: 250px;
    padding-bottom: 60px;
    margin-top: -8px;
}
.grid-child.container-top-c .top-c.no-card {
    width: 49%;
}
.grid-child.container-top-c .top-c.no-card .altro-link1 a,
.grid-child.container-top-c .top-c.no-card .altro-link2 a {
    color: #fff;
    border: 2px solid #fff;
    margin: 5px 5px 20px;
    padding: 20px;
    text-align: center;
    font-size: 16px;
    text-decoration: none;
}
.grid-child.container-top-c .top-c.no-card .altro-link1 a {
    width: 50%;
    float: right;
}
.grid-child.container-top-c .top-c.no-card .altro-link2 a {
    width: 50%;
    display: block;
}
.grid-child.container-top-c .top-c.no-card a:hover {
    background-color: #fff;
    color: #5d4129 !important;
    text-decoration: none !important;
}

/* TOP D */
.container-top-d-full {
    background-color: #d5ddb5;
    color: #5d4129;
    line-height: 1.3em;
    padding: 60px 0 30px;
    margin-bottom: 60px;
}
.top-d h4,
.top-d span {
    color: #509042;
}
.top-d h4 {
    font-size: 17.5px;
}
.top-d a {
    color: #3d3c3f;
}
.top-d a:hover {
    color: #008BA9;
}


/* ==========================================================================
   7. ARTICOLI E CONTENUTI
   ========================================================================== */
.page-header h1,
.com-weblinks-category h1 {
    color: #008aad;
    font-weight: bold;
    text-transform: uppercase;
    padding-bottom: 20px;
    text-align: center;
}
body.contatti .page-header h1 {
    display: none;
}
body.modulistica h3,
body.bollettino-fonti-idriche h3,
body.piano-classifica h3,
body.regolamenti h3 {
    color: #019db6;
    font-weight: bold;
    font-size: 38px;
    text-transform: uppercase;
}
.fascia-articolo {
    background: #d4eff3;
    width: 100vw;
    transform: translateX(-50%);
    left: 50%;
    position: relative;
    padding: 40px 0;
    margin: 40px 0 0 0;
}
.fascia-articolo h3 {
    font-size: 1.53rem;
}
.img-comprensorio {
    margin-left: 420px;
}
.com-content-article.item-pagecomprensorio,
.com-content-article.item-pagestoria {
    margin-bottom: -17px;
}
body.storia .fascia-articolo img {
    float: none;
    margin: 0 20px 20px 0;
    width: 350px;
}
.certificazione-sx img {
    max-width: 170px;
}
p.readmore {
    display: block;
    text-align: right;
    text-decoration: none !important;
}

/* GOVERNANCE SPECIFIC */
body.governance ul li {
    padding-bottom: 10px;
}
body.governance .governance-wrap .gov-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 14px 18px !important;
    float: none !important;
    width: 100% !important;
    max-width: none !important;
}
body.governance .governance-wrap .gov-item {
    box-sizing: border-box !important;
    float: none !important;
    width: auto !important;
    max-width: none !important;
    background: #fff !important;
    padding: 12px 14px !important;
    border: 1px solid rgba(0,0,0,0.12) !important;
    border-radius: 4px !important;
    height: 100% !important;
}
body.governance .governance-wrap .gov-name {
    font-weight: 700 !important;
    letter-spacing: 0.3px !important;
    color: #5d4129 !important;
    text-transform: uppercase !important;
}
body.governance .governance-wrap .gov-role {
    margin-top: 6px !important;
    font-size: 0.95em !important;
    color: rgba(0,0,0,0.75) !important;
}

/* HOMEPAGE SPECIFIC (itemid-101) */
body.home .container-component {
    background-color: #ebe5dd;
}

body.home main,
body.home .blog-featured {
    width: 100%;
}

body.home .blog-featured .page-header h1 {
    text-align: center;
    color: #5d4129 !important;
    font-size: 28px;
    padding: 30px 0 0;
}

.main-bottom .card {
    background-color: transparent;
}
.main-bottom .card .mod-articlescategory {
    background-color: #fff;
    padding: 20px 40px;
}
.vedi-ultime .custom {
    text-align: center;
}
.vedi-ultime .custom .btn-news {
    display: inline-block;
    margin-bottom: 0;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    line-height: 20px;
    text-decoration: none;
    box-sizing: border-box;
    border-radius: 2px;
    font-family: 'Droid Sans', sans-serif;
    font-size: 14px;
    padding: 8px 44px;
    height: auto;
    text-transform: uppercase;
    background-color: #519041;
    border: 1px solid #519041;
    color: #fff;
    font-weight: bold;
}
.vedi-ultime .custom .btn-news:hover {
    background-color: #fff;
    color: #5d4129;
}
.ultime-notizie ul.mod-articlescategory li a {
    color: #5d4129;
    font-weight: bold;
    text-transform: uppercase;
    margin: 0;
    display: block;
}
.ultime-notizie ul.mod-articlescategory li .mod-articles-category-readmore a {
    color: #5d4129;
    text-align: right;
    font-weight: normal;
    text-transform: none;
}

/* ==========================================================================
   8. CATEGORIE E LINK
   ========================================================================== */
ul.category.list-unstyled {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    padding: 0;
    margin: 0;
    list-style: none;
}
ul.category.list-unstyled li.list-group {
    margin-top: 0 !important;
    display: block;
    border: 1px solid #aed2d3;
    border-radius: 0;
    padding: 20px;
}
ul.category.list-unstyled li:nth-child(even) { background-color: #cae1e2; }
ul.category.list-unstyled li:nth-child(odd)  { background-color: #aed2d3; }
ul.category.list-unstyled .list-title.list-group-item {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    height: 100%;
}
ul.category.list-unstyled .categoryservizi-online {
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
    text-decoration: none;
    text-transform: uppercase;
    color: #5d4129 !important;
    font-size: 20px;
    font-weight: bold;
    border: 1px solid #019db6;
    padding: 40px 30px 30px 30px;
    min-height: 180px;
    height: 100%;
    box-sizing: border-box;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
ul.category.list-unstyled .icon-globe {
    display: none;
}

/* ==========================================================================
   9. SIDEBAR & DOCMAN
   ========================================================================== */
.sidebar-right h3 {
    font-size: 15px !important;
    font-weight: bold !important;
    text-transform: none !important;
    color: #5d4129 !important;
    border-bottom: 1px solid #898a8c;
    padding-bottom: 7px;
    margin-bottom: 10px;
}
.k-ui-namespace .mod_docman ul {
    padding: 0;
    font-size: 13px;
}
.k-ui-namespace .mod_docman ul li {
    padding: 0 0 0 15px;
}
.sidebar-right .mod_docman--categories ul li .koowa_header__item--image_container {
    display: none;
}
.k-ui-namespace .mod_docman ul li a {
    text-decoration: none;
}
.k-ui-namespace .mod_docman ul li a:hover {
    outline: 2px dotted #f00;
}
.k-ui-namespace .docman_document {
    margin-top: 20px;
}
.docman_list_layout .docman_document_icona {
    min-height: 150px;
    padding: 0 !important;
}
.k-ui-namespace .docman_list__content {
    width: 98% !important;
}
.koowa_header__image_link.docman_track_download {
    display: block;
    border: 1px solid #5d4129;
    background-color: #5d4129;
    color: #ebe5dd;
    float: right;
    padding: 10px;
}
.koowa_header__image_link.docman_track_download:hover {
    background-color: #ebe5dd;
    color: #5d4129;
}
.docman_list_layout .docman_document {
    line-height: 1.2;
    border-bottom: 1px solid #5d4129;
    padding-bottom: 20px;
}

/* ==========================================================================
   10. NEWS & CONTATTI
   ========================================================================== */
/* Contatti */
.riga-contatti-download {
    width: 600px !important;
    margin: 0 auto;
}
.contatti-download {
    width: 300px;
    float: left;
}

/* News */
.blog .pull-left.item-image {
    min-width: 300px;
}
.pull-left.item-image,
figure.pull-left {
    margin-right: 30px;
}
.pull-left {
    float: left;
}
.blog-item {
    flex-direction: inherit;
}
.view-article .page-header h1 {
    color: #008aad;
    font-weight: bold;
    font-size: 28px !important;
    text-transform: uppercase;
    padding-bottom: 20px;
    text-align: left;
}
.view-category .page-header h2 a {
    color: #444;
    font-weight: bold;
    font-size: 28px !important;
    text-transform: uppercase;
    padding-bottom: 20px;
    text-align: left;
    text-decoration: none;
}
h2.placemarkHead {
    font-size: 16px;
}
.djacc-popup .djacc__openbtn--default,
.djacc-popup .djacc__openbtn{
    background: #ffffff!important;
    height: 30px!important;
    width: 30px!important;
}

/* ==========================================================================
   11. FOOTER & BOTTOM SECTIONS
   ========================================================================== */
.container-bottom-a > * {
    margin: 0;
}
.bottom-a::before {
    content: " ";
    background-image: url("../images/background-prefooter.jpg");
    background-size: cover;
    background-position: center;
    padding-top: 250px;
    display: block;
}
.bottom-a h3 {
    text-align: center;
    margin: 26px 0;
}
.container-bottom-b,
.container-bottom-c {
    background-color: #008aad;
    padding: 60px 30px;
    color: #fff;
}
.container-bottom-b a,
.container-bottom-c a {
    color: #fff;
}
.container-bottom-b > * {
    flex: 1;
    margin: auto !important;
}
.container-bottom-b .bottom-b {
    text-align: center;
}
.container-bottom-b > * + *,
.container-bottom-c > * + * {
    flex: 1;
    margin: .5em 0;
}
.container-bottom-c {
    grid-area: bot-c;
    grid-column: full-start / full-end;
    position: relative;
    padding: 3rem 0;
    font-weight: bold;
}
.container-bottom-c > .container-xl {
    max-width: 1320px;
    margin-right: auto;
    margin-left: auto;
}
.container-bottom-c .bottom-c.no-card:nth-child(1) {
    flex: 0 0 calc(50% - 1rem);
    max-width: calc(50% - 1rem);
    text-align: center;
}
.container-bottom-c .bottom-c.no-card:nth-child(2),
.container-bottom-c .bottom-c.no-card:nth-child(3) {
    flex: 0 0 calc(25% - 1rem);
    max-width: calc(25% - 1rem);
}
.bottom-c h3 {
    font-size: 1.15rem;
    text-transform: uppercase;
}
.container-bottom-c .numero-verde img {
    max-width: 330px;
}
.container-bottom-c ul {
    padding: 0;
    margin: 0;
}
.container-bottom-c ul li {
    display: block;
    background-image: none;
    position: relative;
    padding: 4px 0;
    float: left;
    margin: 0 4px;
}

/* Footer */
.footer {
    color: #fff;
    background-color: #ad9c88;
    background-image: none;
    margin-top: 0;
}
.footer ul.mod-menu {
    flex-direction: unset;
}
.footer ul.mod-menu li {
    display: inline;
    padding-right: 30px;
    border-top: 0;
}
.footer .grid-child {
    padding: 1rem 2rem;
}


/* ==========================================================================
   12. RESPONSIVE RULES (MEDIA QUERIES)
   ========================================================================== */
@media (max-width: 1400px) {
    .img-comprensorio {
        margin-left: 320px;
    }
    .metismenu.mod-menu .metismenu-item {
        padding: .3em!important;
    }
    #mod-finder-searchword114 {
        width: 135px;
    }
}

@media (max-width: 1167px) {
    .metismenu.mod-menu .metismenu-item {
        padding: 0em!important;
    }
}

@media (max-width: 1120px) {
    .img-comprensorio {
        margin-left: 230px;
    }
}

@media (min-width: 992px) {
    ul.mod-menu_dropdown-metismenu {
        display: flex;
        flex-wrap: wrap;
        list-style: none;
        padding: 0;
        margin: 0;
        gap: 20px;
    }

    ul.mod-menu_dropdown-metismenu .metismenu-item.parent {
        position: relative;
    }

    ul.mod-menu_dropdown-metismenu .metismenu-item.parent:hover > ul.mm-collapse {
        display: block !important;
        height: auto !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: absolute;
        top: 100%;
        left: 0;
        z-index: 1000;
        min-width: 180px;
        padding: 10px 0;
        margin: 0;
        background-color: #fff;
        border: 1px solid rgba(0,0,0,.15);
        border-radius: 4px;
        box-shadow: 0 4px 10px rgba(0,0,0,.15);
        list-style: none;
    }

    ul.mod-menu_dropdown-metismenu ul.mm-collapse .metismenu-item a {
        display: block;
        width: 100%;
        padding: 6px 20px;
        color: #5b4126 !important;
        text-decoration: none;
        white-space: nowrap;
        font-size: 0.9rem;
    }

    ul.mod-menu_dropdown-metismenu ul.mm-collapse .metismenu-item a:hover {
        color: #000 !important;
    }

    ul.mod-menu_dropdown-metismenu .mm-toggler {
        display: none !important;
    }

    #cassiopeiaOffcanvas,
    #menuOffcanvasBR {
        transform: none !important;
        visibility: visible !important;
        display: flex !important;
    }

    /* Cassiopeia + Docman Sidebar Layout */
    body.has-sidebar-right .container-component main {
        display: flex !important;
        flex-direction: row !important;
        align-items: flex-start !important;
        justify-content: space-between !important;
        width: 100% !important;
        gap: 40px !important;
    }

    body.has-sidebar-right .container-component main > .k-ui-joomla {
        flex: 1 1 auto !important;
        min-width: 0 !important;
    }

    body.has-sidebar-right .container-sidebar-right {
        flex: 0 0 300px !important;
        width: 300px !important;
        margin: 0 !important;
        position: static !important;
    }
}

@media (max-width: 991px) {
    ul.category.list-unstyled {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .img-comprensorio {
        margin-left: 20px;
    }

    ul.mod-menu_dropdown-metismenu {
        display: block !important;
        list-style: none;
        padding: 0;
        margin: 0;
    }

    ul.mod-menu_dropdown-metismenu .metismenu-item a {
        display: block;
        padding: 12px 15px;
        color: #212529 !important;
        text-decoration: none;
        font-weight: 600;
        border-bottom: 1px solid #f0f0f0;
    }

    ul.mod-menu_dropdown-metismenu .mm-toggler {
        display: inline-block !important;
        float: right;
        margin-top: -35px;
        margin-right: 10px;
        border: none;
        background: transparent;
    }

    #menuOffcanvasBR .navbar-toggler,
    #menuOffcanvasBR .mm-toggler {
        display: none !important;
    }

    #menuOffcanvasBR .collapse,
    #menuOffcanvasBR .mm-collapse {
        display: block !important;
        height: auto !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    ul.mod-menu_dropdown-metismenu ul.mm-collapse {
        padding-left: 20px;
        background-color: #f8f9fa;
    }

    ul.mod-menu_dropdown-metismenu ul.mm-collapse .metismenu-item a {
        padding: 10px 15px;
        font-weight: normal;
        font-size: 0.95rem;
        color: #495057 !important;
    }

    .container-bottom-c .bottom-c.no-card {
        flex: 0 0 100%;
        max-width: 100%;
        margin-bottom: 2rem;
    }

    /* Cassiopeia + Docman Sidebar Layout Mobile */
    body.has-sidebar-right .container-component main {
        display: flex !important;
        flex-direction: column !important;
    }

    body.has-sidebar-right .container-sidebar-right {
        width: 100% !important;
        margin-top: 30px !important;
    }
    .grid-child.container-top-c .top-c.no-card .altro-link1 a,
    .grid-child.container-top-c .top-c.no-card .altro-link2 a{
        width: 90%;
    }
    .container-bottom-c .bottom-c.no-card:nth-child(1),
    .container-bottom-c .bottom-c.no-card:nth-child(2),
    .container-bottom-c .bottom-c.no-card:nth-child(3) {
        flex: 0 0 calc(33.33% - 1rem);
        max-width: calc(33.3% - 1rem);
    }
    .container-bottom-c .numero-verde img {
        max-width: 100%!important;
    }
}

@media (max-width: 740px) {
    .container-bottom-c .bottom-c.no-card:nth-child(1),
    .container-bottom-c .bottom-c.no-card:nth-child(2),
    .container-bottom-c .bottom-c.no-card:nth-child(3) {
        flex: 0 0 calc(100% - 1rem);
        max-width: calc(100% - 1rem);
        text-align: center;
    }
    .container-bottom-c .numero-verde img {
        max-width: 330px!important;
    }
    body.governance .governance-wrap .gov-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
    .contatti-download {
        width: 100%;
        float: none;
    }
}

@media (max-width: 576px) {
    ul.category.list-unstyled {
        grid-template-columns: 1fr;
    }
    .grid-child.container-top-c {
        flex-direction: column;
    }
    .grid-child.container-top-c .top-c.no-card {
        background-color: #bca88e !important;
        width: 100%;
    }
    .grid-child.container-top-c .top-c.no-card .altro-link1 a, .grid-child.container-top-c .top-c.no-card .altro-link2 a {
        width: 98%;
        color: #5d4129;
        border: 2px solid #5d4129;

    }
    .grid-child.container-top-c {
        padding-bottom: 0px;
    }
    body.governance .governance-wrap .gov-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 500px) {
    .img-comprensorio {
        float: none !important;
    }
    .container-bottom-b > * {
        flex-direction: column;
    }
    body.governance .governance-wrap .gov-grid {
        grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
    }
}


/* ==========================================================================
   13. OFFCANVAS & MOBILE NAVIGATION LAYOUT FIX
   ========================================================================== */
@media (max-width: 991px) {
    /* 1. Reset di base delle liste e posizionamenti */
    .offcanvas-body .mod-menu,
    .offcanvas-body .mod-menu ul {
        list-style: none !important;
        margin: 0 !important;
        padding: 0 !important;
        position: static !important;
        float: none !important;
        width: 100% !important;
        box-shadow: none !important;
    }

    /* 2. Struttura a righe fluide per le voci del menu */
    .offcanvas-body .mod-menu li {
        position: relative !important;
        display: block !important;
        float: none !important;
        width: 100% !important;
        clear: both !important;
    }

    /* Gestione layout della riga contenente Link + Toggler */
    .offcanvas-body .mod-menu li.parent {
        display: flex !important;
        flex-wrap: wrap !important;
        align-items: center !important;
    }

    /* 3. Stile dei link e occupazione dello spazio */
    .offcanvas-body .mod-menu a {
        display: block !important;
        padding: 0.75rem 1rem;
        color: #333;
        text-decoration: none;
        font-size: 0.95rem;
        border-bottom: 1px solid rgba(0, 0, 0, 0.06);
        box-sizing: border-box;
    }

    .offcanvas-body .mod-menu li.parent > a {
        flex: 1 1 auto !important;
        width: auto !important;
    }

    /* 4. Il pulsante freccia (Toggler) affiancato al link */
    .offcanvas-body .mod-menu .mm-toggler {
        flex: 0 0 auto !important;
        background: transparent !important;
        border: none !important;
        padding: 0.75rem 1.25rem !important;
        cursor: pointer;
        color: #666;
        display: flex !important;
        align-items: center;
        justify-content: center;
    }

    /* 5. Indentazione e sottolivelli */
    .offcanvas-body .mod-menu ul.mm-collapse {
        flex: 0 0 100% !important;
        width: 100% !important;
        background-color: rgba(0, 0, 0, 0.03);
    }

    .offcanvas-body .mod-menu li.level-2 > a {
        padding-left: 2.25rem !important;
        font-size: 0.9rem;
    }

    .offcanvas-body .mod-menu li.level-3 > a {
        padding-left: 3.5rem !important;
        font-size: 0.85rem;
    }

    /* 6. Animazione/Rotazione della freccia */
    .offcanvas-body .mod-menu .mm-toggler::after {
        content: '▼';
        font-size: 0.7rem;
        transition: transform 0.2s ease;
        display: inline-block;
    }

    .offcanvas-body .mod-menu .mm-toggler[aria-expanded="true"]::after,
    .offcanvas-body .mod-menu .mm-toggler:not(.mm-collapsed)::after {
        transform: rotate(180deg);
    }
}