*{margin:0;padding:0;box-sizing:border-box}
body{font-family:Georgia,'Times New Roman',serif;line-height:1.8;color:#222;background:#f4f1eb}
.sc-EcUsQm{max-width:1100px;margin:0 auto;padding:0 24px}
.sc-bYUjvd{background:linear-gradient(135deg,#2c3e50,#34495e);color:#fff;padding:48px 0;text-align:center;margin-bottom:48px}
.sc-bYUjvd h1{font-size:36px;letter-spacing:2px;text-transform:uppercase;margin-bottom:6px}
.sc-bYUjvd p{font-size:16px;opacity:.8;font-style:italic}
.sc-bYUjvd .sc-zVtOug{color:#fff;text-decoration:none;font-size:20px;letter-spacing:1px;text-transform:uppercase}
.sc-VvIyht{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:28px}
.sc-OyPAVR{background:#fff;border-radius:4px;box-shadow:0 2px 12px rgba(0,0,0,.08);padding:28px;transition:box-shadow .2s}
.sc-OyPAVR:hover{box-shadow:0 4px 20px rgba(0,0,0,.14)}
.sc-OyPAVR h2{font-size:22px;margin-bottom:10px;line-height:1.3}
.sc-OyPAVR h2 a{color:#2c3e50;text-decoration:none}
.sc-OyPAVR .sc-JmYJwu{font-size:12px;color:#888;margin-bottom:10px;text-transform:uppercase;letter-spacing:1px}
.sc-OyPAVR p{font-size:15px;color:#555;margin-bottom:14px}
.sc-vPlJTr{color:#e74c3c;text-decoration:none;font-weight:700;font-size:13px;text-transform:uppercase;letter-spacing:.5px}
.sc-HVFoyQ{max-width:780px;margin:0 auto;padding:0 24px 60px}
.sc-HVFoyQ h1{font-size:36px;margin-bottom:10px;line-height:1.2}
.sc-HVFoyQ .sc-JmYJwu{font-size:13px;color:#888;display:block;margin-bottom:28px;text-transform:uppercase;letter-spacing:1px}
.sc-HVFoyQ h2{font-size:24px;margin:36px 0 14px}
.sc-HVFoyQ h3{font-size:19px;margin:28px 0 10px}
.sc-HVFoyQ p{margin-bottom:18px;font-size:17px}
.sc-HVFoyQ ul,.sc-HVFoyQ ol{margin:0 0 18px 28px}
.sc-HVFoyQ a{color:#e74c3c}
.sc-HVFoyQ img{max-width:100%;height:auto;border-radius:4px;margin:20px 0}
.sc-BOxVBZ{border-top:2px solid #ddd;padding:28px 0;margin-top:48px;text-align:center;font-size:13px;color:#888}
.sc-BOxVBZ a{color:#888}
.sc-TvlCWC{border-top:1px solid #ccc;border-bottom:1px solid #ccc;padding:14px 0;margin-bottom:28px;font-size:14px;color:#888;font-style:italic;text-align:center}
.sc-JUzodh{background:#f9f3e3;padding:16px 20px;margin-top:28px;font-size:13px;color:#7a6230;border-radius:4px}
.sc-dwGZJX{font-size:11px;color:#888;margin:-22px 0 28px;text-transform:uppercase;letter-spacing:1.5px}
.sc-UCYLtw{margin:0 0 28px}
.sc-iPICCH{width:100%;height:auto;border-radius:4px}
.sc-KeFDIT{border-top:2px solid #ddd;margin-top:40px;padding-top:24px}
.sc-KeFDIT h4{font-size:16px;text-transform:uppercase;letter-spacing:1px;margin-bottom:16px;color:#888}
.mag-related-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.mag-related-item a{color:#2c3e50;text-decoration:none;font-size:15px}
.mag-related-item a:hover{color:#e74c3c}
.sc-MvzPAH{background:#fff;border-radius:4px;box-shadow:0 2px 12px rgba(0,0,0,.08);padding:22px 28px;margin-top:28px}
.sc-MvzPAH p{font-size:15px;padding:4px 0;margin:0}
.sc-MvzPAH .sc-JmYJwu{margin:0 8px 0 0;display:inline}
.sc-MvzPAH a{color:#2c3e50;text-decoration:none}
.sc-MvzPAH a:hover{color:#e74c3c}
/* === Theme === */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Montserrat:wght@400;700&display=swap');
body{font-family:'Inter',sans-serif;color:#1F2937;background:#F9FBFB}
.sc-bYUjvd{background:#2D5A58;color:#fff}
.sc-bYUjvd h1{font-family:'Montserrat',serif;color:#fff}
.sc-bYUjvd p{color:rgba(255,255,255,.75)}
.sc-bYUjvd a{color:#fff;text-decoration:none}
.card h2{font-family:'Montserrat',serif}
.card h2 a{color:#2D5A58}
.card h2 a:hover{color:#FF7E67}
.read-more{color:#FF7E67}
.article-content h1{font-family:'Montserrat',serif}
.article-content h2{font-family:'Montserrat',serif}
.article-content a{color:#FF7E67}
.article-content img{border-radius:12px}
.affiliate-disclosure{border-radius:12px}
.ymyl-disclaimer{border-radius:12px}
/* === Custom === */
/* v.fb1284 — layout revision */
/* zr-quit-fr — « Mon Defi Liberte » — le carnet d'Aurelie, arrêt du tabac, 30 jours.
   Palette : encre de nuit #362B44 + rose fumé #C97064 sur papier chaud #FAF6F2.
   Couleur-moment : vert sauge #3D5A47 (2 usages seulement : lettrine héro + filet manifeste).
   Fontes déclarées en @font-face (l'@import est ignoré : custom.css est concaténé APRÈS
   les règles dans layout.css, donc un @import en tête est droppé par Chromium). */

/* ─── Fontes (woff2 latin, axes variables) ─────────────── */
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/fraunces/v38/6NU78FyLNQOQZAnv9bYEvDiIdE9Ea92uemAk_WBq8U_9v0c2Wa0KxC9TeP2Xz5c.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Fraunces';
  font-style: italic;
  font-weight: 400 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/fraunces/v38/6NU58FyLNQOQZAnv9ZwNjucMHVn85Ni7emAe9lKqZTnbB-gzTK0K1ChjeveQ7ZXk8g.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Karla';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/karla/v33/qkB9XvYC6trAT55ZBi1ueQVIjQTD-JrIH2G7nytkHRyQ8p4wUje6bmMorHA.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ─── Jetons ────────────────────────────────────────────── */
:root {
  --bg:          #FAF6F2;   /* papier chaud, jamais blanc */
  --surface:     #FCF8F4;   /* cartes : crème un ton plus clair */
  --surface-2:   #F1E9E4;   /* aplats discrets, encadrés */
  --ink:         #2A2230;   /* texte, presque noir prune */
  --ink-soft:    #6B5F6E;   /* méta, dates, notes */
  --primary:     #362B44;   /* encre de nuit : masthead, titres */
  --primary-deep:#211A2B;
  --accent:      #C97064;   /* rose fumé : décor, filets */
  --accent-deep: #A8493E;   /* rose brûlé : liens, CTA (contraste papier) */
  --moment:      #3D5A47;   /* sauge : lettrine héro + filet manifeste (×2) */
  --line:        rgba(54,43,68,.14);
  --line-soft:   rgba(54,43,68,.08);
  --serif: 'Fraunces', Georgia, 'Times New Roman', serif;
  --sans:  'Karla', system-ui, -apple-system, sans-serif;
}

/* ─── Base ──────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }

:root body {
  margin: 0;
  font-family: var(--sans);
  font-size: 17px;
  line-height: 1.7;
  color: var(--ink);
  background: var(--bg);
}

:root h1, :root h2, :root h3, :root h4 {
  font-family: var(--serif);
  color: var(--primary);
  line-height: 1.2;
  font-weight: 600;
}

:root a { color: var(--accent-deep); text-decoration-color: rgba(168,73,62,.4); text-underline-offset: 2px; transition: color .18s ease; }
:root a:hover { color: var(--accent); }
:root img { max-width: 100%; height: auto; }

/* Largeur de page : on remplit l'écran à l'accueil, mesure serrée en article */
:root main:not(:has(> article)) { max-width: 1120px; margin: 0 auto; padding: 0 32px 48px; }
:root main:has(> article) { max-width: 760px; margin: 0 auto; padding: 0 24px 60px; }

/* ═══ MASTHEAD (nav = bandeau photo) ════════════════════ */
:root body > nav {
  background-image:
    linear-gradient(rgba(33,26,43,.80), rgba(54,43,68,.62)),
    url("/theme-assets/hero-bg.jpg");
  background-size: cover;
  background-position: center 42%;
  color: #FBF3EF;
  text-align: center;
  margin: 0 0 8px;
  padding: 0;
  border-bottom: 3px solid var(--accent);
}
:root body > nav > div { max-width: 1120px; margin: 0 auto; padding: 56px 32px 52px; }

/* Signature : monogramme « A » gravé au-dessus du titre */
:root body > nav > div::before {
  content: "";
  display: block;
  width: 54px; height: 54px;
  margin: 0 auto 18px;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'><circle cx='32' cy='32' r='30' fill='none' stroke='%23E7CFC8' stroke-width='1.4'/><text x='32' y='44' font-family='Georgia,serif' font-style='italic' font-size='34' fill='%23E7CFC8' text-anchor='middle'>A</text></svg>") center/contain no-repeat;
  opacity: .95;
}

:root body > nav h1 {
  font-family: var(--serif);
  font-style: italic;
  font-weight: 600;
  font-size: clamp(2rem, 4.6vw, 3rem);
  color: #FBF3EF;
  letter-spacing: .01em;
  text-transform: none;
  margin: 0;
}
:root body > nav > div > a {
  font-family: var(--serif);
  font-style: italic;
  font-weight: 600;
  font-size: 1.55rem;
  color: #FBF3EF;
  text-decoration: none;
  letter-spacing: .01em;
  text-transform: none;
}
:root body > nav p {
  margin: 14px auto 0;
  max-width: 54ch;
  font-family: var(--sans);
  font-size: 1rem;
  font-style: normal;
  line-height: 1.6;
  color: rgba(251,243,239,.82);
}
:root body > nav a:hover { color: #fff; }

/* Manifeste : la voix d'Aurelie, filet sauge (moment ×1) — accueil seulement */
:root body > nav > div:has(> h1)::after {
  content: "Ni méthode, ni conseil — juste ce que ça fait, heure par heure.";
  display: block;
  max-width: 44ch;
  margin: 22px auto 0;
  padding-top: 15px;
  border-top: 2px solid var(--moment);
  font-family: var(--serif);
  font-style: italic;
  font-size: 1.02rem;
  color: rgba(251,243,239,.9);
}

/* ═══ ACCUEIL — grille du journal ═══════════════════════ */
:root main:not(:has(> article)) > div:first-of-type {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px 32px;
  margin-top: 24px;
  align-items: stretch;
}

/* ── Carte standard (voix de soutien, calme) ── */
:root main:not(:has(> article)) > div:first-of-type > div {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: 0 1px 4px rgba(54,43,68,.05);
  padding: 28px 34px 30px;
  display: flex;
  flex-direction: column;
  transition: box-shadow .18s ease, transform .18s ease;
}
:root main:not(:has(> article)) > div:first-of-type > div:hover {
  box-shadow: 0 6px 22px rgba(54,43,68,.10);
  transform: translateY(-2px);
}
/* date / surtitre */
:root main:not(:has(> article)) > div:first-of-type > div > p:first-of-type {
  margin: 0 0 12px;
  font-family: var(--sans);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .18em;
  text-transform: uppercase;
  line-height: 1.4;
  color: var(--ink-soft);
}
/* titre */
:root main:not(:has(> article)) > div:first-of-type > div > h2 {
  font-size: 1.3rem;
  font-weight: 600;
  line-height: 1.28;
  margin: 0 0 14px;
}
:root main:not(:has(> article)) > div:first-of-type > div > h2 a { color: var(--primary); text-decoration: none; }
:root main:not(:has(> article)) > div:first-of-type > div > h2 a:hover { color: var(--accent-deep); }
/* extrait (3 lignes max → hauteurs égales) */
:root main:not(:has(> article)) > div:first-of-type > div > h2 + p {
  margin: 0 0 20px;
  font-family: var(--sans);
  font-size: 15.5px;
  line-height: 1.62;
  color: var(--ink-soft);
  max-width: 64ch;
  flex: 1 1 auto;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
/* appel à lire : pastille rose, texte francisé */
:root main:not(:has(> article)) > div:first-of-type > div > a:last-child {
  align-self: flex-start;
  font-size: 0;
  background: transparent;
  border: 1.5px solid var(--accent-deep);
  color: var(--accent-deep);
  border-radius: 22px;
  padding: 8px 18px;
  text-decoration: none;
  transition: background .18s ease, color .18s ease;
}
:root main:not(:has(> article)) > div:first-of-type > div > a:last-child::after {
  content: "Lire l’entrée →";
  font-family: var(--sans);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .06em;
}
:root main:not(:has(> article)) > div:first-of-type > div > a:last-child:hover { background: var(--accent-deep); color: #FCF8F4; }

/* ── HÉRO : carte 1, pleine largeur, la voix forte ── */
:root main:not(:has(> article)) > div:first-of-type > div:nth-child(1) {
  grid-column: 1 / -1;
  padding: 46px 52px 50px;
  position: relative;
}
:root main:not(:has(> article)) > div:first-of-type > div:nth-child(1) > p:first-of-type {
  max-width: 46rem;
  margin: 0 auto 16px;
  color: var(--accent-deep);
  font-weight: 700;
  letter-spacing: .24em;
}
:root main:not(:has(> article)) > div:first-of-type > div:nth-child(1) > p:first-of-type::before { content: "Dernière entrée — "; }
:root main:not(:has(> article)) > div:first-of-type > div:nth-child(1) > p:first-of-type::after { content: " · Journal d’Aurelie"; color: var(--ink-soft); font-weight: 600; }
:root main:not(:has(> article)) > div:first-of-type > div:nth-child(1) > h2 {
  max-width: 46rem;
  margin: 0 auto 18px;
  font-size: clamp(2rem, 3.6vw, 2.7rem);
  font-style: italic;
  font-weight: 600;
  line-height: 1.14;
}
:root main:not(:has(> article)) > div:first-of-type > div:nth-child(1) > h2 + p {
  max-width: 44rem;
  margin: 0 auto 26px;
  font-family: var(--serif);
  font-size: 1.2rem;
  line-height: 1.55;
  color: var(--ink);
  display: block;
  -webkit-line-clamp: none;
  overflow: visible;
}
/* lettrine sauge (moment ×2) */
:root main:not(:has(> article)) > div:first-of-type > div:nth-child(1) > h2 + p::first-letter {
  float: left;
  font-family: var(--serif);
  font-weight: 600;
  font-size: 3.4em;
  line-height: .78;
  padding: 6px 12px 0 0;
  color: var(--moment);
}
:root main:not(:has(> article)) > div:first-of-type > div:nth-child(1) > a:last-child {
  margin: 0 auto 0 0;
  padding: 12px 26px;
  background: var(--accent-deep);
  color: #FCF8F4;
  border-color: var(--accent-deep);
}
:root main:not(:has(> article)) > div:first-of-type > div:nth-child(1) > a:last-child::after { content: "Lire l’entrée →"; font-size: 14px; }

/* ── À LIRE EN PREMIER : carte 2, pleine largeur, étiquette hors cadre ── */
:root main:not(:has(> article)) > div:first-of-type > div:nth-child(2) {
  grid-column: 1 / -1;
  margin-top: 74px;
  position: relative;
  border-left: 3px solid var(--accent);
}
:root main:not(:has(> article)) > div:first-of-type > div:nth-child(2)::before {
  content: "À lire en premier — si tu commences ce soir";
  position: absolute;
  left: 0; right: 0; top: -42px;
  font-family: var(--sans);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--primary);
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}
:root main:not(:has(> article)) > div:first-of-type > div:nth-child(2) > h2 { font-size: 1.5rem; }
:root main:not(:has(> article)) > div:first-of-type > div:nth-child(2) > h2 + p { -webkit-line-clamp: 2; font-size: 1rem; }

/* ── LE CARNET : carte 3, pleine largeur, porte la bande photo Strip 1 ── */
:root main:not(:has(> article)) > div:first-of-type > div:nth-child(3) {
  grid-column: 1 / -1;
  margin-top: 84px;
  padding-top: 0;
  overflow: hidden;
}
:root main:not(:has(> article)) > div:first-of-type > div:nth-child(3)::before {
  content: "Le carnet";
  display: flex;
  align-items: center;
  justify-content: center;
  height: 200px;
  margin: 0 -34px 28px;
  background:
    linear-gradient(rgba(20,24,28,.55), rgba(20,24,28,.25)),
    url("/theme-assets/chapter-cover.jpg");
  background-size: cover;
  background-position: center 30%;
  color: #FBF3EF;
  font-family: var(--sans);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .32em;
  text-transform: uppercase;
  text-shadow: 0 1px 6px rgba(0,0,0,.5);
  border-radius: 8px 8px 0 0;
}
:root main:not(:has(> article)) > div:first-of-type > div:nth-child(3) > h2 { font-size: 1.42rem; }

/* ── QUEUE / ARCHIVE : cartes 12→14, index compact pleine largeur ── */
:root main:not(:has(> article)) > div:first-of-type > div:nth-child(n+12) {
  grid-column: 1 / -1;
  background: transparent;
  border: 0;
  box-shadow: none;
  border-radius: 0;
  padding: 13px 2px;
  border-bottom: 1px dotted rgba(54,43,68,.20);
  transition: none;
}
:root main:not(:has(> article)) > div:first-of-type > div:nth-child(n+12):hover { box-shadow: none; transform: none; }
:root main:not(:has(> article)) > div:first-of-type > div:nth-child(n+12) > p:first-of-type { display: inline; margin: 0 12px 0 0; font-size: 11.5px; color: var(--ink-soft); }
:root main:not(:has(> article)) > div:first-of-type > div:nth-child(n+12) > h2 { display: inline; font-size: 1rem; font-weight: 500; margin: 0; }
:root main:not(:has(> article)) > div:first-of-type > div:nth-child(n+12) > h2 a { color: var(--ink); }
:root main:not(:has(> article)) > div:first-of-type > div:nth-child(n+12) > h2 a:hover { color: var(--accent-deep); }
:root main:not(:has(> article)) > div:first-of-type > div:nth-child(n+12) > h2 + p { display: none; }
:root main:not(:has(> article)) > div:first-of-type > div:nth-child(n+12) > a:last-child { display: none; }

/* Strip 2 : bande photo « CONTINUER LA LECTURE » avant l'archive (carte 12) */
:root main:not(:has(> article)) > div:first-of-type > div:nth-child(12) {
  padding-top: 0;
  margin-top: 84px;
}
:root main:not(:has(> article)) > div:first-of-type > div:nth-child(12)::before {
  content: "Continuer la lecture";
  display: flex;
  align-items: center;
  justify-content: center;
  height: 210px;
  margin: 0 0 30px;
  background:
    linear-gradient(rgba(24,20,26,.58), rgba(24,20,26,.28)),
    url("/theme-assets/chapter-cover.jpg");
  background-size: cover;
  background-position: center 70%;
  color: #FBF3EF;
  font-family: var(--sans);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .32em;
  text-transform: uppercase;
  text-shadow: 0 1px 6px rgba(0,0,0,.5);
  border-radius: 10px;
}

/* ═══ PAGE ARTICLE ══════════════════════════════════════ */
:root main:has(> article) > h1 {
  font-family: var(--serif);
  font-style: italic;
  font-size: clamp(2rem, 4vw, 2.7rem);
  line-height: 1.14;
  margin: 26px 0 10px;
}
:root main:has(> article) > time {
  display: block;
  margin: 0 0 34px;
  font-family: var(--sans);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--ink-soft);
}
:root main:has(> article) > article {
  font-family: var(--serif);
  font-size: 18.5px;
  line-height: 1.8;
  color: var(--ink);
}
:root main:has(> article) > article p { margin: 0 0 1.3em; max-width: none; }
/* lettrine article (encre, pas de couleur-moment ici) */
:root main:has(> article) > article > p:first-of-type::first-letter {
  float: left;
  font-family: var(--serif);
  font-weight: 600;
  font-size: 3.2em;
  line-height: .8;
  padding: 4px 10px 0 0;
  color: var(--primary);
}
:root main:has(> article) > article h2 {
  font-size: 1.55rem;
  margin: 2.2em 0 .5em;
}
/* dinkus décoratif au-dessus de chaque section */
:root main:has(> article) > article h2::before {
  content: "❧ ❧ ❧";
  display: block;
  margin-bottom: .7em;
  font-size: .8rem;
  letter-spacing: .5em;
  color: var(--accent);
  opacity: .7;
}
:root main:has(> article) > article h3 { font-size: 1.25rem; margin: 1.8em 0 .4em; color: var(--primary); }
:root main:has(> article) > article ul,
:root main:has(> article) > article ol { max-width: none; margin: 0 0 1.3em 1.4em; }
:root main:has(> article) > article li { margin-bottom: .4em; line-height: 1.75; }
:root main:has(> article) > article strong { color: var(--primary); }

/* liens du corps : rose brûlé, cohérents partout */
:root main:has(> article) > article a { color: var(--accent-deep); font-weight: 500; text-decoration: underline; text-decoration-color: rgba(168,73,62,.35); text-underline-offset: 2px; }
:root main:has(> article) > article a:hover { color: var(--accent); text-decoration-color: currentColor; }
/* liens affiliés /check/ : INLINE dans le texte → liens forts, jamais des pastilles */
:root main:has(> article) > article a[href^="/check/"] { font-weight: 700; color: var(--accent-deep); text-decoration-color: var(--accent-deep); }
:root main:has(> article) > article a[href^="/check/"]:hover { color: var(--primary); }

/* figures / images d'article */
:root main:has(> article) > article figure { margin: 1.7em 0; }
:root main:has(> article) > article figure img { width: 100%; border-radius: 8px; display: block; margin: 0 auto; }

/* citations : guillemet suspendu */
:root main:has(> article) > article blockquote {
  margin: 1.7em 0;
  padding: 6px 0 6px 28px;
  border-left: 3px solid var(--accent);
  position: relative;
}
:root main:has(> article) > article blockquote p { font-style: italic; margin: 0; color: var(--primary); }
:root main:has(> article) > article blockquote::before {
  content: "«";
  position: absolute;
  left: -3px; top: -14px;
  font-family: var(--serif);
  font-size: 2.4rem;
  color: var(--accent);
  opacity: .5;
}

/* avertissement de bas d'article : papier chaud, discret */
:root main:has(> article) > article > div:last-of-type {
  margin-top: 2.4em;
  padding: 16px 22px;
  background: var(--surface-2);
  border: 1px solid var(--line-soft);
  border-left: 3px solid var(--moment);
  border-radius: 8px;
  font-family: var(--sans);
  font-size: 13.5px;
  line-height: 1.62;
  color: var(--ink-soft);
}
:root main:has(> article) > article > div:last-of-type em { color: var(--primary); font-style: normal; font-weight: 700; }

/* Articles connexes (aside) */
:root main:has(> article) > aside {
  margin-top: 56px;
  padding-top: 28px;
  border-top: 1px solid var(--line);
}
:root main:has(> article) > aside > h4 {
  font-family: var(--sans);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--primary);
  margin: 0 0 16px;
}
:root main:has(> article) > aside a {
  display: block;
  padding: 12px 2px;
  border-bottom: 1px dotted rgba(54,43,68,.20);
  font-family: var(--serif);
  font-size: 16px;
  color: var(--accent-deep);
  text-decoration: none;
}
:root main:has(> article) > aside a:hover { color: var(--accent); }

/* ═══ PIED DE PAGE ══════════════════════════════════════ */
:root body > footer {
  margin-top: 80px;
  border-top: 3px solid var(--accent);
  background: var(--surface-2);
  padding: 30px 24px;
  text-align: center;
  font-family: var(--sans);
  font-size: 13px;
  color: var(--ink-soft);
}
:root body > footer a { color: var(--ink-soft); text-decoration: none; }
:root body > footer a:hover { color: var(--accent-deep); }

/* ═══ RESPONSIVE ════════════════════════════════════════ */
@media (max-width: 720px) {
  :root main:not(:has(> article)) { padding: 0 20px 36px; }
  :root body > nav > div { padding: 44px 20px 40px; }

  :root main:not(:has(> article)) > div:first-of-type { grid-template-columns: 1fr; gap: 30px; }
  :root main:not(:has(> article)) > div:first-of-type > div { padding: 24px; }
  :root main:not(:has(> article)) > div:first-of-type > div:nth-child(1) { padding: 32px 24px 34px; }
  :root main:not(:has(> article)) > div:first-of-type > div:nth-child(1) > h2 { font-size: 1.9rem; }
  :root main:not(:has(> article)) > div:first-of-type > div:nth-child(2) { margin-top: 66px; }
  :root main:not(:has(> article)) > div:first-of-type > div:nth-child(3) { margin-top: 70px; }
  :root main:not(:has(> article)) > div:first-of-type > div:nth-child(3)::before { margin: 0 -24px 24px; }
  :root main:not(:has(> article)) > div:first-of-type > div:nth-child(3)::before,
  :root main:not(:has(> article)) > div:first-of-type > div:nth-child(12)::before { height: 150px; letter-spacing: .26em; }
  :root main:not(:has(> article)) > div:first-of-type > div:nth-child(12) { margin-top: 66px; }

  :root main:has(> article) > article { font-size: 17.5px; }
  :root main:has(> article) > article h2 { font-size: 1.4rem; }
}