body {
    background-color: #d9d2c3; /* Beige */
   
}
html {
    scroll-behavior: smooth;
}
.elementor {
  background: #f6f4ef ; 
}

/* Contenitore del video e del testo */
.video-text-container {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 40px;
    padding: 50px 150px;
}

/* Colonna Video */
.video-container {
    flex: 1;
    max-width: 1000px; /* Video più grande */
}

.video-container iframe {
    width: 100%;
    height: calc(800px * 9 / 16); /* Mantiene il rapporto 16:9 */
    border-radius: 10px;
   
}

/* Colonna Testo */
.text-container {
    flex: 1;
    max-width: 400px;
    text-align: left;
}

.text-container h2 {
    font-size: 2rem;
    color: #222;
    margin-bottom: 15px;
}

.text-container p {
    font-size: 1.2rem;
    color: #555;
    margin-bottom: 10px;
    line-height: 1.6;
}



/* Responsive: Mobile */
/* Responsive: Mobile */
@media screen and (max-width: 767px) {
    .video-text-container {
        flex-direction: column;
        padding: 30px 20px; /* Ridotto il padding per adattarsi a schermi più piccoli */
        gap: 20px;
    }

    .video-container {
        max-width: 100%;
    }

    .video-container iframe {
        height: calc(300px * 9 / 16); /* Altezza video adattata per schermi piccoli */
    }

    .text-container {
        max-width: 100%;
        text-align: center;
        padding: 5px 10px; /* Spazio per un migliore allineamento */
    }

    .text-container h1 {
        font-size: 1.8rem; /* Ridotto rispetto a prima */
        margin-bottom: 10px;
        text-align: left;
    }

    .text-container p {
        font-size: 1rem; /* Testo più piccolo */
        margin-bottom: 6px;
        line-height: 1.4;
        text-align: left;
    }
}



/* il sistema con tubo retrattile */
/* Stile Generale */
.content-section1 {
    background-color: white;
    padding: 50px 230px;
    border-radius: 10px;
    max-width: 2400px;
    margin: 40px auto;
}

/* Contenitore con Flexbox */
.container1 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
}

/* Colonna Testo */
.text-content1 {
    flex: 1;
    text-align: left;
}

/* Stile per i titoli h1 */

.text-content1 h1 {
    font-size: 2.3rem;
    color: #222;
    text-transform: uppercase;
    margin: 20px 0;
}
.text-content1 h2 {
    font-size: 1.8rem;
    color: #000;
    margin-bottom: 20px;
    margin-top: 10px;
}
.text-content1 p {
    font-size: 1.1rem;
    margin-bottom: 6px;
   
}



/* Pulsanti */
.button-group1 {
    display: flex;
    gap: 15px;
    margin-top: 20px;
}

.btn1 {
    padding: 12px 20px;
    background-color: #00aaad;
    color: white;
    text-decoration: none;
    border-radius: 5px;
    font-weight: bold;
    transition: background 0.3s;
}

.btn1:hover {
background-color: #00aaad;
    color: #000;
}
.btn2 {
    padding: 12px 20px;
    background-color: #000;
    color: white;
    text-decoration: none;
    border-radius: 5px;
    font-weight: bold;
    transition: background 0.3s;
}

.btn2:hover {
    background-color: #666;
    color: #000;
}


