/* Global styles for blocks and such. */
/* TODO: Sassify it imports and other fun stuff. */

:root {
    /* Colors */
    --main-color: #592e3a;
    --light-main-color:#efeaec;
    --dark-main-color:#9b8289;
    --darker-main-color:#7a5861;
    --bg-color: #fffbfb;
    --txt-color: #1c050c;
    --warm-color: #f27777;
    --cold-color: #038c8c;
    --cold-light-color: #b0d9d9;
    --grey-color: #ded5d8;

    /* Margins */
    --margin: 20px;
    --gap:64px;
    --space-01: 4px;
    --space-02: 8px;
    --space-03: 16px;
    --space-04: 32px;
    --space-05: 64px;
    --space-06: 128px;
    --space-07: 256px;

    --border-01:1px solid var(--txt-color);
    --border-02:2px solid var(--txt-color);

    --font-txt:'Open Sans', sans-serif;
    --font-head:'Averia Serif Libre', serif;

    scroll-behavior: smooth;
}

@media screen and (min-width: 1024px) {
    :root {
        --margin: 64px;
        --gap:64px;
    }
}

main, body{background-color: var(--bg-color);}


/* Typo styles */
*{font-family:var(--font-txt);transition:200ms;}
h1,h2,h3,h4,h5,h6{color:var(--txt-color);line-height:1.2em;margin:0;word-wrap: break-word;hyphens: auto;}
h1,h2,h3,h4{font-family:var(--font-head);font-weight:400;}
h5,h6{font-weight:600;}

h1, .h1{font-size:48px;line-height:54px;}
h2, .h2{font-size:40px;}
h3, .h3{font-size:32px;}
h4, .h4{font-size:28px;}
h5, .h5{font-size:22px;font-family:var(--font-txt);font-weight:700;text-transform: uppercase;}
h6, .h6{font-size:18px;font-family:var(--font-txt);font-weight:600;}

p{font-size:16px;line-height:1.5em;color:var(--txt-color);margin:0;}
strong,b{font-weight:700;}
p.small small{font-size: 14px;line-height: normal;}

a, a:visited, main button{text-decoration: none;color:var(--main-color);font-size:inherit;line-height: inherit;}
a:hover{text-decoration: underline;}
p a, p a:visited{text-decoration: underline;}
a.button, main button, a.button.dark:hover,a.button.dark:focus{text-decoration:none;padding:var(--space-03) var(--space-04);text-transform: uppercase;align-items:center;gap:var(--space-03);display: flex;border:var(--border-01);background-color: transparent;color:var(--txt-color);}
a.button:hover, main button:hover, a.button:focus, main button:focus,a.button.dark{background-color:var(--txt-color);color:var(--bg-color);}
a.button::after, main button::after, .menu_back::before,.nav-menu li:has(.sub-menu) > a::after,a.button.dark:hover::after,a.button.dark:focus::after{
    content:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="25" viewBox="0 0 24 25" fill="none"><path d="M16 5.5C16 6.24152 16.7331 7.3496 17.4746 8.28062C18.4291 9.4793 19.5689 10.5268 20.8762 11.3262C21.8551 11.9248 23.0444 12.5 24 12.5M24 12.5C23.0444 12.5 21.8551 13.0752 20.8762 13.6738C19.5689 14.4732 18.4291 15.5207 17.4746 16.7194C16.7331 17.6504 16 18.7585 16 19.5M24 12.5H0" stroke="%231D090F" stroke-width="1.5"/></svg>');
    width:24px;
    height:24px;
}
a.button:hover::after, main button:hover::after, a.button:focus::after, main button:focus::after,a.button.dark::after{
    content:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="25" viewBox="0 0 24 25" fill="none"><path d="M16 5.5C16 6.24152 16.7331 7.3496 17.4746 8.28062C18.4291 9.4793 19.5689 10.5268 20.8762 11.3262C21.8551 11.9248 23.0444 12.5 24 12.5M24 12.5C23.0444 12.5 21.8551 13.0752 20.8762 13.6738C19.5689 14.4732 18.4291 15.5207 17.4746 16.7194C16.7331 17.6504 16 18.7585 16 19.5M24 12.5H0" stroke="%23FFFBFB" stroke-width="1.5"/></svg>');
}
a[href="#"],a[href=""]{cursor:default;}
/* a[href="#"]:hover,a[href=""]:hover{color:inherit;} */

