/* ==========================================================================
   Drysdale Review ,  peau « table de travail en chêne »
   Direction : 18. Le Tableau Noir, ramenée vers le jour et la matière bois.
   Préfixe : tn-  ·  Palette : tourbière claire (#EFE9DC / #2E2620 / #6E5136).
   Contrat : deux polices locales (vollkorn 700, lato 400), trois fichiers maxi.
   ========================================================================== */

@font-face {
  font-family: "Vollkorn";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/vollkorn-v13-latin-700.woff2") format("woff2");
}
@font-face {
  font-family: "Lato";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/lato-v17-latin-regular.woff2") format("woff2");
}
@font-face {
  font-family: "Lato";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/lato-v17-latin-700.woff2") format("woff2");
}

:root {
  --tn-ardoise: #2E2620;      /* encre, titres */
  --tn-craie: #EFE9DC;        /* fond général */
  --tn-cuir: #C9BBA2;         /* filets, bordures */
  --tn-encre-pale: #6B5C48;   /* métadonnées, textes secondaires */
  --tn-annotation: #6E5136;   /* annotations de marge et liens de source */
  --tn-papier: #FFFFFF;       /* fond des cartes */
  --tn-feuille: #F6F1E5;      /* fond alternatif, cartes tièdes */
  --tn-signature: hsl(28, 42%, 30%);   /* brun saturé, bandeaux signature */
  --tn-signature-claire: hsl(28, 44%, 42%);
  --tn-accent-vif: hsl(42, 74%, 56%);  /* accent jaune craie, annotations rares */
  --tn-rayon: 16px;
  --tn-rayon-petit: 12px;
  --tn-ombre-carte: 0 10px 26px rgba(46, 38, 32, 0.10), 0 2px 6px rgba(110, 81, 54, 0.08);
  --tn-ombre-vedette: 0 22px 48px rgba(46, 38, 32, 0.18), 0 6px 14px rgba(110, 81, 54, 0.14);
  --tn-ombre-douce: 0 4px 14px rgba(110, 81, 54, 0.10);
  --tn-mesure: 68ch;
  --tn-corps: clamp(1.02rem, 0.97rem + 0.5vw, 1.14rem);
  --tn-interligne: 1.62;
  --tn-espace: clamp(1.1rem, 0.9rem + 1.2vw, 2rem);
  --tn-gouttiere: clamp(1rem, 0.6rem + 2vw, 3.4rem);
  --tn-filet: 1px;
}

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

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background-color: var(--tn-craie);
  color: var(--tn-ardoise);
  font-family: "Lato", Tahoma, "Segoe UI", sans-serif;
  font-size: var(--tn-corps);
  line-height: var(--tn-interligne);
  text-rendering: optimizeLegibility;
}

img, svg { max-width: 100%; display: block; }

a { color: var(--tn-annotation); text-decoration-thickness: 1px; text-underline-offset: 0.15em; }
a:hover { color: var(--tn-signature); }

:focus-visible {
  outline: 3px solid var(--tn-signature-claire);
  outline-offset: 2px;
  border-radius: 6px;
}

h1, h2, h3, h4 {
  font-family: "Vollkorn", "Charter", Georgia, serif;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -0.005em;
  color: var(--tn-ardoise);
  margin: 0 0 0.5em;
}

/* Trait de craie sous les titres porteurs */
.tn-craie { position: relative; }
.tn-craie::after {
  content: "";
  display: block;
  height: 2px;
  margin-top: 0.55rem;
  border-radius: 2px;
  background: linear-gradient(
    90deg,
    transparent 0,
    var(--tn-filet-filet, var(--tn-cuir)) 3%,
    var(--tn-cuir) 42%,
    transparent 46%,
    transparent 51%,
    var(--tn-cuir) 55%,
    var(--tn-cuir) 92%,
    transparent 100%
  );
}

