/* JORMY MIYAKOU — "la salle et l'atelier"
   Salle  : fond noir (accueil, collections) — pièces exposées
   Atelier: fond papier (fiches, textes, panier) — lisibilité et achat */

@font-face{font-family:"Instrument Sans";src:url("/assets/fonts/instrument-sans.woff2") format("woff2");font-weight:400 700;font-style:normal;font-display:swap}
@font-face{font-family:"Instrument Serif";src:url("/assets/fonts/instrument-serif-italic.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap}

:root{
  /* Grammaire des couleurs — Beige = contempler · Noir = structure · Bleu = comprendre · Orange = agir */
  --noir:#111111;
  --beige:#E5D8C4;
  --bleu:#173B57;
  --orange:#B94E22;          /* orange brûlé, légèrement approfondi pour garder un texte blanc lisible (5:1) */
  --beige-deep:#D7C9B0;
  --mute-on-beige:#5B5347;
  --mute-on-noir:#A99F8F;
  --line-on-beige:#BCAE97;
  --line-on-noir:#38342e;

  --sans:"Instrument Sans",system-ui,-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;
  --serif:"Instrument Serif",Georgia,"Times New Roman",serif;

  --gut:clamp(16px,4vw,48px);
  --s1:8px;--s2:16px;--s3:24px;--s4:40px;--s5:72px;--s6:120px;
  --header-h:56px;
  --ease:cubic-bezier(.23,1,.32,1); /* ease-out fort : retour immédiat, arrivée douce */
}
/* Surfaces : beige par défaut (≈60 %), noir pour la structure (≈25 %), bleu pour la couche technique (≈10 %) */
body.t-paper{--bg:var(--beige);--fg:var(--noir);--mute:var(--mute-on-beige);--line:var(--line-on-beige);--frame:var(--beige-deep)}
.band-dark,.hdr-opp,body.t-dark{--bg:var(--noir);--fg:var(--beige);--mute:var(--mute-on-noir);--line:var(--line-on-noir);--frame:#1c1b19}
.band-dark,.band-blue,.ftr{background:var(--bg);color:var(--fg)}
.band-blue,.ftr{--bg:var(--bleu);--fg:var(--beige);--mute:#BFCAD1;--line:#3C5F78}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--fg);font:400 16px/1.55 var(--sans);-webkit-font-smoothing:antialiased;min-height:100dvh;display:flex;flex-direction:column}
main{flex:1}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:.2em}
button,input,textarea,select{font:inherit;color:inherit}
h1,h2,h3,p,ul,ol,figure,dl,dd{margin:0}
ul,ol{padding:0;list-style:none}
:focus-visible{outline:2px solid currentColor;outline-offset:3px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:var(--gut);top:-100px;background:var(--fg);color:var(--bg);padding:12px 16px;z-index:100}
.skip:focus{top:8px}
.todo{background:#ffe27a;color:#111;padding:0 .25em}

/* ---------- Type ---------- */
.wordmark{font-weight:600;letter-spacing:-.005em;text-transform:uppercase;text-decoration:none;white-space:nowrap}
.cartel{font-size:12px;line-height:1.5;letter-spacing:.09em;text-transform:uppercase;color:var(--mute)}
.cartel span{display:block}
.cartel .strong{color:var(--fg)}
.serif{font-family:var(--serif);font-style:italic;font-weight:400}
.h-page{font-size:clamp(28px,4vw,52px);line-height:1.02;letter-spacing:-.02em;font-weight:500}
.h-sec{font-size:clamp(20px,2.2vw,30px);line-height:1.12;letter-spacing:-.015em;font-weight:500}
.measure{max-width:62ch}
.mute{color:var(--mute)}

/* ---------- Noms de collections (serif italique) ≠ libellés génériques (sans, petites capitales) ---------- */
.cname,.cname-title{font-family:var(--serif);font-style:italic;font-weight:400;text-transform:none;letter-spacing:-.005em}
.cname-title{font-size:clamp(40px,5.6vw,76px);line-height:1}
.col-name.cname{font-size:clamp(36px,5.2vw,72px);letter-spacing:-.01em;line-height:1}
.dd-links .cname{font-size:30px;line-height:1.1;min-height:44px;text-transform:none;letter-spacing:-.005em}
.dd-links .call{margin-top:var(--s2)}
.dd-tile .cname{display:block;font-size:26px;line-height:1.1;margin-top:12px}
.dd-tile .cartel{margin-top:4px}

/* ---------- Header : logo centré, navigation de part et d'autre (esprit Fear of God) ---------- */
.hdr{color:var(--fg);position:sticky;top:0;z-index:50;background:var(--bg);height:var(--header-h);padding-inline:var(--gut);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}
/* Barre transparente au défilement : le texte se réajuste (clair/foncé) selon ce qui passe dessous */
.hdr{transition:background-color .25s var(--ease),border-color .25s var(--ease)}
.hdr.is-clear:not(.is-open){background:transparent;border-bottom-color:transparent;color:var(--beige);mix-blend-mode:difference}
.hdr.is-clear:not(.is-open) .nav a[aria-current="page"]{text-decoration-color:currentColor}
.hdr.is-clear:not(.is-open) .cart-n{color:inherit}
.logo{position:absolute;left:50%;top:0;height:100%;transform:translateX(-50%);display:flex;align-items:center;text-decoration:none;z-index:2}
.logo .wordmark{font-size:clamp(14px,1.5vw,17px)}
.logo img{height:clamp(14px,1.55vw,20px);width:auto;max-width:none}
.nav{display:flex;align-items:center;justify-content:space-between;width:100%;font-size:12px;letter-spacing:.1em;text-transform:uppercase}
.nav-l,.nav-r{display:flex;align-items:center;gap:clamp(18px,2.4vw,36px)}
.nav a{text-decoration:none;min-height:44px;display:inline-flex;align-items:center}
.nav a[aria-current="page"]{text-decoration:underline;text-underline-offset:.45em;text-decoration-thickness:1px}
.nav a[aria-current="page"]{text-decoration-color:var(--orange);text-decoration-thickness:2px}
.sub-m,.hdr-cart,.menu-btn{display:none}
.cart-n{margin-left:.5em;color:var(--mute);font-variant-numeric:tabular-nums}
.cart-n:empty{display:none}

/* Menu déroulant (bureau) */
.dd{position:absolute;left:0;right:0;top:100%;background:var(--bg);border-bottom:1px solid var(--line);padding:var(--s4) var(--gut) var(--s4);display:grid;grid-template-columns:1fr auto;gap:var(--s5);z-index:40}
.dd[hidden]{display:none}
.dd-links{display:grid;align-content:start;gap:4px;font-size:12px;letter-spacing:.1em;text-transform:uppercase}
.dd-links a{text-decoration:none;display:inline-flex;min-height:40px;align-items:center}
.dd-tiles{display:flex;gap:clamp(12px,1.6vw,24px)}
.dd-tile{display:block;width:clamp(180px,22vw,330px);text-decoration:none}
.dd-img{display:block;aspect-ratio:2/3;background:var(--frame);border:1px solid var(--line);overflow:hidden}
.dd-img img{width:100%;height:100%;object-fit:cover}
.dd-tile .cartel{margin-top:12px}

@media (max-width:759px){
  .hdr{display:grid;grid-template-columns:1fr auto 1fr}
  .hdr-cart{display:inline-flex;justify-self:end;align-items:center;min-height:44px;font-size:12px;letter-spacing:.1em;text-transform:uppercase;text-decoration:none}
  .js .menu-btn{display:inline-flex;align-items:center;justify-self:start;background:none;border:0;padding:0;min-height:44px;font-size:12px;letter-spacing:.1em;text-transform:uppercase;cursor:pointer}
  .logo{position:static;transform:none;justify-self:center}
  .dd{display:none!important}
  /* Menu plein écran */
  .nav{position:fixed;inset:var(--header-h) 0 0 0;background:var(--bg);flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:var(--s3);padding:var(--s3) var(--gut);font-size:clamp(26px,8vw,36px);letter-spacing:.02em;overflow:auto;transform:translateY(-8px);opacity:0;visibility:hidden;transition:opacity .22s var(--ease),transform .22s var(--ease),visibility 0s .22s}
  .nav.open{opacity:1;transform:none;visibility:visible;transition:opacity .22s var(--ease),transform .22s var(--ease)}
  .no-js .nav{position:static;opacity:1;visibility:visible;padding:0;font-size:11px;flex-direction:row;flex-wrap:wrap;gap:12px}
  .no-js .hdr{height:auto;display:block;padding-block:8px}.no-js .logo{display:flex;justify-content:center}
  .nav-l,.nav-r{flex-direction:column;align-items:flex-start;gap:0;width:100%}
  .nav a{min-height:56px}
  .nav-cart{display:none!important}
  .nav-r{margin-top:var(--s3);padding-top:var(--s3);border-top:1px solid var(--line);font-size:15px}
  .nav-r a{min-height:48px}
  .has-sub{width:100%}
  .sub-trigger::after{content:"+";margin-left:.6em}
  .has-sub.open .sub-trigger::after{content:"–"}
  .has-sub.open .sub-m{display:grid;padding:0 0 var(--s2) var(--s2)}
  .sub-m a{font-size:15px;min-height:48px;letter-spacing:.1em;text-transform:uppercase}
  .sub-m a.cname{font-size:32px;letter-spacing:-.005em;text-transform:none}
}

/* ---------- Layout ---------- */
.wrap{padding-inline:var(--gut)}
.sec{padding-block:var(--s5)}
@media (min-width:900px){.sec{padding-block:var(--s6)}}
.rule{border-top:1px solid var(--line)}

/* ---------- Galerie horizontale ---------- */
.hero{padding-block:var(--s5) var(--s5)}
.hero-top{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--s3);padding-inline:var(--gut);margin-bottom:var(--s4)}
.hero h1{font-size:clamp(15px,1.6vw,18px);font-weight:600;letter-spacing:-.005em;text-transform:uppercase}
.hero .lead{max-width:34ch;color:var(--mute);font-size:15px;margin-top:6px}
.gallery{position:relative}
.rail{display:flex;gap:clamp(12px,2vw,28px);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-block:var(--s2) var(--s3);
  padding-inline:calc(50% - var(--w) / 2);--w:min(68vw,380px)}
.rail::-webkit-scrollbar{display:none}
@media (min-width:900px){.rail{--w:min(26vw,420px)}}
.slide{flex:0 0 var(--w);scroll-snap-align:center;transform-origin:50% 100%;transform:scale(var(--s,1));will-change:transform}
.slide .frame{opacity:var(--o,1)}
.js .slide{--s:.8;--o:.6}
.frame{display:block;position:relative;aspect-ratio:2/3;background:var(--frame);border:1px solid var(--line);overflow:hidden;text-decoration:none}
.frame img{width:100%;height:100%;object-fit:cover}
.slide .cartel-out{margin-top:12px}
.g-ctrl{display:flex;justify-content:space-between;align-items:center;padding:var(--s2) var(--gut) 0}
.g-ctrl button{background:none;border:0;padding:12px 0;min-height:44px;min-width:44px;font-size:14px;cursor:pointer}
.g-count::before{content:"";display:inline-block;width:6px;height:6px;background:var(--orange);margin-right:10px;vertical-align:1px}
.g-count{font-size:11px;letter-spacing:.09em;color:var(--mute);font-variant-numeric:tabular-nums}
.no-js .g-ctrl{display:none}

/* ---------- Grille collection (verticale) ---------- */
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s4) var(--s2);padding-bottom:var(--s6)}
@media (min-width:640px){.grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s4) var(--s2)}}
@media (min-width:1100px){.grid{gap:var(--s5) var(--s3)}}
.card{display:block;text-decoration:none}
.card-t{display:flex;justify-content:space-between;gap:var(--s2);margin-top:12px;font-size:14px}