.tags{display:flex;flex-wrap: wrap;gap:var(--space-03);}
.tag, .hero .tags.muchhidden .tag.mobhide{font-size:18px;line-height: 28px;border-radius:34px;border:var(--border-01);padding:15px 20px;color:var(--txt-color);text-decoration: none;display:inline-flex;height:55px;align-items:center;background-color:var(--bg-color);}
.tag.active, a.tag:hover, a.tag:focus{background-color:var(--txt-color);color:var(--bg-color);}
a.tag:hover{text-decoration: none;cursor:pointer;}

.livrables{display:flex;flex-wrap: wrap;gap:20px;}
.livrable{text-transform:uppercase;font-size:14px;padding:var(--space-02) 12px;border:var(--border-01);}

svg{transition: cubic-bezier(0.175, 0.885, 0.32, 1.275) 100ms;}

@media screen and (min-width: 1024px) {
    h1, .h1{font-size:88px;line-height:82px;}
    h2, .h2{font-size:60px;}
    h3, .h3{font-size:40px;}
    h4, .h4{font-size:32px;}
    h5, .h5{font-size:24px;}
    p{font-size:18px;line-height:28px;}
}

/* Special editor */
.editor-styles-wrapper div.wp-block{max-width:unset;}
.acf-block-fields button, .acf-block-fields button:nth-of-type(2){border-radius:inherit;padding:inherit;background-color:inherit;color:inherit;font-family:inherit;letter-spacing: inherit;line-height: inherit;text-decoration:inherit;font-size:inherit;font-weight:inherit;display: inherit;border:inherit;margin-right:inherit;margin-bottom: inherit;}
h1.wp-block-post-title {font-family:sans-serif;text-align: center;font-weight:700;font-size:30px;}

/* Layout */
section{
    padding:0 var(--margin);
    display:flex;
    flex-direction:column;
    align-items: stretch;
}
main{padding-top:var(--header-top-offset, 90px);}
main:has(.hero.illus){padding-top:0;}
main .entry-content p, main .entry-content h2,main p, main h2{margin-bottom:0;}
main > *:not(article){padding:var(--space-05) var(--margin);}
footer > *{padding:0 var(--margin);}
.upline{border-top:var(--border-02);}
.bottomline{border-bottom:var(--border-02);}
article .entry-content > *:not(.hero){padding:var(--space-05) var(--margin);}

.single-projet main .bottomline{margin-bottom:0;}
.single-projet .entry-content :last-child{margin-bottom:0;}

@media screen and (min-width: 1024px) {
    section:not(.hero, .oob), article .entry-content > *:not(.hero,.oob),.post-navigation, main > *:not(article, .hero,.oob),footer > *{
        margin-right:var(--margin);
        margin-left:var(--margin);
        padding-left:0;
        padding-right:0;
    }
    .hero{margin-bottom: var(--gap);}
   main:has(.hero.illus){padding-top:var(--header-top-offset, 90px);}
}

/* Le 1388 est pour respecter le 1260px de large max imposé par les specs + les 64*2 de marge minimum. */
@media screen and (min-width: 1388px) {
    section:not(.hero, .oob), article .entry-content > *:not(.hero,.oob),.post-navigation, main > *:not(article, .hero, .oob),footer > *{
        margin-right:auto;
        margin-left:auto;
        width:1260px;
    }
}

/* Slider */
section .swiper-pagination-bullet-active{
    background-color:var(--txt-color);
}

/* Arrows */
/* TODO : Simplidier code avec les fullarrow */
.services-block .service-wrap::after,.list .list-wrap .fullarrow, .arguments .arg .fullarrow, .projects .single > div:last-of-type .fullarrow, .question-title::after,.wrapit::after{
    background-size: contain;
    background-repeat: no-repeat;
    background-position:center center;
    background-image:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="41" height="41" viewBox="0 0 41 41" fill="none"><path d="M35.6514 35.9368L5.6665 5.95187M33.8837 9.42032C32.5744 10.7296 31.9139 13.982 31.5807 16.9365C31.1519 20.7404 31.3172 24.6049 32.2167 28.3273C32.8904 31.1146 33.9771 34.2326 35.6664 35.9219M9.13492 34.1691C10.4442 32.8598 13.6966 32.1993 16.6511 31.8661C20.4551 31.4373 24.3196 31.6026 28.0419 32.5021C30.8292 33.1758 33.9472 34.2624 35.6366 35.9518" stroke="%231D090F" stroke-width="2"/></svg>');
}

