

@font-face{
  font-family:'PoliceTitre';
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url('police-titre.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,
    U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'PoliceLibelle';
  font-style:normal;
  font-weight:500;
  font-display:swap;
  src:url('police-libelle.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,
    U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

:root{
  --encre:#f2f0ea;              /* texte courant sur la nuit */
  --encre-douce:#a9a79f;        /* texte secondaire — jamais plus clair que ça */
  --fond:#0b0c10;               /* la nuit courante */
  --fond-alt:#12141a;           /* sections alternées */
  --carte:#181b23;              /* les caissons */
  --marque:#ffb23f;             /* AMBRE DE NÉON — l'action, et elle seule */
  --marque-fonce:#ffc76b;       /* survol : sur fond noir, un survol ÉCLAIRE */
  --filet:#2b303a;              /* filets et bordures : décor, jamais du texte */
  --nuit:#07080b;               /* le plus sombre : bandeau, verre, pied */
  --laiton:#6cdcff;             /* CYAN DE TUBE — surtitres, distances, liens */
  --laiton-clair:#9ae8ff;
  --texte-bouton:#0b0c10;       /* sur l'ambre, le texte est SOMBRE */
  --wa:#25d366;                 /* vert WhatsApp : texte foncé dessus */

  --jour:#f4f2ec;
  --jour-alt:#e7e4db;
  --jour-encre:#16181d;
  --jour-douce:#4c5158;
  --marque-jour:#8a4a06;
  --laiton-jour:#0e5f75;

  --rayon:4px;
  --rayon-bouton:999px;
  --colonne:1160px;

  --ombre:0 1px 2px rgba(7,8,11,.45), 0 12px 28px rgba(7,8,11,.5);
  --ombre-haut:0 1px 2px rgba(7,8,11,.45), 0 18px 40px rgba(7,8,11,.62);
  --halo-photo:color-mix(in srgb,var(--marque) 40%,transparent);
  --liseret:rgba(255,255,255,.07);

  --lueur-lettre:0 0 18px color-mix(in srgb,var(--marque) 32%,transparent),
                 0 0 48px color-mix(in srgb,var(--marque) 16%,transparent);

  --police-titre:'PoliceTitre',"Arial Narrow","Helvetica Neue Condensed",Impact,sans-serif;
  --police-libelle:'PoliceLibelle',"Avenir Next",Avenir,"Century Gothic","Segoe UI",system-ui,sans-serif;
  --police-corps:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  margin:0;
  position:relative;
  background:var(--fond);
  color:var(--encre);
  font-family:var(--police-corps);
  font-size:clamp(1rem,.97rem + .18vw,1.06rem);
  line-height:1.65;
  overflow-wrap:break-word;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--laiton);text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--laiton-clair)}
ul,ol{margin:0;padding:0;list-style:none}
h1,h2,h3{margin:0;font-family:var(--police-titre);font-weight:400;letter-spacing:.02em}
h1,h2,h3,.hero__accent,.marque__nom,.pied__nom,.palier__lettres{line-height:1.34}
p{margin:0}
:focus-visible{outline:3px solid var(--marque);outline-offset:3px;border-radius:2px}

.bande{
  width:100%;max-width:var(--colonne);margin-inline:auto;
  padding-inline:clamp(1rem,4vw,2rem);
  position:relative;z-index:1;      /* le contenu passe au-dessus des joues */
}

.saut-contenu{
  position:absolute;left:-9999px;top:0;z-index:60;
  background:var(--marque);color:var(--texte-bouton);
  padding:.75rem 1.25rem;font-family:var(--police-libelle);
}
.saut-contenu:focus{left:.5rem;top:.5rem}

.ruban{
  margin:0;padding:.55rem 1rem;
  background:var(--nuit);color:var(--marque);
  font-family:var(--police-libelle);
  font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;text-align:center;
  border-bottom:1px solid var(--filet);
}
.ruban a{color:var(--marque);text-decoration:underline;display:inline-block;padding-block:.25rem}

.entete{
  position:sticky;top:0;z-index:30;
  background:color-mix(in srgb,var(--nuit) 86%,transparent);
  -webkit-backdrop-filter:blur(16px) saturate(115%);
  backdrop-filter:blur(16px) saturate(115%);
  border-bottom:1px solid var(--filet);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}
.nav{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:64px}

.marque{display:block;text-decoration:none;color:inherit;padding:.5rem 0}
.marque__nom{
  display:block;font-family:var(--police-titre);
  font-size:1.32rem;letter-spacing:.06em;text-transform:uppercase;color:var(--encre);
}
.marque__sous{
  display:block;font-family:var(--police-libelle);
  font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--encre-douce);
}

