/* ============================================================
   Monsieur Lézard : feuille de style du journal
   Préfixe : mlz- · Squelette : journal-deux-col
   Palette : papier crème, vert sapin profond, or, brique
   Aucune ressource externe : polices système uniquement.
   ============================================================ */

:root {
  --mlz-nuit: #0e1f15;
  --mlz-vert: #1d4a30;
  --mlz-vert-doux: #2e6a45;
  --mlz-vert-brume: #e7efe6;
  --mlz-or: #c08a2d;
  --mlz-or-clair: #e0b45c;
  --mlz-papier: #f6f0e2;
  --mlz-papier-2: #efe6d1;
  --mlz-ligne: #ded1b4;
  --mlz-encre: #1d2a20;
  --mlz-gris: #5f6b5f;
  --mlz-brique: #a8492a;
  --mlz-serif: "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, "Times New Roman", serif;
  --mlz-sans: "Avenir Next", Avenir, "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  --mlz-mono: "SF Mono", ui-monospace, Menlo, Consolas, monospace;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body.mlz-page {
  margin: 0;
  background: var(--mlz-papier);
  background-image: linear-gradient(180deg, var(--mlz-papier-2) 0, var(--mlz-papier) 340px);
  color: var(--mlz-encre);
  font-family: var(--mlz-sans);
  font-size: 17px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}

.mlz-page a { color: var(--mlz-vert); text-decoration-thickness: 1px; text-underline-offset: 3px; }
.mlz-page a:hover { color: var(--mlz-brique); }

.mlz-aller-contenu {
  position: absolute; left: -9999px; top: 0;
  background: var(--mlz-nuit); color: var(--mlz-or-clair) !important;
  padding: 10px 16px; z-index: 100;
}
.mlz-aller-contenu:focus { left: 8px; top: 8px; }

.mlz-page :focus-visible { outline: 3px solid var(--mlz-or); outline-offset: 2px; border-radius: 2px; }

img { max-width: 100%; height: auto; }

/* ---------------- entête ---------------- */

.mlz-entete {
  background: var(--mlz-nuit);
  border-bottom: 3px solid var(--mlz-or);
  position: sticky; top: 0; z-index: 50;
}
.mlz-entete-in {
  max-width: 1220px; margin: 0 auto; padding: 10px 24px;
  display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap;
}
.mlz-marque { display: flex; align-items: center; gap: 12px; text-decoration: none; }
.mlz-marque-logo { display: block; width: 44px; height: 44px; }
.mlz-marque-bloc { display: flex; flex-direction: column; line-height: 1.15; }
.mlz-marque-nom {
  font-family: var(--mlz-serif); font-size: 1.55rem; font-weight: 700;
  color: #f4ead2; letter-spacing: .01em;
}
.mlz-marque-slogan {
  font-family: var(--mlz-sans); font-size: .68rem; text-transform: uppercase;
  letter-spacing: .14em; color: var(--mlz-or-clair);
}
.mlz-nav ul { list-style: none; display: flex; flex-wrap: wrap; gap: 4px 18px; margin: 0; padding: 0; }
.mlz-nav a {
  font-size: .8rem; text-transform: uppercase; letter-spacing: .09em;
  color: #d8cdb2; text-decoration: none; padding: 6px 2px; border-bottom: 2px solid transparent;
}
.mlz-nav a:hover { color: var(--mlz-or-clair); border-bottom-color: var(--mlz-or); }
.mlz-nav .mlz-nav-contact { color: var(--mlz-or-clair); }

/* ---------------- conteneur ---------------- */

.mlz-contenu { max-width: 1220px; margin: 0 auto; padding: 0 24px 56px; }

/* ---------------- héros (bande, pas plein écran) ---------------- */

