/* ==========================================================================
   Pages de marque et pages légales : /a-propos/, /remplacement/, /ambiances/,
   /mentions-legales.html, /politique-confidentialite.html, /404.html
   S'appuie sur les jetons et composants de site.css (DA 8 « Galerie »).
   Préfixes : m- (commun), g- (engagement de remplacement), amb- (ambiances), doc- (légal), e- (404).
   ========================================================================== */

/* ---------- Socle des pages internes : en-tête fixe au-dessus du crème ---------- */
.m-page{padding-top:var(--tete-h)}
.m-ariane{padding-top:clamp(20px, 4vh, 40px);color:var(--encre-doux)}
.m-ariane ol{display:flex;flex-wrap:wrap;align-items:center;gap:0 10px}
.m-ariane li{display:inline-flex;align-items:center;gap:10px}
.m-ariane li + li::before{content:"/";color:var(--brun);font-weight:400}
.m-ariane a{text-decoration:none;min-height:44px;display:inline-flex;align-items:center}
.m-ariane a:hover{color:var(--encre);text-decoration:underline;text-underline-offset:4px}
.m-ariane [aria-current]{color:var(--encre)}

/* ---------- Tête de page typographique ---------- */
.m-tete{
  display:grid;grid-template-columns:minmax(0, 1.3fr) minmax(0, 1fr);gap:clamp(32px, 6vw, 110px);align-items:end;
  padding-top:clamp(32px, 7vh, 88px);padding-bottom:clamp(56px, 10vh, 120px);
}
.m-tete > div > .label{color:var(--brun);display:block;margin-bottom:22px}
.m-titre{font-family:var(--serif);font-weight:400;color:var(--canard);font-size:clamp(54px, 8.4vw, 150px);line-height:.9;letter-spacing:-.025em}
.m-titre em{font-style:italic}
.m-chapo{font-size:19px;font-weight:300;line-height:1.6;max-width:42ch;color:var(--encre-doux)}
.m-chapo + .m-chapo{margin-top:14px}
.m-chapo strong{font-weight:500;color:var(--encre)}
@media (max-width:899px){
  .m-tete{grid-template-columns:1fr;gap:28px}
  .m-chapo{font-size:17.5px}
}

/* ---------- Titres de section ---------- */
.m-h2{font-family:var(--serif);font-weight:400;color:var(--canard);font-size:clamp(40px, 5.6vw, 96px);line-height:.95;letter-spacing:-.02em}
.m-h2 em{font-style:italic}
.m-sur{display:block;color:var(--brun);margin-bottom:18px}
.m-texte{font-size:18px;font-weight:300;max-width:52ch;color:var(--encre-doux)}
.m-texte + .m-texte{margin-top:16px}
.m-texte a,.doc a,.g-faq a{color:var(--canard);text-underline-offset:3px}

/* ---------- À propos : photo du fondateur dans la tête ---------- */
.m-tete--photo{align-items:center}
.m-portrait .ph{aspect-ratio:1800/1088}
.m-portrait .legende span:last-child{color:var(--canard)}

/* ---------- À propos : le parcours en trois chapitres ---------- */
.m-chapitres{display:grid;grid-template-columns:repeat(3, minmax(0, 1fr));gap:clamp(28px, 4vw, 64px);margin-top:clamp(40px, 7vh, 80px)}
.m-chapitre{border-top:1px solid var(--filet-fort);padding-top:22px}
.m-chapitre .num{display:block;font-family:var(--serif);font-size:clamp(56px, 5vw, 88px);line-height:.9;color:var(--brun)}
.m-chapitre h3{font-family:var(--serif);font-weight:400;font-size:clamp(28px, 2.4vw, 38px);line-height:1.05;margin:18px 0 12px;color:var(--canard)}
.m-chapitre h3 em{font-style:italic}
.m-chapitre p{font-size:16.5px;font-weight:300;color:var(--encre-doux)}
/* Une vraie photo par chapitre (28/09/2026) : au-dessus du filet, cadre 4:5 */
.m-chapitre-ph{margin:0 0 26px;padding:8px 8px 0}
.m-chapitre-ph .ph{aspect-ratio:4/5}
.m-chapitre-ph .legende{padding:8px 0 9px;font-size:10px}
@media (max-width:899px){ .m-chapitres{grid-template-columns:1fr;gap:36px} .m-chapitre-ph{max-width:420px} }

