/*
Theme Name: Ludis — l'édition du soir
Theme URI: https://ludis-inc.com
Author: Seobooster Ltd
Description: Gabarit d'édition quotidienne — manchette datée, genres journalistiques, feuillets.
Version: 1.0.0
Requires PHP: 7.4
Text Domain: ludis
*/

/* =========================================================================
   1. POLICES — auto-hébergées, latin étendu, ≤4 fichiers (P-086)
   Fichiers attendus dans assets/fonts/ (voir assets/fonts/A-FOURNIR.txt).
   Repli honnête tant que les .woff2 ne sont pas déposés : Georgia / système.
   ========================================================================= */
@font-face{
  font-family:"Source Serif 4";
  src:url("assets/fonts/source-serif-4-roman.woff2") format("woff2");
  font-weight:200 900;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"Source Serif 4";
  src:url("assets/fonts/source-serif-4-italic.woff2") format("woff2");
  font-weight:200 900;
  font-style:italic;
  font-display:swap;
}
@font-face{
  font-family:"Karla";
  src:url("assets/fonts/karla-roman.woff2") format("woff2");
  font-weight:200 800;
  font-style:normal;
  font-display:swap;
}

/* =========================================================================
   2. JETONS — 1 fond neutre + 1 accent (P-116), clair ET sombre (P-351/P-110)
   ⛔ --lu-grenat n'est JAMAIS posé en fond (background) nulle part dans ce fichier.
   ⛔ Les bandes "nuit" sont TOUJOURS sombres, dans les deux modes : le texte qui
      les recouvre utilise donc des jetons FIXES (--lu-sur-nuit*), jamais --lu-encre
      qui, lui, s'inverse avec le mode et deviendrait illisible sur nuit en clair.
   ========================================================================= */
:root{
  --lu-papier:#E4E6E1;
  --lu-feuillet:#F1F2EE;
  --lu-encre:#171C18;
  --lu-encre-sourde:#5A6159;
  --lu-grenat:#7A1E32;
  --lu-nuit:#1E2620;
  --lu-filet:#B9BFB6;
  --lu-filet-actif:#767D74;

  /* jetons FIXES : ne dépendent JAMAIS du mode clair/sombre du visiteur */
  --lu-sur-nuit:#E8EAE4;
  --lu-sur-nuit-sourde:#9AA298;
  --lu-sur-nuit-filet:#39413A;
  --lu-duotone:url(#lu-duotone-clair);

  --lu-font-serif:"Source Serif 4", Georgia, "Times New Roman", serif;
  --lu-font-sans:"Karla", "Trebuchet MS", "Segoe UI", sans-serif;
}
@media (prefers-color-scheme: dark){
  :root{
    --lu-papier:#141815;
    --lu-feuillet:#1E2420;
    --lu-encre:#E8EAE4;
    --lu-encre-sourde:#9AA298;
    --lu-grenat:#E4899B;
    /* D-09 (verdict 2026-09-07) : #0E120F était à ~2 points de --lu-papier (#141815) —
       la bande "nuit" disparaissait dans le fond déjà sombre. Écart numérique élargi
       + filet grenat plein bord (règle appliquée plus bas) pour que la bande reste un
       repère net même quand toute la page est sombre. */
    --lu-nuit:#080A08;
    --lu-filet:#39413A;
    --lu-filet-actif:#7C857A;
    --lu-duotone:url(#lu-duotone-sombre);
  }
}

/* =========================================================================
   3. RESET SOBRE
   ========================================================================= */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--lu-papier);
  color:var(--lu-encre);
  font-family:var(--lu-font-sans);
  font-size:17px;
  line-height:1.5;
  font-optical-sizing:auto;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3,h4{margin:0;font-family:var(--lu-font-serif);font-weight:700;line-height:1.15}
p{margin:0 0 1em}
ul,ol{margin:0;padding:0;list-style:none}
button,input,textarea,select{font-family:inherit;font-size:inherit;color:inherit}
.lu-chiffres{font-variant-numeric:lining-nums tabular-nums}

/* Procédé 6 — bichromie encre/papier (D-02). Posée en filtre, PAS en couleur
   cosmétique : matrice de luminance + table à deux teintes exactes du site
   (voir header.php). S'applique uniquement aux photos d'actualité générale. */
.lu-photo-bichromie{filter:var(--lu-duotone)}

.lu-saut{position:absolute;left:-9999px;top:0;background:var(--lu-encre);color:var(--lu-papier);padding:10px 16px;z-index:1000}
.lu-saut:focus{left:12px;top:12px}

/* Contenu utile aux lecteurs d'écran, retiré du rendu visuel sans casser la mise
   en page (contrairement à .lu-saut, jamais révélé au focus — D-13). */
.lu-visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.lu-conteneur{max-width:1264px;margin-inline:auto;padding-inline:20px}
@media (max-width:1320px){.lu-conteneur{padding-inline:24px}}

/* filets — le seul appareil de séparation du site */
.lu-filet{border:0;border-top:1px solid var(--lu-filet);margin:0}
.lu-filet-grenat{height:3px;background:var(--lu-grenat);border:0;margin:0}

/* =========================================================================
   4. MANCHETTE (procédé 1) — datée du lendemain, régénérée à chaque édition
   ========================================================================= */
.lu-manchette{padding-block:22px 0;background:var(--lu-papier)}
.lu-manchette__haut{display:flex;align-items:baseline;justify-content:space-between;gap:20px;flex-wrap:wrap}
.lu-wordmark{display:block;height:40px;width:auto}
.lu-manchette__ligne{
  font-family:var(--lu-font-sans);
  font-size:12px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--lu-encre-sourde);
  margin:0 0 14px;
}
.lu-manchette__ligne strong{color:var(--lu-encre);font-weight:700}

