/*
Theme Name: Kleiber
Theme URI: https://www.kleiber.alsace
Author: Mars Rouge
Author URI: http://www.marsrouge.com
Version: 2.0
*/

@CHARSET "UTF-8";
@font-face {font-family: 'regular'; src: url("assets/fonts/regular.woff") format("woff"), url("assets/fonts/regular.svg") format("svg"); font-weight: normal; font-style: normal;}
@font-face {font-family: 'title'; src: url("assets/fonts/title.woff") format("woff"), url("assets/fonts/title.svg") format("svg"); font-weight: normal; font-style: normal;}
* {box-sizing:border-box; padding:0; margin:0; -webkit-backface-visibility:hidden; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; outline:none;}

:root {
	
	--blanc:#ffffff;
	--noir:#060506;
	--gris:#1d1b20;
	--beige:#c9c2ac;	
	--orange:#f04923;
	--menu:20.5rem;
	--menuscroll:5.5rem;
	--padxxs:.5rem;
	--padxs:1rem;
	--pads:1.5rem;
	--pad:30px;
	--padm:50px;
	--padl:7.2vw;
	
} 

* {scrollbar-width: none; -ms-overflow-style: none;}
html {background:var(--blanc);}
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,
main, menu, nav, output, ruby, section, summary, time, mark, audio, video {margin: 0; padding: 0; border: 0; vertical-align: baseline;}
body {background:var(--gris); color:var(--beige); overflow-x: hidden; webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; counter-reset:item; transition:background .4s ease-out;}
::-webkit-scrollbar {width:0px;}

a {color:inherit; outline:none; webkit-transition:all .35s; -moz-transition:all .35s; transition:all .35s; -o-transition:all .35s; -ms-transition:all .35s; text-decoration:none;}
a:focus, a:active {outline: none;}
a:link, a:visited, a:hover, a:active, a:focus, button {outline:0;}
:focus, :hover {-webkit-appearance: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);}

sup {font-size:.6em; vertical-align:super;}
 
button {font-size:inherit;}
button:hover {cursor:pointer;}
 
section {position:relative; clear:both; transform-style:preserve-3d; z-index:1;}

button {border:0;}
li {list-style: none; margin-bottom:0;}
li:last-child {margin-bottom:0;}

p {margin-bottom:var(--pads);}
p:last-child {margin-bottom:0!important;}

.grecaptcha-badge {visibility: hidden!important; pointer-events:none!important; display:none!important;}

img {pointer-events:none;}
.noise {z-index:80; position:fixed; top:0; left:0; width:100ww; height:100vh; pointer-events:none; opacity:.07;}



/* FONTS */
 
body, .font-size--e {font-family: 'regular', sans-serif; font-optical-sizing: auto; font-style: normal; font-size:1.3rem; line-height:1.3; font-weight:500;}
h1, h2, h3 , h4 {line-height:1; font-weight: 500;}

.font-size--a {font-family:'title'; text-transform:uppercase; font-size:8.2vw; line-height:.95;}
.font-size--b {font-family:'regular'; font-size:2.05vw; line-height:1.05;}
.font-size--c {font-family:'title'; text-transform:uppercase; font-size:6vw; line-height:.95;}
.realisations .font-size--c {font-size:11vh;}
.font-size--d {font-family:'regular'; font-size:.9rem;}
.font-size--s, .btn, .article h3 {font-family:'regular'; font-size:1rem; text-transform:uppercase;}

.center {text-align:center;}
.left {text-align:left;}
.right {text-align:right;}
.uppercase {text-transform:uppercase;}

.underline a, button {position:relative; white-space: nowrap;}
.underline a:before, button:before {content:''; position:absolute; bottom:-7px; left:0; width:100%; min-height:1px; height:1px; transform-origin:right; transform:scaleX(0); 
transition:transform .75s cubic-bezier(0.165, 0.84, 0.44, 1); background-color:var(--orange);}
.underline a:hover::before, button:hover::before {transform-origin:left;transform:scaleX(1);}
.underline a:hover {color:var(--orange);}
.font-size--b a:before {bottom:0px;}

.orangetxt {color:var(--orange);}



/* GENERAL */

.splitting .word, .splitting .char {display:inline-block;}
.splitting .char {position:relative;}
.splitting .char::before, .splitting .char::after {content:attr(data-char); position: absolute; top: 0; left: 0; visibility: hidden; transition: inherit; user-select: none;}
.splitting {--word-center: calc((var(--word-total) - 1) / 2); --char-center: calc((var(--char-total) - 1) / 2); --line-center: calc((var(--line-total) - 1) / 2);}
.splitting .word {--word-percent: calc(var(--word-index) / var(--word-total)); --line-percent: calc(var(--line-index) / var(--line-total));}
.splitting .char {--char-percent: calc(var(--char-index) / var(--char-total)); --char-offset: calc(var(--char-index) - var(--char-center)); 
--distance: calc((var(--char-offset) * var(--char-offset)) / var(--char-center)); --distance-sine: calc(var(--char-offset) / var(--char-center));
--distance-percent: calc((var(--distance) / var(--char-center)));}
.char-wrap {display: inline-block; position: relative; overflow: hidden;}

.button {width:fit-content; padding:1rem var(--pad); position:relative; border-radius:7rem; overflow:hidden;}

.item-rounded {position:relative; width:var(--padm); height:var(--padm); border:1px solid var(--beige); border-radius:7rem; overflow:hidden; display:flex; align-items:center;
justify-content:center;}
.item-rounded svg {width:1.1rem; height:auto; fill:var(--beige); transition:.3s cubic-bezier(0.38, 0.005, 0.215, 1);}
.item-rounded:hover svg {fill:var(--noir);}
.item-rounded:hover {border:1px solid var(--orange); background:var(--orange);}

.border-radius {border-radius:1.5rem;}
.border-beige {border:1px solid var(--beige);}
.noir {background:var(--noir); color:var(--beige);}
.beige {background:var(--beige); color:var(--noir);}

button {color:var(--beige);}
.btn {position:relative; padding-bottom:.5rem; display:flex; align-items:center; justify-content:space-between; grid-gap:var(--padm);}
.btn .button-label>span {display:block; transition:transform .6s cubic-bezier(0.165, 0.84, 0.44, 1); transition-delay:.01s;}
.btn svg {fill:var(--beige);}
.btn:hover svg {transform:rotate(45deg);}
a.btn:hover, button:hover {color:var(--beige);}
a.btn:before, button:before {background-color:var(--beige); transform-origin:left; transform:scaleX(1);}
a.btn:hover::before, button:hover::before {transform-origin:right; transform:scaleX(0);}
.beige a.btn:hover {color:var(--noir);}
.beige .btn svg {fill:var(--noir);}
.beige a.btn:before {background-color:var(--noir);}