/* ---------- À propos : la thèse, trois constats ---------- */
.m-these-tete{display:grid;grid-template-columns:minmax(0, 1.5fr) minmax(0, 1fr);gap:clamp(28px, 5vw, 90px);align-items:end;padding-top:36px;border-top:1px solid var(--encre)}
.m-constats{margin-top:clamp(40px, 7vh, 80px);border-top:1px solid var(--encre);counter-reset:constat}
.m-constat{
  display:grid;grid-template-columns:72px minmax(0, 1.05fr) minmax(0, 1fr);gap:10px 28px;align-items:baseline;
  padding:26px 0;border-bottom:1px solid var(--filet);counter-increment:constat;
}
.m-constat::before{content:"0" counter(constat);font-family:var(--serif);font-size:24px;color:var(--brun)}
.m-constat h3{font-family:var(--serif);font-weight:400;font-size:clamp(30px, 3.4vw, 56px);line-height:1.02;letter-spacing:-.015em}
.m-constat h3 em{font-style:italic;color:var(--canard)}
.m-constat p{font-size:16.5px;font-weight:300;color:var(--encre-doux);max-width:46ch}
.m-reponse{display:grid;grid-template-columns:minmax(0, 1fr) auto;gap:24px 48px;align-items:center;margin-top:clamp(40px, 6vh, 64px)}
.m-reponse p{font-family:var(--serif);font-size:clamp(26px, 2.4vw, 38px);line-height:1.2;max-width:34ch}
.m-reponse p em{font-style:italic;color:var(--canard)}
.m-liens{display:flex;flex-wrap:wrap;gap:6px 28px}
@media (max-width:899px){
  .m-these-tete,.m-reponse{grid-template-columns:1fr}
  .m-constat{grid-template-columns:44px minmax(0, 1fr)}
  .m-constat p{grid-column:2}
}

/* ---------- À propos : le mot de Freddy (le seul aplat vert canard de la page) ---------- */
.m-signe{background:var(--canard);color:var(--creme);position:relative;overflow:hidden}
.m-signe::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:var(--grain);background-size:180px;opacity:.12;mix-blend-mode:soft-light;
}
.m-signe-grille{display:grid;grid-template-columns:minmax(0, .9fr) minmax(0, 1.3fr);gap:clamp(36px, 7vw, 130px);align-items:start;position:relative;z-index:1}
.m-signe .m-sur{color:var(--sable-texte)}
.m-signe .m-h2{color:var(--creme)}
.m-signe .m-h2 em{color:var(--sable)}
.m-lettre p{font-size:18px;font-weight:300;line-height:1.7;color:rgba(243,235,221,.92);max-width:56ch}
.m-lettre p + p{margin-top:18px}
.m-lettre p.m-lettre-ouv{font-family:var(--serif);font-weight:400;font-size:clamp(26px, 2.5vw, 40px);line-height:1.18;color:var(--creme)}
.m-lettre p.m-lettre-ouv em{font-style:italic;color:var(--sable)}
.m-lettre footer{margin-top:30px;padding-top:18px;border-top:1px solid rgba(219,190,129,.5);display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;color:var(--sable-texte)}
@media (max-width:899px){ .m-signe-grille{grid-template-columns:1fr} }

/* ---------- « Fallait y être » : le cadre sans photo ---------- */
.m-vide-grille{display:grid;grid-template-columns:minmax(0, 1fr) minmax(0, 1.1fr);gap:clamp(40px, 7vw, 120px);align-items:center}
.m-vide{max-width:520px;width:100%}
.m-vide .ph{
  aspect-ratio:4/5;display:grid;place-items:center;
  background:
    radial-gradient(120% 80% at 50% 38%, rgba(255,255,255,.5), rgba(255,255,255,0) 60%),
    var(--papier-photo);
}
/* Rock Salt : un seul élément par page */
.m-signature{
  font-family:var(--main);font-size:clamp(28px, 3.4vw, 50px);line-height:1.3;color:var(--canard);
  transform:rotate(-6deg);text-align:center;padding:0 10%;position:relative;z-index:1;
}
.m-vide .legende span:last-child{color:var(--encre-doux)}
@media (max-width:899px){
  .m-vide-grille{grid-template-columns:1fr}
  .m-vide{max-width:420px}
}

/* ---------- Lieux partenaires : reprend .logos de site.css ---------- */
.m-lieux-liste{margin-top:20px;font-size:14px;color:var(--encre-doux);max-width:90ch}

