@font-face{font-family:"Silk";src:url("/polices/silk.woff2") format("woff2");font-display:swap}
@font-face{font-family:"Silk Regular";src:url("/polices/silk-regular.woff2") format("woff2");font-display:swap}
@font-face{font-family:"Proba";src:url("/polices/proba.woff2") format("woff2");font-display:swap}
@font-face{font-family:"Burford";src:url("/polices/burford-fr.woff2") format("woff2");font-display:swap}
@font-face{font-family:"Hellios";src:url("/polices/hellios.woff2") format("woff2");font-display:swap}

:root{
  --ombre:#191f08;
  --alpinia:#475848;
  --philo:#6b7e6c;
  --beton:#eeece6;
  --blanc:#fff;
  --encre:#2b2f2b;
  --papier:#fffdf9;
  --texte:"Proba",Helvetica,Arial,sans-serif;
  --titre:"Silk",Helvetica,Arial,sans-serif;
  --menu:"Burford",Helvetica,Arial,sans-serif;
  --script:"Hellios",Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--texte);font-size:14px;line-height:1.7;font-weight:500;color:var(--ombre);background:var(--beton);-webkit-font-smoothing:antialiased}
a{color:var(--philo);text-decoration:none}
.evitement{position:fixed;z-index:90;left:10px;top:-60px;background:var(--blanc);color:var(--ombre);font-family:var(--menu);font-size:17px;padding:6px 16px;border-radius:66px}
.evitement:focus{top:10px}
strong,b{font-weight:700}
h1,h2,h3,h4{font-family:var(--titre);font-weight:500;margin:0;padding-bottom:10px;line-height:1em;color:var(--ombre)}
h1{font-size:45px}
h3{font-size:28px}
p{margin:0;padding-bottom:1em}
p:last-of-type{padding-bottom:0}
.invisible{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* Menu */
.menu{position:fixed;z-index:50;left:50%;bottom:1vh;transform:translateX(-50%);display:flex;justify-content:center;gap:12px;padding-bottom:15px;white-space:nowrap}
.pilule{position:relative;display:block;background:var(--blanc);color:var(--ombre);font-family:var(--menu);font-size:17px;line-height:1.7;padding:0 10px 4px;border-radius:66px;transition:color .3s,background-color .3s}
.pilule:hover,.pilule:focus-visible{background:var(--alpinia);color:var(--beton)}
.pilule::after,.menu-bouton::after{content:"";position:absolute;inset:-6px 0}
.capsule{display:flex}
.capsule .pilule:first-child{border-radius:66px 0 0 66px}
.capsule .pilule:last-child{position:relative;border-radius:0 66px 66px 0}
.capsule .pilule:last-child::before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:1px;background:rgba(25,31,8,.22)}
.menu-bouton{display:none;position:fixed;z-index:50;left:50%;bottom:8px;transform:translateX(-50%);border:0;cursor:pointer;background:var(--blanc);color:var(--ombre);font-family:var(--menu);font-size:21px;line-height:1.7;padding:0 21px 4px;border-radius:100px}
.menu-fond{position:fixed;z-index:60;inset:0;background:rgba(0,0,0,.55);backdrop-filter:saturate(180%) blur(5px)}
.menu-mobile{position:fixed;z-index:70;inset:10px;background:var(--beton);overflow:auto;padding-top:25vh;text-align:center}
.menu-mobile[hidden],.menu-fond[hidden]{display:none}
.menu-mobile a{display:table;margin:0 auto;font-family:var(--menu);font-size:25px;line-height:1.7;color:var(--ombre);padding:7.5px 25px;border-radius:66px}
.menu-mobile a:hover{text-decoration:underline}
.capsule-mobile{display:block;width:250px;max-width:86%;margin:6px auto;background:var(--blanc);border-radius:40px;padding:4px 0 6px}
.capsule-mobile a{padding:.1em 25px .25em}
.capsule-mobile a:last-child{position:relative;display:block}
.capsule-mobile a:last-child::before{content:"";position:absolute;top:0;left:19%;width:62%;height:1px;background:rgba(25,31,8,.22)}
.menu-fermer{position:absolute;top:10px;right:14px;background:none;border:0;cursor:pointer;font-size:60px;line-height:1;color:#5a5f4f;padding:4px 8px}
@media (max-width:980px){
  .menu{display:none}
  .menu-bouton{display:block}
}

/* Fiche projet */
.heros{height:100vh;background-size:cover;background-position:50% 0;background-attachment:fixed}
.projet{background:var(--beton);padding:3% 0 10%}
.retour-portfolio{display:flex;align-items:center;gap:4px;width:fit-content;min-height:44px;margin-left:max(10%,calc(50% - 540px));color:var(--alpinia);font-family:var(--menu);font-size:15px}
.retour-portfolio:hover{text-decoration:underline}
.ligne{position:relative;width:80%;max-width:1080px;margin:0 auto;padding:2% 0;display:flex;gap:5.5%}
.ligne.ligne-serree{padding-bottom:13px}
.colonne{flex:1 1 0;min-width:0}
.texte{padding-top:var(--retrait,0);margin-top:var(--marge,0)}
.projet .texte{font-size:16px}
.texte a,.volet-texte a{color:var(--alpinia);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.colonne>*:not(:last-child){margin-bottom:2.75%}
.galerie{position:relative}
.galerie-photo{display:block;cursor:zoom-in}
.galerie-photo img{display:block;width:100%;height:auto;transition:.5s ease-in-out}
@media (min-width:1350px){
  .ligne{padding:27px 0}
  .ligne.ligne-serree{padding-bottom:13px}
}
@media (max-width:980px){
  body:not(.page-accueil){padding-top:10px}
  .projet{padding:3% 0 0}
  .ligne{flex-direction:column;gap:0;padding:30px 0}
  .ligne.ligne-serree{padding-bottom:13px}
  .colonne>*:not(:last-child){margin-bottom:30px}
  .ligne-deux .colonne:first-child{margin-bottom:30px}
}
@media (max-width:767px){
  .heros{height:80vh}
  .projet{padding:5% 0 0}
  .ligne-large{width:90%}
  .texte{padding-top:var(--retrait-mobile,var(--retrait,0))}
  .titre-centre-mobile h1{text-align:center}
  .centre-mobile,.centre-mobile h3{text-align:center}
  h3{font-size:27px}
}

/* Portfolio */
.portfolio-ecran{padding-bottom:20px}
.portfolio-titre{width:30%;min-width:0;margin:0 auto;padding:20px 20px 10px;font-family:"Silk Regular",var(--titre);font-size:24px;line-height:28px;font-weight:400;text-align:center}
.portfolio-corps{padding:calc((100vw - 24px)*.02) 12px calc((100vw - 24px)*.2)}
.filtres{display:flex;flex-wrap:wrap;justify-content:center;margin-bottom:30px}
.filtre{background:none;border:0;cursor:pointer;padding:8px;margin:0 5.5px;font-family:var(--texte);font-size:17px;line-height:23.8px;font-weight:500;text-transform:uppercase;color:var(--ombre)}
.filtre:first-child{margin-left:0}
.filtre:last-child{margin-right:0}
.filtre.actif{color:var(--alpinia)}
.grille-projets{display:grid;grid-template-columns:repeat(3,1fr);gap:12px 25px}
.carte-projet{position:relative;display:block}
.carte-projet[hidden]{display:none}
.carte-projet img{display:block;width:100%;height:auto;aspect-ratio:var(--ratio)}
.carte-projet span{position:absolute;left:0;right:0;bottom:0;padding:13px;text-align:center;font-family:var(--menu);font-size:25px;line-height:25px;font-weight:400;color:var(--ombre)}
@media (max-width:1024px){
  .portfolio-titre{width:47%}
  .grille-projets{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:767px){
  .portfolio-titre{width:82%;padding:20px 20px 30px;font-size:18px;line-height:1.3}
  .portfolio-corps{padding:0 12px calc((100vw - 24px)*.2)}
  .grille-projets{grid-template-columns:1fr}
}

/* Mentions légales */
.legale{background:var(--beton);padding:54px 0}
.legal-titre h1{font-size:30px;line-height:1.3;font-weight:300;text-align:center;padding-bottom:10px;margin-bottom:-8px}
.legal{color:#000;font-weight:300}
.legal h2{font-size:22px;line-height:1.5}
.legal h3{font-family:var(--menu);font-weight:600;font-size:24px;line-height:1}
.legal ul{margin:0;padding:0 0 23px 1em;list-style-position:inside;line-height:26px}
.legal strong{font-weight:700}

@media (max-width:980px){.legale{padding:50px 0}}

/* Vidéos QR */
.page-qr{min-height:100vh}
.qr{width:80%;max-width:1080px;margin:0 auto;padding:81px 0}
.qr video{display:block;width:100%;height:auto}
@media (max-width:980px){.qr{padding:80px 0}}

/* Visionneuse */
.visionneuse{position:fixed;z-index:80;inset:0;background:rgba(11,11,11,.8);display:flex;align-items:center;justify-content:center;touch-action:pan-y}
.visionneuse img{display:block;max-width:calc(100% - 16px);max-height:100vh;width:auto;height:auto;padding:40px 0}
.visionneuse button{position:absolute;background:none;border:0;color:#fff;cursor:pointer;opacity:.65;font:inherit;padding:0}
.visionneuse button:hover{opacity:1}
.visionneuse-fermer{top:0;right:6px;font-size:44px!important;line-height:44px!important;width:44px;height:44px}
.visionneuse-prec,.visionneuse-suiv{top:50%;margin-top:-30px;width:60px;height:60px}
.visionneuse-prec{left:0}
.visionneuse-suiv{right:0}
.visionneuse button svg{width:26px;height:40px;stroke:currentColor;stroke-width:3;fill:none}
.visionneuse-compte{position:absolute;right:8px;bottom:26px;color:#ccc;font-size:12px;line-height:18px}

/* Pied de page */
.pied{background:var(--alpinia);min-height:100vh;overflow:hidden}
.pied-marque{width:80%;max-width:1080px;margin:0 auto;padding-top:3%}
.lottie{width:80%;margin:0 auto 2.75%;aspect-ratio:1920/578}
.pied-marque p{font-family:var(--script);font-size:34px;line-height:2.1;color:var(--beton);text-align:center;margin-top:-10%;margin-bottom:2.3%;padding:0}
.instagram{display:grid;grid-template-columns:repeat(10,1fr);gap:10px;padding:26px 0 22px}
.instagram a{position:relative;display:block;aspect-ratio:1}
.instagram img{display:block;width:100%;height:100%;object-fit:cover}
.instagram svg{position:absolute;top:8px;right:8px;width:18px;height:18px;color:rgba(255,255,255,.9)}
.pied-liens{width:920px;max-width:100%;margin:0 auto;padding:1% 25px 0;display:flex;justify-content:space-around}
.pied-liens a{font-family:var(--menu);font-size:17px;line-height:1.7;color:var(--beton);padding:0 10px 4px;border-radius:66px;white-space:nowrap;transition:color .3s,background-color .3s}
.pied-liens a:hover{background:var(--ombre)}
@media (max-width:980px){
  .pied-liens{justify-content:center;padding-left:20px;padding-right:0}
}
@media (max-width:767px){
  .pied{min-height:0;padding:15% 0 25%}
  .pied-marque{width:100%;padding-top:3%}
  .lottie{width:100%;margin-bottom:30px}
  .pied-marque p{font-size:17px;line-height:1;margin-top:-16%}
  .instagram{display:none}
  .pied-liens{width:100%;padding:7% 25px 0;display:block;text-align:center}
  .pied-liens a{display:table;margin:0 auto;font-size:14px}
}

/* Pages à écrans */
.page-ecrans{transition:background-color .3s}
.ecran{min-height:100vh;display:flex;flex-direction:column;justify-content:center}
.colonne-page{width:100%;max-width:1140px;margin:0 auto;padding:10px;display:flex;flex-direction:column;align-items:center}
.script{font-family:var(--script);font-weight:400;text-align:center;padding:0;margin:0 0 20px}
h1.script{font-size:40px;line-height:40px;color:var(--alpinia)}
.script-petit{font-size:32px;line-height:32px;color:var(--ombre)}
.page-ecrans p{font-weight:400}
.contact-texte,.volet-texte,.ecran-texte{line-height:23.8px}
.ecran a{color:var(--alpinia)}
.contact-texte{width:60%;margin-bottom:33.6px;font-size:16px;text-align:center}
.contact-texte p:not(:last-child){padding-bottom:16px}
.volets{width:60%;padding-top:34px}
.volet{background:var(--blanc);margin-bottom:20px}
.volet summary{list-style:none;display:flex;justify-content:space-between;align-items:center;cursor:pointer;padding:15px;font-family:var(--menu);font-size:23px;line-height:26px;font-weight:400;color:var(--ombre)}
.volet summary::-webkit-details-marker{display:none}
.volet-signe{position:relative;width:12px;height:12px;flex:none}
.volet-signe::before,.volet-signe::after{content:"";position:absolute;left:0;top:5px;width:12px;height:2px;background:var(--ombre)}
.volet-signe::after{transform:rotate(90deg)}
.volet[open] .volet-signe::after{display:none}
.volet-texte{padding:0 15px 15px;font-size:14px}
.agence{box-sizing:content-box;padding-bottom:10%}
.agence .colonne-page{margin:5px auto}
.agence h1.script{font-size:41px;line-height:100px;color:var(--beton)}
.agence-texte{width:80%;margin:9px 0 45px;font-size:15px;line-height:20px;color:var(--beton);text-align:center}
.agence-texte p:not(:last-child){padding-bottom:15px}
.agence-texte a,.agence-texte strong{color:var(--beton)}
.colonne-etroite{padding:0 12px;text-align:center}
.page-recrutement .script-petit{padding-bottom:4%}
.ecran-texte{margin-bottom:20px}
.sans-fin .fin-page{display:none}
.sans-fin .ecran-pied{padding-bottom:10px}
.ecran-texte{font-size:15px}
.ecran-texte p:not(:last-child){padding-bottom:15px}
.ecran-pied{min-height:100vh;padding:10px 10px 30px;display:flex;flex-direction:column;background:transparent}
.pied-integre{padding:14px 0 27px;min-height:calc(100vh + 14px)}
.pied-integre .pied-marque{padding-top:4%;max-width:1080px;width:100%}
.pied-integre .pied-marque p{color:var(--beton)}
.pied-integre .lottie{margin-bottom:calc(2.75% - 1px)}
.pied-signature{display:none}
.pied-integre .lien-politique{order:0}
.fin-page{height:20px}
@media (max-width:980px){
  .colonne-etroite{padding:0 12px}
  .agence{padding:20% 0 15%}
  .agence .colonne-page{padding:10px 15px}
  .agence-texte{font-size:16px;width:90%;margin:3px 0 16px}
  .agence-texte p:not(:last-child){padding-bottom:16px}
  .sans-fin .ecran{min-height:90vh}
  .contact-texte{width:80%;margin-bottom:44.4px}
  .page-contact h1.script{margin-bottom:38px}
  .volets{width:95%;padding-top:0}
}
@media (max-width:767px){
  .volet summary{padding:12px}
  .volet-texte{padding:0 10px 12px}
  .ecran-pied{padding:0 10px;justify-content:center}
  .sans-fin .ecran-pied{padding:0 10px 22px}
  .pied-integre{padding-bottom:0;min-height:0}
  .pied-integre .pied-marque{padding-top:0;width:100%}
  .pied-integre .lottie{width:100%;margin-bottom:29px}
  .pied-integre .pied-marque p{display:none}
  .pied-signature{display:block;width:67%;height:auto;margin:-18% auto 0}
  .ecran-pied .pied-liens{padding:7% 25px 0;display:flex;flex-direction:column;align-items:center}
  .ecran-pied .pied-liens a{font-size:15px;line-height:25.5px;display:block;text-align:center}
  .ecran-pied .lien-politique{order:1;width:100%;white-space:normal}
  .ecran-pied .lien-ressources{order:2}
  .ecran-pied .lien-recrutement{order:3}
}

.page-vp .ecran-pied{padding:0}
.page-vp .pied-integre{padding:0 0 24px;min-height:100vh}
.page-vp .fin-page{display:none}
.page-vp .instagram{padding-top:27px}
@media (max-width:980px){
  .page-vp .pied-integre{padding-bottom:0;min-height:0}
}
@media (max-width:767px){
  .page-vp .ecran-pied{min-height:0;display:block}
}

/* Accueil */
.page-accueil,html:has(.page-accueil){height:100%;overflow:hidden;font-weight:300;color:var(--encre)}
.page-accueil{overscroll-behavior:none;touch-action:none}
#scene{position:fixed;inset:0;z-index:1;cursor:grab}
#scene.saisi{cursor:grabbing}
.cellule{position:absolute;top:0;left:0;will-change:transform;overflow:hidden;background:#e5e2da}
.cellule img{width:100%;height:100%;object-fit:cover;display:block;opacity:0;transition:opacity 1s ease;user-select:none;-webkit-user-drag:none}
.cellule .carte{position:absolute;inset:0;background:var(--alpinia);color:var(--papier);display:flex;flex-direction:column;justify-content:space-between;padding:clamp(14px,calc(var(--cw)*.085),32px);overflow:hidden;font-family:var(--texte),Jost,sans-serif;line-height:23.8px}
.carte-identite{text-align:center;align-items:center}
.carte-surtitre{font-size:clamp(7.5px,calc(var(--cw)*.029),10px);letter-spacing:.24em;text-transform:uppercase;opacity:.55}
.carte-corps{margin:auto 0}
.cellule .carte h2{font-family:var(--titre);color:var(--papier);font-size:clamp(18px,calc(var(--cw)*.105),34px);letter-spacing:.02em;line-height:1.15;padding:0 0 10px;margin-bottom:.5em}
.cellule .carte p{font-size:clamp(10.5px,calc(var(--cw)*.041),14px);line-height:1.7;opacity:.85;font-weight:300;padding:0}
.carte-date{font-size:clamp(7px,calc(var(--cw)*.027),10px);letter-spacing:.2em;text-transform:uppercase;opacity:.7;line-height:1.9}
.carte-identite .carte-mono{width:64%;max-width:180px;height:auto;max-height:62%;object-fit:contain;margin:auto 0;opacity:.96;display:block}
.carte-lien{align-self:flex-start;margin-top:1.4em;font-size:clamp(8px,calc(var(--cw)*.03),10.5px);letter-spacing:.18em;text-transform:uppercase;display:inline-flex;align-items:center;gap:8px;color:var(--papier);border-bottom:1px solid rgba(255,255,255,.35);padding-bottom:4px;transition:gap .35s ease,border-color .35s}
.carte-identite .carte-lien{align-self:center}
.carte-lien:hover{gap:15px;border-color:rgba(255,255,255,.9)}
#grain{position:fixed;inset:0;width:100%;height:100%;z-index:30;pointer-events:none}
#vignette{position:fixed;inset:0;z-index:29;pointer-events:none;background:radial-gradient(120% 90% at 50% 50%,rgba(238,236,230,0) 42%,rgba(238,236,230,.5) 100%)}
#menu-accueil{display:none}
@media (max-width:820px){
  .page-accueil .menu-mobile{inset:0 10px}
  .page-accueil .menu-bouton{display:none}
  #menu-accueil{display:block;position:fixed;z-index:50;left:50%;bottom:8.5px;width:124px;margin-left:-62px;border:0;cursor:pointer;background:var(--papier);color:var(--encre);border-radius:100px;padding:14px 0;font-family:var(--texte),Jost,Helvetica,Arial,sans-serif;font-size:11px;font-weight:400;letter-spacing:.24em;text-transform:uppercase;text-align:center;box-shadow:0 2px 20px rgba(45,50,45,.2)}
}
#prechargement{position:fixed;inset:0;z-index:80;background:var(--beton);display:grid;place-items:center;transition:opacity 1s ease}
#prechargement.fini{opacity:0;pointer-events:none}
#prechargement img{width:120px;height:auto;opacity:.85}

/* Conception, Coaching */
.page-offre #main-content{padding:10px}
.page-offre .pied-marque p{font-weight:400}
.page-offre .fin-page{display:none}
.offre-resa{padding:6px 10px 20px}
.page-coaching .ecran-pied{padding-bottom:10px}
@media (max-width:767px){.offre-resa{padding:6px 0 20px}.page-coaching .ecran-pied{padding-bottom:20px}}

/* Page introuvable */
.ecran-404{min-height:100vh;padding:396px 12.5% 0;box-sizing:border-box}
.ecran-404 p{font:400 24px/23.8px var(--titre);color:var(--beton);text-align:center}
.ecran-404 .sorties{display:flex;justify-content:center;gap:12px;margin-top:34px}
@media (max-width:767px){.ecran-404{padding:385px 10% 0}}