/* Annotation de marge */
.tn-annotation {
  display: block;
  font-family: "Lato", Tahoma, sans-serif;
  font-weight: 700;
  font-size: 0.72rem;
  line-height: 1.35;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--tn-annotation);
  border-left: var(--tn-filet) solid var(--tn-cuir);
  padding-left: 0.65rem;
  margin: 0.6rem 0 1rem;
  transform: rotate(-1.2deg);
}
.tn-annotation::after {
  content: "";
  display: block;
  width: 2.4rem;
  height: 1px;
  background: var(--tn-cuir);
  margin-top: 0.45rem;
}
.tn-annotation--reponse {
  font-size: 0.86rem;
  letter-spacing: 0.02em;
  text-transform: none;
  font-weight: 700;
  transform: none;
  max-width: 48ch;
}

/* Contexte de page */
.tn-page { min-height: 100vh; display: flex; flex-direction: column; }
.tn-page main { flex: 1 0 auto; }

.tn-acces-direct {
  position: absolute;
  left: -9999px;
  top: 0;
  background: var(--tn-signature);
  color: #fff;
  padding: 0.7rem 1rem;
  border-radius: 0 0 12px 0;
  z-index: 50;
  text-decoration: none;
}
.tn-acces-direct:focus { left: 0; }

.tn-travee {
  width: min(100% - 2 * var(--tn-gouttiere), 1180px);
  margin-inline: auto;
}

/* ==========================================================================
   Manchette
   ========================================================================== */
.tn-manchette {
  background: var(--tn-signature);
  color: #fff;
  border-bottom: 4px solid var(--tn-signature-claire);
}
.tn-manchette__interieur {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 1.6rem;
  padding-block: 1rem;
}
.tn-enseigne {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  color: #fff;
  text-decoration: none;
  font-family: "Vollkorn", Georgia, serif;
  font-weight: 700;
  font-size: 1.4rem;
  letter-spacing: -0.01em;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.28);
}
.tn-enseigne .tn-embleme { color: #fff; flex: 0 0 auto; }
.tn-devise {
  flex: 1 1 14rem;
  min-width: 0;
  margin: 0;
  font-size: 0.86rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.86);
}
.tn-parcours { flex: 1 1 100%; }
.tn-parcours ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem 1.4rem;
}
.tn-parcours__lien {
  color: #fff;
  text-decoration: none;
  font-size: 0.9rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.35rem 0;
  border-bottom: 2px solid transparent;
}
.tn-parcours__lien:hover,
.tn-parcours__lien[aria-current="page"] {
  border-bottom-color: var(--tn-accent-vif);
  color: #fff;
}

/* ==========================================================================
   Ouverture : h1 + vedette à droite
   ========================================================================== */
.tn-ouverture {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(1.4rem, 1rem + 2vw, 2.6rem);
  padding-block: clamp(1.6rem, 1rem + 2vw, 2.8rem);
  align-items: start;
}
@media (min-width: 56rem) {
  .tn-ouverture { grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); }
}
.tn-ouverture > * { min-width: 0; }

.tn-ouverture__texte {
  padding: clamp(0.4rem, 0.2rem + 1vw, 1.2rem) 0;
}
.tn-ouverture__titre {
  font-size: clamp(2.2rem, 1.4rem + 3.6vw, 3.6rem);
  line-height: 1.05;
  letter-spacing: -0.015em;
  margin: 0 0 0.8rem;
  text-shadow: 0 2px 3px rgba(46, 38, 32, 0.14);
}
.tn-ouverture__chapo {
  font-size: 1.1rem;
  color: var(--tn-ardoise);
  max-width: 42ch;
  margin: 0 0 1.4rem;
}
.tn-ouverture__cotes {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem 1rem;
  margin: 0;
}
.tn-cote-lien {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.5rem 0.85rem;
  background: var(--tn-papier);
  border: var(--tn-filet) solid var(--tn-cuir);
  border-radius: var(--tn-rayon-petit);
  box-shadow: var(--tn-ombre-douce);
  color: var(--tn-ardoise);
  text-decoration: none;
  font-weight: 700;
  font-size: 0.92rem;
}
.tn-cote-lien:hover { background: var(--tn-feuille); color: var(--tn-signature); }

