/*--------- [THEME WAKA PAR AGENCE WAKA Copyright 2020-2023 https://agence-waka.fr/] ---------*/
:root {
    --couleur_01 : #000;
    --couleur_02 : #D19659;
    --wysiwyg-margin-elts: 2.1rem;
    --gap-grid: 1.22%;
}



/*--------- [ STYLAGE DE BASE : boutons, wysiwyg, blocs, modules... ] ---------*/







/*--------- [ STYLAGE DES PAGES ] ---------*/

#moove_gdpr_cookie_info_bar .moove-gdpr-cookie-notice button.change-settings-button { color:#fff !important;}
#moove_gdpr_cookie_info_bar .moove-gdpr-info-bar-container .moove-gdpr-info-bar-content a.mgbutton, #moove_gdpr_cookie_info_bar .moove-gdpr-info-bar-container .moove-gdpr-info-bar-content button.mgbutton { background: var(--couleur_02) !important;}
/***** HOME ******/
#main_slider { position:relative;  }
#main_slider li {   height:100vh; background-size:cover; background-position:center center;}
#main_slider .row { height: 100vh; align-items: flex-end; justify-content: flex-end}
#main_slider  .bx-controls {  max-width: 1720px;    margin: 0 auto; padding: 0 40px; position: relative }
#main_slider .bx-pager { position:absolute; bottom:45px; left:140px;   z-index:55;}
#main_slider .infos { text-align: right; padding: 0 100px 15px 100px; color:#fff; display: block }
#main_slider .infos:hover { color:var(--couleur_02)}
.bx-pager .bx-pager-item { display:inline-block; margin:0 10px;}
.bx-pager .bx-pager-item a {  width: 20px; height: 20px; border-radius: 20px; background: #fff; display: block; text-indent: -9999px;}
.bx-pager .bx-pager-item a.active {  background: var(--couleur_02)}

@media all and (max-width:989px) {
    #main_slider .infos {  text-align: center; padding: 0 0px 100px 0; line-height: 1.1 }
}


/***** PROJETS ******/
.projets { display: flex}
.projets .col-cat { flex:0 0 396px; padding-right: 20px; font-size: 2rem; background: #fff}
.projets .cat { position: sticky; top:165px}
.projets .cat a:hover, .projets .cat a.active { color:var(--couleur_02)}
.projets .cat > div { border-top:1px solid #ccc; padding: 5px 0 20px }
.projets .cat .titre {  font-weight: bold}
.projets .cprojets { flex:1; }
.list_projets { margin:-15px -10px}
.list_projets .gift-item { width: 33.33%; padding: 15px 10px}
.list_projets .h3 { padding-top: 5px; transition: all 0.3s ease;}
.list_projets .visuel { width: 100%; height: 452px; overflow: hidden; position: relative; margin-bottom: 5px}
.list_projets  .visuel > div{ background-size: cover; background-position: center; width: 100%; height: 100%; transition: all 0.3s ease;}
.list_projets .picto { transition: all 0.3s ease; opacity: 0; width: 100px; height: 100px; background: var(--couleur_02); position: absolute; top:50%; margin-top: -50px; left:50%; margin-left: -50px; border-radius: 100px; display: flex; align-items: center; justify-content: center }
.list_projets .picto img { width: 45px;}
.list_projets a:hover .visuel > div { transform: scale(1.1)}
.list_projets a:hover .picto { opacity: 1}
.list_projets a:hover .infos { color:var(--couleur_02)}
.list_projets a:hover .h3 { color:var(--couleur_02)}
#photo_slider .bx-wrapper { position: relative; line-height: 0}
#photo_slider  .bx-pager  { position: absolute; bottom: 90px; left:25px;   z-index:55;}
#photo_slider .infos { text-align: right; padding-top: 10px; color:#758A83; line-height: 1.3; min-height: 70px}
#pdetails h1 { text-transform: uppercase; padding-bottom: 1.5rem}
#pdetails .lieu { padding-bottom: 3rem; color:#758A83}
#pdetails .tags { display: flex; gap:10px 20px; flex-wrap: wrap; padding-bottom: 3rem}
#pdetails .tags span { background: var(--couleur_02); color:#fff; white-space: nowrap; display: block; padding: 5px 10px 4px; font-size: 14px; font-weight: bold; text-transform: uppercase}
#pdetails .tags a:hover { background: var(--couleur_01)}
#pdetails .cta { display: flex; gap:0 20px; flex-wrap: wrap}
#pdetails .cta a:hover { color: var(--couleur_02) }
#pdetails  .share_hover { flex:0 0 100%; display: none}
.infos_plus { display: flex; margin:-15px -10px; padding-bottom: 1.5rem}
.infos_plus > div { flex:0 0 50%; padding: 15px 10px}
.infos_plus .repeat > div { border-top:1px solid #ccc; padding: 5px 0 10px }
.infos_plus .repeat .titre { font-weight: bold; padding-bottom:3px; color:#000}
.boutons_fixed { position: fixed; right: 50px; bottom: 10px  }
.boutons_fixed a { color:var(--couleur_02)}
.boutons_fixed a:hover { color:#fff; }
.boutons_fixed a g { transition: all 0.3s ease;}
.boutons_fixed a:hover g { fill: var(--couleur_02); }

.button_mobile { position: fixed; left:0; right: 0; bottom:0; display: none;z-index: 100 }
.button_mobile a {background: var(--couleur_02); color:#fff; height: 60px;  padding: 6px 10px;  font-family: 'pill-gothic-300mg'; font-size: 20px; display: flex; justify-content: center; align-items: center  }
.button_mobile a:hover { color:#fff;}
.button_mobile a span { line-height: 0.7; margin-left: 14px }
.button_mobile a.open  svg circle  { fill:var(--couleur_02);  }
.button_mobile a.open  svg path,   .button_mobile a.open svg line   { stroke: #fff  }
.button_mobile a.open svg { transform: rotate(45deg);}


@media all and (max-width:1440px) {    .list_projets .visuel { height: 342px}}
@media all and (max-width:1366px) {    .list_projets .visuel { height: 292px}}

@media all and (max-width:1024px) {
    .projets .col-cat { flex: 0 0 280px; }
    .list_projets .visuel { height: 232px;}
}

@media all and (max-width:989px) {
    .projets { display: block }
    #photo_slider .bx-pager, #main_slider .bx-pager { right: 25px; text-align: center;  left:25px;    }
    .bx-pager .bx-pager-item { margin: 0 5px}
    .bx-pager .bx-pager-item a { width: 12px; height: 12px; border-radius: 12px}
    #pdetails #photo_slider { padding-bottom: 10px}
    .infos_plus { flex-direction: column}
    .infos_plus .repeat { order:2}
    #pdetails .cta { gap:0 10px;}
    #pdetails .cta > div > a svg { height: 35px}
    .button_mobile { display: block}
    .projets .col-cat { position:fixed; left:0; right: 0; bottom:60px; z-index: 100; padding: 10px 25px; border-top: 1px solid #ccc; display: none}
    .projets .cat > div:first-child { border: 0}

}
@media all and (max-width:700px) {
    .list_projets .gift-item { width: 50%}


}

@media all and (max-width:500px) {
    .list_projets .gift-item { width: 100%}
    .list_projets .visuel { height: 382px}
}





    /***** AGENCE ******/
#equipe {  padding-top: 100px; padding-bottom: 100px}
.team { display: flex;  margin: 0 -10px; }
.team > div { flex:1; transition: all 0.3s ease; padding: 0 10px;  }
.team > div.open { flex:0 0 50% }
.team .titre, .actus .titre, .lien_contact a  { display: flex; cursor: pointer; align-items: center  }
.team .titre .picto, .actus .titre .picto,  .lien_contact  .picto { flex:0 0 23px; height: 23px; border-radius: 23px; background: var(--couleur_02); display: flex; align-items: center; justify-content: center; margin-right: 10px}
.team .titre .picto img, .actus .titre .picto img, .lien_contact .picto img { width: 13px; transition: all 0.3s ease;}
.team .titre .label { flex:1; font-size: 2rem; transition: padding 0.3s ease;}
.membre { margin-bottom: 2rem; overflow: hidden}
.membre .cache, .actus .cache { opacity: 0; max-height: 0; }
.membre .desc { display: flex; padding: 20px 0}
.membre .desc .visuel { flex:0 0 30%; padding: 0 20px 0 40px; opacity: 0; transition:all 0.5s ease; position: relative; left:-40px}
.membre .desc .visuel img { max-width: 246px; width: 100%}
.membre .fonction { padding-bottom: 2rem; color:var(--couleur_02)}
.membre .wysiwyg { opacity: 0; visibility: hidden; transition:all 0.5s ease; transition-delay:0; position: relative; top:20px;}
.membre.actif  .titre, .actu.actif .titre { background: var(--couleur_02); color:#fff; }
.membre.actif .cache, .actu.actif .cache { opacity: 1; max-height: inherit}
.membre.actif .titre .picto img, .actu.actif .titre .picto img, .lien_contact a.actif .picto img  { transform: rotate(45deg)}
.membre.actif .wysiwyg { opacity: 1; visibility: visible; transition-delay:0.3s; top:0; }
.membre.actif .desc .visuel  { opacity: 1; left:0}
.membre.actif .titre .label { padding-left: 212px }
.actus .desc { display: flex;  padding: 20px 0; gap: 1.22%;}
.actus .desc > div { flex:1}
.actus .desc > div.visuel { flex:0 0 50%}
.actu { margin-bottom: 2rem; overflow: hidden}
.actus .cache { transition: all 0.3s ease;}
@media all and (max-width:1300px) {
    .membre .desc { display: block }
    .membre.actif  .visuel { padding-left: 0; padding-bottom: 10px}
    .membre .desc .visuel img {  max-width: 176px}
    .team .titre .label { padding-left: 0 !important;}
}
@media all and (max-width:989px) {
    #bloc-agence .col-6:nth-child(1) { order:2}
    #equipe { padding-top: 50px; padding-bottom: 50px;}
    .team { flex-wrap: wrap}
    .team > div, .team > div.open { flex:0 0 100%}
    .actus .desc { display: block}
    .actus .desc > div.visuel { padding-bottom: 10px; text-align: center}
}


/***** CONTACT ******/
.lien_contact {  padding-top: 25px  }
#form_contact { padding: 10px 0 0 33px; display: none}
#form_contact > div { display: flex;gap:20px }
#form_contact > div > div { flex:1 }
#form_contact .sub { text-align: center; display: block}
#form_contact  .h3 { color:var(--couleur_02) !important; background: none; transition:all 0.2s ease;}
#form_contact  .h3:hover { color:var(--couleur_01) !important;}
#form_contact.actif { display: block}
.list_agence { display: flex; flex-wrap:wrap; gap:50px 20px; padding-top: 100px}
.list_agence > div { flex:0 0 50%;}
@media all and (max-width:989px) {
    #bloc_contact .col-6:nth-child(1) {        order: 2    }
}
@media all and (max-width:767px) {
    #form_contact > div { display: block }
}



















    /*--------- [ STYLAGE DE BASE ] ---------*/

/* Texte + Wysiwyg */
a {  color:var(--couleur_01);}
a:hover { color:var(--couleur_01); }
h1 { color:#002C22; }
h1, h2, h3, h4, h5, .h1, .h2, .h3  { font-weight: normal; font-family: pill-gothic-300mg; }
h1, h2, .h1, .h2 {     font-size: 3.5rem;    line-height: 3.6rem; padding-bottom: 5.5rem }
h3, .h3 { font-size: 2rem; line-height: 2.4rem}
h4 { font-size:1.7rem; line-height:2.2rem; margin-bottom:1rem;}
h5 { font-size:1.5rem; line-height:1.5rem; margin-bottom:0.8rem; }
.wysiwyg { overflow-wrap: break-word;  }
.wysiwyg a { text-decoration: underline; color:var(--couleur_02)}
.wysiwyg ul li { list-style: disc}
.wysiwyg ol li {list-style-type:decimal}
.wysiwyg hr {   clear: both;}
.wysiwyg img { display: block; max-width: 100%; height: auto}
.wysiwyg figcaption { padding-top:0.5rem; font-style: italic}
.wysiwyg blockquote{ font-style: italic  }
.aligncenter, div.aligncenter, a img.aligncenter{    display: block;    margin-left:auto; margin-right: auto}
.alignright, a img.alignright, .wp-caption.alignright   {    float:right;    }
.alignleft, a img.alignleft, .wp-caption.alignleft {    float: left;    }
.wysiwyg p, .wysiwyg ul, .wysiwyg ol   {  margin-bottom:var(--wysiwyg-margin-elts);}
.wysiwyg p:last-child { margin-bottom: 0}
.wysiwyg ul, .wysiwyg ol  {  margin-left:var(--wysiwyg-margin-elts);}
.alignright, a img.alignright, .wp-caption.alignright { margin-left:calc(var(--wysiwyg-margin-elts) + 0.5rem);}
.alignleft, a img.alignleft, .wp-caption.alignleft {    margin-right:calc(var(--wysiwyg-margin-elts) + 0.5rem);}
img { max-width: 100%}
.txt_center { text-align: center}
@media all and (max-width:989px) {
    h1, h2, .h1, .h2 { font-size: 3rem; line-height: 3.2rem; padding-bottom: 4.5rem}
}


/* Formulaires */
label, input[type=submit], button { cursor:pointer; -webkit-appearance:none; }
input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="submit"]), textarea, select  { vertical-align:middle;  background:#fff;  border:1px solid #ccc; width: 100%; padding:0.5rem 0.8rem; margin-bottom: 1rem; }
input[type="file"] { border:0 !important;}
textarea {  resize:none;}
inpuT[type="checkbox"], input[type="radio"] { margin-right: 0.6rem; position: relative; top:2px;}
textarea {  resize:none; height: 140px}
::placeholder { color:#928f8f; transition: all 0.3s ease;}
:focus::placeholder {  opacity:0.2; }
@media all and (max-width:767px) {
    .alignright, a img.alignright, .wp-caption.alignright, .alignleft, a img.alignleft, .wp-caption.alignleft {        float: none;        margin: 0 auto 2rem;        display: block    }

}
/*--------- [ LAYOUT ] ---------*/
#wrapper { padding-top: 200px}
.home #wrapper { padding-top: 0}
.row, .list-grid {     display: grid;    grid-template-columns: repeat(12, minmax(0, 1fr));    column-gap: var(--gap-grid);    row-gap: var(--gap-grid);    width: 100%;    max-width: 1720px;    margin: 0 auto;    padding: 0 40px; }
.list-grid { padding:0; max-width:100%; }
.row [class^="col"] { min-width: 1px}
.col-1  { grid-column: span 1; }
.col-2  { grid-column: span 2; }
.col-3  { grid-column: span 3; }
.col-4  { grid-column: span 4; }
.col-5  { grid-column: span 5; }
.col-6  { grid-column: span 6; }
.col-7  { grid-column: span 7; }
.col-8  { grid-column: span 8; }
.col-9  { grid-column: span 9; }
.col-10 { grid-column: span 10; }
.col-11 { grid-column: span 11; }
.col-12 { grid-column: span 12; }
#main {  min-height:90vh; padding-bottom: 15rem}
body, input, textarea,  button { font-family:din-2014, Arial, Verdana, sans-serif; font-size:1.5rem; line-height: 1.4; color: var(--couleur_01) !important;   }
body { opacity: 0.5; transition: opacity 0.3s ease;}
body.open { opacity: 1}
.hide-mobile { display: block;}
.hide-desktop { display: none;}

    /* Header */
#header { position: relative;  z-index: 9980; padding-top: 0.1px }
#header .hsocial { display: none}
.hlogo svg { max-width: 100%; width: auto;  height: 78px; transition: all 0.3s ease;}
.hlogo a:hover svg { transform: scale(1.02)}
.hlogo a svg path, .hlogo a svg rect { transition: all 0.3s ease;}
.hlogo a:hover svg path, .hlogo a:hover svg rect { fill:var(--couleur_02);}
.wk_sticky .sticky_onscroll { position: fixed; top:0; left:0; right: 0; }
/*
.wk_sticky .sticky_onscroll.fixed .hlogo img { height: 42px; }
.wk_sticky .sticky_onscroll.fixed {  box-shadow: rgb(178 186 195 / 20%) 0px 8px 30px}
.wk_sticky .sticky_onscroll.fixed #header_middle  .conteneur { padding: 5px 0}*/
#header_middle { background: #fff}
#header_middle .conteneur { padding: 42px 0; display: flex; align-items: center; justify-content: space-between; transition: all 0.3s ease;}
#header_middle .hlogo { line-height: 0 }
.home #header_middle { background: transparent}
.hamburger { width: 53px; top:40px; right: 30px;  display: none;}
.hamburger span { position: absolute; top:0; right: 0}
.hamburger .close { display: none}
.hamburger.is-active .close { display: block}
.hamburger.is-active .open { display: none}

/* Footer */
#footer .h3 { color:var(--couleur_02); padding-bottom: 1.5rem}
#footer .h3 span { color:#000}
#footer p { padding-bottom: 5px}
#footer .col-12 { text-align: center; padding :10px 0 15px !important;}
#footer a:hover, .hsocial a:hover { color:var(--couleur_02)}
.hsocial { display: flex; gap:10px 15px; padding-top: 20px}
.logomenumobile { display: none; text-align: center}
.logomenumobile img { width: 266px}
@media all and (min-width:990px) {
    #hmenu > ul { display: flex; align-items: center;   }
    #hmenu > ul > li {  position:relative; display: flex; justify-content: space-between; align-items: center; padding: 1.5rem 2rem; text-align: center; font-size: 2.5rem; line-height: 1.3}
    #hmenu > ul > li > a { display: block; transition:all 0.2s ease; }
    #hmenu > ul > li > a:hover, #hmenu > ul > li.current_page_item > a  { color:var(--couleur_02) !important;}
    .home  #hmenu > ul > li > a { color:#fff;}
}
@media all and (max-width:1200px) {
    #footer .col-3 {     grid-column: span 4;}
}

@media all and (max-width:989px) {
    .row [class^="col"] {grid-column: span 12; }
    .hide-mobile { display: none;}
    .hide-desktop { display: block;}
    .h1.hide-desktop { padding-bottom: 2.5rem}
    /* menu */

    html.menu-open { overflow: hidden;}
    #hmobile {  position:absolute; top:0; left:-130%; width:100%; z-index: 9998; height:calc(150vh);  overflow: auto;  transition: all 0.3s ease; }
    #hmobile.open { left:0; }
    #hmobile {background:var(--couleur_02); }
    #hmenu { padding-top: 200px; }
    #hmenu > ul { line-height: 1.3; display: flex;     flex-direction: column;}
    #hmenu > ul > li {  position: relative;  font-size: 37px; line-height: 40px; padding-bottom: 30px}
    #hmenu > ul > li a { display: block;  text-align: center; color:#fff}
    .hamburger { display: block;}
    #wrapper { padding-top: 145px}
    #header_middle .conteneur { padding: 34px 0}
    .hlogo svg, .wk_sticky .sticky_onscroll.fixed .hlogo svg { height: 53px;}
    .logomenumobile { display: block; padding: 100px 0 30px;}
    #header .hsocial { display: flex; justify-content: center; gap:10px 35px}
    #header .hsocial a { color:#fff;}
}


@media all and (max-width:767px) {
    html { font-size: 57.5%}
    #main { padding-bottom: 10rem}
    .row { padding: 0 30px;}

    #footer .col-3:nth-child(1) {  grid-column: span 12;  }
    #footer .col-3:nth-child(2),  #footer .col-3:nth-child(3) {  grid-column: span 6;  }


}
@media all and (max-width:390px) {
    .hlogo svg, .wk_sticky .sticky_onscroll.fixed .hlogo svg { height: 46px;}
}