/* Tertium - editorial : Le Carnet, l'article, les auteurs (bloc 5)
   Jetons : voir assets/css/tokens.css. Aucune valeur en dur.

   Ce fichier porte : le bandeau de tete commun au Carnet et a l'index des
   auteurs, le billet a la une, la grille de billets, l'article et sa colonne
   laterale, la page auteur, la bibliographie, la grille d'auteurs, les
   gabarits generiques (page, liste, 404).

   Les rares mesures sans jeton sont en rem et signalees, comme dans base.css.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Bandeau de tete, commun au Carnet et a l'index des auteurs
   -------------------------------------------------------------------------- */

.tt-carnet__tete {
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  gap: var(--tt-gouttiere);
  align-items: end;
  padding-top: var(--tt-bloc);
  padding-bottom: var(--tt-bloc);
  border-bottom: var(--tt-filet-or);
}

/* Sur-titre de section : plus espace que celui des cartes. */
.tt-surtitre--large {
  display: block;
  margin: 0 0 var(--tt-gap-s);
  letter-spacing: .2em;
}

/* Avis temporaire en rouge, au-dessus du sur-titre (champ « Message
   important » de l'en-tête de page). Brique sur blanc : 6,3:1. */
.tt-avis {
  max-width: 36rem;
  margin: 0 0 var(--tt-gap);
  padding: calc(var(--tt-gap-s) / 1.2) var(--tt-gap-s);
  border: 1px solid var(--tt-brique);
  border-left-width: 4px;
  background: var(--tt-papier);
  color: var(--tt-brique);
  font-size: var(--tt-fs-corps-s);
  font-weight: 600;
  line-height: 1.55;
}

.tt-avis p { margin: 0; }
.tt-avis p + p { margin-top: .5em; }

.tt-carnet__intro .tt-titre-page {
  margin: 0 0 calc(var(--tt-gap-s) / 1.2);
  line-height: 1.05;
}

.tt-carnet__chapeau {
  max-width: 32.5rem;    /* 520px : mesure de ligne de la maquette */
  margin: 0;
  color: var(--tt-texte-2);
}

.tt-carnet__chapeau p { margin: 0; }
.tt-carnet__chapeau p + p { margin-top: calc(var(--tt-gap-s) / 1.4); }

.tt-carnet__cats .tt-puces { justify-content: flex-end; }

/* --------------------------------------------------------------------------
   2. Le billet a la une
   -------------------------------------------------------------------------- */

.tt-alaune {
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  align-items: stretch;
  border-bottom: var(--tt-filet);
}

.tt-alaune__texte {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-top: var(--tt-section);
  padding-bottom: var(--tt-section);
}

.tt-alaune__meta,
.tt-carte-billet__meta {
  display: flex;
  flex-wrap: wrap;
  gap: calc(var(--tt-gap-s) / 1.2);
  margin: 0 0 var(--tt-gap-s);
  font-size: var(--tt-fs-micro);
  letter-spacing: var(--tt-ls-micro);
  text-transform: uppercase;
  color: var(--tt-texte-3);
}

.tt-alaune__etiquette,
.tt-carte-billet__cat { color: var(--tt-brique); }

.tt-alaune__titre {
  margin: 0 0 var(--tt-gap-s);
  font-size: 2.375rem;   /* 38px : entre --tt-fs-h2 et --tt-fs-h1-page, pas de jeton */
  line-height: 1.12;
}

.tt-alaune__titre a { color: var(--tt-encre); transition: color var(--tt-t-rapide); }
.tt-alaune__titre a:hover { color: var(--tt-brique); }

.tt-alaune__chapeau {
  max-width: 32.5rem;
  margin: 0 0 var(--tt-gap);
  color: var(--tt-texte-2);
}

.tt-alaune__actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--tt-gap);
  margin: 0;
}

.tt-alaune__lien {
  display: inline-flex;
  align-items: center;
  min-height: var(--tt-touch);
  padding: 0 var(--tt-gap);
  font-size: var(--tt-fs-corps-s);
  font-weight: 600;
  letter-spacing: .04em;   /* interlettrage de bouton */
}

