/* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 License: none (public domain) */
 html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
     margin: 0;
     padding: 0;
     border: 0;
    /* font: inherit;
     */
     vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
 article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
     display: block;
}
 body {
     line-height: 1;
}
 ol, ul {
     list-style: none;
}

@font-face {
    font-display: swap;
    font-family: 'Questrial';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/questrial-v18-latin-regular.woff2') format('woff2'), url('../fonts/questrial-v18-latin-regular.ttf') format('truetype');
}

:root{
    --color_txt: #333;
    --color_vert_armadiyo: #56A804;
    /*#8cc540 */
    --color_ecoconception: #D93B3B;
    --color_seo_geo: #055864;
    --color_outils_numeriques: #B81365;
}
/* ------------------------------- */
/* CSS by Armadiyo (Mars 2023)     */
/* www.armadiyo.com                */
/* ------------------------------- */
 * {
     font-family: 'Questrial', sans-serif;
     -webkit-font-smoothing: antialiased;
     box-sizing: border-box;
     -webkit-box-sizing: border-box;
     outline: none;
     color:var(--color_txt);
}
 body {
     text-align: center;
     margin: auto;
}


 .clear{
    clear:both;
}
 .floatLeft{
    float:left;
}
 .floatRight{
    float:right;
}
 .tac{
    text-align:center;
}
 .tal{
    text-align:left;
}
 .tar{
    text-align:right;
}
.padr10{
    padding-right: 10px;
}
.padl10{
    padding-left: 10px;
}
.padr15{
    padding-right: 15px;
}
.padl15{
    padding-left: 15px;
}
.mb0{
    margin-bottom: 0px;
}
.hideOnDesktop{
    display: none;
}
.hideOnDesktopAndTablet{
    display: none;
}
.onlyForLess1400px{
    display: none;
}

.container{
    width: 90%;
    /*height: 100%;*/
    vertical-align: top;
    margin:30px auto 30px auto;
    position: relative;
    text-align: left;
    max-width: 1400px;
    z-index: 2;
}

table.tab_simple {
  width: 100%;
  border: 0;
  border-collapse: collapse;
}
table.tab_simple th{
  text-align: left;
  color: white;
  padding: 15px 10px;
  background-color: var(--color_vert_armadiyo);
  font-weight: normal;
  font-size: 14px;
  cursor: pointer;
}
table.tab_simple td{
  color: var(--color_txt);
  text-align: left;
  padding: 10px 10px;
  border-bottom: 1px solid var(--color_vert_armadiyo);
  font-size: 14px;
  line-height: 1.3;
  cursor: pointer;
}
table.tab_simple tr:nth-child(even) td{
    background-color: #efefef;
}
a:link, a:visited, a:hover, a:active {
    outline: none;
}


h1, h2, h3, h4, h5, h6 {
    clear: both;
    font-weight: normal;
    margin: 0px;
}
h1{
    font-size: 48px;
    line-height: 1.3em;
    color: var(--color_vert_armadiyo);
    font-weight: 400;
    margin-bottom: 20px;
}
h1 strong{
    color: var(--color_vert_armadiyo);
}
h1 span{
    font-size: 48px;
    line-height: 1.3em;
    color: var(--color_vert_armadiyo);
    font-weight: 400;
}
h2{
    font-size: 36px;
    line-height: 1.3em;
    font-weight: 300;
    color: var(--color_vert_armadiyo);
    margin-bottom: 36px;
}
h3{
   color: var(--color_txt);
   font-size: 28px;
   margin-bottom: 20px;
   line-height: 1em;
   padding-bottom: 16px;
}

p{
    font-size: 20px;
    line-height: 1.3em;
    font-weight: 300;
}
p.surtitre{
    font-size: 14px;
    line-height: 1em;
    font-weight: 500;
    text-transform: uppercase;
    padding: 5px 10px;
    display: inline-block;
}

ul{
    list-style: square;
    margin-left: 30px;
}
li{
     font-size: 20px;
     line-height: 1.3em;
     font-weight: 300;
}
b, strong {
     font-weight: 600;
}
a{
     color: var(--color_txt);
     text-decoration: none;
}
a:hover{
     text-decoration: none;
}
a.evitement {
   display: inline-block;
   color: #2f2f2f;
   background: #fff;
   padding: .5em;
   position: absolute;
   left: -99999rem;
   z-index: 100;
}
a.evitement:focus {
   left: 0;
}

/* Modification janvier 2026 */
.barre-verticale{
    width:60px;
    position: fixed;
    height: 100%;
    top: 0px; 
    right: 0px;
    z-index: 499;
    background-color:var(--color_vert_armadiyo);
}

.bloc-content{
    margin:50px 0px;width: 80%;text-align: left;position: relative;
}
.bloc-content-fullwidth{
    width: 90%;
}
.bloc-content ul{
    list-style: none;
    margin: 0;
}
.bloc-content ul li{
    margin-bottom: 20px;
    margin-left: 0px;
}
.bloc-content p{
    margin-bottom: 9px;
}
.bloc-content p.mb0{
    margin-bottom: 0px;
}
.bloc-content-bg{
    padding: 40px;
    display: inline-block;
    margin:0px auto;
}
.bloc-content-big{
    margin-bottom: 80px;
}
.bloc-content-encadre{
    padding: 40px;
    display: inline-block;
    width: 80%;
    margin-top: 40px;
}
.bloc-content-encadre-green{
    border: 1px solid var(--color_vert_armadiyo);
}
.bloc-content-encadre-blue{
    border: 1px solid var(--color_seo_geo);
}
.bloc-content-encadre-red{
    border: 1px solid var(--color_ecoconception);
}
.bloc-content-bg-container{
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    align-items: stretch;
}
.bloc-content-bg-col{
    flex: 1 1 calc(50% - 20px);
}
/*
.bloc-content-bg-col{
    float:left;width:50%;display: inline-block;
}

.bloc-content-bg-col:nth-child(1){
    padding-right: 20px;
}
.bloc-content-bg-col:nth-child(2){
    padding-left: 20px;
}
*/
.style_h1{
    display: inline;
    font-size: 48px;
    line-height: 1.1em;
    color: var(--color_vert_armadiyo);
    font-weight: 400;
}
h1{
    line-height: 1.1em;
    display: inline;
}
h1 span{
    line-height: 1.1em;
}
h2{
    font-size: 34px;
    border-top: 1px solid var(--color_vert_armadiyo);
    padding-top: 30px;
    margin: 20px 0px 20px 0px;
}
h2 strong{
    color: var(--color_vert_armadiyo);
}
h2.sans_ligne{
    border-top: 0px;
    padding-top: 0px;
    margin-top: 0px;
}

h3{
    font-size: 28px;
    margin: 30px 0px 10px 0px;
}
h3 i{
    font-size: 20px;
}
h4{
    font-size: 22px;
    font-weight: bold;
    margin: 20px 0px 10px 0px;
}
h5{
    font-size: 20px;
    font-weight: bold;
    margin: 20px 0px 10px 0px;
}