#nav-toggle{
  display:none;
  width:48px;height:48px;padding:12px;
  background:transparent;border:1px solid var(--filet);border-radius:var(--rayon);
  cursor:pointer;
}
.nav-toggle__trait{display:block;height:2px;background:var(--encre);border-radius:2px}
.nav-toggle__trait + .nav-toggle__trait{margin-top:5px}
#nav-toggle[aria-expanded="true"]{border-color:var(--marque)}

#nav-links{display:flex;align-items:center;gap:.35rem}
#nav-links a{
  display:inline-block;padding:.6rem .85rem;min-height:24px;
  font-family:var(--police-libelle);font-size:.85rem;
  letter-spacing:.1em;text-transform:uppercase;
  color:var(--encre);text-decoration:none;border-radius:var(--rayon);
  transition:color .2s ease,background-color .2s ease;
}
#nav-links a:hover{color:var(--marque);background:rgba(255,255,255,.05)}
#nav-links .bouton{color:var(--texte-bouton)}

.bouton{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:48px;padding:.85rem 1.5rem;
  font-family:var(--police-libelle);font-size:.88rem;font-weight:500;
  letter-spacing:.1em;text-transform:uppercase;text-decoration:none;
  border-radius:var(--rayon-bouton);border:0;cursor:pointer;
  font-variant-numeric:lining-nums tabular-nums;
  transition:background-color .22s ease,transform .22s ease,box-shadow .22s ease;
}
.bouton--plein{
  background:linear-gradient(180deg,var(--marque),color-mix(in srgb,var(--marque) 92%,var(--nuit)));
  color:var(--texte-bouton);
  box-shadow:var(--ombre);
}
.bouton--plein:hover{
  background:linear-gradient(180deg,var(--marque-fonce),var(--marque));
  color:var(--texte-bouton);box-shadow:var(--ombre-haut);
}
.bouton--grand{min-height:56px;padding:1rem 1.75rem;font-size:.95rem}
.bouton--wa{background:var(--wa);color:#0b1a10}
.bouton--wa:hover{background:var(--wa);box-shadow:var(--ombre-haut)}

.hero{
  position:relative;
  display:flex;align-items:flex-end;
  min-height:clamp(520px,84vh,760px);
  padding:clamp(4rem,10vh,7rem) 0 clamp(2.5rem,6vh,4rem);
  background:var(--nuit);
  overflow:hidden;
}
@media (max-width:640px){
  .hero__photo{object-position:62% 38%}
}
.hero__photo{
  position:absolute;inset:0;width:100%;height:100%;
  object-position:58% 42%;
  object-fit:cover;
  filter:saturate(.85) brightness(.62);
}
.hero__voile{
  position:absolute;inset:0;pointer-events:none;
  background:
    linear-gradient(180deg,rgba(7,8,11,.42) 0%,rgba(7,8,11,.86) 100%);
}
.hero__bande{position:relative;z-index:2;width:100%}

.hero__verre{
  max-width:44rem;padding:clamp(1.75rem,4vw,2.75rem);
  border:1px solid rgba(255,255,255,.14);
  border-radius:var(--rayon);
  background:color-mix(in srgb,var(--nuit) 82%,transparent);
  -webkit-backdrop-filter:blur(16px) saturate(115%);
  backdrop-filter:blur(16px) saturate(115%);
  box-shadow:var(--ombre-haut),inset 0 1px 0 rgba(255,255,255,.10);
}
.hero__etiquette{
  font-family:var(--police-libelle);font-size:.78rem;
  letter-spacing:.18em;text-transform:uppercase;color:var(--laiton);
  margin-bottom:1rem;
}
.hero__titre{
  font-size:clamp(2.6rem,6vw,4.6rem);
  text-transform:uppercase;color:var(--encre);
  display:block;
}
.hero__accent{
  display:block;
  font-family:var(--police-titre);
  font-size:clamp(2.6rem,6vw,4.6rem);
  text-transform:uppercase;
  color:var(--marque);
  text-shadow:var(--lueur-lettre);
}
html.js .hero__accent{animation:tube 1.5s ease-out .25s 1 both}
@keyframes tube{
  0%{opacity:.22}   12%{opacity:1}   18%{opacity:.22}
  30%{opacity:1}    36%{opacity:.3}
  52%{opacity:1}    58%{opacity:.5}
  100%{opacity:1}
}
.hero__intro{
  margin-top:1.25rem;max-width:36rem;
  color:var(--encre);font-size:1.06rem;
}
.hero__actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:2rem}