.tt-alaune__visuel { margin: 0; overflow: hidden; }

.tt-alaune__visuel img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 21.25rem;   /* 340px : hauteur de la maquette */
  object-fit: cover;
}

.tt-alaune__visuel--vide {
  display: block;
  min-height: 21.25rem;
  background: var(--tt-papier-alt);
  border-left: var(--tt-filet);
  border-left-color: var(--tt-bord-beige);
}

/* --------------------------------------------------------------------------
   3. La grille de billets
   -------------------------------------------------------------------------- */

.tt-billets {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--tt-section) var(--tt-bloc);
  margin: 0;
  /* Vertical seulement : la liste porte aussi .tt-conteneur, dont les marges
     laterales etaient ecrasees (cartes collees aux bords, constat du 17/09). */
  padding-block: var(--tt-section);
  list-style: none;
}

.tt-carte-billet {
  display: flex;
  flex-direction: column;
  background: var(--tt-papier);
}

.tt-carte-billet__visuel {
  display: block;
  margin: 0;
  height: 12.5rem;   /* 200px : hauteur de vignette de la maquette */
  flex: none;
  overflow: hidden;
}

.tt-carte-billet__visuel img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.tt-carte-billet__visuel--vide { background: var(--tt-papier-alt); }

.tt-carte-billet__texte {
  display: flex;
  flex-direction: column;
  flex: 1;
  margin: var(--tt-gap-s) var(--tt-gap-s) 0;
  padding-top: var(--tt-gap-s);
  border-top: var(--tt-filet-fort);
}

.tt-carte-billet__titre {
  margin: 0 0 calc(var(--tt-gap-s) / 1.4);
  font-size: var(--tt-fs-h3);
  line-height: 1.2;
  letter-spacing: 0;
}

.tt-carte-billet__titre a { color: var(--tt-encre); transition: color var(--tt-t-rapide); }
.tt-carte-billet:hover .tt-carte-billet__titre a { color: var(--tt-brique); }

.tt-carte-billet__chapeau {
  margin: 0;
  font-size: var(--tt-fs-corps-s);
  line-height: 1.65;
  color: var(--tt-texte-2);
}

.tt-carte-billet__lire {
  margin: auto 0 var(--tt-gap-s);
  padding-top: var(--tt-gap-s);
  font-size: var(--tt-fs-micro);
  letter-spacing: var(--tt-ls-micro);
  text-transform: uppercase;
  color: var(--tt-or-texte);
}

/* --------------------------------------------------------------------------
   4. L'article
   -------------------------------------------------------------------------- */

.tt-article__tete {
  max-width: 67.5rem;    /* 1080px : colonne de lecture de la maquette */
  margin-inline: auto;
  padding-top: var(--tt-bloc);
}

.tt-article__meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: calc(var(--tt-gap-s) / 1.2);
  margin: 0 0 var(--tt-gap-s);
}

.tt-article__date {
  font-size: var(--tt-fs-meta);
  letter-spacing: var(--tt-ls-micro);
  text-transform: uppercase;
  color: var(--tt-texte-3);
}

.tt-article__titre {
  margin: 0 0 var(--tt-gap-s);
  font-size: var(--tt-fs-h1);
  line-height: 1.06;
  letter-spacing: var(--tt-ls-titre);
}

.tt-article__chapeau {
  max-width: 47.5rem;    /* 760px : chapeau de la maquette */
  margin: 0 0 var(--tt-bloc);
  font-family: var(--tt-serif);
  font-size: var(--tt-fs-h3);
  line-height: 1.6;
  color: var(--tt-texte-2);
}

.tt-article__visuel { margin: 0; }

.tt-article__visuel img {
  display: block;
  width: 100%;
  max-height: 26.25rem;   /* 420px : bandeau de la maquette */
  object-fit: cover;
}

.tt-article__visuel figcaption {
  padding: calc(var(--tt-gap-s) / 1.4) var(--tt-gouttiere);
  font-size: var(--tt-fs-meta);
  color: var(--tt-texte-3);
}