/* GRID + FLEX + WRAPPER */

.absolute {position:absolute;}
.grid {display:grid;}
.flex {display:flex;}
.aligncenter {justify-content:center;}
.justify-end {justify-content: flex-end;}
.itemscenter {align-items:center;}
.alignright {justify-content:flex-end;}
.alignbottom {justify-content: flex-end;}
.itemstbottom {align-items: flex-end;}
.justify {justify-content:space-between;}
.baseline {align-items:baseline;}
.direction {flex-direction:column;}
.center {text-align:center;}

.grid-padxxs {grid-gap:var(--padxxs);}
.grid-padxs {grid-gap:var(--padxs);}
.grid-pads {grid-gap:var(--pads);}
.grid-pad {grid-gap:var(--pad);}
.grid-padm {grid-gap:var(--padm);}
.grid-padl {grid-gap:calc(var(--padm) + var(--pad));}
.grid-padxl {grid-gap:var(--padl);}
.column-gap {column-gap:var(--pad);}
.column-gapl {column-gap:var(--padl);}
.row-gap {row-gap:var(--pad);}
.row-gapm {row-gap:calc(var(--padm) + var(--pad));}
.row-gapl {grid-gap:var(--padl);}
.col-2 {grid-template-columns:1fr 1fr;}
.col-3 {grid-template-columns:1fr 1fr 1fr;}
.col-4 {grid-template-columns:1fr 1fr 1fr 1fr;}

.hidden {overflow:hidden;}
.inline-block {display:inline-block;}
.block {display:block;}

.relative {position:relative;}
.absolute {position:absolute;}

.wrapper-justify.first {padding:var(--padl) var(--padl) calc(var(--pad) + var(--padm)) calc(var(--menu) + var(--padl));}
.page-content {padding:var(--padl) var(--padl) var(--padl) calc(var(--menu) + var(--padl));}
.wrapper.first {padding:var(--padl) var(--padl) var(--padl) calc(var(--menu) + var(--padl));}
.wrapper-s {padding:var(--pad);}
.wrapper {padding:var(--padl) var(--padl) var(--padl) calc(var(--menuscroll) + var(--padl));}
.realisations {padding:0 var(--padl) var(--padl) calc(var(--menuscroll) + var(--padl));}
.wrapper-nt {padding:0 var(--padl) var(--padl) calc(var(--menuscroll) + var(--padl));}
.wrapper-nb {padding:var(--padl) var(--padl) 0 calc(var(--menuscroll) + var(--padl));}
.wrapper-nt-nb {padding:0 var(--padl) 0 calc(var(--menuscroll) + var(--padl));}
.wrapper-l {padding:var(--padl);}
.wrapper-m {padding:var(--padm);}
.wrapper-50 {padding:var(--padl) 0 var(--padl) 27.3vw;}

.mar-top {margin-top:var(--pad);}

.content-100 {width:100%;}
.content-90 {width:90%;}
.content-85 {width:85%;}
.content-80 {width:80%;}
.content-70 {width:70%;}
.content-60 {width:60%;}
.content-55 {width:50%;}
.content-50 {width:50%;}
.content-45 {width:45%;}
.content-40 {width:40%;}
.content-35 {width:35%;}
.content-30 {width:30%;}
.content-25 {width:25%;}
.content-20 {width:20%;}
.content-10 {width:10%;}
.content-8 {width:8%;}

.content-height-100 {height:100%;}

.height-80 {height:80vh;}
.height-100 {height:100vh;}

.zindex {z-index:10;}
.nowrap {white-space:nowrap;}



/* OVERLAY */

.st1{fill:var(--noir);}
.st2{fill:var(--orange);}

.menu-contact {position:fixed; top:var(--pad); right:var(--pad); z-index:10; pointer-events:none; transform:translateY(-100%);
transition:.3s cubic-bezier(0.38, 0.005, 0.215, 1);}
.is-ready .menu-contact, .is-ready .menu-mobile {transform:none; pointer-events:auto;}

.logo-mobile {display:none;}

.header {position:fixed; left:0; top:0; bottom:0; padding:var(--pad) 0 var(--pad) var(--pad); width:var(--menu); z-index:10; pointer-events:none; transform:translateX(-100%);
transition:.3s cubic-bezier(0.38, 0.005, 0.215, 1);}
.is-ready .header {pointer-events:auto; transform:none;}
.header.scroll {width:calc(var(--menuscroll) + var(--pad));}
.header .button-label, .btn .button-label, .menu-contact a .button-label, .menu-mobile .button-label {overflow: hidden; position: relative;}
.header .button-label>span, .menu-contact a .button-label>span, .menu-mobile .button-label>span {display:block; transition:transform .45s cubic-bezier(0.165, 0.84, 0.44, 1); transition-delay:.01s;}
.header .button-label>span:nth-child(2), .btn .button-label>span:nth-child(2), .menu-contact a .button-label>span:nth-child(2), .menu-mobile .button-label>span:nth-child(2)
{position:absolute; top:0; bottom:0;}
.header .button-label>span:nth-of-type(2), .btn .button-label>span:nth-of-type(2), .menu-contact a .button-label>span:nth-of-type(2), .menu-mobile .button-label>span:nth-of-type(2)
 {transform:translate3d(0, calc(100% + 1rem), 0);}
.header a, .menu-contact a, .btn {white-space:nowrap;}
.header a:hover .button-label>span:nth-of-type(1), .header a:focus .button-label>span:nth-of-type(1), .menu-contact a:hover .button-label>span:nth-of-type(1), 
.menu-contact a:focus .button-label>span:nth-of-type(1), .btn:hover .button-label>span:nth-of-type(1), .btn:focus .button-label>span:nth-of-type(1),
.menu-mobile:hover .button-label>span:nth-of-type(1), .menu-mobile:focus .button-label>span:nth-of-type(1) {transform:translate3d(0, calc(-100% - 1rem), 0);}
.header a:hover .button-label>span:nth-of-type(2), .header a:focus .button-label>span:nth-of-type(2), .menu-contact a:hover .button-label>span:nth-of-type(2), 
.menu-contact a:focus .button-label>span:nth-of-type(2), .btn:hover .button-label>span:nth-of-type(2), .btn:focus .button-label>span:nth-of-type(2),
.menu-mobile:hover .button-label>span:nth-of-type(2), .menu-mobile:focus .button-label>span:nth-of-type(2)
{transform:translate3d(0, 0, 0);}

.menu {border-radius:1.5rem 1.5rem 0 0; position:relative; height:100%; width:100%; transition:.3s cubic-bezier(0.38, 0.005, 0.215, 1);}
.menu:after {content:''; position:absolute; top:0; left:0; width:100%; height:100%; background-color:var(--beige); z-index:-1;}