.indicateur-page{font-size: 16px;color: #797676;}

/* Style de l'élément porteur de l'infobulle */
.tooltip-container {
  position: relative;
  cursor: help;
  border-bottom: 1px dotted #666;
  padding-bottom: 2px;
}

/* Création de l'infobulle (cachée par défaut) */
.tooltip-container::after {
  content: attr(data-tooltip);
  position: absolute;
  bottom: 150%;
  left: 0;
  width: 220px;
  padding: 10px;
  background-color: #333;
  color: #fff;
  text-align: center;
  font-size: 0.8rem;
  border-radius: 4px;
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.3s ease;
  z-index: 10;
}

/* Petit triangle sous l'infobulle */
.tooltip-container::before {
  content: "";
  position: absolute;
  bottom: 130%;
  left: 50%;
  transform: translateX(-50%);
  border-width: 8px 8px 0 8px;
  border-style: solid;
  border-color: #333 transparent transparent transparent;
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.3s ease;
}

/* Affichage au survol */
.tooltip-container:hover::after,
.tooltip-container:hover::before {
  visibility: visible;
  opacity: 1;
}

.btn{line-height:1em;cursor:pointer;display: inline-block;padding: 10px 30px;text-decoration:none !important;font-size:18px;transition: all 0.3s ease-out;margin:10px 0px;border-radius: 3px;}
.btn-small{cursor:pointer;display: inline-block;padding: 5px 15px;text-decoration:none !important;font-size:16px;transition: all 0.3s ease-out;margin:10px 0px;border-radius: 3px;}
.btn-green{background-color: var(--color_vert_armadiyo);border:1px solid var(--color_vert_armadiyo);color:white;}
.btn-green:hover{background-color: transparent;color: var(--color_vert_armadiyo);border-left:10px solid var(--color_vert_armadiyo);}
.btn-white{background-color: #ffffff;border:1px solid #ffffff;color:var(--color_txt);}
.btn-white:hover{background-color: transparent;color: #ffffff;border-left:10px solid #ffffff;}
.btn-url{background-color: var(--color_vert_armadiyo);border:1px solid var(--color_vert_armadiyo);color:white;}
.btn-url:hover{background-color: transparent;color: var(--color_vert_armadiyo);border-left:10px solid var(--color_vert_armadiyo);}
.btn-ghost{background-color: #ffffff;border:1px solid var(--color_vert_armadiyo);color:var(--color_txt);}
.btn-ghost:hover{background-color: transparent;color:var(--color_txt);border-left:10px solid var(--color_vert_armadiyo);}

/* Bloc 3 axes */
.bloc-3axes-container{
    display: flex;
    flex-wrap: wrap;
    gap: 0px;
}
.bloc-3axes{
    flex: 1 1 calc(33.333%);
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items:flex-start; 
    /*
    justify-content: space-between;
    float:left;
    width:33%;
    min-height: 500px;
    */
    background-color:#D93B3B;
    padding: 30px;
    text-align: left;
    transition: all 0.2s ease-in;
}
.bloc-3axes-eco-conception{
    background-color: var(--color_ecoconception);
}
.bloc-3axes-outils-numeriques{
    background-color: var(--color_outils_numeriques);
}
.bloc-3axes-seo-geo{
    background-color: var(--color_seo_geo);
}
.bloc-3axes:hover{margin-top: -20px !important;margin-bottom: 20px !important;}
.bloc-3axes h2{
    color:white;font-size: 28px;line-height: 1.1em;margin-bottom: 20px;margin-top: 0px;border:0;padding: 0;
}
.bloc-3axes svg{
    width: 18px;
    fill: white;
}
.bloc-3axes p{
    color: white;
    margin-bottom: 20px;
}


/* Page Accueil */
.page-accueil h1{display: inline-block;margin-left: 20px;}
.page-accueil h1 strong{color:var(--color_vert_armadiyo)}
.page-accueil h2{margin-bottom: 25px;border: 0;}
.page-accueil h2 strong{color: var(--color_vert_armadiyo);}
.page-accueil .actu-news ul li:last-child{padding-right: 0px;}
.page-accueil .actu ul{margin: 0px auto 9px auto;}
.page-accueil .actu ul li{width:33%;padding:0px 40px 0px 10px;min-height: 270px;border-left: 3px solid var(--color_vert_armadiyo);}
.page-accueil .actu ul li.actu-ecoconception{border-left: 3px solid var(--color_ecoconception);}
.page-accueil .actu ul li.actu-seo-geo{border-left: 3px solid var(--color_seo_geo);}
.page-accueil .actu ul li.actu-outils-numeriques{border-left: 3px solid var(--color_outils_numeriques);}
.page-accueil .actu ul li h3{font-size:22px;margin-bottom: 10px;line-height: 1.1em;color:var(--color_vert_armadiyo);}
.page-accueil .actu ul li p{margin-bottom: 20px;}
.page-accueil .actu ul li.actu-ecoconception h3{color:var(--color_ecoconception);}
.page-accueil .actu ul li.actu-seo-geo h3{color:var(--color_seo_geo);}
.page-accueil .actu ul li.actu-outils-numeriques h3{color:var(--color_outils_numeriques);}
.page-accueil p{
    line-height: 1.4em;
    margin-bottom: 9px;
}
.page-accueil .actu-news{
    margin:70px 0px;width: 100%;text-align: left;
}
.page-accueil .grid-container{
    max-width: unset;
}


/* Page par défaut */
.bloc-content-bg{
    background-color: var(--color_vert_armadiyo);
    color: white;
}

.bloc-content-bg h2,
.bloc-content-bg h3{
    margin-top: 0px;
    padding-top: 0px;
    border: 0px;
}
.bloc-content-bg h2,
.bloc-content-bg h3,
.bloc-content-bg h4,
.bloc-content-bg p,
.bloc-content-bg a,
.bloc-content-bg strong{
    color: white;
}
.bloc-content-bg a.btn-white{
    color: var(--color_txt);
}
.bloc-content-bg a.btn-white:hover{
    color: white;
}
.bloc-content-bg .classic li,
.bloc-content-bg .classic li strong{
    color: white;
}
.faq-question svg{
    fill: var(--color_vert_armadiyo);
}

/* Page Eco-conception */

.page-ecoconception h1,
.page-ecoconception h1 strong,
.page-ecoconception h1 em,
.page-ecoconception h1 i,
.page-ecoconception h3,
.page-ecoconception h3 strong,
.page-ecoconception h3 em,
.page-ecoconception h3 i{
    color: var(--color_ecoconception);
}

.page-ecoconception .surtitre,
.page-ecoconception .barre-verticale,
.page-ecoconception .bloc-content-bg{
    background-color: var(--color_ecoconception);
    color: white;
}

.page-ecoconception .bloc-content-bg h2,
.page-ecoconception .bloc-content-bg h3{
    margin-top: 0px;
    padding-top: 0px;
    border: 0px;
}
.page-ecoconception .bloc-content-bg h2,
.page-ecoconception .bloc-content-bg h3,
.page-ecoconception .bloc-content-bg h4,
.page-ecoconception .bloc-content-bg p,
.page-ecoconception .bloc-content-bg a,
.page-ecoconception .bloc-content-bg strong{
    color: white;
}
.page-ecoconception .bloc-content-bg .classic li,
.page-ecoconception .bloc-content-bg .classic li strong{
    color: white;
}
.page-ecoconception .faq-question svg{
    fill: var(--color_ecoconception);
}

/* Page SEO-GEO */
.page-seo-geo h1,
.page-seo-geo h1 strong,
.page-seo-geo h1 em,
.page-seo-geo h1 i,
.page-seo-geo h3,
.page-seo-geo h3 strong,
.page-seo-geo h3 em,
.page-seo-geo h3 i{
    color: var(--color_seo_geo);
}

.page-seo-geo .surtitre,
.page-seo-geo .barre-verticale,
.page-seo-geo .bloc-content-bg{
    background-color: var(--color_seo_geo);
    color: white;
}
.page-seo-geo .bloc-content-bg h2,
.page-seo-geo .bloc-content-bg h3{
    margin-top: 0px;
    padding-top: 0px;
    border: 0px;
}
.page-seo-geo .bloc-content-bg h2,
.page-seo-geo .bloc-content-bg h3,
.page-seo-geo .bloc-content-bg h4,
.page-seo-geo .bloc-content-bg p,
.page-seo-geo .bloc-content-bg strong{
    color: white;
}
.page-seo-geo .bloc-content-bg .classic li,
.page-seo-geo .bloc-content-bg .classic li strong{
    color: white;
}
.page-seo-geo .faq-question svg{
    fill: var(--color_seo_geo);
}

/* Page Outils Numériques */
.page-outils-numeriques h1,
.page-outils-numeriques h1 strong,
.page-outils-numeriques h1 em,
.page-outils-numeriques h1 i,
.page-outils-numeriques h3,
.page-outils-numeriques h3 strong,
.page-outils-numeriques h3 em,
.page-outils-numeriques h3 i{
    color: var(--color_outils_numeriques);
}

.page-outils-numeriques .surtitre,
.page-outils-numeriques .barre-verticale,
.page-outils-numeriques .bloc-content-bg{
    background-color: var(--color_outils_numeriques);
    color: white;
}
.page-outils-numeriques .bloc-content-bg h2,
.page-outils-numeriques .bloc-content-bg h3{
    margin-top: 0px;
    padding-top: 0px;
    border: 0px;
}
.page-outils-numeriques .bloc-content-bg h2,
.page-outils-numeriques .bloc-content-bg h3,
.page-outils-numeriques .bloc-content-bg h4,
.page-outils-numeriques .bloc-content-bg p,
.page-outils-numeriques .bloc-content-bg strong{
    color: white;
}
.page-outils-numeriques .bloc-content-bg .classic li,
.page-outils-numeriques .bloc-content-bg .classic li strong{
    color: white;
}
.page-outils-numeriques .faq-question svg{
    fill: var(--color_outils_numeriques);
}


.pleine_largeur{
    position: relative;
    margin: 0px auto 0px auto;
    padding: 48px 0px 48px 0px;
    z-index: 3;
}
.pleine_largeur div{
    max-width: 1152px;
    margin: 0 auto;
}
.boite_contenu{
    position: relative;
    margin: 0px auto;
    padding: 48px 0px 48px 0px;
    z-index: 1;
}
.boite_contenu div{
    margin: 0;
}
.avec_espaceur{
    border-bottom: 2px solid #e3cfc8;
}
.boite_contenu img{
    max-width: 100%;
}
.bloc-visuel-alaune{
    width: 100%;
    max-width: 1120px;
    height: 399px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

/* Page Blog */
/* ------------------------------- */
.bloc-actu{
    position: relative;
    display: inline-block;
    width: 90%;
    height: 528px;
    /*max-width: 368px !important;*/
    text-align: left;
    padding: 0px 0px 0px 0px;
    overflow: hidden;
    cursor: pointer;
    border: 1px;
    border-style: solid;
    border-color: var(--color_vert_armadiyo);
    transition: all 0.3s;
    margin-bottom: 24px !important
}
.bloc-actu div{
    text-align: left;
    padding: 0px 24px 0px 24px;
    position: relative;
}
.bloc-actu img{
    display: inline-block;
    width: 100%;
}
/*
.bloc-actu-img{
    width: 100%;
    padding: 0px !important;
    margin-bottom: 10px;
}
.bloc-actu-img img{
    width: 100%;
}
*/

.bloc-actu-img {
  width: 100%;
  height: 220px;
  overflow: hidden;
  margin-bottom: 10px;
  padding: 0px !important;
}

.bloc-actu-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

.bloc-actu .btn-small{
    border: 1px solid var(--color_vert_armadiyo);
    background-color: var(--color_vert_armadiyo);
    color: white;
    position: absolute;
    bottom: 10px;
    left: 24px;
    font-size: 16px;
}
.bloc-actu:hover .btn-small,
.bloc-actu .btn-small:hover{
    border-left:10px solid var(--color_vert_armadiyo);
    background-color: white;
    color: var(--color_vert_armadiyo);
}

.extrait-actu{
    font-size: 16px;
    line-height: 1.4em;
    margin-bottom: 5px;
}
.date-actu{
    font-size: 12px;
    font-weight: 700;
    display: inline-block;
    margin-top: 0px;
    margin-bottom: 0px !important;
}
.bloc-actu h1{
    margin-bottom: 0px;
}
.bloc-actu h2{
    font-size: 20px;
    border: 0;
    padding: 0;
    margin: 10px 0px 10px 0px;
    line-height: 1em;
}
.bloc-actu a{
    font-size: 14px;
}

.page-blog h1{display:inline-block;}
.page-blog .bloc-actu{
    margin-bottom: 24px;
}
.page-blog .navigation{
    display: inline-block;
    margin-top: 24px;
    margin-bottom: 24px;
}
.page-blog .navigation a{
    display: inline-block;
    width: 38px;
    height: 38px;
    line-height: 38px;
    text-decoration: none;
    margin: 0 5px;
    border: 1px solid transparent;
}
.page-blog .navigation a:hover{
    border: 1px solid var(--color_vert_armadiyo);
}
.page-blog .navigation a.active{
    width: 40px;
    height: 40px;
    line-height: 40px;
    background-color: var(--color_vert_armadiyo);
    color: white;
}
.page-blog .navigation a.previous,
.page-blog .navigation a.next{
    width: auto;
    border: 1px solid transparent;
    margin: 0 15px;
}
.page-blog .navigation a.disable,
.page-blog .navigation a.disable i{
    color: #757575;
    opacity: 0.5;
}

.page-blog .bloc-intro{
    margin: 0px auto 24px auto !important;
    padding: 48px 0px !important;
}
.page-blog .bloc-intro .date-actu{
    color: var(--color_vert_armadiyo);
    /*font-size: 16px;*/
    font-size: 14px;
    margin-top: 0px;
}
.page-blog .bloc-intro h1{
    color: var(--orange_ee_accessible);
    padding: 24px 144px;
    font-size: 24px;
    line-height: 120%;
}
.page-blog .bloc-intro .accroche{
    font-size: 18px;
    padding: 0px 144px;
    margin-bottom: 0px !important;
}
.page-blog .accroche{
    font-size: 22px;
    margin-bottom: 0px !important;
    margin-top: 20px;
}
.page-blog .boite_contenu{
    padding: 24px 0px 24px 0px;
}
.page-blog h2{
    margin-top: 16px;
}
.page-blog h3{
    margin: 20px 0px 0px 0px;
}
.page-blog .bloc-actu-img{
    margin-bottom: 20px !important;
}
.page-blog a{
    text-decoration: underline;
}

address.signature-agence {
  font-style: italic;
  border-top: 1px solid #e0e0e0;
  margin-top: 2rem;
  margin-bottom: 2rem;
  padding-top: 1rem;
  font-size: 16px;
  color: #333;
  width: 80%;
}

/* Page Reference                   */
/* -------------------------------- */
.surligne{
    border-top: 1px solid var(--color_vert_armadiyo);
}
.img-contenu{
    width: 100%;
    max-width: 880px !important;
}
.page-reference .grid-container{
    max-width: unset;
}
.page-reference .bloc-intro{
    margin: 0px auto 48px auto !important;
}
.page-reference main section.boite_contenu{
    padding: 24px 0px 24px 0px;
}
.page-reference .accroche{
    margin-top: 20px;
}
.bloc-standard {
    padding: 0px !important;
    margin-top: 48px;
}
.bloc-standard h2{
    border: 0;
    padding-top: 0px;
}
.accorche p,
.bloc-standard p,
.bloc-standard ul{
    margin-bottom: 18px;
}
.bloc-standard li{
    margin-bottom: 9px;
}
.bloc-standard a{
    text-decoration: underline;
}
.section-1  {
    margin-top: 0px;
}
.section-1 h2:first-child{
    margin-top: 0px !important;
    padding-top: 0px !important;
}
.bloc-reference{
    display: inline-block;
    width: 90%;
    height: 454px;
    /*max-width: 280px !important;*/
    position: relative;
    overflow: hidden;
    margin-bottom: 24px !important;
    cursor: pointer;
    
    border: 1px;
    border-style: solid;
    border-color: var(--color_vert_armadiyo);

    transition: all 0.3s;
}
.bloc-reference:hover{
    border-style: solid;
}

.bloc-reference div{
    text-align: left;
    padding: 0px 24px 0px 24px;
    position: relative;
}
.page-reference .bloc-actu-img{
    width:100%;
    padding: 0;
    /*
    height: 190px;
    */
    margin-bottom: 10px;
}

.tags{
    margin-bottom: 10px;
}
.tag-reference{
    /*
    background-color: var(--color_vert_armadiyo);
    color: white;
    */
    border: 1px solid var(--color_vert_armadiyo);
    color: var(--color_vert_armadiyo);
    font-size: 14px;
    line-height: 100%;
    font-weight: 500;
    display: inline-block !important;
    padding: 6px 8px;
    margin: 0px 5px 5px 0px;
    border-radius: 3px;
}

.bloc-reference .btn-small{
    border: 1px solid var(--color_vert_armadiyo);
    background-color: var(--color_vert_armadiyo);
    color: white;
    position: absolute;
    bottom: 10px;
    left: 24px;
}
.bloc-reference:hover .btn-small,
.bloc-reference .btn-small:hover{
    border-left:10px solid var(--color_vert_armadiyo);
    background-color: white;
    color: var(--color_vert_armadiyo);
}

.bloc-reference h2{
    font-size: 20px;
    border: 0;
    padding: 0;
    margin: 10px 0px 10px 0px;
    line-height: 1em;
}
.metadata-reference{
    font-size: 16px;
    color: --var(--color_vert_armadiyo);
    margin-top: 0px;
    margin-bottom: 0px;
}
.btn-reference{
    width: 48px;
    height: 48px;
    line-height: 48px;
    flex-grow: 0;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 10px;
    background-color: var(--color_vert_armadiyo);
    color: white;
    position: absolute;
    bottom: 0px;
    right: 0px;
}
.btn-reference,
.btn-reference i{
    color: white;
    display: inline-block;
    text-decoration: none;
    text-align: center;
    transition: all 0.2s;
}
.bloc-reference:hover > .btn-reference i{
    margin-left: 20px;
}

.bloc-filtres{
    margin:0;
    padding:0 !important;
    text-align: left;
}
.bloc-filtres p{
    margin-bottom: 10px;
}
.bloc-filtres-mobile{
    width: 100%;
    text-align: right;
    color: var(--color_vert_armadiyo);
    font-weight: 700;
    border-bottom: 1px solid var(--color_vert_armadiyo);
    padding: 4px 20px 24px 20px;
}
.bloc-filtres h2{
    color: var(--color_vert_armadiyo);
}
#filtre-active{
    font-size: 18px;
    line-height: 1em;
    color: white;
    padding: 8px 16px;
    border: 1px solid white;
    margin-top: 24px;
    display: none;
}

.item-filtre{
    font-size: 14px;
    padding:6px 12px;
    border: 1px solid var(--color_vert_armadiyo);
    color:  var(--color_vert_armadiyo);
    cursor: pointer;
    white-space: nowrap;
    margin-bottom: 12px;
    margin-right: 16px;
    display: inline-block;
    transition: all 0.3s;
}
.item-filtre:hover{
    background-color: var(--color_vert_armadiyo);
    color: white;
}
.item-filtre-active{
    background-color: var(--color_vert_armadiyo);
    color: white;
}


/* Catégorie Eco conception */
.page-item-methode-13 .btn-url,
.page-item-methode-13 .tag-reference,
.item-methode-13 .tag-reference,
.item-methode-13 .btn-small,
#filtre-item-methode-13{
    border: 1px solid var(--color_ecoconception);
}
.item-methode-13 .bloc-reference{
    border-color: var(--color_ecoconception);
}
.page-item-methode-13 .btn-url,
.item-methode-13 .btn-small{
    background-color: var(--color_ecoconception);
    color: white;
}
.page-item-methode-13 .btn-url:hover,
.item-methode-13:hover .btn-small,
.item-methode-13 .btn-small:hover{
    background-color: white;
    color: var(--color_ecoconception);
    border-left:10px solid var(--color_ecoconception);
}
.page-item-methode-13 h1,
.page-item-methode-13 .tag-reference,
.item-methode-13 .tag-reference,
.item-methode-13 .bloc-reference h2,
#filtre-item-methode-13{
    color: var(--color_ecoconception);
}
#filtre-item-methode-13.item-filtre-active,
#filtre-item-methode-13:hover{
    background-color: var(--color_ecoconception);
    color: white;
}
.page-item-methode-13 .barre-verticale{
    background-color: var(--color_ecoconception);
    color: white;
}
.page-item-methode-13 .bloc-reference .btn-small, 
.page-item-methode-13 .btn-reference{
    background-color: var(--color_ecoconception);
    color: white;
}

/* Catégorie SEO GEO */
.page-item-methode-14 .btn-url,
.page-item-methode-14 .tag-reference,
.item-methode-14 .tag-reference,
.item-methode-14 .btn-small,
#filtre-item-methode-14{
    border: 1px solid var(--color_seo_geo);
}
.item-methode-14 .bloc-reference{
    border-color: var(--color_seo_geo);
}
.page-item-methode-14 .btn-url,
.item-methode-14 .btn-small{
    background-color: var(--color_seo_geo);
}
.page-item-methode-14 .btn-url:hover,
.item-methode-14:hover .btn-small,
.item-methode-14 .btn-small:hover{
    background-color: white;
    color: var(--color_seo_geo);
    border-left:10px solid var(--color_seo_geo);
}
.page-item-methode-14 h1,
.page-item-methode-14 .tag-reference,
.item-methode-14 .tag-reference,
.item-methode-14 .bloc-reference h2,
#filtre-item-methode-14{
    color: var(--color_seo_geo);
}
#filtre-item-methode-14.item-filtre-active,
#filtre-item-methode-14:hover{
    background-color: var(--color_seo_geo);
    color: white;
}
.page-item-methode-14 .barre-verticale{
    background-color: var(--color_seo_geo);
    color: white;
}
.page-item-methode-14 .bloc-reference .btn-small, 
.page-item-methode-14 .btn-reference{
    background-color: var(--color_seo_geo);
    color: white;
}