.tt-article__corps {
  display: grid;
  grid-template-columns: 1fr 18.75rem;   /* 300px : colonne laterale de la maquette */
  gap: var(--tt-gouttiere);
  max-width: 67.5rem;
  margin-inline: auto;
  padding-top: var(--tt-section);
  padding-bottom: var(--tt-section);
}

.tt-article__texte { color: var(--tt-encre); line-height: 1.8; }

.tt-article__texte h2 { font-size: var(--tt-fs-h2-petit); margin: var(--tt-section) 0 var(--tt-gap-s); }
.tt-article__texte h3 { font-size: var(--tt-fs-h3); margin: var(--tt-bloc) 0 var(--tt-gap-s); }
.tt-article__texte img { max-width: 100%; height: auto; }
.tt-article__texte blockquote {
  margin: var(--tt-bloc) 0;
  padding-left: var(--tt-gap);
  border-left: var(--tt-filet-accent);
  font-family: var(--tt-serif);
  font-size: var(--tt-fs-h3);
  line-height: 1.35;
}

/* Encart de l'ouvrage dont parle l'article */
.tt-encart-livre {
  display: grid;
  grid-template-columns: 9.375rem 1fr;   /* 150px : couverture de la maquette */
  gap: var(--tt-bloc);
  align-items: center;
  margin: var(--tt-bloc) 0;
  padding: var(--tt-gap);
  background: var(--tt-papier-alt);
}

.tt-encart-livre__couv img {
  display: block;
  width: 100%;
  aspect-ratio: var(--tt-ratio-couv);
  object-fit: cover;
  background: var(--tt-papier);
  box-shadow: var(--tt-ombre-couv);
}

.tt-encart-livre__titre {
  margin: calc(var(--tt-gap-s) / 3.5) 0 0;
  font-family: var(--tt-serif);
  font-size: var(--tt-fs-h3);
  line-height: 1.15;
}

.tt-encart-livre__titre a { color: var(--tt-encre); transition: color var(--tt-t-rapide); }
.tt-encart-livre__titre a:hover { color: var(--tt-brique); }

.tt-encart-livre__auteur {
  margin: calc(var(--tt-gap-s) / 2.8) 0 0;
  font-size: var(--tt-fs-corps-s);
  color: var(--tt-texte-2);
}

.tt-encart-livre__pied {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--tt-gap);
  margin: var(--tt-gap-s) 0 0;
}

.tt-encart-livre__prix {
  font-family: var(--tt-serif);
  font-size: var(--tt-fs-h3);
  line-height: 1;
}

.tt-encart-livre__lien {
  display: inline-flex;
  align-items: center;
  min-height: var(--tt-touch);
  padding: 0 var(--tt-gap-s);
  border-color: var(--tt-bord-beige);
  font-size: var(--tt-fs-micro);
  letter-spacing: var(--tt-ls-micro);
  text-transform: uppercase;
}

/* Partage */
.tt-partage {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--tt-gap-s);
  margin: var(--tt-bloc) 0 0;
  padding-top: var(--tt-gap);
  border-top: var(--tt-filet);
  font-size: var(--tt-fs-meta);
  letter-spacing: var(--tt-ls-micro);
  text-transform: uppercase;
  color: var(--tt-texte-2);
}

.tt-partage__retour { margin-left: auto; }

/* Colonne laterale */
.tt-article__cote { display: flex; flex-direction: column; gap: var(--tt-gap); }

.tt-cote__titre {
  margin: 0 0 var(--tt-gap-s);
  font-family: var(--tt-sans);
  font-size: var(--tt-fs-micro);
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--tt-brique);
}

.tt-cote-auteur {
  padding: var(--tt-gap);
  background: var(--tt-papier-alt);
}

.tt-cote-auteur__portrait {
  display: block;
  width: 100%;
  aspect-ratio: var(--tt-ratio-couv);
  object-fit: cover;
  margin-bottom: var(--tt-gap-s);
}

.tt-cote-auteur__nom {
  margin: 0;
  font-family: var(--tt-serif);
  font-size: var(--tt-fs-h3);
  line-height: 1.15;
}