/* Header */
.site-header{display:flex;justify-content: space-around;align-items:center;background-color:transparent;padding:12px var(--space-03);position:fixed;top:0;width:100%;left:0;z-index:5;height:92px;}
.site-header.scrolled{background-color:var(--bg-color);border-bottom:var(--border-02);}
.mobmenu-active .site-header{background-color:var(--bg-color);}
.site-header nav ul{display:flex;justify-content: flex-end;align-items:stretch;flex-direction:column;gap:var(--space-03);}
.site-header nav .nav-menu{padding:12px var(--space-04);}
.site-header nav .nav-menu > li{padding:var(--space-03) 0;border-top:var(--border-01);}
.site-header nav .nav-menu > li:first-of-type, .site-header nav .nav-menu > .button{border-top:none;}
.site-header nav ul a{font-weight:600;text-decoration: none;color:var(--txt-color);}
.site-header nav .nav-menu > li:not(.button) > a:hover, .site-header nav .nav-menu > li:not(.button) > a:focus, .site-header nav .nav-menu > li.current-menu-item:not(.button) > a, .site-header nav .nav-menu > li.current-menu-ancestor:not(.button) > a, .single-projet .site-header nav .nav-menu > li.menu-item-object-projet a{text-decoration:underline;}
.site-header nav .nav-menu a[href=""]:hover, .site-header nav .nav-menu a[href=""]:focus, .site-header nav .nav-menu a[href="#"]:hover, .site-header nav .nav-menu a[href="#"]:focus{color:inherit;}
.site-header .site-branding{max-width:200px;}
.site-header .button a{padding:var(--space-02) 20px;background-color:var(--txt-color);color:var(--bg-color);text-align:center;border:var(--border-01);}
.site-header .button a:hover, .site-header .button a:focus{background-color:var(--bg-color);color:var(--txt-color);}

/* For admin */
.admin-bar{--header-top-ab-offset:0px;}
@media screen and (min-width: 600px) {.admin-bar{--header-top-ab-offset:46px;}}
@media screen and (min-width: 783px) {.admin-bar{--header-top-ab-offset:32px;}}
.page-template-page-noheader main{padding-top:0;}
.admin-bar header.site-header{top:var(--header-top-ab-offset);}

/* Le scroll */
*[id]{
    scroll-margin-top: calc(var(--header-top-offset,80px) + var(--header-top-ab-offset, 0px));
    scroll-behavior: smooth;
}

/* START Menu hamburger */

.main-navigation .menu-toogle span:first-child,ul.nav-menu{transform-origin:0% 0%}
.main-navigation{display:flex;justify-content: flex-end;}

