:root {

	--noir: #000000;
    --blanc: #ffffff;
    --rouge:#981F22;
    --rouge-1:#981F22;
    --rouge-2:#A92026;
    --rouge-3:#C93F49;
    --bleu:#6A84D9;
	--gris-1:#222222;
    --gris-2:#909090;
	--gris-3:var(--noir);
    --gris-4:var(--noir);
    


    --box-s-radius: 0 0 0 0px;
	--box-radius: 0 0 0 0px;
	--transition-all: all 0.4s ease;
	
    --font-size-html:14px;

    /* Font Jeantil - import dans le head */
	--font-family-head: 'Red Hat Display', sans-serif;
    --font-family: 'Red Hat Display', sans-serif;


    --fs-s:0.75rem;

    --fs-base:1rem; 
    /*14px p, 
    bouton,   */	
    --fs-14:var(--fs-base);
    --fs-bouton:var(--fs-base);

    --fs-base-prod-home:1.071rem; 
    /*15px 
    produits ou sous gamme slider home, 
    menu ouvert niveau 2*/
    --fs-15:var(-prod-home);

    --fs-base-plus:1.143rem; 
    /*16px 
    texte burger, 
    switch lang, 
    subfooter, 
    suivez nous, 
    contact footer, 
    lancer video home, 
    bouton input contact, 
    bouton téléchargement 
    tableau complet*/
    --fs-16:var(--fs-base-plus);

    --fs-base-m:1.286rem;
    /*18px 
    contenu dispositif produit p, 
    ligne 1 tableau produit*/
    --fs-18:var(--fs-base-m);
    
    --fs-m-moins:1.428rem; 
    /*20px 
    menu entrteprise footer, 
    contenu caractéristiques générales produits */
    --fs-20:var(--fs-m-moins);
    
    --fs-m:1.571rem; 
    /*22px 
    chiffres clés texte, 
    paragraphes du formulaire */
    --fs-22:var(--fs-m);
    
    --fs-l:1.857rem; 
    /*26px 
    H3, 
    h3 teasers, 
    h3 questions accordeon, 
    menus gamme footer ,
     H3 home, 
     liste teaser equipements, 
     bouton objet formulaire(titre)
     */	
    --fs-26:var(--fs-base);
    
    --fs-xl:2rem; 
    /*28px 
    h2, 
    bouton télécharger la brochure, 
    bouton déposez une candidature fin de formualire de contact 
    appelez nous formulaire, 
    téléphone formulaire*/
    --fs-28:var(--fs-xl);
    
    --fs-xl-h1:2.143rem; 
    /*30px 
    h1, 
    menu entreprise header 
     téléphone fin de foirmulaire contact*/
    --fs-30:var(--fs-xl-h1);
    
    --fs-xl-h1-home:2.429rem; 
    /*34px 
    h1 home, 
    H2 home*/
    --fs-34:var(--fs-xl-h1-home);
    
    --fs-xl-cat-home:2.5rem; 
    /*35px 
    categorie parente slider home 
    menu header ouvert niveau 1*/
    --fs-35:var(--fs-xl-cat-home);
    
    --fs-number:2.857rem; 
    /*40px 
    chiffre clé .number, 
    citation  .quote*/	
    --fs-40:var(--fs-number);
   
    --fs-xxl-produit:3.571rem; 
    /*50px 
    noms produits sur liste*/
    --fs-50:var(--fs-xxl-produit);
    
 
    
    
    --normal:400;
    --semi-bold:600;
	--bold:700;
	--black:900;

    --space-v:20px;
	--space-h:20px;

	
	--big-space-h:36px;

    --section-v-pad:12px;
    --big-space-v:46px;
    --section-pad:46px 0;

	--container-marge:0 auto;
    --container-pad:0 25px 0 37px;
    --container-pad-h-total:62px;
    --container-pad:0 25px 0 37px;
	--container-full-pad:var(--container-pad);
	--mega-pad:var(--container-pad);

    /* --container-width:clamp(calc(320px - (2 * var(--section-v-pad))), 100% , 1000px); */
    --container-width:clamp(calc(320px - (2 * var(--section-v-pad))), 100% , 1200px);    
    --ease:all 0.4s ease;
	
	--header-height:75px;
    --open-header-height:67px;
	--scrolled-header-height:75px;
	--admin-bar-height:46px;

    --logo-width:232px;
    --mobile-nav-width:320px; 
    /*alternative 100%*/

    --page-width:1920px; /* de 1600 a 1920 */   

}
@media(max-width:390px) {
    :root {	
		--header-height:19vw;
	    --scrolled-header-height:19vw;	
	}
}