/* ---------- Manifeste ---------- */
.manifesto{font-family:var(--serif);font-style:italic;font-size:clamp(34px,6.2vw,92px);line-height:1.04;letter-spacing:-.01em;max-width:18ch}
.manifesto-sign{margin-top:var(--s3)}

/* ---------- Collections (typographiques, pas des cartes) ---------- */
.col-list{display:grid;gap:0;border-top:1px solid var(--line)}
.col-row{display:grid;gap:var(--s2);padding-block:var(--s3);border-bottom:1px solid var(--line);text-decoration:none;grid-template-columns:1fr}
.col-name{font-size:clamp(28px,4.4vw,60px);line-height:.98;letter-spacing:-.03em;font-weight:500}
.col-meta{display:grid;gap:var(--s2);align-content:end}
@media (min-width:900px){.col-row{grid-template-columns:1.4fr 1fr;align-items:end}}

/* ---------- Construction teaser ---------- */
.two{display:grid;gap:var(--s4)}
@media (min-width:900px){.two{grid-template-columns:1fr 1fr;gap:var(--s5)}}
.links{display:flex;flex-wrap:wrap;gap:var(--s3);margin-top:var(--s3)}

.band-blue a{color:var(--fg)}
.band-blue .sec{padding-block:var(--s5)}