.menu-logo {padding:var(--pad);}
.menu-logo svg {width:7.5rem; height:auto;}
.menu-logo .st1 {transition:.3s cubic-bezier(0.38, 0.005, 0.215, 1); transform-style:preserve-3d;}

.navigation {position:relative;}
.navigation a {color:var(--noir);}

.menu-item {border-bottom:1px solid var(--noir); position:relative; padding:1.5vh var(--pad); transition:.3s cubic-bezier(0.38, 0.005, 0.215, 1); transform-style:preserve-3d;}
.menu-item span, .menu-item svg, .menu-sec--a span, .menu-sec--a svg, .menu-sec--b span, .menu-sec--b svg, .menu-contact svg {z-index:1;}
.menu-item svg {fill:var(--orange);}
.menu-item svg, .btn svg, .item-competence svg {width:.7rem; height:auto; transition:.35s;}
.menu-item.active span {opacity:.6;}
.menu-item.active svg {fill:var(--noir); transform:rotate(45deg); opacity:.3;} 

.menu-item:hover {color:var(--beige);}
.menu-item:hover svg {fill:var(--beige); transform:rotate(45deg);}
.menu-item:before {content:''; position:absolute; bottom:0; top:0; left:0; right:0; transform:scaleY(0); transform-origin:center top;
background-color:var(--noir); transition:transform .5s cubic-bezier(.215,.61,.355,1);}
.menu-item:hover::before, .menu-sec--b:hover::before {transform:scaleY(1); transform-origin:center bottom;}

.menu-secondaire svg, .menu-contact svg {width:1.5rem; margin-right:.07rem; height:auto; transition:.35s; position:absolute; right:var(--pad); transform:translateY(-50%); top:50%;}
.menu-secondaire .button-label, .menu-contact .button-label {transition:.3s cubic-bezier(0.38, 0.005, 0.215, 1); transform-style:preserve-3d;}

.menu-sec--a {position:relative; align-items:flex-end; border-radius:0 0 1.5rem 1.5rem; background:var(--orange); color:var(--noir); width:100%; height:15vh;
transition:.3s cubic-bezier(0.38, 0.005, 0.215, 1);}
.menu-sec--a:before, .menu-cta--contact:before {content:''; position:absolute; bottom:0; top:0; left:0; right:0; background-color:var(--noir); transition:opacity .35s cubic-bezier(.215,.61,.355,1); opacity:0;}
.menu-sec--a:hover::before, .menu-cta--contact:hover::before {opacity:.4;}
.menu-sec--a-wrapper {width:100%; padding:var(--pad); position:relative;}
.menu-sec--a svg, .menu-cta--contact svg {fill:var(--noir);}
.menu-sec--a:hover, .menu-cta--contact:hover {color:var(--beige);}
.menu-sec--a:hover svg, .menu-cta--contact:hover svg {fill:var(--beige);}

.menu-sec--b {border-radius:1.5rem; background:var(--noir); color:var(--beige); padding:var(--pad); position:relative; width:100%; transition:.3s cubic-bezier(0.38, 0.005, 0.215, 1);}
.menu-sec--b:hover, .menu-cta--tel:hover {color:var(--noir);}
.menu-sec--b:before {content:''; position:absolute; bottom:0; top:0; left:0; right:0; transform:scaleY(0); transform-origin:center top;
background-color:var(--blanc); transition:transform .5s cubic-bezier(.215,.61,.355,1);}
.menu-sec--b svg, .menu-cta--tel svg {fill:var(--beige);}
.menu-sec--b:hover svg, .menu-cta--tel:hover svg {fill:var(--noir);}

.menu-contact a {position:relative; align-items:flex-end; border-radius:1.5rem; padding:var(--pad) 7rem var(--pad) var(--pad);
transition:.3s cubic-bezier(0.38, 0.005, 0.215, 1);}
.menu-cta--contact {color:var(--noir);}
.menu-cta--tel {color:var(--beige); background:var(--noir);}
.menu-cta--tel:before {content:''; background-color:var(--blanc); position:absolute; bottom:0; top:0; left:0; right:0; transform:scaleY(0); transform-origin:center top; 
transition:transform .5s cubic-bezier(.215,.61,.355,1);}
.menu-cta--tel:hover::before {transform:scaleY(1); transform-origin:center bottom;}
.menu-cta--contact {background:var(--orange);}

.header.scroll .st1 {opacity:0; transform:translateX(100%);}
.header.scroll .menu, .header.scroll .menu-sec--a, .header.scroll .menu-sec--b {width:var(--menuscroll);}
.header.scroll .menu-sec--b {transition-delay:.05s;}
.header.scroll .menu-item, .header.scroll .menu-sec--a .button-label, .header.scroll .menu-sec--b .button-label {transform:translateX(-1.5rem); opacity:0; pointer-events:none;}
.header.scroll .menu-open {transform:translateY(-50%); opacity:1; pointer-events:auto; transition-delay:.05s;}

.menu-open {position:absolute; transform:translateY(-50%) translateX(100%); top:50%; padding:var(--pad) 0; width:var(--menuscroll); display:flex; flex-direction:column; align-items:center;
grid-gap:.5rem; right:0; cursor:pointer; transition:.3s cubic-bezier(0.38, 0.005, 0.215, 1); opacity:0; pointer-events:none;}
.menu-open .menu-bar, .menu-close .menu-bar {width:var(--pad); height:1px; background:var(--noir); transition:.35s;}
.menu-open:hover .menu-bar {width:var(--pads);}
.menu-open:hover .menu-bar:nth-child(2) {transition-delay:.05s;}

.menu-close {position:absolute; transform:translateY(-50%) translateX(1.5rem); top:50%; width:var(--menuscroll); height:var(--menuscroll); cursor:pointer; pointer-events:none;
left:calc(var(--menu) + var(--pad)); opacity:0; display: flex; align-items: center; flex-direction: column; justify-content: center; transform-style:preserve-3d;
transition:.3s cubic-bezier(0.38, 0.005, 0.215, 1);}
.menu-close:before {content:''; position:absolute; top:0; left:0; width:100%; height:100%; background:var(--beige); border-radius:7rem;
transform-style:preserve-3d; transition:.3s cubic-bezier(0.38, 0.005, 0.215, 1);}
.close .menu-close {transform:translateY(-50%); opacity:1; pointer-events:auto;}
.menu-close .menu-bar:nth-child(1) {transform:rotate(45deg);}
.menu-close .menu-bar:nth-child(2) {transform:rotate(-45deg);}
.menu-close:hover {transform:translateY(-50%) rotate(90deg);}
.menu-close:hover::before {transform:scale(.95);}