@media(min-width:640px) {
    :root {
        --fs-base:16px;
        --fs-14:var(--fs-base);
        --fs-15:var(--fs-base);
        --fs-16:var(--fs-base);
        --fs-bouton:var(--fs-base);
        --fs-base-plus:var(--fs-base); 
    }
}

@media(min-width:732px) {
	:root {	
		--admin-bar-height:46px;	
	}
}

@media(min-width:640px) and (max-width:979px) {
    :root {	
        --container-width:600px;
    }
}
@media(min-width:980px) {
	:root {	

		--font-size-html:16px;
        
        --fs-base:1rem; 
        /*16px 
        p, 
        .bouton,  
        subfooter, 
        suivez nous, 
        contact footer, 
        lancer video home, 
        bouton input contact, 
        bouton téléchargement tableau complet */	
        --fs-14:var(--fs-base);
        --fs-15:var(--fs-base);
        --fs-16:var(--fs-base);
        --fs-bouton:var(--fs-base);
        --fs-base-plus:var(--fs-base); 
        


        --fs-base-m:1.25rem; 
        /*20px  
        menu produits ou sous gamme slider home
        contenu dispositif produit, 
        paragraphes accordéons produits, 
        menu ouvert niveau 2
        contenu caractéristiques générales produits */
        --fs-m-moins:var(--fs-base-m);
        --fs-base-prod-home:var(--fs-base-m);
        --fs-18:var(--fs-base-m);
        --fs-20:var(--fs-base-m);
        --fs-20:var(--fs-base-m);
        

        --fs-m:1.625rem; 
        /*26px 
        chiffres clés texte, 
        paragraphes du formulaire */
        --fs-26:var(--fs-m);


        --fs-l:1.875rem; 
        --fs-30:var(--fs-l);
        --fs-28:var(--fs-l);
        /*30px 
        H3, 
        ligne 1 tableau produit 
        menu entrteprise footer, 
        téléphone fin de foirmulaire contact, 
        h3 teasers, 
        h3 questions accordeon, 
        menus produits teasers, 
        H3 home, 
        liste teaser equipements, 
        bouton objet formulaire(titre)
        menu entreprise header home
        */	


        --fs-xl:2.5rem;  
        --fs-40:var(--fs-xl);
        /*40px 
        h2, 
        intro page, 
        bouton télécharger la brochure, 
        bouton déposez une candidature fin de formualire de contact, 
        appelez nous formulaire, 
        téléphone formulaire
        menu ouvert niveau 1
        menu gamme footer 
        */
       



        --fs-xxl-produit:3.75rem; 
        --fs-60:var(--fs-xxl-produit);
        --fs-xl-h1-home:var(--fs-xxl-produit);
        --fs-number:var(--fs-xxl-produit);
        /*60px 
        chiffre clé, 
        .number, 
        citation, 
        .quote, 
        noms produits sur liste, 
        h1 home, 
        H2 home*/ 
       



        --fs-xl-h1:5rem; 
        --fs-80:var(--fs-xl-h1);
        /*80px h1*/
    
        --fs-xl-cat-home:6.25rem; 
        /*100px 
        categorie parente slider home, 
        */
        --fs-100:var(--fs-xl-cat-home);
        --big-space-v:86px;
        --big-space-h:86px;

        --section-pad:86px 0;
        --container-pad:0px 20px 0px 46px;
        --container-pad-h-total:66px;
        --container-marge:0 auto;
		--container-full-pad:var(--container-pad);
	    --mega-pad:var(--container-pad);
        --admin-bar-height:46px;

        --logo-width:clamp(100px, 20%, 232px);

        --header-height:138px;


		
        --vary-base-fs:clamp(14px, 1.25vw , var(--fs-base));
	}
}

@media(min-width:1200px) {
	:root {	
        --section-pad:86px 0px;
        /* --container-pad:0px 100px 0px 100px; */
        --container-pad: 0 20px 0 60px;
        /*cesd valeurs ne peuvent pas changer. La zone doit faire 1120 (16 / 10 de 700)*/
        --container-pad-h-total:80px;

        --container-marge:0 auto;
		--container-full-pad:var(--container-pad);
    }
}
@media(min-width:1600px) {
	:root {	


        /* --space-v:36px;
	    --space-h:36px; */

        --big-space-v:86px;
        --big-space-h:100px;

        --section-pad:86px 0px;
        /* --container-pad:0px 100px 0px 100px;
         */
         --container-pad: 0 20px 0 60px;
         --container-pad-h-total:120px;
        --container-marge:0 auto;
		--container-full-pad:var(--container-pad);
        --mega-pad:var(--container-pad);
        --logo-width:380px;

        /* --header-height:201px; */
	    --scrolled-header-height:118px;

	}
}
