*{margin:0;padding:0;box-sizing:border-box}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;line-height:1.7;color:#111;background:#fff}
.css-je7asll{max-width:900px;margin:0 auto;padding:0 28px}
.css-fohea2a{background:#111;color:#fff;padding:64px 0;margin-bottom:48px}
.css-fohea2a h1{font-size:42px;font-weight:800;letter-spacing:-1px;margin-bottom:8px}
.css-fohea2a p{font-size:18px;opacity:.7}
.css-fohea2a a{color:#fff;text-decoration:none;font-size:22px;font-weight:800}
.css-ktbao4o{padding:0}
.css-ddzemzc{padding:32px 0;border-left:4px solid #111;padding-left:24px;margin-bottom:28px}
.css-ddzemzc h2{font-size:24px;font-weight:700;margin-bottom:6px}
.css-ddzemzc h2 a{color:#111;text-decoration:none}
.css-ddzemzc h2 a:hover{text-decoration:underline}
.css-ddzemzc .css-yrho2g1{font-size:12px;font-weight:600;text-transform:uppercase;color:#888;letter-spacing:1px;margin-bottom:8px}
.css-ddzemzc p{font-size:15px;color:#444;margin-bottom:10px}
.css-rnqwfzq{display:inline-block;background:#111;color:#fff;padding:8px 20px;font-size:13px;font-weight:700;text-decoration:none;text-transform:uppercase;letter-spacing:1px}
.css-rnqwfzq:hover{background:#333}
.css-l9pcr70{padding-bottom:60px}
.css-l9pcr70 h1{font-size:38px;font-weight:800;letter-spacing:-1px;margin-bottom:10px}
.css-l9pcr70 time{font-size:12px;font-weight:600;text-transform:uppercase;color:#888;letter-spacing:1px;display:block;margin-bottom:28px}
.css-l9pcr70 h2{font-size:26px;font-weight:700;margin:40px 0 14px}
.css-l9pcr70 h3{font-size:20px;font-weight:700;margin:32px 0 10px}
.css-l9pcr70 p{margin-bottom:18px;font-size:17px}
.css-l9pcr70 ul,.css-l9pcr70 ol{margin:0 0 18px 24px}
.css-l9pcr70 a{color:#111;font-weight:600;text-decoration:underline}
.css-l9pcr70 img{max-width:100%;height:auto;margin:20px 0}
.css-ons7ogv{background:#111;color:#888;padding:28px 0;margin-top:48px;text-align:center;font-size:12px}
.css-ons7ogv a{color:#888;text-decoration:none}
.css-jfkccx0{background:#222;color:#aaa;padding:14px 20px;margin-bottom:24px;font-size:13px;font-style:italic}
.css-1ske2i4{background:#1a1a1a;color:#888;padding:14px 20px;margin-top:32px;font-size:12px;border-top:3px solid #444}
.css-3ifiv3g{font-size:12px;font-weight:600;text-transform:uppercase;color:#666;letter-spacing:1px;margin:-20px 0 28px;padding-left:12px;border-left:2px solid #ccc}
.css-whbu9vj{margin:0 0 24px}
.css-fg6up6j{width:100%;height:auto;border-radius:0}
.css-unqtzvo{border-left:4px solid #111;padding-left:24px;margin-top:48px}
.css-unqtzvo h3{font-size:18px;font-weight:700;text-transform:uppercase;letter-spacing:1px;margin-bottom:12px}
.css-unqtzvo ul{list-style:none;padding:0}
.css-unqtzvo li{padding:6px 0}
.css-unqtzvo a{color:#111;text-decoration:underline;font-weight:600}
.css-pe4id0c{border-left:4px solid #ddd;padding-left:24px;margin-top:36px}
.css-pe4id0c ul{list-style:none;padding:0}
.css-pe4id0c li{padding:6px 0;font-size:16px}
.css-pe4id0c a{color:#111;text-decoration:none;font-weight:600}
.css-pe4id0c a:hover{text-decoration:underline}
.css-pe4id0c .css-yrho2g1{margin:0 0 0 8px}
/* === Theme === */
@import url('https://fonts.googleapis.com/css2?family=Lora:wght@400;500;600;700&family=Playfair+Display:wght@400;700&display=swap');
body{font-family:'Lora',sans-serif;color:#2D2D2D;background:#F9F7F2}
.css-fohea2a{background:#1B3022;color:#fff}
.css-fohea2a h1{font-family:'Playfair Display',serif;color:#fff}
.css-fohea2a p{color:rgba(255,255,255,.75)}
.css-fohea2a a{color:#fff;text-decoration:none}
.card h2{font-family:'Playfair Display',serif}
.card h2 a{color:#1B3022}
.card h2 a:hover{color:#C5A059}
.read-more{color:#C5A059}
.article-content h1{font-family:'Playfair Display',serif}
.article-content h2{font-family:'Playfair Display',serif}
.article-content a{color:#C5A059}
.article-content img{border-radius:4px}
.affiliate-disclosure{border-radius:4px}
.ymyl-disclaimer{border-radius:4px}
/* === Custom === */
/* v.e30827 — layout revision */

/* ==========================================================================
   Carnet du Cavalier — dh-dressage-fr
   Journal d'une cavalière amateur en dressage, près de Saumur (Pauline).
   Editorial rebuild on the "bold" template (flat obfuscated .css-xxxxxx DOM).
   Selectors are ELEMENT + STRUCTURAL only — class names are per-site obfuscated.
   Home    = main:nth-of-type(1):not(:has(> article))  (cards + archive tail)
   Article = main:nth-of-type(1):has(> article)         (hgroup + article + related)
   Palette: ardoise #4D6480 · sable #A9793F/#C09060 · crème #FAF7F1
   Moment color (×2 only): forêt #3D5A47 — hero lettrine + repères accent rule
   ========================================================================== */

/* @import is dropped after concatenation — declare @font-face directly. */
@font-face {
  font-family: 'EB Garamond';
  font-style: italic;
  font-weight: 400 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/ebgaramond/v33/SlGWmQSNjdsmc35JDF1K5GRweDs1Zw.woff2) format('woff2');
}
@font-face {
  font-family: 'EB Garamond';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/ebgaramond/v33/SlGUmQSNjdsmc35JDF1K5GR1SDk.woff2) format('woff2');
}
@font-face {
  font-family: 'Source Serif 4';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/sourceserif4/v14/vEFF2_tTDB4M7-auWDN0ahZJW3IX2ih5nk3AucvUHf6kDXr4.woff2) format('woff2');
}
@font-face {
  font-family: 'Source Serif 4';
  font-style: italic;
  font-weight: 300 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/sourceserif4/v14/vEF02_tTDB4M7-auWDN0ahZJW1ge6NmXpVAHV83Bfb_US2D2QYxoUKIkn98pRl9tDMQC.woff2) format('woff2');
}

:root {
  --primary:    #4D6480;
  --primary-dk: #3A4E65;
  --accent:     #A9793F;   /* deepened sable for AA contrast on cream */
  --accent-lt:  #C09060;
  --moment:     #3D5A47;   /* forêt — used exactly twice */
  --bg:         #FAF7F1;
  --surface:    #FFFDF7;   /* warm off-white, never pure white */
  --surface-2:  #F5EFE3;
  --fg:         #2A2420;
  --muted:      #7A6E62;
  --border:     #E4DBCB;
  --line:       rgba(45,44,40,.10);
  --fd: 'EB Garamond', 'Iowan Old Style', Georgia, serif;      /* display */
  --fb: 'Source Serif 4', Georgia, 'Times New Roman', serif;   /* body */
  --fm: 'Helvetica Neue', -apple-system, 'Segoe UI', Arial, sans-serif; /* meta */
  --shadow: 0 1px 4px rgba(45,60,80,.06);
}

/* --- Base ----------------------------------------------------------------- */

html { font-size: 18px; scroll-behavior: smooth; }

html body {
  font-family: var(--fb);
  font-weight: 400;
  line-height: 1.75;
  color: var(--fg);
  background: var(--bg);
  margin: 0;
}

html body a { color: var(--primary); text-underline-offset: 3px; }
html body a:hover { color: var(--accent); }

::selection { background: rgba(169,121,63,.22); color: var(--fg); }

/* ==========================================================================
   MASTHEAD  (body > div:nth-of-type(1) > div > h1|p|a)  — shared both pages
   ========================================================================== */

body > div:nth-of-type(1) {
  background:
    linear-gradient(150deg, rgba(40,53,66,.86), rgba(40,53,66,.64)),
    url("/theme-assets/cover-photo.jpg") center 42% / cover no-repeat;
  color: #F7F2E8;
  padding: 62px 0 58px;
  margin-bottom: 0;
  border-bottom: 3px solid var(--accent-lt);
}

body > div:nth-of-type(1) > div {
  max-width: 1120px;
  padding: 0 40px;
}

body > div:nth-of-type(1) > div > h1,
body > div:nth-of-type(1) > div > a {
  font-family: var(--fd);
  font-style: italic;
  font-weight: 500;
  letter-spacing: .01em;
  color: #FBF7EE;
  text-decoration: none;
  line-height: 1.06;
}

body > div:nth-of-type(1) > div > h1 { font-size: 52px; margin: 0 0 6px; }
body > div:nth-of-type(1) > div > a  { font-size: 34px; }

/* tagline / manifesto — home only carries the <p> */
body > div:nth-of-type(1) > div > p {
  font-family: var(--fb);
  font-style: italic;
  font-size: 17px;
  line-height: 1.6;
  color: rgba(247,242,232,.86);
  max-width: 46ch;
  margin: 12px 0 0;
  padding-left: 15px;
  border-left: 2px solid var(--accent-lt);
}

/* small standing kicker under the wordmark (home) */
body > div:nth-of-type(1) > div > h1::after {
  content: "JOURNAL DE DRESSAGE · SAUMUR";
  display: block;
  font-family: var(--fm);
  font-style: normal;
  font-weight: 600;
  font-size: 11.5px;
  letter-spacing: .3em;
  color: var(--accent-lt);
  margin-top: 12px;
}

/* ==========================================================================
   HOME GRID
   ========================================================================== */

main:nth-of-type(1):not(:has(> article)) {
  max-width: 1120px;
  margin: 0 auto;
  padding: 78px 40px 40px;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 42px 34px;
  align-items: stretch;
}

/* ---- generic card shell (cards carry an h2) ---- */
main:nth-of-type(1):not(:has(> article)) > div:has(> h2) {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 9px;
  box-shadow: var(--shadow);
  padding: 28px 34px 30px;
  margin: 0;
  display: flex;
  flex-direction: column;
  transition: box-shadow .2s ease, transform .2s ease;
}
main:nth-of-type(1):not(:has(> article)) > div:has(> h2):hover {
  box-shadow: 0 6px 22px rgba(77,100,128,.14);
  transform: translateY(-2px);
}

/* date kicker (first p, .css-yrho2g1) */
main:nth-of-type(1):not(:has(> article)) > div:has(> h2) > p:first-of-type {
  order: -1;
  font-family: var(--fm);
  font-weight: 600;
  font-size: 11.5px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--accent);
  margin: 0 0 12px;
}

main:nth-of-type(1):not(:has(> article)) > div:has(> h2) > h2 {
  font-family: var(--fd);
  font-weight: 600;
  font-size: 23px;
  line-height: 1.18;
  letter-spacing: -.005em;
  color: var(--primary);
  margin: 0 0 12px;
}
main:nth-of-type(1):not(:has(> article)) > div:has(> h2) > h2 a {
  color: inherit;
  text-decoration: none;
}
main:nth-of-type(1):not(:has(> article)) > div:has(> h2) > h2 a:hover { color: var(--accent); }

/* excerpt (second p) — clamped for equal card heights */
main:nth-of-type(1):not(:has(> article)) > div:has(> h2) > p:nth-of-type(2) {
  font-size: 15.5px;
  line-height: 1.62;
  color: var(--fg);
  margin: 0 0 20px;
  max-width: 64ch;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* read-more button (direct child <a>) */
main:nth-of-type(1):not(:has(> article)) > div:has(> h2) > a {
  align-self: flex-start;
  margin-top: auto;
  display: inline-block;
  background: transparent;
  color: var(--primary);
  border: 1.5px solid var(--primary);
  border-radius: 6px;
  padding: 8px 18px;
  font-family: var(--fm);
  font-weight: 600;
  font-size: 12px;
  letter-spacing: .12em;
  text-transform: uppercase;
  text-decoration: none;
  transition: background .18s ease, color .18s ease;
}
main:nth-of-type(1):not(:has(> article)) > div:has(> h2) > a:hover {
  background: var(--primary);
  color: #FBF7EE;
}

/* ---- HERO : card 1 ------------------------------------------------------- */
main:nth-of-type(1):not(:has(> article)) > div:nth-of-type(1) {
  grid-column: 1 / -1;
  position: relative;
  align-items: center;
  text-align: center;
  padding: 52px 56px 40px;   /* bottom padding closes the hero frame above the label */
  margin-bottom: 46px;        /* reserves the gap the section-label band sits in */
  background:
    radial-gradient(120% 130% at 50% 0%, #FFFEFA 0%, var(--surface-2) 100%);
  border-color: #E0D4BE;
}
/* "latest" badge */
main:nth-of-type(1):not(:has(> article)) > div:nth-of-type(1)::before {
  content: "DERNIÈRE PAGE DU CARNET";
  font-family: var(--fm);
  font-weight: 600;
  font-size: 11.5px;
  letter-spacing: .28em;
  color: var(--accent);
  margin-bottom: 20px;
}
main:nth-of-type(1):not(:has(> article)) > div:nth-of-type(1) > p:first-of-type {
  order: 0;
  color: var(--muted);
}
main:nth-of-type(1):not(:has(> article)) > div:nth-of-type(1) > h2 {
  font-size: 46px;
  line-height: 1.08;
  font-weight: 600;
  max-width: 16ch;
}
main:nth-of-type(1):not(:has(> article)) > div:nth-of-type(1) > p:nth-of-type(2) {
  font-size: 19px;
  line-height: 1.6;
  -webkit-line-clamp: 4;
  max-width: 56ch;
  margin: 4px auto 26px;
  text-align: left;
}
/* moment color #1 — hero lettrine */
main:nth-of-type(1):not(:has(> article)) > div:nth-of-type(1) > p:nth-of-type(2)::first-letter {
  font-family: var(--fd);
  font-style: italic;
  font-weight: 700;
  font-size: 3.5em;
  line-height: .82;
  float: left;
  margin: 6px 12px 0 0;
  color: var(--moment);
}
main:nth-of-type(1):not(:has(> article)) > div:nth-of-type(1) > a {
  align-self: center;
  margin-bottom: 4px;
  background: var(--primary);
  color: #FBF7EE;
  border-color: var(--primary);
  padding: 11px 26px;
}
main:nth-of-type(1):not(:has(> article)) > div:nth-of-type(1) > a:hover {
  background: var(--primary-dk);
}
/* full-row section label heading the Editor's Picks pair — sits OUTSIDE the
   hero frame, in the reserved gap below it, spanning the full grid row above
   the two pick cards, with a hairline underline. */
main:nth-of-type(1):not(:has(> article)) > div:nth-of-type(1)::after {
  content: "À LIRE EN PREMIER · MES REPÈRES";
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 14px);
  margin: 0;
  padding: 0 2px 12px;
  text-align: left;
  border-bottom: 1px solid var(--line);
  font-family: var(--fm);
  font-weight: 600;
  font-size: 13px;
  letter-spacing: .26em;
  color: var(--accent);
}

/* ---- EDITOR'S PICKS : cards 2 & 3 (paired feature) ---------------------- */
main:nth-of-type(1):not(:has(> article)) > div:nth-of-type(2),
main:nth-of-type(1):not(:has(> article)) > div:nth-of-type(3) {
  grid-column: span 3;
  background: var(--surface-2);
  border-left: 3px solid var(--moment);   /* moment color #2 */
}
main:nth-of-type(1):not(:has(> article)) > div:nth-of-type(2) > h2,
main:nth-of-type(1):not(:has(> article)) > div:nth-of-type(3) > h2 {
  font-size: 26px;
}

/* ---- STRIP 1 + JOURNAL LEAD : card 4 (full width) ----------------------- */
main:nth-of-type(1):not(:has(> article)) > div:nth-of-type(4) {
  grid-column: 1 / -1;
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 0 44px;
  align-items: center;
  text-align: center;
}
main:nth-of-type(1):not(:has(> article)) > div:nth-of-type(4):hover {
  box-shadow: none;
  transform: none;
}
main:nth-of-type(1):not(:has(> article)) > div:nth-of-type(4)::before {
  content: "PAR ORDRE D'ÉCRITURE";
  display: flex;
  align-self: stretch;   /* escape the card's align-items:center so the strip fills full width, not shrink-to-label */
  align-items: center;
  justify-content: center;
  height: 210px;
  margin: 8px -44px 30px;
  background:
    linear-gradient(rgba(20,24,28,.55), rgba(20,24,28,.25)),
    url("/theme-assets/hero-photo.jpg") center 30% / cover no-repeat;
  color: #FBF7EE;
  font-family: var(--fm);
  font-weight: 600;
  font-size: 13.5px;
  letter-spacing: .32em;
  text-shadow: 0 1px 4px rgba(0,0,0,.5);
}
main:nth-of-type(1):not(:has(> article)) > div:nth-of-type(4) > h2 { font-size: 30px; max-width: 20ch; }
main:nth-of-type(1):not(:has(> article)) > div:nth-of-type(4) > p:nth-of-type(2) {
  max-width: 60ch;
  text-align: left;
  margin-left: auto;
  margin-right: auto;
}
main:nth-of-type(1):not(:has(> article)) > div:nth-of-type(4) > a { align-self: center; }

/* ---- JOURNAL GRID : cards 5..15 (2-across) ------------------------------ */
main:nth-of-type(1):not(:has(> article)) > div:nth-of-type(n+5):has(> h2) {
  grid-column: span 3;
}

/* ---- STRIP 2 + ARCHIVE TAIL : last div (no h2) -------------------------- */
main:nth-of-type(1):not(:has(> article)) > div:last-of-type {
  grid-column: 1 / -1;
  background: transparent;
  border: none;
  padding: 0 44px;
  margin: 0;
}
main:nth-of-type(1):not(:has(> article)) > div:last-of-type::before {
  content: "PLUS D'ARTICLES";
  display: flex;
  align-items: center;
  justify-content: center;
  height: 210px;
  margin: 8px -44px 34px;
  background:
    linear-gradient(rgba(20,24,28,.55), rgba(20,24,28,.25)),
    url("/theme-assets/hero-photo.jpg") center 70% / cover no-repeat;
  color: #FBF7EE;
  font-family: var(--fm);
  font-weight: 600;
  font-size: 13.5px;
  letter-spacing: .32em;
  text-shadow: 0 1px 4px rgba(0,0,0,.5);
}
/* Archive tail = first-class magazine index: boxed cream cards in a 3-col grid,
   same paper/border/radius/shadow/hover system as the top journal cards,
   equal-height cells via grid stretch. */
main:nth-of-type(1):not(:has(> article)) > div:last-of-type > ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px 16px;
}
main:nth-of-type(1):not(:has(> article)) > div:last-of-type li {
  display: flex;
  flex-direction: column;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 9px;
  box-shadow: var(--shadow);
  padding: 18px 20px;
  margin: 0;
  transition: box-shadow .2s ease, transform .2s ease;
}
main:nth-of-type(1):not(:has(> article)) > div:last-of-type li:hover {
  box-shadow: 0 6px 22px rgba(77,100,128,.14);
  transform: translateY(-2px);
}
main:nth-of-type(1):not(:has(> article)) > div:last-of-type li a {
  font-family: var(--fd);
  font-size: 17px;
  line-height: 1.32;
  color: var(--primary);
  text-decoration: none;
  font-weight: 500;
}
main:nth-of-type(1):not(:has(> article)) > div:last-of-type li a:hover { color: var(--accent); }
main:nth-of-type(1):not(:has(> article)) > div:last-of-type li span {
  display: block;
  font-family: var(--fm);
  font-size: 11px;
  letter-spacing: .12em;
  color: var(--muted);
  margin-top: 8px;
}

/* ==========================================================================
   ARTICLE PAGE  (main:nth-of-type(1) > hgroup + article + div[related])
   ========================================================================== */

main:nth-of-type(1):has(> article) {
  max-width: 760px;
  margin: 0 auto;
  padding: 60px 32px 40px;
}

main:nth-of-type(1) > hgroup { margin-bottom: 34px; }
main:nth-of-type(1) > hgroup > h1 {
  font-family: var(--fd);
  font-style: italic;
  font-weight: 600;
  font-size: 44px;
  line-height: 1.12;
  letter-spacing: -.01em;
  color: var(--primary);
  margin: 0 0 14px;
}
main:nth-of-type(1) > hgroup > time {
  display: block;
  font-family: var(--fm);
  font-weight: 600;
  font-size: 12px;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--accent);
}
main:nth-of-type(1) > hgroup > time::before {
  content: "PAR PAULINE · ";
  color: var(--muted);
}

/* lead + inline images */
main:nth-of-type(1) > article img { border-radius: 8px; }
main:nth-of-type(1) > article > section:first-child { margin: 0 0 30px; }

/* body prose */
main:nth-of-type(1) > article > p {
  font-size: 18px;
  line-height: 1.8;
  color: var(--fg);
  margin: 0 0 20px;
}
main:nth-of-type(1) > article > p a {
  color: var(--primary);
  text-decoration: underline;
  text-decoration-color: rgba(169,121,63,.5);
  text-underline-offset: 3px;
  font-weight: 500;
}
main:nth-of-type(1) > article > p a:hover { color: var(--accent); }

/* section headings + dinkus divider */
main:nth-of-type(1) > article > h2 {
  font-family: var(--fd);
  font-weight: 600;
  font-size: 29px;
  line-height: 1.2;
  color: var(--primary);
  margin: 8px 0 16px;
  padding: 0;
  border: none;
}
main:nth-of-type(1) > article > h2::before {
  content: "✳ ✳ ✳";
  display: block;
  text-align: center;
  font-size: 15px;
  letter-spacing: .5em;
  color: var(--accent-lt);
  margin: 44px 0 30px;
}
main:nth-of-type(1) > article > h3 {
  font-family: var(--fd);
  font-style: italic;
  font-weight: 600;
  font-size: 22px;
  color: var(--primary-dk);
  margin: 30px 0 10px;
}

main:nth-of-type(1) > article > ul,
main:nth-of-type(1) > article > ol {
  font-size: 18px;
  line-height: 1.78;
  margin: 0 0 20px 20px;
}
main:nth-of-type(1) > article > ul li,
main:nth-of-type(1) > article > ol li { margin-bottom: 8px; }

/* blockquote — diary aside, hanging quote */
main:nth-of-type(1) > article > blockquote {
  position: relative;
  margin: 30px 0;
  padding: 6px 8px 6px 34px;
  border-left: 3px solid var(--accent-lt);
  font-family: var(--fd);
  font-style: italic;
  font-size: 21px;
  line-height: 1.5;
  color: var(--primary-dk);
}
main:nth-of-type(1) > article > blockquote::before {
  content: "\201C";
  position: absolute;
  left: 2px;
  top: 8px;
  font-family: var(--fd);
  font-size: 34px;
  line-height: 1;
  color: var(--accent-lt);
}

/* editorial tables (Skala, lexique, dimensions) */
main:nth-of-type(1) > article table {
  width: 100%;
  border-collapse: collapse;
  margin: 24px 0;
  font-size: 15.5px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
  overflow: hidden;
}
main:nth-of-type(1) > article table th {
  background: var(--primary);
  color: #FBF7EE;
  font-family: var(--fm);
  font-weight: 600;
  font-size: 12.5px;
  letter-spacing: .06em;
  text-transform: uppercase;
  text-align: left;
  padding: 11px 16px;
}
main:nth-of-type(1) > article table td {
  padding: 11px 16px;
  border-top: 1px solid var(--border);
}
main:nth-of-type(1) > article table tr:nth-child(even) td { background: var(--surface-2); }

/* disclaimer callout (last block of article, dark by default) */
main:nth-of-type(1) > article > div:last-child {
  background: var(--surface-2);
  color: var(--muted);
  border: none;
  border-left: 3px solid var(--accent-lt);
  border-radius: 0 6px 6px 0;
  padding: 16px 22px;
  margin-top: 40px;
  font-size: 14px;
  line-height: 1.6;
}
main:nth-of-type(1) > article > div:last-child strong {
  display: block;
  font-family: var(--fm);
  font-weight: 700;
  font-size: 11.5px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--primary);
  margin-bottom: 5px;
}

/* related-articles block */
main:nth-of-type(1) > article + div {
  margin-top: 52px;
  padding: 28px 32px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-left: 3px solid var(--primary);
  border-radius: 8px;
}
main:nth-of-type(1) > article + div h3 {
  font-family: var(--fm);
  font-weight: 700;
  font-size: 13px;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--accent);
  margin: 0 0 14px;
}
main:nth-of-type(1) > article + div ul { list-style: none; padding: 0; margin: 0; }
main:nth-of-type(1) > article + div li {
  padding: 9px 0;
  border-bottom: 1px dotted rgba(45,44,40,.14);
}
main:nth-of-type(1) > article + div li:last-child { border-bottom: none; }
main:nth-of-type(1) > article + div li a {
  font-family: var(--fd);
  font-size: 18px;
  font-weight: 500;
  color: var(--primary);
  text-decoration: none;
}
main:nth-of-type(1) > article + div li a:hover { color: var(--accent); }

/* ==========================================================================
   FOOTER
   ========================================================================== */

body > footer {
  background: var(--primary-dk);
  color: rgba(247,242,232,.72);
  padding: 34px 0;
  margin-top: 72px;
  text-align: center;
  font-family: var(--fm);
  font-size: 13px;
  letter-spacing: .04em;
}
body > footer > div { max-width: 1120px; padding: 0 40px; }
body > footer a { color: rgba(247,242,232,.9); text-decoration: none; }
body > footer a:hover { color: #FFFFFF; }

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */

@media (max-width: 860px) {
  main:nth-of-type(1):not(:has(> article)) { gap: 30px; padding: 52px 26px 32px; }
  main:nth-of-type(1):not(:has(> article)) > div:nth-of-type(2),
  main:nth-of-type(1):not(:has(> article)) > div:nth-of-type(3),
  main:nth-of-type(1):not(:has(> article)) > div:nth-of-type(n+5):has(> h2) {
    grid-column: 1 / -1;
  }
  main:nth-of-type(1):not(:has(> article)) > div:last-of-type > ul { grid-template-columns: repeat(2, 1fr); }
  body > div:nth-of-type(1) > div > h1 { font-size: 40px; }
  main:nth-of-type(1):not(:has(> article)) > div:nth-of-type(1) > h2 { font-size: 36px; }
}

@media (max-width: 560px) {
  html { font-size: 16px; }
  body > div:nth-of-type(1) { padding: 44px 0 40px; }
  body > div:nth-of-type(1) > div,
  body > footer > div { padding: 0 22px; }
  body > div:nth-of-type(1) > div > h1 { font-size: 33px; }
  main:nth-of-type(1):not(:has(> article)) { padding: 40px 20px 28px; }
  main:nth-of-type(1):not(:has(> article)) > div:has(> h2) { padding: 24px 24px 26px; }
  main:nth-of-type(1):not(:has(> article)) > div:nth-of-type(1) { padding: 40px 24px 36px; }
  main:nth-of-type(1):not(:has(> article)) > div:nth-of-type(1) > h2 { font-size: 30px; }
  main:nth-of-type(1):not(:has(> article)) > div:last-of-type > ul { grid-template-columns: 1fr; }
  main:nth-of-type(1):not(:has(> article)) > div:nth-of-type(4),
  main:nth-of-type(1):not(:has(> article)) > div:last-of-type { padding: 0 24px; }
  main:nth-of-type(1):not(:has(> article)) > div:nth-of-type(4)::before,
  main:nth-of-type(1):not(:has(> article)) > div:last-of-type::before { margin-left: -24px; margin-right: -24px; height: 170px; }
  main:nth-of-type(1):has(> article) { padding: 40px 22px 30px; }
  main:nth-of-type(1) > hgroup > h1 { font-size: 33px; }
  main:nth-of-type(1) > article > h2 { font-size: 25px; }
}


/* related-articles-nav-fix v1 */
:root main > nav p,
:root main > section p {
  line-height: 1.85;
  margin: 0;
}
:root main > nav a,
:root main > section a {
  display: inline-block;
  margin: 0 4px;
  padding: 0 2px;
}


/* mobile-overflow-fix v1 */
:root html, :root body { overflow-x: hidden; max-width: 100%; }
@media (max-width: 920px) {
  :root main > * { max-width: 100%; }
  :root main { overflow-x: hidden; }
}


/* mobile-overflow-fix v2 */
@media (max-width: 640px) {
  :root main,
  :root main > article,
  :root main > div,
  :root main > section,
  :root main > nav {
    box-sizing: border-box;
    max-width: 100%;
    width: 100%;
  }
  :root main > article > *,
  :root main > div > *,
  :root main > section > *,
  :root main > nav > * {
    max-width: 100%;
  }
  :root main h1,
  :root main h2,
  :root main h3,
  :root main h4 {
    overflow-wrap: break-word;
    word-break: normal;
  }
  /* Any 3+ col grid inside main → 1 col on mobile */
  :root main :is(ul, ol, section, div, nav)[style*="grid-template-columns"],
  :root main > section > ul,
  :root main > nav > ul,
  :root main > div > ul {
    grid-template-columns: 1fr !important;
  }
  /* Any CSS multi-column layout → 1 col on mobile */
  :root main :is(ul, ol, section, div, p) {
    columns: 1;
  }
  /* Article body images stay inside viewport */
  :root main img,
  :root main figure {
    max-width: 100%;
    height: auto;
  }
}


/* mobile-padding-fix v1 */
@media (max-width: 640px) {
  :root main {
    padding-left: 20px;
    padding-right: 20px;
  }
}


/* premium-upgrade v1 */
/* premium editorial upgrade — style=Cereal-Nordic overlay=25% grid=equal scale=dramatic family=flat-divs */


/* ── CARD 1: featured full-row with 300px photo header (via card-own background, NOT ::before —
    leaves ::before free for existing site's M2 label / meta content). ── */
:root main:not(:has(> h1)) > div:nth-of-type(1) {
  grid-column: 1 / -1;
  position: relative;      /* anchor for existing site's ::before label if it uses absolute */
  overflow: visible;       /* let above-card labels render without clipping */
  padding: 320px 44px 40px !important;
  border-radius: 8px;
  background:
    url("/theme-assets/premium-hero-card-1.webp") no-repeat center top / 100% 300px,
    var(--bg) !important;
  margin-top: 60px !important;  /* room for above-card M2 label (existing site convention) */
}

/* ── CARDS 2-4: medium with 180px photo header (background technique, ::before untouched) ── */
:root main:not(:has(> h1)) > div:nth-of-type(2) {
  padding: 200px 32px 32px !important;
  border-radius: 8px;
  background:
    url("/theme-assets/premium-hero-card-2.webp") no-repeat center top / 100% 180px,
    var(--bg) !important;
}
:root main:not(:has(> h1)) > div:nth-of-type(3) {
  padding: 200px 32px 32px !important;
  border-radius: 8px;
  background:
    url("/theme-assets/premium-hero-card-3.webp") no-repeat center top / 100% 180px,
    var(--bg) !important;
}
:root main:not(:has(> h1)) > div:nth-of-type(4) {
  padding: 200px 32px 32px !important;
  border-radius: 8px;
  background:
    url("/theme-assets/premium-hero-card-4.webp") no-repeat center top / 100% 180px,
    var(--bg) !important;
}

/* ── flat-divs family: cards 5 & 6 also get photo headers ── */
:root main:not(:has(> h1)) > div:nth-of-type(5) {
  padding: 200px 32px 32px !important;
  border-radius: 8px;
  background:
    url("/theme-assets/premium-hero-strip-1.webp") no-repeat center top / 100% 180px,
    var(--bg) !important;
}
:root main:not(:has(> h1)) > div:nth-of-type(6) {
  padding: 200px 32px 32px !important;
  border-radius: 8px;
  background:
    url("/theme-assets/premium-hero-strip-2.webp") no-repeat center top / 100% 180px,
    var(--bg) !important;
}

/* ── Article page: drop cap + dinkus dividers ── */
:root main:has(> h1) > article > p:first-of-type::first-letter {
  font-family: var(--fh), Georgia, serif;
  font-size: 76px; line-height: 0.9; color: var(--primary);
  float: left; margin: 6px 12px 0 0; padding: 0; font-weight: 400;
}
:root main:has(> h1) > article > h2 + p ~ h2::before {
  content: "✦ ✦ ✦";
  display: block; text-align: center; color: var(--accent);
  font-size: 12px; letter-spacing: 0.3em; margin-bottom: 24px;
  font-weight: 400;
}

/* ── Mobile responsive: adjust photo heights via background-size on the card itself ── */
@media (max-width: 720px) {
  :root main:not(:has(> h1)) > div:nth-of-type(1) {
    padding: 240px 22px 28px !important;
    background:
      url("/theme-assets/premium-hero-card-1.webp") no-repeat center top / 100% 220px,
      var(--bg) !important;
  }
  :root main:not(:has(> h1)) > div:nth-of-type(2) {
    padding: 180px 22px 26px !important;
    background:
      url("/theme-assets/premium-hero-card-2.webp") no-repeat center top / 100% 160px,
      var(--bg) !important;
  }
  :root main:not(:has(> h1)) > div:nth-of-type(3) {
    padding: 180px 22px 26px !important;
    background:
      url("/theme-assets/premium-hero-card-3.webp") no-repeat center top / 100% 160px,
      var(--bg) !important;
  }
  :root main:not(:has(> h1)) > div:nth-of-type(4) {
    padding: 180px 22px 26px !important;
    background:
      url("/theme-assets/premium-hero-card-4.webp") no-repeat center top / 100% 160px,
      var(--bg) !important;
  }
  :root main:not(:has(> h1))::before,
  :root main:not(:has(> h1))::after { min-height: 240px; }
  :root main:has(> h1) > article > p:first-of-type::first-letter { font-size: 60px; }
}

