@media (min-device-aspect-ratio: 16/11) and (max-device-aspect-ratio: 16/10) { /*MACBOOK*/

}


@media (min-width: 1025px) { /* Desktop */

}

/* Tablette */
@media (min-width: 768px) and (max-width: 1024px) {

    .sustZone {
      padding: 0 10em;
    }

    .sustZone slide .slide-background {
      max-height: 35em;
      width: 70%;
      object-fit: scale-down;
    }

}

/* Mobile */
@media (max-width: 767px) {
    #splash { padding: 1em; }
    #splash div { aspect-ratio: 1/1; border-radius: 2em; background-position: calc(100% + 2.5em) center; }

    #entete { margin: 1em 0; }
    #entete p, .sustZone h2, .sustZone slider .onglets  { padding: 0; }

    .sustZone { padding: 0 1rem; }
    .sustZone h2 { text-align: center; }
    .sustZone slider { margin-left: -1rem; width: 100vw; gap: 1em; }
    .sustZone slider .onglets { left: 0; width: 100%; justify-content: center; padding: 0; }
    .sustZone slidein { margin-top: 2em; }
    .sustZone slide { width: 100vw; aspect-ratio: 1.5/1; height: auto; }
    .sustZone slide in { width: 100%; margin-left: 0; }
    .sustZone slide .slidetext, .sustZone.reverse slide .slidetext { padding: 0 1em; margin-top: 0; border-left: none; }

    /*exception pour le premier slider*/
    .sustZone #slideEnv slidein { padding-bottom: 2em; }
    .sustZone #slideEnv slide { height: 100%; aspect-ratio: initial; }

    .sustZone slide .slide-background {
        height: auto; max-height: 20em; width: 70%;
        object-fit: scale-down;
    }

    .sustZone .figures {
        width: 100%; margin: 0;
        flex-direction: column;
    }
    .sustZone .figures .kg { width: 100%; aspect-ratio: initial; position: relative; justify-content: flex-start; }
    .sustZone .figures .detail {
        white-space: normal;
        width: 50%;
        font-size: 1.5em;
    }
    .sustZone .figures .egal {
        font-size: 10em; line-height: 0.5;
        align-self: baseline;
        height: 0.65em;
    }
    .sustZone .figures .kg1 .detail { width: 5em; }
    .sustZone .figures .kg10 .detail { width: 8em; }

    .sustZone .figures .kg img { position: absolute; z-index: -5; right: 0; bottom: -1em; transform: none;}
    .sustZone .figures .kg1 img { height: 10em; }
    .sustZone .figures .kg10 img { height: 12em; }

    .sustZone .figures .num {
      font-size: 7em;
      letter-spacing: -0.05em;
      line-height: 1;
    }
    .sustZone .figures .num::after {
        top: 20%;
    }

    #entete { font-size: 1.5em; text-align: center; }
    #entete br { display: none; }

    #env slide { aspect-ratio: 1/1.25; }
    
    #env .env_chimie in { background-size: 75% auto; }
    #env .env_sourcing in { background-size: 75% auto; }

    #social .social_apports in { background-position: right calc( 100% - 1em ); background-size: auto 75%; }
    #social .social_dynamisme in { background-size: auto 88%; }
    #social .social_dynamisme .slidetext { padding: 0 8em 1em 1em; }
}