/* ---------- Appel final ---------- */
.m-appel{display:grid;grid-template-columns:minmax(0, 1.4fr) minmax(0, 1fr);gap:28px clamp(32px, 6vw, 110px);align-items:end;padding-top:40px;border-top:1px solid var(--encre)}
.m-appel-actions{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.m-appel-actions .btn-contour{color:var(--encre)}
@media (hover:hover) and (pointer:fine){
  .m-appel-actions .btn-contour:hover{background:var(--encre);color:var(--creme);border-color:var(--encre)}
}
.m-appel-note{font-size:14.5px;color:var(--encre-doux)}
.m-appel-note a{color:var(--canard);text-underline-offset:3px}
@media (max-width:899px){ .m-appel{grid-template-columns:1fr} }

/* ==========================================================================
   Engagement de remplacement
   ========================================================================== */
.g-encadre{
  display:grid;grid-template-columns:auto minmax(0, 1fr);gap:24px clamp(24px, 4vw, 56px);align-items:start;
  background:var(--blanc);border-left:3px solid var(--canard);padding:clamp(28px, 5vw, 64px);
  box-shadow:0 1px 0 rgba(14,13,11,.06), 0 30px 60px -40px rgba(14,13,11,.35);
}
.g-encadre > svg{width:52px;height:52px;color:var(--canard)}
.g-encadre .label{display:block;color:var(--brun);margin-bottom:16px}
.g-encadre blockquote p{font-family:var(--serif);font-size:clamp(30px, 3.5vw, 58px);line-height:1.08;letter-spacing:-.01em}
.g-encadre blockquote p em{font-style:italic;color:var(--canard)}
.g-encadre blockquote footer{margin-top:22px;font-size:14px;color:var(--encre-doux)}
@media (max-width:640px){ .g-encadre{grid-template-columns:1fr} .g-encadre > svg{width:40px;height:40px} }

.g-trois{display:grid;grid-template-columns:repeat(3, minmax(0, 1fr));gap:clamp(24px, 4vw, 56px);margin-top:clamp(48px, 8vh, 96px)}
.g-trois > div{border-top:1px solid var(--encre);padding-top:20px}
.g-trois b{display:block;font-family:var(--serif);font-weight:400;font-size:clamp(36px, 3.6vw, 60px);line-height:1;color:var(--canard)}
.g-trois b em{font-style:italic}
.g-trois p{margin-top:14px;font-size:16.5px;font-weight:300;color:var(--encre-doux)}
@media (max-width:899px){ .g-trois{grid-template-columns:1fr;gap:32px} }

.g-note{margin-top:14px;font-size:14px;color:var(--encre-doux)}
.g-cas{margin-top:clamp(40px, 7vh, 72px);border-top:1px solid var(--encre)}
.g-un{display:grid;grid-template-columns:minmax(0, .8fr) minmax(0, 2fr);gap:18px clamp(28px, 5vw, 90px);padding:clamp(28px, 5vh, 48px) 0;border-bottom:1px solid var(--filet)}
.g-un-tete .label{display:block;color:var(--brun)}
.g-un-tete h3{font-family:var(--serif);font-weight:400;font-size:clamp(40px, 4.4vw, 76px);line-height:.95;letter-spacing:-.02em;margin-top:12px}
.g-un-tete h3 em{font-style:italic;color:var(--canard)}
.g-etapes{display:grid;grid-template-columns:repeat(3, minmax(0, 1fr));gap:24px;margin:0}
.g-etapes dt{color:var(--encre-doux);padding-bottom:10px;border-bottom:1px solid var(--filet);margin-bottom:12px}
.g-etapes dd{margin:0;font-size:16.5px;font-weight:300;line-height:1.55}
.g-etapes div:last-child dd{font-family:var(--serif);font-weight:400;font-size:clamp(24px, 2vw, 30px);line-height:1.15;color:var(--canard)}
.g-etapes div:last-child dd em{font-style:italic}
@media (max-width:899px){
  .g-un{grid-template-columns:1fr}
  .g-etapes{grid-template-columns:1fr;gap:20px}
}

.g-non-grille{display:grid;grid-template-columns:minmax(0, 1fr) minmax(0, 1.4fr);gap:clamp(32px, 6vw, 110px);align-items:start}
.g-non li{display:grid;grid-template-columns:32px minmax(0, 1fr);gap:16px;padding:20px 0;border-bottom:1px solid var(--filet)}
.g-non li:first-child{border-top:1px solid var(--encre)}
.g-non svg{width:22px;height:22px;color:var(--brun);margin-top:4px}
.g-non b{display:block;font-weight:600;font-size:17px;margin-bottom:4px}
.g-non p{font-size:16px;font-weight:300;color:var(--encre-doux)}
@media (max-width:899px){ .g-non-grille{grid-template-columns:1fr} }

/* FAQ : details natifs, lisibles sans JS */
.g-faq-grille{display:grid;grid-template-columns:minmax(0, 1fr) minmax(0, 1.8fr);gap:clamp(32px, 6vw, 110px);align-items:start}
.g-faq{border-top:1px solid var(--encre)}
.g-faq details{border-bottom:1px solid var(--filet)}
.g-faq summary{
  list-style:none;cursor:pointer;display:grid;grid-template-columns:minmax(0, 1fr) 28px;gap:20px;align-items:center;
  min-height:44px;padding:22px 0;font-family:var(--serif);font-size:clamp(24px, 2.2vw, 34px);line-height:1.12;
}
.g-faq summary::-webkit-details-marker{display:none}
.g-faq summary::after{
  content:"";width:18px;height:18px;justify-self:end;
  background:linear-gradient(var(--brun), var(--brun)) center/100% 1.5px no-repeat, linear-gradient(var(--brun), var(--brun)) center/1.5px 100% no-repeat;
  transition:transform .3s var(--ease-out);
}
.g-faq details[open] summary::after{transform:rotate(45deg)}
@media (hover:hover) and (pointer:fine){ .g-faq summary:hover{color:var(--canard)} }
.g-faq details p{padding:0 48px 24px 0;font-size:17px;font-weight:300;max-width:62ch;color:var(--encre-doux)}
@media (max-width:899px){
  .g-faq-grille{grid-template-columns:1fr}
  .g-faq details p{padding-right:0}
}

/* ==========================================================================
   Ambiances : pochette de disque en CSS, lecteur Spotify chargé au clic
   ========================================================================== */
.amb-note{display:flex;gap:12px;align-items:flex-start;margin-top:26px;padding:14px 16px;background:rgba(255,255,255,.6);border-left:2px solid var(--canard);font-size:14.5px;color:var(--encre-doux);max-width:52ch}
.amb-note svg{width:18px;height:18px;flex:none;color:var(--canard);margin-top:3px}
.amb-liste{counter-reset:amb;border-top:1px solid var(--encre)}
.amb{
  counter-increment:amb;display:grid;grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);gap:clamp(32px, 6vw, 110px);align-items:center;
  padding:clamp(40px, 8vh, 96px) 0;border-bottom:1px solid var(--filet);
}
.amb.inverse .amb-lecteur{order:2}
.amb-texte .label{display:block;color:var(--brun)}
.amb-texte .label::before{content:counter(amb, decimal-leading-zero) "\2002/\2002"}
.amb-texte h2{font-family:var(--serif);font-weight:400;font-size:clamp(46px, 5.6vw, 96px);line-height:.95;letter-spacing:-.02em;color:var(--canard);margin-top:16px}
.amb-texte h2 em{font-style:italic}
.amb-moment{margin-top:14px;font-family:var(--serif);font-style:italic;font-size:24px;line-height:1.2;color:var(--encre)}
.amb-texte p.amb-desc{margin-top:14px;font-size:17px;font-weight:300;max-width:44ch;color:var(--encre-doux)}
.amb-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px 28px;margin-top:28px}
.amb-actions .lien svg{width:14px;height:14px}