.menu-mobile {display:none;}
.menu-mobile {align-items:flex-end; color:var(--noir); border-radius:1rem; padding:1rem 1.5rem; width:9rem; background:var(--blanc); cursor:pointer;}
.menu-mobile:before {content:''; position:absolute; bottom:0; top:0; left:0; right:0; transform:scaleY(0); transform-origin:center top;
background-color:var(--beige); transition:transform .5s cubic-bezier(.215,.61,.355,1);}
.menu-mobile:hover::before {transform:scaleY(1); transform-origin:center bottom;}
.menu-mobile .menu-mobile--bar {transition:transform .3s cubic-bezier(.215,.61,.355,1);}
.menu-mobile.open .menu-mobile--bar {grid-gap:0; transform:rotate(180deg);}
.menu-mobile.open .menu-mobile--bar .menu-bar:nth-child(1) {transform:rotate(45deg) translateY(1px);}
.menu-mobile.open .menu-mobile--bar .menu-bar:nth-child(2) {transform:rotate(-45deg);}

.menu-mobile--close {display:none; pointer-events:none; position: fixed; top: var(--pad); right: var(--pad); z-index: 20; width: 9rem; height: 4.3rem; cursor: pointer;}
.menu-mobile--close.open {display:block; pointer-events:auto;}
.menu-mobile--wrapper {position:fixed; top:0; left:0; width:100%; height:100%; z-index:4; padding:8rem var(--pad) var(--pad) var(--pad);
transition:.3s cubic-bezier(0.38, 0.005, 0.215, 1); display:none; pointer-events:none;}
.menu-overlay--bg {position:absolute; top:0; left:0; width:100%; height:100%; z-index:4; background:rgba(6,5,6,0); transition:.3s cubic-bezier(0.38, 0.005, 0.215, 1);
pointer-events:none; z-index:-1;}
.menu-mobile--wrapper.open {pointer-events:auto;}
.menu-mobile--wrapper.open .menu-overlay--bg {background:rgba(6,5,6,0.85);}

.menu-mobile--principal {position:relative; display:flex; width:100%; flex-direction:column; grid-gap:5px; overflow: hidden;}
.menu-mobile--principal a {position:relative; background:var(--beige); padding:0 1.5rem; color:var(--noir); height: 100%; align-items: center; 
transform:translateX(-100%); transform-origin:left; transition: .3s cubic-bezier(0.38, 0.005, 0.215, 1); overflow:hidden;}
.menu-mobile--principal a:before {content: ''; background-color: var(--orange); position: absolute; bottom: 0; top: 0; left: 0; right: 0; transform: scaleY(0);
transform-origin: center top; transition: transform .5s cubic-bezier(.215,.61,.355,1);}
.menu-mobile--principal a:hover::before {transform:scaleY(1); transform-origin:center bottom;}
.menu-mobile--principal span {z-index:1; transition:.3s cubic-bezier(0.38, 0.005, 0.215, 1);}
.menu-mobile--principal.open a {transform:none;}

.menu-mobile--principal a:nth-child(2) {transition-delay:.03s;}
.menu-mobile--principal a:nth-child(3) {transition-delay:.06s;}
.menu-mobile--principal a:nth-child(4) {transition-delay:.09s;}
.menu-mobile--principal a:nth-child(5) {transition-delay:.12s;}
.menu-mobile--principal a:nth-child(6) {transition-delay:.15s;}
.menu-mobile--principal a:nth-child(7) {transition-delay:.18s;}
.menu-mobile--principal a:nth-child(8) {transition-delay:.21s;}
.menu-mobile--principal a:nth-child(9) {transition-delay:.24s;}
.menu-mobile--principal a:nth-child(10) {transition-delay:.27s;}
.menu-mobile--principal a:nth-child(11) {transition-delay:.3s;}

.menu-mobile--principal a.active:before {background-color: var(--blanc); transform:scaleY(1); transform-origin:center bottom;}

.menu-mobile--principal .last-child {border:1px solid var(--beige); background:transparent; color:var(--beige);}
.menu-mobile--principal .last-child:before {content:none;}

.background {position:fixed; top:0; left:0; width:100vw; height:100vh; z-index:0; background-size:cover; background-position:center center; pointer-events: none;
background-image:url('assets/img/background.jpg');}



/* CONTENU */

.first {opacity:0; transform:translate(4rem); transition:.7s cubic-bezier(0.38, 0.005, 0.215, 1);}
.is-ready .first {opacity:1; transform:none;}

.vertical-thumb.border-radius {border-radius:1.5rem 0 0 1.5rem;}
.vertical-thumb {position:relative; width:27vw; height:39vw; top:35vw;}
.vertical-thumb--img, .thumb-v--img, .thumb-h--img, .thumb-h-m--img {position:absolute; top:0; left:0; width:100%; height:100%; background-size:cover; background-position:center center;}

.thumb-v {position:relative; width:27vw; height:39vw;}
.thumb-h-m {position:relative; width:30vw; height:21vw;}
.thumb-h {position:relative; width:100%; height:25vw;}

.homepage.wrapper-justify { padding:var(--padl) 0 calc(var(--pad) + var(--padm)) calc(var(--menu) + var(--padl));}
.homepage .font-size--a, .homepage .direction {padding-right:var(--padl);}
.homepage .vertical-thumb {position:absolute; right:0;}

.clients .border-radius:nth-child(1) {background:var(--beige); color:var(--noir);}
.clients .border-radius:nth-child(2) {background:var(--orange); color:var(--noir);}
.clients .border-radius:nth-child(3) {background:var(--noir);}
.thumb {position:absolute; top:0; left:0; width:100%; height:100%; background-position:center center; background-size:cover;}

.competences-wrapper, .equipe-wrapper {grid-template-areas:". a b"  "c d e"  "f g ." ". h i" "j k ." ". . l";}

.item-competence {position:relative; overflow:hidden; color:var(--noir); width:26.4vw; height:25vw;}
.item-equipe {position:relative; overflow:hidden; color:var(--noir); width:26.4vw; height:32vw;}
.item-competence:before, .item-equipe:before {content:''; top:0; left:0; width:100%; height:100%; position:absolute; background:var(--beige); z-index:-1; border-radius:1.5rem;
transition:.3s cubic-bezier(0.38, 0.005, 0.215, 1); transform-style:preserve-3d;}
.item-competence:hover::before {background:var(--orange); transform:scale(.985);}
.competence-thumb{width:100%; height:14vw; position:relative;}
.competence-thumb--img, .equipe-thumb--img {position:absolute; top:0; left:0; width:100%; height:100%; background-size:cover; background-position:center center;
transition:.3s cubic-bezier(0.38, 0.005, 0.215, 1);}
.item-competence:hover .competence-thumb--img {transform:scale(1.05);}