/* ---------- Formulaires ---------- */
.field{display:grid;gap:6px;margin-bottom:var(--s3)}
.field label{font-size:13px;color:var(--mute)}
.input{width:100%;background:transparent;border:0;border-bottom:1px solid var(--fg);border-radius:0;padding:12px 0;min-height:48px;font-size:16px}
textarea.input{border:1px solid var(--fg);padding:12px;min-height:160px;resize:vertical}
.input:focus-visible{outline:2px solid var(--fg);outline-offset:4px}
.check{display:grid;grid-template-columns:24px 1fr;gap:12px;align-items:start;font-size:14px;color:var(--mute);margin-bottom:var(--s3)}
.check input{width:20px;height:20px;margin:2px 0 0;accent-color:var(--fg)}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 var(--s4);background:var(--fg);color:var(--bg);border:1px solid var(--fg);border-radius:0;font-size:15px;font-weight:500;cursor:pointer;text-decoration:none}
.btn.cta{background:var(--orange);border-color:var(--orange);color:#fff}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn.ghost{background:transparent;color:var(--fg)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-msg{margin-top:var(--s2);font-size:14px;min-height:1.5em}
.waitlist{max-width:520px}

/* ---------- Pages texte ---------- */
.page-head{padding-block:var(--s5) var(--s4)}
.crumbs{font-size:13px;color:var(--mute);margin-bottom:var(--s3)}
.crumbs ol{display:flex;flex-wrap:wrap;gap:8px}
.crumbs li+li::before{content:"/";margin-right:8px}
.prose h2{font-size:clamp(20px,2.4vw,26px);letter-spacing:-.01em;font-weight:600;margin:var(--s4) 0 var(--s1)}
.prose p{margin-top:var(--s1)}
.prose p+p{margin-top:var(--s2)}
.words{display:grid;gap:4px;margin-block:var(--s4)}
.words li{font-family:var(--serif);font-style:italic;font-size:clamp(34px,6vw,76px);line-height:1.04}

/* Page Atelier Miyakou : lecture confortable, photo après chaque paragraphe, alternance gauche/droite */
.atelier-hero .q{font-family:var(--serif);font-style:italic;font-size:clamp(34px,5.2vw,72px);line-height:1.06;letter-spacing:-.01em;max-width:20ch;margin:0 0 var(--s4)}
.atelier-flow{padding-bottom:var(--s4)}
.af{display:grid;gap:var(--s3);align-items:center;padding-block:var(--s4);border-top:1px solid var(--line)}
.af p{font-size:clamp(18px,1.6vw,21px);line-height:1.7;max-width:46ch;margin:0}
.atelier-fig{margin:0;max-width:440px;width:100%}
.atelier-fig img{display:block;width:100%;height:auto;background:var(--frame)}
.atelier-herofig{padding-bottom:var(--s4)}
.atelier-herofig .atelier-fig{max-width:1000px}
.end-figs{display:flex;flex-wrap:wrap;gap:var(--s3);align-items:flex-end;margin-top:var(--s4)}
.end-figs .atelier-fig{max-width:none;width:auto}
.end-figs img{width:auto;max-width:100%;height:clamp(240px,34vw,420px)}
@media (min-width:900px){
  .af{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s6);padding-block:var(--s5)}
  .af:nth-child(even) .atelier-fig{order:-1;justify-self:end}
}
.atelier-end{padding-block:var(--s5) var(--s6);border-top:1px solid var(--line)}
.atelier-end .end{font-family:var(--serif);font-style:italic;font-size:clamp(26px,3.2vw,44px);line-height:1.2;max-width:24ch}
.atelier-end .cartel{margin-top:var(--s5)}
.atelier-links{display:flex;flex-wrap:wrap;gap:var(--s2) var(--s4);margin-top:var(--s1)}
.atelier-links a{font-size:clamp(30px,4vw,52px);line-height:1.1;text-decoration:none;min-height:44px}

