:root {
  --bg: #f7f7f3;
  --paper: #ffffff;
  --text: #20221f;
  --muted: #6e726a;
  --line: #dfe2da;
  --accent: #4d6256;
  --max: 1180px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: var(--bg);
  color: var(--text);
  line-height: 1.6;
}
a { color: inherit; }
.wrap { width: min(calc(100% - 40px), var(--max)); margin: 0 auto; }
.narrow { width: min(calc(100% - 40px), 860px); margin: 0 auto; }
.site-header {
  position: sticky; top: 0; z-index: 10;
  background: rgba(247,247,243,.94);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(10px);
}
.header-inner { min-height: 76px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand { text-decoration:none; font-weight:700; letter-spacing:.08em; font-size:.95rem; }
.nav { display:flex; gap:24px; flex-wrap:wrap; }
.nav a { text-decoration:none; font-size:.84rem; letter-spacing:.05em; }
.nav a:hover, .text-link:hover { color: var(--accent); }
.section { padding: 92px 0; border-bottom: 1px solid var(--line); }
.hero { padding: 130px 0 120px; }
.eyebrow { margin:0 0 14px; text-transform:uppercase; letter-spacing:.12em; font-size:.76rem; color:var(--muted); font-weight:700; }
h1,h2,h3 { line-height:1.15; margin-top:0; font-weight:650; }
h1 { font-family: Georgia, "Times New Roman", serif; font-size: clamp(2.8rem, 7vw, 5.9rem); letter-spacing:-.035em; max-width: 980px; margin-bottom: 28px; }
h2 { font-family: Georgia, "Times New Roman", serif; font-size: clamp(2rem, 4vw, 3.5rem); letter-spacing:-.02em; margin-bottom: 0; }
h3 { font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.5rem, 3vw, 2.2rem); }
p { margin-top:0; }
.lead { font-size: clamp(1.15rem, 2vw, 1.45rem); color: #424740; max-width: 760px; }
.split { display:grid; grid-template-columns: .85fr 1.15fr; gap: clamp(40px, 8vw, 120px); align-items:start; }
.project-band { background: var(--paper); }
.text-link { display:inline-block; margin-top: 14px; text-decoration:none; font-weight:650; border-bottom:1px solid currentColor; }
.muted { color:var(--muted); }
.links-row { display:flex; gap:28px; flex-wrap:wrap; }
.meta { color:var(--muted); font-size:.88rem; margin-bottom:12px; }
.statement { background:#eef0ea; padding: 110px 0; }
blockquote {
  margin:0; padding:0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2rem, 4.8vw, 4rem);
  line-height:1.18;
  letter-spacing:-.02em;
}
.experience-hint { background: var(--paper); }
.site-footer { padding: 34px 0 54px; font-size:.9rem; color:var(--muted); }
.footer-inner { display:flex; justify-content:space-between; gap:24px; flex-wrap:wrap; }
.footer-inner div { display:flex; gap:20px; flex-wrap:wrap; }
.footer-inner a { text-decoration:none; }
@media (max-width: 780px) {
  .header-inner { align-items:flex-start; flex-direction:column; padding:18px 0; }
  .nav { gap:14px 18px; }
  .section { padding: 68px 0; }
  .hero { padding: 92px 0 80px; }
  .split { grid-template-columns:1fr; gap:26px; }
  .statement { padding: 82px 0; }
}

/* Weitergedacht */
.nav a.active { color: var(--accent); font-weight: 700; }
.essay-intro { padding-top: 118px; }
.page-title { font-size: clamp(3rem, 7vw, 5.6rem); margin-bottom: 30px; }
.intro-note { max-width: 760px; font-size: 1.08rem; margin-top: 30px; }
.editorial-note { margin-top: 48px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.editorial-note summary { cursor: pointer; padding: 20px 0; font-weight: 650; list-style: none; }
.editorial-note summary::-webkit-details-marker { display:none; }
.editorial-note summary::after { content: "+"; float:right; color:var(--muted); }
.editorial-note[open] summary::after { content: "–"; }
.editorial-note-body { padding: 8px 0 34px; max-width: 760px; }
.editorial-note-body h2 { font-size: 1.55rem; margin: 32px 0 12px; }
.editorial-note-body ul { padding-left: 1.25rem; }
.featured-essay { background: var(--paper); }
.essay-date { color: var(--muted); font-size: .95rem; }
.archive-heading { display:grid; grid-template-columns: 1fr 1fr; gap: clamp(40px, 8vw, 120px); margin-bottom: 44px; align-items:end; }
.archive-note { color: var(--muted); max-width: 520px; margin-bottom: 4px; }
.essay-list { border-top: 1px solid var(--line); }
.essay-list-item { display:grid; grid-template-columns: 170px minmax(0,1fr) 120px; column-gap: 34px; padding: 30px 0 32px; border-bottom: 1px solid var(--line); align-items:start; }
.essay-list-item time { color: var(--muted); font-size:.9rem; padding-top:4px; }
.essay-list-item h3 { font-size: clamp(1.35rem, 2.2vw, 1.9rem); margin: 0 0 5px; grid-column:2; }
.essay-list-item p { grid-column:2; margin-bottom:0; color:#4a4f48; }
.essay-list-item a { grid-column:3; grid-row:1 / span 3; justify-self:end; text-decoration:none; font-weight:650; border-bottom:1px solid currentColor; margin-top:4px; }
.essay-list-item.special { background: rgba(255,255,255,.38); padding-left: 18px; padding-right: 18px; }
.inventory-note { font-size:.85rem; color:var(--muted) !important; }
.thought-to-project { background:#eef0ea; }
@media (max-width: 780px) {
  .essay-intro { padding-top: 82px; }
  .archive-heading { grid-template-columns: 1fr; gap: 16px; }
  .essay-list-item { grid-template-columns: 1fr; gap: 6px; }
  .essay-list-item time, .essay-list-item h3, .essay-list-item p, .essay-list-item a { grid-column:1; grid-row:auto; justify-self:start; }
  .essay-list-item a { margin-top: 8px; }
}


/* P03.6a – dezente Brotkrumen-Navigation */
.breadcrumb-wrap {
  max-width: 1180px;
  margin: 0 auto;
  padding: 18px 28px 0;
}
.breadcrumb {
  display: flex;
  align-items: center;
  gap: .55rem;
  font-size: .72rem;
  line-height: 1.4;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #7b7b75;
}
.breadcrumb a {
  color: inherit;
  text-decoration: none;
}
.breadcrumb a:hover,
.breadcrumb a:focus-visible {
  color: #30302d;
  text-decoration: underline;
  text-underline-offset: .18em;
}
.breadcrumb [aria-current="page"] {
  color: #555550;
}
@media (max-width: 700px) {
  .breadcrumb-wrap {
    padding: 14px 20px 0;
  }
  .breadcrumb {
    font-size: .68rem;
    gap: .4rem;
  }
}


/* P03.6b Feinschliff – optische Achsen auf START */
#start .statement .wrap {
  max-width: 1180px;
}
#start .statement blockquote {
  max-width: 920px;
  margin-left: 0;
  margin-right: auto;
}
#start section:nth-of-type(3) h2 {
  max-width: 19ch;
  font-size: clamp(2rem, 4vw, 3.35rem);
  line-height: 1.08;
}
@media (max-width: 760px) {
  #start .statement .wrap {
    max-width: none;
  }
  #start section:nth-of-type(3) h2 {
    max-width: none;
    font-size: clamp(1.8rem, 8vw, 2.6rem);
  }
}