.tn-cote {
  display: inline-block;
  font-family: "Lato", Tahoma, sans-serif;
  font-weight: 700;
  font-size: 0.7rem;
  letter-spacing: 0.16em;
  color: var(--tn-signature);
  background: rgba(110, 81, 54, 0.10);
  padding: 0.2rem 0.5rem;
  border-radius: 999px;
  text-transform: uppercase;
}
.tn-mention {
  font-size: 0.82rem;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--tn-encre-pale);
}

/* Vedette (grand article en tête) */
.tn-vedette {
  background: var(--tn-papier);
  border-radius: var(--tn-rayon);
  overflow: hidden;
  box-shadow: var(--tn-ombre-vedette);
  padding: 0 0 1.4rem;
}
.tn-vedette__vignette {
  margin: 0;
}
.tn-vedette__vignette img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  filter: contrast(1.05) brightness(0.97) saturate(0.94);
}
.tn-vedette__cote,
.tn-vedette__titre,
.tn-vedette__abrege,
.tn-vedette__datation { margin-inline: 1.4rem; }
.tn-vedette__cote { display: flex; gap: 0.6rem; align-items: center; margin-top: 1.1rem; margin-bottom: 0.2rem; }
.tn-vedette__titre {
  font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.3rem);
  margin-top: 0.2rem;
  margin-bottom: 0.6rem;
}
.tn-vedette__titre a { color: var(--tn-ardoise); text-decoration: none; }
.tn-vedette__titre a:hover { color: var(--tn-signature); }
.tn-vedette__abrege { color: var(--tn-encre-pale); margin-top: 0; }
.tn-vedette__datation {
  font-size: 0.8rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--tn-encre-pale);
  margin-top: 0.8rem;
}

/* ==========================================================================
   Rayons (sections de l'accueil)
   ========================================================================== */
.tn-rayon { padding-block: clamp(1.6rem, 1rem + 2vw, 2.8rem); }
.tn-rayon__tete {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.6rem 1.2rem;
  margin-bottom: 1.4rem;
}
.tn-rayon__titre { font-size: clamp(1.4rem, 1.1rem + 1.2vw, 1.9rem); margin: 0; }
.tn-rayon__phrase { margin: 0; color: var(--tn-encre-pale); max-width: 60ch; }
.tn-rayon__decompte {
  margin-left: auto;
  font-size: 0.82rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--tn-encre-pale);
}