/* La pochette : manchon carré à gauche, disque qui dépasse à droite */
.amb-lecteur{position:relative;max-width:620px;width:100%}
.pochette{position:relative;aspect-ratio:1.22/1;--etiquette:var(--canard-profond);--etiquette-texte:var(--creme)}
.pochette .disque{
  position:absolute;top:4%;bottom:4%;left:22.5%;aspect-ratio:1;border-radius:50%;z-index:1;
  background:
    radial-gradient(circle, var(--etiquette) 0 16%, #0e0d0b 16.5% 17.5%, transparent 18%),
    conic-gradient(from 30deg, rgba(255,255,255,0) 0 12%, rgba(255,255,255,.09) 16%, rgba(255,255,255,0) 22% 62%, rgba(255,255,255,.07) 66%, rgba(255,255,255,0) 72%),
    repeating-radial-gradient(circle, #1a1916 0 1px, #0e0d0b 1.5px 3.5px);
  box-shadow:0 18px 40px -22px rgba(14,13,11,.7);
  display:grid;place-items:center;
  transition:transform .8s var(--ease-out);
}
.pochette .disque .tete{--h:clamp(20px, 2.6vw, 36px);background:var(--etiquette-texte);opacity:.92}
.pochette .manchon{
  position:absolute;left:0;top:0;bottom:0;aspect-ratio:1;z-index:2;overflow:hidden;
  background:var(--etiquette);color:var(--etiquette-texte);
  display:flex;flex-direction:column;justify-content:space-between;padding:clamp(16px, 2.4vw, 28px);
  box-shadow:0 1px 0 rgba(14,13,11,.08), 0 24px 48px -30px rgba(14,13,11,.55);
}
.pochette .manchon::after{content:"";position:absolute;inset:0;pointer-events:none;background-image:var(--grain);background-size:180px;opacity:.22;mix-blend-mode:soft-light}
.pochette .manchon .label{font-size:10px;opacity:.85}
.pochette .manchon b{font-family:var(--serif);font-weight:400;font-size:clamp(28px, 3.4vw, 52px);line-height:.95;letter-spacing:-.015em}
.pochette .manchon b em{font-style:italic}
.pochette .manchon .bas{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;opacity:.85}
.pochette .manchon .bas i{font-style:normal;font-family:var(--serif);font-weight:400;font-size:clamp(32px, 3.6vw, 56px);letter-spacing:0;line-height:.8;text-transform:none}
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion: no-preference){
  .amb:hover .pochette .disque{transform:translateX(8%) rotate(24deg)}
}
/* Teintes par ambiance, toujours dans la palette Héritage */
.pochette.t-canard{--etiquette:var(--canard)}
.pochette.t-brun{--etiquette:var(--brun)}
.pochette.t-cuivre{--etiquette:var(--cuivre);--etiquette-texte:var(--encre)}
.pochette.t-sable{--etiquette:var(--sable);--etiquette-texte:var(--encre)}
.pochette.t-encre{--etiquette:var(--encre);--etiquette-texte:var(--sable)}
/* Le lecteur, une fois chargé */
.amb-lecteur iframe{display:block;width:100%;height:352px;border:0;border-radius:12px;background:var(--encre)}
@media (max-width:899px){
  .amb,.amb.inverse{grid-template-columns:1fr}
  .amb.inverse .amb-lecteur{order:0}
}
.amb-suite{display:grid;grid-template-columns:minmax(0, 1.4fr) minmax(0, 1fr);gap:28px clamp(32px, 6vw, 110px);align-items:end}
@media (max-width:899px){ .amb-suite{grid-template-columns:1fr} }

/* ==========================================================================
   Pages légales : sommaire collant et texte à 68 caractères
   ========================================================================== */
.doc{display:grid;grid-template-columns:minmax(200px, 280px) minmax(0, 1fr);gap:clamp(32px, 7vw, 140px);align-items:start;padding-bottom:clamp(72px, 12vh, 140px)}
.doc-som{position:sticky;top:calc(var(--tete-h) + 28px);border-top:1px solid var(--encre);padding-top:14px}
.doc-som .label{display:block;color:var(--encre-doux);margin-bottom:6px}
.doc-som ol{counter-reset:som}
.doc-som li{counter-increment:som}
.doc-som a{display:flex;gap:12px;align-items:baseline;min-height:44px;padding:10px 0;text-decoration:none;font-size:15px;line-height:1.35;border-bottom:1px solid var(--filet);color:var(--encre)}
.doc-som a::before{content:counter(som, decimal-leading-zero);font-family:var(--serif);font-size:17px;color:var(--brun);min-width:1.4em}
.doc-som a:hover{color:var(--canard)}
.doc-corps{counter-reset:art;max-width:760px}
.doc-corps section{counter-increment:art;padding-top:8px;scroll-margin-top:calc(var(--tete-h) + 24px)}
.doc-corps section + section{margin-top:clamp(40px, 6vh, 64px)}
.doc-corps h2{
  display:flex;gap:18px;align-items:baseline;
  font-family:var(--serif);font-weight:400;font-size:clamp(30px, 3vw, 46px);line-height:1.05;letter-spacing:-.01em;color:var(--canard);
  padding-bottom:14px;border-bottom:1px solid var(--filet-fort);margin-bottom:22px;
}
.doc-corps h2::before{content:counter(art, decimal-leading-zero);font-size:.55em;color:var(--brun)}
.doc-corps h3{font-size:17px;font-weight:600;margin:26px 0 8px}
.doc-corps p,.doc-corps li{font-size:17px;line-height:1.7;color:var(--encre)}
.doc-corps p + p{margin-top:12px}
.doc-corps ul.puces{margin-top:10px}
.doc-corps ul.puces li{position:relative;padding-left:22px}
.doc-corps ul.puces li + li{margin-top:6px}
.doc-corps ul.puces li::before{content:"";position:absolute;left:2px;top:.85em;width:9px;height:1px;background:var(--brun)}
.doc-corps ul.puces + p{margin-top:12px}
.doc-corps code{font-size:.88em;background:rgba(255,255,255,.7);border:1px solid var(--filet);padding:1px 6px}
.doc-fiche{display:grid;grid-template-columns:minmax(150px, .7fr) minmax(0, 1.3fr);margin:0;border-top:1px solid var(--filet)}
.doc-fiche dt,.doc-fiche dd{margin:0;padding:12px 0;border-bottom:1px solid var(--filet)}
.doc-fiche dt{font-size:11.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--encre-doux);padding-right:16px;padding-top:15px}
.doc-fiche dd{font-size:16.5px}
.doc-table-wrap{overflow-x:auto;margin-top:14px}
.doc-table{width:100%;border-collapse:collapse;font-size:15.5px;line-height:1.5}
.doc-table th,.doc-table td{text-align:left;vertical-align:top;padding:12px 14px 12px 0;border-bottom:1px solid var(--filet)}
.doc-table th{font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--encre-doux);border-bottom-color:var(--encre)}
.doc-table td:first-child{font-weight:500;width:34%}
.doc-maj{margin-top:clamp(40px, 6vh, 64px);padding-top:16px;border-top:1px solid var(--encre);font-size:14px;color:var(--encre-doux)}
.doc-bouton{
  font:inherit;font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  display:inline-flex;align-items:center;min-height:44px;padding:0 18px;margin-top:14px;
  background:transparent;border:1px solid var(--canard);color:var(--canard) !important;cursor:pointer;
  transition:background-color .2s ease, color .2s ease, transform .16s var(--ease-out);text-decoration:none;
}
.doc-bouton:active{transform:scale(.97)}
@media (hover:hover) and (pointer:fine){ .doc-bouton:hover{background:var(--canard);color:var(--creme) !important} }
@media (max-width:899px){
  .doc{grid-template-columns:1fr}
  .doc-som{position:relative;top:auto}
  .doc-fiche{grid-template-columns:1fr}
  .doc-fiche dt{border-bottom:0;padding-bottom:0}
  .doc-corps p,.doc-corps li{font-size:16.5px}
  .doc-table,.doc-table tbody,.doc-table tr,.doc-table td{display:block;width:auto}
  .doc-table thead{display:none}
  .doc-table tr{padding:10px 0;border-bottom:1px solid var(--filet)}
  .doc-table td{border:0;padding:2px 0}
  .doc-table td:first-child{width:auto}
}

