/* ==========================================================================
   Surcharges d'accessibilité pour le système 3 paliers de taille de texte
   Palier 1 (défaut) : 62.5% - pas de surcharge nécessaire
   Palier 2 : 80% - ratio ×1.28
   Palier 3 : 100% - ratio ×1.6
   ========================================================================== */

/* ==========================
   PALIER 2 - Taille moyenne
   ========================== */

/* Footer */
html[data-size='2'] footer div.partenaires p {
  font-size: 25.6px; /* 20 × 1.28 */
}

html[data-size='2'] #colophon div:not(.partenaires) .footer__main .footer__main__main span,
html[data-size='2'] #colophon div:not(.partenaires) .footer__main .footer__main__main span p {
  font-size: 23px; /* 18 × 1.28 */
}

html[data-size='2'] #colophon div:not(.partenaires) .footer__main .footer__main__main .coordonnees #nom,
html[data-size='2'] #colophon div:not(.partenaires) .footer__main .footer__main__main .raccourcis h2 {
  font-size: 28.16px; /* 22 × 1.28 */
}

/* Bandeau */
html[data-size='2'] #Bandeau h1.PageTitle {
  font-size: 44.8px; /* 35 × 1.28 */
}

html[data-size='2'] #Bandeau p.sous-titre {
  font-size: 21.76px; /* 17 × 1.28 */
}

/* Section EKLA en quelques mots */
html[data-size='2'] html body section.ekla-en-qlq-mots h2 {
  font-size: 32px; /* 25 × 1.28 */
}

html[data-size='2'] html body section.ekla-en-qlq-mots p {
  font-size: 23px; /* 18 × 1.28 */
}

/* Section Je suis */
html[data-size='2'] html body section.Je-suis ul li p {
  font-size: 30.72px; /* 24 × 1.28 */
}

/* Section Nos actions */
html[data-size='2'] html body section.nos-action div h2 {
  font-size: 5.76rem; /* 4.5 × 1.28 */
}

html[data-size='2'] html body section.nos-action div p {
  font-size: 32px; /* 25 × 1.28 */
}

html[data-size='2'] html body section.nos-action div a {
  font-size: 26.88px; /* 21 × 1.28 */
}

/* Carte et établissements */
html[data-size='2'] html body section.carte div.map-container div#filtre ul li {
  font-size: 26.88px; /* 21 × 1.28 */
}

html[data-size='2'] html body section.carte div.map-container div.etablissements h3 {
  font-size: 34.56px; /* 27 × 1.28 */
}

html[data-size='2'] html body section.carte div.map-container div.etablissements div.container-etablissements div.etablissement h4 {
  font-size: 32px; /* 25 × 1.28 */
}

html[data-size='2'] html body section.carte div.map-container div.etablissements div.container-etablissements div.etablissement p {
  font-size: 26.88px; /* 21 × 1.28 */
}

/* Vous avez la parole */
html[data-size='2'] html body section.vous-avez-la-parole div.flex-container div.citation p {
  font-size: 47.23px; /* 36.9 × 1.28 */
}

html[data-size='2'] html body section.vous-avez-la-parole div.flex-container div.citation span {
  font-size: 26.88px; /* 21 × 1.28 */
}

html[data-size='2'] html body section.vous-avez-la-parole div.flex-container div.content h2 {
  font-size: 5.76rem; /* 4.5 × 1.28 */
}

html[data-size='2'] html body section.vous-avez-la-parole div.flex-container div.content p {
  font-size: 32px; /* 25 × 1.28 */
}

/* Formulaires */
html[data-size='2'] .wpcf7-form-control-wrap.accept .wpcf7-list-item-label {
  font-size: 20.48px; /* 16 × 1.28 */
}

html[data-size='2'] .wpcf7-form-control-wrap span.wpcf7-list-item-label,
html[data-size='2'] .file_container .wpcf7-form-control-wrap span {
  font-size: 26.88px; /* 21 × 1.28 */
}

html[data-size='2'] html body form div.inner div.questions h2 {
  font-size: 5.76rem; /* 4.5 × 1.28 */
}

html[data-size='2'] html body form div.inner div.questions p.sous-titre,
html[data-size='2'] html body form div.inner div.infos label:not(.accept>label) {
  font-size: 26.88px; /* 21 × 1.28 */
}

html[data-size='2'] html body form div.inner div.infos div.submit input[value=Envoyer] {
  font-size: 26.88px; /* 21 × 1.28 */
}