/* Colonna Immagini */
.image-container1 {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* Immagine Principale */
.image-container1 img {
    width: 100%;
    max-width: 900px;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    margin-bottom: 15px;
}



/* Responsive */
@media screen and (max-width: 767px) {
    /* Stile Generale */
    .content-section1 {
        padding: 30px 20px; /* Ridotto il padding */
        margin: 0 !important;
    }

    /* Contenitore con layout a colonna */
    .container1 {
        flex-direction: column;
        gap: 20px;
        text-align: center; /* Centrato per migliorare la leggibilità */
        padding: 5px 10px;
    }

    /* Colonna Testo */
    .text-content1 {
        text-align: left;
    }

    .text-content1 h1 {
        font-size: 1.8rem; /* Ridotto */
        margin: 15px 0;
    }

    .text-content1 h2 {
        font-size: 1.2rem; /* Ridotto */
        margin-bottom: 15px;
        margin-top: 8px;
    }

    .text-content1 p {
        font-size: 1rem; /* Testo più piccolo */
        margin-bottom: 5px;
        line-height: 1.2;
    }

    /* Pulsanti */
    .button-group1 {
        flex-direction: column;
        align-items: center;
    }

    .btn1, .btn2 {
        width: 100%; /* Pulsanti larghi per una migliore usabilità */
        text-align: center;
    }

    /* Colonna Immagini */
    .image-container1 {
        width: 100%;
    }

    .image-container1 img {
        max-width: 100%;
        margin-bottom: 10px;
    }
}



/*pensato */

/* Sezione principale */
.content-section2 {
    background-color: #ded9eb;
    padding: 50px 230px;
    border-radius: 10px;
    max-width: 2400px;
    text-align: center;
    flex-direction: column;
    align-items: center;
}

/* Testo centrato sopra */
.text-content2 {
    max-width: 2400px;
    margin: 0 auto 30px auto;
    text-align: center;
}

.text-content2 h1 {
    color: #5b5270;
    margin-bottom: 30px;
    font-size: 2.3rem;
    text-transform: uppercase;
}
.text-content2 p {
    font-size: 1.1rem;
    margin: 10px ;
}

/* Contenitore flessibile per carosello + immagini piccole */
.carousel-container2 {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 40px;
    max-width: 1200px;
}

/* Carosello a sinistra */
.carousel {
    width: 100%;
    max-width: 600px;
    overflow: hidden;
    border-radius: 10px;
    text-align: center;
}

.carousel img {
    width: 100%;
    height: auto;
    transition: opacity 0.8s ease-in-out;
}

/* Galleria di immagini fisse a destra */
.image-gallery2 {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 20px;
    background: #f7f7f7; /* Sottofondo grigio chiaro */
    padding: 20px;
    border-radius: 10px;
    max-width: 220px;
}

.gallery-item2 {
    text-align: center;
}

.gallery-item2 img {
    width: 100px;
    height: auto;
    border-radius: 5px;
    transition: transform 0.3s ease-in-out;
}

.gallery-item2 p {
    font-size: 16px;
    margin-top: 8px;
}

.gallery-item2 img:hover {
    transform: scale(1.3);
}

/* Responsive */
/* Responsive */
@media screen and (max-width: 767px) {
    /* Sezione principale */
    .content-section2 {
        padding: 30px 20px; /* Ridotto il padding per adattarsi a schermi più piccoli */
        text-align: center;
    }

    /* Testo centrato sopra */
    .text-content2 {
        text-align: left; /* Centrato per una migliore leggibilità su mobile */
        margin-bottom: 20px;
    }

    .text-content2 h1 {
        font-size: 1.8rem; /* Ridotto */
        margin-bottom: 20px;
    }

    .text-content2 p {
        font-size: 1rem; /* Testo più piccolo */
        margin: 8px;
    }

    /* Contenitore flessibile in colonna */
    .carousel-container2 {
        flex-direction: column;
        gap: 20px;
        align-items: center;
    }

    /* Carosello */
    .carousel {
        max-width: 100%; /* Adatta alla larghezza dello schermo */
    }

    .carousel img {
        width: 100%;
        height: auto;
    }

    /* Galleria di immagini fisse */
    .image-gallery2 {
        flex-direction: row; /* Disposizione in riga per un look più compatto */
        gap: 10px;
        max-width: 100%;
        padding: 10px;
    }

    .gallery-item2 {
        text-align: center;
        flex: 1; /* Distribuisce equamente lo spazio */
    }

    .gallery-item2 img {
        width: 80px; /* Ridotto per evitare eccessivo ingombro */
        height: auto;
    }

    .gallery-item2 p {
        font-size: 14px; /* Adattato per mobile */
        margin-top: 5px;
    }
}







/*tubo*/
/* Stile Generale */
.content-section3 {
    background-color: white;
    padding: 50px 230px;
    border-radius: 10px;
    max-width: 2400px;
    border-bottom: 2px solid #ddd; /* Grigio chiaro per una separazione discreta */
  
}

/* Contenitore con Flexbox */
.container3 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
}