/* Cartouche dégradé — pages intemporelles (piliers, pages de service) */
.lu-cartouche-edition{
  display:inline-block;
  font-family:var(--lu-font-sans);
  font-size:12px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--lu-encre-sourde);
  padding-block:16px 12px;
}

/* =========================================================================
   5. NAV RUBRIQUES (bloc 2) — flex, sans puces (P-004)
   ========================================================================= */
.lu-nav{border-top:1px solid var(--lu-filet);border-bottom:1px solid var(--lu-filet)}
.lu-nav__liste{display:flex;flex-wrap:wrap;gap:0}
.lu-nav__lien{
  display:block;
  padding:12px 16px 12px 0;
  font-family:var(--lu-font-sans);
  font-size:12px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  text-decoration:none;
  color:var(--lu-encre);
}
.lu-nav__lien:hover,.lu-nav__lien:focus{text-decoration:underline;text-underline-offset:3px}
@media (max-width:767px){
  /* Jamais masquée : la barre basse y renvoie par ancre (#lu-nav-rubriques).
     Un défilement horizontal remplace le flex-wrap, sans JavaScript. */
  .lu-nav{position:relative}
  .lu-nav .lu-conteneur{padding-inline:16px}
  .lu-nav__liste{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scroll-padding-inline:16px}
  .lu-nav__lien{padding-right:14px;white-space:nowrap}
  /* D-07 : la liste était coupée net sans indice de défilement. Un dégradé de
     bord signale qu'il reste des rubriques hors champ, sans JavaScript. */
  .lu-nav::after{
    content:"";position:absolute;top:0;right:0;bottom:0;width:28px;pointer-events:none;
    background:linear-gradient(to right, transparent, var(--lu-papier));
  }
}

/* Barre basse mobile — 5 entrées, 44px, safe-area (P-254) */
.lu-tabbes{
  display:none;
  position:fixed;left:0;right:0;bottom:0;z-index:100;
  background:var(--lu-feuillet);
  border-top:1px solid var(--lu-filet);
  padding-bottom:env(safe-area-inset-bottom);
}
.lu-tabbes__liste{display:flex}
.lu-tabbes__item{flex:1}
.lu-tabbes__lien{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;
  min-height:44px;
  font-family:var(--lu-font-sans);
  font-size:10px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;
  text-decoration:none;color:var(--lu-encre-sourde);
}
.lu-tabbes__lien[aria-current="page"]{color:var(--lu-encre)}
@media (max-width:767px){
  .lu-tabbes{display:block}
  body{padding-bottom:calc(44px + env(safe-area-inset-bottom))}
}

/* =========================================================================
   6. TITRES ET MÉTADONNÉES — hiérarchie par la taille (P-207)
   ========================================================================= */