/* Sections avec fond jaune */
html[data-size='2'] html body section.text-fond-jaune-motifs div.content div.text p,
html[data-size='2'] html body section.text-fond-jaune-motifs div.content ul li p,
html[data-size='2'] html body section.text-fond-jaune-motifs div.content ul li ul.links li a {
  font-size: 26.88px; /* 21 × 1.28 */
}

html[data-size='2'] html body section.text-fond-jaune-motifs div.content ul li h3 {
  font-size: 38.4px; /* 30 × 1.28 */
}

/* Sections raisons */
html[data-size='2'] section.raisons h2 {
  font-size: 53.76px; /* 42 × 1.28 */
}

html[data-size='2'] section.raisons div.container-raisons div.raison div.text h3 {
  font-size: 42.24px; /* 33 × 1.28 */
}

html[data-size='2'] section.raisons div.container-raisons div.raison div.text p {
  font-size: 21.76px; /* 17 × 1.28 */
}

/* Prestations */
html[data-size='2'] section.prestations div.prestations-container div.prestation .a_rep h3 {
  font-size: 28.16px; /* 22 × 1.28 */
}

/* Frise chronologique */
html[data-size='2'] section.frise-chronologique p.p_intro {
  font-size: 26.88px; /* 21 × 1.28 */
}

html[data-size='2'] section.frise-chronologique div.container-events div.event div.content h3,
html[data-size='2'] section.frise-chronologique div.container-events div.event div.content p {
  font-size: 25.6px; /* 20 × 1.28 */
}

/* Texte fond vert */
html[data-size='2'] div#templates div.text-fond-vert p,
html[data-size='2'] div#templates div.text-fond-vert ul li {
  font-size: 26.88px; /* 21 × 1.28 */
}

html[data-size='2'] div#templates div.deco-header h1 {
  font-size: 43.52px; /* 34 × 1.28 */
}

/* ==========================
   PALIER 3 - Grande taille
   ========================== */

/* Footer */
html[data-size='3'] footer div.partenaires p {
  font-size: 32px; /* 20 × 1.6 */
}

html[data-size='3'] #colophon div:not(.partenaires) .footer__main .footer__main__main span,
html[data-size='3'] #colophon div:not(.partenaires) .footer__main .footer__main__main span p {
  font-size: 28.8px; /* 18 × 1.6 */
}

html[data-size='3'] #colophon div:not(.partenaires) .footer__main .footer__main__main .coordonnees #nom,
html[data-size='3'] #colophon div:not(.partenaires) .footer__main .footer__main__main .raccourcis h2 {
  font-size: 35.2px; /* 22 × 1.6 */
}

/* Bandeau */
html[data-size='3'] #Bandeau h1.PageTitle {
  font-size: 56px; /* 35 × 1.6 */
}

html[data-size='3'] #Bandeau p.sous-titre {
  font-size: 27.2px; /* 17 × 1.6 */
}

/* Section EKLA en quelques mots */
html[data-size='3'] html body section.ekla-en-qlq-mots h2 {
  font-size: 40px; /* 25 × 1.6 */
}

html[data-size='3'] html body section.ekla-en-qlq-mots p {
  font-size: 28.8px; /* 18 × 1.6 */
}

/* Section Je suis */
html[data-size='3'] html body section.Je-suis ul li p {
  font-size: 38.4px; /* 24 × 1.6 */
}

/* Section Nos actions */
html[data-size='3'] html body section.nos-action div h2 {
  font-size: 7.2rem; /* 4.5 × 1.6 */
}

html[data-size='3'] html body section.nos-action div p {
  font-size: 40px; /* 25 × 1.6 */
}

html[data-size='3'] html body section.nos-action div a {
  font-size: 33.6px; /* 21 × 1.6 */
}

/* Carte et établissements */
html[data-size='3'] html body section.carte div.map-container div#filtre ul li {
  font-size: 33.6px; /* 21 × 1.6 */
}

html[data-size='3'] html body section.carte div.map-container div.etablissements h3 {
  font-size: 43.2px; /* 27 × 1.6 */
}

html[data-size='3'] html body section.carte div.map-container div.etablissements div.container-etablissements div.etablissement h4 {
  font-size: 40px; /* 25 × 1.6 */
}

html[data-size='3'] html body section.carte div.map-container div.etablissements div.container-etablissements div.etablissement p {
  font-size: 33.6px; /* 21 × 1.6 */
}

/* Vous avez la parole */
html[data-size='3'] html body section.vous-avez-la-parole div.flex-container div.citation p {
  font-size: 59.04px; /* 36.9 × 1.6 */
}

