*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Palatino Linotype',Palatino,'Book Antiqua',serif;line-height:1.9;color:#2a2a2a;background:#fefefe}
.Sidebar_row__mnR9S{max-width:640px;margin:0 auto;padding:0 20px}
.Main_row__jYDJd{padding:60px 0 40px;border-bottom:1px solid #ccc;margin-bottom:48px}
.Main_row__jYDJd h1{font-size:24px;font-weight:400;letter-spacing:-.5px}
.Main_row__jYDJd p{font-size:14px;color:#777;margin-top:6px;font-style:italic}
.Main_row__jYDJd a{color:#2a2a2a;text-decoration:none;font-size:24px;font-weight:400;letter-spacing:-.5px}
.Card_inner__UWNMF{padding:20px 0}
.Card_inner__UWNMF h2{font-size:18px;font-weight:400;margin-bottom:4px}
.Card_inner__UWNMF h2 a{color:#2a2a2a;text-decoration:none;border-bottom:1px solid transparent}
.Card_inner__UWNMF h2 a:hover{border-bottom-color:#2a2a2a}
.Card_inner__UWNMF .Nav_content__f5JEU{font-size:12px;color:#aaa;margin-bottom:6px}
.Card_inner__UWNMF p{font-size:14px;color:#666}
.Banner_item__ikHur{color:#888;font-size:13px;text-decoration:none}
.Banner_item__ikHur:hover{color:#2a2a2a}
.Page_item__OM8Yl{padding-bottom:60px}
.Page_item__OM8Yl h1{font-size:28px;font-weight:400;margin-bottom:8px}
.Page_item__OM8Yl .Nav_content__f5JEU{font-size:12px;color:#aaa;display:block;margin-bottom:32px}
.Page_item__OM8Yl h2{font-size:21px;font-weight:400;margin:40px 0 12px;border-bottom:1px solid #eee;padding-bottom:6px}
.Page_item__OM8Yl h3{font-size:17px;margin:28px 0 8px}
.Page_item__OM8Yl p{margin-bottom:18px;font-size:16px}
.Page_item__OM8Yl ul,.Page_item__OM8Yl ol{margin:0 0 18px 20px}
.Page_item__OM8Yl a{color:#555;border-bottom:1px solid #ccc}
.Page_item__OM8Yl a:hover{color:#000;border-bottom-color:#000}
.Page_item__OM8Yl img{max-width:100%;height:auto;margin:24px 0}
.Card_area__UWDBn{border-top:1px solid #ddd;padding:20px 0;margin-top:48px;text-align:center;font-size:12px;color:#aaa}
.Card_area__UWDBn a{color:#aaa;text-decoration:none}
.Article_main__QKK2W{padding:0 0 16px;margin-bottom:24px;font-size:12px;color:#aaa;font-style:italic;border-bottom:1px solid #eee}
.Footer_block__x2nE3{padding:16px 0 0;margin-top:32px;font-size:11px;color:#999;border-top:1px solid #eee}
.Section_section__jcM7l{font-size:12px;color:#aaa;margin:-26px 0 32px;font-weight:300}
.Card_item__vE6aT{margin:0 auto 32px;max-width:720px}
.Footer_text__aEQLS{width:100%;height:auto}
.Sidebar_wrapper__GZUTB{margin-top:40px;padding-top:20px;border-top:1px solid #eee;font-size:14px;color:#888}
.Sidebar_wrapper__GZUTB em{color:#aaa}
.Sidebar_wrapper__GZUTB a{color:#555;border-bottom:1px solid #ddd;text-decoration:none}
.Header_wrap__FnADy{padding:24px 0 0;border-top:1px solid #eee;margin-top:24px}
.Header_wrap__FnADy p{padding:3px 0;margin:0;font-size:15px}
.Header_wrap__FnADy a{color:#2a2a2a;text-decoration:none;border-bottom:1px solid transparent}
.Header_wrap__FnADy a:hover{border-bottom-color:#2a2a2a}
/* === Theme === */
:root{--primary:#161620;--accent:#7E4083;--bg:#EDE8DA;--fg:#161620;--border:#C5BEA8;--rust:#B34F2A;--r:3px;--r2:3px;--fb:'Literata';--fh:'Vollkorn';--fm:'Archivo'}
/* === Custom === */
/* v.d62c5e — layout revision */
/* Mamas Nervenkost — Sonntagabend-Tagebuch. Editorial pass.
   Display: Vollkorn italic (--fh) · Body: Literata (--fb) · Meta: Archivo (--fm)
   — all three loaded by the deployed theme.css @font-face.
   Moment colour rust #B34F2A (--rust) used exactly ×2: masthead signature rule + article drop cap.
   Home main = 12 card <div>s (each has > h2) + a 13th archive-wall <div> (only > p > a).
   Scope: home layout guarded by main:has(> div > h2); article by main:has(> article). */

:root body { font-family: var(--fb), Georgia, serif; color: var(--fg); background: var(--bg); line-height: 1.74; font-size: 16.5px; -webkit-font-smoothing: antialiased; }
::selection { background: var(--accent); color: #f3ece0; }
:root hr { border: 0; border-top: 1px solid var(--border); margin: 30px 0; }

/* ============================================================= MASTHEAD */
:root header {
  position: relative; text-align: center;
  border: 0; border-bottom: 3px solid var(--accent);
  padding: 58px 26px 46px; margin: 0 0 56px;
  max-width: none; width: 100%; box-sizing: border-box; /* M6 — full-bleed masthead: escape the base-theme row column */
  background-color: #241826;
  background-image: linear-gradient(158deg, rgba(40,26,44,.72), rgba(20,20,32,.86)), url("/theme-assets/backdrop.jpg");
  background-size: cover; background-position: center;
}
/* Signature: the half-drunk cup of cold tea */
:root header::before {
  content: ""; display: block; width: 46px; height: 46px; margin: 0 auto 16px;
  opacity: .92;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48' fill='none' stroke='%23E8DFCB' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21h23v7a11.5 11.5 0 0 1-23 0z'/%3E%3Cpath d='M32 22h4.5a5 5 0 0 1 0 10H33'/%3E%3Cpath d='M15 7c-2 3 2 4.5 0 8'/%3E%3Cpath d='M22 6c-2 3 2 4.5 0 8'/%3E%3Cpath d='M29 7c-2 3 2 4.5 0 8'/%3E%3C/svg%3E") center/contain no-repeat;
}
:root header h1 {
  font-family: var(--fh), Georgia, serif; font-style: italic; font-weight: 600;
  font-size: 44px; line-height: 1.08; color: #f2ead9; letter-spacing: 0;
}
:root header h1::after { content: ""; display: block; width: 54px; height: 3px; background: var(--rust); margin: 16px auto 0; } /* rust ×1 of 2 */
:root header h1 + p {
  font-family: var(--fb), Georgia, serif; font-style: italic; font-weight: 400;
  font-size: 14.5px; line-height: 1.58; color: rgba(242,234,217,.82);
  max-width: 54ch; margin: 16px auto 0; opacity: 1;
}
:root header a { font-family: var(--fh), Georgia, serif; color: #f2ead9; text-decoration: none; font-weight: 600; }
/* M6 — keep the wordmark anchored to a reading measure now that the band is full-bleed (main stays constrained) */
:root header h1 { max-width: 760px; margin-left: auto; margin-right: auto; }

/* ================================================== HOME — GRID SCAFFOLD */
:root main { padding-bottom: 88px; }
:root main:has(> div > h2) {
  display: grid; grid-template-columns: 1fr 1fr; gap: 34px 30px; align-items: stretch;
}

/* EP section label — full-width, sits ABOVE the picks row (parent ::before, not a card) */
:root main:has(> div > h2)::before {
  content: "Redaktionsauswahl · zuerst lesen"; grid-column: 1 / -1; order: 2;
  margin: 30px 0 2px; padding: 0 2px 12px;
  font-family: var(--fm), system-ui, sans-serif; font-size: 14px; font-weight: 600;
  letter-spacing: .22em; text-transform: uppercase; color: var(--accent);
  border-bottom: 1px solid rgba(22,22,32,.14);
}

/* STRIP 1 — "WEITER UNTEN" band between picks and the journal */
:root main:has(> div > h2)::after {
  content: "Weiter unten"; grid-column: 1 / -1; order: 4;
  display: flex; align-items: center; justify-content: center;
  min-height: 194px; margin: 22px 0 8px; border-radius: 8px;
  font-family: var(--fm), system-ui, sans-serif; font-size: 13px; font-weight: 600;
  letter-spacing: .32em; text-transform: uppercase; color: #f3ece0; text-shadow: 0 1px 6px rgba(0,0,0,.5);
  background-color: #33223a;
  background-image: linear-gradient(rgba(20,24,28,.55), rgba(20,24,28,.28)), url("/theme-assets/article-hero.jpg");
  background-size: cover; background-position: center 30%;
}

/* ---------------------------------------------------- Featured (card 1) */
:root main:has(> div > h2) > div:first-of-type {
  grid-column: 1 / -1; order: 1; display: block;
  background: #f7f0e2; border: 1px solid rgba(22,22,32,.1); border-radius: 10px;
  box-shadow: 0 2px 10px rgba(22,22,32,.06); padding: 44px 48px 40px;
}
:root main:has(> div > h2) > div:first-of-type > p:first-child { color: var(--accent); font-size: 12px; letter-spacing: .2em; margin-bottom: 16px; }
:root main:has(> div > h2) > div:first-of-type > h2 { font-size: 40px; font-style: italic; line-height: 1.1; margin: 0 0 16px; }
:root main:has(> div > h2) > div:first-of-type > p:not(:first-child) {
  display: block; overflow: visible; font-size: 20px; line-height: 1.5;
  color: rgba(22,22,32,.86); max-width: 60ch; margin: 0 0 24px;
}
:root main:has(> div > h2) > div:first-of-type > a:last-child::before {
  content: "Weiterlesen \2192"; display: inline-block;
  border: 1.5px solid var(--accent); color: var(--accent);
  padding: 11px 26px; border-radius: 30px; font-size: 12.5px; letter-spacing: .14em;
}
:root main:has(> div > h2) > div:first-of-type > a:last-child:hover::before { background: var(--accent); color: #f4ecdf; }

/* --------------------------------------------- Shared non-featured cards */
:root main:has(> div > h2) > div:nth-of-type(n+2):has(> h2) {
  background: #faf5ec; border: 1px solid rgba(22,22,32,.09); border-radius: 8px;
  box-shadow: 0 1px 4px rgba(22,22,32,.04); padding: 26px 32px 24px;
  display: flex; flex-direction: column;
}
/* Editor's Picks (cards 2–3): paired feature, accent header rule */
:root main:has(> div > h2) > div:nth-of-type(2),
:root main:has(> div > h2) > div:nth-of-type(3) { order: 3; border-top: 3px solid var(--accent); }
/* Journal (cards 4–12): the chronological grid */
:root main:has(> div > h2) > div:nth-of-type(n+4):has(> h2) { order: 5; }

/* Card interior — shared by featured + picks + journal (featured overrides above win) */
:root main:has(> div > h2) > div:has(> h2) > p:first-child {
  font-family: var(--fm), system-ui, sans-serif; font-size: 11px; font-weight: 600;
  letter-spacing: .16em; text-transform: uppercase; color: var(--accent); margin: 0 0 12px;
}
:root main:has(> div > h2) > div:has(> h2) > h2 { margin: 0 0 12px; font-family: var(--fh), Georgia, serif; font-weight: 600; font-size: 21px; line-height: 1.24; letter-spacing: 0; }
:root main:has(> div > h2) > div:has(> h2) > h2 a { color: var(--primary); text-decoration: none; }
:root main:has(> div > h2) > div:has(> h2) > h2 a:hover { color: var(--accent); }
:root main:has(> div > h2) > div:has(> h2) > p:not(:first-child) {
  font-family: var(--fb), Georgia, serif; font-size: 15.5px; line-height: 1.6;
  color: rgba(22,22,32,.82); margin: 0 0 16px; max-width: 62ch;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
:root main:has(> div > h2) > div:has(> h2) > a:last-child { margin-top: auto; font-size: 0; text-decoration: none; }
:root main:has(> div > h2) > div:has(> h2) > a:last-child::before {
  content: "Weiterlesen \2192"; font-family: var(--fm), system-ui, sans-serif; font-size: 12px;
  font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--accent);
}
:root main:has(> div > h2) > div:has(> h2) > a:last-child:hover::before { color: var(--primary); }

/* --------------------------- Archive wall (13th div) + STRIP 2 header */
:root main:has(> div > h2) > div:last-of-type {
  grid-column: 1 / -1; order: 6; display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px 16px;
  align-items: stretch; padding: 0; margin: 0; border: 0;
}
:root main:has(> div > h2) > div:last-of-type::before {
  content: "Das Archiv"; grid-column: 1 / -1;
  display: flex; align-items: center; justify-content: center;
  min-height: 210px; margin: 22px 0 26px; border-radius: 8px;
  font-family: var(--fm), system-ui, sans-serif; font-size: 13px; font-weight: 600;
  letter-spacing: .32em; text-transform: uppercase; color: #f3ece0; text-shadow: 0 1px 6px rgba(0,0,0,.5);
  background-color: #2a2334;
  background-image: linear-gradient(rgba(24,20,28,.5), rgba(24,20,28,.3)), url("/theme-assets/article-hero.jpg");
  background-size: cover; background-position: center 70%;
}
/* M7 — archive tail = boxed cream cards sharing the journal cards' design system (paper token, border, radius, shadow, hover lift) */
:root main:has(> div > h2) > div:last-of-type > p {
  margin: 0; padding: 18px 20px; break-inside: avoid;
  background: #faf5ec; border: 1px solid rgba(22,22,32,.09); border-radius: 8px;
  box-shadow: 0 1px 4px rgba(22,22,32,.04);
  transition: box-shadow .18s ease, transform .18s ease;
}
:root main:has(> div > h2) > div:last-of-type > p:hover { box-shadow: 0 4px 14px rgba(22,22,32,.09); transform: translateY(-2px); }
:root main:has(> div > h2) > div:last-of-type > p a { display: block; font-family: var(--fh), Georgia, serif; font-weight: 600; font-size: 15px; line-height: 1.34; color: var(--primary); text-decoration: none; }
:root main:has(> div > h2) > div:last-of-type > p a:hover { color: var(--accent); }

/* ============================================================= ARTICLE */
:root main:has(> article) > h1 {
  font-family: var(--fh), Georgia, serif; font-style: italic; font-weight: 600;
  font-size: 40px; line-height: 1.14; color: var(--primary); letter-spacing: -.01em; margin: 6px 0 10px;
}
:root main:has(> article) > span {
  display: block; font-family: var(--fm), system-ui, sans-serif; font-size: 12px; font-weight: 600;
  letter-spacing: .2em; text-transform: uppercase; color: var(--accent); margin-bottom: 24px;
}
:root main:has(> article) > div {
  font-family: var(--fm), system-ui, sans-serif; font-size: 12px; letter-spacing: .06em;
  color: rgba(22,22,32,.55); margin: 0 0 30px; padding: 0 0 16px; border-bottom: 1px dotted var(--border);
}
:root main:has(> article) > div time { font-weight: 600; }
/* S6 — persona anchor: extend the date kicker into a byline/location line (single-author diary site) */
:root main:has(> article) > span::after { content: " · Von Johanna · Dresden-Neustadt"; }

:root main > article > p { margin: 0 0 20px; font-size: 18.5px; line-height: 1.8; }
:root main > article > p:first-of-type::first-letter {
  font-family: var(--fh), Georgia, serif; font-weight: 600; font-size: 58px; line-height: .82;
  float: left; margin: 6px 12px 0 0; color: var(--rust); /* rust ×2 of 2 */
}
:root main > article > h2 {
  font-family: var(--fh), Georgia, serif; font-style: italic; font-weight: 600; font-size: 28px;
  line-height: 1.2; color: var(--primary); margin: 1.6em 0 .5em; padding: 0; border: 0; letter-spacing: 0;
}
:root main > article > h2::before {
  content: "\2737 \2737 \2737"; display: block; text-align: center; font-style: normal;
  font-size: 13px; letter-spacing: .5em; color: var(--accent); opacity: .7; margin: 0 0 .8em -.5em;
}
:root main > article > h3 { font-family: var(--fh), Georgia, serif; font-style: italic; font-weight: 500; font-size: 21px; color: var(--accent); margin: 1.7em 0 .5em; }
:root main > article ul, :root main > article ol { margin: 0 0 20px 24px; }
:root main > article li { margin-bottom: 8px; line-height: 1.72; }

:root main > article blockquote {
  margin: 28px 0; padding: 6px 0 6px 26px; border-left: 3px solid var(--accent); position: relative;
  font-family: var(--fh), Georgia, serif; font-style: italic; font-size: 20px; line-height: 1.5; color: var(--primary);
}
:root main > article blockquote::before { content: "\201C"; position: absolute; left: -3px; top: -8px; font-family: var(--fh), Georgia, serif; font-size: 44px; color: var(--accent); opacity: .4; }

/* Body links */
:root main > article > p a, :root main > article > p a:visited { color: var(--primary); text-decoration: none; border-bottom: 1.5px solid var(--accent); padding-bottom: 1px; font-weight: 500; }
:root main > article > p a:hover { color: var(--accent); border-bottom-color: var(--primary); }

/* Affiliate CTA — inline pill. Attribute raises specificity above the body-link rule (RULE J). */
:root main > article > p a[href^="/get/"], :root main > article > p a[href^="/get/"]:visited,
:root main > article li a[href^="/get/"] {
  display: inline; font-family: var(--fm), system-ui, sans-serif; font-weight: 600; font-size: 14.5px; letter-spacing: .02em;
  color: #f4ecdf; background: var(--accent); border: 0; border-radius: 4px; padding: 3px 12px;
  text-decoration: none; -webkit-box-decoration-break: clone; box-decoration-break: clone;
}
:root main > article > p a[href^="/get/"]:hover, :root main > article li a[href^="/get/"]:hover { background: var(--primary); color: #f4ecdf; }

:root main > article > img { width: 100%; height: auto; display: block; margin: 0 0 28px; border-radius: 8px; box-shadow: 0 3px 14px rgba(22,22,32,.1); }

:root main > article > aside {
  border: 0; border-left: 3px solid var(--accent); background: rgba(126,64,131,.06);
  padding: 12px 18px; margin-top: 32px; font-family: var(--fb), Georgia, serif; font-style: italic;
  font-size: 14px; line-height: 1.6; color: var(--fg);
}
:root main > article > aside b { color: var(--primary); font-weight: 700; font-style: normal; font-size: 11px; letter-spacing: .14em; display: inline-block; margin-right: 8px; font-family: var(--fm), system-ui, sans-serif; text-transform: uppercase; }

/* Verwandte Artikel — styled panel. font-size:0 kills the literal " · " text nodes; children reset. */
:root main > nav {
  margin-top: 54px; padding: 26px 30px 28px; background: #faf5ec;
  border: 1px solid rgba(22,22,32,.1); border-radius: 8px; box-shadow: 0 1px 4px rgba(22,22,32,.04);
}
:root main > nav p { font-size: 0; margin: 0; }
:root main > nav p em { display: block; font-family: var(--fm), system-ui, sans-serif; font-style: normal; font-size: 12px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--accent); margin: 0 0 14px; }
:root main > nav p a { display: block; font-family: var(--fh), Georgia, serif; font-style: italic; font-weight: 500; font-size: 17px; line-height: 1.35; color: var(--primary); text-decoration: none; padding: 10px 0; border-bottom: 1px dotted rgba(22,22,32,.16); }
:root main > nav p a:last-child { border-bottom: 0; }
:root main > nav p a:hover { color: var(--accent); }

/* ============================================================= FOOTER */
:root footer { background: transparent; border-top: 1px solid var(--border); padding: 28px 0 40px; margin-top: 60px; text-align: center; font-family: var(--fm), system-ui, sans-serif; font-size: 12px; color: var(--fg); opacity: .62; letter-spacing: .04em; }
:root footer a { color: var(--fg); text-decoration: none; border-bottom: 1px dotted var(--border); }
:root footer a:hover { color: var(--primary); border-bottom-color: var(--primary); }

/* ============================================================= MOBILE */
@media (max-width: 640px) {
  :root header { padding: 46px 20px 36px; }
  :root header h1 { font-size: 34px; }
  :root main:has(> div > h2) { grid-template-columns: 1fr; gap: 26px; }
  :root main:has(> div > h2) > div:last-of-type { grid-template-columns: 1fr; }
  :root main:has(> div > h2) > div:first-of-type { padding: 30px 24px 28px; }
  :root main:has(> div > h2) > div:first-of-type > h2 { font-size: 29px; }
  :root main:has(> div > h2) > div:first-of-type > p:not(:first-child) { font-size: 18px; }
  :root main:has(> article) > h1 { font-size: 31px; }
  :root main > article > p { font-size: 17.5px; }
}


/* 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=Monocle-Swiss overlay=40% grid=asymmetric 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; }
}