/* P03.6b – sichtbarer Feinschliff, explizit statt struktureller Selektoren */
.start-essay .split {
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr);
  gap: 4rem;
}
.start-essay h2 {
  max-width: 24ch;
  font-size: clamp(2rem, 3.5vw, 3.15rem);
  line-height: 1.08;
}
.start-statement .wrap {
  max-width: 1180px;
}
.start-statement blockquote {
  width: 100%;
  max-width: 1000px;
  margin: 0;
}
@media (max-width: 760px) {
  .start-essay .split { grid-template-columns: 1fr; gap: 1.5rem; }
  .start-essay h2 { max-width: none; }
  .start-statement blockquote { max-width: none; }
}


/* P03.6b – Satz 1 des Statements als geschlossene Zeile */
.start-statement .statement-line {
  display: block;
}
.start-statement .statement-line:first-child {
  white-space: nowrap;
}
@media (max-width: 760px) {
  .start-statement .statement-line:first-child {
    white-space: normal;
  }
}

/* P04.1.1 Essay */
.essay-reading{max-width:760px}
.essay-intro{border-top:1px solid #d8d8d2;border-bottom:1px solid #d8d8d2}
.essay-intro p{font-size:1.12rem;line-height:1.75}
.essay-copy{font-size:1.08rem;line-height:1.82}
.essay-copy p{margin:0 0 1.45rem}.essay-copy li{margin:.45rem 0}.essay-copy ul{margin:0 0 1.7rem 1.25rem}
.essay-end{border-top:1px solid #d8d8d2}
@media(max-width:760px){.essay-intro p,.essay-copy{font-size:1rem}}

/* P04.1.1 Feinschliff – Essay-Überschriften ruhiger */
.essay-detail .hero h1,
article .hero h1 {
  font-size: clamp(2.7rem, 5.4vw, 4.8rem);
  line-height: 1.03;
  max-width: 16ch;
}
.essay-intro h2 {
  font-size: clamp(1.8rem, 3.1vw, 2.7rem);
  line-height: 1.12;
  max-width: 22ch;
}
@media (max-width:760px){
  .essay-detail .hero h1,
  article .hero h1 {
    font-size: clamp(2.25rem, 10vw, 3.35rem);
    max-width:none;
  }
  .essay-intro h2 {
    font-size: clamp(1.65rem, 7vw, 2.25rem);
    max-width:none;
  }
}

/* P04.1.1 Feinschliff 2 – Introüberschrift einzeilig auf Desktop */
.essay-intro h2 {
  font-size: clamp(1.55rem, 2.45vw, 2.2rem);
  line-height: 1.12;
  max-width: none;
  white-space: nowrap;
}
@media (max-width: 760px) {
  .essay-intro h2 {
    font-size: clamp(1.45rem, 6vw, 1.95rem);
    white-space: normal;
  }
}

/* P04.1.1 finaler Feinschliff – Luft zwischen Introüberschrift und Text */
.essay-intro h2 {
  margin-bottom: 1.35rem;
}
.essay-sources{margin-top:3.5rem;padding-top:2rem;border-top:1px solid #d8d8d2}.essay-sources h2{font-size:1.5rem;margin-bottom:1.25rem}
.essay-subtitle{font-size:clamp(1.25rem,2vw,1.7rem);line-height:1.35;margin-top:1rem;max-width:30ch}.essay-copy h2{font-size:clamp(1.55rem,2.45vw,2.2rem);line-height:1.15;margin:3rem 0 1.35rem}

.essay-image{margin-top:2.5rem;margin-bottom:1rem}
.essay-image img{display:block;width:100%;height:auto}
.essay-image figcaption{font-size:.8rem;letter-spacing:.04em;margin-top:.65rem;opacity:.65}


/* P04.2 Weitergedacht-Bestand */
.essay-grid{display:grid;gap:0;border-top:1px solid var(--line,#ddd)}
.essay-card{padding:1.6rem 0;border-bottom:1px solid var(--line,#ddd);max-width:900px}
.essay-card h2{font-size:clamp(1.25rem,2vw,1.65rem);margin:.35rem 0 .45rem;line-height:1.25}
.essay-card h2 a{color:inherit;text-decoration:none}
.essay-card h2 a:hover{text-decoration:underline;text-underline-offset:.18em}

/* P04.2a Style-Guide Umbruchkorrektur */
@media (min-width: 900px){
  .essay-detail .hero .essay-reading{max-width:1100px;}
  .essay-detail .hero h1{font-size:clamp(2.8rem,5vw,4.8rem);max-width:none;text-wrap:balance;}
  .essay-detail .hero h1 br{display:none;}
}
@media (max-width:899px){
  .essay-detail .hero h1{font-size:clamp(2.25rem,10vw,3.5rem);}
}

/* P04.4b Quellen & Hintergrund Muster */
.sources-background{padding-top:1.25rem;padding-bottom:1.25rem;}
.sources-kicker{font-size:.78rem;letter-spacing:.12em;font-weight:700;margin:0 0 1.35rem;}
.sources-list{display:grid;gap:1rem;}
.sources-list p{margin:0;line-height:1.55;font-size:.96rem;}
.sources-list strong{font-weight:650;}
.sources-list span{opacity:.82;}
.sources-note{margin:1.5rem 0 0;font-size:.9rem;line-height:1.55;font-style:italic;opacity:.78;}

/* P04.4c Korrektur – Quellenblock ohne eigene Trennlinie */
.sources-background{border:0!important;}
.sources-background + .essay-end{margin-top:0;}

/* Teil 03.4 – Woher die Idee kommt */
.origin-intro h1{max-width:none;text-wrap:balance}.origin-intro{max-width:860px}
.origin-section{border-top:1px solid var(--line,#d8d8d2)}
.origin-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.75fr);gap:clamp(3rem,7vw,7rem);align-items:center}
.origin-grid-reverse{grid-template-columns:minmax(280px,.9fr) minmax(0,1.25fr)}
.origin-copy{max-width:720px}.origin-copy h2,.origin-present h2,.origin-closing h2{font-size:clamp(1.8rem,3vw,2.65rem);line-height:1.12;margin:.35rem 0 1.5rem;text-wrap:balance}
.origin-copy p,.origin-present p,.origin-closing p{font-size:1.06rem;line-height:1.75}
.origin-media{margin:0}.origin-media img{display:block;width:100%;height:auto;max-height:580px;object-fit:contain}.origin-media figcaption{font-size:.82rem;line-height:1.45;margin-top:.75rem;opacity:.68}
.origin-document{border:1px solid var(--line,#d8d8d2);padding:clamp(1.8rem,4vw,3rem);min-height:340px;display:flex;flex-direction:column;justify-content:center;background:#fafaf8}
.origin-document span{font-size:.72rem;letter-spacing:.12em;font-weight:700;opacity:.62;margin-bottom:2rem}.origin-document strong{font-family:Georgia,"Times New Roman",serif;font-size:clamp(1.65rem,3vw,2.35rem);line-height:1.15;font-weight:600}.origin-document p{font-size:.95rem;line-height:1.5;margin:1.2rem 0 2.5rem}.origin-document small{font-size:.78rem;opacity:.6}
.origin-present .narrow{max-width:820px}.origin-logo{margin:4rem auto 1rem;max-width:420px;text-align:center}.origin-logo img{width:100%;height:auto;max-height:220px}
.origin-closing{border-top:1px solid var(--line,#d8d8d2)}.origin-thesis{font-family:Georgia,"Times New Roman",serif;font-size:clamp(1.55rem,3vw,2.35rem)!important;line-height:1.3!important;margin:2.8rem 0}.origin-last{font-size:1.2rem!important;margin-top:2.4rem}.origin-back{margin-top:3.5rem}
@media(max-width:760px){.origin-grid,.origin-grid-reverse{grid-template-columns:1fr;gap:2.2rem}.origin-grid-reverse .origin-media{order:2}.origin-grid-reverse .origin-copy{order:1}.origin-media img{max-height:none}.origin-document{min-height:0}.origin-copy h2,.origin-present h2,.origin-closing h2{text-wrap:pretty}.origin-copy p,.origin-present p,.origin-closing p{font-size:1rem}}

@media(min-width:900px){.today-line{white-space:nowrap}.today-line-full{white-space:nowrap}}
.origin-teaser{margin-top:2.25rem}


/* Teil 03.4e – Weitergedacht nur einmal prominent */
.statement .statement-link {
  color: inherit;
  text-decoration-thickness: 1px;
  text-underline-offset: .12em;
}

/* Teil 03.4f – Korrekturpatch 1–3 */
.about-closing-line { display:block; }
.atlas-life-image { transform:rotate(180deg); transform-origin:center; }
.gesundheit2020-archive-image { display:block; max-width:72%; height:auto; margin-inline:auto; }
.gesundheit2020-archive { max-width:360px; margin-inline:auto; }
@media (max-width:760px) {
  .about-closing-line { display:inline; }
  .about-closing-line + .about-closing-line::before { content:" "; }
}

.gesundheit2020-archive-card {
  max-width: 360px;
  margin-inline: auto;
  padding: 1.5rem;
}
@media (min-width: 900px) {
  .today-line-wide { white-space: nowrap; }
}

/* Teil 03.4g – gezielter Entschlackungs- und Satzspiegelpatch */
.home-weitergedacht-teaser { padding-top: 3.5rem; padding-bottom: 3.5rem; }
.weitergedacht-list-tight { border-top: 0 !important; padding-top: 2.25rem !important; }
.weitergedacht-list-tight::before { display: none !important; }
.today-statement { max-width: 1180px; }
.today-line { display: inline-block; }
.today-last { white-space: nowrap; }
@media (max-width: 980px) {
  .today-line, .today-last { display: inline; white-space: normal; }
  .today-statement br { display: none; }
  .today-line + .today-line::before { content: " "; }
}

/* Teil 03.4h – Feinarbeiten: Entstehungsseite */
.origin-intro h1 {
  font-size: clamp(2.8rem, 6vw, 5.15rem);
  max-width: 820px;
  text-wrap: balance;
}
.origin-document {
  max-width: 400px;
  width: 100%;
  margin-inline: auto;
}
.origin-document strong {
  font-size: clamp(1.55rem, 2.35vw, 2rem);
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
}
.atlas-life-image {
  transform: none;
  max-height: none !important;
}
@media (max-width:760px) {
  .origin-intro h1 { font-size: clamp(2.55rem, 11vw, 3.7rem); }
  .origin-document { max-width: 100%; }
}

/* Rechtliche Seiten */
.legal-hero { padding-bottom: 2.5rem; }
.legal-section { padding-top: 2rem; }
.legal-copy { max-width: 860px; }
.legal-copy h2 { margin-top: 2.5rem; margin-bottom: .8rem; }
.legal-copy h2:first-child { margin-top: 0; }
.legal-copy p { max-width: 78ch; }

/* Teil 03.4k – Rechtliche Seiten: feinere Überschriften */
.legal-hero h1 {
  font-size: clamp(2.35rem, 5vw, 4.4rem);
  line-height: 1.02;
}
.legal-copy h2 {
  font-size: clamp(1.35rem, 2.2vw, 1.85rem);
  line-height: 1.18;
}
@media (max-width: 760px) {
  .legal-hero h1 {
    font-size: clamp(2.1rem, 10vw, 3rem);
  }
}

/* Teil 03.4n – Entstehungsseite: typografischer Feinschliff */
.origin-logo a {
  display: inline-block;
}
.origin-logo a img {
  display: block;
}

/* Der Projektname bleibt als feste Wortgruppe zusammen. */
.term-nowrap {
  white-space: nowrap;
}

/* Einheitliche linke Satzkante für Hero, Abschnitt 04 und Rückblick. */
.origin-page .origin-intro,
.origin-page .origin-present .narrow,
.origin-page .origin-closing .narrow {
  width: min(calc(100% - 40px), var(--max));
  max-width: var(--max);
  margin-left: auto;
  margin-right: auto;
}

/* Lesebreite bleibt kontrolliert, aber alle Textblöcke starten auf derselben Achse. */
.origin-page .origin-intro h1 {
  max-width: 920px;
}
.origin-page .origin-intro .lead,
.origin-page .origin-present .narrow > p:not(.eyebrow),
.origin-page .origin-closing .narrow > p:not(.eyebrow) {
  max-width: 820px;
}

/* Ruhigere Umbrüche: möglichst keine einzelnen Wörter in der letzten Zeile. */
.origin-page .lead,
.origin-page .origin-copy p,
.origin-page .origin-present p,
.origin-page .origin-closing p {
  text-wrap: pretty;
}

/* Die Hauptüberschrift darf umbrechen, aber der Projektname selbst nicht. */
.origin-intro .origin-title-no-orphan {
  white-space: normal;
  text-wrap: balance;
  font-size: clamp(2.8rem, 5.15vw, 4.75rem);
  line-height: 1.08;
}

/* Der Text in den zweispaltigen Abschnitten bleibt auf einer einheitlichen Satzbreite. */
.origin-copy {
  max-width: 720px;
}
.origin-copy p {
  max-width: 68ch;
}

/* Abschnitt 04 und Rückblick: gleiche Einzüge und gleiche Lesebreite. */
.origin-present .eyebrow,
.origin-present h2,
.origin-closing .eyebrow,
.origin-closing h2 {
  max-width: 820px;
}

/* Mobil keine künstlichen Desktop-Zwänge. */
@media (max-width: 760px) {
  .origin-page .origin-intro,
  .origin-page .origin-present .narrow,
  .origin-page .origin-closing .narrow {
    width: min(calc(100% - 40px), var(--max));
  }

  .origin-page .origin-intro h1,
  .origin-page .origin-intro .lead,
  .origin-page .origin-present .narrow > p:not(.eyebrow),
  .origin-page .origin-closing .narrow > p:not(.eyebrow),
  .origin-present .eyebrow,
  .origin-present h2,
  .origin-closing .eyebrow,
  .origin-closing h2 {
    max-width: none;
  }

  .origin-intro .origin-title-no-orphan {
    font-size: clamp(2.55rem, 11vw, 3.7rem);
  }
}

/* Startseite – Heroüberschrift: keine einzelne Schlusszeile */
@media (min-width: 900px) {
  .hero h1 {
    max-width: 1040px;
    text-wrap: balance;
  }
}