/* Catégorie Outil numérique */
.page-item-methode-8 .btn-url,
.item-methode-8 .tag-reference,
.page-item-methode-8 .tag-reference,
.item-methode-8 .btn-small,
#filtre-item-methode-8{
    border: 1px solid var(--color_outils_numeriques);
}
.item-methode-8 .bloc-reference{
    border-color: var(--color_outils_numeriques);
}
#filtre-item-methode-8.item-filtre-active,
#filtre-item-methode-8:hover{
    background-color: var(--color_outils_numeriques);
    color: white;
}
.page-item-methode-8 h1,
.page-item-methode-8 .tag-reference,
.item-methode-8 .tag-reference,
.item-methode-8 .bloc-reference h2,
#filtre-item-methode-8{
    color: var(--color_outils_numeriques);
}
.page-item-methode-8 .btn-url,
.item-methode-8 .btn-small{
    background-color: var(--color_outils_numeriques);
    color: white;
}
.page-item-methode-8 .btn-url:hover,
.item-methode-8:hover .btn-small,
.item-methode-8 .btn-small:hover{
    background-color: white;
    color: var(--color_outils_numeriques);
    border-left:10px solid var(--color_outils_numeriques);
}
.page-item-methode-8 .barre-verticale{
    background-color: var(--color_outils_numeriques);
    color: white;
}
.page-item-methode-8 .bloc-reference .btn-small, 
.page-item-methode-8 .btn-reference{
    background-color: var(--color_outils_numeriques);
    color: white;
}

