.colore1 {
    color: #0E3965;
}

@media (max-width: 767px) {
    #MainContent_divBackground { /* Controlla l'ID generato da ASP.NET */
        aspect-ratio: 16 / 9 !important; /* Lo rendi un po' più alto su mobile */
    }
}

/* Aggiungi questo dentro i tuoi tag <style> */
section.bg-light.border-bottom:first-of-type {
    margin-top: 100px; /* Regola questo valore in base all'altezza del tuo menu */
}

/* Se il menu è molto alto su mobile, puoi fare un tweak */
@media (max-width: 991px) {
    section.bg-light.border-bottom:first-of-type {
        margin-top: 70px;
    }
}

/* Classe per forzare il formato 16/9 sulle immagini dei documenti */
.img-documento-169 {
    width: 100%; /* Occupa tutta la larghezza del box */
    height: 180px; /* Altezza fissa per schermi grandi, si adatterà */
    object-fit: cover; /* Ritaglia l'immagine per riempire lo spazio senza distorcerla */
    object-position: center; /* Centra l'immagine nel ritaglio */
}

/* Media query per dispositivi mobile per adattare l'altezza se necessario */
@media (max-width: 767px) {
    .img-documento-169 {
        height: 250px; /* Altezza maggiore su mobile dove le slide sono singole o doppie */
    }
}

@media (max-width: 575px) {
    .img-documento-169 {
        height: auto; /* Lascia l'altezza automatica per mobile stretti */
        aspect-ratio: 16 / 9; /* Forza il rapporto d'aspetto se il browser lo supporta */
    }
}

header {
    position: relative; /* o fixed se vuoi che rimanga fermo in alto */
    z-index: 9999 !important; /* Valore molto alto per stare sopra la sidebar */
}

nav.navbar {
    z-index: 9999 !important;
    background-color: #fff; /* Assicura che sia coprente */
}

/* Fix per bottoni trasparenti in Hover */
.btn.btn-transparent-white-light:hover {
    color: #535655 !important; /* Il grigio scuro di EDIL C */
}
    /* Forza il colore delle icone in hover se necessario */
    .btn.btn-transparent-white-light:hover i {
        color: #535655 !important;
    }
    /* Eccezione per WhatsApp: manteniamo l'icona verde anche in hover */
    .btn.btn-transparent-white-light:hover .bi-whatsapp {
        color: #25D366 !important;
    }



/* Definiamo il gradiente aziendale */
.bg-gradient-edilc {
    background: linear-gradient(135deg, #535655 0%, #64C726 100%) !important;
    position: relative;
}

/* Forziamo il colore bianco su TUTTI gli elementi interni alla sezione */
.bg-gradient-edilc h1,
.bg-gradient-edilc h1 *,
.bg-gradient-edilc .breadcrumb-item,
.bg-gradient-edilc .breadcrumb-item a,
.bg-gradient-edilc .breadcrumb-item i {
    color: #ffffff !important;
}

/* Gradiente pulito per la parola Futuro */
.gradiente-edilc {
    background: linear-gradient(to right, #64C726, #535655);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    /* Se vuoi un bordo anche qui, l'unico modo è lo stroke, 
           ma spesso sporca il gradiente. Proviamo con uno stroke leggero: */
    -webkit-text-stroke: 0.5px rgba(0,0,0,0.3);
}

.testo-bordato {
    color: white;
    text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
}

.futuro-gradient {
    position: relative;
    display: inline-block;
    background: linear-gradient(to right, #64C726, #535655);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    z-index: 1;
}

    /* Creiamo il bordino usando un pseudo-elemento che sta "sotto" il gradiente */
    .futuro-gradient::before {
        content: attr(data-text);
        position: absolute;
        left: 0;
        top: 0;
        z-index: -1;
        -webkit-text-stroke: 2px black; /* Il bordo nero lo mettiamo qui */
        -webkit-text-fill-color: black;
    }