@font-face{
  font-family:'PoliceTitre';
  src:url('police-titre.woff2?v=2') format('woff2');
  font-weight:300 700;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'PoliceLibelle';
  src:url('police-libelle.woff2?v=2') format('woff2');
  font-weight:300 700;font-style:normal;font-display:swap;
}

:root{
  --police-titre:'PoliceTitre',"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;
  --police-libelle:'PoliceLibelle',"Avenir Next",Avenir,"Century Gothic","Segoe UI",system-ui,sans-serif;

  --nuit:#181022;         /* prune noire : le pied, la bande des horaires */
  --cave:#231630;         /* le haut de la bande sombre */
  --velours:#472858;      /* le haut de la bande capitonnée */
  --velours-bas:#38204A;  /* son bas */

  --carte:#F4EFE9;        /* fond des panneaux clairs */
  --creme:#FBF7F2;        /* le clair le plus clair, et le texte sur sombre */
  --creme-doux:#C6B6CE;   /* texte secondaire sur fond violine ou nuit */
  --encre:#231A26;        /* texte sur fond clair */
  --encre-douce:#5B4A62;  /* texte secondaire sur fond clair */

  --laiton:#C08A3E;       /* LE CLOU TAPISSIER. Fonds, cordons, filets */
  --laiton-clair:#D6A45C; /* l'accent en TEXTE sur fond sombre et sur le verre */
  --laiton-fonce:#7A4E14; /* l'accent en TEXTE sur fond clair */

  --pli-clair:rgba(255,255,255,.55);
  --pli-sombre:rgba(35,26,38,.05);

  --etoffe:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cfilter id='e'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncA type='linear' slope='0.10'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='260' height='260' filter='url(%23e)'/%3E%3C/svg%3E");

  --rayon:12px;
  --rayon-bouton:10px;    /* jamais nul : un bouton n'est pas un rectangle brut */
  --colonne:1200px;
  --marge:24px;

  --pres:0 1px 2px rgba(24,16,34,.08);
  --loin:0 12px 28px rgba(24,16,34,.14);
  --loin-fort:0 18px 40px rgba(24,16,34,.20);
  --pres-nuit:0 1px 2px rgba(0,0,0,.30);
  --loin-nuit:0 12px 28px rgba(0,0,0,.44);
  --loin-nuit-fort:0 18px 40px rgba(0,0,0,.54);
}

*,*::before,*::after{box-sizing:border-box}

html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--carte);
  color:var(--encre);
  font-family:var(--police-libelle);
  font-weight:400;
  font-size:clamp(1rem,.96rem + .2vw,1.08rem);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3{font-family:var(--police-titre);font-weight:600;line-height:1.14;margin:0;letter-spacing:-.01em}
p{margin:0}
ul,ol,dl{margin:0;padding:0}

.bande{width:100%;max-width:var(--colonne);margin-inline:auto;padding-inline:var(--marge)}

.saut-contenu{
  position:absolute;left:-9999px;top:0;z-index:60;
  background:var(--nuit);color:var(--creme);padding:12px 16px;border-radius:0 0 var(--rayon) 0;
}
.saut-contenu:focus{left:0}

:where(a,button):focus-visible{
  outline:2px solid var(--laiton);outline-offset:3px;border-radius:4px;
}

.ruban{
  margin:0;padding:8px var(--marge);
  background:var(--nuit);color:var(--creme-doux);
  font-size:.8rem;letter-spacing:.04em;text-align:center;
}
.ruban a{
  color:var(--laiton-clair);text-decoration:underline;text-underline-offset:3px;
  display:inline-block;padding:3px 2px;
}

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

.marque{text-decoration:none;display:grid;gap:1px;padding-block:8px}
.marque__nom{
  font-family:var(--police-titre);font-size:1.22rem;font-weight:600;
  color:var(--creme);letter-spacing:.005em;
}
.marque__sous{
  font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--creme-doux);
}