main > section{position:relative;padding:clamp(4rem,9vw,6rem) 0}
.lecture{padding-block:clamp(3rem,6.5vw,4.5rem)}
.supports{padding-block:clamp(3.5rem,7.5vw,5rem)}
.atelier{padding-block:clamp(5rem,11vw,7.5rem)}
.hero{padding-top:clamp(4rem,10vh,7rem)}

.entete-section{max-width:46rem;margin-bottom:clamp(2rem,4vw,3rem)}
.entete-section--centre{margin-inline:auto;text-align:center}
.sur{
  font-family:var(--police-libelle);font-size:.78rem;
  letter-spacing:.18em;text-transform:uppercase;color:var(--laiton);
  margin-bottom:.75rem;
}
.entete-section h2{
  font-size:clamp(1.85rem,4vw,2.9rem);
  text-transform:uppercase;color:var(--encre);
}
.assise{
  display:block;width:48px;height:3px;margin-top:1.25rem;
  background:var(--marque);border-radius:2px;
}
.entete-section--centre .assise{margin-inline:auto}

.lecture{background:var(--fond)}
.lecture__intro{
  max-width:44rem;color:var(--encre-douce);
  margin-bottom:clamp(2rem,4vw,3rem);font-size:1.06rem;
}

.echelle{border-top:1px solid var(--filet)}
.palier{
  display:grid;
  grid-template-columns:minmax(4.5rem,8rem) minmax(0,1fr) auto;
  gap:0 clamp(1.25rem,3vw,3rem);
  align-items:center;
  padding:clamp(1.5rem,3vw,2rem) 0;
  border-bottom:1px solid var(--filet);
}
.palier__lettres{
  display:block;text-align:right;
  font-family:var(--police-titre);color:var(--encre);
  font-size:calc(var(--corps,1) * clamp(.44rem,.28rem + .78vw,1rem));
  text-shadow:var(--lueur-lettre);
  user-select:none;
}
.palier__distance{
  font-family:var(--police-libelle);color:var(--laiton);
  font-variant-numeric:lining-nums tabular-nums;
  font-size:clamp(1.05rem,.9rem + .6vw,1.4rem);
  letter-spacing:.08em;
}
.palier__dit h3{
  font-size:clamp(1.15rem,1rem + .5vw,1.45rem);
  text-transform:uppercase;color:var(--encre);margin-top:.25rem;
}
.palier__dit > p:not(.palier__distance){
  color:var(--encre-douce);margin-top:.5rem;max-width:38rem;
}
.palier__hauteur{
  text-align:right;white-space:nowrap;
  font-family:var(--police-libelle);
}
.palier__hauteur span{
  display:block;font-size:.7rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--encre-douce);
}
.palier__hauteur b{
  display:block;font-weight:500;color:var(--encre);
  font-variant-numeric:lining-nums tabular-nums;
  font-size:1.1rem;letter-spacing:.05em;margin-top:.15rem;
}
.lecture__regle{
  margin-top:clamp(2rem,4vw,3rem);max-width:46rem;
  color:var(--encre-douce);font-size:1.02rem;
}

.supports{background:var(--fond)}
.supports .bande{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,320px);
  gap:0 clamp(2rem,4vw,3.5rem);
  align-items:start;
}
.supports .entete-section{grid-column:1;grid-row:1}
.travees{grid-column:1;grid-row:2;border-top:1px solid var(--filet)}
.supports__visuel{
  grid-column:2;grid-row:1 / span 2;
  align-self:stretch;
  display:flex;
  margin:clamp(2rem,4vw,3.25rem) 0 clamp(.75rem,1.5vw,1.25rem);
}
.supports__visuel img{height:100%}

