/* HELLWIG — Baugeschäft. Grammatik aus ../grammatik.css.
   Farbe hergeleitet (siehe ../VISIONEN.md):
     Grund   Beton      die Sohle ist das Erste, was steht
     Akzent  Ziegelrot  der Rohbau besteht aus genau diesem Ziegel
   Hell, weil draußen bei Tageslicht gearbeitet wird. */
@font-face{font-family:'Author';src:url('fonts/author-600.woff2') format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:'Author';src:url('fonts/author-700.woff2') format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:'SourceSerif';src:url('fonts/source-serif-4-400-normal-latin.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'SourceSerif';src:url('fonts/source-serif-4-600-normal-latin.woff2') format('woff2');font-weight:600;font-display:swap}

:root{
  --grund:#DDD8D0;
  --tiefer:#D2CCC2;
  --schrift:#1B1917;
  --dim:#585349;
  --linie:rgba(27,25,23,.20);
  --linie-stark:rgba(27,25,23,.68);
  --akzent:#8A3F26;
  --akzent-auf:#DDD8D0;
  --anzeige:'Author',system-ui,sans-serif;
  --anzeige-gewicht:700;
  --lauf:'SourceSerif',Georgia,serif;
  --satz-versal:uppercase;
  --satz-sperr:-.018em;

  --auf-bild:#F7F5F1;
  --auf-bild-dim:rgba(247,245,241,.84);
  --auf-bild-schatten:0 1px 16px rgba(20,18,16,.9);

  --kopf-schleier:rgba(221,216,208,.88);
  --szene-schleier:linear-gradient(180deg,rgba(22,20,18,.30) 0%,rgba(22,20,18,.02) 34%,rgba(22,20,18,.78) 100%);
  --szene-mitte-scrim:radial-gradient(62% 48% at 50% 50%,rgba(22,20,18,.62) 0%,rgba(22,20,18,.28) 58%,transparent 100%);
  --split-schleier:rgba(22,20,18,.82);
  --wisch-knopf:rgba(221,216,208,.8);
  --schild-grund:rgba(221,216,208,.92);
}

/* Serif als Fließtext — die Seite soll wie ein Bautagebuch lesen. */
.lauf,.kapitel__text,.unter,.register .nb{font-family:'SourceSerif',Georgia,serif}
.kopf{color:var(--dim);font-family:'Author',sans-serif}
.kopf b{color:var(--schrift)}

.daten{margin:0}
.daten dt{font-family:'Author',sans-serif;font-size:11px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--akzent);border-top:1px solid var(--linie);padding-top:13px}
.daten dd{margin:.4em 0 18px}

/* Der Bauplan: vier Etappen, nummeriert, als Register über dem Morph. */
.etappen{list-style:none;margin:clamp(22px,3.5vh,38px) 0 0;padding:0;
  border-top:1px solid var(--linie)}
.etappen li{display:flex;align-items:baseline;gap:16px;padding:14px 0;
  border-bottom:1px solid var(--linie)}
.etappen b{font-family:'Author',sans-serif;font-size:12px;letter-spacing:.2em;color:var(--akzent);
  flex:0 0 auto;width:2.6em}
.etappen span{color:var(--dim);margin-left:auto;font-size:14px;text-align:right}