/* Savoir-faire : suite de gestes (dessin, patronage, couture, 3D) */
.craft{display:grid;border-top:1px solid var(--line);margin-block:var(--s3) var(--s4)}
.craft>div{display:grid;gap:6px;padding-block:var(--s2);border-bottom:1px solid var(--line)}
.craft dt{font-size:clamp(20px,2.4vw,28px);letter-spacing:-.015em;font-weight:500}
.craft dd{margin:0;color:var(--mute);max-width:56ch}
.craft .tech dt{color:var(--bleu)}
@media (min-width:760px){.craft>div{grid-template-columns:1fr 2fr;align-items:baseline}}

/* FAQ */
.faq details{border-top:1px solid var(--line)}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;padding:20px 0;min-height:56px;font-size:clamp(17px,2vw,21px);font-weight:500;display:flex;justify-content:space-between;gap:var(--s3);align-items:center}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-weight:400;font-size:24px;line-height:1}
.faq details[open] summary::after{content:"–"}
.faq .ans{padding:0 0 24px;max-width:62ch;color:var(--mute)}

/* ---------- Fiche produit ---------- */
.pdp{display:grid;gap:var(--s4);padding-block:var(--s4) var(--s5)}
@media (min-width:900px){.pdp{grid-template-columns:minmax(0,1fr) 380px;gap:var(--s5);align-items:start}.pdp-info{position:sticky;top:calc(var(--header-h) + 24px)}}
.pdp-media{display:grid;gap:var(--s3);justify-items:center}
.zoom{padding:0;border:0;background:none;cursor:zoom-in;display:block;max-width:100%;line-height:0}
.pdp-media img{width:auto;max-width:100%;height:auto;max-height:calc(100dvh - var(--header-h) - 56px);background:var(--frame)}
.pdp-price{font-size:20px;margin:var(--s1) 0 var(--s3)}
.pdp-info .field select{width:100%;min-height:52px;background:transparent;border:1px solid var(--fg);border-radius:0;padding:0 12px}
.pdp-note{font-size:14px;color:var(--mute);margin-block:var(--s2)}
.acc details{border-top:1px solid var(--line)}
.acc summary{cursor:pointer;list-style:none;min-height:52px;display:flex;align-items:center;justify-content:space-between;font-size:14px}
.acc summary::-webkit-details-marker{display:none}
.acc summary::after{content:"+"}
.acc details[open] summary::after{content:"–"}
.acc .ans{padding-bottom:18px;color:var(--mute);font-size:15px}
.acc .tech{border-top-color:var(--bleu)}
.acc .tech summary{color:var(--bleu);font-weight:500}
.acc .tech .ans{color:var(--bleu)}
.timer{font-variant-numeric:tabular-nums}