.lu-genre{
  display:block;
  font-family:var(--lu-font-sans);
  font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--lu-grenat);
  margin-bottom:6px;
}
.lu-titre-une{font-size:46px;line-height:1.08;margin-bottom:14px}
.lu-titre-article{font-size:36px;line-height:1.12;margin-bottom:12px}
.lu-titre-h2{font-size:25px;line-height:1.18;font-weight:700}
.lu-titre-rubrique{font-size:19px;line-height:1.2;font-weight:700}
.lu-chapo{
  font-family:var(--lu-font-serif);
  font-style:italic;
  font-size:19px;
  line-height:1.4;
  color:var(--lu-encre);
  margin-bottom:16px;
}
.lu-meta{
  font-family:var(--lu-font-sans);
  font-size:12px;
  letter-spacing:.04em;
  color:var(--lu-encre-sourde);
  display:flex;flex-wrap:wrap;gap:4px 10px;
  align-items:baseline;
}
.lu-credit{font-family:var(--lu-font-sans);font-size:11px;color:var(--lu-encre-sourde);margin-top:6px}
.lu-lien-corps{text-decoration:underline;text-decoration-color:currentColor;text-underline-offset:3px;color:var(--lu-encre)}

/* =========================================================================
   7. LA UNE — grille 7/3/2 (bloc 3)
   ========================================================================= */
.lu-grille-une{display:grid;grid-template-columns:repeat(12,1fr);gap:28px;padding-block:28px;border-top:none}
.lu-une-principale{grid-column:span 7}
.lu-une-principale img{aspect-ratio:3/2;object-fit:cover;width:100%}
.lu-breves{grid-column:span 3;border-left:1px solid var(--lu-filet);padding-left:28px}
.lu-breves__titre{font-family:var(--lu-font-sans);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--lu-encre-sourde);margin-bottom:10px}
.lu-breves__item{display:flex;gap:10px;padding-block:10px;border-top:1px solid var(--lu-filet)}
.lu-breves__item:first-child{border-top:none}
.lu-breves__num{
  font-family:var(--lu-font-sans);font-weight:700;font-size:13px;color:var(--lu-encre-sourde);
  flex:0 0 auto;min-width:20px;font-variant-numeric:tabular-nums;
}
.lu-breves__corps{display:flex;flex-direction:column;gap:2px;min-width:0}
/* D-14 : le genre manquait sur les brèves (la DA le veut "partout"). Étiquette
   compacte au-dessus du titre, même traitement que .lu-genre en plus petit. */
.lu-breves__genre{font-family:var(--lu-font-sans);font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--lu-grenat)}
.lu-breves__lien{font-family:var(--lu-font-sans);font-size:16px;line-height:1.45;text-decoration:none;color:var(--lu-encre)}
.lu-breves__lien:hover{text-decoration:underline;text-underline-offset:3px}
.lu-sommaire{grid-column:span 2;border-left:1px solid var(--lu-filet);padding-left:28px}
.lu-sommaire__titre{font-family:var(--lu-font-sans);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--lu-encre-sourde);margin-bottom:10px}
.lu-sommaire__ligne{display:flex;justify-content:space-between;font-family:var(--lu-font-sans);font-size:13px;padding-block:7px;border-top:1px solid var(--lu-filet)}
.lu-sommaire__ligne:first-child{border-top:none}
.lu-sommaire__genre{color:var(--lu-grenat);font-weight:700}
.lu-sommaire__n{font-variant-numeric:tabular-nums;color:var(--lu-encre-sourde)}

/* D-05 : quand la une n'a qu'un seul article, sa colonne s'arrêtait au chapô et
   laissait un grand vide face à la colonne des brèves qui, elle, continue.
   Ces titres secondaires (filet à filet, sans image) comblent l'écart — et ne
   se rendent que s'il y a au moins un titre à montrer (voir front-page.php). */
.lu-une-principale__secondaires{border-top:1px solid var(--lu-filet);margin-top:8px}
.lu-une-principale__secondaires li{padding-block:10px;border-top:1px solid var(--lu-filet)}
.lu-une-principale__secondaires li:first-child{border-top:none}
.lu-une-principale__secondaires a{font-family:var(--lu-font-serif);font-size:17px;line-height:1.3;text-decoration:none;color:var(--lu-encre)}
.lu-une-principale__secondaires a:hover{text-decoration:underline;text-underline-offset:3px}