.travee{
  position:relative;
  display:grid;
  grid-template-columns:3.25rem minmax(0,1fr) auto;
  gap:0 clamp(1rem,2.5vw,2rem);
  align-items:start;
  padding:clamp(1.5rem,3vw,2rem) 0 clamp(1.5rem,3vw,2rem) 1.5rem;
  border-bottom:1px solid var(--filet);
}
.travee::before{
  content:"";position:absolute;left:0;top:clamp(1.5rem,3vw,2rem);bottom:clamp(1.5rem,3vw,2rem);
  width:3px;border-radius:2px;background:var(--filet);
  transition:background-color .24s ease,box-shadow .24s ease;
}
.travee:hover::before{
  background:var(--marque);
  box-shadow:0 0 16px -2px color-mix(in srgb,var(--marque) 60%,transparent);
}
.travee__num{
  font-family:var(--police-libelle);
  font-variant-numeric:lining-nums tabular-nums;
  font-size:1.05rem;letter-spacing:.06em;color:var(--laiton);
  padding-top:.35rem;
}
.travee__dit h3{
  font-size:clamp(1.2rem,1.05rem + .55vw,1.55rem);
  text-transform:uppercase;color:var(--encre);
}
.travee__dit p{margin-top:.5rem;color:var(--encre-douce);max-width:40rem}
.travee__portee{
  text-align:right;font-family:var(--police-libelle);
  padding-top:.35rem;white-space:nowrap;
}
.travee__portee span{
  display:block;font-size:.7rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--encre-douce);
}
.travee__portee b{
  display:block;font-weight:500;color:var(--laiton);
  font-variant-numeric:lining-nums tabular-nums;
  font-size:1.1rem;letter-spacing:.05em;margin-top:.15rem;
}

.atelier{
  background-color:#f4f2ec;
  color:var(--jour-encre);
  padding-bottom:clamp(4.5rem,9vw,6.5rem);
}
.atelier{--halo-photo:rgba(138,74,6,.26)}
.atelier .sur{color:var(--laiton-jour)}
.atelier h2{color:var(--jour-encre)}
.atelier .assise{background:var(--marque-jour)}
.atelier__intro{
  max-width:44rem;margin:0 auto clamp(2rem,4vw,3rem);
  text-align:center;color:var(--jour-douce);font-size:1.06rem;
}
.atelier__bande{
  display:grid;grid-template-columns:1.35fr 1fr;
  gap:clamp(1rem,2.5vw,2rem);align-items:stretch;
}
.atelier__large img{aspect-ratio:4 / 3;object-fit:cover;object-position:50% 45%;width:100%}
.atelier__haute{position:relative}
.atelier__haute img{position:absolute;inset:0;object-position:50% 45%;
  width:100%;height:100%;object-fit:cover}

.rail{
  position:absolute;left:0;right:0;bottom:0;height:3px;z-index:2;
  background:var(--marque);
  box-shadow:0 0 22px -2px color-mix(in srgb,var(--marque) 55%,transparent);
}

.equipe{background:var(--fond);padding-bottom:0}
.equipe__photo{margin:clamp(2rem,4vw,3rem) 0 0;position:relative}
.equipe__photo img{
  width:100%;height:clamp(280px,42vw,460px);
  object-fit:cover;object-position:50% 24%;
  filter:saturate(.9) brightness(.78);
}
.equipe__photo::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:rgba(7,8,11,.42);
}

.contact{background:var(--fond)}
.contact__grille{
  display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);
  gap:clamp(1.5rem,3vw,2.5rem);align-items:stretch;
}
.caisson{
  position:relative;
  padding:clamp(1.75rem,4vw,2.75rem);
  border:1px solid var(--filet);border-radius:var(--rayon);
  background-color:#181b23;
  box-shadow:
    var(--ombre),
    inset 0 1px 0 rgba(255,255,255,.08),
    10px 10px 0 -1px color-mix(in srgb,var(--nuit) 88%,var(--carte));
}
.caisson::before{
  content:"";position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;
  box-shadow:0 0 30px -6px color-mix(in srgb,var(--marque) 26%,transparent);
}
.contact__phrase{
  max-width:38rem;margin:0 auto clamp(1.75rem,3vw,2.5rem);
  text-align:center;color:var(--encre-douce);
}