/* ---------- Fenêtre de zoom (photo produit) ---------- */
.lb{border:0;padding:0;margin:0;width:100vw;height:100dvh;max-width:none;max-height:none;background:var(--noir);color:var(--beige)}
.lb::backdrop{background:var(--noir)}
.lb-stage{position:absolute;inset:0;overflow:auto;display:grid;place-items:center;padding:56px 0}
.lb-stage img{max-width:100%;max-height:calc(100dvh - 112px);width:auto;height:auto;object-fit:contain;cursor:zoom-in;display:block}
.lb.is-zoom .lb-stage{place-items:start;padding:0}
.lb.is-zoom .lb-stage img{max-width:none;max-height:none;height:250dvh;width:auto;cursor:zoom-out}
.lb-bar,.lb-nav{position:absolute;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding-inline:var(--gut);pointer-events:none;z-index:2}
.lb-bar{top:0;height:56px}
.lb-nav{bottom:0;height:56px}
.lb button{pointer-events:auto;background:none;border:0;color:inherit;font-size:12px;letter-spacing:.1em;text-transform:uppercase;min-height:44px;padding:0 var(--s1);cursor:pointer}
.lb-actions{display:flex;gap:var(--s2)}
.lb-count{font-size:11px;letter-spacing:.09em;color:var(--mute-on-noir);font-variant-numeric:tabular-nums}
.lb.single .lb-nav{display:none}
.lb :focus-visible{outline-color:var(--beige)}
.lb-bar,.lb-nav{background:linear-gradient(var(--noir),transparent)}
.lb-nav{background:linear-gradient(transparent,var(--noir))}

/* ---------- Footer ---------- */
.ftr{padding:var(--s4) var(--gut) var(--s2);overflow:hidden}
.ftr-cols{display:grid;gap:var(--s3) var(--s4);grid-template-columns:1fr 1fr}
@media (min-width:900px){.ftr-cols{grid-template-columns:2fr 1fr 1fr 1fr}}
.ftr h2{font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--mute);font-weight:400;margin-bottom:var(--s1)}
.ftr ul{display:grid;gap:0}
.ftr a{text-decoration:none;display:inline-flex;min-height:44px;align-items:center;font-size:14px}
.ftr .small{font-size:12px;color:var(--mute);margin-top:var(--s3);display:flex;justify-content:space-between;gap:var(--s2);flex-wrap:wrap}
.mega-wrap{container-type:inline-size;margin-top:var(--s5)}
.mega{margin:0;text-align:center;font-weight:600;text-transform:uppercase;letter-spacing:-.04em;line-height:.8;white-space:nowrap;font-size:12.9cqw;user-select:none}
.foot-logo{margin-top:var(--s5)}
.foot-logo img{width:100%;height:auto}

/* ---------- Mouvement ---------- */
@media (prefers-reduced-motion:no-preference){
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .js .slide{--s:1;--o:1}
  *{transition-duration:.01ms!important;animation-duration:.01ms!important}
}