.tt-cote-auteur__bio {
  margin: calc(var(--tt-gap-s) / 1.75) 0 var(--tt-gap-s);
  font-size: var(--tt-fs-corps-s);
  line-height: 1.65;
  color: var(--tt-texte-2);
}

.tt-cote-lies { padding-top: var(--tt-gap-s); border-top: var(--tt-filet); }
.tt-cote-lies .tt-cote__titre { color: var(--tt-texte-3); }

.tt-cote-lies__liste { margin: 0; padding: 0; list-style: none; }

.tt-cote-lies__liste li {
  padding: var(--tt-gap-s) 0;
  border-bottom: var(--tt-filet);
}

.tt-cote-lies__liste li:last-child { border-bottom: 0; }

.tt-cote-lies__titre {
  margin: 0;
  font-size: var(--tt-fs-carte);
  line-height: 1.2;
  letter-spacing: 0;
}

.tt-cote-lies__titre a { color: var(--tt-encre); transition: color var(--tt-t-rapide); }
.tt-cote-lies__titre a:hover { color: var(--tt-brique); }

.tt-cote-lies__date {
  margin: calc(var(--tt-gap-s) / 3.5) 0 0;
  font-size: var(--tt-fs-micro);
  color: var(--tt-texte-3);
}

/* --------------------------------------------------------------------------
   5. La page auteur
   -------------------------------------------------------------------------- */

.tt-auteur__corps {
  display: grid;
  grid-template-columns: 20rem 1fr;   /* 320px : colonne de portrait de la maquette */
  gap: var(--tt-gouttiere);
  padding-bottom: var(--tt-section);
}

.tt-auteur__portrait {
  display: block;
  width: 100%;
  aspect-ratio: var(--tt-ratio-couv);
  object-fit: cover;
}

.tt-auteur__portrait--vide {
  display: grid;
  place-items: center;
  border: var(--tt-filet);
  border-color: var(--tt-bord-beige);
  background: var(--tt-papier-alt);
  color: var(--tt-texte-3);
  font-size: var(--tt-fs-micro);
  letter-spacing: var(--tt-ls-micro);
  text-transform: uppercase;
  text-align: center;
}

.tt-auteur__fiche {
  display: flex;
  flex-direction: column;
  gap: calc(var(--tt-gap-s) / 1.55);
  margin: var(--tt-gap-s) 0 0;
  padding-top: var(--tt-gap-s);
  border-top: var(--tt-filet);
  font-size: var(--tt-fs-meta);
  color: var(--tt-encre);
}

.tt-auteur__ligne { display: flex; gap: calc(var(--tt-gap-s) / 1.75); }
.tt-auteur__ligne dt { color: var(--tt-texte-3); }
.tt-auteur__ligne dd { margin: 0; }

.tt-auteur__liens {
  margin-top: var(--tt-gap);
  padding-top: var(--tt-gap-s);
  border-top: var(--tt-filet);
}

.tt-auteur__liens-titre {
  margin: 0 0 var(--tt-gap-s);
  font-size: var(--tt-fs-micro);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--tt-texte-2);
}

.tt-auteur__liens ul {
  display: flex;
  flex-direction: column;
  gap: calc(var(--tt-gap-s) / 1.75);
  margin: 0;
  padding: 0;
  list-style: none;
}

.tt-auteur__liens a {
  display: flex;
  align-items: center;
  gap: calc(var(--tt-gap-s) / 1.4);
  min-height: var(--tt-touch);
  padding: calc(var(--tt-gap-s) / 1.4);
  border: var(--tt-filet);
  border-color: var(--tt-bord-champ);
  background: var(--tt-papier);
  font-size: var(--tt-fs-meta);
  color: var(--tt-encre);
  transition: background var(--tt-t-rapide), border-color var(--tt-t-rapide);
}

.tt-auteur__liens a:hover { background: var(--tt-papier-gris); border-color: var(--tt-encre); }

.tt-auteur__liens-type {
  flex: none;
  width: 4rem;    /* 64px : gouttiere de type de la maquette */
  font-size: var(--tt-fs-micro);
  letter-spacing: var(--tt-ls-micro);
  text-transform: uppercase;
  color: var(--tt-brique);
}