.equipe-thumb {width:100%; height:21vw; position:relative;}


.competences-wrapper .item-competence:nth-child(1), .equipe-wrapper .item-equipe:nth-child(1) {grid-area: a;}
.competences-wrapper .item-competence:nth-child(2), .equipe-wrapper .item-equipe:nth-child(2) {grid-area: b;}
.competences-wrapper .item-competence:nth-child(3), .equipe-wrapper .item-equipe:nth-child(3) {grid-area: c;}
.competences-wrapper .item-competence:nth-child(4), .equipe-wrapper .item-equipe:nth-child(4) {grid-area: d;}
.competences-wrapper .item-competence:nth-child(5), .equipe-wrapper .item-equipe:nth-child(5) {grid-area: e;}
.competences-wrapper .item-competence:nth-child(6), .equipe-wrapper .item-equipe:nth-child(6) {grid-area: f;}
.competences-wrapper .item-competence:nth-child(7), .equipe-wrapper .item-equipe:nth-child(7) {grid-area: g;}
.competences-wrapper .item-competence:nth-child(8), .equipe-wrapper .item-equipe:nth-child(8) {grid-area: h;}
.competences-wrapper .item-competence:nth-child(9), .equipe-wrapper .item-equipe:nth-child(9) {grid-area: i;}
.competences-wrapper .item-competence:nth-child(10), .equipe-wrapper .item-equipe:nth-child(10) {grid-area: j;}
.competences-wrapper .item-competence:nth-child(11), .equipe-wrapper .item-equipe:nth-child(11) {grid-area: k;}
.competences-wrapper .item-competence:nth-child(11), .equipe-wrapper .item-equipe:nth-child(11) {grid-area: l;}

.item-competence:hover svg {fill:var(--noir); transform:rotate(45deg);}
.item-competence svg {fill:var(--orange);}

.page-content .flex {width:50%;}

.realisations {min-height:100vh; display:grid; grid-template-columns:1fr auto;}
.realisations .realisations-wrapper {position:relative; order:1;}
.realisations .font-size--c {position:sticky; writing-mode: vertical-lr; transform-origin:center center; order:2;}

.meta {display:flex; flex-direction:column; grid-gap:.3rem;}

.realisations-wrapper .col-2 img {width:100%; height:auto;}
.realisations-wrapper img {width:47rem; height:auto;}
.realisation-d img {order:2;}
.realisation-d .meta {order:1; text-align:right;}
.realisation-col2 {text-align:right; margin-top:18vw;}

.sticky {position:sticky; position: -webkit-sticky; top:var(--padl); align-self: start;}

.anchor {writing-mode:vertical-lr; transform-origin:center center; position:absolute; right:var(--padl); bottom:calc(var(--pad) + var(--padm));}
.anchor svg {transform:rotate(90deg);}
.anchor:hover svg {transform:rotate(135deg);}

.anchor .button-label>span:nth-child(2) {position:absolute; top:auto; bottom:auto; left:0; right:0;}
.anchor .button-label>span:nth-of-type(2) {transform:translate3d(calc(-100% - 1rem), 0, 0);}
.anchor:hover .button-label>span:nth-of-type(1), .anchor:focus .button-label>span:nth-of-type(1) {transform:translate3d(calc(100% + 1rem), 0, 0);}
.anchor:hover .button-label>span:nth-of-type(2), .anchor:focus .button-label>span:nth-of-type(2) {transform:translate3d(0, 0, 0);}

.anchor a:before {bottom:auto; left:-7px; width:1px; min-height:100%; height:100%; transform-origin:bottom; transform:scaleY(0);}
.anchor a:hover::before {transform-origin:top; transform:scaleY(1);}


.article h2:first-child {margin:0 0 2rem 0;}
.article h2 {margin:4rem 0 2rem 0;}
.article h3 {margin:4rem 0 2rem 0; position:relative;}
.article h3:before {position:absolute; content:''; width:100%; height:1px; background:var(--beige); left:0; bottom: -10px;}
.article a {color:var(--orange);}
.article a:before {bottom:-3px;}
.article ul {padding-left:2rem; display:flex; flex-direction:column; grid-gap:var(--padxs); margin:2rem 0;}
.article li {position:relative;}
.article li:before {position:absolute; border-radius:50%; height:10px; width:10px; content:''; left:-2rem; background-color:var(--orange); top:10px;}

.realisation-galerie {position:relative; height:auto; width:70vw; flex-direction:column; align-items:center; text-align:center;}

.galerie, .swiper-slide {position:relative; height:auto; width:100%;}
.galerie img {height:70vh; width:auto; object-fit: cover;}
.swiper-slide {display:flex!important; justify-content: center;}
.swiper-wrapper {align-items: center;}

.swiper-slide.swiper-slide-active img {transform:none; filter: blur(0); opacity:1;}
.swiper-slide img{transform: scale(.9) rotate(5deg); filter: blur(1rem); opacity:0; 
transition:opacity .6s cubic-bezier(.215,.61,.355,1), transform .6s cubic-bezier(.215,.61,.355,1), filter .6s cubic-bezier(.215,.61,.355,1);}

.nav-btn {display:flex; justify-content:center; align-items:center; position:absolute; white-space:nowrap; cursor:pointer; border-radius:50%; overflow:hidden;
transform-origin:center center; background:var(--orange); box-sizing:border-box; z-index:5; top:50%; transform:translateY(-50%);}
.nav-btn div {display:flex; align-items:center; justify-content:center; width:var(--padm); height:var(--padm); position:relative;}
.nav-btn svg {fill:var(--noir); width:.7rem;}
.nav-btn.swiper-button-disabled {pointer-events:none; transform:translateY(-50%) scale(.8); opacity:0;}
.nav-btn:before {content:''; position:absolute; inset:0; bottom:0; top:0; left:0; right:0; background-color:var(--noir);
transition:opacity .35s cubic-bezier(.215,.61,.355,1); opacity:0;}
.nav-btn:hover::before{opacity:.4;}
.nav-left {left:0;}
.nav-left svg {transform:rotate(90deg);}
.nav-right {right:0;}
.nav-right svg {transform:rotate(-90deg);}

.nav-btn .text {position:relative;}
.nav-btn .hover, .nav-btn .text {transition:all .5s var(--ease); pointer-events:none; text-align: left;}
.nav-btn .hover {width:100%; height:100%; position:absolute; top:0; left:0; transform:translateY(100%) skewY(-10deg); opacity:0; display:flex; align-items: center; justify-content: center;}
.nav-btn {text-align:center; max-width:-webkit-max-content; max-width:-moz-max-content; max-width:max-content;}