.main-navigation .menu-toogle{display:inline-block;}
.main-navigation .menu-toogle span{display:block;width:33px;height:4px;margin-bottom:5px;position:relative;background:#323232;border-radius:3px;z-index:1;transform-origin:4px 0;transition:transform .5s cubic-bezier(.77,.2,.05,1),opacity .55s}
.main-navigation .menu-toogle span:nth-child(3){transform-origin:0% 100%}
.main-navigation .menu-toogle.toggled span{opacity:1;transform:rotate(45deg) translate(-2px,-3px)}
.main-navigation .menu-toogle.toggled span:nth-child(2){opacity:0;transform:rotate(0) scale(.2,.2)}
.main-navigation .menu-toogle.toggled span:nth-child(3){transform:rotate(-45deg) translate(0,1px)}

div.menu-container{position:absolute;transform:translate(-100vw,0);transition:transform .5s cubic-bezier(.77,.2,.05,1);width:100vw;left:0;}
.main-navigation .menu-toogle.toggled~div.menu-container{width:100%;transform:none;overflow-y:scroll;overflow-x:hidden;height:calc(100vh - var(--header-top-offset,80px) - var(--header-top-ab-offset, 0px));}
.main-navigation div.menu-container{top:var(--header-top-offset, 80px);background-color:var(--bg-color);}

@supports (height: 1dvh) {
    .main-navigation .menu-toogle.toggled~div.menu-container{
        height:calc(100dvh - var(--header-top-offset,80px) - var(--header-top-ab-offset, 0px));
    }
}

body.mobmenu-active{overflow:hidden;}
/* END Menu hamburger */

.main-navigation .nav-menu > li > .sub-menu{
    position:absolute;
    width:100%;
    gap:0;
    padding:12px var(--space-04) var(--space-05);
    top:0;
    right:-100%;
    overflow-y:scroll;
    overflow-x:hidden;
    justify-content: flex-start;
    left:-999em;
    min-height: -webkit-fill-available;
}
.site-header nav .nav-menu:has(li.focus .sub-menu){transform: translateX(-100vw);}
.main-navigation .nav-menu > li.focus > .sub-menu{left:auto;}
.menu_back{display:flex;align-items:center;gap:var(--space-03);font-size:16px;font-weight:600;cursor:pointer;padding: var(--space-04) 0;}
.menu_back::before{transform: rotate(180deg);}

.main-navigation .nav-menu li:has(.sub-menu) > a{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.sub-menu .menu_service_item{display:flex;gap:var(--space-03);align-items:flex-end;padding-top:var(--space-04);border-bottom:var(--border-01);padding-bottom:var(--space-04);}
.sub-menu li:last-of-type .menu_service_item{border-bottom:0;padding-bottom:0;}
.sub-menu .menu_service_item > div{margin-right:auto;}
.sub-menu .menu_service_item img,.sub-menu .menu_service_item svg{width:40px;height:40px;flex-shrink: 0;}
.menu_service_item svg{fill:transparent;}
.menu_service_item:hover svg, .menu_service_item:focus svg{fill:var(--txt-color);}
.sub-menu .menu_service_item .subitem_title{font-family:var(--font-head);font-weight:400;font-size:24px;line-height: normal;}
.sub-menu .menu_service_item .subitem_desc{font-size:14px;line-height: 24px;font-weight:400;display:none;}

.sub-menu .menu_service_item::after{
    content:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 41 41" fill="none"><path d="M35.6514 35.9368L5.6665 5.95187M33.8837 9.42032C32.5744 10.7296 31.9139 13.982 31.5807 16.9365C31.1519 20.7404 31.3172 24.6049 32.2167 28.3273C32.8904 31.1146 33.9771 34.2326 35.6664 35.9219M9.13492 34.1691C10.4442 32.8598 13.6966 32.1993 16.6511 31.8661C20.4551 31.4373 24.3196 31.6026 28.0419 32.5021C30.8292 33.1758 33.9472 34.2624 35.6366 35.9518" stroke="%231D090F" stroke-width="2"/></svg>');
    width:24px;
    height:24px;
}

@media screen and (min-width: 1024px) {
    .site-header{padding:var(--space-05) 20px;height:unset;}
    .site-header.landinghead{padding:var(--space-04) 20px;}
    .site-header.scrolled{padding:var(--space-04) 20px;border-bottom: none;}
    .site-header::after{
        content:'';
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        bottom: 0;
        right: 0;
        left: 0;
        z-index:-1;
        pointer-events:none;
        transition:200ms;
    }
    .site-header:has(li:hover > .sub-menu)::after, .site-header:has(li:focus > .sub-menu)::after, .site-header:has(li.focus > .sub-menu)::after, .site-header.scrolled::after{background-color:var(--bg-color);}
    .site-header.scrolled::after{border-bottom:var(--border-02);}
    .site-header nav ul{flex-direction: row;align-items:center;gap:0;}
    .site-header nav .nav-menu{padding:12px var(--space-03);}
    .site-header nav .nav-menu:has(li.focus .sub-menu){transform:none;}
    .site-header nav .nav-menu > li{padding:0 48px;border-left:var(--border-01);border-top:none;}
    .site-header nav .nav-menu > li:first-of-type{padding-left:0;border-left:none;}
    .site-header nav .nav-menu > .button{border-left:none;padding:0 0 0 12px;border-top:none;}

    .main-navigation div.menu-container{top:unset;padding:unset;background-color:unset;transition: none;transform: none;width:auto;left:unset;position: unset;}
    header.site-header .main-navigation .nav-menu > *{flex-basis:unset;}
    .main-navigation .menu-toogle{display: none;}

    .main-navigation .nav-menu > li > .sub-menu{
        background-color:var(--bg-color);
        align-items:flex-start;
        display:grid;
        grid-template-columns: 1fr 1fr 1fr;
        gap:var(--space-05);
        padding:var(--space-04) 80px var(--space-05) 80px;
        left:0;
        right:unset;
        top:-140vh;
        transition:cubic-bezier(0.86, 0, 0.07, 1) 300ms;
        z-index:-2;
        overflow-y:hidden;
        min-height: unset;
    }
    .main-navigation .nav-menu > li:hover:has(.sub-menu)::after, .main-navigation .nav-menu > li:focus:has(.sub-menu)::after{content:'';position: absolute;width:100%;height:91px;}

    .main-navigation .nav-menu > li:hover > .sub-menu, .main-navigation .nav-menu > li:focus > .sub-menu, .main-navigation .nav-menu > li.focus > .sub-menu{top:100%;left:0;}
    .nav-menu li:has(.sub-menu) > a::after{content:'';}
    .sub-menu .menu_service_item{gap:30px;align-items:flex-start;flex-direction:column;position: relative;padding-bottom:24px;height:100%;justify-content:stretch;border-bottom:0;}
    .sub-menu li:last-of-type .menu_service_item{padding-bottom:24px;}
    .sub-menu .menu_service_item > div{
        padding-left:20px;
        flex-grow:1;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        width: 100%;
        position: relative;
    }
    .sub-menu .menu_service_item .subitem_title{line-height:1.6em;}
    .sub-menu .menu_service_item .subitem_desc{display:block;}
    .sub-menu.minified .menu_service_item .subitem_desc{display:none;row-gap:var(--space-04);}
    .sub-menu .menu_service_item > div::before{width:100%;height:100%;transition:height 200ms;content:'';border-left:var(--border-01);top:0;left:0;position: absolute;}
    .sub-menu .menu_service_item::after{opacity:0;align-self:flex-end;transition:opacity 200ms;bottom:-12px;right:0;position: absolute;}
    .sub-menu > li:hover .menu_service_item::after, .sub-menu > li:focus .menu_service_item::after{opacity:1;}
    .sub-menu > li:hover .menu_service_item > div::before{height:calc(100% + 24px);transition:height 200ms;}
    .menu_back{display:none;}

    /* Rare bugs qui occurent si jamais la fenêtre est resizé alors que le menu est ouvert */
    .main-navigation .menu-toogle.toggled~div.menu-container{overflow:visible;height:auto;}
    body.mobmenu-active{overflow: unset;}
}

@media screen and (min-width: 1280px) {
    .site-header, .site-header.scrolled{padding-right:var(--margin);padding-left:var(--margin);}
}
@media screen and (min-width: 1440px) {
    .site-header, .site-header.scrolled, .main-navigation .nav-menu > li > .sub-menu{
        padding-right:calc(var(--margin) + (100% - 1400px) / 2);
        padding-left:calc(var(--margin) + (100% - 1400px) / 2);
    }
}

/* Footer */
footer{background-color:var(--bg-color);padding-bottom: var(--space-05);}
.legal_footer{display:flex;list-style: none;flex-wrap:wrap;justify-content:center;align-items: center;gap:var(--space-02);margin:0;font-size:13px;padding:0;text-align:center;line-height:28px;}
footer .wp-block-columns{
    margin-left: auto;
    margin-right: auto;
    flex-direction: column;
}
footer .wp-block-columns > .wp-block-column{padding:0;}
.legal_footer li{flex-basis:100%;}
footer .wp-block-navigation:not(.legal_footer) a{text-decoration: none;}
footer .wp-block-navigation a:hover, footer .wp-block-navigation a:focus{text-decoration: underline;}
footer .lastrow{flex-direction:column;gap:var(--space-02);}

/* Quick fix year */
.currentyear{font-size:inherit;margin-left:1em;}
div:has(>.currentyear){gap:0.5em;}

@media screen and (min-width: 782px) {
    footer .wp-block-columns{margin-left:var(--space-06);margin-right:var(--space-06);}
}
@media screen and (min-width: 1024px) {
    footer .lastrow{flex-direction:row;}
    .legal_footer li{flex-basis:unset;line-height:normal;}
    .legal_footer li:not(:last-of-type)::after{content:'|';padding-left: var(--space-02);}
    .legal_footer + *::before, .legal_footer::before, .lastrow > :nth-child(2)::before{content:'|';}
    .lastrow > :nth-child(2):not(:last-child)::before{padding-right:var(--space-02);}
    footer .wp-block-columns{max-width:unset;justify-content: stretch;flex-direction:row;}
    footer .wp-block-columns > .wp-block-column:first-of-type{border-right:var(--border-02);text-align:end;padding-right:var(--space-05);}
    footer .wp-block-columns > .wp-block-column:nth-of-type(2){padding-left:var(--space-05);}
    footer .wp-block-columns > .wp-block-column:nth-of-type(3){padding-left:var(--space-04);}
    footer .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column{flex-basis:unset;flex-grow:1;flex-shrink:1;}
    footer .wp-block-site-logo{text-align:end;}
    .wp-block-social-links{justify-content: flex-end;}
}

@media screen and (min-width: 1388px) {
    footer .wp-block-columns{
        margin-right:auto;
        margin-left:auto;
        width:1260px;
    }
}

/* Blocs */
/* TODO Mettre les styles blocs-spécifiques autre part */

/* CTA */
.cta{gap:var(--space-04);align-items:flex-start;padding-top:var(--space-04);padding-bottom:var(--space-04);}
.cta__col{gap:var(--space-04);}
.cta p, .cta p *{font-family:var(--font-head);}
@media screen and (min-width: 1024px) {
    .cta{
        gap:0;
        flex-direction: row;
        padding-top:0;
        padding-bottom: 0;
        display:grid;
        grid-template-columns: 1fr fit-content(280px);
        align-items:end;
    }
    .cta__col{
        padding-top:var(--space-04);
        padding-bottom:var(--space-04);
        display:flex;
        flex-direction: column;
        gap:var(--space-03);
    }
    .cta__col:first-of-type{
        padding-right:var(--space-05);
        border-right:var(--border-02);
    }
    .cta__col:last-of-type{
        padding-left:var(--space-05);
        align-items:center;
        justify-content: flex-end;
    }
    .cta__col:first-of-type:last-of-type{
        padding-right:0;
        padding-left:0;
        border:0;
    }
}

/* TextImage */

/* Hero */
.hero{
    gap:var(--space-05);
    background-repeat: no-repeat;
    background-size:auto 215px;
    background-position: top calc(var(--header-top-offset, 90px) - 32px) right -15px;
    justify-content:flex-end;
    padding-bottom: var(--space-05);
}
.hero.illus{padding-top: calc(var(--space-06) + var(--space-05) + var(--header-top-offset, 90px));}
.hero.illus.tremendous{padding-top:var(--space-07);background-size:auto 280px;}
.hero.img-left{background-position: top calc(var(--header-top-offset, 90px) - 32px) left -15px;}
.hero.img-left h1{text-align:right;}
.hero:not(.illus){margin-bottom:0;}

.hero:has(.tags .tag.mobhide){gap:0;}
.hero:has(.tags .tag.mobhide) > :first-child{margin-bottom:var(--space-05);}
.hero .tags .tag.mobhide{height:0;opacity:0;transition:opacity 200ms;overflow:hidden;border:0;padding:0}
.hero .tags.muchhidden .tag.mobhide{height:auto;opacity:1;}
.hero .hide-cat{color:var(--txt-color);display:none;font-size:20px;text-decoration:underline;margin-top:20px;}
.hero:has(.tags .tag.mobhide) .hide-cat{display:block;}

/* Style Enrichi pour Hero */
.hero.extended{
    gap:var(--space-04);
    flex-direction: column-reverse;
    padding-top:var(--space-03);
}

.hero.extended .wrapper{
    display:flex;
    flex-direction: column;
    align-items:flex-start;
    justify-content: center;
    gap:var(--space-04);
}
.hero.extended .img {
    aspect-ratio: 4/3;
    min-height:120px;
    overflow:hidden;
}
.hero.extended .img img{width:100%;height:100%;object-fit: cover;display:block;object-position: center center;}
.hero.extended.img-left h1{text-align:left;}

@media screen and (min-width: 720px) {
    .hero.extended {
        flex-direction: row;
        align-items:stretch;
    }
    .hero.extended .img{aspect-ratio: unset;align-self:stretch;position:relative;}
    .hero.extended .img img{left:0;top:0;position: absolute;}
    .hero.extended picture.img img{object-position: var(--img-position-desktop,center center) !important;}
    .hero.extended.img-left{flex-direction: row-reverse;}
    .hero.extended.img-left h1{text-align:right;}
    .hero.extended.img-left .button{align-self:flex-end;}
    .hero.extended >*{flex-basis:50%;}
    .hero.extended:not(:has(.img)) >*{flex-basis:100%;}
}

@media screen and (min-width: 1024px) {
    .hero{background-position: top right;background-size:auto 110%;}
    .hero.illus{padding-top:0;height:calc(338px + var(--space-05));}
    .hero.illus.tremendous{height:calc(420px + var(--space-05));background-size:auto 110%;}
    .hero.img-left{background-position: center left;}
    .hero.illus + *{margin-top:calc(var(--gap) * -1);}
    .hero:has(.tags .tag.mobhide) .hide-cat{display:none;}
    .hero .tags .tag.mobhide{font-size:18px;line-height: 28px;border-radius:34px;border:var(--border-01);padding:15px 20px;color:var(--txt-color);text-decoration: none;display:inline-flex;height:55px;align-items:center;background-color:var(--bg-color);opacity:1;transition: 200ms;}
    .hero .tags a.tag.mobhide.active, .hero .tags a.tag.mobhide:hover, .hero .tags a.tag.mobhide:focus{background-color:var(--txt-color);color:var(--bg-color);}
    
    /* Style Enrichi pour Hero */
    .hero.extended{
        gap:var(--space-05);
    }

}

@media screen and (min-width: 1440px) {
    .hero{
        background-position:top right calc((100vw - 1440px) / 2);
        padding-right:calc(var(--margin) + (100% - 1400px) / 2);
        padding-left:calc(var(--margin) + (100% - 1400px) / 2);
        width:auto;
    }
    .hero.img-left{background-position: top left calc((100vw - 1440px) / 2);}

}


/* Projets */
.projects{gap:var(--space-04);}
.projects .single{display:grid;grid-template-columns: 1fr;padding:var(--space-05) 0;text-decoration:none;}
main > .projects:last-child{margin-bottom:0;}
.projects.short .single{padding:0;width:100%;}
.projects.long .single:first-of-type{padding-top:0;}
.projects.long .single:last-of-type{padding-bottom:0;}
.projects.long .single:not(:last-of-type){border-bottom:var(--border-02);}
.projects:not(nav) .single > div:first-of-type{
    margin-bottom:var(--space-04);
    min-height:180px;
    background-position: center center;
    background-repeat: no-repeat;
    background-size:cover;
    aspect-ratio:4/3;
    max-width: 100%;
}

.projects .single > div:first-of-type a{display:inline-block;width:100%;height:100%;}
.projects .single > div:last-of-type{padding-top:var(--space-04);border-top:var(--border-01);display:flex;flex-direction: column;gap:var(--space-03);position: relative;}
.projects .single h3 a{font-size:inherit;color:inherit;font-family: inherit;opacity:inherit;}

.projects.short .swiper{width:500px;max-width:100%;}
.projects.short .swiper-wrapper{margin-bottom:32px;}

section .swiper-button-next.swiper-button-disabled,section .swiper-button-prev.swiper-button-disabled{
    display:none;
}
section .swiper-button-next, section .swiper-button-prev{ width:32px;
    height:32px;z-index:unset;}
section .swiper-pagination{z-index:unset;}
section .swiper-button-next::after,section .swiper-button-prev::after{
    background-image:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="41" height="41" viewBox="0 0 41 41" fill="none"><path d="M35.6514 35.9368L5.6665 5.95187M33.8837 9.42032C32.5744 10.7296 31.9139 13.982 31.5807 16.9365C31.1519 20.7404 31.3172 24.6049 32.2167 28.3273C32.8904 31.1146 33.9771 34.2326 35.6664 35.9219M9.13492 34.1691C10.4442 32.8598 13.6966 32.1993 16.6511 31.8661C20.4551 31.4373 24.3196 31.6026 28.0419 32.5021C30.8292 33.1758 33.9472 34.2624 35.6366 35.9518" stroke="%23fffbfb" stroke-width="2"/></svg>');
    content:'';
    background-color:var(--txt-color);
    background-repeat: no-repeat;
    background-position: center center;
    background-size:14px 14px;
    width:100%;
    height:100%;
    border-radius: 50%;
}
.swiper-button-next, .swiper-rtl .swiper-button-prev{transform: rotate(-45deg);}
.swiper-button-prev, .swiper-rtl .swiper-button-next{transform: rotate(135deg);}

.projects .single .client{font-weight: 600;text-transform: uppercase;}
.projects .single > div:last-of-type:has(.fullarrow){padding-bottom:40px;}
.projects .single .fullarrow{
    width:24px;
    height:24px;
    position:absolute;
    right:0;
    bottom:0;
    opacity:0;
    transition:200ms;
}
.projects .single:hover .fullarrow, .projects .single:focus .fullarrow{opacity:1;}
.projects .single .tags span{opacity:0.7;text-decoration: none;font-size:14px;color: var(--main-color);}
.projects > a.button{margin-top:var(--space-05);align-self: center;}

.projects.wait{position: relative;}
.projects.wait::before{position:absolute;width:100%;height:100%;top:0;left:0;right:0;content:'';backdrop-filter: grayscale(60%) blur(2px);-webkit-backdrop-filter: grayscale(60%) blur(2px);z-index:1;}
.projects.wait::after{
    position:absolute;
    top:50px;
    left:50%;
    transform:translateX(-50%);
    content:url('data:image/svg+xml,<svg width="250" height="250" viewBox="0 0 124 124" fill="%23fffbfb" xmlns="http://www.w3.org/2000/svg"><path d="M61.9686 62C78.5344 45.4342 78.5344 18.5658 61.9686 2C45.4029 18.5971 45.4029 45.4342 61.9686 62Z" stroke="%231D090F" stroke-width="2"/><path d="M61.9686 62C45.4029 78.5658 45.4029 105.434 61.9686 122C78.5344 105.434 78.5344 78.5658 61.9686 62Z" stroke="%231D090F" stroke-width="2"/><path d="M121.937 62C105.371 45.4342 78.503 45.4342 61.9373 62C78.5343 78.5658 105.371 78.5658 121.937 62Z" stroke="%231D090F" stroke-width="2"/><path d="M61.9686 62C45.4029 45.4342 18.5344 45.4342 1.96863 62C18.5344 78.5658 45.4029 78.5658 61.9686 62Z" stroke="%231D090F" stroke-width="2"/></svg>');
    animation-name: spin;
    animation-duration: 2500ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    height:250px;
    width:250px;
    z-index:2;
    transform-origin:left;
}

@keyframes spin {
    from {
        transform:rotate(0deg) translateX(-50%);
    }
    to {
        transform:rotate(360deg) translateX(-50%);
    }
}

@media screen and (min-width: 783px) {
    .projects.long .single{grid-template-columns: 33% 1fr;gap:var(--space-04);}
    .projects.long .single > div:last-of-type{
        border-top:none;
        padding:0;
    }
    .projects.long .single > div:first-of-type{
        aspect-ratio:1/1;
        margin-bottom:0;
    }
    .projects.short .swiper{max-width:100%;width:auto;}
    .projects.short .single{width:calc(50% - 32px);}
}

@media screen and (min-width: 1024px) {
    .projects.short .projects__grid{display:grid;grid-template-columns: 1fr 1fr 1fr;gap:var(--space-04);}
    .projects.short .single{align-content:start;width:100%;}
    .projects.long .single{gap:var(--space-05);}

    .projects.long .single p:not(.client){font-size:16px;}


    .projects .single .fullarrow{
        width:40px;
        height:40px;
    }
}


/* Formulaire */
.fluentform input, .fluentform textarea{padding:var(--space-03);background-color:#FFFFFF;border:none;border-bottom:var(--border-02);border-radius:0;color:var(--txt-color);}
.fluentform label{font-weight:600;color:var(--txt-color);}
.fluentform input::placeholder, .fluentform textarea::placeholder{color:var(--dark-main-color) !important;}
.fluentform input:focus, .fluentform textarea:focus,.fluentform input:hover, .fluentform textarea:hover{background-color:var(--light-main-color);}
.fluentform input:focus-visible, .fluentform textarea:focus-visible{border:var(--border-02);}
.fluentform .ff-el-input--label.ff-el-is-required.asterisk-right label:after, .fluentform .ff-el-is-error .ff-el-form-control, .fluentform .ff-el-is-error .text-danger, .fluentform .ff-el-is-error label{color:var(--warm-color);}
.fluentform .ff_submit_btn_wrapper{display:flex;justify-content: flex-start;}
.fluentform button{cursor:pointer;}
.fluentform .ff-message-success{box-shadow: unset;border:none;position:relative;}

@media screen and (min-width: 1024px) {
    .section-contact{gap:var(--space-05);}
    .section-contact >:first-child{padding-right:var(--space-05);border-right:var(--border-02);text-align:right;}
}