/* ==========================================================================
   404
   ========================================================================== */
.e-corps{display:grid;grid-template-columns:minmax(0, 1.2fr) minmax(0, 1fr);gap:clamp(32px, 6vw, 110px);align-items:center;padding-top:clamp(40px, 8vh, 96px);padding-bottom:clamp(72px, 12vh, 140px);min-height:calc(100vh - var(--tete-h))}
.e-code{display:block;font-family:var(--serif);font-size:clamp(96px, 15vw, 240px);line-height:.8;letter-spacing:-.04em;color:var(--brun)}
.e-corps .m-titre{margin-top:22px;font-size:clamp(46px, 6.4vw, 108px)}
.e-corps .m-chapo{margin-top:22px}
.e-corps .m-signature{text-align:left;padding:0;margin-top:18px;display:inline-block;font-size:clamp(22px, 2.4vw, 34px);transform:rotate(-4deg);transform-origin:left center;color:var(--canard)}
.e-liens{border-top:1px solid var(--encre)}
.e-liens a{
  display:grid;grid-template-columns:minmax(0, 1fr) auto;gap:16px;align-items:baseline;min-height:44px;padding:12px 0;
  border-bottom:1px solid var(--filet);text-decoration:none;font-family:var(--serif);font-size:clamp(24px, 2.2vw, 32px);line-height:1.1;
}
.e-liens a span{font-family:var(--sans);font-size:13px;color:var(--encre-doux)}
@media (hover:hover) and (pointer:fine){ .e-liens a:hover{color:var(--canard)} }
@media (max-width:899px){ .e-corps{grid-template-columns:1fr;min-height:0} }

@media (prefers-reduced-motion: reduce){
  .pochette .disque,.g-faq summary::after{transition:none}
}