.fiche + .fiche{margin-top:2rem;padding-top:2rem;border-top:1px solid var(--filet)}
.fiche__titre{
  font-family:var(--police-libelle);font-size:.78rem;font-weight:500;
  letter-spacing:.18em;text-transform:uppercase;color:var(--laiton);
  margin:0 0 1rem;
}
.tableau{margin:0}
.tableau__ligne{
  display:grid;grid-template-columns:auto minmax(0,1fr);
  align-items:baseline;gap:0 .9rem;
  padding:.55rem 0;border-bottom:1px solid var(--filet);
}
.tableau__ligne:last-child{border-bottom:0}
.tableau dt{
  font-family:var(--police-libelle);font-size:.82rem;
  letter-spacing:.1em;text-transform:uppercase;color:var(--encre-douce);
}
.tableau dd{
  margin:0;min-width:0;text-align:right;color:var(--encre);
  font-variant-numeric:lining-nums tabular-nums;
}
.tableau dd a{color:var(--laiton);text-decoration:none;display:inline-block;min-height:24px;padding:.15rem 0}
.tableau dd a:hover{color:var(--laiton-clair);text-decoration:underline}
.tableau__ligne--ferme dd{color:var(--encre-douce)}
.tableau__ligne--aujourdhui dt{color:var(--marque)}
.tableau__aujourdhui{
  display:inline-block;margin-left:.5rem;
  font-size:.66rem;letter-spacing:.12em;color:var(--marque);
}
.fiche__note{
  margin-top:1rem;font-size:.88rem;color:var(--encre-douce);
}
.a-completer{opacity:.5;font-style:italic;font-size:.92em;letter-spacing:.01em}

.cadre{
  margin:0;overflow:hidden;
  border-radius:var(--rayon);border:1px solid var(--filet);
  background:var(--nuit);
  box-shadow:0 0 34px -8px var(--halo-photo),var(--ombre);
}
.cadre img{
  width:100%;display:block;
}
.supports__visuel img{aspect-ratio:auto;object-fit:cover;object-position:50% 42%;min-height:340px}
.contact__visuel img{width:100%;height:100%;object-fit:cover;
  object-position:68% 16%;min-height:280px}

.pied{position:relative;background:var(--fond);padding:clamp(3rem,6vw,4.5rem) 0}
.pied__interieur{text-align:center}
.assise--pied{margin:0 auto 1.5rem}
.pied__nom{
  font-family:var(--police-titre);font-size:clamp(1.5rem,3vw,2.1rem);
  letter-spacing:.08em;text-transform:uppercase;color:var(--encre);
}
.pied__lieu{
  font-family:var(--police-libelle);font-size:.78rem;
  letter-spacing:.16em;text-transform:uppercase;color:var(--encre-douce);
  margin-top:.35rem;
}
.pied__bas{margin-top:2rem;padding-top:1.5rem;border-top:1px solid var(--filet)}
.pied__credit{font-size:.84rem;color:var(--encre-douce)}
.pied__credit a{color:var(--laiton);display:inline-block;padding-block:.25rem}

.hero{--phase:-190px}
.lecture{--phase:-1370px}
.supports{--phase:-620px}
.atelier{--phase:-1880px}
.equipe{--phase:-960px}
.contact{--phase:-1610px}
.pied{--phase:-340px}
.joues::after,.hero::after,.equipe::after{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  --goutte:max(0px,calc((100% - var(--colonne)) / 2));
  --joue-masque:linear-gradient(rgba(0,0,0,.52),rgba(0,0,0,.52));
  background-image:
    var(--joue-motif),
    var(--joue-caisson);
  background-size:0 0,1680px 2360px;
  background-position:left top,left var(--phase,0px);
  background-repeat:repeat,repeat;
  -webkit-mask-image:var(--joue-masque);
  mask-image:var(--joue-masque);
}
main > section,.pied{
  --joue-lueur-a:transparent;--joue-lueur-b:transparent;--joue-lueur-c:transparent;
  --joue-motif:none;--joue-caisson:none}