/* Colonna Testo */
.text-content3 {
    flex: 1;
    text-align: left;
}
.text-content3 h2 {
    font-size: 1.8rem;
    color: #000;
    margin-bottom: 30px;
}
.text-content3 p {
    font-size: 1.1rem;
    margin-bottom: 10px;
    margin-top: 20px;
}


/* Colonna Video */
.video-container3 {
    flex: 1;
    display: flex;
    justify-content: space-around;
}

.responsive-video3 {
    width: 100%;
    max-width: 800px;
    border-radius: 10px;
}
.btn3 {
    display: inline-block;
    padding: 12px 20px;
    background-color: #000;
    color: white;
    text-decoration: none;
    border-radius: 5px;
    font-weight: bold;
    transition: background 0.3s ease-in-out;
}

.btn3:hover {
    background-color: #666;
}

/* Responsive */
@media screen and (max-width: 767px) {
    /* Stile Generale */
    .content-section3 {
        padding: 30px 20px; /* Ridotto il padding */
    }

    /* Contenitore con layout a colonna */
    .container3 {
        flex-direction: column;
        gap: 20px;
        text-align: left; /* Centrato per migliorare la leggibilità */
    }

    /* Colonna Testo */
    .text-content3 {
        text-align: left;
    }

    .text-content3 h1 {
        font-size: 1.8rem; /* Ridotto */
        margin-bottom: 20px;
        text-align: center;
    }

    .text-content3 p {
        font-size: 1rem; /* Testo più piccolo */
        margin-bottom: 8px;
        margin-top: 15px;
        padding: 15px;
    }

    /* Pulsante */
    .btn3 {
        width: 100%; /* Pulsante largo per migliorare usabilità su mobile */
        text-align: center;
    }

    /* Colonna Video */
    .video-container3 {
        width: 100%;
        justify-content: center;
        padding: 15px;
    }

    .responsive-video3 {
        max-width: 100%;
    }
}




/* contropresa*/ 

/* Contenitore Principale */
.main-container .content-section4,
.main-container .content-section5 {
    max-width: 77%;
    margin: 40px auto;
}


/* Sezioni di Contenuto */
.content-section4 {
    background-color: white;
    border-radius: 10px;
    margin: 40px auto;
    max-width: 1200px;
    text-align: center;
    border-bottom: 2px solid #ddd; /* Grigio chiaro per una separazione discreta */
}

/* Layout Flexbox */
.container4 {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}

.text-content4 h1 {
    font-size: 2.3rem;
    color: #000;
    text-transform: uppercase;
    margin: 20px 0;
}
.text-content4 h2 {
    font-size: 1.8rem;
    color: #333;
}
.text-content4 p {
    font-size: 1.1rem;
    margin-bottom: 10px;
}


/* Bottone */
.button-container4 {
    text-align: center;
    margin-bottom: 50px;
}

.btn4 {
    display: inline-block;
    padding: 12px 20px;
    background-color: #000;
    color: white;
    text-decoration: none;
    border-radius: 5px;
    font-weight: bold;
    transition: background 0.3s ease-in-out;
    margin-top: 20px;
}

.btn4:hover {
    background-color: #666;
}

/* Layout principale a 3 colonne con larghezze più ampie e altezze uniformi */
.container4:nth-of-type(2) {
    display: flex;
    flex-direction: row;
    align-items: stretch; /* Uniforma l'altezza */
    justify-content: space-around;
    flex-wrap: wrap;
    width: 100%;
}

/* Video nella prima colonna - più grande */
.video-container4 {
    width: 70%;
    max-width: 700px;
    text-align: center;
    display: flex;
    align-items: center;
}

.responsive-video4 {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    border-radius: 10px;
}

