/* === stephanieselmer.com — style.css ===
   Gleiches System wie The Ownership Speaker und Calendar Butler: Schriften, Abstaende, Groessen, Raender.
   Nur die Akzentfarbe ist eine andere (--accent). Aenderungen an der Farbe: nur im :root-Block. */

/* Schriften, lokal gehostet (kein Abruf bei Google). Lizenz: SIL Open Font License 1.1, siehe fonts/LICENSE.txt */
@font-face { font-family:'Bricolage Grotesque'; font-style:normal; font-weight:200 800; font-stretch:100%; font-display:swap;
  src:url(fonts/bricolage-grotesque-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family:'Bricolage Grotesque'; font-style:normal; font-weight:200 800; font-stretch:100%; font-display:swap;
  src:url(fonts/bricolage-grotesque-latin.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:'Inter'; font-style:normal; font-weight:100 900; font-display:swap;
  src:url(fonts/inter-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family:'Inter'; font-style:normal; font-weight:100 900; font-display:swap;
  src:url(fonts/inter-latin.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; }

:root {
  --ink: #1A1A18;
  --ink-deep: #0E0E0C;
  --accent: #a7356c;        /* Akzentfarbe (bei TOS: Lime, bei Calendar Butler: Orange) */
  --accent-deep: #862a56;   /* Hover, Text auf hellem Grund */
  --accent-100: #f8e9f0;
  --accent-300: #e8b9d0;
  --accent-500: #cb7ba2;
  --pigeon: #A9AFAA;
  --pigeon-deep: #5F655F;
  --off-white: #F7F6F3;
  --white: #FFFFFF;
  --graphite: #2A2A28;

  --max-width: 1160px;
  --content-width: 720px;
  --measure-statement: 38ch;
  --measure-prose: 60ch;

  --font-display: 'Bricolage Grotesque', sans-serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --text-body: 1rem;
  --text-h1: 2.3rem;
  --text-h1-lg: 3.4rem;
  --text-h2: 1.6rem;
  --text-h2-emphasis: 1.9rem;
  --text-h3: 1.15rem;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; font-family:var(--font-body); color:var(--graphite); background:var(--off-white); line-height:1.6; -webkit-font-smoothing:antialiased; }
h1, h2, h3, .serif { font-family:var(--font-display); font-weight:700; color:var(--ink); line-height:1.2; margin:0 0 0.5em; }
img { max-width:100%; display:block; }
a { color:inherit; text-decoration:none; }
.container { max-width:var(--max-width); margin:0 auto; padding:0 24px; }
.container--narrow { max-width:calc(var(--content-width) + 48px); }
.section { padding:64px 0; }
.section--dark { background:var(--ink); color:var(--off-white); }
.section.bg-white { background:#fff; }

/* animiertes Akzentwort in der Ueberschrift (wie bei TOS) */
.o-accent { color:var(--accent); display:inline-block; animation:o-fly-in 1.2s cubic-bezier(0.22,1,0.36,1) 0.45s backwards; }
@keyframes o-fly-in { from { opacity:0; transform:translateY(-60px); } to { opacity:1; transform:translateY(0); } }
@media (prefers-reduced-motion: reduce) { .o-accent { animation:none; } html { scroll-behavior:auto; } }

/* nav: keine Linien, klebt oben, geht in den Seitenhintergrund ueber */
.nav { position:sticky; top:0; background:var(--off-white); z-index:100; }
.nav__inner { display:flex; align-items:center; justify-content:space-between; padding:14px 24px; max-width:var(--max-width); margin:0 auto; gap:16px; }
.nav__brand { display:flex; align-items:center; gap:10px; font-family:var(--font-display); font-size:1.05rem; font-weight:700; letter-spacing:0.01em; color:var(--ink); white-space:nowrap; }
.nav__brand img { height:36px; width:36px; object-fit:contain; flex-shrink:0; }
.footer .footer__logo { height:32px; width:32px; }
.nav__mark { display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; border-radius:50%; background:var(--accent); color:#fff; font-family:var(--font-display); font-weight:700; font-size:1.1rem; line-height:1; }
.nav__links { display:none; align-items:center; gap:26px; font-size:0.92rem; font-weight:500; white-space:nowrap; margin-left:auto; }
.nav__links a:hover { color:var(--accent-deep); }
/* Sprachumschalter (wie bei TOS und Calendar Butler) */
.nav__lang { opacity:0.55; font-size:0.85rem; }
.nav__lang:hover { opacity:1; }
.nav__langs { display:flex; align-items:center; gap:10px; margin-left:6px; }
.nav__flag { position:relative; display:block; width:24px; height:16px; border-radius:2px; overflow:hidden; opacity:0.7; filter:saturate(0.6); transition:opacity .15s; }
.nav__flag svg { display:block; width:100%; height:100%; }
.nav__flag::after { content:""; position:absolute; inset:0; background:rgba(247,246,243,0.22); }
a.nav__flag:hover { opacity:1; }
.nav__flag--current { opacity:0.95; overflow:visible; outline:1.5px solid rgba(26,26,24,0.28); outline-offset:2px; }
.nav__flag--current svg { border-radius:2px; }
.nav__flag--current::after { display:none; }
.nav__flag--inline { display:inline-block; opacity:1; }
.nav__mobile .nav__lang { display:flex; align-items:center; gap:10px; padding:14px 24px; }
.nav__cta { display:none; background:var(--accent); color:#fff; padding:10px 18px; border-radius:2px; font-size:0.85rem; font-weight:600; white-space:nowrap; margin-left:8px; }
.nav__cta:hover { background:var(--accent-deep); }
.nav__toggle { margin-left:auto; background:none; border:none; font-size:1.6rem; color:var(--ink); cursor:pointer; padding:4px 8px; }
.nav__mobile { display:none; flex-direction:column; }
.nav__mobile.is-open { display:flex; box-shadow:0 6px 16px rgba(26,26,24,0.08); }
.nav__mobile a { padding:14px 24px; font-size:1rem; }
.nav__mobile .nav__cta { display:block; margin:16px 24px; text-align:center; color:#fff; }
@media (min-width:800px) {
  .nav__links { display:flex; }
  .nav__cta { display:inline-block; }
  .nav__toggle { display:none; }
  .nav__mobile { display:none !important; }
}

/* hero */
.hero { padding-top:48px; padding-bottom:56px; }
.hero__inner { display:grid; gap:32px; }
.hero__eyebrow { text-transform:uppercase; letter-spacing:0.12em; font-size:0.75rem; color:var(--pigeon-deep); font-weight:600; margin:0 0 24px; }
.hero h1 { font-size:var(--text-h1); margin-bottom:28px; letter-spacing:-0.01em; }
.hero p { font-size:var(--text-body); max-width:var(--measure-prose); margin:0 0 20px; }
.hero__photo img { width:100%; height:auto; max-width:440px; aspect-ratio:4/3; object-fit:cover; object-position:50% 20%; border-radius:4px; }
@media (min-width:900px) {
  .hero__inner { grid-template-columns:minmax(0,1fr) minmax(0,440px); gap:48px; align-items:center; }
  .hero h1 { font-size:var(--text-h1-lg); }
  .hero__photo img { margin-left:auto; }
}

/* Zeile mit den Angebotslinks */
.offers { display:flex; flex-wrap:wrap; align-items:baseline; gap:8px 28px; margin-top:32px; }
.offers__label { text-transform:uppercase; letter-spacing:0.12em; font-size:0.72rem; font-weight:600; color:var(--pigeon-deep); }
.offers a { font-weight:600; font-size:0.95rem; color:var(--ink); text-decoration:underline; text-decoration-color:var(--accent); text-decoration-thickness:0.18em; text-underline-offset:0.2em; }
.offers a::after { content:" \2192"; color:var(--accent); }
.offers a:hover { color:var(--accent-deep); }

.btn { display:inline-block; padding:14px 24px; font-size:0.92rem; border-radius:2px; font-weight:600; }
.btn--primary { background:var(--accent); color:#fff; }
.btn--primary:hover { background:var(--accent-deep); }
.btn--outline { border:1.5px solid var(--ink); color:var(--ink); }

/* Beitraege: Karten in drei Spalten */
.posts h2 { font-size:var(--text-h2); margin-bottom:28px; }
.post-grid { display:grid; gap:18px; grid-template-columns:1fr; }
@media (min-width:640px) { .post-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (min-width:960px) { .post-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; } }
.post-card { background:var(--white); border:1.5px solid var(--pigeon); border-radius:3px; overflow:hidden; display:flex; flex-direction:column; transition:border-color .15s; }
.post-card:hover, .post-card:focus-within { border-color:var(--accent); }
.post-card[hidden] { display:none; }
.post-card__media { aspect-ratio:3/2; background:var(--accent-100); display:flex; align-items:center; justify-content:center; overflow:hidden; }
.post-card__media img { width:100%; height:100%; object-fit:cover; }
.post-card__word { font-family:var(--font-display); font-weight:700; font-size:2.2rem; line-height:1.1; color:var(--accent); text-align:center; padding:0 1rem; overflow-wrap:anywhere; }
.post-card__initial { font-family:var(--font-display); font-weight:700; font-size:4rem; line-height:1; color:var(--accent); }
.post-card__body { padding:20px; display:flex; flex-direction:column; gap:8px; flex-grow:1; }
.post-card__date { margin:0; text-transform:uppercase; letter-spacing:0.08em; font-size:0.72rem; font-weight:700; color:var(--pigeon-deep); }
.post-card__body h3 { font-size:var(--text-h3); margin:0; }
.post-card__link::after { content:""; position:absolute; inset:0; }   /* ganze Karte klickbar */
.post-card { position:relative; }
.post-card__link:focus-visible { outline:2px solid var(--accent); outline-offset:4px; }
.tag-filter { margin:0 0 20px; font-size:0.9rem; color:var(--pigeon-deep); }
.tag-filter[hidden] { display:none; }
.tag-filter strong { color:var(--ink); background:var(--accent-100); padding:4px 10px; border-radius:20px; font-size:0.78rem; margin:0 4px; }
.tag-filter button { background:none; border:0; padding:2px 8px; font-size:1.2rem; line-height:1; color:var(--accent-deep); cursor:pointer; vertical-align:middle; }
.tag-filter button:hover { color:var(--ink); }
.post-more { display:flex; justify-content:center; margin-top:32px; }
.post-more[hidden] { display:none; }
.post-more button { background:none; border:0; padding:8px 12px; font-family:inherit; font-size:0.86rem; font-weight:600; color:var(--accent-deep); cursor:pointer; }
.post-more button:hover { color:var(--ink); }
.posts__empty { font-size:var(--text-body); color:var(--pigeon-deep); margin:0; }

/* Einzelner Beitrag */
.article-top { display:flex; justify-content:space-between; align-items:baseline; gap:16px; margin-bottom:28px; }
.article-top .article-back { margin:0; font-size:0.86rem; font-weight:600; white-space:nowrap; }
.article-back a { color:var(--accent-deep); }
.article-back a:hover { color:var(--ink); }
.article-hero { padding-top:48px; padding-bottom:0; }
.article-hero h1 { font-size:var(--text-h1); letter-spacing:-0.01em; margin-bottom:16px; }
@media (min-width:900px) { .article-hero h1 { font-size:var(--text-h1-lg); } }
.article-meta { font-size:0.82rem; font-weight:600; letter-spacing:0.04em; color:var(--pigeon-deep); margin:0 0 20px; }
.article-lead { font-size:var(--text-body); line-height:1.55; color:var(--ink); margin:0; }
.article-lead { max-width:none; }
.article-opening { padding-top:36px; padding-bottom:0; }
.article-opening__grid { display:grid; grid-template-columns:minmax(0,1fr); gap:32px; }
.article-opening__text, .article-opening__image { min-width:0; }
.article-opening__text > :first-child { margin-top:0; }
.article-opening__image { position:relative; margin:0; width:100%; aspect-ratio:16/9; border-radius:3px; overflow:hidden; background:var(--accent-100); }
.article-opening__image img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.article-cols { display:block; }
.article-cols li, .article-cols blockquote { break-inside:avoid; }
@media (min-width:900px) {
  .article-opening__grid { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:56px; align-items:stretch; }
  .article-opening__grid--solo { grid-template-columns:minmax(0,1fr); }
  .article-cols { column-count:2; column-gap:56px; }
}
.article-body { padding-top:40px; }
.article-body h2 { font-size:var(--text-h2); margin:2.2em 0 0.6em; }
.article-body h3 { font-size:var(--text-h3); margin:1.8em 0 0.5em; }
.article-body > .container > :first-child { margin-top:0; }
.article-body p, .article-body li { font-size:var(--text-body); line-height:1.75; }
.article-body p { margin:0 0 1.2em; }
.article-body ul, .article-body ol { margin:0 0 1.2em; padding-left:1.4em; }
.article-body li { margin-bottom:0.4em; }
.article-body a { color:var(--ink); font-weight:600; text-decoration:underline; text-decoration-color:var(--accent); text-decoration-thickness:0.18em; text-underline-offset:0.15em; overflow-wrap:anywhere; }
.article-body a:hover { color:var(--accent-deep); }
.article-body blockquote { margin:2.2em 0; padding:4px 0 4px 24px; border-left:4px solid var(--accent); font-size:1.35rem; font-style:italic; line-height:1.4; color:var(--ink); }
.article-body blockquote p { font-size:inherit; line-height:inherit; margin:0 0 0.6em; }
.article-body blockquote p:last-child { margin-bottom:0; }
.article-body hr { border:0; height:1.5px; background:var(--pigeon); margin:2.4em 0; opacity:0.6; }
.article-body code { font-size:0.92em; background:rgba(26,26,24,0.06); padding:0.1em 0.35em; border-radius:2px; }
.article-body pre { background:var(--ink); color:var(--off-white); padding:18px 20px; border-radius:3px; overflow-x:auto; margin:0 0 1.2em; }
.article-body pre code { background:none; padding:0; font-size:0.9rem; }
.article-figure { margin:2em 0; }
.article-figure img { width:100%; border-radius:4px; }
.article-figure figcaption { font-size:0.82rem; color:var(--pigeon-deep); margin-top:8px; }
.article-body .article-tags { padding-left:0; }
.article-body .article-pager a { text-decoration:none; font-weight:600; color:var(--pigeon-deep); font-size:0.86rem; }
.article-tags { display:flex; flex-wrap:wrap; gap:8px; list-style:none; padding:0; margin:2.4em 0 0; }
.article-body .article-tags a { color:inherit; font-weight:inherit; text-decoration:none; }
.article-body .article-tags li:hover { background:var(--accent-300); }
.article-body .article-tags li { font-size:0.72rem; line-height:1.4; font-weight:600; color:var(--ink); background:var(--accent-100); padding:5px 10px; border-radius:20px; margin:0; line-height:1.4; }
.article-pager { display:flex; justify-content:space-between; gap:24px; margin-top:3em; padding-top:24px; border-top:1.5px solid var(--pigeon); }
.article-pager a { flex:1 1 0; font-size:0.86rem; font-weight:600; color:var(--pigeon-deep); }
.article-pager a span { display:inline-block; margin-top:4px; font-family:var(--font-display); font-size:1rem; font-weight:700; line-height:1.3; color:var(--ink); }
.article-pager a:hover span { color:var(--accent-deep); }
.article-pager__next { text-align:right; }
@media (max-width:600px) { .article-pager { flex-direction:column; } .article-pager__next { text-align:left; } }

/* Impressum, Datenschutz */
.legal-text { max-width:var(--content-width); }
.legal-text h2 { font-size:1.25rem; margin:2.2em 0 0.6em; }
.legal-text h2:first-child { margin-top:0; }
.legal-text p, .legal-text li, .legal-text address { font-size:0.97rem; line-height:1.7; }
.legal-text p, .legal-text address { margin:0 0 1em; }
.legal-text address { font-style:normal; }
.legal-text ul { margin:0 0 1em; padding-left:1.2em; }
.legal-text li { margin-bottom:0.5em; }
.legal-text a { color:var(--ink); font-weight:600; text-decoration:underline; text-decoration-color:var(--accent); text-decoration-thickness:0.18em; text-underline-offset:0.15em; overflow-wrap:anywhere; }

/* footer */
.footer { background:var(--ink-deep); color:rgba(247,246,243,0.65); padding:44px 0 22px; font-size:0.85rem; }
.footer__inner { display:flex; flex-direction:column; gap:22px; }
.footer .nav__brand { color:var(--off-white); }
.footer__tagline { margin:14px 0 0; }
.footer__links { display:flex; flex-wrap:wrap; gap:8px 18px; }
.footer__links a { opacity:0.85; }
.footer__links a:hover { opacity:1; color:var(--accent-300); }
.footer .legal { display:flex; flex-wrap:wrap; gap:14px; font-size:0.76rem; margin-top:14px; }
.footer .copyright { margin-top:22px; font-size:0.74rem; opacity:0.55; }
@media (min-width:800px) { .footer__inner { flex-direction:row; justify-content:space-between; align-items:flex-start; } .footer__right { text-align:right; } .footer__right .footer__links, .footer__right .legal { justify-content:flex-end; } }

/* Fotoraster im Beitrag: quadratische Zellen, Fotos werden nicht geschnitten */
.photo-grid { display:grid; gap:10px; grid-template-columns:repeat(2,minmax(0,1fr)); margin:2em 0; }
.photo-grid--3 { grid-template-columns:repeat(3,minmax(0,1fr)); }
@media (min-width:700px) {
  .photo-grid { gap:14px; }
  .photo-grid--5, .photo-grid--6, .photo-grid--7 { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
.article-body a.photo-grid__item { display:block; aspect-ratio:1/1; background:rgba(26,26,24,0.05); border-radius:4px; overflow:hidden; cursor:zoom-in; text-decoration:none; }
.photo-grid__item img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .25s ease; }
.photo-grid__item:hover img { transform:scale(1.03); }
.photo-grid__item:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
@media (prefers-reduced-motion: reduce) { .photo-grid__item img { transition:none; } .photo-grid__item:hover img { transform:none; } }

/* Vergroesserung (nur auf Seiten mit Fotoraster) */
.lightbox { border:0; padding:0; margin:0; width:100%; height:100%; max-width:100vw; max-height:100vh; background:transparent; }
.lightbox::backdrop { background:rgba(14,14,12,0.92); }
.lightbox__inner { position:fixed; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:56px 72px 24px; }
.lightbox img { max-width:100%; max-height:calc(100vh - 150px); object-fit:contain; border-radius:2px; }
.lightbox__cap { color:rgba(247,246,243,0.85); font-size:0.9rem; margin:14px 0 0; text-align:center; min-height:1.5em; max-width:60ch; }
.lightbox button { position:absolute; background:none; border:0; color:#fff; font-size:2.4rem; line-height:1; cursor:pointer; padding:10px 14px; opacity:0.8; }
.lightbox button:hover, .lightbox button:focus-visible { opacity:1; }
.lightbox__close { top:8px; right:10px; }
.lightbox__prev { left:6px; top:50%; transform:translateY(-50%); }
.lightbox__next { right:6px; top:50%; transform:translateY(-50%); }
@media (max-width:600px) { .lightbox__inner { padding:56px 12px 24px; } .lightbox__prev, .lightbox__next { top:auto; bottom:10px; transform:none; } }

/* === Keks-Popup (nur Startseite, speichert nichts) ===
   Der Keks (Canvas, js/cookie-popup.js) erscheint genau ueber dem Textfeld, bricht und kruemelt; dann blendet das Textfeld ein. */
.cookie-pop { position:fixed; top:84px; right:24px; z-index:96; width:min(320px, calc(100vw - 32px)); min-height:150px; padding:22px 40px 22px 24px;
  display:flex; flex-direction:column; justify-content:center;
  background:var(--white); border:1.5px solid var(--pigeon); border-radius:3px; box-shadow:0 12px 32px rgba(26,26,24,0.12);
  opacity:0; visibility:hidden; transform:translateY(10px);
  transition:opacity .5s ease, transform .5s cubic-bezier(0.22,1,0.36,1), visibility 0s linear .5s; }
.cookie-pop.is-visible { opacity:1; visibility:visible; transform:none; transition:opacity .5s ease, transform .5s cubic-bezier(0.22,1,0.36,1), visibility 0s; }
.cookie-pop__title { font-family:var(--font-display); font-weight:700; font-size:1.1rem; line-height:1.25; margin:0 0 0.4em; color:var(--ink); }
.cookie-pop__text { font-size:0.9rem; line-height:1.45; margin:0; color:var(--graphite); }
.cookie-pop__text + .cookie-pop__text { margin-top:0.7em; }
.cookie-pop__text a { color:var(--ink); font-weight:600; text-decoration:underline; text-decoration-color:var(--accent); text-decoration-thickness:0.18em; text-underline-offset:0.15em; }
.cookie-pop__text a:hover, .cookie-pop__text a:focus-visible { background:var(--accent-100); }
.cookie-pop__close { position:absolute; top:6px; right:6px; width:30px; height:30px; padding:0; border:0; background:none; color:rgba(26,26,24,0.55); font-size:1.3rem; line-height:1; cursor:pointer; border-radius:50%; }
.cookie-pop__close:hover, .cookie-pop__close:focus-visible { color:var(--ink); background:rgba(26,26,24,0.08); }
@media (max-width:600px) { .cookie-pop { top:76px; right:16px; min-height:130px; } }
@media (prefers-reduced-motion: reduce) { .cookie-pop, .cookie-pop.is-visible { transition:opacity .2s ease; transform:none; } }

/* ---------- Beitragsbausteine: Leitabsatz, Seitenueberschrift, Zitat, Infokarte, Weg-Leiste ---------- */
.article-body p.is-lead { font-size:var(--text-body); line-height:1.6; color:var(--ink); }
.article-body .article-cols.article-cols--single { column-count:1; max-width:var(--content-width); }
.article-side { display:grid; grid-template-columns:minmax(0,1fr); gap:0; margin:2.2em 0 0; }
.article-side > h2 { margin:0 0 0.6em; }
.article-side__body > :last-child { margin-bottom:0; }
.article-body .pullquote { margin:2.8em 0; padding:8px 0 8px 32px; border-left:6px solid var(--accent); font-family:var(--font-display); font-style:normal; font-weight:700; font-size:clamp(1.5rem, 3.2vw, 2.3rem); line-height:1.25; letter-spacing:-0.01em; color:var(--ink); max-width:none; }
.article-body .pullquote p { font-size:inherit; line-height:inherit; margin:0; }
.infocard { margin:2.4em 0; padding:26px 30px; background:var(--white); border:1.5px solid var(--pigeon); border-radius:3px; max-width:var(--content-width); }
.article-body .infocard h3 { margin:0 0 10px; font-size:var(--text-h3); }
.article-body .infocard p { font-size:0.98rem; line-height:1.65; margin:0 0 0.8em; }
.article-body .infocard > :last-child { margin-bottom:0; }
.article-body ol.path { list-style:none; display:grid; grid-template-columns:minmax(0,1fr); gap:10px; padding:0; margin:2.4em 0; counter-reset:step; }
.article-body ol.path li { counter-increment:step; position:relative; margin:0; padding:16px 18px; background:var(--accent-100); border-radius:3px; font-family:var(--font-display); font-weight:700; font-size:1.02rem; line-height:1.3; }
@media (min-width:900px) {
  .article-side { grid-template-columns:minmax(0,1fr) minmax(0,2fr); gap:56px; margin-top:2.6em; }
  .article-side > h2 { margin:0; position:sticky; top:96px; align-self:start; }
  .article-body ol.path { grid-template-columns:repeat(auto-fit, minmax(0,1fr)); gap:14px; }
  .article-body ol.path li { padding:50px 18px 18px; }
  .article-body ol.path li::before { left:18px; top:16px; transform:none; }
}

/* Bild und Text nebeneinander (> [!bild-links] / > [!bild-rechts]) */
.media-split { display:grid; grid-template-columns:minmax(0,1fr); gap:24px; margin:2.4em 0; align-items:center; }
.media-split .article-figure { margin:0; }
.media-split .article-figure img { width:100%; height:auto; display:block; border-radius:3px; }
.article-body .media-split__text > :last-child { margin-bottom:0; }
@media (min-width:900px) {
  .media-split { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:56px; }
  .media-split--rechts .article-figure { order:2; }
}

/* Ruhiges Raster: vollbreite Textbloecke im Wechsel mit 50/50 */
.article-body .article-full > p, .article-body .article-full > ul, .article-body .article-full > ol, .article-body .article-split p, .article-body .article-split li, .article-body .media-split__text p, .article-body .article-opening__text p:not(.is-lead), .article-body .article-opening__text li { font-size:var(--text-body); line-height:1.7; }
.article-body .article-full > p:last-child, .article-body .article-split p:last-child { margin-bottom:0; }
.article-full, .article-split { margin:0 0 2.6em; }
.article-split { display:grid; grid-template-columns:minmax(0,1fr); gap:0; }
@media (min-width:900px) { .article-split { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:56px; } }
.article-body h2 { margin:0 0 0.7em; }
.article-body h2:not(:first-child) { margin-top:0; }
.article-body .pullquote { margin:0 0 2.6rem; }
.infocard { max-width:none; margin:0 0 2.6em; }
.article-body .infocard p { max-width:none; }
.article-body ol.path { margin:0 0 2.6em; }
.media-split { margin:0 0 2.6em; }

/* 50/50: Text laeuft in zwei gleich langen Spalten (Zeitungssatz, ausgeglichen) */
.article-split { display:block; }
@media (min-width:900px) { .article-split { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:56px; } }
.article-body .article-split p.is-cont { margin-top:0; }
.article-split p, .article-split li { orphans:3; widows:3; }

.article-body .article-split > div > :last-child { margin-bottom:0; }
@media (max-width:899px) { .article-body .article-split > div:first-child > p:last-child:not(:only-child) { margin-bottom:0; } }

/* Suche auf der Startseite */
.post-search { margin:0 0 20px; }
.post-search[hidden], .posts__empty[hidden] { display:none; }
.post-search input { width:100%; max-width:420px; box-sizing:border-box; font-family:inherit; font-size:var(--text-body); color:var(--ink); background:var(--white); border:1.5px solid var(--pigeon); border-radius:3px; padding:10px 14px; }
.post-search input:focus { outline:none; border-color:var(--accent); }