/* Catégorie Site participatif */
.page-item-methode-12 .btn-url,
.page-item-methode-12 .tag-reference,
.item-methode-12 .tag-reference,
.item-methode-12 .bloc-reference,
.item-methode-12 .btn-small,
#filtre-item-methode-12{
    border: 1px solid var(--color_outils_numeriques);
}
.item-methode-12 .bloc-reference{
    border-color: var(--color_outils_numeriques);
}
#filtre-item-methode-12.item-filtre-active,
#filtre-item-methode-12:hover{
    background-color: var(--color_outils_numeriques);
    color: white;
}
.page-item-methode-12 h1,
.page-item-methode-12 .tag-reference,
.item-methode-12 .tag-reference,
.item-methode-12 .bloc-reference h2,
#filtre-item-methode-12{
    color: var(--color_outils_numeriques);
}
.page-item-methode-12 .btn-url,
.item-methode-12 .btn-small{
    background-color: var(--color_outils_numeriques);
    color: white;
}
.page-item-methode-12 .btn-url:hover,
.item-methode-12:hover .btn-small,
.item-methode-12 .btn-small:hover{
    background-color: white;
    color: var(--color_outils_numeriques);
    border-left:10px solid var(--color_outils_numeriques);
}
.page-item-methode-12 .barre-verticale{
    background-color: var(--color_outils_numeriques);
    color: white;
}
.page-item-methode-12 .bloc-reference .btn-small, 
.page-item-methode-12 .btn-reference{
    background-color: var(--color_outils_numeriques);
    color: white;
}

.bloc-autres-references{
    margin-top: 48px;
    border-top: 1px solid var(--color_vert_armadiyo);
}
.bloc-autres-references h2{
    border: 0;
    padding-top: 0px;
    margin-top: 0px;
}
.bloc-autres-references .bloc-reference h2{
    margin-top: 10px;
}

/* ------------------------------- */

ul.classic{
    list-style: square;margin-left: 20px;
}
ul.classic li{
    margin:5px 0px;
}

.faq-question{
    cursor: pointer;
    margin: 20px 0px 0px 0px;
}
.faq-question-rotate svg{
    transform: rotate(90deg);
}
.faq-question svg{
    width: 18px;
    transition: all 0.3s ease-out;
}
.faq-reponse {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease-out;
    display: block; 
}

.underlined{
    text-decoration: underline;
}

.bloc-titre-h1{
    /*display: flex;*/
}
.bloc-titre-logo{
    color: var(--color_txt);
    font-size: 24px;
    text-align: left;
    margin-bottom: 30px;
    display: inline-block;
}
.bloc-titre-texte{
    position: relative;
}

/* ------------------------------- */
/* menu                             */
/* ------------------------------- */
.reseaux-sociaux{
    position: absolute;
    bottom: 15px;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    padding-right: 35px;
}
.reseaux-sociaux li{
    display: inline-block;
    float: left;
    width: auto !important;
    padding: 0px 20px;
    transition:all 0.3s;
    text-align: center;
}
.reseaux-sociaux li a:hover{
    opacity: 0.8;
}