/* ---------- Finitions de mouvement ---------- */
.btn{transition:transform 160ms var(--ease),opacity 160ms var(--ease),background-color 160ms var(--ease)}
.btn:active:not(:disabled){transform:scale(.97)}
a,button,.zoom{-webkit-tap-highlight-color:transparent}
a,button,summary,.zoom,.input{touch-action:manipulation}
.rail{overscroll-behavior-x:contain}
.dd:not([hidden]){animation:dd-in 180ms var(--ease)}
@keyframes dd-in{from{opacity:0;transform:translateY(-6px)}}
.lb[open]{animation:lb-in 160ms var(--ease)}
@keyframes lb-in{from{opacity:0}}

/* ---------- Survols : pointeur précis uniquement ---------- */
@media (hover:hover) and (pointer:fine){
  a:hover{text-decoration-thickness:2px}
  .dd-links a:hover{text-decoration:underline;text-underline-offset:.45em}
  .dd-tile:hover .cname{text-decoration:underline;text-underline-offset:.3em}
  .g-ctrl button:hover{text-decoration:underline}
  .card:hover .card-t>span:first-child{text-decoration:underline;text-underline-offset:.25em}
  .col-row:hover .col-name{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:.12em}
  .btn:hover{opacity:.88}
  .btn.cta:hover{opacity:1;background:#9d3f18;border-color:#9d3f18}
  .atelier-links a:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.15em}
  .lb button:hover{text-decoration:underline;text-underline-offset:.4em}
  .ftr a:hover{text-decoration:underline}
  .nav a:hover{text-decoration:underline;text-underline-offset:.45em;text-decoration-thickness:1px}
}

/* ---------- Corrections issues de la critique ---------- */
.hero-cta{display:flex;justify-content:center;margin:0 0 var(--s3);padding-inline:var(--gut)}
.dd-links .cname small,.sub-m .cname small{font-family:var(--sans);font-style:normal;font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--mute);margin-left:.8em;vertical-align:.25em}