.joues,.hero,.equipe{
  --joue-fond:rgba(255,238,209,.10);
  --joue-trait:rgba(255,238,209,.075);
  --joue-arete:rgba(7,8,11,.44);
  --joue-ombre:rgba(7,8,11,.55);
  --joue-lumiere:rgba(255,238,209,.12);
  --joue-lueur-a:rgba(255,196,92,.130);   /* l'ambre, en haut à gauche */
  --joue-lueur-b:rgba(96,164,255,.100);   /* le bleu froid, à droite */
  --joue-lueur-c:rgba(255,124,176,.072);  /* le rose, qui monte du bas */
  --joue-motif:none;
  --joue-caisson:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1120' height='1180'%3E%3Crect x='0' y='0' width='1120' height='1180' fill='rgb(255,238,209)' fill-opacity='0.0016'/%3E%3Cg fill='none' stroke='rgb(255,238,209)' stroke-opacity='0.085'%3E%3Crect x='60' y='70' width='232' height='138' rx='4'/%3E%3Cpath d='M301 79v138h-232'/%3E%3C/g%3E%3Cg fill='none' stroke='rgb(255,238,209)' stroke-opacity='0.048'%3E%3Crect x='742' y='132' width='118' height='118' rx='4'/%3E%3Cpath d='M869 141v118h-118'/%3E%3C/g%3E%3Cg fill='none' stroke='rgb(255,238,209)' stroke-opacity='0.03'%3E%3Crect x='452' y='96' width='148' height='88' rx='4'/%3E%3Cpath d='M609 105v88h-148'/%3E%3C/g%3E%3Cg fill='none' stroke='rgb(255,238,209)' stroke-opacity='0.04'%3E%3Crect x='330' y='330' width='98' height='252' rx='4'/%3E%3Cpath d='M437 339v252h-98'/%3E%3C/g%3E%3Cg fill='none' stroke='rgb(255,238,209)' stroke-opacity='0.07'%3E%3Crect x='900' y='402' width='158' height='96' rx='4'/%3E%3Cpath d='M1067 411v96h-158'/%3E%3C/g%3E%3Cg fill='none' stroke='rgb(255,238,209)' stroke-opacity='0.032'%3E%3Crect x='128' y='592' width='140' height='86' rx='4'/%3E%3Cpath d='M277 601v86h-140'/%3E%3C/g%3E%3Cg fill='none' stroke='rgb(255,238,209)' stroke-opacity='0.058'%3E%3Crect x='556' y='660' width='286' height='158' rx='4'/%3E%3Cpath d='M851 669v158h-286'/%3E%3C/g%3E%3Cg fill='none' stroke='rgb(255,238,209)' stroke-opacity='0.045'%3E%3Crect x='886' y='762' width='92' height='92' rx='4'/%3E%3Cpath d='M987 771v92h-92'/%3E%3C/g%3E%3Cg fill='none' stroke='rgb(255,238,209)' stroke-opacity='0.026'%3E%3Crect x='196' y='848' width='208' height='126' rx='4'/%3E%3Cpath d='M413 857v126h-208'/%3E%3C/g%3E%3Cg fill='none' stroke='rgb(255,238,209)' stroke-opacity='0.052'%3E%3Crect x='628' y='968' width='132' height='132' rx='4'/%3E%3Cpath d='M769 977v132h-132'/%3E%3C/g%3E%3Cg fill='none' stroke='rgb(255,238,209)' stroke-opacity='0.034'%3E%3Crect x='930' y='1002' width='96' height='62' rx='4'/%3E%3Cpath d='M1035 1011v62h-96'/%3E%3C/g%3E%3C/svg%3E");
}
.hero,.equipe{
  --joue-trait:rgba(255,238,209,.038);
  --joue-lumiere:rgba(255,238,209,.06);
  --joue-lueur-a:rgba(255,196,92,.036);
  --joue-lueur-b:rgba(96,164,255,.028);
  --joue-lueur-c:rgba(255,124,176,.020);
  --joue-motif:none;
  --joue-caisson:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1120' height='1180'%3E%3Crect x='0' y='0' width='1120' height='1180' fill='rgb(255,238,209)' fill-opacity='0.0008'/%3E%3Cg fill='none' stroke='rgb(255,238,209)' stroke-opacity='0.047'%3E%3Crect x='60' y='70' width='232' height='138' rx='4'/%3E%3Cpath d='M301 79v138h-232'/%3E%3C/g%3E%3Cg fill='none' stroke='rgb(255,238,209)' stroke-opacity='0.026'%3E%3Crect x='742' y='132' width='118' height='118' rx='4'/%3E%3Cpath d='M869 141v118h-118'/%3E%3C/g%3E%3Cg fill='none' stroke='rgb(255,238,209)' stroke-opacity='0.017'%3E%3Crect x='452' y='96' width='148' height='88' rx='4'/%3E%3Cpath d='M609 105v88h-148'/%3E%3C/g%3E%3Cg fill='none' stroke='rgb(255,238,209)' stroke-opacity='0.022'%3E%3Crect x='330' y='330' width='98' height='252' rx='4'/%3E%3Cpath d='M437 339v252h-98'/%3E%3C/g%3E%3Cg fill='none' stroke='rgb(255,238,209)' stroke-opacity='0.039'%3E%3Crect x='900' y='402' width='158' height='96' rx='4'/%3E%3Cpath d='M1067 411v96h-158'/%3E%3C/g%3E%3Cg fill='none' stroke='rgb(255,238,209)' stroke-opacity='0.018'%3E%3Crect x='128' y='592' width='140' height='86' rx='4'/%3E%3Cpath d='M277 601v86h-140'/%3E%3C/g%3E%3Cg fill='none' stroke='rgb(255,238,209)' stroke-opacity='0.032'%3E%3Crect x='556' y='660' width='286' height='158' rx='4'/%3E%3Cpath d='M851 669v158h-286'/%3E%3C/g%3E%3Cg fill='none' stroke='rgb(255,238,209)' stroke-opacity='0.025'%3E%3Crect x='886' y='762' width='92' height='92' rx='4'/%3E%3Cpath d='M987 771v92h-92'/%3E%3C/g%3E%3Cg fill='none' stroke='rgb(255,238,209)' stroke-opacity='0.014'%3E%3Crect x='196' y='848' width='208' height='126' rx='4'/%3E%3Cpath d='M413 857v126h-208'/%3E%3C/g%3E%3Cg fill='none' stroke='rgb(255,238,209)' stroke-opacity='0.029'%3E%3Crect x='628' y='968' width='132' height='132' rx='4'/%3E%3Cpath d='M769 977v132h-132'/%3E%3C/g%3E%3Cg fill='none' stroke='rgb(255,238,209)' stroke-opacity='0.019'%3E%3Crect x='930' y='1002' width='96' height='62' rx='4'/%3E%3Cpath d='M1035 1011v62h-96'/%3E%3C/g%3E%3C/svg%3E");
}
.joues--jour{
  --joue-fond:rgba(22,24,29,.32);
  --joue-trait:rgba(22,24,29,.075);
  --joue-arete:rgba(255,255,255,.58);
  --joue-ombre:rgba(22,24,29,.10);
  --joue-lumiere:rgba(255,255,255,.55);
  --joue-motif:none;
  --joue-caisson:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1120' height='1180'%3E%3Crect x='0' y='0' width='1120' height='1180' fill='rgb(22,24,29)' fill-opacity='0.0016'/%3E%3Cg fill='none' stroke='rgb(22,24,29)' stroke-opacity='0.085'%3E%3Crect x='60' y='70' width='232' height='138' rx='4'/%3E%3Cpath d='M301 79v138h-232'/%3E%3C/g%3E%3Cg fill='none' stroke='rgb(22,24,29)' stroke-opacity='0.048'%3E%3Crect x='742' y='132' width='118' height='118' rx='4'/%3E%3Cpath d='M869 141v118h-118'/%3E%3C/g%3E%3Cg fill='none' stroke='rgb(22,24,29)' stroke-opacity='0.03'%3E%3Crect x='452' y='96' width='148' height='88' rx='4'/%3E%3Cpath d='M609 105v88h-148'/%3E%3C/g%3E%3Cg fill='none' stroke='rgb(22,24,29)' stroke-opacity='0.04'%3E%3Crect x='330' y='330' width='98' height='252' rx='4'/%3E%3Cpath d='M437 339v252h-98'/%3E%3C/g%3E%3Cg fill='none' stroke='rgb(22,24,29)' stroke-opacity='0.07'%3E%3Crect x='900' y='402' width='158' height='96' rx='4'/%3E%3Cpath d='M1067 411v96h-158'/%3E%3C/g%3E%3Cg fill='none' stroke='rgb(22,24,29)' stroke-opacity='0.032'%3E%3Crect x='128' y='592' width='140' height='86' rx='4'/%3E%3Cpath d='M277 601v86h-140'/%3E%3C/g%3E%3Cg fill='none' stroke='rgb(22,24,29)' stroke-opacity='0.058'%3E%3Crect x='556' y='660' width='286' height='158' rx='4'/%3E%3Cpath d='M851 669v158h-286'/%3E%3C/g%3E%3Cg fill='none' stroke='rgb(22,24,29)' stroke-opacity='0.045'%3E%3Crect x='886' y='762' width='92' height='92' rx='4'/%3E%3Cpath d='M987 771v92h-92'/%3E%3C/g%3E%3Cg fill='none' stroke='rgb(22,24,29)' stroke-opacity='0.026'%3E%3Crect x='196' y='848' width='208' height='126' rx='4'/%3E%3Cpath d='M413 857v126h-208'/%3E%3C/g%3E%3Cg fill='none' stroke='rgb(22,24,29)' stroke-opacity='0.052'%3E%3Crect x='628' y='968' width='132' height='132' rx='4'/%3E%3Cpath d='M769 977v132h-132'/%3E%3C/g%3E%3Cg fill='none' stroke='rgb(22,24,29)' stroke-opacity='0.034'%3E%3Crect x='930' y='1002' width='96' height='62' rx='4'/%3E%3Cpath d='M1035 1011v62h-96'/%3E%3C/g%3E%3C/svg%3E");
}