@media (max-width:1023px){
  .lu-une-principale,.lu-breves,.lu-sommaire{grid-column:span 12}
  .lu-breves,.lu-sommaire{border-left:none;padding-left:0;border-top:1px solid var(--lu-filet);padding-top:20px}
}
@media (max-width:767px){
  /* D-08 : le H1 de une gardait sa taille desktop (46px) et occupait 6 lignes
     sur mobile. L'article mobile est bien calé à 3 lignes : même réglage ici. */
  .lu-titre-une{font-size:32px;line-height:1.15}
}

/* =========================================================================
   8. LES SIX GENRES DU JOUR (bloc 4)
   ========================================================================= */
.lu-genres-bande{
  display:grid;grid-template-columns:repeat(6,1fr);gap:28px;
  padding-block:28px;border-top:1px solid var(--lu-filet);
}
.lu-genres-bande__colonne{border-top:3px solid var(--lu-grenat);padding-top:12px}
.lu-genres-bande__genre{font-family:var(--lu-font-sans);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--lu-grenat);margin-bottom:8px}
.lu-genres-bande__titre{font-family:var(--lu-font-serif);font-size:16px;line-height:1.3;margin-bottom:8px}
.lu-genres-bande__lien{text-decoration:none;color:var(--lu-encre)}
.lu-genres-bande__lien:hover{text-decoration:underline;text-underline-offset:3px}
@media (max-width:1023px){.lu-genres-bande{grid-template-columns:repeat(3,1fr)}}
@media (max-width:767px){.lu-genres-bande{grid-template-columns:1fr;gap:24px}}

/* =========================================================================
   9. LE GRAND FORMAT (bloc 5) — bande nuit, jetons FIXES pour le texte
   ========================================================================= */
/* D-09 : filet grenat plein bord en entrée/sortie de la bande — repère net même
   quand l'écart de luminosité avec le fond se resserre en mode sombre. */
.lu-grand-format{background:var(--lu-nuit);color:var(--lu-sur-nuit);border-top:3px solid var(--lu-grenat);border-bottom:3px solid var(--lu-grenat)}
.lu-grand-format__grille{display:grid;grid-template-columns:1fr 1fr;gap:0;align-items:stretch}
.lu-grand-format__photo{aspect-ratio:3/2;object-fit:cover;width:100%;height:100%}
.lu-grand-format__contenu{padding:40px;display:flex;flex-direction:column;justify-content:center}
.lu-grand-format__genre{font-family:var(--lu-font-sans);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--lu-sur-nuit-sourde);margin-bottom:10px}
.lu-grand-format__titre{font-family:var(--lu-font-serif);font-size:32px;line-height:1.15;color:var(--lu-sur-nuit);margin-bottom:14px}
.lu-grand-format__extrait{font-family:var(--lu-font-serif);font-style:italic;font-size:18px;line-height:1.5;color:var(--lu-sur-nuit)}
.lu-grand-format__lien{display:inline-block;margin-top:16px;font-family:var(--lu-font-sans);font-size:13px;font-weight:700;letter-spacing:.04em;text-decoration:underline;text-underline-offset:3px;color:var(--lu-sur-nuit)}
@media (max-width:767px){.lu-grand-format__grille{grid-template-columns:1fr}.lu-grand-format__photo{aspect-ratio:3/2}.lu-grand-format__contenu{padding:24px}}

/* =========================================================================
   10. ARGENT & CONSO — bancs d'essai (bloc 6) — SEUL endroit en couleur pleine
   ========================================================================= */
