@font-face{font-family:"Work Sans";font-style:normal;font-weight:100 900;font-display:swap;src:url("schriften/work-sans-latin-wght-normal.woff2") format("woff2")}@font-face{font-family:"Work Sans";font-style:italic;font-weight:100 900;font-display:swap;src:url("schriften/work-sans-latin-wght-italic.woff2") format("woff2")}
@font-face{font-family:"Bricolage Grotesque";font-style:normal;font-weight:200 800;font-display:swap;src:url("schriften/bricolage-grotesque-latin-wght-normal.woff2") format("woff2")}
:root{
  --nacht:#f6f3ee;--kohle:#ece6dc;--rauch:#ded8ce;
  --papier:#1d1b18;--papier-2:#5a5754;--grau:#85837f;
  --linie:rgba(29, 27, 24, 0.12);--linie-stark:rgba(29, 27, 24, 0.28);
  --signal:#c42b1f;--schein:#c42b1f;--farbe:#c42b1f;
  --display:"Work Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--serif:"Bricolage Grotesque", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--titelschrift:"Bricolage Grotesque", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --rund:14px;--rund-gross:20px;--rund-klein:10px;
  --glas:rgba(29, 27, 24, 0.035);--glas-stark:rgba(29, 27, 24, 0.06);--glas-rand:rgba(29, 27, 24, 0.13);
}
html{background:var(--nacht);color:var(--papier)}
/* Titel in der Titelschrift des Themas, ohne die schmale Form von OKLETSGO */
.riesig,.titel,.held-titel,.fuss-titel,.mo-lauf-teil span{font-family:var(--titelschrift);font-variation-settings:normal;font-weight:700;text-transform:none;letter-spacing:-0.025em}
.riesig,.held-titel{line-height:.98}
.serif{font-family:var(--titelschrift);font-style:normal;color:var(--signal)}
.marke-name{font-family:var(--titelschrift);font-weight:700;font-size:20px;letter-spacing:-.01em;color:var(--papier)}
/* Über Bildern und Filmen (Kopf): helle Schrift auf dunklem Schleier, wie im neuen Builder; ohne Bild die Gegenfläche */
.held{--papier:#f6f3ee;--papier-2:rgba(246,243,238,.84);--grau:rgba(246,243,238,.66);--signal:#c93c31;--linie:rgba(246,243,238,.16);color:var(--papier)}
.held-medium{background:#1c2620}
.held .knopf.voll{background:#f6f3ee;border-color:#f6f3ee;color:#161616}
.held .knopf:not(.voll){color:#f6f3ee;border-color:rgba(246,243,238,.4)}
/* Der Kopf über dem Bild des ersten Abschnitts: hell, bis man scrollt */
body:has(main > .held:first-child) .kopf:not(.gescrollt):not(.offen){--papier:#f6f3ee;--papier-2:rgba(246,243,238,.84);--linie:rgba(246,243,238,.2);--linie-stark:rgba(246,243,238,.4);color:#f6f3ee}
/* Die Gegenfläche (Abschnitte mit „Hell" bzw. Kontrast) */
.hell{--nacht:#1c2620;--kohle:#29322c;--rauch:#363f39;--papier:#f6f3ee;--papier-2:#c0c0bb;--grau:#949791;--linie:rgba(246, 243, 238, 0.14);--linie-stark:rgba(246, 243, 238, 0.3);background:var(--nacht)}
.hell .knopf.voll{background:var(--papier);color:var(--nacht);border-color:var(--papier)}
/* Wie im Websitebuilder vom 24.10.2026 (Holz Mewes): ruhigere Grössen, Akzentwörter im Titel in derselben Stärke,
   Dachzeilen als Versalien in der Akzentfarbe, Inhalt höchstens 1200 px breit */
.titel{font-size:clamp(34px,4.2vw,58px);line-height:1.06}
.held-titel{font-size:clamp(44px,6.6vw,92px)}
.titel .serif,.held-titel .serif,.riesig .serif,.mv-satz-fragen .titel .serif{font-weight:inherit;font-variation-settings:normal}
.abschnitt{padding-left:max(var(--rand),calc((100% - 1200px) / 2));padding-right:max(var(--rand),calc((100% - 1200px) / 2))}
.abschnitt-kopf p{font-size:17px}
.kicker,.mo-gs-karte .kicker,.mo-gs .kicker{font-family:var(--display);font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--signal)}
.kicker i{width:14px;height:2px;border-radius:1px;background:var(--signal)}
.held .kicker{color:#f6f3ee}.held .kicker i{background:#f6f3ee}
.knopf{font-family:var(--display)}
.held .knopf.voll{background:#c42b1f;border-color:#c42b1f;color:#ffffff}
/* Karten mit Bild: Titel wie Zwischenüberschriften */
.mo-gs-karte h3,.mo-gs-unter h3{font-family:var(--titelschrift);font-size:clamp(20px,1.9vw,26px);font-variation-settings:normal;line-height:1.15}
.mo-gs-karte .mo-gs-medium{aspect-ratio:4/3}
/* Versetzt: Bild und Text nebeneinander, abwechselnd */
.mo-gs-folge{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);align-items:center;gap:clamp(24px,4vw,64px);width:100%}
.mo-gs-folge.rechts .mo-gs-medium{order:2}
.mo-gs-folge .mo-gs-medium{aspect-ratio:3/2}
.mo-gs-folge + .mo-gs-folge{margin-top:clamp(40px,5vw,80px)}
.mo-gs-unter{grid-template-columns:1fr;gap:10px}
.mo-gs-unter p:not(.kicker){font-size:15.5px}
/* Laufschrift als Band in der Akzentfarbe */
.mo-laufband{background:#c42b1f;color:#ffffff;border:0;padding:clamp(28px,3.4vw,48px) 0}
.mo-lauf-teil span{font-family:var(--titelschrift);font-variation-settings:normal;font-weight:700;text-transform:none;font-size:clamp(40px,6vw,88px)}
.mo-lauf-punkt{background:currentColor;opacity:.5}
/* Zahlen in der Akzentfarbe */
.mo-zahl b{font-family:var(--titelschrift);font-variation-settings:normal;font-weight:700;color:var(--signal);font-size:clamp(40px,calc(20vw / var(--n,4)),64px)}
.hell .mo-zahl b{color:#c83b30}
/* Über Bildern bis an den Rand: helle Schrift auf dunklem Schleier */
.mv-zr-breit,.mv-tb-breit{--papier:#f6f3ee;--papier-2:rgba(246,243,238,.86);--grau:rgba(246,243,238,.7);color:#f6f3ee;min-height:min(70vh,640px)}
.mv-zr-breit::after,.mv-tb-breit::after{background:linear-gradient(to top,rgba(0,0,0,.62),rgba(0,0,0,.25))}
.mv-zr-breit .serif,.mv-tb-breit .serif{color:#c93c31}
.mv-zr-breit{align-items:center;justify-items:center;text-align:center}
.mv-zr-gross{margin:0 auto}
.mv-zr-gross .riesig{font-size:clamp(36px,5vw,68px);line-height:1.05}
.mv-zr-breit .zwischenruf-knoepfe{justify-content:center}
/* Umfang: Überschrift links, Liste rechts mit Haken */
.abschnitt:has(> .umfang){display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(24px,5vw,80px);align-items:start}
.abschnitt:has(> .umfang) .abschnitt-kopf{grid-template-columns:1fr;gap:16px;margin:0}
.umfang{grid-template-columns:1fr}
.umfang li{padding:13px 0;font-size:15.5px;grid-template-columns:24px 1fr}
.umfang li::before{width:18px;height:18px;margin-top:.1em;background:color-mix(in srgb,var(--signal) 16%,transparent);-webkit-mask:none;border-radius:50%;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--signal) 30%,transparent)}
/* Galerie: Bildunterschriften in der Textschrift */
.mo-fotos figcaption{font-family:var(--display);font-size:12.5px;color:var(--grau);padding-top:6px}
.mo-fotos figure{background:transparent;aspect-ratio:auto;overflow:visible;border-radius:0}
.mo-fotos figure img{aspect-ratio:var(--v);height:auto;border-radius:var(--rund-klein)}
@media (max-width:820px){.abschnitt:has(> .umfang),.mo-gs-folge{grid-template-columns:1fr}.mo-gs-folge.rechts .mo-gs-medium{order:0}}
.korn::after{display:none}
.knopf.voll{background:var(--signal);border-color:var(--signal);color:#ffffff}
.kopf.gescrollt{background:rgba(246, 243, 238, 0.86)}