.bigmenu{
    z-index: 450;
    background-color:rgba(255,255,255, 0.99);
    width: 100%;
    height: 100vh;
    position: fixed;
    top:0;
    left: 0;
    text-align: center;
    /*display: none;*/

    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease-in-out;
}
.bigmenu.is-visible {
    opacity: 1;
    visibility: visible;
}
.bigmenu ul{
    list-style: none;
    margin-left: 0;
}

.bigmenu ul.lvl1{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}
.bigmenu ul li{
    width: 100%;
    text-align: center;
}
.bigmenu ul li a,
.bigmenu ul li button{
    font-size: 45px;
    font-weight: 300;
    line-height: 1.5em;
    color: var(--color_txt);
    transition:all 0.3s;
    text-decoration: none;
    background-color: transparent;
    border: 0;
    cursor: pointer;
}
.bigmenu button:hover,
.bigmenu a:hover{
    color: #666;
}

.bigmenu ul.lvl2 {
    max-height: 0;
    overflow: hidden;
    display: block; 
    transition: max-height 0.4s ease-in-out;
    opacity: 0; 
    transition: max-height 0.4s ease-in-out, opacity 0.4s ease-in-out;
}
.bigmenu ul.lvl2.is-open {
    opacity: 1;
}
/*
.bigmenu ul.lvl2{
    display: none;
}
*/
.bigmenu ul.lvl2 li a{
    line-height: 1.3em;
}
.bigmenu ul.lvl2 li a{
    font-size: 30px;
    color: #444;
    transition:all 0.3s;
}
.bigmenu ul.lvl2 li a:hover{
    color: #666;
    padding-right: 10px;
}

.bigmenu sup{
    font-size: 15px;
    vertical-align: text-top;
    line-height: 100%;
    color: var(--color_vert_armadiyo);
}

.hamburger{
    position: fixed;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    padding: 0px 30px 0px 20px;
    background-color: #666;
    border-radius: 10px 0px 0px 10px;
     z-index: 500;
}

.feuille{
    position: fixed;
    right:calc(-65% + 60px);;
    width: 65%;
    top: 15%;
    z-index: 420;
    transition: 0.5s all; 
}
.feuille-active{
    right:0;
} 
.feuille .icon-feuille{
    float: left;
    margin-top: 10px;
    background-color:#666;
    padding: 10px;
    border-radius: 30px 0px 0px 30px;
}
.feuille .icon-feuille img{display: block;}
.texte-feuille{
    float: left;
    width: calc(100% - 60px);
    background-color:#555;
    padding:2% 11% 2% 5%;
    text-align: left;
    border-radius: 10px 0px 0px 10px;
}

.texte-feuille p{
    color: #fff;
    line-height: 1.3em;
    margin-bottom: 5px;
    font-size: 18px;
    text-align: justify;
}

.texte-feuille a{
    color: #fff;
    text-decoration: underline;
}

.texte-feuille i, .texte-feuille strong{
    color: #fff !important;
}

.entete-pageint{
    width: 90%;
    margin-bottom:40px;
    display:inline-block;
}

.entete-pageint .coltitre{
   width:30%;
   height:100%;
   float:left;
   text-align: left;
}

.entete-pageint .coltitre span{
    color:#797676;
}
.entete-pageint .coltitre h1{
    line-height: 0.9;
    margin-bottom:0;
    margin-top: 15px;
} 
.entete-pageint .coltitre h1 div{
    color: var(--color_vert_armadiyo);
}

.entete-pageint .coltext{
    width:70%;
    float:right;
    text-align: left;
    padding:0px 20px;
    border-left: 1px solid #797676;
} 

.entete-pageint p{
   margin:0 0 10px 0;
}
.entete-pageint p a:hover{
    text-decoration: underline;
}

/* ------------------------------- */
/* Header Footer */
/* ------------------------------- */
 header{
     margin: 0 auto;
     z-index: 40;
}
 footer{
    position: relative;
    width: 100%;
    max-width:1400px;
    margin: 35px auto 20px;
    padding: 10px 0 0;
    text-align: left;
}

.logo{
    position: fixed;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    padding: 12px 20px 12px 30px;
    background-color: #666;
    border-radius: 0px 10px 10px 0px;
    z-index: 500;
}
.logo span{
    font-size: 26px;
    font-weight: 300;
    color: #fff;
} 
.cache-blanc{
    width:100%;height:100px;position: fixed;top: 0; left: 0;z-index: 999;background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 50%, rgba(255,255,255,0) 100%);background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(255,255,255,1) 50%,rgba(255,255,255,0) 100%);background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(255,255,255,1) 50%,rgba(255,255,255,0) 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=0 );
}


*{box-sizing: border-box}

/* ------------------------------- */
/* Hamburger */
/* ------------------------------- */
#grid+label{
    margin: 2rem auto;
    width: 30px;
    display: grid;
    grid-template-rows: repeat(3,4px);
    row-gap: .3rem;
    cursor: pointer;
}
#grid{
    display: none;
}    
#grid+label span{
    background-color: #fff;
    border-radius: 20px;
}
  
#grid:checked+label span{
    grid-area: 2/1;
}
#grid:checked+label span:nth-child(2){
    opacity: 0;
}
#grid:checked+label span:first-of-type{
    transform:rotate(45deg)
}    
#grid:checked+label span:last-of-type{
    transform:rotate(-45deg);
}   

.fadein{
    opacity: 0;
}

/* ------------------------------- */
/* Index */
/* ------------------------------- */
.entete{
    width: 80%;
    text-align: left;
    margin: 0px 0px 40px 0px;
}  


.actu-news{
    width: 90%;
    margin: 0 auto 50px auto;
}
.actu-news .col1{
    width: 30%;
    padding: 0px 30px 0px 0px;
    text-align: left;
}
.actu-news .legende{
    color:#797676;
    line-height: 1.2em;
    font-size: 16px;
}
.actu-news h3{
    color: var(--color_txt);
    font-size: 30px;
    margin-bottom: 20px;
    line-height: 1em;
    padding-bottom: 16px;
}
.actu-news a{
    text-decoration: underline;
    margin-top: 20px;
}
.actu-news .col2{
    width: 70%;
    margin: 0px;
}
.actu-news .col2 img{
    width: 100%;
    max-width: 880px;
}

.actu-news ul{
    list-style: none;
    margin: 20px 0px 0px 0px;
    padding: 0;
    display: block;
}
.actu-news li{
    float: left;
    width: 20%;
    padding-right: 10px;
    margin: 0px 0px 0px 0px;
    display: inline-block;
}
.actu-news li a{
    transition: all 0.3s;
}
.actu-news li:hover > a{
    opacity: 0.5;
}
.actu-news li img{
    margin-bottom: 10px;
    width: 100%;
    max-width: 245px;
}


/* ------------------------------- */
/* page intérieur                  */
/* ------------------------------- */
.page-int{
    width: 90%;
    margin: 0 auto 50px auto;
}
.page-int .col1{
    width: 30%;
    padding: 0px;
    text-align: left;
}
.page-int h2{
    color: var(--color_vert_armadiyo);
    font-size: 30px;
    line-height: 1em;
}
.page-int h2 strong{
    color: var(--color_vert_armadiyo);
}
.page-int h3{
    color: var(--color_txt);
    font-weight: bold;
    font-size: 22px;
    line-height: 1em;
    margin-top: 20px;
    margin-bottom: 10px;
    padding-bottom: 0px;
}
.page-int h4{
    color: #000;
    font-size: 20px;
    line-height: 1em;
    margin-top: 15px;
    margin-bottom: 5px;
}
.page-int p{
    font-size: 18px;
    line-height: 1.4em;
    margin-bottom: 5px;
}
.page-int a{
    text-decoration: underline;
}
.page-int .col2{
    width: 70%;
    margin: 0px;
    padding: 0px 20px 0px 0px;
}
.page-int .col2 img{
    width: 100%;
    max-width: 880px;
}

.page-int ul{
    margin: 20px 0px 0px 0px;
    padding: 0;
    display: block;
}
.page-int li{
    float: left;
    width: 20%;
    padding-right: 10px;
    margin: 0px 0px 0px 0px;
}
.page-int li a{
    transition: all 0.3s;
}
.page-int li:hover > a{
    opacity: 0.5;
}
.page-int li img{
    margin-bottom: 10px;
    width: 100%;
    max-width: 245px;
}
.bloc-page-int{
    margin-bottom: 30px;
}