.tt-auteur__liens-libelle { flex: 1; }

.tt-auteur__inviter {
  display: block;
  margin-top: var(--tt-gap);
  padding: var(--tt-gap-s);
  text-align: center;
  font-size: var(--tt-fs-micro);
  letter-spacing: var(--tt-ls-micro);
  text-transform: uppercase;
}

.tt-auteur__nom {
  margin: 0 0 calc(var(--tt-gap-s) / 2);
  font-size: var(--tt-fs-h1);
  line-height: 1;
  letter-spacing: var(--tt-ls-titre);
}

.tt-auteur__sous-titre {
  margin: 0 0 var(--tt-bloc);
  font-family: var(--tt-serif);
  font-size: var(--tt-fs-h2-petit);
  line-height: 1.25;
  color: var(--tt-brique);
}

.tt-auteur__bio { max-width: 41.25rem; }   /* 660px : mesure de ligne de la maquette */

.tt-auteur__bio-vide {
  max-width: 41.25rem;
  color: var(--tt-texte-3);
  font-style: italic;
}

.tt-distinctions {
  display: flex;
  flex-wrap: wrap;
  gap: calc(var(--tt-gap-s) / 1.4);
  max-width: 41.25rem;
  margin: var(--tt-gap) 0 0;
  padding: 0;
  list-style: none;
}

.tt-distinction {
  padding: calc(var(--tt-gap-s) / 1.2) var(--tt-gap-s);
  background: var(--tt-papier-alt);
  font-size: var(--tt-fs-meta);
  color: var(--tt-encre);
}

.tt-distinction__libelle {
  display: block;
  margin-bottom: calc(var(--tt-gap-s) / 3.5);
  font-size: var(--tt-fs-micro);
  letter-spacing: var(--tt-ls-micro);
  text-transform: uppercase;
  color: var(--tt-brique);
}

/* --------------------------------------------------------------------------
   6. La bibliographie
   -------------------------------------------------------------------------- */

.tt-biblio { padding-bottom: var(--tt-section); }

.tt-biblio__compte {
  font-size: var(--tt-fs-meta);
  color: var(--tt-texte-2);
}

.tt-biblio__liste {
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 0;
  list-style: none;
}

.tt-biblio__item {
  display: grid;
  grid-template-columns: 9.375rem 1fr auto;   /* 150px : couverture de la maquette */
  gap: var(--tt-section);
  align-items: center;
  padding: var(--tt-bloc) 0;
  border-bottom: var(--tt-filet);
}

.tt-biblio__couv {
  display: block;
  overflow: hidden;
  border: var(--tt-filet);
  background: var(--tt-papier);
  transition: transform var(--tt-t-lift), box-shadow var(--tt-t-lift), border-color var(--tt-t-rapide);
}

.tt-biblio__couv img {
  display: block;
  width: 100%;
  aspect-ratio: var(--tt-ratio-couv);
  object-fit: cover;
  transition: transform var(--tt-t-zoom);
}

.tt-biblio__item:hover .tt-biblio__couv {
  border-color: var(--tt-or);
  transform: translateY(var(--tt-lift-petit));
  box-shadow: var(--tt-ombre-carte);
}

.tt-biblio__item:hover .tt-biblio__couv img { transform: scale(var(--tt-zoom-hover)); }

.tt-biblio__meta {
  display: flex;
  flex-wrap: wrap;
  gap: calc(var(--tt-gap-s) / 1.4);
  margin: 0 0 calc(var(--tt-gap-s) / 1.75);
}

.tt-biblio__format {
  font-size: var(--tt-fs-micro);
  color: var(--tt-texte-3);
}

.tt-biblio__titre {
  margin: 0;
  font-size: var(--tt-fs-h2-petit);
  line-height: 1.1;
}

.tt-biblio__titre a { color: var(--tt-encre); transition: color var(--tt-t-rapide); }
.tt-biblio__titre a:hover { color: var(--tt-brique); }

.tt-biblio__chapeau {
  max-width: 32.5rem;
  margin: calc(var(--tt-gap-s) / 1.75) 0 0;
  font-size: var(--tt-fs-corps-s);
  line-height: 1.65;
  color: var(--tt-texte-2);
}

