/* Prima sezione con immagine di copertina */
.first-section-collaborations .background-image-container{
    width: 100%;
    max-height: 80vh; /* Limita l'altezza dell'immagine */
    overflow: hidden; /* Nasconde l'eccesso */
} 

.first-section-collaborations .background-image-container img{
    width: 100%;
    object-fit: contain; /* Adatta l'immagine senza deformarla */
}

/* Seconda sezione con il contenuto principale */
.second-section-collaborations{
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 50px;
    padding: 70px 10%;
}

/* Testo introduttivo della seconda sezione */
.second-section-collaborations .text-collaborations-container-1 h3{
    font-size: 1.92em;
}

.second-section-collaborations .text-collaborations-container-1 p{
    margin: 15px 0; /* Margine sopra e sotto il paragrafo */
}

/* Contenitore principale per i blocchi dei designer */
.second-section-collaborations .text-collaborations-container-2{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 60px;
}

/* Contenitore con testo a sx e immagine a dx */
.second-section-collaborations .text-collaborations-container-2 .text-img-container{
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 5%;
}

.second-section-collaborations .text-collaborations-container-2 .text-img-container .text{
    display: flex;
    flex-direction: column;
    text-align: right;
}

/* Allinea i punti degli elenchi puntati a destra insieme al testo */
.second-section-collaborations .text-collaborations-container-2 .text-img-container .text ul{
    list-style-position: inside;
    padding-right: 0; /* Opzionale: rimuove il padding per un allineamento più pulito */
}

/* Contenitore con immagine a sx e testo a dx */
.second-section-collaborations .text-collaborations-container-2 .img-text-container{
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 5%;
}

/* Stile per la colonna di testo */
.second-section-collaborations .text-collaborations-container-2 .text{
    flex: 2; /* Occupa il doppio dello spazio dell'immagine */
}

/* Stile per la colonna dell'immagine */
.second-section-collaborations .text-collaborations-container-2 .img{
    flex: 1.2; /* Occupa poco più della metà dello spazio del testo */
}

.second-section-collaborations .text-collaborations-container-2 .img img{
    width: 100%;
    aspect-ratio: 16/9; /* Mantiene le proporzioni */
    object-fit: cover; /* Taglia l'immagine per riempire lo spazio */
}

/* Stili per paragrafi e titoli nei blocchi */
.second-section-collaborations .text-collaborations-container-2 .text p, .second-section-collaborations .text100 p{
    margin: 15px 0;
}

.second-section-collaborations .text-collaborations-container-2 .text h3, .second-section-collaborations .text100 h3{
    font-size: 1.92em;
}

/* Contenitore per il testo conclusivo a larghezza piena */
.second-section-collaborations .text100{
    width: 100%;
    margin: 30px 0;
}

/* Stili per le icone di navigazione (frecce) */
ion-icon{
    color: #bab19c;
    font-size: 3em;
    position: relative;
    bottom: 0;
    transition: all 0.2s ease-in-out;
}

/* Effetto al passaggio del mouse sull'icona */
ion-icon:hover{
    bottom: 4px;
}

/* --- Inizio Stili Responsive --- */
/* Stili per tablet */
@media (max-width: 1024px) {
    .second-section-collaborations {
        padding: 50px 5%; /* Riduce la spaziatura laterale */
    }

    /* I blocchi testo/immagine si impilano verticalmente */
    .second-section-collaborations .text-collaborations-container-2 .text-img-container,
    .second-section-collaborations .text-collaborations-container-2 .img-text-container {
        flex-direction: column;
        align-items: center;
    }

    .second-section-collaborations .text-collaborations-container-2 .text-img-container .text{
    text-align: center;
    }

    .second-section-collaborations .text-collaborations-container-2 .text-img-container .text ul{
    list-style-position: outside;
}

    /* Testo e immagine occupano tutta la larghezza */
    .second-section-collaborations .text-collaborations-container-2 .img,
    .second-section-collaborations .text-collaborations-container-2 .text {
        width: 100%;
        max-width: 600px; /* Limita la larghezza per leggibilità */
        text-align: center; 
    }

    .second-section-collaborations .text-collaborations-container-2 .img {
        margin-bottom: 20px; /* Spazio tra immagine e testo */
    }
}

/* Stili per smartphone */
@media (max-width: 768px) {
    .first-section-collaborations .background-image-container {
        max-height: 40vh; /* Riduce l'altezza dell'immagine di copertina */
    }

    /* Rimpicciolisce i titoli */
    .second-section-collaborations .text-collaborations-container-1 h3,
    .second-section-collaborations .text-collaborations-container-2 h3,
    .second-section-collaborations .text100 h3 {
        font-size: 1.5em;
    }
}