/* Cahiers (rubriques) */
.tn-cahiers__grille {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.2rem;
}
@media (min-width: 42rem) { .tn-cahiers__grille { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 68rem) { .tn-cahiers__grille { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.tn-cahiers__grille > * { min-width: 0; }

.tn-cahier {
  background: var(--tn-papier);
  border: var(--tn-filet) solid var(--tn-cuir);
  border-radius: var(--tn-rayon);
  padding: 1.2rem 1.2rem 1.3rem;
  box-shadow: var(--tn-ombre-carte);
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}
.tn-cahier--operations-basics { box-shadow: 0 10px 26px rgba(46, 38, 32, 0.10), 0 4px 10px rgba(110, 81, 54, 0.10); }
.tn-cahier--client-work     { box-shadow: 0 10px 26px rgba(46, 38, 32, 0.10), 0 4px 10px rgba(30, 80, 70, 0.10); }
.tn-cahier--pricing-position{ box-shadow: 0 10px 26px rgba(46, 38, 32, 0.10), 0 4px 10px rgba(140, 80, 40, 0.12); }

.tn-cahier__cote { margin: 0; }
.tn-cahier__titre { font-size: 1.35rem; margin: 0.2rem 0 0.3rem; }
.tn-cahier__titre a { color: var(--tn-ardoise); text-decoration: none; }
.tn-cahier__titre a:hover { color: var(--tn-signature); }
.tn-cahier__intro { color: var(--tn-encre-pale); margin: 0; }
.tn-cahier__liste {
  list-style: none;
  margin: 0.6rem 0 0.9rem;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
}
.tn-cahier__item {
  display: grid;
  grid-template-columns: 4rem 1fr;
  gap: 0.8rem;
  align-items: center;
  min-width: 0;
}
.tn-cahier__item a { color: var(--tn-signature); text-decoration-thickness: 1px; font-weight: 700; }
.tn-cahier__item a:hover { color: var(--tn-annotation); }
.tn-cahier__vignette {
  margin: 0;
  width: 4rem; height: 4rem; overflow: hidden;
}
.tn-cahier__vignette picture, .tn-cahier__vignette img { display: block; width: 100%; height: 100%; object-fit: cover; }
.tn-cahier__vignette img {
  aspect-ratio: auto;
  border-radius: var(--tn-rayon-petit);
  filter: contrast(1.05) brightness(0.97) saturate(0.92);
}
.tn-cahier__renvoi { margin: auto 0 0; }
.tn-renvoi {
  display: inline-block;
  font-weight: 700;
  color: var(--tn-signature);
  text-decoration: none;
  border-bottom: 2px solid var(--tn-cuir);
  padding-bottom: 0.1rem;
}
.tn-renvoi:hover { color: var(--tn-annotation); border-bottom-color: var(--tn-annotation); }

/* Comptoir : méthode en trois temps, bande saturée pleine largeur */
.tn-comptoir {
  background: var(--tn-signature);
  color: #fff;
  width: 100%;
  margin-inline: 0;
  padding-block: clamp(1.8rem, 1.2rem + 2vw, 3rem);
  box-shadow: inset 0 6px 0 var(--tn-signature-claire), inset 0 -6px 0 var(--tn-signature-claire);
}
.tn-comptoir__interieur {
  width: min(100% - 2 * var(--tn-gouttiere), 1180px);
  margin-inline: auto;
}
.tn-comptoir .tn-rayon__tete { margin-bottom: 1.6rem; }
.tn-comptoir__titre {
  color: #fff;
  font-size: clamp(1.5rem, 1.2rem + 1.2vw, 2.1rem);
  text-shadow: 0 2px 3px rgba(0, 0, 0, 0.28);
  margin: 0;
}
.tn-comptoir__trois {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.2rem;
}
@media (min-width: 48rem) { .tn-comptoir__trois { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.tn-comptoir__trois > * { min-width: 0; }
.tn-comptoir__etape {
  background: rgba(255, 255, 255, 0.07);
  border-radius: var(--tn-rayon);
  padding: 1rem 1.1rem 1.2rem;
  border: 1px solid rgba(255, 255, 255, 0.18);
}
.tn-comptoir__numero {
  display: inline-block;
  font-family: "Vollkorn", Georgia, serif;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1;
  color: var(--tn-accent-vif);
  margin-bottom: 0.4rem;
}
.tn-comptoir__intitule { color: #fff; font-size: 1.1rem; margin: 0 0 0.4rem; }
.tn-comptoir__etape p { margin: 0; color: rgba(255, 255, 255, 0.9); font-size: 0.95rem; }
.tn-comptoir__annotation {
  margin: 1.6rem 0 0;
  font-size: 0.78rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--tn-accent-vif);
}

/* File : grille 2 cartes + liste compacte */
.tn-file__grille {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.2rem;
}
@media (min-width: 44rem) { .tn-file__grille { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 68rem) { .tn-file__grille { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.tn-file__grille > * { min-width: 0; }

.tn-entree {
  background: var(--tn-papier);
  border-radius: var(--tn-rayon);
  overflow: hidden;
  box-shadow: var(--tn-ombre-carte);
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.tn-entree__vignette { margin: 0; width: 100%; max-width: 100%; }
.tn-entree__vignette img {
  width: 100%;
  max-width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  filter: contrast(1.05) brightness(0.97) saturate(0.94);
}
.tn-entree__texte {
  padding: 0.9rem 1rem 1.1rem;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  min-width: 0;
}
.tn-entree__cote { display: flex; gap: 0.55rem; align-items: center; margin: 0 0 0.2rem; }
.tn-entree__intitule { font-size: 1.22rem; margin: 0 0 0.3rem; }
.tn-entree__intitule a { color: var(--tn-ardoise); text-decoration: none; }
.tn-entree__intitule a:hover { color: var(--tn-signature); }
.tn-entree__abrege { color: var(--tn-encre-pale); margin: 0; font-size: 0.98rem; }
.tn-entree__datation {
  margin: 0.5rem 0 0;
  font-size: 0.78rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--tn-encre-pale);
}

/* Variante ligne (utilisée ponctuellement) */
.tn-entree--ligne {
  flex-direction: row;
  align-items: stretch;
}
.tn-entree--ligne .tn-entree__vignette { flex: 0 0 7rem; }
.tn-entree--ligne .tn-entree__vignette img { aspect-ratio: 1 / 1; height: 100%; }

/* Liste compacte des guides */
.tn-file__compacte {
  list-style: none;
  margin: 1.6rem 0 0;
  padding: 0;
  background: var(--tn-papier);
  border-radius: var(--tn-rayon);
  box-shadow: var(--tn-ombre-douce);
  overflow: hidden;
}
.tn-file__ligne {
  display: grid;
  grid-template-columns: 3.6rem 8.5rem 1fr auto;
  gap: 0.9rem;
  align-items: center;
  padding: 0.7rem 0.9rem;
  border-bottom: 1px solid var(--tn-cuir);
  min-width: 0;
}
.tn-file__ligne:last-child { border-bottom: 0; }
.tn-file__ligne time {
  font-size: 0.78rem;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--tn-encre-pale);
}
.tn-file__ligne a { color: var(--tn-ardoise); font-weight: 700; text-decoration: none; }
.tn-file__ligne a:hover { color: var(--tn-signature); }
.tn-file__vignette { margin: 0; width: 3.6rem; height: 3.6rem; overflow: hidden; grid-column: 1; }
.tn-file__vignette picture, .tn-file__vignette img { display: block; width: 100%; height: 100%; object-fit: cover; }
.tn-file__vignette img {
  aspect-ratio: auto;
  border-radius: 10px;
  filter: contrast(1.05) brightness(0.97) saturate(0.92);
}
.tn-file__rubrique { justify-self: end; }
@media (max-width: 32rem) {
  .tn-file__ligne { grid-template-columns: 3rem 1fr; grid-template-areas: "v t" "v r" ; }
  .tn-file__vignette { grid-area: v; }
  .tn-file__ligne time { grid-column: 2; grid-area: r; }
  .tn-file__ligne a { grid-column: 2; grid-area: t; }
  .tn-file__rubrique { display: none; }
}

/* Encart éditorial */
.tn-encart {
  background: var(--tn-feuille);
  border: 1px solid var(--tn-cuir);
  border-radius: var(--tn-rayon);
  padding: 1.4rem 1.4rem 1.5rem;
  box-shadow: var(--tn-ombre-douce);
  margin-block: 1.6rem;
}
.tn-encart__titre { margin-top: 0; font-size: 1.2rem; }

/* ==========================================================================
   Rubrique / article
   ========================================================================== */
.tn-remontee {
  padding-block: 1rem 0.4rem;
  font-size: 0.85rem;
  letter-spacing: 0.06em;
}
.tn-remontee ol {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem 0.6rem;
  color: var(--tn-encre-pale);
}
.tn-remontee li::after { content: "›"; margin-left: 0.6rem; color: var(--tn-cuir); }
.tn-remontee li:last-child::after { content: ""; }
.tn-remontee a { color: var(--tn-annotation); text-decoration: none; }
.tn-remontee a:hover { text-decoration: underline; }

.tn-preambule {
  padding-block: 1.2rem 0.6rem;
}
.tn-preambule--rubrique {
  border-bottom: 1px solid var(--tn-cuir);
  padding-bottom: 1.4rem;
  margin-bottom: 1.2rem;
}
.tn-preambule__titre {
  font-size: clamp(1.8rem, 1.3rem + 2vw, 2.8rem);
  margin: 0.3rem 0 0.6rem;
  text-shadow: 0 2px 3px rgba(46, 38, 32, 0.12);
}
.tn-preambule__intro {
  max-width: var(--tn-mesure);
  color: var(--tn-ardoise);
  font-size: 1.08rem;
  margin: 0;
}

.tn-onglets { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-block: 0.4rem 1.2rem; }
.tn-onglet {
  display: inline-block;
  padding: 0.45rem 0.9rem;
  border-radius: 999px;
  background: var(--tn-papier);
  border: 1px solid var(--tn-cuir);
  color: var(--tn-ardoise);
  text-decoration: none;
  font-weight: 700;
  font-size: 0.85rem;
}
.tn-onglet--courant { background: var(--tn-signature); color: #fff; border-color: var(--tn-signature); }

/* En-tête d'article */
.tn-entete-fiche { padding-block: 1.2rem 1rem; }
.tn-entete-fiche__titre {
  font-size: clamp(1.9rem, 1.4rem + 2.2vw, 3rem);
  margin: 0.3rem 0 0.8rem;
  text-shadow: 0 2px 3px rgba(46, 38, 32, 0.12);
  max-width: 24ch;
}
.tn-chapeau {
  max-width: var(--tn-mesure);
  font-size: 1.12rem;
  color: var(--tn-ardoise);
}
.tn-datation {
  font-size: 0.82rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--tn-encre-pale);
  margin-top: 0.6rem;
}

.tn-planche-image { margin: 1rem 0 1.6rem; }
.tn-planche-image img {
  width: 100%;
  max-width: 100%;
  aspect-ratio: 21 / 9;
  object-fit: cover;
  border-radius: var(--tn-rayon);
  box-shadow: var(--tn-ombre-vedette);
  filter: contrast(1.05) brightness(0.97) saturate(0.92);
}
.tn-planche-image figcaption {
  margin-top: 0.6rem;
  font-size: 0.85rem;
  color: var(--tn-encre-pale);
  max-width: 70ch;
}

.tn-duo {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.6rem;
  padding-block: 0.6rem 1.4rem;
}
@media (min-width: 64rem) { .tn-duo { grid-template-columns: minmax(0, 1fr) minmax(14rem, 18rem); } }
.tn-duo > * { min-width: 0; }

.tn-corps {
  max-width: var(--tn-mesure);
  font-size: var(--tn-corps);
}

.tn-releve {
  background: var(--tn-feuille);
  border: 1px solid var(--tn-cuir);
  border-radius: var(--tn-rayon);
  padding: 1.1rem 1.1rem 1.3rem;
  box-shadow: var(--tn-ombre-douce);
  align-self: start;
}
.tn-releve__titre { font-size: 1.05rem; margin: 0.2rem 0 0.5rem; }
.tn-releve__sommaire,
.tn-releve__sources {
  list-style: none;
  margin: 0 0 1.1rem;
  padding: 0;
  font-size: 0.92rem;
}
.tn-releve__sommaire li { padding: 0.35rem 0; border-bottom: 1px solid var(--tn-cuir); }
.tn-releve__sommaire li:last-child { border-bottom: 0; }
.tn-releve__sommaire a, .tn-releve__sources a { color: var(--tn-annotation); text-decoration: none; }
.tn-releve__sommaire a:hover, .tn-releve__sources a:hover { text-decoration: underline; }

/* Corps d'article : tableaux et citations */
.tn-corps table { width: 100%; border-collapse: collapse; }
.tn-corps .tn-tableau {
  overflow-x: auto;
  border-radius: var(--tn-rayon-petit);
  border: 1px solid var(--tn-cuir);
  background: var(--tn-papier);
  box-shadow: var(--tn-ombre-douce);
  margin-block: 1.2rem;
}
.tn-corps .tn-tableau table { min-width: 34rem; }
.tn-corps th, .tn-corps td {
  text-align: left;
  padding: 0.6rem 0.8rem;
  border-bottom: 1px solid var(--tn-cuir);
}
.tn-corps th { background: var(--tn-feuille); }

.tn-corps h2 {
  margin-top: 2rem;
  font-size: 1.5rem;
}

.tn-corps blockquote {
  margin: 1.4rem 0;
  padding: 0.9rem 1.2rem;
  background: var(--tn-feuille);
  border-left: 4px solid var(--tn-signature);
  border-radius: var(--tn-rayon-petit);
  font-style: italic;
}
.tn-corps ul, .tn-corps ol { padding-left: 1.2rem; }
.tn-corps code {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  background: var(--tn-feuille);
  padding: 0.1rem 0.35rem;
  border-radius: 6px;
  font-size: 0.92em;
}

.tn-corps > p:first-of-type::first-letter {
  font-family: "Vollkorn", Georgia, serif;
  font-weight: 700;
  font-size: 3rem;
  float: left;
  line-height: 0.9;
  padding: 0.2rem 0.6rem 0 0;
  color: var(--tn-annotation);
}

/* Voisinage */
.tn-voisinage { padding-block: 2rem 3rem; }

/* ==========================================================================
   Réseau
   ========================================================================== */
.tn-ailleurs {
  background: var(--tn-feuille);
  border-top: 1px solid var(--tn-cuir);
  border-bottom: 1px solid var(--tn-cuir);
  padding-block: 1.6rem 1.8rem;
  margin-top: 2rem;
}
.tn-ailleurs .tn-rayon__titre { font-size: 1.3rem; }
.tn-ailleurs__liste {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.6rem 1.4rem;
}
@media (min-width: 48rem) { .tn-ailleurs__liste { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 68rem) { .tn-ailleurs__liste { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.tn-ailleurs__item { min-width: 0; font-size: 0.95rem; }
.tn-ailleurs__item p { margin: 0; }

/* ==========================================================================
   Pied
   ========================================================================== */
.tn-pied {
  background: var(--tn-ardoise);
  color: var(--tn-craie);
  margin-top: 2rem;
  border-top: 6px solid var(--tn-signature);
}
.tn-pied__colonnes {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.4rem;
  padding-block: 2rem 1.6rem;
}
@media (min-width: 48rem) { .tn-pied__colonnes { grid-template-columns: 1.4fr 1fr 1fr; } }
.tn-pied__colonne { min-width: 0; }
.tn-pied__colonne h2,
.tn-pied__titre { color: var(--tn-craie); font-size: 1.05rem; margin: 0 0 0.5rem; }
.tn-pied__colonne p { color: rgba(239, 233, 220, 0.82); }
.tn-pied__colonne ul { list-style: none; margin: 0; padding: 0; }
.tn-pied__colonne li { padding: 0.2rem 0; }
.tn-pied a { color: var(--tn-craie); text-decoration: none; }
.tn-pied a:hover { color: var(--tn-accent-vif); text-decoration: underline; }
.tn-pied__note {
  font-size: 0.82rem;
  color: rgba(239, 233, 220, 0.7);
  border-left: 2px solid var(--tn-signature-claire);
  padding-left: 0.7rem;
  margin-top: 0.8rem;
}
.tn-pied__ligne {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 0.6rem;
  border-top: 1px solid rgba(239, 233, 220, 0.18);
  padding-block: 0.9rem;
  font-size: 0.8rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(239, 233, 220, 0.7);
}

/* ==========================================================================
   Petits écrans
   ========================================================================== */
@media (max-width: 30rem) {
  .tn-annotation { transform: none; }
  .tn-vedette__cote, .tn-vedette__titre, .tn-vedette__abrege, .tn-vedette__datation { margin-inline: 1rem; }
  .tn-cahier__item { grid-template-columns: 3.4rem 1fr; }
}

/* Nettoyage typographique */
::selection { background: var(--tn-cuir); color: var(--tn-ardoise); }