/* ------------------------------- */
/* contact */
/* ------------------------------- */
.page-contact label{
    font-size: 20px;
    margin-bottom: 10px;
    display: inline-block;
}
.page-contact h3{
    color: var(--color_txt);
    font-size: 32px;
    margin-bottom: 0px;
    line-height: 1em;
    padding-bottom: 6px;
}
.page-contact input[type='text'],
.page-contact input[type='email'],
.page-contact textarea{
    font-size: 20px;
    width: 100%;
    padding: 10px;
    border: 1px solid #ccc;
}
.page-contact a{
    text-decoration: underline;
}

/* ------------------------------- */
/* agence */
/* ------------------------------- */

.equipe{
    margin: 0px auto 70px auto;
}
.equipe div img{
    width: 100%;
    max-width: 307px;
}
.page-agence p{
    margin-bottom: 5px;
}
.col25{
    width: 25%;
    margin:0px 25px 0px 25px;
    text-align: left;
}
.col25 p{
    font-size: 18px;
    line-height: 1.4em;
}
.col20{
    width: 20%;
    margin:0;
    text-align: left;
}
.col50{
    width: 50%;
}
.col33{
    width: 33%;
    text-align: left;
}
.col66{
    width: 66%;
}
.col25 p{
    font-size: 18px;
}
.metiers{
    width: 90%;
    margin : 40px auto 0 auto;
}
.page-agence h3{
    color: var(--color_txt);
   font-size: 28px;
   line-height: 1em;
   padding-bottom: 10px;
   margin-bottom: 0px;
   margin-top: 35px;
}

.metiers p{
    font-size: 18px;
    line-height: 1.7em;
}

/* ------------------------------- */
/* savoir-faire */
/* ------------------------------- */
.etape{
    margin-bottom: 60px;
}
.etape div{
    vertical-align: top;
}
.etape h3{
    color: var(--color_vert_armadiyo);
    margin-bottom: 0px;
}
.etape h3 span{
    color: var(--color_txt);
}
.etape p{
    background-color: #f1f1f1;
    padding: 15px;
}
.page-savoirfaire .coltext p{
    margin-bottom: 10px;
}
/* ------------------------------- */
/* realisations */
/* ------------------------------- */

.plus-real{
        width: 90%;
    margin-bottom:10px;
    margin-top: 65px;
    display:inline-block;
}

.plus-real .coltitre{
   width:30%;
   height:100%;
   float:left;
   text-align: left;
}

.plus-real .coltitre span{
    color:#797676;
}
.plus-real .coltitre h3{
line-height: 0.9;
margin-bottom:0;
margin-top: 5px;
font-size: 40px;
color: var(--color_vert_armadiyo);
font-weight: 400;
} 

.plus-real .coltext{
    width:70%;
    float:right;
    text-align: left;
    padding:0px 20px;
    border-left: 1px solid #797676;
} 

.plus-real p{
   margin-bottom: 5px;
}
/* ------------------------------- */
 
.btn-actu{
    font-size: 20px;
    line-height: 1.3em;
    font-weight: 300;
    display: inline-block;
    background-color: var(--color_vert_armadiyo);
    margin-top: 10px;
    border-radius: 5px;
    padding: 10px 25px;
    color: #fff;
    cursor: pointer;
    text-align: center;
    position: relative;
    border:0;
    text-decoration: none !important;
    transition: all 0.5s;
    
}
 .btn-actu:hover{
     background-color: #666 ;
     color: #fff;
}

.bloc-h1-fixe{
    position:fixed;
    max-width: 350px;
}


/* Paragraphes CMS */
/* ------------------------------- */
.bloc-intro{
    margin: 0px auto 20px auto !important;
}

.bloc-color_vert_armadiyo div.grid-container{background-color: var(--color_vert_armadiyo); padding: 24px 24px 14px 24px !important;margin-bottom: 30px;}
.bloc-color_vert_armadiyo p,
.bloc-color_vert_armadiyo span,
.bloc-color_vert_armadiyo a,
.bloc-color_vert_armadiyo strong,
.bloc-color_vert_armadiyo h2,
.bloc-color_vert_armadiyo h3,
.bloc-color_vert_armadiyo h4,
.bloc-color_vert_armadiyo ul li{
    color: white;
}
.bloc-color_vert_armadiyo h2,
.bloc-color_vert_armadiyo h3,
.bloc-color_vert_armadiyo h4{
    margin-top: 0px;
    margin-bottom: 10px;
}
.bloc-color_vert_armadiyo li{
    margin-bottom: 3px;
}
.bloc-color_vert_armadiyo .btn-white{
    color: var(--color_txt);
}
.bloc-color_vert_armadiyo .btn-white:hover{
    color: white;
}

.bloc-color_ecoconception div.grid-container{background-color: var(--color_ecoconception); padding: 24px !important;margin-bottom: 30px;}
.bloc-color_ecoconception p,
.bloc-color_ecoconception span,
.bloc-color_ecoconception a,
.bloc-color_ecoconception strong,
.bloc-color_ecoconception h2,
.bloc-color_ecoconception h3,
.bloc-color_ecoconception h4,
.bloc-color_ecoconception ul li{
    color: white;
}
.bloc-color_ecoconception h2,
.bloc-color_ecoconception h3,
.bloc-color_ecoconception h4{
    margin-top: 0px;
    margin-bottom: 10px;
}
.bloc-color_ecoconception li{
    margin-bottom: 3px;
}
.bloc-color_ecoconception .btn-white{
    color: var(--color_txt);
}
.bloc-color_ecoconception .btn-white:hover{
    color: white;
}

.bloc-color_seo_geo div.grid-container{background-color: var(--color_seo_geo); padding: 24px !important;margin-bottom: 30px;}
.bloc-color_seo_geo p,
.bloc-color_seo_geo span,
.bloc-color_seo_geo a,
.bloc-color_seo_geo strong,
.bloc-color_seo_geo h2,
.bloc-color_seo_geo h3,
.bloc-color_seo_geo h4,
.bloc-color_seo_geo ul li{
    color: white;
}
.bloc-color_seo_geo h2,
.bloc-color_seo_geo h3,
.bloc-color_seo_geo h4{
    margin-top: 0px;
    margin-bottom: 10px;
}
.bloc-color_seo_geo li{
    margin-bottom: 3px;
}
.bloc-color_seo_geo .btn-white{
    color: var(--color_txt);
}
.bloc-color_seo_geo .btn-white:hover{
    color: white;
}

.bloc-color_outils_numeriques div.grid-container{background-color: var(--color_outils_numeriques); padding: 24px !important;margin-bottom: 30px;}
.bloc-color_outils_numeriques p,
.bloc-color_outils_numeriques span,
.bloc-color_outils_numeriques a,
.bloc-color_outils_numeriques strong,
.bloc-color_outils_numeriques h2,
.bloc-color_outils_numeriques h3,
.bloc-color_outils_numeriques h4,
.bloc-color_outils_numeriques ul li{
    color: white;
}
.bloc-color_outils_numeriques h2,
.bloc-color_outils_numeriques h3,
.bloc-color_outils_numeriques h4{
    margin-top: 0px;
    margin-bottom: 10px;
}
.bloc-color_outils_numeriques li{
    margin-bottom: 3px;
}
.bloc-color_outils_numeriques .btn-white{
    color: var(--color_txt);
}
.bloc-color_outils_numeriques .btn-white:hover{
    color: white;
}


.bloc-paragraphe{
    position: relative;
}
.bloc-paragraphe .bloc-paragraphe-actions{
    height: 40px;
    padding: 10px;
    background-color: #ededed;
}
.bloc-paragraphe .bloc-paragraphe-actions div{
    line-height: 20px;
}
.bloc-paragraphe-fullwidth{
    display: inline-block;
    cursor: pointer;
    width:18px;
    height:18px;
    line-height: 20px;
    margin-left: 20px !important;
    border: 1px dashed transparent;
    vertical-align: middle;
}
.bloc-paragraphe-fullwidth a{
    display: block;
    width:18px;
    height:18px;
    line-height: 16px;
    vertical-align: top;
}
.bloc-paragraphe-fullwidth a i{
    width:16px;
    height:16px;
}
.bloc-paragraphe-fullwidth-active{
    border: 1px dashed #000;
}
.bloc-paragraphe-mover{
    display: inline-block;
    cursor: pointer;
}
.bloc-paragraphe-delete{
    display: inline-block;
    cursor: pointer;
    margin-left: 8px !important;
}
.bloc-paragraphe-bgcolor{
    display: inline-block;
    cursor: pointer;
    width:18px;
    height:18px;
    line-height: 18px;
    margin-left: 5px !important;
    border:1px solid white;
}
.bloc-paragraphe-bgcolor div{
    display: inline-block;
    width:16px;
    height:16px;
    border:1px solid white;
}
.bloc-paragraphe-bgcolor:hover{
    border:1px solid #ccc;
}
.bloc-paragraphe-bgcolor-transparent{
    border:1px solid #ccc;
}