.nav-btn:hover .text {opacity:0; transform:translateY(-100%) skewY(10deg);}
.nav-btn:hover .hover {opacity:1; transition-delay:.05s; transform:translateY(0); opacity:1;}

.galerie-pagination {position:relative;}

.annonces {position: fixed; display: flex; bottom:0; left:0; width:100vw; height:3.5rem; background:var(--beige); z-index:5;}
.annonces-line {transition:.3s; animation-direction:reverse; animation-delay:-3s; flex-shrink:0; display:flex; align-items:center; justify-content:space-around; width:100%; animation:marquee 25s linear infinite;}
.annonce-item {height:100%; width:100%; padding:0 var(--pad); position:relative; overflow:hidden; color:var(--noir); display: flex; align-items: center; justify-content: center; border-right:1px solid var(--noir);}
.annonce-item:before {content:''; position:absolute; bottom:0; top:0; left:0; right:0; transform:scaleY(0); transform-origin:center bottom;
background-color:var(--orange); transition:transform .5s cubic-bezier(.215,.61,.355,1);}
a.annonce-item:hover::before {transform:scaleY(1); transform-origin:center top;}
.annonce-item span {z-index:1; white-space: nowrap;}
@keyframes marquee {from {transform: translateX(0);} to {transform: translateX(-100%);}}



/* CONTACT */

.formulaire .orangetxt {margin-left:3px;}
.form-item--message {margin-bottom:0!important;}

.form-item {display:flex; flex-direction:column; grid-gap:1rem;}
input, textarea {font-family:'regular', sans-serif; font-weight:400; color:var(--beige); font-size:inherit; border:0;}
.formulaire label {display: flex;}
.formulaire input, .formulaire textarea, .mailerlite-form input, .select-selected  {width:100%; border-bottom:1px solid var(--beige); padding-bottom:1rem; background:transparent;
transition:.3s;}
.formulaire input, .select-selected {;}
.formulaire textarea {;}
.formulaire input:focus, .formulaire textarea:focus, .select-selected:hover, 
.mailerlite-form input:hover, .mailerlite-form input:focus {background:transparent; border-bottom:1px solid var(--orange);}
.formulaire textarea {resize: none; height:100%;}
.formulaire button[type="submit"] {position:relative;}

button[type="submit"] {position:relative; font-family:inherit; background: none;}

.wpcf7-checkbox {display:inline-block;}
.wpcf7-form input[type="radio"], .wpcf7-form input[type="checkbox"] {display: none;}
.wpcf7-list-item-label {cursor:pointer; padding-left: 2rem; position:relative;}

.wpcf7-radio {display:flex; column-gap:3rem; row-gap:1rem; margin-bottom:0; flex-wrap: wrap;}
.wpcf7-form input[type="radio"] + .wpcf7-list-item-label::before, .wpcf7-form input[type="checkbox"] + .wpcf7-list-item-label::before {position: absolute; top:4px; left:0; background: none;
background:var(--beige); border:0; border-radius:50%; display:inline-block; vertical-align:middle; height:20px; width:20px; content:''; transition:.2s;}
.wpcf7-form input[type="radio"]:checked + .wpcf7-list-item-label::before, .wpcf7-form input[type="checkbox"]:checked + .wpcf7-list-item-label::before {background:var(--orange);}
.formulaire .acceptance {margin-bottom:calc(var(--pads) + 2rem);}

::-webkit-input-placeholder {opacity:.3; -webkit-transition: opacity .4s; transition: opacity .4s;}
:-moz-placeholder {opacity:.3; -moz-transition: opacity .4s; transition: opacity .4s;}
::-moz-placeholder {opacity:.3; -moz-transition: opacity .4s; transition: opacity .4s;}
:-ms-input-placeholder {opacity:.3; -ms-transition: opacity .4s; transition: opacity .4s;}
::placeholder {opacity:.3; transition: opacity .4s;}

*:focus::-webkit-input-placeholder {opacity:.3;}
*:focus:-moz-placeholder {opacity:.3;}
*:focus::-moz-placeholder {opacity:.3;}
*:focus:-ms-input-placeholder {opacity:.3;}
*:focus::placeholder {opacity:.3;}

:invalid {box-shadow: none;}
:-moz-submit-invalid {box-shadow: none;}
:-moz-ui-invalid {box-shadow:none;}

.wpcf7-not-valid {border-bottom:1px solid var(--orange)!important;}
.wpcf7-not-valid.wpcf7-radio {border-bottom:0!important;}
.wpcf7-acceptance.wpcf7-not-valid {border:0!important;}
.screen-reader-response, .wpcf7-response-output {display:none;}
.wpcf7-not-valid-tip, .mailerlite-form-error {color: var(--orange); font-size: .8rem; width: 100%; position:relative; display: block; margin-top:0;}
.mc4wp-alert.mc4wp-success {font-size: .8rem; margin-top:1.5rem; text-align: center;}

.cmplz-cookiebanner .cmplz-message img {width:70px; height:70px; margin-left: 1.5rem;}
.spindown {-webkit-animation:spindown 8s linear infinite; -moz-animation:spindown 8s linear infinite; animation:spindown 8s linear infinite;}
@-moz-keyframes spindown {100% {-moz-transform: rotate(360deg);}}
@-webkit-keyframes spindown {100% {-webkit-transform: rotate(360deg);}}
@keyframes spindown {100% {-webkit-transform: rotate(360deg); transform:rotate(360deg);}}