html.js .reveal{
  opacity:0;transform:translateY(16px);
  transition:opacity .5s ease,transform .5s cubic-bezier(.2,.7,.3,1);
  transition-delay:calc(var(--i,0) * 90ms);
}
html.js .reveal.est-vu{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  html.js .reveal{transform:none;transition:opacity .4s ease}
  html.js .hero__accent{animation:none}
  .cadre,.cadre img,.bouton{transition:box-shadow .3s ease,background-color .3s ease}
}

@media (max-width:62rem){
  #nav-toggle{display:block}
  #nav-links{
    display:none;
    position:absolute;left:0;right:0;top:100%;
    flex-direction:column;align-items:stretch;gap:0;
    padding:.5rem;
    background:var(--nuit);
    border-bottom:1px solid var(--filet);
    box-shadow:var(--ombre);
  }
  #nav-links.is-open{display:flex}
  #nav-links a{padding:.9rem 1rem;text-align:center}
  #nav-links .bouton{margin-top:.5rem}
  .nav{position:relative}

  .supports .bande{grid-template-columns:minmax(0,1fr)}
  .supports .entete-section{grid-row:auto}
  .travees{grid-column:1;grid-row:auto}
  .supports__visuel{grid-column:1;grid-row:auto;align-self:auto;display:block;
    margin:2.5rem 0 0}
  .supports__visuel img{aspect-ratio:4 / 3;height:auto;min-height:0}
  .contact__grille{grid-template-columns:minmax(0,1fr)}
  .contact__visuel{height:auto}
}