/* Page des offres */
.geo-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top: 25px}
.geo-card{
    /*background:rgba(86,168,4,.5);*/
    display: flex;box-sizing: border-box;flex:1 1 calc(33.333%);flex-direction: column;align-items: flex-start;padding: 30px;text-align: left;
    border: 1px solid var(--color_seo_geo);
    border-radius: 3px;
    color: var(--color_txt);
    transition:background .2s,border-color .2s;
}
.geo-card:hover{
    background:rgba(86,168,4,.12);
}
.geo-card h3{
    margin-top: 14px;
}
.geo-card-icon{
    font-size: 28px;
}

/*
.geo-card:nth-child(1){
    background-color: var(--color_ecoconception);
    color: white;
}
.geo-card:nth-child(2){
    background-color: var(--color_seo_geo);
    color: white;
}
.geo-card:nth-child(3){
    background-color: var(--color_outils_numeriques);
    color: white;
}
.geo-card h3,.geo-card p{
    color: white;
}
*/
.prog-wrap{background:rgba(0,0,0,.1);border-radius:4px;height:3px;margin-bottom:8px;}
.prog-bar{height:3px;background:var(--color_vert_armadiyo);border-radius:4px;transition:width .4s ease;}
.prog-text{color:white;font-size:12px;margin-bottom:36px;}

.q-block{display:none;animation:fadeUp .35s ease;}
.q-block.active{display:block;}
@keyframes fadeUp{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:none;}}
.q-num{color:white;font-size:12px;font-weight:700;letter-spacing:2px;text-transform:uppercase;margin-bottom:8px;}
.q-text{color:white;font-size:20px;font-weight:500;margin-bottom:6px;line-height:1.4;}
.q-hint{color:rgba(255,255,255,.45);font-size:13px;margin-bottom:26px;}

.opts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:28px;}
.opt{font-size:16px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.07);color:white;padding:14px 16px;cursor:pointer;text-align:left;transition:all .2s;display:flex;align-items:center;gap:10px;}
.opt:hover{background:rgba(255,255,255,.15);border-color:rgba(255,255,255,.13);}
.opt.sel{background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.9);color:rgba(255,255,255,.9);}
.opt-ico{font-size:18px;flex-shrink:0;}