.lu-service{padding-block:32px;border-top:1px solid var(--lu-filet)}
.lu-service__entete{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:20px}
.lu-bancs-essai{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.lu-carte-service__photo{aspect-ratio:3/2;object-fit:cover;width:100%;margin-bottom:12px}
.lu-carte-service__titre{font-family:var(--lu-font-serif);font-size:20px;line-height:1.2;margin-bottom:8px}
.lu-carte-service__verdict{font-family:var(--lu-font-sans);font-size:15px;line-height:1.4;margin-bottom:8px}
.lu-carte-service__prix{font-family:var(--lu-font-sans);font-weight:700;font-size:14px;color:var(--lu-encre)}
@media (max-width:1023px){.lu-bancs-essai{grid-template-columns:1fr 1fr}}
@media (max-width:767px){.lu-bancs-essai{grid-template-columns:1fr}}

/* =========================================================================
   11. MOSAÏQUE DE RUBRIQUES (bloc 7) — texte pur
   ========================================================================= */
.lu-mosaique{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;padding-block:32px;border-top:1px solid var(--lu-filet)}
.lu-mosaique__colonne{border-top:3px solid var(--lu-grenat);padding-top:12px}
.lu-mosaique__titre-rubrique{font-family:var(--lu-font-sans);font-size:14px;font-weight:700;text-decoration:none;color:var(--lu-encre);display:block;margin-bottom:10px}
.lu-mosaique__liste li{padding-block:8px;border-top:1px solid var(--lu-filet)}
.lu-mosaique__liste li:first-child{border-top:none}
.lu-mosaique__liste a{font-family:var(--lu-font-serif);font-size:15px;line-height:1.3;text-decoration:none;color:var(--lu-encre)}
.lu-mosaique__liste a:hover{text-decoration:underline;text-underline-offset:3px}
@media (max-width:1023px){.lu-mosaique{grid-template-columns:repeat(2,1fr)}}
@media (max-width:767px){.lu-mosaique{grid-template-columns:1fr}}

/* =========================================================================
   12. TÉLÉVISION CE SOIR (bloc 8)
   ========================================================================= */
.lu-tv{padding-block:32px;border-top:1px solid var(--lu-filet)}
.lu-tv__grille{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;margin-top:20px}
.lu-tv__tuile{display:block;text-decoration:none;color:var(--lu-encre)}
.lu-tv__photo{aspect-ratio:16/9;object-fit:cover;width:100%;margin-bottom:8px}
.lu-tv__heure{font-family:var(--lu-font-sans);font-weight:700;font-size:13px;color:var(--lu-grenat);font-variant-numeric:tabular-nums;margin-bottom:4px}
.lu-tv__titre{font-family:var(--lu-font-serif);font-size:16px;line-height:1.25}
@media (max-width:1023px){.lu-tv__grille{grid-template-columns:repeat(2,1fr)}}
@media (max-width:767px){.lu-tv__grille{grid-template-columns:1fr}}

/* =========================================================================
   13. DANS L'ÉDITION D'HIER (bloc 9)
   ========================================================================= */
.lu-hier{padding-block:20px;border-top:1px solid var(--lu-filet)}
.lu-hier__entete{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:12px}
.lu-hier__liste{display:flex;flex-wrap:wrap;gap:6px 24px}
.lu-hier__liste a{font-family:var(--lu-font-sans);font-size:14px;text-decoration:none;color:var(--lu-encre-sourde)}
.lu-hier__liste a:hover{color:var(--lu-encre);text-decoration:underline;text-underline-offset:3px}
.lu-hier__lien-archive{font-family:var(--lu-font-sans);font-size:12px;font-weight:700;letter-spacing:.04em;text-decoration:underline;text-underline-offset:3px;color:var(--lu-encre)}

/* =========================================================================
   14. LA LETTRE DU SOIR (bloc 10) — jamais en pop-in
   ========================================================================= */
.lu-lettre{background:var(--lu-feuillet);padding:32px;margin-block:32px}
.lu-lettre__titre{font-size:22px;margin-bottom:8px}
.lu-lettre__texte{font-family:var(--lu-font-sans);font-size:15px;color:var(--lu-encre-sourde);margin-bottom:18px}
.lu-lettre__form{display:flex;gap:12px;flex-wrap:wrap}
.lu-lettre__champ{
  flex:1 1 240px;
  min-height:44px;
  padding:0 14px;
  background:var(--lu-papier);
  border:1px solid var(--lu-filet-actif);
  color:var(--lu-encre);
}
.lu-lettre__champ:focus{outline:2px solid var(--lu-filet-actif);outline-offset:1px}
.lu-bouton{
  min-height:44px;padding:0 22px;
  background:var(--lu-encre);color:var(--lu-papier);
  border:1px solid var(--lu-encre);
  font-family:var(--lu-font-sans);font-weight:700;font-size:14px;letter-spacing:.03em;
  cursor:pointer;
}
.lu-bouton:hover,.lu-bouton:focus{opacity:.85}
.lu-piege{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.lu-lettre__confirmation{font-family:var(--lu-font-sans);font-size:14px;color:var(--lu-grenat);margin-top:12px}

/* =========================================================================
   15. PIED DE PAGE (bloc 11) — bande nuit, jetons FIXES
   ========================================================================= */
.lu-pied{background:var(--lu-nuit);color:var(--lu-sur-nuit-sourde);padding-block:44px 24px;margin-top:32px;border-top:3px solid var(--lu-grenat)}
.lu-pied__colonnes{display:grid;grid-template-columns:repeat(6,1fr);gap:24px;margin-bottom:32px}
.lu-pied__titre-colonne{font-family:var(--lu-font-sans);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--lu-sur-nuit);margin-bottom:12px}
.lu-pied__colonne li{padding-block:5px}
.lu-pied__colonne a{font-family:var(--lu-font-sans);font-size:13px;text-decoration:none;color:var(--lu-sur-nuit-sourde)}
.lu-pied__colonne a:hover{color:var(--lu-sur-nuit);text-decoration:underline;text-underline-offset:3px}
.lu-colophon{border-top:1px solid var(--lu-sur-nuit-filet);padding-top:18px;display:flex;flex-wrap:wrap;gap:6px 20px;font-family:var(--lu-font-sans);font-size:12px;color:var(--lu-sur-nuit-sourde)}
@media (max-width:1023px){.lu-pied__colonnes{grid-template-columns:repeat(3,1fr)}}
@media (max-width:767px){.lu-pied__colonnes{grid-template-columns:repeat(2,1fr)}}

/* =========================================================================
   16. ARTICLE (single.php)
   ========================================================================= */
/* D-10 : titre, photo et corps tenaient trois axes gauches différents (760px pour
   l'entête, 640px pour le corps, 1000px pour la photo). Seule la photo déborde,
   volontairement ; entête et corps partagent désormais la même colonne 640px. */
.lu-article{padding-block:8px 48px}
.lu-article__entete{max-width:640px;margin-inline:auto;padding-inline:20px}
.lu-article__meta{margin-bottom:20px}
.lu-article__photo-conteneur{max-width:1000px;margin:0 auto 8px}
.lu-article__photo{aspect-ratio:3/2;object-fit:cover;width:100%}
.lu-article__credit-conteneur{max-width:1000px;margin:0 auto 32px;padding-inline:20px}
/* La colonne de lecture repose sur `feuillet`, jamais directement sur le papier
   (DA §4) : elle se distingue visuellement du reste de la page. */
.lu-article__corps{max-width:720px;margin-inline:auto;padding:32px 40px;background:var(--lu-feuillet);font-size:17px;line-height:1.62}
@media (max-width:600px){.lu-article__corps{padding:24px 20px}}
.lu-article__corps p{max-width:75ch}
.lu-article__corps h2{font-size:25px;margin:1.6em 0 .6em}
.lu-article__corps h3{font-size:19px;margin:1.4em 0 .5em}
.lu-article__corps blockquote{font-family:var(--lu-font-serif);font-style:italic;font-size:22px;line-height:1.4;border-left:3px solid var(--lu-grenat);padding-left:20px;margin:1.6em 0}
.lu-article__corps figure{margin:1.6em 0}
.lu-article__corps figcaption{font-family:var(--lu-font-sans);font-size:11px;color:var(--lu-encre-sourde);margin-top:6px}
.lu-article__corps a{text-decoration:underline;text-decoration-color:currentColor;text-underline-offset:3px}

.lu-pas-encore{
  max-width:640px;margin:32px auto 0;padding:18px 20px 18px 22px;
  margin-inline:auto;border-left:3px solid var(--lu-grenat);background:var(--lu-feuillet);
}
.lu-pas-encore__titre{font-family:var(--lu-font-sans);font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--lu-grenat);margin-bottom:8px}
.lu-pas-encore__texte{font-family:var(--lu-font-sans);font-size:15px;line-height:1.5;color:var(--lu-encre)}
.lu-pas-encore__heure{font-family:var(--lu-font-sans);font-size:12px;color:var(--lu-encre-sourde);margin-top:8px}

