*{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-KccpTw{max-width:1100px;margin:0 auto;padding:0 24px}
.sc-foTFtM{background:linear-gradient(135deg,#2c3e50,#34495e);color:#fff;padding:48px 0;text-align:center;margin-bottom:48px}
.sc-foTFtM h1{font-size:36px;letter-spacing:2px;text-transform:uppercase;margin-bottom:6px}
.sc-foTFtM p{font-size:16px;opacity:.8;font-style:italic}
.sc-foTFtM .sc-fiucHw{color:#fff;text-decoration:none;font-size:20px;letter-spacing:1px;text-transform:uppercase}
.sc-fTKVME{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:28px}
.sc-jmDSVx{background:#fff;border-radius:4px;box-shadow:0 2px 12px rgba(0,0,0,.08);padding:28px;transition:box-shadow .2s}
.sc-jmDSVx:hover{box-shadow:0 4px 20px rgba(0,0,0,.14)}
.sc-jmDSVx h2{font-size:22px;margin-bottom:10px;line-height:1.3}
.sc-jmDSVx h2 a{color:#2c3e50;text-decoration:none}
.sc-jmDSVx .sc-epYNyK{font-size:12px;color:#888;margin-bottom:10px;text-transform:uppercase;letter-spacing:1px}
.sc-jmDSVx p{font-size:15px;color:#555;margin-bottom:14px}
.sc-qBGevF{color:#e74c3c;text-decoration:none;font-weight:700;font-size:13px;text-transform:uppercase;letter-spacing:.5px}
.sc-WSGdCS{max-width:780px;margin:0 auto;padding:0 24px 60px}
.sc-WSGdCS h1{font-size:36px;margin-bottom:10px;line-height:1.2}
.sc-WSGdCS .sc-epYNyK{font-size:13px;color:#888;display:block;margin-bottom:28px;text-transform:uppercase;letter-spacing:1px}
.sc-WSGdCS h2{font-size:24px;margin:36px 0 14px}
.sc-WSGdCS h3{font-size:19px;margin:28px 0 10px}
.sc-WSGdCS p{margin-bottom:18px;font-size:17px}
.sc-WSGdCS ul,.sc-WSGdCS ol{margin:0 0 18px 28px}
.sc-WSGdCS a{color:#e74c3c}
.sc-WSGdCS img{max-width:100%;height:auto;border-radius:4px;margin:20px 0}
.sc-WBXjNu{border-top:2px solid #ddd;padding:28px 0;margin-top:48px;text-align:center;font-size:13px;color:#888}
.sc-WBXjNu a{color:#888}
.sc-STUWMb{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-hiUdHh{background:#f9f3e3;padding:16px 20px;margin-top:28px;font-size:13px;color:#7a6230;border-radius:4px}
.sc-GvnCCx{font-size:11px;color:#888;margin:-22px 0 28px;text-transform:uppercase;letter-spacing:1.5px}
.sc-GfGgcU{margin:0 0 28px}
.sc-AQccxa{width:100%;height:auto;border-radius:4px}
.sc-kySUrc{border-top:2px solid #ddd;margin-top:40px;padding-top:24px}
.sc-kySUrc 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-KhSVQr{background:#fff;border-radius:4px;box-shadow:0 2px 12px rgba(0,0,0,.08);padding:22px 28px;margin-top:28px}
.sc-KhSVQr p{font-size:15px;padding:4px 0;margin:0}
.sc-KhSVQr .sc-epYNyK{margin:0 8px 0 0;display:inline}
.sc-KhSVQr a{color:#2c3e50;text-decoration:none}
.sc-KhSVQr a:hover{color:#e74c3c}
/* === Theme === */
@import url('https://fonts.googleapis.com/css2?family=Lora:wght@400;500;600;700&family=Cormorant+Garamond:wght@400;700&display=swap');
body{font-family:'Lora',sans-serif;color:#2C2C2C;background:#F9F7F2}
.sc-foTFtM{background:#2D4628;color:#fff}
.sc-foTFtM h1{font-family:'Cormorant Garamond',serif;color:#fff}
.sc-foTFtM p{color:rgba(255,255,255,.75)}
.sc-foTFtM a{color:#fff;text-decoration:none}
.card h2{font-family:'Cormorant Garamond',serif}
.card h2 a{color:#2D4628}
.card h2 a:hover{color:#E67E22}
.read-more{color:#E67E22}
.article-content h1{font-family:'Cormorant Garamond',serif}
.article-content h2{font-family:'Cormorant Garamond',serif}
.article-content a{color:#E67E22}
.article-content img{border-radius:8px}
.affiliate-disclosure{border-radius:8px}
.ymyl-disclaimer{border-radius:8px}
/* === Custom === */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,600;0,9..144,700;1,9..144,400&family=Source+Sans+3:wght@400;500;600&display=swap');

/* Design tokens */
:root {
  --color-bg:          #FBF8F3;
  --color-text:        #221C0F;
  --color-heading:     #253818;
  --color-primary:     #5C7A45;
  --color-accent:      #B84D10;
  --color-secondary:   #C9893E;
  --color-surface:     #EEE8DC;
  --color-border:      #CFC4B0;
  --color-muted:       #6B5F4E;
  --color-link:        #B84D10;
  --color-link-hover:  #8C3A0D;
  --color-header-bg:   #253818;
  --color-header-text: #F5EFE6;
  --color-footer-bg:   #1E2C14;
  --color-footer-text: #C8BFB0;
  --font-heading: 'Fraunces', Georgia, serif;
  --font-body:    'Source Sans 3', system-ui, sans-serif;
  --size-base: 17px;
  --lh-body:    1.72;
  --lh-heading: 1.18;
  --max-prose:  68ch;
  --radius:      6px;
  --radius-card: 10px;
  --spacing:     3rem;
  --shadow-card: 0 2px 10px rgba(34, 28, 15, 0.09);
}

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

html {
  font-size: var(--size-base);
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-body);
  font-size: 1rem;
  line-height: var(--lh-body);
  color: var(--color-text);
  background-color: var(--color-bg);
  margin: 0;
  -webkit-font-smoothing: antialiased;
}

/* Headings */
:root h1,
:root h2,
:root h3,
:root h4 {
  font-family: var(--font-heading);
  line-height: var(--lh-heading);
  color: var(--color-heading);
  margin-top: 0;
  font-weight: 700;
}

:root h1 { font-size: 2.45rem; margin-bottom: 0.9rem; }
:root h2 { font-size: 1.8rem;  margin-bottom: 0.75rem; }
:root h3 { font-size: 1.35rem; margin-bottom: 0.6rem; }
:root h4 { font-size: 1.1rem; font-weight: 600; margin-bottom: 0.5rem; }

/* Body text */
:root p {
  margin-top: 0;
  margin-bottom: 1.1rem;
  max-width: var(--max-prose);
}

:root ul,
:root ol {
  margin-top: 0;
  margin-bottom: 1.1rem;
  padding-left: 1.5rem;
  max-width: var(--max-prose);
}

:root li { margin-bottom: 0.45rem; }

:root blockquote {
  margin: 1.75rem 0;
  padding: 1rem 1.4rem;
  border-left: 4px solid var(--color-primary);
  background: var(--color-surface);
  border-radius: 0 var(--radius) var(--radius) 0;
  color: var(--color-muted);
  font-style: italic;
  max-width: var(--max-prose);
}

:root blockquote p { margin-bottom: 0; }

/* Links */
:root a {
  color: var(--color-link);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  transition: color 0.18s ease;
}

:root a:hover { color: var(--color-link-hover); }

/* Images */
:root img {
  max-width: 100%;
  height: auto;
  display: block;
  border-radius: var(--radius);
}

/* Header */
:root .sc-foTFtM {
  background-color: var(--color-header-bg);
  color: var(--color-header-text);
  padding: 2rem 1.5rem 1.75rem;
}

:root .sc-foTFtM h1 {
  font-family: var(--font-heading);
  color: var(--color-header-text);
  font-size: 2rem;
  margin-bottom: 0.4rem;
  letter-spacing: -0.01em;
}

:root .sc-foTFtM p {
  color: rgba(245, 239, 230, 0.72);
  font-size: 0.95rem;
  margin-bottom: 0;
  max-width: none;
}

:root .sc-foTFtM a { color: var(--color-header-text); text-decoration: none; }
:root .sc-foTFtM a:hover { color: var(--color-secondary); }

/* Navigation */
:root .mag-nav,
:root nav {
  background-color: var(--color-primary);
  padding: 0.6rem 1.5rem;
}

:root .mag-nav a,
:root nav a {
  color: #fff;
  text-decoration: none;
  font-size: 0.9rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  padding: 0.35rem 0.6rem;
  border-radius: var(--radius);
  transition: background 0.18s ease;
}

:root .mag-nav a:hover,
:root nav a:hover {
  background-color: rgba(255, 255, 255, 0.15);
  color: #fff;
}

/* Article content */
:root .article-content {
  font-size: 1.06rem;
  line-height: var(--lh-body);
}

:root .article-content h1,
:root .article-content h2,
:root .article-content h3 {
  font-family: var(--font-heading);
  color: var(--color-heading);
}

:root .article-content a { color: var(--color-link); font-weight: 500; }
:root .article-content a:hover { color: var(--color-link-hover); }

:root .article-content img {
  border-radius: var(--radius-card);
  margin: 1.5rem 0;
}

/* Cards */
:root .card {
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-card);
  overflow: hidden;
  box-shadow: var(--shadow-card);
  transition: box-shadow 0.2s ease, transform 0.2s ease;
}

:root .card:hover {
  box-shadow: 0 6px 20px rgba(34, 28, 15, 0.14);
  transform: translateY(-2px);
}

:root .card h2 {
  font-family: var(--font-heading);
  font-size: 1.25rem;
  margin-bottom: 0.4rem;
}

:root .card h2 a { color: var(--color-heading); text-decoration: none; }
:root .card h2 a:hover { color: var(--color-accent); }

:root .card .card-meta,
:root .card .card-date {
  font-size: 0.82rem;
  color: var(--color-muted);
  margin-bottom: 0.5rem;
}

:root .card p { font-size: 0.95rem; color: var(--color-text); margin-bottom: 0.75rem; }

:root .card .read-more {
  color: var(--color-accent);
  font-weight: 600;
  font-size: 0.9rem;
  text-decoration: none;
}

:root .card .read-more:hover { color: var(--color-link-hover); text-decoration: underline; }

/* HR */
:root hr {
  border: none;
  border-top: 2px solid var(--color-border);
  margin: var(--spacing) 0;
}

/* Footer */
:root footer,
:root .sc-WBXjNu {
  background-color: var(--color-footer-bg);
  color: var(--color-footer-text);
  padding: 2rem 1.5rem;
  font-size: 0.88rem;
}

:root footer a,
:root .sc-WBXjNu a {
  color: var(--color-footer-text);
  text-decoration: underline;
  text-decoration-color: rgba(200, 191, 176, 0.4);
}

:root footer a:hover,
:root .sc-WBXjNu a:hover {
  color: #fff;
  text-decoration-color: rgba(255, 255, 255, 0.6);
}

/* Utility */
:root .text-muted { color: var(--color-muted); }

/* Responsive */
@media (max-width: 600px) {
  :root h1 { font-size: 1.9rem; }
  :root h2 { font-size: 1.45rem; }
  :root h3 { font-size: 1.2rem; }
  :root .sc-foTFtM { padding: 1.4rem 1rem 1.2rem; }
  :root .sc-foTFtM h1 { font-size: 1.55rem; }
}

/* === R2 fixes (2026-06-21T00:10:26.937747+00:00) === */

/* Fix 1 — breathing room between lines in long article text */
.bld-content p,
article p {
  line-height: 1.75;
}

/* Fix 2 — H2 section headings need visual separation for scanability */
.bld-content h2,
:root article h2 {
  margin-top: 2.2em;
  margin-bottom: 0.6em;
}

/* Fix 3 — "Continue reading" CTA: sentence-case feels warmer than ALL CAPS */
.sc-qBGevF,
.bld-card-cta,
[class*='ReadMore'],
[class*='Continue'] {
  text-transform: none;
  font-weight: 600;
}

/* Fix 4 — card headline too large; 1.3rem holds in 3 lines in narrow columns */
.sc-jmDSVx h2,
.bld-card h2 {
  font-size: 1.3rem;
  line-height: 1.25;
}

/* === R3 fixes (2026-06-21T00:50:25.985789+00:00) === */

/* Fix R3-1 — article H2 specificity: :root article h2 (0,1,2) beats :root h2 (0,1,1) */
/* (selector updated inline on R2 Fix 2 above — no duplicate rule needed) */

/* Fix R3-2 — card headline size reduced inline on R2 Fix 4 above */

/* Fix R3-3 — "Articles connexes" related links: styled to match site rather than browser defaults */
.mag-related-grid {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  margin-top: 0.6rem;
}

.mag-related-item a {
  display: block;
  padding: 0.45rem 0;
  border-bottom: 1px solid var(--color-border);
  text-decoration: none;
  font-weight: 500;
  color: var(--color-heading);
}

.mag-related-item a:hover {
  color: var(--color-accent);
}

/* Fix 5 — date stamp: slightly more contrast so it's readable without squinting */
.sc-epYNyK,
.bld-card-date {
  font-size: 0.8rem;
  color: #666;
  letter-spacing: 0.02em;
}

/* === R4 fixes (2026-06-21T01:30:20.780123+00:00) === */

/* Fix R4-1 — aside "Articles connexes": visual break after article body */
:root main aside {
  margin-top: 2.5rem;
  padding-top: 1.5rem;
  border-top: 2px solid var(--color-border);
}

/* Fix R4-2 — aside h4 label: small-caps nav label, not article sub-heading */
:root main aside h4 {
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--color-muted);
  margin-bottom: 0.6rem;
  font-weight: 600;
}

/* === QA round-1 fixes (2026-07-29T21:24:40+0800) === */
/* Editorial signature pass. Live build = styled-components (.sc-xxxx); targeted
   only via element+structural selectors with two class-weight units (:root +
   :nth-of-type / :has) to beat the template's (0,2,0) pairs. Top @import is dead
   (rules precede it) -> webfonts declared as @font-face. Theme photos 404 -> no
   masthead image; presence comes from type + a seedling monogram + one rust
   hairline. Rust (#B84D10) is the moment colour, used on home exactly twice:
   masthead hairline + hero drop cap. Card CTAs demoted to quiet forest so rust
   stops reading as default UI. */

@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_9v0c2Wa0KxC9TeA.woff2) format('woff2'); }
@font-face { font-family:'Fraunces'; font-style:italic; font-weight:400 700; font-display:swap;
  src:url(https://fonts.gstatic.com/s/fraunces/v38/6NUs8FyLNQOQZAnv9ZwNjucMHVn85Ni7emAe9lKqZTnbB-gzTK0K1ChJdt9hFwpX9W37ll9_mv0iQg.woff2) format('woff2'); }
@font-face { font-family:'Source Sans 3'; font-style:normal; font-weight:400 600; font-display:swap;
  src:url(https://fonts.gstatic.com/s/sourcesans3/v19/nwpStKy2OAdR1K-IwhWudF-R3w8aZQ.woff2) format('woff2'); }

:root { --rcm-forest:#24371A; --rcm-forest2:#1B2A12; --rcm-quiet:#4E6B39; --rcm-cream:#F4EFE4; }

/* ---- MASTHEAD (shared body > nav) ---- */
:root body > nav:nth-of-type(1) {
  background:
    radial-gradient(120% 140% at 50% -30%, rgba(146,178,120,0.22), transparent 60%),
    linear-gradient(160deg, var(--rcm-forest) 0%, var(--rcm-forest2) 100%);
  padding: 2.9rem 1.5rem 2.4rem; text-align: center;
  border-bottom: 3px solid var(--color-accent); position: relative; margin-bottom: 3rem;
}
:root body > nav:nth-of-type(1) > div::before {
  content:""; display:block; width:40px; height:40px; margin:0 auto 0.55rem; opacity:0.92;
  background:no-repeat center url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 40 40' fill='none' stroke='%23E7DAC0' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 37V17'/%3E%3Cpath d='M20 22C14 22 9 18 8 11 15 11 20 15 20 22Z'/%3E%3Cpath d='M20 18C20 11 25 6 32 6 32 13 27 18 20 18Z'/%3E%3C/svg%3E");
}
:root body > nav:nth-of-type(1) h1,
:root body > nav:nth-of-type(1) > div > a {
  font-family: var(--font-heading); font-style: italic; font-weight: 600;
  text-transform: none; letter-spacing: 0.005em; font-size: clamp(2.1rem, 5vw, 3rem);
  line-height: 1.05; color: #FBF6EC; margin: 0;
}
:root body > nav:nth-of-type(1) > div > a { display: inline-block; text-decoration: none; }
:root body > nav:nth-of-type(1) > div > p {
  font-family: var(--font-heading); font-style: italic; font-weight: 400;
  font-size: 1.02rem; line-height: 1.5; color: rgba(243,233,216,0.82);
  max-width: 48ch; margin: 0.7rem auto 0;
}

/* ---- HOME GRID (main:nth-of-type(1) > div = grid, > div > div = cards) ---- */
:root main:nth-of-type(1) > div { display: grid; grid-template-columns: 1fr; gap: 1.6rem; align-items: start; }
:root main:nth-of-type(1) > div > div {
  background: #FFFDF9; border: 1px solid var(--color-border); border-radius: var(--radius-card);
  box-shadow: var(--shadow-card); padding: 1.5rem 1.5rem 1.35rem;
  transition: box-shadow 0.2s ease, transform 0.2s ease, border-color 0.2s ease;
}
:root main:nth-of-type(1) > div > div:hover { box-shadow: 0 8px 26px rgba(34,28,15,0.15); transform: translateY(-3px); border-color: #B9AE96; }
:root main:nth-of-type(1) > div > div > p:first-child {
  font-family: var(--font-body); font-size: 0.72rem; font-weight: 600; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--color-muted); margin: 0 0 0.55rem;
}
:root main:nth-of-type(1) > div > div > h2 { font-family: var(--font-heading); font-size: 1.32rem; font-weight: 600; line-height: 1.22; margin: 0 0 0.5rem; }
:root main:nth-of-type(1) > div > div > h2 > a { color: var(--color-heading); text-decoration: none; }
:root main:nth-of-type(1) > div > div > h2 > a:hover { color: var(--rcm-quiet); }
:root main:nth-of-type(1) > div > div > p:nth-of-type(2) { font-size: 0.95rem; line-height: 1.6; color: var(--color-text); margin: 0 0 1rem; }
:root main:nth-of-type(1) > div > div > a {
  display: inline-block; font-family: var(--font-body); font-size: 0; color: var(--rcm-quiet);
  font-weight: 600; text-decoration: none; border-bottom: 1px solid transparent;
  transition: color 0.18s ease, border-color 0.18s ease;
}
:root main:nth-of-type(1) > div > div > a::after { content: "Lire la suite →"; font-size: 0.74rem; letter-spacing: 0.12em; text-transform: uppercase; }
:root main:nth-of-type(1) > div > div > a:hover { color: var(--rcm-forest); border-color: var(--rcm-quiet); }

/* ---- HERO = card 1 : the loud voice ---- */
:root main:nth-of-type(1) > div > div:first-child {
  grid-column: 1 / -1; position: relative;
  background: linear-gradient(180deg, #FBF6EC 0%, var(--rcm-cream) 100%);
  border: 1px solid #D8CDB6; border-top: 4px solid var(--rcm-forest); padding: 2.4rem 2rem 2.2rem;
}
:root main:nth-of-type(1) > div > div:first-child:hover { transform: none; }
:root main:nth-of-type(1) > div > div:first-child > p:first-child { margin-bottom: 0.8rem; }
:root main:nth-of-type(1) > div > div:first-child > p:first-child::before {
  content: "À la une"; display: inline-block; background: var(--rcm-forest); color: #F4EFE4;
  font-size: 0.66rem; letter-spacing: 0.16em; padding: 0.25rem 0.6rem; border-radius: 999px;
  margin-right: 0.7rem; vertical-align: 0.05em;
}
:root main:nth-of-type(1) > div > div:first-child > h2 {
  font-size: clamp(1.9rem, 4.4vw, 2.7rem); font-style: italic; font-weight: 600;
  line-height: 1.1; margin-bottom: 0.85rem; max-width: 20ch;
}
:root main:nth-of-type(1) > div > div:first-child > p:nth-of-type(2) { font-size: 1.1rem; line-height: 1.62; color: #3A3222; max-width: 46ch; }
:root main:nth-of-type(1) > div > div:first-child > p:nth-of-type(2)::first-letter {
  font-family: var(--font-heading); font-style: italic; font-weight: 700; font-size: 3.4rem;
  line-height: 0.72; float: left; margin: 0.32rem 0.6rem 0 0; color: var(--color-accent);
}
:root main:nth-of-type(1) > div > div:first-child > a {
  border: 1.5px solid var(--rcm-forest); border-radius: 999px; padding: 0.6rem 1.3rem; margin-top: 1.2rem;
}
:root main:nth-of-type(1) > div > div:first-child > a::after { content: "Lire l’article →"; }
:root main:nth-of-type(1) > div > div:first-child > a:hover { background: var(--rcm-forest); color: #F4EFE4; border-color: var(--rcm-forest); }

@media (min-width: 620px) { :root main:nth-of-type(1) > div { grid-template-columns: 1fr 1fr; } }

@media (min-width: 901px) {
  :root main:nth-of-type(1) > div { grid-template-columns: repeat(3, 1fr); gap: 1.75rem 1.6rem; }
  :root main:nth-of-type(1) > div > div:first-child {
    display: grid; grid-template-columns: 1.65fr 1fr; column-gap: 2.4rem; align-items: center; padding: 2.8rem 2.6rem;
  }
  :root main:nth-of-type(1) > div > div:first-child > p,
  :root main:nth-of-type(1) > div > div:first-child > h2,
  :root main:nth-of-type(1) > div > div:first-child > a { grid-column: 1; }
  :root main:nth-of-type(1) > div > div:first-child::after {
    content: "« On mange du jardin d’avril à novembre — ratés compris. »";
    grid-column: 2; grid-row: 1 / -1; align-self: center; font-family: var(--font-heading);
    font-style: italic; font-weight: 500; font-size: 1.4rem; line-height: 1.4;
    color: var(--rcm-forest); padding-left: 1.8rem; border-left: 2px solid var(--color-accent);
  }
  /* Editor's Picks band = cards 2-4 */
  :root main:nth-of-type(1) > div > div:nth-child(2),
  :root main:nth-of-type(1) > div > div:nth-child(3),
  :root main:nth-of-type(1) > div > div:nth-child(4) { margin-top: 2.6rem; border-top: 3px solid var(--rcm-forest); }
  :root main:nth-of-type(1) > div > div:nth-child(2) { position: relative; }
  :root main:nth-of-type(1) > div > div:nth-child(2)::before {
    content: "Les trois à lire d’abord"; position: absolute; left: 0; bottom: calc(100% + 0.7rem);
    font-family: var(--font-body); font-size: 0.74rem; font-weight: 600; letter-spacing: 0.18em;
    text-transform: uppercase; color: var(--rcm-forest); white-space: nowrap;
  }
  /* Chronological movement = cards 5-7 open the next row */
  :root main:nth-of-type(1) > div > div:nth-child(5),
  :root main:nth-of-type(1) > div > div:nth-child(6),
  :root main:nth-of-type(1) > div > div:nth-child(7) { margin-top: 2.6rem; }
  :root main:nth-of-type(1) > div > div:nth-child(5) { position: relative; }
  :root main:nth-of-type(1) > div > div:nth-child(5)::before {
    content: "Au fil des récoltes"; position: absolute; left: 0; bottom: calc(100% + 0.7rem);
    font-family: var(--font-body); font-size: 0.74rem; font-weight: 600; letter-spacing: 0.18em;
    text-transform: uppercase; color: var(--color-muted); white-space: nowrap;
  }
}

/* ---- ARTICLE PAGE (main:has(> article)) ---- */
:root main:has(> article) > h1 {
  font-family: var(--font-heading); font-size: clamp(2.1rem, 5vw, 3rem); font-weight: 700;
  line-height: 1.12; letter-spacing: -0.01em; margin-bottom: 0.7rem;
}
:root main:has(> article) > time {
  display: block; font-family: var(--font-body); font-size: 0.78rem; font-weight: 600;
  letter-spacing: 0.16em; text-transform: uppercase; color: var(--color-muted); margin-bottom: 2rem;
}
:root main:has(> article) > time::before { content: "Par Pascal · "; color: var(--color-accent); }
:root main:has(> article) > article > h2 { font-family: var(--font-heading); font-weight: 700; font-size: 1.7rem; margin-top: 1rem; }
:root main:has(> article) > article > h2::before {
  content: "✽ ✽ ✽"; display: block; text-align: center; color: var(--color-secondary);
  font-size: 0.85rem; letter-spacing: 0.2em; margin: 2.6rem 0 1.6rem; font-weight: 400;
}
:root main:has(> article) > article > h3 { font-family: var(--font-heading); font-weight: 600; }
:root main:has(> article) > article > blockquote {
  position: relative; border-left: 3px solid var(--color-primary); background: var(--rcm-cream);
  padding: 1.3rem 1.5rem 1.3rem 2.6rem; font-size: 1.12rem;
}
:root main:has(> article) > article > blockquote::before {
  content: "“"; position: absolute; left: 0.7rem; top: 0.2rem; font-family: var(--font-heading);
  font-size: 2.8rem; line-height: 1; color: var(--color-primary); opacity: 0.6;
}
:root main:has(> article) > article p a {
  color: var(--color-link); font-weight: 600; text-decoration: underline;
  text-decoration-thickness: 2px; text-underline-offset: 3px; text-decoration-color: rgba(184,77,16,0.4);
}
:root main:has(> article) > article p a:hover { color: var(--color-link-hover); text-decoration-color: var(--color-link-hover); }
/* Articles connexes -> 2-up card band */
:root main:has(> article) > aside > div { display: grid; grid-template-columns: 1fr 1fr; gap: 0.9rem; }
:root main:has(> article) > aside > div > div {
  background: #FFFDF9; border: 1px solid var(--color-border); border-radius: var(--radius-card);
  transition: box-shadow 0.18s ease, transform 0.18s ease, border-color 0.18s ease;
}
:root main:has(> article) > aside > div > div:hover { box-shadow: var(--shadow-card); transform: translateY(-2px); border-color: #B9AE96; }
:root main:has(> article) > aside > div > div > a {
  display: block; padding: 0.9rem 1rem; font-family: var(--font-heading); font-weight: 600;
  font-size: 1rem; line-height: 1.28; color: var(--color-heading); text-decoration: none;
}
:root main:has(> article) > aside > div > div > a:hover { color: var(--rcm-quiet); }
@media (max-width: 560px) { :root main:has(> article) > aside > div { grid-template-columns: 1fr; } }


/* === QA tail polish (2026-07-30T01:53:39.581701+00:00) — style Lambda [SB-20] compact tail across templates === */
/* The tail wrapper is always the LAST block child of <main> on the homepage,
   containing title-only rows of older articles. Various templates use different
   inner structures (ul>li / p / direct <a>) — this handles all three. */

:root main > *:last-child:not(:has(h2)):not(:has(h1)):not(:has(article)) {
  grid-column: 1 / -1;
  max-width: min(720px, 92vw);
  margin: 88px auto 0;
  padding: 40px 0 32px;
  border-top: 2px double rgba(0, 0, 0, .16);
  background: transparent;
  box-shadow: none;
}

:root main > *:last-child:not(:has(h2)):not(:has(h1)):not(:has(article))::before {
  content: "\2014  MORE FROM THE ARCHIVE  \2014";
  display: block;
  text-align: center;
  font-family: system-ui, -apple-system, sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .28em;
  text-transform: uppercase;
  opacity: .5;
  margin-bottom: 36px;
}

/* Any list / paragraph rows: 2-col on desktop, single on mobile */
:root main > *:last-child ul {
  list-style: none;
  padding: 0;
  margin: 0;
  columns: 2;
  column-gap: 48px;
}
@media (max-width: 899px) {
  :root main > *:last-child ul { columns: 1; }
}

:root main > *:last-child li,
:root main > *:last-child > p,
:root main > *:last-child > a {
  padding: 10px 0;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 15px;
  line-height: 1.4;
  border-bottom: 1px dotted rgba(0, 0, 0, .12);
  break-inside: avoid;
  display: block;
}

:root main > *:last-child li a,
:root main > *:last-child p a,
:root main > *:last-child > a {
  text-decoration: none;
  font-weight: 600;
}

:root main > *:last-child li a:hover,
:root main > *:last-child p a:hover,
:root main > *:last-child > a:hover {
  text-decoration: underline;
}

/* dates (first inline child of li/p) — subtle mono */
:root main > *:last-child p > :first-child,
:root main > *:last-child li > :first-child:not(a) {
  font-family: system-ui, -apple-system, sans-serif;
  font-size: 11px;
  letter-spacing: .1em;
  opacity: .5;
  margin-right: 10px;
}