.mlz-heros { position: relative; margin: 22px 0 30px; border-radius: 14px; overflow: hidden; box-shadow: 0 18px 40px rgba(14, 31, 21, .28); }
.mlz-heros-photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.mlz-voile { position: absolute; inset: 0; background: #0e1f15; opacity: .86; }
.mlz-heros-contenu { position: relative; z-index: 2; padding: 34px 38px 30px; max-width: 780px; }
.mlz-heros-sur {
  margin: 0 0 6px; font-size: .74rem; text-transform: uppercase; letter-spacing: .22em;
  color: var(--mlz-or-clair); font-weight: 600;
}
.mlz-heros-titre {
  margin: 0; font-family: var(--mlz-serif); color: #f7efdd;
  font-size: 3.05rem; line-height: 1.04; letter-spacing: .005em;
}
.mlz-heros-sous {
  display: block; margin-top: 8px; font-family: var(--mlz-sans);
  font-size: 1.02rem; font-weight: 500; color: #cfe0c9; letter-spacing: .02em;
}
.mlz-heros-chapo { margin: 14px 0 0; color: #e9e1cc; font-size: 1.02rem; max-width: 62ch; }
.mlz-heros-chapo a { color: var(--mlz-or-clair); }
.mlz-chiffres {
  list-style: none; display: flex; flex-wrap: wrap; gap: 10px 34px;
  margin: 20px 0 0; padding: 14px 0 0; border-top: 1px solid rgba(224, 180, 92, .4);
  color: #d9d0b6; font-size: .88rem;
}
.mlz-chiffres strong { font-family: var(--mlz-serif); font-size: 1.5rem; color: var(--mlz-or-clair); margin-right: 6px; }
.mlz-chiffres a { color: var(--mlz-or-clair); }

/* ---------------- tuiles de rubriques ---------------- */

.mlz-tuiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin: 0 0 40px; }
.mlz-tuile {
  background: #fbf7ec; border: 1px solid var(--mlz-ligne); border-radius: 12px;
  overflow: hidden; transition: transform .18s ease, box-shadow .18s ease;
}
.mlz-tuile:hover { transform: translateY(-3px); box-shadow: 0 12px 26px rgba(29, 74, 48, .16); }
.mlz-tuile-photo { width: 100%; height: 132px; object-fit: cover; display: block; border-bottom: 3px solid var(--mlz-or); }
.mlz-tuile-nom { margin: 12px 14px 4px; font-family: var(--mlz-serif); font-size: 1.22rem; line-height: 1.2; }
.mlz-tuile-nom a { color: var(--mlz-nuit); text-decoration: none; }
.mlz-tuile-nom a:hover { color: var(--mlz-brique); text-decoration: underline; }
.mlz-tuile-accroche { margin: 0 14px 14px; color: var(--mlz-gris); font-size: .88rem; }

/* ---------------- journal deux colonnes ---------------- */

.mlz-journal { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 40px; align-items: start; }

/* flux de l'accueil */
.mlz-flux-titre, .mlz-bloc-titre, .mlz-suite-titre {
  font-family: var(--mlz-serif); font-size: 1.35rem; margin: 0 0 14px; color: var(--mlz-nuit);
  padding-bottom: 8px; border-bottom: 3px double var(--mlz-or);
}
.mlz-entree {
  display: grid; grid-template-columns: 92px 116px 1fr; gap: 16px; align-items: start;
  padding: 18px 0; border-bottom: 1px solid var(--mlz-ligne);
}
.mlz-entree:last-child { border-bottom: none; }
.mlz-entree-date {
  margin: 2px 0 0; font-family: var(--mlz-mono); font-size: .82rem; font-weight: 600;
  color: var(--mlz-vert); background: var(--mlz-vert-brume); border-left: 3px solid var(--mlz-or);
  padding: 5px 7px; border-radius: 0 6px 6px 0; white-space: nowrap;
}
.mlz-entree-vignette { width: 116px; height: 96px; object-fit: cover; border-radius: 8px; display: block; }
.mlz-entree-meta { margin: 0 0 4px; }
.mlz-entree-titre { margin: 0 0 6px; font-family: var(--mlz-serif); font-size: 1.28rem; line-height: 1.25; }
.mlz-entree-titre a { color: var(--mlz-nuit); text-decoration: none; }
.mlz-entree-titre a:hover { color: var(--mlz-brique); }
.mlz-entree-texte { margin: 0; color: #45503f; font-size: .93rem; }

.mlz-puce {
  display: inline-block; font-size: .68rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .1em; color: var(--mlz-brique); background: #f3e2d6;
  border: 1px solid #e0c0ab; padding: 2px 8px; border-radius: 999px;
}

/* annexe (barre latérale) */
.mlz-annexe { position: sticky; top: 86px; display: flex; flex-direction: column; gap: 22px; }
.mlz-bloc { background: #fbf7ec; border: 1px solid var(--mlz-ligne); border-radius: 12px; padding: 18px 18px 16px; }
.mlz-bloc ul { list-style: none; margin: 0; padding: 0; }
.mlz-agenda-item { padding: 10px 0; border-bottom: 1px dashed var(--mlz-ligne); }
.mlz-agenda-item:last-child { border-bottom: none; padding-bottom: 0; }
.mlz-agenda-item strong { font-family: var(--mlz-serif); font-size: 1.02rem; color: var(--mlz-nuit); }
.mlz-agenda-quand { display: block; font-size: .74rem; text-transform: uppercase; letter-spacing: .08em; color: var(--mlz-or); margin: 2px 0 4px; }
.mlz-agenda-item p, .mlz-carnet-item p { margin: 0; font-size: .88rem; color: #45503f; }
.mlz-carnet-item { padding: 10px 0; border-bottom: 1px dashed var(--mlz-ligne); }
.mlz-carnet-item:last-child { border-bottom: none; padding-bottom: 0; }
.mlz-carnet-item strong { font-family: var(--mlz-serif); color: var(--mlz-nuit); font-size: 1rem; }
.mlz-bloc-guide { border-top: 4px solid var(--mlz-or); }
.mlz-bloc-photo { width: 100%; height: 150px; object-fit: cover; border-radius: 8px; display: block; margin-bottom: 10px; }
.mlz-bloc-ecrire { background: var(--mlz-nuit); border-color: var(--mlz-nuit); color: #e7e0ca; }
.mlz-bloc-ecrire .mlz-bloc-titre { color: var(--mlz-or-clair); border-bottom-color: var(--mlz-or); }
.mlz-bloc-ecrire a { color: var(--mlz-or-clair); }

/* ---------------- cartes (rubriques, 404) ---------------- */

.mlz-grille { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; margin-bottom: 26px; }
.mlz-carte {
  background: #fbf7ec; border: 1px solid var(--mlz-ligne); border-radius: 12px; overflow: hidden;
  display: flex; flex-direction: column;
}
.mlz-carte-photo { width: 100%; height: 170px; object-fit: cover; display: block; border-bottom: 3px solid var(--mlz-vert); }
.mlz-carte-corps { padding: 14px 16px 16px; }
.mlz-carte-meta { margin: 0 0 8px; display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.mlz-carte-date { font-family: var(--mlz-mono); font-size: .78rem; color: var(--mlz-gris); }
.mlz-carte-titre { margin: 0 0 6px; font-family: var(--mlz-serif); font-size: 1.24rem; line-height: 1.25; }
.mlz-carte-titre a { color: var(--mlz-nuit); text-decoration: none; }
.mlz-carte-titre a:hover { color: var(--mlz-brique); }
.mlz-carte-texte { margin: 0; color: #45503f; font-size: .92rem; }

/* ---------------- fil d'Ariane ---------------- */

.mlz-ariane { margin: 18px 0 6px; font-size: .8rem; }
.mlz-ariane ol { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; color: var(--mlz-gris); }
.mlz-ariane a { color: var(--mlz-gris); }
.mlz-ariane [aria-current="page"] { color: var(--mlz-encre); font-weight: 600; }
.mlz-ariane-sep { color: var(--mlz-or); }

/* ---------------- pages rubriques ---------------- */

.mlz-rubrique-tete { margin: 14px 0 30px; border-radius: 14px; overflow: hidden; background: var(--mlz-nuit); }
.mlz-rubrique-photo { width: 100%; height: 220px; object-fit: cover; display: block; opacity: .92; border-bottom: 3px solid var(--mlz-or); }
.mlz-rubrique-intro { padding: 22px 30px 26px; }
.mlz-rubrique-intro h1 { margin: 0; font-family: var(--mlz-serif); color: #f6eeda; font-size: 2.2rem; line-height: 1.12; }
.mlz-rubrique-intro .mlz-chapo { color: #ddd4ba; margin: 12px 0 0; max-width: 75ch; }
.mlz-rubrique-fin { font-size: 1rem; color: var(--mlz-gris); border-top: 3px double var(--mlz-or); padding-top: 16px; }
.mlz-carnet-rubrique { margin-bottom: 24px; }

/* ---------------- articles ---------------- */

.mlz-article-tete { max-width: 760px; margin: 26px auto 0; }
.mlz-article-meta { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin: 0 0 12px; }
.mlz-article-date, .mlz-article-lecture { font-size: .8rem; color: var(--mlz-gris); font-family: var(--mlz-mono); }
.mlz-article-tete h1 {
  margin: 0; font-family: var(--mlz-serif); font-size: 2.45rem; line-height: 1.12; color: var(--mlz-nuit);
}
.mlz-chapo { font-family: var(--mlz-serif); font-style: italic; font-size: 1.16rem; line-height: 1.5; color: #3c4a3c; margin: 16px 0 0; }
.mlz-signe { margin: 14px 0 0; font-size: .85rem; color: var(--mlz-gris); }
.mlz-signe a { color: var(--mlz-vert); }

.mlz-fig { margin: 26px auto; max-width: 860px; }
.mlz-fig img { width: 100%; border-radius: 12px; border: 1px solid var(--mlz-ligne); aspect-ratio: 16 / 9; object-fit: cover; }
.mlz-fig-tete img { aspect-ratio: 2 / 1; }
.mlz-fig figcaption { margin-top: 8px; font-size: .84rem; color: var(--mlz-gris); font-style: italic; text-align: center; }

.mlz-texte { max-width: 720px; font-size: 1.06rem; }
.mlz-texte > p:first-of-type::first-letter {
  font-family: var(--mlz-serif); font-size: 3.1em; line-height: .82;
  float: left; padding: 6px 10px 0 0; color: var(--mlz-brique); font-weight: 700;
}
.mlz-texte h2 {
  font-family: var(--mlz-serif); font-size: 1.5rem; color: var(--mlz-nuit);
  margin: 38px 0 12px; padding-left: 14px; border-left: 4px solid var(--mlz-or);
}
.mlz-texte h3 { font-family: var(--mlz-serif); font-size: 1.2rem; margin: 26px 0 8px; color: var(--mlz-vert); }

.mlz-encadre {
  background: var(--mlz-vert-brume); border: 1px solid #c3d6c2; border-left: 5px solid var(--mlz-vert);
  border-radius: 10px; padding: 14px 18px; margin: 26px 0;
}
.mlz-encadre-titre {
  margin: 0 0 6px; font-size: .74rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .16em; color: var(--mlz-vert);
}
.mlz-encadre p { margin: 0; font-family: var(--mlz-serif); font-size: 1.03rem; font-style: italic; }

.mlz-liste { padding-left: 0; list-style: none; margin: 18px 0; }
.mlz-liste li { padding: 8px 0 8px 30px; position: relative; border-bottom: 1px dashed var(--mlz-ligne); }
.mlz-liste li::before { content: "◆"; position: absolute; left: 4px; color: var(--mlz-or); font-size: .7rem; top: 12px; }

.mlz-tableau-wrap { overflow-x: auto; margin: 26px 0; }
.mlz-tableau { border-collapse: collapse; width: 100%; background: #fbf7ec; font-size: .94rem; }
.mlz-tableau caption { caption-side: bottom; font-size: .84rem; color: var(--mlz-gris); font-style: italic; padding-top: 8px; text-align: left; }
.mlz-tableau th { background: var(--mlz-nuit); color: var(--mlz-or-clair); text-align: left; padding: 10px 12px; font-family: var(--mlz-serif); }
.mlz-tableau td { border: 1px solid var(--mlz-ligne); padding: 9px 12px; vertical-align: top; }
.mlz-tableau tr:nth-child(even) td { background: #f2ecdb; }

.mlz-sommaire {
  background: #fbf7ec; border: 1px solid var(--mlz-ligne); border-radius: 12px;
  max-width: 860px; margin: 0 auto 8px; padding: 18px 22px;
}
.mlz-sommaire-titre { font-family: var(--mlz-serif); font-size: 1.15rem; margin: 0 0 8px; color: var(--mlz-nuit); }
.mlz-sommaire ol { margin: 0; padding-left: 22px; columns: 2; column-gap: 34px; }
.mlz-sommaire li { padding: 3px 0; font-size: .93rem; }

.mlz-suite { background: #fbf7ec; border: 1px solid var(--mlz-ligne); border-radius: 12px; padding: 18px; }
.mlz-suite-liste { list-style: none; margin: 0; padding: 0; }
.mlz-suite-liste li { padding: 10px 0; border-bottom: 1px dashed var(--mlz-ligne); }
.mlz-suite-liste li:last-child { border-bottom: none; padding-bottom: 0; }
.mlz-suite-liste a { font-family: var(--mlz-serif); font-size: 1.04rem; }
.mlz-suite-texte { display: block; font-size: .84rem; color: var(--mlz-gris); margin-top: 3px; }

/* ---------------- page introuvable ---------------- */

.mlz-introuvable { max-width: 860px; margin: 40px auto 0; }
.mlz-introuvable h1 { font-family: var(--mlz-serif); font-size: 2.6rem; color: var(--mlz-nuit); margin: 0 0 6px; }
.mlz-introuvable-retour { font-size: 1rem; }
.mlz-article-confiance { max-width: 980px; margin: 0 auto; }

/* ---------------- pied ---------------- */

.mlz-pied { background: var(--mlz-nuit); color: #cfc6ab; margin-top: 30px; border-top: 4px solid var(--mlz-or); }
.mlz-pied-in { max-width: 1220px; margin: 0 auto; padding: 38px 24px 20px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; }
.mlz-pied-bloc h2 {
  font-family: var(--mlz-serif); font-size: 1.05rem; color: var(--mlz-or-clair);
  margin: 0 0 10px; text-transform: uppercase; letter-spacing: .08em;
}
.mlz-pied-bloc ul { list-style: none; margin: 0; padding: 0; }
.mlz-pied-bloc li { padding: 3px 0; font-size: .9rem; }
.mlz-pied a { color: #ddd3b6; }
.mlz-pied a:hover { color: var(--mlz-or-clair); }
.mlz-pied p { font-size: .9rem; margin: 0 0 8px; }
.mlz-pied-flux { font-family: var(--mlz-mono); font-size: .82rem; }
.mlz-pied-note {
  max-width: 1220px; margin: 0 auto; padding: 14px 24px 26px; font-size: .8rem; color: #8f9a8b;
  border-top: 1px solid rgba(192, 138, 45, .3);
}

/* ---------------- titres de cartes : jamais plus de trois lignes ---------------- */

.mlz-carte-titre, .mlz-entree-titre {
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}

/* ---------------- responsive ---------------- */

@media (max-width: 1020px) {
  .mlz-journal { grid-template-columns: 1fr; }
  .mlz-annexe { position: static; }
  .mlz-tuiles { grid-template-columns: repeat(2, 1fr); }
  .mlz-heros-titre { font-size: 2.5rem; }
}

@media (max-width: 640px) {
  body.mlz-page { font-size: 16px; }
  .mlz-entete-in { padding: 10px 16px; }
  .mlz-contenu { padding: 0 16px 40px; }
  .mlz-marque-nom { font-size: 1.25rem; }
  .mlz-marque-logo { width: 36px; height: 36px; }
  .mlz-nav ul { gap: 2px 12px; }
  .mlz-nav a { font-size: .74rem; }
  .mlz-heros { margin: 14px 0 22px; border-radius: 10px; }
  .mlz-heros-contenu { padding: 22px 20px; }
  .mlz-heros-titre { font-size: 1.9rem; }
  .mlz-heros-chapo { font-size: .94rem; }
  .mlz-chiffres { gap: 8px 20px; font-size: .8rem; }
  .mlz-chiffres strong { font-size: 1.2rem; }
  .mlz-tuiles { grid-template-columns: 1fr 1fr; gap: 12px; }
  .mlz-tuile-photo { height: 96px; }
  .mlz-tuile-accroche { display: none; }
  .mlz-tuile-nom { font-size: 1rem; margin: 10px 12px; }
  .mlz-entree { grid-template-columns: 1fr; gap: 8px; }
  .mlz-entree-vignette { width: 100%; height: 150px; }
  .mlz-entree-date { display: inline-block; }
  .mlz-grille { grid-template-columns: 1fr; }
  .mlz-article-tete h1 { font-size: 1.7rem; }
  .mlz-rubrique-intro h1 { font-size: 1.6rem; }
  .mlz-sommaire ol { columns: 1; }
  .mlz-texte > p:first-of-type::first-letter { font-size: 2.6em; }
  .mlz-pied-in { grid-template-columns: 1fr; gap: 20px; padding: 28px 16px 10px; }
}

/* ---------------- impression ---------------- */

@media print {
  .mlz-entete, .mlz-pied, .mlz-annexe, .mlz-heros-photo, .mlz-nav { display: none !important; }
  body.mlz-page { background: #fff; color: #000; }
}