html[data-size='3'] html body section.vous-avez-la-parole div.flex-container div.citation span {
  font-size: 33.6px; /* 21 × 1.6 */
}

html[data-size='3'] html body section.vous-avez-la-parole div.flex-container div.content h2 {
  font-size: 7.2rem; /* 4.5 × 1.6 */
}

html[data-size='3'] html body section.vous-avez-la-parole div.flex-container div.content p {
  font-size: 40px; /* 25 × 1.6 */
}

/* Formulaires */
html[data-size='3'] .wpcf7-form-control-wrap.accept .wpcf7-list-item-label {
  font-size: 25.6px; /* 16 × 1.6 */
}

html[data-size='3'] .wpcf7-form-control-wrap span.wpcf7-list-item-label,
html[data-size='3'] .file_container .wpcf7-form-control-wrap span {
  font-size: 33.6px; /* 21 × 1.6 */
}

html[data-size='3'] html body form div.inner div.questions h2 {
  font-size: 7.2rem; /* 4.5 × 1.6 */
}

html[data-size='3'] html body form div.inner div.questions p.sous-titre,
html[data-size='3'] html body form div.inner div.infos label:not(.accept>label) {
  font-size: 33.6px; /* 21 × 1.6 */
}

html[data-size='3'] html body form div.inner div.infos div.submit input[value=Envoyer] {
  font-size: 33.6px; /* 21 × 1.6 */
}

/* Sections avec fond jaune */
html[data-size='3'] html body section.text-fond-jaune-motifs div.content div.text p,
html[data-size='3'] html body section.text-fond-jaune-motifs div.content ul li p,
html[data-size='3'] html body section.text-fond-jaune-motifs div.content ul li ul.links li a {
  font-size: 33.6px; /* 21 × 1.6 */
}

html[data-size='3'] html body section.text-fond-jaune-motifs div.content ul li h3 {
  font-size: 48px; /* 30 × 1.6 */
}

/* Sections raisons */
html[data-size='3'] section.raisons h2 {
  font-size: 67.2px; /* 42 × 1.6 */
}

html[data-size='3'] section.raisons div.container-raisons div.raison div.text h3 {
  font-size: 52.8px; /* 33 × 1.6 */
}

html[data-size='3'] section.raisons div.container-raisons div.raison div.text p {
  font-size: 27.2px; /* 17 × 1.6 */
}

/* Prestations */
html[data-size='3'] section.prestations div.prestations-container div.prestation .a_rep h3 {
  font-size: 35.2px; /* 22 × 1.6 */
}

/* Frise chronologique */
html[data-size='3'] section.frise-chronologique p.p_intro {
  font-size: 33.6px; /* 21 × 1.6 */
}

html[data-size='3'] section.frise-chronologique div.container-events div.event div.content h3,
html[data-size='3'] section.frise-chronologique div.container-events div.event div.content p {
  font-size: 32px; /* 20 × 1.6 */
}

/* Texte fond vert */
html[data-size='3'] div#templates div.text-fond-vert p,
html[data-size='3'] div#templates div.text-fond-vert ul li {
  font-size: 33.6px; /* 21 × 1.6 */
}

html[data-size='3'] div#templates div.deco-header h1 {
  font-size: 54.4px; /* 34 × 1.6 */
}

/* ==========================
   RÈGLES GÉNÉRALES UNIVERSELLES
   Force tous les paragraphes et textes à s'adapter
   ========================== */

/* Palier 2 : Multiplie par 1.28 */
html[data-size='2'] body {
  font-size: calc(1.6rem * 1.28) !important;
}

html[data-size='2'] p,
html[data-size='2'] .pageText ul li {
  font-size: calc(1.6rem * 1.28) !important;
  line-height: calc(2.1rem * 1.28) !important;
}

html[data-size='2'] ul li,
html[data-size='2'] ol li {
  font-size: calc(1.6rem * 1.28) !important;
}

/* Palier 3 : Multiplie par 1.6 */
html[data-size='3'] body {
  font-size: calc(1.6rem * 1.6) !important;
}

html[data-size='3'] p,
html[data-size='3'] .pageText ul li {
  font-size: calc(1.6rem * 1.6) !important;
  line-height: calc(2.1rem * 1.6) !important;
}



html[data-size='3'] ul li,
html[data-size='3'] ol li {
  font-size: calc(1.6rem * 1.6) !important;
}

html[data-size='2'] body:not(.home) .wrapper {
  margin-top: 15% !important;
}


html[data-size='3'] body:not(.home) .wrapper {
  margin-top: 20% !important;
}