.tt-biblio__achat {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: calc(var(--tt-gap-s) / 1.4);
  text-align: right;
}

.tt-biblio__prix { font-size: var(--tt-fs-carte); font-weight: 600; white-space: nowrap; }

.tt-biblio__lien {
  display: inline-flex;
  align-items: center;
  min-height: var(--tt-touch);
  padding: 0 var(--tt-gap-s);
  font-size: var(--tt-fs-micro);
  letter-spacing: var(--tt-ls-micro);
  text-transform: uppercase;
  white-space: nowrap;
}

.tt-biblio__stock { font-size: var(--tt-fs-micro); }

/* --------------------------------------------------------------------------
   7. L'index des auteurs
   -------------------------------------------------------------------------- */

.tt-grille-auteurs {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--tt-section) var(--tt-bloc);
  margin: 0;
  padding: var(--tt-section) 0;
  list-style: none;
}

.tt-carte-auteur {
  display: flex;
  flex-direction: column;
  padding: var(--tt-gap-s);
  background: var(--tt-papier);
}

.tt-carte-auteur__portrait {
  display: block;
  width: 100%;
  aspect-ratio: var(--tt-ratio-couv);
  object-fit: cover;
}

.tt-carte-auteur__portrait--vide {
  display: grid;
  place-items: center;
  padding: calc(var(--tt-gap-s) / 2.3);
  border: var(--tt-filet);
  border-color: var(--tt-bord-beige);
  background: var(--tt-papier-alt);
  color: var(--tt-texte-3);
  font-size: var(--tt-fs-micro);
  letter-spacing: var(--tt-ls-micro);
  text-transform: uppercase;
  text-align: center;
}

.tt-carte-auteur .tt-surtitre { margin: var(--tt-gap-s) 0 calc(var(--tt-gap-s) / 2.3); }

.tt-carte-auteur__nom {
  margin: 0;
  font-size: var(--tt-fs-h3);
  line-height: 1.15;
  letter-spacing: 0;
}

.tt-carte-auteur__nom a { color: var(--tt-encre); transition: color var(--tt-t-rapide); }
.tt-carte-auteur:hover .tt-carte-auteur__nom a { color: var(--tt-brique); }

.tt-carte-auteur__ligne {
  margin: calc(var(--tt-gap-s) / 2.3) 0 0;
  font-size: var(--tt-fs-meta);
  line-height: 1.6;
  color: var(--tt-texte-2);
}

.tt-carte-auteur__compte {
  margin: auto 0 0;
  padding-top: var(--tt-gap-s);
  font-size: var(--tt-fs-micro);
  color: var(--tt-texte-3);
}

/* --------------------------------------------------------------------------
   8. Page simple, listes generiques, 404
   -------------------------------------------------------------------------- */

.tt-page__tete,
.tt-liste__tete {
  padding-top: var(--tt-bloc);
  padding-bottom: var(--tt-gap);
  border-bottom: var(--tt-filet-or);
}

/* Bandeau beige des en-tetes, comme celui du catalogue (.tt-cat__tete) :
   demande de Marie du 17/09, « partout ».
   - page.php enveloppe fil d'Ariane et titre dans .tt-bandeau ;
   - les en-tetes deja dessines (Carnet, Presse, Agenda, Auteurs, fiche
     rencontre, listes) restent dans leur conteneur : le fond deborde a
     pleine largeur par une ombre portee rognee, sans toucher au balisage. */
.tt-bandeau {
  background: var(--tt-papier-alt);
  border-bottom: var(--tt-filet-or);
}

.tt-bandeau .tt-page__tete {
  padding-top: var(--tt-gap-s);
  padding-bottom: calc(var(--tt-gap) + var(--tt-gap-s));
  border-bottom: 0;
}

.tt-carnet__tete,
.tt-liste__tete,
.tt-fiche-rencontre__tete {
  position: relative;
  border-bottom: 0;
  background: var(--tt-papier-alt);
  box-shadow: 0 0 0 100vmax var(--tt-papier-alt);
  clip-path: inset(0 -100vmax);
}