.btn-back{margin-right: 20px}
.res-block{display:none;animation:fadeUp .4s ease;}
.res-block.active{display:block;}
.res-card{background:white;border-radius:16px;padding:36px;margin-bottom:16px;}
.res-head{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:16px;flex-wrap:wrap;gap:14px;}
.res-badge{background:var(--color_vert_armadiyo);color:white;font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase;padding:5px 12px;display:inline-block;margin-bottom:8px;}
.res-name{font-size:32px;margin-bottom:4px;}
.res-target{color:var(--color_seo_geo);font-size:13px;font-weight:500;}
.res-price-area{text-align:right;}
.res-from{font-size:14px;color:var(--color_seo_geo);text-transform:uppercase;letter-spacing:1px;}
.res-price{font-size:30px;font-weight:700;}
.res-price span{font-size:14px;font-weight:400;color:var(--color_seo_geo)   ;}
.res-divider{height:1px;background:var(--color_seo_geo);margin:16px 0;}
.res-glabel{font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:1.5px;margin:14px 0 10px;}
.res-feats{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.res-feat{display:flex;align-items:flex-start;gap:8px;font-size:14px;line-height:1.5;}
.res-feat strong{color: var(--color_seo_geo) !important;}
/*
.res-feat.i::before{content:'◎';color:var(--color_vert_armadiyo);flex-shrink:0;}
.res-feat.r::before{content:'✓';color:var(--color_vert_armadiyo);font-weight:700;flex-shrink:0;}
*/
.res-btns{display:flex;gap:12px;margin-top:24px;flex-wrap:wrap;}
.btn-devis{background:var(--color_vert_armadiyo);color:white;padding:13px 26px;border-radius:10px;font-size:14px;font-weight:600;border:none;cursor:pointer;transition:all .2s;text-decoration:none;display:inline-block;}
.btn-devis:hover{background:var(--moss);transform:translateY(-1px);}
.btn-retry{background:transparent;color:var(--color_vert_armadiyo);padding:13px 26px;border-radius:10px;font-size:14px;font-weight:500;border:2px solid white;cursor:pointer;transition:all .2s;}
.btn-retry:hover{background:var(--sand);}
.res-note{background:rgba(255,255,255,.1);border-radius:3px;padding:14px 18px;font-size:14px;color:white;line-height:1.65;}

.legend{display:flex;gap:24px;margin-bottom:40px;flex-wrap:wrap;}
.legend-item{display:flex;align-items:center;gap:8px;font-size:14px;color:#ccc;}
.legend-sym{width:20px;text-align:center;font-size:14px;}
.legend-sym.i{color:var(--color_vert_armadiyo);}
.legend-sym.r{color:var(--sage);}

.offers-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0px;margin-top: 45px;border:0}

.card{background:white;padding:32px 26px;transition:transform .25s;position:relative;overflow:hidden;display:flex;flex-direction:column;}
.card.star{transform:translateY(-10px);}
.card:hover:not(.star){transform:translateY(-5px);}
.card:nth-child(1){background-color: var(--color_ecoconception);color: white;}
.card:nth-child(2){background-color: var(--color_seo_geo);color: white;}
.card:nth-child(3){background-color: var(--color_outils_numeriques);color: white;}

.pop-badge{position:absolute;top:16px;right:16px;background:var(--color_vert_armadiyo);color:white;font-size:12px;font-weight:700;padding:3px 10px;border-radius:20px;text-transform:uppercase;letter-spacing:1px;}
.card-icon{font-size:28px;margin-bottom:14px;}
.card-name{font-size:22px;color:white;margin-bottom:4px;}
.card-target{font-size:14px;color:#ccc;font-weight:400;text-transform:uppercase;letter-spacing:1px;margin-bottom:20px;}
.price-label{font-size:14px;color:#ccc;text-transform:uppercase;letter-spacing:1px;font-weight:600;margin-bottom:3px;}
.price-val{font-size:34px;font-weight:700;color:white;line-height:1;margin-bottom:20px;}
.price-val span{font-size:14px;font-weight:400;color:#ccc;}

.engage-badge{text-align:center;display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.1);color:white;font-size:14px;font-weight:600;padding:5px 12px;border-radius:3px;}
.engage-badge.gold{background:rgba(255,255,255,.1);border-color:white;color:white;}

.card-divider{height:1px;background:var(--sand);margin:4px 0 12px;}
.glabel{font-size:16px;text-transform:uppercase;letter-spacing:1.5px;margin:12px 0 12px 0;}
.glabel.i{color:white;}
.glabel.r{color:white;}
.feat-list{list-style:none;display:flex;flex-direction:column;gap:7px;margin-bottom:4px;}
.feat-list li{display:flex;align-items:flex-start;gap:8px;font-size:16px;line-height:1.5;color: #eee;margin-bottom: 2px !important;}
.il li::before{content:'◎';color:white;font-size:14px;flex-shrink:0;margin-top:2px;}
.rl li::before{content:'✓';color:white;font-weight:700;font-size:14px;flex-shrink:0;}
.il {margin-bottom: 10px;}
.card-cta{display:block;width:100%;padding:13px;text-align:center;border-radius:10px;font-weight:600;font-size:14px;cursor:pointer;transition:all .2s;text-decoration:none;border:2px solid;margin-top:auto;padding-top:13px;}

.custom-cta{background:var(--sand);padding:48px;text-align:center;border-top:1px solid rgba(28,61,46,.08);}
.custom-cta p{color:#ccc;font-size:16px;font-weight:300;margin-bottom:20px;max-width:520px;margin-left:auto;margin-right:auto;line-height:1.7;}
.custom-cta strong{color:var(--color_vert_armadiyo);}
.btn-custom{display:inline-block;background:transparent;color:var(--color_vert_armadiyo);padding:13px 32px;border-radius:var(--r);font-weight:600;font-size:14px;border:2px solid var(--color_vert_armadiyo);text-decoration:none;transition:all .2s;}
.btn-custom:hover{background:var(--color_vert_armadiyo);color:white;}

.cmp-bg{width: 90%}
.cmp-bg table{width:100%;border-collapse:collapse;overflow:hidden;}
.cmp-bg thead th{padding:10px 10px;text-align:left;font-size:22px;font-weight:500;border-bottom: 2px solid var(--color_seo_geo)}
.cmp-bg .tg td{padding:10px 10px;background:rgba(0,0,0,.1);font-size:14px;font-weight:500;text-transform:uppercase;letter-spacing:2px;}
.cmp-bg tbody td{padding:12px 10px;font-size:14px;border-bottom: 1px solid var(--color_seo_geo)}
.cmp-bg tbody tr:hover td{background:rgba(0,0,0,.1)}
.cmp-bg thead th:nth-child(1){width: 40%;}
.cmp-bg thead th:nth-child(2){width: 20%;}
.cmp-bg thead th:nth-child(3){width: 20%;}
.cmp-bg thead th:nth-child(4){width: 20%;}
.fcta{}
.fcta h2{color:var(--color_txt);margin-bottom:14px;}
.fcta p{}

/* Bloc avis clients homepage : à migrer dans global.css si besoin */
.bloc-avis-home .note-resume{
    display:flex;
    align-items:center;
    justify-content:flex-start;
    gap:12px;
    margin:0px 0;
    flex-wrap:wrap;
}
.bloc-avis-home .note-chiffre{
    font-size:32px;
    font-weight:700;
    color:#56A804;
}
.bloc-avis-home .etoiles{
    color:#56A804;
    font-size:20px;
    letter-spacing:2px;
}
.bloc-avis-home .nb-avis{
    color:#333333;
    font-size:15px;
}
.bloc-content-bg h2 strong{
    color: #fff;
}

/* Styles spécifiques à la page avis-clients : à migrer dans global.css si besoin */
.bloc-note-globale{
    text-align:center;
    padding:0px 20px;
}
.bloc-note-globale .note-chiffre{
    font-size:56px;
    font-weight:700;
    color:#56A804;
    line-height:1;
}
.bloc-note-globale .etoiles{
    color:#56A804;
    font-size:28px;
    letter-spacing:2px;
    margin:10px 0;
}
.bloc-note-globale .nb-avis{
    color:#333333;
    font-size:16px;
}
.grid-avis{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:24px;
    margin:30px 0;
}
@media (max-width:768px){
    .grid-avis{grid-template-columns:1fr;}
}
.carte-avis{
    background:#ffffff;
    border:1px solid #e5e5e5;
    border-radius:8px;
    padding:24px;
    display:flex;
    flex-direction:column;
    gap:10px;
}
.carte-avis .etoiles{
    color:#56A804;
    font-size:16px;
    letter-spacing:2px;
}
.carte-avis .texte-avis{
    color:#333333;
    font-size:15px;
    line-height:1.5;
    flex-grow:1;
}
.carte-avis .auteur-avis{
    display:flex;
    justify-content:space-between;
    align-items:baseline;
    border-top:1px solid #f0f0f0;
    padding-top:10px;
    margin-top:auto;
}
.carte-avis .auteur-nom{
    font-weight:700;
    color:#333333;
    font-size:14px;
}
.carte-avis .auteur-date{
    color:#888888;
    font-size:13px;
}
.bloc-cta-avis{
    text-align:center;
    margin:40px 0;
}
.bloc-cta-avis .btn{
    margin:0 8px 12px 8px;
}

@media (max-width: 900px) {
    .bloc-reference{
        width: 100%;
    }
    .padl15{
        padding-left: 0;
    }
    .padr15{
        padding-right: 0;
    }
    .hideOnSmall,
    .cache-blanc{
        display: none;
    }
    .container{
        /*margin-top: 230px;*/
        padding: 20px;
    }
    .barre-verticale{
        height: 80px;
    }
    .bloc-content{
        width: 100%;
    }
    .bloc-content-bg{
        padding: 20px;
    }
    .bloc-content-bg-col{
        float: none;
        width: 100%;
        padding-right: 0px !important;
        margin-bottom: 40px;
    }
    .page-accueil h1{
        margin-left: 0px;
    }
    .page-accueil .bloc-3axes{
        flex: 1 1 100%;
        padding: 30px;
        min-height: unset;
        text-align: left;
    }
    .page-accueil .actu ul li{
        float: none;
        width: 100%;
        text-align: left;
        margin-bottom: 40px;
    }
    .bloc-content-bg-col{
        flex: 1 1 100%;
    }
    footer{
        width: 90%;
    }
    .entete{
        width: 90%;
        text-align: left;
    }
    h1,h2{
        line-height: 1em;
    }
    .logo{
        top: 40px;
        transform: none;
    }
    .hamburger{
        top: 50px;
        transform: none;
    }
    .feuille{
        display: none;
    }
    .page-accueil .texte-feuille p{
        font-size: 16px !important;
        line-height: 18px !important;
    }

    .page-accueil .feuille{
        display: inline-block;
        top: 25%;
        width: 95%;
        right: calc(-95% + 60px);
    }
    .page-accueil .feuille-active{
        right: 0 !important;
    }
    .actu-news{
        text-align: left;
    }
    .actu-news .col1,
    .actu-news .col2{
        width: 100% !important;
        padding:0 0 40px 0;
        float: none;
    }
    .entete-pageint .coltitre,
    .entete-pageint .coltext,
    .plus-real .coltitre,
    .plus-real .coltext{
        width: 100%;
        padding-bottom: 20px;
    }
    .plus-real .coltitre h3{
        padding-bottom: 0px;
    }

    .actu-news li{
        width: 100%;
        padding-right: 0;
        text-align: center;
        padding-bottom: 40px;
        max-width: 100%;
    }
    .bigmenu ul{
        width: 100%;
    }
    .bigmenu ul li a{
        font-size: 30px;
    }
    .bigmenu ul.lvl2 li a{
        font-size: 22px;
    }

    .reseaux-sociaux{
        padding-right: 0px;
    }
    .reseaux-sociaux li{
        width: 33% !important;
        text-align: center;
    }

    .equipe,.metiers{
        width: 90%;
    }
    .equipe .col20,
    .equipe .col25,
    .equipe .col33,
    .equipe .col66{
        width: 100%;
        float: none;
        margin: 0px;
        text-align: left;
    }
    .metiers .col33{
        width: 100%;
        float: none;
        margin: 0px;
        text-align: left;
    }
    
    .metiers p{
        line-height: 1.2em;
    }

    .process{
        width: 90% !important;
    }
    .equipe .col50,
    .etape .col50{
        width: 100%;
        float: none;
        text-align: left;
        padding: 0;
    }

    .btn-actu{
        width: 100%;
        padding: 10px 0px;
    }
    .col_form,.col_adresses{
        width: 100% !important;
        float: none !important;
    }
    .col_adresses{
        text-align: center !important;
        margin-top: 40px;
    }
    .entete-pageint .coltitre,
    .entete-pageint .coltext{
        width: 100% !important;
        float: none;
    }
    .page-int .col1,
    .page-int .col2{
        width: 100% !important;
        padding:0 0 0 0 !important;
        float: none;
    }

    .opts,.res-feats{grid-template-columns:1fr;}
    .res-head{flex-direction:column;}
    .res-price-area{text-align:left;}
    .offers-grid,.geo-cards{grid-template-columns:1fr;}
    .card.star{transform:none;}

}

/* ------------------------------- */
@media (min-width: 1200px) {
    .container{
        width: 90%;
    }
}



@media (max-width: 1200px) {
    .actu-news .col1{
        width: 50%;
    }
    .actu-news .col2{
        width: 50%;
    }
    .page-int .col1{
        width: 50%;
    }
    .page-int .col2{
        width: 50%;
    }
    .metadata-reference,
    .extrait-actu{
        display: none;
    }
}

@media (max-width: 1400px) {
    .bloc-h1-fixe{
        position:relative;
        max-width: unset;
    }
    .actu-news .col1{
        width: 45%;
    }
    .actu-news .col2{
        width: 55%;
    }
    .entete-pageint .coltitre,
    .page-int .col1{
        width: 45%;
    }
    .entete-pageint .coltext,
    .page-int .col2{
        width: 55%;
    }
    .hideOn1400px{
        display: none;
    }
    .onlyForLess1400px{
        display: inline-block;
    }
}

/* ------------------------------- */
 @media (min-width: 1600px) {
    .container{
        width: 90%;
    }
}