.mailerlite-form-inputs {position:relative;}
.mailerlite-subscribe-submit svg {fill:var(--orange); transition:.3s;}
.mailerlite-subscribe-submit:hover svg {fill:var(--bleu);}
.mailerlite-form .mailerlite-subscribe-button-container {text-align:center; position: absolute; top:1px; right:1px;}
.mailerlite-subscribe-submit {padding:1.5rem; background:var(--blanc)!important;}
.mailerlite-form-response {margin-top: 0!important; display: none; text-align:right!important; color: #00a154;}



/* FOOTER */

.logos img {width:120px; height:120px;}

.footer {padding:var(--padl) var(--padl) var(--padl) calc(var(--menuscroll) + var(--padl)); height:calc(var(--menuscroll) + var(--padl)); align-items: center;}

.marsrouge svg {height:auto; width:40px; position:relative; fill:var(--beige); transition:.35s;}
.marsrouge:hover svg {fill:var(--orange);}
.marsrouge:before {content:none!important;}



/* RESPONSIVE DESIGN */

@media screen and (max-width:1920px) {
	
	.font-size--a {font-size:6.2vw;}
	
}



@media screen and (max-width:1590px) {
	
	:root {
	--menu: 18.5rem;
	--menuscroll: 5rem;
	}
	
	body, .font-size--e {font-size:1.2rem; line-height:1.4;}
	.font-size--b {line-height: 1.1;}
	.font-size--s {font-size:.9rem;}
	
	.col-4 {grid-template-columns:1fr 1fr;}
	
	.menu-open .menu-bar, .menu-close .menu-bar {width: 1.5rem;}
	.menu-logo svg {width:6.5rem;}
	.menu-item svg, .btn svg, .item-competence svg {width:.5rem;}
	.item-competence svg {margin-bottom: .3rem;}
	.contact-link {height:auto;}
	.contact-link svg, .contact-tel svg {width:1.3rem;}
	
	.menu-contact a {padding:1.5rem 7rem 1.5rem var(--pad);}
	.menu-secondaire svg, .menu-contact svg {width:1.3rem; margin-right:0;}
	.menu-sec--a {height:100%;}
	
	.article li:before {top:8px;}
	.wpcf7-form input[type="radio"] + .wpcf7-list-item-label::before, .wpcf7-form input[type="checkbox"] + .wpcf7-list-item-label::before {height:17px; width:17px;}
	
}



@media screen and (max-width:1290px) {

	.font-size--s, .btn, .article h3 {font-size: .9rem;}
	
	.wrapper-justify.first {padding: calc(var(--padl) + var(--pad)) var(--padl) calc(var(--pad) + var(--padm)) calc(var(--menu) + var(--padl));}
	.content-30, .content-45 {width:60%;}
	
	.competence-thumb {height:12rem;}
	.item-competence {height:21rem;}
	.item-equipe {height:24rem;}
	
	.thumb-v {width: 25vw; height: 25rem;}
	.realisations-wrapper img {width: 40rem;}
	
	.footer-grid .col-2 {grid-template-columns: 1fr;}
	.footer-grid .col-2 .wrapper-l {order:2;}
	.footer-grid .col-2 .relative {height:30rem; order:1;}
	.footer-grid .noir {border:1px solid var(--beige); background:transparent;}
	
	.clients {grid-template-columns: 1fr;}
	.clients .border-radius {grid-gap:var(--pads);}
	.clients .border-radius:nth-child(3) {border:1px solid var(--beige);}
	.logos {grid-gap:3rem;}
	.logos img {width: 100px; height: 100px;}
	
}



@media screen and (max-width:1090px) {
	
	:root {
	  --menu:3rem;
	  --menuscroll:3rem;
	  --padxxs:.5rem;
	  --padxs: 1rem;
	  --pads:1.5rem;
	  --pad:2rem;
	  --padm:3rem;
	  --padl:5rem;
	}
	
	html, body {overflow-x:hidden;}
	
	.logo-mobile {z-index:10; position:fixed; top:var(--pad); left:var(--pad); display:flex; transform: translateY(-100%); transition: .3s cubic-bezier(0.38, 0.005, 0.215, 1);}
	.is-ready .logo-mobile {transform:none;}
	.logo-mobile svg {width:6.5rem;}
	.st1 {fill:var(--beige);}
	.header {display:none;}
	.menu-contact {right: calc(9rem + var(--pad));}
	.menu-contact a {padding: 1rem 6rem 1rem var(--pad);}
	.menu-mobile {position:fixed; display:flex; top:var(--pad); right:var(--pad); z-index:10; pointer-events:none; transform:translateY(-100%);
	transition:.3s cubic-bezier(0.38, 0.005, 0.215, 1); transition-delay:.05s;}
	.menu-mobile .button-label {width:100%; align-items: center;}
	.menu-mobile--bar {flex-direction: column; align-items: center; grid-gap: .5rem;}
	.menu-bar { width:1.5rem; height:1px; background:var(--noir); transition:.35s;}
	.menu-mobile--wrapper {display:flex;}
	
	.anchor {right: var(--pad); bottom: var(--pad);}
	
	.font-size--a {font-size: 7vw;}
	.font-size--b {font-size:1.6rem; line-height: 1.2;}
	
	.border-radius, .menu-contact a, .swiper-slide img {border-radius: 1rem;}
	
	.second {transform:translateY(2rem); opacity:0; transition: .3s cubic-bezier(0.38, 0.005, 0.215, 1);}
	.is-ready .second  {transform:none; opacity:1; transition-delay:.3s;}
	
	.grid-padl {grid-gap:var(--padl);}
	.wrapper-justify.first, .wrapper.first {padding:10rem var(--padm) var(--padm) var(--padm);}
	.wrapper {padding:var(--padl) var(--padm);}
	.wrapper-50 {padding: var(--padl) 0;}
	.wrapper-nt-nb {padding:0 var(--padm) 0 var(--padm);}
	.wrapper-nb {padding: var(--padl) var(--padm) 0 var(--padm);}
	.wrapper-nt {padding: 0 var(--padm) var(--padl) var(--padm);}
	.page-content {padding:var(--padl) var(--padm);}
	.page-content .flex {width:100%;}
	.page-content .grid-padm {grid-gap:var(--pads);}
	
	.realisations {padding: 0 var(--padm) var(--padl) var(--padm);}
	.realisations-wrapper .flex {flex-direction:column;}
	.realisations-wrapper img {width: 100%;}
	.realisation-d {flex-direction: column-reverse!important;}
	.realisation-c .meta, .realisation-g .meta {text-align:right;}
	.sticky {top:9rem;}
	
	.content-50 {width:70%;}
	
	.homepage .font-size--a {width:80%;}
	.homepage .font-size--b {width:50%;}
	.vertical-thumb {width: 30vw; height: 45vw; top: 40vw;}
	
	.competences-wrapper, .equipe-wrapper {grid-template-areas:"a b" "c d" "e f" "g h" "i j""k ." ". l";}
	.item-competence, .item-equipe {width:calc(44.9vw - 1rem);}
	.item-competence {height:19rem;}
	.competence-thumb {height: 10rem;}
	.item-equipe {height: 27rem;}
	.equipe-thumb {height: 17rem;}
	
	.formulaire .col-2 {grid-template-columns: 1fr; grid-gap:var(--padm);}
	.formulaire .row-gapm {row-gap:var(--padm);}
	.formulaire textarea {height: 10rem;}
	
	.page-entreprise .itemstbottom {flex-direction:column; align-items: flex-start; grid-gap:var(--padm);}
	.page-entreprise .content-40 {width:100%;}
	.page-entreprise .alignbottom .thumb-h-m {order:1;}
	.page-entreprise .alignbottom .content-30 {order:2;}
	.page-entreprise .alignbottom .aligncenter {flex-direction:column; align-items: center; grid-gap:var(--padm); text-align:center;}
	.page-entreprise .alignbottom .aligncenter .wrapper-btn {justify-content: center;}
	.thumb-v {width:35%; height:25rem;}
	.thumb-h-m {width: 25rem; height: 18rem;}
	
	#venir-nous-voir {grid-template-columns: 1fr;}
	#venir-nous-voir .relative {order:1;}
	#venir-nous-voir .border-beige {order:2;}
	
	.realisation-galerie {width:79.3vw;}
	.nav-btn {top: auto; transform: none; bottom: -5rem;}
	.nav-btn.swiper-button-disabled {transform:scale(.5);}
	
	.article.content-60 {width:100%;}
	.article h3 {margin:4rem 0 2rem 0;}
	
	.clients .border-radius {padding:var(--padm);}
	.logos {grid-gap:var(--padm); padding-top: var(--padm);}
	.logos img {width: 90px; height: 90px;}
	
	.col-4.grid-padl .grid-padm {grid-gap:var(--pad);}
	
	.footer {padding:0 var(--padm); height:10rem;}
	.footer-grid .col-2 .relative, #venir-nous-voir .relative {height:23rem;}
	.footer-grid .col-2 .border-radius {grid-gap:var(--padm);}
	
	.swiper-slide {align-items: center;}
	.realisations-wrapper img {height: fit-content;}
	
	.annonces {bottom:5rem; height:2rem; z-index:2; border-top:1px solid var(--noir); border-bottom:1px solid var(--noir);}
	.annonces-line {width:auto;}
	
}



@media screen and (max-width:790px) {
	
	body, .font-size--e {font-size: 1rem; line-height: 1.3;}
	.font-size--b {font-size: 1.4rem; line-height: 1.1;}
	.font-size--a, .font-size--c, .realisations .font-size--c {font-size: 2.3rem; line-height: 1;}
	.font-size--d {font-size:.8rem; line-height:1.3;}
	.font-size--s, .btn, .article h3 {font-size: .8rem;}
	
	.article h2 {font-size:1.2rem; margin: 3rem 0 2rem 0;}
	.article h3 {line-height:1.3; margin: 3rem 0 2rem 0;}
	.article li::before {top: 5px;}
	
	.underline a::before, button::before {bottom: -2px;}
	
	.menu-mobile {padding:.7rem 1rem; width: 7rem;}
	.menu-mobile--close {width: 7rem; height: 2.7rem;}
	.menu-bar {width: 1.2rem;}
	.menu-mobile--bar {grid-gap:.4rem;}
	.menu-mobile--wrapper {padding: 8rem var(--padxs) 5rem var(--padxs);}
	.menu-contact {right: var(--padxs); top: auto; bottom: var(--padxs); left: var(--padxs); transform: translateY(100%);}
	.menu-contact a {width:50%; padding:1rem;}
	.menu-contact svg {width:1.2rem; right:1rem;}
	
	.height-100 {height:auto;}
	
	.grid-padm, .grid-padl, .grid-padxl {grid-gap:var(--pad);}
	.wrapper-justify.first, .wrapper.first {padding: 10rem var(--pad) var(--padm) var(--pad);}
	.wrapper {padding: var(--padm) var(--pad);}
	.wrapper-nt-nb {padding: 0 var(--pad);}
	.wrapper-nb {padding: var(--padm) var(--pad) 0 var(--pad);}
	.wrapper-l {padding:2.5rem;}
	.wrapper {padding: var(--padm) var(--pad);}
	.wrapper-50 {padding: var(--pad) 0;}
	.page-content {padding:var(--padm) var(--pad);}
	.realisations {padding: 0 var(--pad) var(--padm) var(--pad);}
	.wrapper-nt {padding: 0 var(--pad) var(--padm) var(--pad);}
	
	.col-2, .col-4 {grid-template-columns: 1fr;}
	
	.homepage {align-items: flex-end;}
	.homepage .vertical-thumb {position: relative; right: 0; transform:none!important; top:auto; margin-top: 2rem;}
	.thumb-v, .vertical-thumb {width: 70%; height: 20rem;}
	.thumb-h-m {width: 100%; height: 15rem;}
	.homepage .font-size--a, .homepage .font-size--b, .content-70, .content-80, .content-50, .content-30, .content-45 {width: 100%;}
	.homepage .font-size--a, .homepage .direction {padding-right: 0;}
	.vertical-thumb.border-radius {border-radius: 1.5rem;}
	
	.competences-wrapper, .equipe-wrapper {grid-template-areas:"a" "b" "c" "d" "e" "f" "g" "h" "i" "j" "k" "l";}
	.item-competence, .item-equipe {width: 100%;}
	.item-competence {height: 22rem;}
	.competence-thumb {height:12rem;}
	.menu-item svg, .btn svg, .item-competence svg {width:.6rem;}
	
	.anchor {display:none;}
	.realisations {min-height: auto; display: grid; grid-template-columns: 1fr;}
	.realisations .realisations-wrapper {grid-gap: var(--padl);}
	.realisations .font-size--c {position: relative; writing-mode: initial; order: 1; opacity: 1 !important; top: 0; padding: var(--padm) 0 var(--padxs) 0;}
	.realisations-wrapper .flex {grid-gap:.5rem;}
	.realisation-col2 {margin-top: 0;}
	.realisations-wrapper .col-2 {grid-gap:var(--padl);}
	.meta {align-items: flex-end;}
	
	.realisation-galerie {width: calc(100vw - var(--pad) - var(--pad));}
	.galerie-pagination {margin-top: 1rem;}
	.realisation-galerie .meta {width: 70%; align-items:center;}
	.nav-btn {bottom: -3.5rem;}
	.nav-btn div {width: var(--pad); height: var(--pad);}
	.realisations-wrapper img {width: 100%; height: auto; object-fit: contain;}
	.swiper-slide {height: auto;}
	
	.footer {padding: var(--pad) var(--pad) 6rem var(--pad); height: auto; flex-direction:column; grid-gap:var(--pad);}
	.footer-grid .col-2 .relative, #venir-nous-voir .relative {height: 15rem;}
	.clients .border-radius {padding: var(--pad);}
	.footer-grid .col-2 .border-radius {grid-gap: var(--pad);}
	.footer-links {flex-direction: column; align-items: center; grid-gap:.7rem;}
	.pre-footer {align-items:center;}
	.logos {width:60%; flex-direction: column; display: grid; grid-template-columns: 1fr 1fr; justify-content: center; justify-items: center;}
	
	.wpcf7-radio {row-gap: .8rem; flex-direction: column;}
	.wpcf7-form input[type="radio"] + .wpcf7-list-item-label::before, .wpcf7-form input[type="checkbox"] + .wpcf7-list-item-label::before {top: 2px;}
	
}