@media (max-width:48rem){
  .atelier__bande{grid-template-columns:minmax(0,1fr)}
  .atelier__haute{position:static}
  .atelier__haute img{position:static;height:auto;aspect-ratio:3 / 4}
  .caisson{
    box-shadow:var(--ombre),inset 0 1px 0 rgba(255,255,255,.08);
  }
}

@media (max-width:44rem){
  .palier{grid-template-columns:minmax(4rem,6rem) minmax(0,1fr)}
  .travee{
    grid-template-columns:2.75rem minmax(0,1fr);
    padding-left:1.25rem;
  }
  .travee__portee{
    grid-column:1 / -1;text-align:left;
    padding-top:.75rem;
  }
  .travee__portee span{display:inline;margin-right:.5rem}
  .travee__portee b{display:inline;font-size:1rem}
  .palier__hauteur{
    grid-column:1 / -1;text-align:left;padding-top:.75rem;
  }
  .palier__hauteur span,.palier__hauteur b{display:inline}
  .palier__hauteur span{margin-right:.5rem}
  .palier__hauteur b{font-size:1rem}
}

@media (max-width:40rem){
  .hero{
    --bande-photo:clamp(210px,46vw,300px);
    display:block;
    min-height:0;
    padding:0 0 clamp(2.25rem,7vw,3rem);
  }
  .hero__photo{position:relative;height:var(--bande-photo);width:100%}
  .hero__voile{
    bottom:auto;height:var(--bande-photo);
    background:linear-gradient(180deg,rgba(7,8,11,.26) 0%,rgba(7,8,11,.74) 100%);
  }
  .hero__bande{margin-top:clamp(1.4rem,5vw,2rem)}
  .hero__verre{max-width:none}
}

@media (max-width:30rem){
  .palier{
    grid-template-columns:minmax(0,1fr);
    gap:.5rem;
  }
  .palier__lettres{
    text-align:left;
    font-size:calc(var(--corps,1) * .5rem);
  }
  .bouton--grand{font-size:.82rem;letter-spacing:.05em;padding:.95rem 1.1rem}
  .hero__verre{padding:1.5rem 1.25rem}
  .tableau__ligne{grid-template-columns:minmax(0,1fr)}
  .tableau dd{text-align:left;margin-top:.15rem}
}

@media (max-width:22rem){
  .bouton--grand{font-size:.76rem;letter-spacing:.03em;padding:.9rem .75rem}
}

.entete{background-color:rgba(7,8,11,0.80)}
.entete{margin-bottom:-65px}