/* Avec mode contraste : tous les paliers */
html[data-size='1'] body.contrast:not(.home) h1,
html[data-size='2'] body.contrast:not(.home) h1,
html[data-size='3'] body.contrast:not(.home) h1,
/* Sans contraste : seulement paliers 2 et 3 */
html[data-size='2'] body:not(.contrast):not(.home) h1,
html[data-size='3'] body:not(.contrast):not(.home) h1 {
    margin: 0 auto;
    position: static!important;
}

/* Couleur h1 pour paliers 2 et 3 */
html[data-size='2'] body:not(.home) h1,
html[data-size='3'] body:not(.home) h1 {
    color: #2f606b !important;
}



html[data-size='1'] body.contrast:not(.home) .wrapper {
  margin-top: 12% !important;
}

/* Masquer images deco-header : avec contraste OU avec data-size 2/3 */
html[data-size='1'] body.contrast:not(.home) #templates div.deco-header img,
html[data-size='2'] body.contrast:not(.home) #templates div.deco-header img,
html[data-size='3'] body.contrast:not(.home) #templates div.deco-header img,
html[data-size='2'] body:not(.contrast):not(.home) #templates div.deco-header img,
html[data-size='3'] body:not(.contrast):not(.home) #templates div.deco-header img {
    display: none;
}



.contrast{ 
    .Sup_Header{
        background: black!important;
    }
    /*Tous les blocs du site*/
    .map-container,
    section:not(.footer__main), 
    form,
    div#templates div.text-fond-vert{
        background: white!important;
        box-shadow: inherit!important;
    }
    h2, h3, h4, h5, p, span, label, li,
    .raison p{
        color: black!important;
    }
    h1 + p {
        color: white!important;
    }

    /*Handicap et entreprise*/
    section.raisons{
        background: transparent!important;
        z-index: 1;
    }
    .raison{
        background: white!important;
    }

    .prestation {
        .container_bat_presta{
            background: black!important;
            *{
                color: white!important;
            }
        }
        .a_rep img{
                box-shadow: black 0px 0px 0px 20px!important;
        }
    }

    /*Offres emplois*/
    .offres-emploi{
        .container{
            background: transparent!important;
            *{
                color: black!important;
            }
        }
        .container-image{
            background: black!important;
            box-shadow: rgb(85, 85, 85) 0px 0px 0px 20px!important;
        }
    }

    /*Menu*/
    .menu-item-has-children .sub-menu li {
        background-color: black!important;
    }

    .Sup_Header .Contact{
        background: white!important;
        color: black!important;
    }

    /*Footer*/
    #colophon{
        background: black!important;
        *{
            color: white!important;
            background: black!important;

        }
    }
    /*Boutons*/
    #tel_broch_qsn,
    .more_act_quot,
    .savoir-plus,
    .bouton,
    .lienUnapei,
    button,
    input[value=Envoyer]{
        color: white!important;
        background-color: black!important;
    }
    /*Input divers*/
    input[type=checkbox], input[type=radio]{
        border-color: black;
    }
    input, textarea{
        border: 1px solid black!important;
    }
    /*Schéma*/
    .rond-vert,
    .rond-bleu,
    .rond-blanc{
        border: 3px solid black!important;
        background: white!important;
        *{
            color: black!important;
        }
    }
    .rond-bleu{
        z-index: 1!important;
    }
    .rond-blanc, .rond-vert{
        z-index: 2!important;
    }
    /*Lien*/
    form a,
    #raccourcies a{
        color: black!important;
    }
    /*Réseaux sociaux*/
    .commun_nav_rs{
        filter: grayscale(1);
    }
    /*Not home header*/
    &:not(.home){
        h1{
            color: black!important;

        }
        /* .deco-header{
            height: 250px!important;
        } */
    }
    /*Articles*/
    .info-articles{
        background: black!important;
        h3, p{
            color: white!important;
        }
    }
    .contour-img{
            background: black!important;
            box-shadow: rgb(41 41 41 / 30%) 0px 0px 0px 20px!important;
        }

    /*Spécifique map*/
    .map-container div.etablissements div.container-etablissements div.etablissement{
        border-bottom-color: black!important;
    }
    .container-etablissements::-webkit-scrollbar-thumb {
        background: black!important;
    }

    /*FAQ*/
    section.faq div.groupe-questions div.question.closed h3:hover{
        background: black!important;
        color: white!important;
    }
    section.faq div.groupe-questions div.question.open h3 {
        background: black!important;
        color: white!important;
    }
    section.faq div.groupe-questions div.question div.reponse{
        background: black!important;
        *{
            color: white!important;
        }
    }
}