/* Colonna centrale con titolo e due immagini - più grande */
.image-section4 {
    width: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.image-section4 .text-content4 {
    text-align: center;
    margin-bottom: 20px;
}

.image-grid4 {
    display: flex;
    flex-direction: row;
    gap: 20px;
    justify-content: center;
    align-items: center;
}

.image-grid4 img {
    width: 100%;
    max-width: 190px;
    border-radius: 10px;
    transition: transform 0.3s ease-in-out;
}

.image-grid4 img:hover {
    transform: scale(1.1);
}

/* Colonna destra con immagine centrale - più grande */
.image-right4 {
    width: 15%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.image-right4 img {
    max-width: 400px;
    border-radius: 10px;
}

/* Assicura che tutte le colonne abbiano la stessa altezza */
.video-container4, .image-section4, .image-right4 {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}


/* Responsive Design per dispositivi mobili */
@media (max-width: 768px) {
    /* Impila gli elementi verticalmente */
    .container4:nth-of-type(2) {
        flex-direction: column;
        align-items: center;
        gap: 20px;
    }
    /* Contenitore Principale */
.main-container .content-section4,
.main-container .content-section5 {
    max-width: 100%; /* Adattato per il mobile */
    margin: 20px 15px;
    padding: 20px;
}

    .text-content4 h1 {
        font-size: 1.8rem; /* Ridotto */
        margin: 15px 0;
        text-align: left;
    }

    .text-content4 h2 {
        font-size: 1.4rem; /* Ridotto */
        text-align: left;
    }

    .text-content4 p {
        font-size: 1rem; /* Ridotto */
        margin-bottom: 8px;
        text-align: left;
    }

    /* Video sopra, occupa tutta la larghezza */
    .video-container4 {
        width: 100%;
        max-width: 100%;
        text-align: center;
    }

    .responsive-video4 {
        width: 100%;
        aspect-ratio: 16 / 9;
    }

    /* Griglia immagini 2x2 */
    .image-grid4 {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 10px;
        width: 100%;
        max-width: 500px; /* Regola in base alle necessità */
    }

    .image-grid4 img {
        width: 100%;
        max-width: 100%;
    }

    /* Sezione centrale con titolo e immagini */
    .image-section4 {
        width: 100%;
        text-align: center;
        margin-bottom: 20px;
    }

    /* Colonna destra allineata al centro */
    .image-right4 {
        width: 100%;
        text-align: center;
    }

    .image-right4 img {
        max-width: 100%;
        width: 80%; /* Regolabile per migliorare la resa */
    }
}






/* Contenitore principale */
.content-section5 {
    background: #f7f7f7;
    padding: 50px 20px;
    border-radius: 10px;
    max-width: 2400px;
    margin: 40px auto;
    border-bottom: 2px solid #ddd; /* Grigio chiaro per una separazione discreta */
}

/* Header con Titolo e Bottone */
.header-content5 {
    text-align: center;
    margin-bottom: 20px;
   
}

.header-content5 h2 {
    font-size: 2rem;
    color: #000;
}

.button-container5 {
    text-align: center;
}

.btn5 {
    display: inline-block;
    padding: 12px 20px;
    background-color: #f1ece0; /* Colore Platino */
    color: #333; /* Testo scuro per contrasto */
    text-decoration: none;
    border-radius: 5px;
    font-weight: bold;
    transition: background 0.3s ease-in-out;
    margin-top: 10px;
    margin-bottom: 10px;
}

.btn5:hover {
    background-color: #f1ece0;
}

/* Layout delle Immagini */
.image-layout5 {
    display: flex;
    gap: 50px;
    align-items: flex-start;
}

/* Immagine principale più grande */
.main-image5 {
    flex: 2;
    max-width: 45%;
    text-align: right;
    gap: 20px;
}

.main-image5 img {
    max-height: 500px;
    border-radius: 10px;
}

/* Griglia 2x2 per le altre immagini */
.image-grid5 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 25px;
    max-width: 50%;
    
}

/* Stile delle immagini nella griglia */
.grid-item5  {
    text-align: center;
}


.grid-item5 img {
    width: 100%;
    max-width: 250px;
    height: auto;
    border-radius: 10px;
    transition: transform 0.3s ease-in-out;
}

.grid-item5 img:hover {
    transform: scale(1.1);
}

/* Stile del testo sotto le ultime immagini */
.grid-item5 h2 {
    font-size: 1.4rem;
    font-weight: bold;
    margin-top: 10px;
}

.grid-item5 h3 {
    font-size: 1.2rem;
    color: #666;
}

/* Responsive */
@media screen and (max-width: 767px) {
    /* Contenitore Principale */
    .main-container .content-section5 {
        max-width: 100%; /* Utilizza tutta la larghezza disponibile */
        padding: 30px 35px; /* Ridotto il padding */
        margin: 0 !important;
    }

    /* Layout Flexbox */
    .container5 {
        flex-direction: column; /* Mantiene la struttura verticale */
        align-items: center;
        gap: 15px;
    }

    /* Testo */
    .text-content5 {
        max-width: 100%; /* Testo più fluido */
        text-align: center;
    }


    .content-section5 {
        padding: 30px 15px; /* Ridotto il padding */
    }

    /* Header con Titolo e Bottone */
    .header-content5 {
        text-align: left;
    }

    .header-content5 h2 {

        font-size: 1.4rem; /* Ridotto */
        text-align: center;
        
    }

    .button-container5 {
        text-align: center;
    }

    .btn5 {
        width: 100%; /* Pulsante più largo per una migliore usabilità */
        text-align: center;
    }

    .image-layout5 {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    /* Immagine principale sopra */
    .main-image5 {
        max-width: 100%;
        text-align: center;
        margin-bottom: 20px;
    }

    .main-image5 img {
        width: 100%;
    max-height: 300px; /* Imposta un'altezza massima più bassa */
    object-fit: contain; /* Mantiene il riempimento senza deformare */
    }

    /* Griglia 2x2 sotto */
    .image-grid5 {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
        width: 100%;
        max-width: 400px; /* Regola in base alle necessità */
    }

    .grid-item5 img {
        width: 100%;
        max-width: 100%;
    }
}




/* accendi e spegni */ 
/* Contenitore principale */
.content-section6 {
    background-color: white;
    padding: 50px 230px;
    border-radius: 10px;
    max-width: 2400px;
    margin: 40px auto;
}

/* Layout con Flexbox */
.container6 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    text-align: left;
    gap: 40px;
}

/* Testo */
.text-content6 {
    flex: 1;
    text-align: left;
}

.text-content6 h1 {
    font-size: 2.3rem;
    color: #000;
    text-transform: uppercase;
    margin: 20px 0;
}
.text-content6 h2 {
    font-size: 1.8rem;
    color: #333;
    margin-bottom: 30px;
}

.text-content6 p {
    font-size: 1.1rem;
    margin-bottom: 10px;
    margin-top: 20px;
}


/* Bottone */
.button-container6 {
    margin-top: 10px;
}

.btn6 {
    display: inline-block;
    padding: 12px 20px;
    background-color: #000;
    color: white;
    text-decoration: none;
    border-radius: 5px;
    font-weight: bold;
    transition: background 0.3s ease-in-out;
    margin-top: 20px;
}

.btn6:hover {
    background-color: #666;
}

/* Immagine */
.image-container6 {
    flex: 1;
    text-align: center;
}

.image-container6 img {
    width: 100%;
    max-width: 900px;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    margin-bottom: 15px;
}

/* Responsive */
@media screen and (max-width: 767px) {
    /* Contenitore principale */
    .content-section6 {
        padding: 00px 30px; /* Ridotto per una migliore adattabilità */
        margin: 0 !important;
    }

    /* Layout in colonna */
    .container6 {
        margin-bottom: 30px;
        flex-direction: column; /* Disposizione verticale */
        text-align: center; /* Testo centrato per una migliore leggibilità */
        gap: 15px;
    }

    /* Testo */
    .text-content6 {
        text-align: left;
    }

    .text-content6 h1 {
        font-size: 1.8rem; /* Ridotto */
        margin: 15px 0;
    }

    .text-content6 h2 {
        font-size: 1.4rem; /* Ridotto */
        margin-bottom: 20px;
    }

    .text-content6 p {
        font-size: 1rem; /* Ridotto */
        margin-bottom: 8px;
        margin-top: 15px;
    }

    /* Bottone */
    .button-container6 {
        text-align: left;
    }

    .btn6 {
        width: 100%; /* Pulsante a larghezza piena per una migliore usabilità */
        text-align: center;
    }

    /* Immagine */
    .image-container6 {
        max-width: 100%;
    }

    .image-container6 img {
        max-width: 100%;
        margin-bottom: 10px;
    }
}



/* Contenitore dell'immagine */
.image-container-full {
    width: 89%; /* Larghezza allineata agli altri contenitori */
    max-width: 100%;
    margin: 0 auto;
    text-align: center;
    margin-bottom: 10px;
    margin-top: 0px;
    overflow: hidden;
    position: relative;
    height: 1000px; /* Mantiene l'altezza desiderata */
    margin-bottom: 40px;
}

/* Immagine responsive */
.responsive-image {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Riempi il contenitore tagliando l'immagine */
    object-position: 120% 60%; /* Sposta il focus in basso per tagliare dall'alto */
    display: block;
    border-radius: 10px; /* Se vuoi un tocco di stile */
    position: absolute;
    top: 0;
    left: 0;
}

/* Responsive per mobile */
@media screen and (max-width: 767px) {
    .image-container-full {
        height: 420px; /* Riduce l'altezza per dispositivi mobili */
    }
}



/* Responsive per iPad (orizzontale/verticale) */
@media screen and (min-width: 768px) and (max-width: 1280px) {
    /* Sezioni generali */
    .content-section1,
    .content-section2,
    .content-section3,
    .content-section4,
    .content-section5,
    .content-section6 {
        padding: 40px 80px; /* più contenuto rispetto al mobile ma meno rispetto al desktop */
    }

    /* Video + Testo */
    .video-text-container {
        flex-direction: column;
        gap: 30px;
        padding: 40px 60px;
    }

    .video-container iframe {
        height: calc(500px * 9 / 16); /* compromesso per tablet */
    }

    .text-container {
        max-width: 600px;
        text-align: center;
    }

    .text-container h2 {
        font-size: 1.8rem;
    }

    .text-container p {
        font-size: 1.1rem;
    }

    /* Immagini nelle varie sezioni */
    .image-container1 img,
    .image-container6 img,
    .main-image5 img {
        max-width: 100%;
        max-height: 400px;
        object-fit: contain;
    }

    /* Carosello + galleria */
    .carousel-container2 {
        flex-direction: row;
        gap: 30px;
    }

    .image-gallery2 {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 15px;
    }

    /* Pulsanti sempre centrati */
    .button-group1,
    .button-container4,
    .button-container6 {
        justify-content: center;
    }

      /* Layout in colonna */
    .container6 {
        flex-direction: column-reverse; /* Disposizione verticale */
        text-align: center; /* Testo centrato per una migliore leggibilità */
        gap: 15px;
    }

}


/* ---------------------------------------
   Breakpoint iPad / Tablet (769–1280px)
   Adattamenti specifici per ogni sezione
----------------------------------------*/
@media screen and (min-width: 768px) and (max-width: 1280px) {

  /* Base layout */
  body { background-color: #d9d2c3; }
  .elementor { background: #f6f4ef; }

  /* Spaziature contenitori principali */
  .content-section1,
  .content-section2,
  .content-section3,
  .content-section4,
  .content-section5,
  .content-section6 {
    padding: 40px 120px; /* più contenuto del mobile, meno del desktop */
    border-radius: 10px;
  }

  /* ===========================
     HERO video + testo iniziale
     =========================== */
  .video-text-container {
    flex-direction: row;           /* rimane a due colonne */
    align-items: center;
    justify-content: center;
    gap: 30px;
    padding: 40px 80px;
  }
  .video-container { max-width: 900px; }
  .video-container iframe {
    width: 100%;
    height: calc(600px * 9 / 16);  /* equilibrio su tablet */
    border-radius: 10px;
  }
  .text-container {
    max-width: 520px;
    text-align: left;
  }
  .text-container h2 { font-size: 1.9rem; }
  .text-container p  { font-size: 1.1rem; line-height: 1.55; }

  /* ===========================
     SECTION 1 – Sistema tubo retrattile
     =========================== */
  .content-section1 { max-width: 2000px; }
  .container1 {
    gap: 30px;
  }
  .text-content1 h1 { font-size: 2rem; margin: 16px 0; }
  .text-content1 h2 { font-size: 1.5rem; margin-top: 10px; margin-bottom: 16px; }
  .text-content1 p  { font-size: 1.05rem; }
  .button-group1 { gap: 12px; }
  .image-container1 img { max-width: 700px; }

  /* ===========================
     SECTION 2 – Carosello + gallery
     =========================== */
  .content-section2 { text-align: center; }
  .text-content2 h1 { font-size: 2rem; margin-bottom: 24px; }
  .text-content2 p  { font-size: 1.05rem; }
  .carousel-container2 {
    display: flex;
    flex-direction: row;   /* affiancati su tablet */
    gap: 30px;
    max-width: 1100px;
    margin: 0 auto;
  }
  .carousel { max-width: 520px; }
  .image-gallery2 {
    max-width: 260px;
    padding: 16px;
    gap: 16px;
  }
  .gallery-item2 img { width: 110px; }
  .gallery-item2 p   { font-size: 15px; }

  /* ===========================
     SECTION 3 – Tubo (video + testo)
     =========================== */
  .content-section3 { max-width: 2000px; }
  .container3 { gap: 30px; }
  .text-content3 h2 { font-size: 1.6rem; margin-bottom: 24px; }
  .text-content3 p  { font-size: 1.05rem; margin-top: 16px; }
  .video-container3 { justify-content: center; }
  .responsive-video3 { max-width: 680px; }

  /* ===========================
     SECTION 4 – Contropresa (3 colonne)
     =========================== */
  .main-container .content-section4 { max-width: 1000px; }
  .container4:nth-of-type(2) {
    flex-direction: row;
    align-items: stretch;
    gap: 20px;
  }
  /* Colonne proporzionate su tablet */
  .video-container4 { width: 60%; max-width: none; }
  .image-section4   { width: 50%; }
  .image-right4     { width: 20%; }

  .responsive-video4 { width: 100%; aspect-ratio: 16 / 9; }
  .text-content4 h1 { font-size: 2rem; margin: 18px 0; }
  .text-content4 h2 { font-size: 1.5rem; }
  .text-content4 p  { font-size: 1.05rem; }

  .image-grid4 { gap: 16px; width: 500px;  }
  .image-grid4 img { max-width: 160px; }
  .image-right4 img { max-width: 260px; }

  /* ===========================
     SECTION 5 – Griglia 2x2 + immagine grande
     =========================== */
  .content-section5 { padding: 40px 80px; }
  .header-content5 h2 { font-size: 1.8rem; }
  .image-layout5 { gap: 30px; align-items: flex-start; }
  .main-image5 { flex: 2; max-width: 50%; text-align: right; }
  .main-image5 img { max-height: 380px; object-fit: contain; }
  .image-grid5 { max-width: 50%; gap: 20px; }
  .grid-item5 img { max-width: 200px; }
  .grid-item5 h2 { font-size: 1.3rem; }
  .grid-item5 h3 { font-size: 1.05rem; }

  /* ===========================
     SECTION 6 – Accendi/Spegni
     =========================== */
  .content-section6 { max-width: 2000px; }
  .container6 { gap: 30px; }
  .text-content6 h1 { font-size: 2rem; margin: 16px 0; }
  .text-content6 h2 { font-size: 1.5rem; margin-bottom: 24px; }
  .text-content6 p  { font-size: 1.05rem; margin-top: 16px; }
  .image-container6 img { max-width: 700px; }

  /* ===========================
     Immagine full-width “hero”
     =========================== */
  .image-container-full {
    width: 77%;
    height: 600px;             /* più bassa del desktop */
    margin: 0 auto 40px;
  }
  .responsive-image {
    object-fit: cover;
    object-position: 45% 60%;
    border-radius: 10px;
  }
}


@media screen and (min-width: 768px) and (max-width: 834px) and (orientation: portrait) {
  .content-section1,
  .content-section2,
  .content-section3,
  .content-section4,
  .content-section5,
  .content-section6 { padding: 32px 64px; }

  .video-text-container { padding: 32px 48px; gap: 24px; }
  .video-container iframe { height: auto; aspect-ratio: 16 / 9; } /* più elastico */
}