/* Le debordement s'arrete aux bords de la feuille, comme le bandeau de la
   boutique : sur grand ecran, il ne doit pas deborder sur le fond gris
   (retour de Marie, 17/09). overflow-x: clip ne cree pas de conteneur de
   defilement : les elements « sticky » continuent de fonctionner. */
.tt-feuille { overflow-x: clip; }

/* Le filet or, lui aussi a pleine largeur (une ombre ne cree pas de
   defilement horizontal, un 100vw si). */
.tt-carnet__tete::after,
.tt-liste__tete::after,
.tt-fiche-rencontre__tete::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  background: var(--tt-or-voile);
  box-shadow: 0 0 0 100vmax var(--tt-or-voile);
  clip-path: inset(0 -100vmax);
}

.tt-liste__chapeau { margin-top: var(--tt-gap-s); color: var(--tt-texte-2); }

.tt-page__visuel { margin: 0; }
.tt-page__visuel img { display: block; width: 100%; height: auto; }

.tt-page__corps {
  max-width: 50rem;    /* 800px : colonne de lecture d'une page de contenu */
  margin-inline: auto;
  padding-top: var(--tt-section);
  padding-bottom: var(--tt-section);
  line-height: 1.8;
}

/* Page avec image : image fixe à gauche, texte qui défile à droite. */
.tt-page__duo {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: var(--tt-section);
  align-items: start;
  padding-top: var(--tt-section);
  padding-bottom: var(--tt-section);
}

.tt-page__duo .tt-page__visuel {
  position: sticky;
  top: var(--tt-bloc);
}

.tt-page__duo .tt-page__visuel img { border: 1px solid var(--tt-bord); }

.tt-page__duo .tt-page__corps {
  max-width: 44rem;    /* 704px : mesure de lecture dans la colonne */
  margin-inline: 0;
  padding-top: 0;
  padding-bottom: 0;
}

.tt-page__duo .tt-prose > :first-child,
.tt-page__duo .tt-prose > :first-child > :first-child,
.tt-page__duo .tt-prose > :first-child > :first-child > :first-child { margin-top: 0; }

@media (max-width: 767px) {
  .tt-page__duo { grid-template-columns: 1fr; gap: var(--tt-bloc); }
  .tt-page__duo .tt-page__visuel { position: static; }
}

.tt-page__corps h2 { font-size: var(--tt-fs-h2-petit); margin: var(--tt-section) 0 var(--tt-gap-s); }
.tt-page__corps h3 { font-size: var(--tt-fs-h3); margin: var(--tt-bloc) 0 var(--tt-gap-s); }
.tt-page__corps img { max-width: 100%; height: auto; }
.tt-page__corps table { width: 100%; border-collapse: collapse; }
.tt-page__corps th,
.tt-page__corps td { padding: var(--tt-gap-s); border-bottom: var(--tt-filet); text-align: left; }

.tt-404 {
  padding-top: var(--tt-section);
  padding-bottom: var(--tt-section);
  text-align: center;
}

.tt-404__texte {
  max-width: 32.5rem;
  margin: var(--tt-gap-s) auto var(--tt-gap);
  color: var(--tt-texte-2);
}

.tt-404__recherche { display: flex; justify-content: center; margin-bottom: var(--tt-gap); }

.tt-404__sorties {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: var(--tt-gap);
  margin: 0;
}

.tt-404__sorties .tt-btn-primaire {
  display: inline-flex;
  align-items: center;
  min-height: var(--tt-touch);
  padding: 0 var(--tt-gap);
  font-size: var(--tt-fs-corps-s);
  font-weight: 600;
  letter-spacing: .04em;
}

.tt-recherche--bloc {
  display: flex;
  gap: var(--tt-gap-s);
  width: 100%;
  max-width: 27.5rem;   /* 440px : largeur de champ confortable */
}

.tt-recherche--bloc input[type="search"] {
  flex: 1;
  min-height: var(--tt-touch);
  padding: 0 var(--tt-gap-s);
  border: var(--tt-filet);
  border-color: var(--tt-bord-champ-fonce);
  background: var(--tt-papier);
  font-family: var(--tt-sans);
  font-size: var(--tt-fs-corps-s);
  color: var(--tt-encre);
}