/* ---------- Passe « heuristiques » : statut unique, indices, erreurs par champ ---------- */
.g-center{display:grid;justify-items:center;gap:2px}
.g-status{font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--mute)}
.g-hint{text-align:center;font-size:12px;color:var(--mute);margin-top:var(--s1);transition:opacity .4s var(--ease)}
.g-hint.is-gone{opacity:0;pointer-events:none}
@media (hover:hover) and (pointer:fine){.g-hint{display:none}}
.field-err,.field-hint{font-size:13px;margin-top:6px}
.field-err{color:#8a2a0f}
.band-dark .field-err,.band-blue .field-err{color:#ffb59a}
.field-hint button{background:none;border:0;padding:8px 0;min-height:44px;color:inherit;text-decoration:underline;cursor:pointer;font:inherit}
.input[aria-invalid="true"]{border-color:#8a2a0f}
.check .field-err{grid-column:2}
.back{padding-top:var(--s3);font-size:14px}
.back a{display:inline-flex;min-height:44px;align-items:center}
.card .cartel{margin-top:12px}

/* ---------- Barre de navigation : se retire en descendant, revient en remontant ---------- */
.hdr{transition:transform .5s var(--ease),background-color .25s var(--ease),border-color .25s var(--ease)}
.hdr.is-hidden:not(.is-open){transform:translateY(-150%)}

/* ---------- Page À propos ---------- */
.about{max-width:calc(62ch + var(--gut) * 2);padding-bottom:var(--s6)}
.about p{font-size:clamp(18px,1.6vw,21px);line-height:1.7;max-width:50ch;margin-top:var(--s3)}
.about .q{font-family:var(--serif);font-style:italic;font-size:clamp(34px,5.2vw,68px);line-height:1.06;letter-spacing:-.01em;max-width:18ch;margin:0 0 var(--s4)}
.about .h{font-family:var(--serif);font-style:italic;font-size:clamp(26px,3.4vw,44px);line-height:1.15;max-width:22ch;margin-top:var(--s6);padding-top:var(--s4);border-top:1px solid var(--line)}
.about .about-sign{margin-top:var(--s6);font-size:12px}
.about .about-tag{font-size:clamp(24px,3vw,36px);margin-top:var(--s1);max-width:none}

/* ---------- Page CMJ ATELIER ---------- */
.atelier-sub{margin-top:var(--s2);font-size:clamp(16px,1.5vw,19px);color:var(--mute);max-width:46ch;line-height:1.5}
.atelier-intro{padding-block:var(--s4) var(--s3)}
.atelier-intro p{font-size:clamp(18px,1.6vw,21px);line-height:1.7;max-width:54ch;margin-top:var(--s2)}
.af-text{display:grid;gap:var(--s2);align-content:center}
.af-text p{margin:0}
.af-h{font-size:clamp(24px,2.8vw,36px);line-height:1.15;letter-spacing:-.015em;font-weight:500;margin:0 0 var(--s1);max-width:22ch}
.atelier-sign{margin-top:var(--s2)}
.atelier-cta{margin-top:var(--s5);padding-top:var(--s4);border-top:1px solid var(--line);max-width:56ch}
.atelier-cta p{margin-top:var(--s2);font-size:clamp(17px,1.5vw,20px);line-height:1.65}
.atelier-end .end{font-size:clamp(30px,4vw,56px);max-width:20ch}

/* ============================================================
   Style « doux luxueux » (adopté) — Editorial Luxury / Soft Structuralism
   Palette poussée : crème chaude, encre brune, bleu profond en profondeur, orange en halo.
   Inclus par défaut dans le build ; `node build.mjs --classic` reconstruit sans lui.
   ============================================================ */
:root{
  --soft-ease:cubic-bezier(.32,.72,0,1);
  --cream:#F1E8D8;
  --cream-hi:#F8F2E7;
  --ink:#16120E;
  --shadow-soft:0 40px 80px -40px rgba(60,38,14,.35),0 18px 36px -24px rgba(60,38,14,.22);
}
body.doux.t-paper{--bg:var(--cream);--fg:var(--ink);--frame:#E7DAC4}
body.doux{background:var(--cream);color:var(--ink)}

/* Grain papier (calque fixe, jamais sur un conteneur qui défile) */
body.doux::after{content:"";position:fixed;inset:0;z-index:40;pointer-events:none;opacity:.05;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}

/* Navigation : îlot flottant en verre dépoli */
.doux .hdr{position:fixed;top:14px;left:0;right:0;margin-inline:auto;width:min(1120px,calc(100% - 24px));height:60px;border:0;border-radius:999px;background:none;padding-inline:28px;mix-blend-mode:normal!important;color:var(--ink)!important}
.doux .hdr::before{content:"";position:absolute;inset:0;border-radius:inherit;z-index:-1;background:rgba(248,242,231,.72);backdrop-filter:blur(22px) saturate(140%);-webkit-backdrop-filter:blur(22px) saturate(140%);box-shadow:0 1px 0 rgba(255,255,255,.7) inset,0 14px 40px -18px rgba(60,38,14,.35)}
.doux .hdr.hdr-opp{--bg:var(--ink);--fg:var(--cream)}
.doux .hdr.hdr-opp::before{background:rgba(22,18,14,.78)}
.doux .hdr.hdr-opp{color:var(--cream)!important}
.doux main{padding-top:88px}
.doux .dd{top:calc(100% + 10px);left:0;right:0;border:0;border-radius:32px;background:rgba(248,242,231,.86);backdrop-filter:blur(26px) saturate(140%);-webkit-backdrop-filter:blur(26px) saturate(140%);box-shadow:var(--shadow-soft);animation:soft-in .5s var(--soft-ease)}
@keyframes soft-in{from{opacity:0;transform:translateY(-10px) scale(.985)}}
.doux .dd-img{border:0;border-radius:22px;box-shadow:var(--shadow-soft)}
.doux .dd-tile .cname{font-size:30px}

/* Images : double enveloppe (plateau + cœur) */
.doux .frame{padding:8px;border:0;border-radius:30px;background:rgba(255,255,255,.45);box-shadow:var(--shadow-soft),0 0 0 1px rgba(22,18,14,.06) inset}
.doux .frame img{border-radius:22px;box-shadow:0 1px 0 rgba(255,255,255,.5) inset}
.doux .card:hover .frame,.doux .slide:hover .frame{transform:translateY(-4px)}
.doux .frame{transition:transform .7s var(--soft-ease),box-shadow .7s var(--soft-ease)}
.doux .dd-img img{border-radius:22px}

/* Boutons : pilules, appui physique, halo orange */
.doux .btn{border-radius:999px;min-height:56px;padding:0 var(--s4);transition:transform .5s var(--soft-ease),box-shadow .5s var(--soft-ease),background-color .4s var(--soft-ease)}
.doux .btn.cta{background:var(--orange);border-color:var(--orange);box-shadow:0 18px 36px -14px rgba(185,78,34,.65),0 1px 0 rgba(255,255,255,.25) inset;padding-right:10px;gap:14px}
.doux .btn.cta::after{content:"\2197";display:inline-grid;place-items:center;width:38px;height:38px;border-radius:999px;background:rgba(255,255,255,.18);font-size:16px;transition:transform .5s var(--soft-ease)}
.doux .btn.cta:hover::after{transform:translate(3px,-2px) scale(1.06)}
.doux .btn:active:not(:disabled){transform:scale(.98)}
.doux .hero-cta{margin-bottom:var(--s4)}

/* Rythme : macro-espaces */
.doux .sec{padding-block:clamp(96px,13vw,176px)}
.doux .col-row{border-radius:36px;padding:var(--s4) var(--s4);margin-bottom:var(--s2);border:0;background:rgba(255,255,255,.35);box-shadow:0 0 0 1px rgba(22,18,14,.05) inset;transition:transform .7s var(--soft-ease),background-color .7s var(--soft-ease),box-shadow .7s var(--soft-ease)}
.doux .col-list{border-top:0}
.doux .col-row:hover{transform:translateY(-3px);background:rgba(255,255,255,.6);box-shadow:var(--shadow-soft)}
.doux .col-name.cname{font-size:clamp(44px,7vw,104px)}
.doux .band-blue{border-radius:48px;margin:0 clamp(12px,2vw,28px);background:radial-gradient(120% 140% at 85% 0%,#24577C 0%,var(--bleu) 55%,#0F2A40 100%);box-shadow:var(--shadow-soft)}
.doux .band-blue .sec{padding-inline:clamp(24px,5vw,72px)}
.doux .band-dark{border-radius:0 0 48px 48px}
.doux .ftr{border-radius:48px 48px 0 0;margin-top:clamp(48px,6vw,96px);background:#16120E;position:relative;overflow:hidden}
.doux .ftr::before{content:"";position:absolute;right:-10%;top:-30%;width:60%;height:90%;background:radial-gradient(closest-side,rgba(185,78,34,.18),transparent);pointer-events:none}

/* Champs : plus doux */
.doux .input{border-radius:0;border-bottom-color:rgba(22,18,14,.45);transition:border-color .5s var(--soft-ease)}
.doux .input:focus-visible{border-bottom-color:var(--ink)}
.doux .check input{accent-color:var(--orange)}

/* Atelier : les photos de la page */
.doux .atelier-fig img,.doux .atelier-herofig img{border-radius:28px;box-shadow:var(--shadow-soft)}

/* Révélation douce à l'entrée dans l'écran */
.js.doux-ready .reveal{opacity:0;transform:translateY(40px);filter:blur(10px);transition:opacity 1s var(--soft-ease),transform 1s var(--soft-ease),filter 1s var(--soft-ease)}
.js.doux-ready .reveal.in{opacity:1;transform:none;filter:none}
@media (prefers-reduced-motion:reduce){.js.doux-ready .reveal{opacity:1;transform:none;filter:none;transition:none}}

/* Mobile : îlot plus compact, menu plein écran sous l'îlot */
@media (max-width:759px){
  .doux .hdr{width:calc(100% - 16px);top:8px;height:56px;padding-inline:20px}
  .doux main{padding-top:76px}
  .doux .nav{inset:0;padding-top:96px;background:rgba(241,232,216,.97)}
  .doux .band-blue,.doux .ftr{border-radius:32px}
  .doux .col-row{padding:var(--s3)}
}

/* Barre en îlot : elle glisse hors de l'écran vers le haut */
.doux .hdr{transition:transform .6s var(--soft-ease)}
.doux .hdr.is-hidden:not(.is-open){transform:translateY(-160%)}

/* Bandeau bleu de l'accueil : moins de vide, citation en serif italique, lien en pilule */
.doux .band-blue .sec{padding-block:clamp(48px,6vw,88px)}
.doux .band-blue .two{align-items:center;gap:clamp(24px,5vw,72px)}
.doux .band-blue .h-sec{font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(34px,4.6vw,64px);line-height:1.06;letter-spacing:-.01em;max-width:16ch}
.doux .band-blue .measure p{font-size:clamp(18px,1.7vw,22px);line-height:1.55;color:var(--fg);max-width:34ch}
.doux .band-blue .links{margin-top:var(--s3)}
.doux .band-blue .links a{display:inline-flex;align-items:center;min-height:52px;padding:0 28px;border:1px solid rgba(229,216,196,.55);border-radius:999px;text-decoration:none;transition:background-color .5s var(--soft-ease),color .5s var(--soft-ease),transform .5s var(--soft-ease)}
.doux .band-blue .links a:active{transform:scale(.98)}
@media (hover:hover) and (pointer:fine){.doux .band-blue .links a:hover{background:var(--beige);color:var(--bleu)}}