.lu-auteur-bloc{
  max-width:640px;margin:32px auto 0;padding-inline:20px;
  display:flex;gap:14px;align-items:flex-start;padding-top:20px;border-top:1px solid var(--lu-filet);
}
.lu-auteur-bloc__ecusson{
  flex:0 0 auto;width:44px;height:44px;border-radius:0;
  background:var(--lu-encre);color:var(--lu-papier);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--lu-font-serif);font-weight:700;font-size:17px;
}
.lu-auteur-bloc__nom{font-family:var(--lu-font-sans);font-weight:700;font-size:14px}
.lu-auteur-bloc__fonction{font-family:var(--lu-font-sans);font-size:13px;color:var(--lu-encre-sourde)}

.lu-lire-aussi{max-width:640px;margin:32px auto 0;padding:16px 20px;background:var(--lu-feuillet)}
.lu-lire-aussi__titre{font-family:var(--lu-font-sans);font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--lu-encre-sourde);margin-bottom:6px}

/* =========================================================================
   17. LISTES DE RUBRIQUE / ARCHIVE / RECHERCHE — denses, filets fins
   ========================================================================= */
.lu-entete-rubrique{padding-block:28px 16px;border-bottom:1px solid var(--lu-filet)}
.lu-entete-rubrique__nom{font-size:32px}
.lu-liste-rubrique{padding-block:8px 40px}
.lu-liste-rubrique__item{display:flex;gap:20px;padding-block:22px;border-top:1px solid var(--lu-filet)}
.lu-liste-rubrique__item:first-child{border-top:none}
.lu-liste-rubrique__photo{flex:0 0 140px;aspect-ratio:4/3;object-fit:cover}
.lu-liste-rubrique__corps{flex:1;min-width:0}
.lu-liste-rubrique__titre{font-family:var(--lu-font-serif);font-size:21px;line-height:1.2;margin:4px 0 6px}
.lu-liste-rubrique__chapo{font-family:var(--lu-font-sans);font-size:14px;color:var(--lu-encre-sourde);line-height:1.4}
@media (max-width:600px){.lu-liste-rubrique__photo{flex-basis:96px}.lu-liste-rubrique__titre{font-size:18px}}