#nav-toggle{
  display:none;
  width:48px;height:48px;padding:12px;
  background:transparent;border:1px solid rgba(255,255,255,.22);
  border-radius:var(--rayon-bouton);cursor:pointer;
}
.nav-toggle__trait{display:block;height:2px;background:var(--creme);border-radius:2px}
.nav-toggle__trait + .nav-toggle__trait{margin-top:5px}

#nav-links{list-style:none;display:flex;align-items:center;gap:4px}
#nav-links a{
  display:block;padding:10px 14px;min-height:40px;
  font-family:var(--police-titre);font-size:1rem;
  color:var(--creme);text-decoration:none;border-radius:var(--rayon-bouton);
  transition:background .22s ease,color .22s ease;
}
#nav-links a:hover{background:rgba(255,255,255,.09)}

.bouton{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:44px;padding:11px 20px;
  font-family:var(--police-titre);font-size:1rem;font-weight:600;
  text-decoration:none;border-radius:var(--rayon-bouton);
  transition:transform .22s ease,box-shadow .22s ease;
}
.bouton--plein{
  background:linear-gradient(180deg,#CC9648,var(--laiton));
  color:var(--encre);
  box-shadow:var(--pres-nuit),var(--loin-nuit),inset 0 1px 0 rgba(255,255,255,.28);
}
#nav-links .bouton--plein{margin-left:8px}
.bouton--plein:hover{box-shadow:var(--pres-nuit),var(--loin-nuit-fort),inset 0 1px 0 rgba(255,255,255,.28)}
.bouton--grand{min-height:56px;padding:15px 26px;font-size:1.08rem}

.plaque{
  display:inline-grid;gap:2px;
  min-height:56px;padding:11px 24px;
  background:linear-gradient(180deg,#CC9648,var(--laiton));
  color:var(--encre);text-decoration:none;
  border-radius:var(--rayon-bouton);
  box-shadow:var(--pres-nuit),var(--loin-nuit),inset 0 1px 0 rgba(255,255,255,.28);
  transition:transform .22s ease,box-shadow .22s ease;
}
.plaque:hover{box-shadow:var(--pres-nuit),var(--loin-nuit-fort),inset 0 1px 0 rgba(255,255,255,.28)}
.plaque__quoi{font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;opacity:.82;line-height:1.2}
.plaque__num{
  font-family:var(--police-libelle);font-weight:600;
  font-size:clamp(1.3rem,1.1rem + .8vw,1.6rem);line-height:1.15;
  font-variant-numeric:lining-nums tabular-nums;letter-spacing:.01em;
}
.plaque--clair{box-shadow:var(--pres),var(--loin),inset 0 1px 0 rgba(255,255,255,.34)}
.plaque--clair:hover{box-shadow:var(--pres),var(--loin-fort),inset 0 1px 0 rgba(255,255,255,.34)}

.passepoil{position:relative}
.passepoil::after{
  content:"";position:absolute;left:0;right:0;top:0;height:4px;
  border-radius:var(--rayon) var(--rayon) 0 0;
  background:linear-gradient(180deg,#D9A85F,#A8752F);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45);
  pointer-events:none;
}

main > section{position:relative}
main > section::after{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  --goutte:max(0px,calc((100% - var(--colonne)) / 2));
  --modul-1:calc(var(--goutte) + (50% - var(--goutte)) * .38);
  --modul-2:calc(var(--goutte) + (50% - var(--goutte)) * .72);
  background-image:
    var(--etoffe),
    linear-gradient(90deg,
      var(--pli-sombre) 0,transparent 4%,
      var(--pli-clair) 8%,transparent 14%,
      var(--pli-sombre) 23%,transparent 27%,
      var(--pli-clair) 31%,transparent 39%,
      var(--pli-sombre) 47%,transparent 52%,
      var(--pli-clair) 58%,transparent 68%,
      var(--pli-sombre) 79%,transparent 84%,
      var(--pli-clair) 89%,transparent 95%,
      var(--pli-sombre) 100%),
    none;
  background-size:
    260px 260px,
    auto,
    auto;
  background-position:
    left top,
    left top,
    left top;
  background-repeat:
    repeat,
    no-repeat,
    no-repeat;
  -webkit-mask-image:linear-gradient(90deg,
    #000 0 var(--goutte),
    rgba(0,0,0,.72) var(--modul-1),rgba(0,0,0,.44) var(--modul-2),
    rgba(0,0,0,.38) 50%,
    rgba(0,0,0,.44) calc(100% - var(--modul-2)),rgba(0,0,0,.72) calc(100% - var(--modul-1)),
    #000 calc(100% - var(--goutte)));
  mask-image:linear-gradient(90deg,
    #000 0 var(--goutte),
    rgba(0,0,0,.72) var(--modul-1),rgba(0,0,0,.44) var(--modul-2),
    rgba(0,0,0,.38) 50%,
    rgba(0,0,0,.44) calc(100% - var(--modul-2)),rgba(0,0,0,.72) calc(100% - var(--modul-1)),
    #000 calc(100% - var(--goutte)));
}
main > section > .bande{position:relative;z-index:1}
.joue--claire{
  --pli-clair:rgba(255,255,255,.55);
  --pli-sombre:rgba(35,26,38,.05);
}
.joue--sombre{
  --pli-clair:rgba(238,222,246,.055);
  --pli-sombre:rgba(0,0,0,.13);
}
.joue--velours{
  --pli-clair:rgba(238,222,246,.06);
  --pli-sombre:rgba(0,0,0,.13);
}

.section{padding-block:96px}
.joue--claire.section{
  color:var(--encre);
  background-color:var(--carte);
}
.joue--sombre.section{
  color:var(--creme);
  background-color:var(--nuit);
}

.joue--velours.section{
  color:var(--creme);
  background-color:var(--velours);
}

.entete-section{max-width:60ch;display:grid;gap:12px}
.sur{font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:var(--encre-douce);font-weight:600}
.sur--or{color:var(--laiton-clair)}
.titre2{font-size:clamp(1.9rem,1.4rem + 2vw,2.8rem)}
.titre2--clair{color:var(--creme)}
.mot-or{color:var(--laiton-fonce)}
.titre2--clair .mot-or,.hero__titre .mot-or{color:var(--laiton-clair)}
.para{color:var(--encre-douce);max-width:60ch}
.para--clair{color:var(--creme-doux)}

.cadre{
  margin:0;overflow:hidden;border-radius:var(--rayon);
  box-shadow:var(--pres),var(--loin);
  border:1px solid rgba(255,255,255,.16);
}
.cadre img{width:100%;height:100%;object-fit:cover}
.dossier{border-radius:50% 50% var(--rayon) var(--rayon) / 68px 68px var(--rayon) var(--rayon)}

.panneau{
  background-color:#fbf7f2;
  color:var(--encre);
  border-radius:var(--rayon);
  padding:clamp(22px,3vw,32px);
  border:1px solid rgba(35,26,38,.10);
  box-shadow:var(--pres),var(--loin),inset 0 1px 0 rgba(255,255,255,.70);
}
.joue--sombre .panneau{box-shadow:var(--pres-nuit),var(--loin-nuit),inset 0 1px 0 rgba(255,255,255,.70)}

.hero{position:relative;background:var(--nuit);padding-block:clamp(72px,10vw,128px);overflow:hidden}
.hero__fond{position:absolute;inset:0;z-index:0}
.hero__fond img{width:100%;height:100%;object-fit:cover}
@media (max-width:640px){
  .hero__fond img{object-position:74% 46%}
}
.hero__fond::after{
  content:"";position:absolute;inset:0;
  background-image:
    var(--etoffe),
    linear-gradient(180deg,color-mix(in srgb,var(--nuit) 62%,transparent),color-mix(in srgb,var(--nuit) 88%,transparent));
  background-size:260px 260px,auto;
  background-repeat:repeat,no-repeat;
}
.hero__bande{position:relative;z-index:1}

.verre{
  position:relative;max-width:660px;
  padding:clamp(26px,4vw,40px);
  border-radius:var(--rayon);
  background:color-mix(in srgb,var(--nuit) 82%,transparent);
  backdrop-filter:blur(16px) saturate(115%);
  -webkit-backdrop-filter:blur(16px) saturate(115%);
  border:1px solid rgba(255,255,255,.14);
  box-shadow:var(--pres-nuit),var(--loin-nuit),inset 0 1px 0 rgba(255,255,255,.10);
}
.verre::before{
  content:"";position:absolute;left:8%;right:8%;top:-40%;height:180%;
  pointer-events:none;border-radius:50%;
  background:radial-gradient(closest-side,rgba(214,164,92,.06),transparent 100%);
}
.hero__verre > *{position:relative}

.pastille{
  display:inline-block;margin-bottom:18px;
  padding:6px 14px;border-radius:999px;
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.16);
  color:var(--creme-doux);
  font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;
}
.hero__titre{font-size:clamp(2.6rem,6vw,4.6rem);color:var(--creme);margin-bottom:18px}
.hero__intro{color:var(--creme-doux);max-width:52ch;margin-bottom:28px}
.hero__actions{display:flex;flex-wrap:wrap;gap:12px}

.etoffes__haut{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,360px);
  gap:clamp(24px,4vw,56px);align-items:center;
}
.etoffes__photo{aspect-ratio:4/3}

.nuancier{
  list-style:none;margin-top:56px;
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:28px;
}
.echantillon{display:grid;gap:10px;align-content:start}
.echantillon__tissu{
  position:relative;display:block;height:132px;
  border-radius:var(--rayon);
  border:1px solid rgba(255,255,255,.20);
  box-shadow:var(--pres-nuit),var(--loin-nuit);
  transition:transform .24s ease,box-shadow .24s ease;
}
.echantillon:hover .echantillon__tissu{box-shadow:var(--pres-nuit),var(--loin-nuit-fort)}
.echantillon__tissu::before{
  content:"";position:absolute;top:10px;left:50%;translate:-50% 0;
  width:34px;height:6px;border-radius:3px;
  background:linear-gradient(180deg,#D8A860,#A8752F);
}
.echantillon__tissu::after{
  content:"";position:absolute;right:0;bottom:0;width:26px;height:26px;
  background:rgba(255,255,255,.24);
  clip-path:polygon(100% 0,100% 100%,0 100%);
  border-bottom-right-radius:var(--rayon);
}
.echantillon__nom{font-size:1.14rem;color:var(--creme)}
.echantillon__txt{font-size:.9rem;color:var(--creme-doux);line-height:1.5}

.tissu--velours{
  background-color:#5B3468;
  background-image:
    repeating-linear-gradient(90deg,rgba(255,255,255,.05) 0 1px,transparent 1px 4px),
    linear-gradient(180deg,#663D74,#4E2C5B);
}
.tissu--lin{
  background-color:#CDBFA8;
  background-image:
    repeating-linear-gradient(0deg,rgba(60,44,26,.16) 0 1px,transparent 1px 4px),
    repeating-linear-gradient(90deg,rgba(255,255,255,.22) 0 1px,transparent 1px 4px);
}
.tissu--jacquard{
  background-color:#8E6E9C;
  background-image:
    repeating-linear-gradient(45deg,rgba(255,255,255,.16) 0 1px,transparent 1px 13px),
    repeating-linear-gradient(-45deg,rgba(255,255,255,.16) 0 1px,transparent 1px 13px),
    linear-gradient(180deg,#96769F,#836592);
}
.tissu--boucle{
  background-color:#C8AFA6;
  background-image:
    radial-gradient(circle at 50% 50%,rgba(90,60,50,.24) 1.3px,transparent 1.6px),
    radial-gradient(circle at 50% 50%,rgba(255,255,255,.26) 1.1px,transparent 1.4px);
  background-size:8px 8px,8px 8px;
  background-position:0 0,4px 4px;
}
.tissu--cuir{
  background-color:#7A4E2E;
  background-image:
    radial-gradient(circle at 50% 50%,rgba(30,16,8,.20) 1.4px,transparent 1.7px),
    radial-gradient(circle at 50% 50%,rgba(255,255,255,.10) 1.2px,transparent 1.5px),
    linear-gradient(180deg,#835533,#6E452A);
  background-size:9px 9px,13px 13px,auto;
}
.tissu--galon{
  background-color:#A87F3C;
  background-image:repeating-linear-gradient(90deg,#C29349 0 4px,#8E6A2E 4px 8px,#D6A45C 8px 11px);
}

.etoffes__note{
  margin-top:40px;font-size:.86rem;color:var(--creme-doux);
  border-top:1px solid rgba(255,255,255,.14);padding-top:16px;
}

.atelier__grille{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,340px);
  gap:clamp(28px,4vw,64px);align-items:center;
}
.atelier__mot{display:grid;gap:20px}
.atelier__photo{aspect-ratio:3/4}
.encart{
  position:relative;
  background:var(--creme);
  border-radius:var(--rayon);
  padding:24px;
  color:var(--encre);
  box-shadow:var(--pres),var(--loin);
  border:1px solid rgba(35,26,38,.10);
  max-width:60ch;
}

.ouvrages__grille{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,420px);
  gap:clamp(28px,4vw,64px);align-items:center;
}
.ouvrages__photo{aspect-ratio:3/4}
.carnet{list-style:none;display:grid;margin-top:40px}
.ligne{
  display:grid;grid-template-columns:minmax(0,15rem) minmax(0,1fr);
  gap:6px 24px;align-items:baseline;
  padding-block:20px;
  border-bottom:1px dotted rgba(35,26,38,.28);
}
.carnet .ligne:first-child{border-top:1px dotted rgba(35,26,38,.28)}
.ligne__nom{
  font-family:var(--police-titre);font-size:1.16rem;font-weight:600;
  color:var(--encre);position:relative;padding-left:24px;
}
.ligne__nom::before{
  content:"";position:absolute;left:0;top:.52em;
  width:11px;height:11px;border-radius:50%;
  background:radial-gradient(circle at 36% 30%,#EFC684 0%,var(--laiton) 58%,#7C5420 100%);
  box-shadow:0 1px 1px rgba(35,26,38,.28);
}
.ligne__txt{color:var(--encre-douce);font-size:.96rem}

.horaires__grille{
  display:grid;grid-template-columns:minmax(0,560px) minmax(0,1fr);
  gap:clamp(28px,4vw,64px);align-items:center;
}
.horaires__grille .entete-section{grid-column:2;grid-row:1}
.horaires__panneau{grid-column:1;grid-row:1}
.horaires__panneau .tableau__ligne{grid-template-columns:minmax(0,10rem) minmax(0,1fr)}
.tableau{display:grid}
.tableau__ligne{
  display:grid;grid-template-columns:minmax(0,8rem) minmax(0,1fr);
  gap:4px 16px;align-items:baseline;
  padding-block:11px;
  border-bottom:1px dotted rgba(35,26,38,.28);
}
.tableau__ligne:last-child{border-bottom:0}
.tableau dt{font-family:var(--police-titre);font-weight:600;font-size:1.02rem}
.tableau dd{margin:0;color:var(--encre-douce);font-variant-numeric:lining-nums tabular-nums}
.tableau dd a{color:var(--laiton-fonce);text-decoration:none;font-weight:600}
.tableau dd a:hover{text-decoration:underline;text-underline-offset:3px}
.tableau__ligne--ferme dd{opacity:.72}
.tableau__aujourdhui{
  display:inline-block;margin-left:8px;
  padding:2px 8px;border-radius:999px;
  background:var(--laiton);color:var(--encre);
  font-family:var(--police-libelle);font-size:.66rem;letter-spacing:.1em;
  text-transform:uppercase;font-weight:600;vertical-align:middle;
}

.contact__grille{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,380px);
  gap:clamp(28px,4vw,64px);align-items:start;
}
.contact__mot{display:grid;gap:24px;justify-items:start}
.fiche{position:relative;z-index:1}
.fiche__titre{
  font-size:.76rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--encre-douce);font-family:var(--police-libelle);font-weight:600;
  margin-bottom:8px;
}

.pied{background:var(--nuit);color:var(--creme-doux);padding-block:40px}
.pied__dedans{display:flex;flex-wrap:wrap;gap:8px 32px;justify-content:space-between;align-items:baseline}
.pied__qui{font-family:var(--police-titre);font-size:1.06rem;color:var(--creme)}
.pied__demo{font-size:.84rem}
.pied__demo a{
  color:var(--laiton-clair);text-decoration:underline;text-underline-offset:3px;
  display:inline-block;padding:3px 2px;
}

html.js .reveal{
  opacity:0;transform:translateY(20px);
  transition:opacity .55s ease,transform .55s cubic-bezier(.22,.61,.36,1);
  transition-delay:calc(var(--i,0) * 55ms);
}
html.js .reveal.est-vu{opacity:1;transform:none}

@media (max-width:1099px){
  .contact__grille{grid-template-columns:minmax(0,1fr)}
}

@media (max-width:979px){
  #nav-toggle{display:block}
  #nav-links{
    display:none;
    position:absolute;left:0;right:0;top:calc(100% + 14px);
    flex-direction:column;align-items:stretch;gap:4px;
    padding:12px;border-radius:var(--rayon);
    background:color-mix(in srgb,var(--nuit) 96%,transparent);
    border:1px solid rgba(255,255,255,.14);
    box-shadow:var(--pres-nuit),var(--loin-nuit);
  }
  #nav-links.is-open{display:flex}
  #nav-links a{min-height:48px;display:flex;align-items:center}
  #nav-links .bouton--plein{margin-left:0;justify-content:center}
  .nav{position:relative}
}

@media (max-width:899px){
  .etoffes__haut,.atelier__grille,.ouvrages__grille,.horaires__grille{
    grid-template-columns:minmax(0,1fr);
  }
  .horaires__grille .entete-section,.horaires__panneau{grid-column:1;grid-row:auto}
  .nuancier{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
  .atelier__photo{aspect-ratio:16/10;max-width:460px}
  .ouvrages__photo,.etoffes__photo{max-width:460px}
  .dossier{border-radius:50% 50% var(--rayon) var(--rayon) / 52px 52px var(--rayon) var(--rayon)}
}

@media (max-width:719px){
  .section{padding-block:64px}
  .nuancier{grid-template-columns:minmax(0,1fr);gap:24px;margin-top:40px}
  .ligne{grid-template-columns:minmax(0,1fr)}
  .tableau__ligne,.horaires__panneau .tableau__ligne{grid-template-columns:minmax(0,7rem) minmax(0,1fr)}
  .pied__dedans{flex-direction:column}
  .dossier{border-radius:50% 50% var(--rayon) var(--rayon) / 40px 40px var(--rayon) var(--rayon)}
}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  html.js .reveal{
    transform:none;transition:opacity .3s ease;transition-delay:calc(var(--i,0) * 30ms);
  }
  .cadre img,.cadre:hover img{transition:none}
  .bouton,.plaque,.echantillon__tissu{transition:none}
}

@media (max-width:600px){
  .hero{display:block;padding-top:0}
  .hero__fond{position:relative;inset:auto;
    height:min(36vh,268px);margin-bottom:clamp(20px,5vw,28px)}
  .hero__fond::after{
    background-image:
      var(--etoffe),
      linear-gradient(180deg,color-mix(in srgb,var(--nuit) 10%,transparent),
                             color-mix(in srgb,var(--nuit) 34%,transparent));
    background-size:260px 260px,auto;
    background-repeat:repeat,no-repeat;
  }
}

.entete{background-color:rgba(24,16,34,0.76)}
.entete{margin-bottom:-73px}

#nav-links a.bouton.bouton--plein{color:#181022}