.tt-recherche--bloc button {
  min-height: var(--tt-touch);
  padding: 0 var(--tt-gap);
  font-family: var(--tt-sans);
  font-size: var(--tt-fs-micro);
  letter-spacing: var(--tt-ls-micro);
  text-transform: uppercase;
  cursor: pointer;
}

/* --------------------------------------------------------------------------
   9. Points de rupture
   -------------------------------------------------------------------------- */

@media (max-width: 1200px) {
  .tt-grille-auteurs { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 900px) {

  .tt-carnet__tete {
    grid-template-columns: 1fr;
    gap: var(--tt-gap);
  }

  .tt-carnet__cats .tt-puces { justify-content: flex-start; }

  .tt-alaune { grid-template-columns: 1fr; }
  .tt-alaune__texte { padding-top: var(--tt-bloc); padding-bottom: var(--tt-bloc); }
  .tt-alaune__visuel { order: -1; }
  .tt-alaune__visuel img,
  .tt-alaune__visuel--vide { min-height: 13.75rem; }   /* 220px en mobile */
  .tt-alaune__visuel--vide { border-left: 0; border-bottom: var(--tt-filet); }

  .tt-billets { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--tt-gap) var(--tt-gap-s); }

  .tt-article__corps { grid-template-columns: 1fr; gap: var(--tt-bloc); }
  .tt-article__cote { border-top: var(--tt-filet); padding-top: var(--tt-gap); }

  .tt-auteur__corps { grid-template-columns: 1fr; }
  .tt-auteur__portrait { max-width: 15rem; }   /* 240px : portrait recentre */

  .tt-biblio__item { grid-template-columns: 6.25rem 1fr; gap: var(--tt-gap); }
  .tt-biblio__achat {
    grid-column: 1 / -1;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: var(--tt-gap);
    text-align: left;
  }

  .tt-grille-auteurs { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--tt-gap) var(--tt-gap-s); }
}

@media (max-width: 600px) {
  .tt-billets { grid-template-columns: 1fr; }
  .tt-encart-livre { grid-template-columns: 1fr; }
  .tt-encart-livre__couv { max-width: 9.375rem; }
  .tt-partage { font-size: var(--tt-fs-micro); }
  .tt-partage__retour { margin-left: 0; width: 100%; }
  .tt-recherche--bloc { flex-direction: column; }
}

/* --------------------------------------------------------------------------
   Pied de la page auteur — rencontres et presse

   Deux colonnes qui n'existaient pas tant que les CPT etaient vides. Elles
   apparaissent d'elles-memes des qu'une rencontre est saisie ou qu'un ouvrage
   de l'auteur est cite dans la revue de presse.
   -------------------------------------------------------------------------- */

.tt-auteur__pied {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(0, 20rem));
  gap: var(--tt-bloc);
  padding-top: var(--tt-bloc);
  padding-bottom: var(--tt-bloc);
  border-top: var(--tt-filet);
}

.tt-auteur__liste-simple,
.tt-auteur__rencontres {
  margin: var(--tt-gap-s) 0 var(--tt-gap-s);
  padding: 0;
  list-style: none;
}

.tt-auteur__liste-simple li,
.tt-auteur__rencontres li {
  padding: calc(var(--tt-gap-s) / 2) 0;
  border-bottom: var(--tt-filet);
}

.tt-auteur__liste-simple a,
.tt-auteur__rencontres a {
  color: var(--tt-encre);
  text-decoration: none;
  font-size: var(--tt-fs-corps-s);
  line-height: 1.35;
  transition: color var(--tt-t-rapide);
}

.tt-auteur__liste-simple a:hover,
.tt-auteur__rencontres a:hover { color: var(--tt-brique); }

.tt-auteur__rencontre-quand {
  display: block;
  margin-top: calc(var(--tt-gap-s) / 4);
  font-size: var(--tt-fs-meta);
  color: var(--tt-texte-2);
}

@media (max-width: 600px) {
  .tt-auteur__pied { grid-template-columns: 1fr; }
}