.lu-pagination{display:flex;gap:10px;justify-content:center;padding-block:24px;font-family:var(--lu-font-sans);font-size:14px}
.lu-pagination a,.lu-pagination span{padding:8px 12px;border:1px solid var(--lu-filet);text-decoration:none;color:var(--lu-encre)}
.lu-pagination .current{background:var(--lu-encre);color:var(--lu-papier);border-color:var(--lu-encre)}

/* =========================================================================
   18. ÉDITION ARCHIVÉE (/edition/AAAA-MM-JJ/) — procédé 7
   ========================================================================= */
.lu-edition-entete{padding-block:32px;border-bottom:3px solid var(--lu-grenat)}
.lu-edition-entete__titre{font-size:32px;margin-bottom:6px}
.lu-edition-entete__ligne{font-family:var(--lu-font-sans);font-size:13px;color:var(--lu-encre-sourde);text-transform:uppercase;letter-spacing:.05em}

/* =========================================================================
   19. PAGE GÉNÉRIQUE / RECHERCHE / 404
   ========================================================================= */
.lu-page{padding-block:8px 48px}
.lu-page__entete{max-width:760px;margin-inline:auto;padding-inline:20px;padding-block:20px 0}
.lu-page__corps{max-width:640px;margin-inline:auto;padding-inline:20px;font-size:17px;line-height:1.62}
.lu-recherche-form{display:flex;gap:10px;max-width:520px;margin:20px auto 0;padding-inline:20px}
.lu-recherche-form input[type="search"]{flex:1;min-height:44px;padding:0 14px;background:var(--lu-feuillet);border:1px solid var(--lu-filet-actif)}
.lu-404{max-width:640px;margin:0 auto;padding:48px 20px;text-align:left}

/* =========================================================================
   20. TABLEAUX — enveloppe posée par le socle (.sbs_tableau), style ici
   ========================================================================= */
.sbs_tableau{overflow-x:auto;margin:1.6em 0;border-top:1px solid var(--lu-filet);border-bottom:1px solid var(--lu-filet)}
.sbs_tableau table{width:100%;border-collapse:collapse;font-family:var(--lu-font-sans);font-size:14px}
.sbs_tableau th,.sbs_tableau td{padding:10px 14px;text-align:left;border-top:1px solid var(--lu-filet);white-space:nowrap}
.sbs_tableau th{font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--lu-encre-sourde)}

/* =========================================================================
   21. FOCUS VISIBLE — accessibilité, pas de suppression d'outline
   ========================================================================= */
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{
  outline:2px solid var(--lu-filet-actif);outline-offset:2px;
}
