/* vbvla.de — „Morgenlicht“: Würde statt Mitleid.
   Farben: Papier, Kiefer, Ton, Morgensonne. Schriften: Newsreader (Überschriften), Public Sans (Text). */

@font-face {
  font-family: "Newsreader";
  src: url("assets/fonts/newsreader-latin-opsz-normal.woff2?v=6e4f2958c3") format("woff2");
  font-weight: 200 800; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Newsreader";
  src: url("assets/fonts/newsreader-latin-opsz-italic.woff2?v=5dfcd10d24") format("woff2");
  font-weight: 200 800; font-style: italic; font-display: swap;
}
@font-face {
  font-family: "Public Sans";
  src: url("assets/fonts/public-sans-latin-wght-normal.woff2?v=5ed4d31c98") format("woff2");
  font-weight: 100 900; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Public Sans";
  src: url("assets/fonts/public-sans-latin-wght-italic.woff2?v=16dc93252a") format("woff2");
  font-weight: 100 900; font-style: italic; font-display: swap;
}

:root {
  color-scheme: light;
  --papier: #F7F2EA;
  --papier-tief: #EFE7DA;
  --salbei: #E4E7DA;
  --kiefer: #22403A;       /* tiefes Grün, Flächen */
  --kiefer-tief: #172E29;
  --tinte: #1D2826;        /* Text */
  --grau: #56605C;         /* Nebentext, 6,0:1 auf Papier */
  --ton: #9A4526;          /* Akzent-Text, 6,3:1 auf Papier */
  --sonne: #E7AE45;        /* nur Fläche/Deko */
  --sonne-hell: #F2C66A;   /* Text auf Kiefer, 7,3:1 */
  --linie: #D9CFBF;
  --serif: "Newsreader", "Iowan Old Style", Georgia, serif;
  --sans: "Public Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --rand: clamp(20px, 5vw, 72px);
  --breite: 1200px;
  --horizont: 0;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body {
  margin: 0; background: var(--papier); color: var(--tinte);
  font: 400 1.0625rem/1.65 var(--sans);
  text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased;
}
img, svg { display: block; max-width: 100%; }
a { color: inherit; }
h1, h2, h3 { font-family: var(--serif); font-weight: 420; line-height: 1.08; margin: 0; letter-spacing: -0.012em;
   }
h2 { font-size: clamp(2rem, 1.3rem + 3vw, 3.4rem); }
p { margin: 0; }
em { font-style: italic; }
:focus-visible { outline: 3px solid var(--ton); outline-offset: 3px; border-radius: 3px; }
.unsichtbar { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.sprung { position: absolute; left: 12px; top: -60px; z-index: 50; background: var(--kiefer); color: #fff; padding: 10px 14px; border-radius: 6px; }
.sprung:focus { top: 12px; }

.kicker { font: 700 .78rem/1.4 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--ton); margin-bottom: 1.1rem; }
.kicker--hell { color: var(--sonne-hell); }

/* ---------- Kopf ---------- */
.kopf { position: sticky; top: 0; z-index: 20; background: color-mix(in srgb, var(--papier) 90%, transparent);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.kopf__zeile { max-width: var(--breite); margin: 0 auto; padding: 14px var(--rand); display: flex; align-items: center; gap: 24px; }
.marke { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; margin-right: auto; }
.marke__zeichen { width: 34px; height: 34px; }
.zeichen__sonne { fill: var(--sonne); }
.zeichen__schale { fill: none; stroke: var(--kiefer); stroke-width: 5.5; stroke-linecap: round; }
.marke__wort { font: 500 1.5rem/1 var(--serif); letter-spacing: .01em; font-variation-settings: "opsz" 48; color: var(--kiefer); }

.navi ul { list-style: none; margin: 0; padding: 0; display: flex; gap: 6px; align-items: center; }
.navi a { display: block; padding: 8px 12px; text-decoration: none; font-size: .95rem; color: var(--tinte); border-radius: 999px; transition: background .2s; }
.navi a:hover { background: var(--papier-tief); }
.navi a.navi__kontakt { background: var(--kiefer); color: #fff; padding: 8px 18px; margin-left: 6px; }
.navi a.navi__kontakt:hover { background: var(--kiefer-tief); }

.menue-knopf { display: none; align-items: center; gap: 10px; background: none; border: 1px solid var(--linie); border-radius: 999px;
  padding: 8px 14px; font: 700 .85rem/1 var(--sans); color: var(--tinte); cursor: pointer; }
.menue-knopf__striche, .menue-knopf__striche::before { display: block; width: 16px; height: 2px; background: currentColor; position: relative; transition: transform .25s; }
.menue-knopf__striche::before { content: ""; position: absolute; top: 5px; left: 0; }
.menue-knopf__striche { top: -2.5px; }
.menue-knopf[aria-expanded="true"] .menue-knopf__striche { transform: translateY(2.5px) rotate(45deg); }
.menue-knopf[aria-expanded="true"] .menue-knopf__striche::before { transform: translateY(-5px) rotate(-90deg); }

/* Horizont: dünne Linie unter dem Kopf, die Sonne wandert mit dem Lesen */
.horizont { position: relative; height: 1px; background: var(--linie); }
.horizont__sonne { position: absolute; top: -3.5px; left: 0; width: 8px; height: 8px; border-radius: 50%; background: var(--sonne);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--sonne) 22%, transparent);
  transform: translateX(calc(var(--horizont) * (100vw - 8px))); }

/* ---------- Morgen (Einstieg) ---------- */
.morgen { max-width: var(--breite); margin: 0 auto; padding: clamp(48px, 9vw, 120px) var(--rand) clamp(40px, 6vw, 80px);
  display: grid; grid-template-columns: 1.15fr .85fr; gap: clamp(24px, 5vw, 72px); align-items: center; }
.morgen__titel { font-size: clamp(2.9rem, 1.4rem + 6.2vw, 6.4rem); font-weight: 380; line-height: 1; letter-spacing: -.025em;
  font-variation-settings: "opsz" 72; color: var(--kiefer); margin-bottom: 1.8rem; }
.morgen__titel .zeile { display: block; }
.morgen__titel em { font-weight: 330; color: var(--ton); font-variation-settings: "opsz" 72; }
.morgen__titel .zeile:first-child em { color: var(--kiefer); }
.morgen__lead { font-size: clamp(1.08rem, 1rem + .35vw, 1.25rem); max-width: 34em; color: var(--grau); }
.morgen__aktion { display: flex; flex-wrap: wrap; gap: 14px 26px; align-items: center; margin-top: 2.2rem; }
.knopf { display: inline-block; background: var(--kiefer); color: #fff; text-decoration: none; padding: 14px 26px; border-radius: 999px; font-weight: 700; transition: background .2s, transform .2s; }
.knopf:hover { background: var(--kiefer-tief); transform: translateY(-1px); }
.verweis { color: var(--kiefer); font-weight: 700; text-decoration: underline; text-decoration-color: var(--sonne); text-decoration-thickness: 2px; text-underline-offset: 6px; }
.verweis:hover { text-decoration-color: var(--ton); }

.morgen__bild { margin: 0; }
.morgen__bild svg { width: 100%; height: auto; overflow: visible; }
.kreise circle { fill: none; stroke: var(--linie); stroke-width: 1.2; }
.sonne { fill: var(--sonne); }
.horizontlinie { stroke: var(--kiefer); stroke-width: 1.5; stroke-linecap: round; }
.schale { fill: none; stroke: var(--kiefer); stroke-width: 18; stroke-linecap: round; }

@media (prefers-reduced-motion: no-preference) {
  .sonne, .glut { animation: aufgehen 2.6s cubic-bezier(.2,.7,.2,1) .2s both; }
  .kreise circle { transform-origin: 240px 300px; animation: atmen 9s ease-in-out infinite; }
  .kreise circle:nth-child(2) { animation-delay: -3s; }
  .kreise circle:nth-child(3) { animation-delay: -6s; }
  .morgen__titel .zeile { animation: steigen 1s cubic-bezier(.2,.7,.2,1) both; }
  .morgen__titel .zeile:nth-child(2) { animation-delay: .15s; }
  .morgen__titel .zeile:nth-child(3) { animation-delay: .3s; }
}
@keyframes aufgehen { from { transform: translateY(120px); } to { transform: translateY(0); } }
@keyframes atmen { 0%, 100% { opacity: .35; transform: scale(.98); } 50% { opacity: 1; transform: scale(1.02); } }
@keyframes steigen { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }

/* ---------- Kürzel ---------- */
.kuerzel { border-block: 1px solid var(--linie); background: var(--papier-tief); }
.kuerzel__reihe { list-style: none; margin: 0 auto; max-width: var(--breite); padding: clamp(28px, 4vw, 44px) var(--rand);
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.kuerzel__reihe li { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.buchstabe { font: 400 clamp(2.6rem, 1.6rem + 3.5vw, 4.6rem)/.9 var(--serif); font-style: italic; color: var(--ton);
  font-variation-settings: "opsz" 72; }
.kuerzel__reihe li:nth-child(1) .buchstabe, .kuerzel__reihe li:nth-child(5) .buchstabe { color: var(--kiefer); }
.wort { font-size: .9rem; letter-spacing: .04em; color: var(--grau); }

/* ---------- Abschnitte ---------- */
.abschnitt-kopf { max-width: 44rem; margin-bottom: clamp(36px, 5vw, 64px); }
.abschnitt-kopf h2 { color: var(--kiefer); margin-bottom: 1.1rem; }
.abschnitt-kopf__lead { font-size: 1.15rem; color: var(--grau); }

.auftrag, .wirken, .verein { max-width: var(--breite); margin: 0 auto; padding: clamp(72px, 10vw, 140px) var(--rand); }

/* Drei Verben */
.verben { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; counter-reset: verb; }
.verb { display: grid; grid-template-columns: 180px 1fr; gap: clamp(20px, 4vw, 64px); align-items: start;
  padding: clamp(32px, 4vw, 52px) 0; border-top: 1px solid var(--linie); }
.verb:last-child { border-bottom: 1px solid var(--linie); }
.verb__zeichen { width: 100%; max-width: 180px; aspect-ratio: 1; border-radius: 50%; background: var(--salbei); display: grid; place-items: center; }
.verb__zeichen svg { width: 66%; height: auto; overflow: visible; }
.verb__text { display: grid; grid-template-columns: 4rem 1fr; column-gap: 12px; max-width: 46rem; }
.verb__text > * { grid-column: 2; }
.verb__nr { grid-column: 1; grid-row: 1 / span 2; font: 700 .8rem/2.6 var(--sans); letter-spacing: .12em; color: var(--ton); }
.verb__titel { font-size: clamp(2.2rem, 1.5rem + 2.8vw, 3.6rem); font-weight: 360; color: var(--kiefer);
  font-variation-settings: "opsz" 72; }
.verb__unter { font: 700 1rem/1.4 var(--sans); color: var(--ton); margin: .5rem 0 1rem; }
.verb__text p:last-child { color: var(--tinte); font-size: 1.08rem; }

.z-boden { stroke: var(--kiefer); stroke-width: 3; stroke-linecap: round; }
.z-wurzel { fill: none; stroke: var(--ton); stroke-width: 3; stroke-linecap: round; }
.z-trieb { fill: none; stroke: var(--kiefer); stroke-width: 4; stroke-linecap: round; }
.z-blatt { fill: var(--kiefer); }
.z-dach { fill: none; stroke: var(--kiefer); stroke-width: 7; stroke-linecap: round; stroke-linejoin: round; }
.z-kern { fill: var(--sonne); }
.z-waerme { fill: var(--sonne); opacity: .28; }
.z-schale { fill: none; stroke: var(--kiefer); stroke-width: 8; stroke-linecap: round; }

@media (prefers-reduced-motion: no-preference) {
  .js .verb .z-trieb, .js .verb .z-wurzel { stroke-dasharray: 80; stroke-dashoffset: 80; transition: stroke-dashoffset 1.4s cubic-bezier(.3,.6,.2,1) .2s; }
  .js .verb .z-blatt { transform-box: fill-box; transform-origin: 100% 100%; transform: scale(0); transition: transform .9s cubic-bezier(.3,.6,.2,1) 1s; }
  .js .verb .z-blatt + .z-blatt { transform-origin: 0 100%; transition-delay: 1.2s; }
  .js .verb .z-dach { stroke-dasharray: 130; stroke-dashoffset: 130; transition: stroke-dashoffset 1.3s cubic-bezier(.3,.6,.2,1) .2s; }
  .js .verb .z-waerme { transform-box: fill-box; transform-origin: center; transform: scale(.4); transition: transform 1.6s cubic-bezier(.3,.6,.2,1) .3s; }
  .js .verb.ist-sichtbar .z-trieb, .js .verb.ist-sichtbar .z-wurzel, .js .verb.ist-sichtbar .z-dach { stroke-dashoffset: 0; }
  .js .verb.ist-sichtbar .z-blatt, .js .verb.ist-sichtbar .z-waerme { transform: scale(1); }

  .js [data-zeigen] { opacity: 0; transform: translateY(22px); transition: opacity .9s ease, transform .9s cubic-bezier(.2,.7,.2,1); }
  .js [data-zeigen].ist-sichtbar { opacity: 1; transform: none; }
}

/* ---------- Haltung ---------- */
.haltung { background: var(--kiefer); color: #EEF1EA; padding: clamp(80px, 11vw, 150px) var(--rand); }
.haltung > * { max-width: var(--breite); margin-inline: auto; }
.haltung__satz { margin-bottom: clamp(48px, 7vw, 88px); }
.haltung__satz h2 { font-size: clamp(2.2rem, 1.2rem + 4.2vw, 4.6rem); font-weight: 340; max-width: 17em; color: #FBF7F0;
  font-variation-settings: "opsz" 72; }
.haltung__lead { font-size: 1.15rem; max-width: 38em; margin-top: 1.6rem; color: #D6DDD6; }
.grundsaetze { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; border-top: 1px solid rgba(255,255,255,.18); }
.grundsaetze li { padding: 28px 28px 8px 0; }
.grundsaetze li + li { padding-left: 28px; border-left: 1px solid rgba(255,255,255,.18); }
.grundsaetze h3 { font-size: 1.45rem; font-weight: 450; color: var(--sonne-hell); margin-bottom: .7rem; font-variation-settings: "opsz" 48; }
.grundsaetze p { color: #D6DDD6; font-size: 1rem; }

/* ---------- Wo wir wirken ---------- */
.laender { display: grid; grid-template-columns: 1fr minmax(80px, 200px) 1fr; align-items: stretch; gap: 16px; }
.laender__bruecke { align-self: center; }
.land { background: #fff; border: 1px solid var(--linie); border-radius: 22px; padding: clamp(28px, 4vw, 44px); }
.land__zeichen { width: 56px; height: 56px; margin-bottom: 20px; }
.land__zeichen circle { fill: none; stroke: var(--kiefer); stroke-width: 2; }
.land__zeichen .land__punkt { fill: var(--sonne); stroke: none; }
.land h3 { font-size: clamp(1.9rem, 1.4rem + 1.6vw, 2.6rem); font-weight: 400; color: var(--kiefer); margin-bottom: .7rem; font-variation-settings: "opsz" 72; }
.land p { color: var(--grau); }
.laender__bruecke svg { width: 100%; height: 60px; overflow: visible; }
.laender__bruecke path { fill: none; stroke: var(--ton); stroke-width: 2; stroke-dasharray: 2 8; stroke-linecap: round; vector-effect: non-scaling-stroke; }

/* ---------- Verein ---------- */
.verein { padding-top: 0; }
.verein__raster { display: grid; grid-template-columns: 1.2fr 1fr; gap: clamp(24px, 5vw, 72px); align-items: start; }
.fakten { margin: 0; display: grid; gap: 0; }
.fakten div { display: grid; grid-template-columns: 11rem 1fr; gap: 16px; padding: 18px 0; border-top: 1px solid var(--linie); }
.fakten div:last-child { border-bottom: 1px solid var(--linie); }
.fakten dt { font-size: .82rem; letter-spacing: .1em; text-transform: uppercase; color: var(--grau); padding-top: 3px; }
.fakten dd { margin: 0; }
.vorstand { background: var(--salbei); border-radius: 22px; padding: clamp(26px, 3.5vw, 40px); }
.vorstand h3 { font-size: 1.6rem; font-weight: 420; color: var(--kiefer); margin-bottom: 1rem; }
.vorstand ul { list-style: none; margin: 0; padding: 0; }
.vorstand li { display: flex; flex-direction: column; padding: 12px 0; border-top: 1px solid rgba(34,64,58,.16); }
.vorstand__name { font: 400 1.3rem/1.3 var(--serif); font-variation-settings: "opsz" 36; }
.vorstand__amt { font-size: .95rem; color: var(--grau); }

/* ---------- Kontakt ---------- */
.kontakt { position: relative; overflow: hidden; background: var(--kiefer-tief); color: #EEF1EA; padding: clamp(80px, 11vw, 150px) var(--rand) clamp(150px, 18vw, 230px); }
.kontakt__innen { position: relative; z-index: 1; max-width: var(--breite); margin: 0 auto; }
.kontakt h2 { font-size: clamp(2.4rem, 1.4rem + 4.6vw, 5rem); font-weight: 340; color: #FBF7F0; font-variation-settings: "opsz" 72; }
.kontakt__lead { font-size: 1.15rem; max-width: 36em; margin: 1.4rem 0 2.6rem; color: #D6DDD6; }
.kontakt__wege { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 20px 56px; }
.kontakt__wege li { display: flex; flex-direction: column; gap: 4px; }
.kontakt__art { font-size: .78rem; letter-spacing: .14em; text-transform: uppercase; color: var(--sonne-hell); font-weight: 700; }
.kontakt__wege a { font: 400 clamp(1.5rem, 1.1rem + 1.8vw, 2.3rem)/1.2 var(--serif); color: #fff; text-decoration: none;
  border-bottom: 1px solid rgba(255,255,255,.3); padding-bottom: 4px; font-variation-settings: "opsz" 72; transition: border-color .2s; }
.kontakt__wege a:hover { border-color: var(--sonne-hell); }
.kontakt :focus-visible { outline-color: var(--sonne-hell); }
.kontakt__sonne { position: absolute; left: 50%; bottom: 0; width: min(760px, 130vw); height: auto; transform: translateX(-50%); pointer-events: none; }
.kontakt__sonne circle { fill: var(--sonne); opacity: .9; }
.kontakt__sonne .ring { fill: none; stroke: var(--sonne); stroke-width: 1; opacity: .25; }

/* ---------- Fuss ---------- */
.fuss { background: var(--papier); padding: 44px var(--rand) 28px; }
.fuss__zeile { max-width: var(--breite); margin: 0 auto; display: grid; grid-template-columns: auto 1fr auto; gap: 18px 36px; align-items: center; }
.marke--fuss { margin-right: 0; }
.fuss__name { font-size: .92rem; color: var(--grau); }
.fuss__links { list-style: none; margin: 0; padding: 0; display: flex; gap: 22px; }
.fuss__links a { color: var(--tinte); text-underline-offset: 4px; }
.auctor { max-width: var(--breite); margin: 28px auto 0; padding-top: 18px; border-top: 1px solid var(--linie); color: var(--grau); }

/* ---------- Rechtstexte ---------- */
.recht { max-width: 46rem; margin: 0 auto; padding: clamp(48px, 8vw, 110px) var(--rand) clamp(64px, 8vw, 110px); }
.recht h1 { font-size: clamp(2.6rem, 1.6rem + 4vw, 4.4rem); font-weight: 360; color: var(--kiefer); margin-bottom: 2rem;
  font-variation-settings: "opsz" 72; }
.recht h2 { font-size: 1.45rem; font-weight: 450; color: var(--kiefer); margin: 2.4rem 0 .7rem; font-variation-settings: "opsz" 36; }
.recht p, .recht address, .recht dl, .recht ul { margin: 0 0 1rem; }
.recht address { font-style: normal; }
.recht dl { display: grid; grid-template-columns: 9.5rem 1fr; gap: 6px 16px; }
.recht dt { color: var(--grau); }
.recht dd { margin: 0; }
.recht a { color: var(--ton); text-underline-offset: 3px; }
.recht .stand { margin-top: 3rem; font-size: .9rem; color: var(--grau); }

/* 404 */
.fehlt { max-width: var(--breite); margin: 0 auto; padding: clamp(64px, 12vw, 160px) var(--rand); display: grid; grid-template-columns: 1fr 280px; gap: 48px; align-items: center; }
.fehlt h1 { font-size: clamp(2.6rem, 1.6rem + 4vw, 4.6rem); font-weight: 360; color: var(--kiefer); margin-bottom: 1.2rem; font-variation-settings: "opsz" 72; }
.fehlt p:not(.kicker) { color: var(--grau); font-size: 1.15rem; margin-bottom: 2rem; max-width: 30em; }
.fehlt svg .schale { stroke-width: 16; }

/* ---------- Schmal ---------- */
@media (max-width: 960px) {
  .morgen { grid-template-columns: 1fr; }
  .morgen__bild { order: -1; max-width: 300px; margin: 0 auto -8px; }
  .grundsaetze { grid-template-columns: 1fr 1fr; }
  .grundsaetze li:nth-child(3) { padding-left: 0; border-left: 0; }
  .grundsaetze li:nth-child(n+3) { border-top: 1px solid rgba(255,255,255,.18); }
  .verein__raster { grid-template-columns: 1fr; }
}
@media (max-width: 820px) {
  .menue-knopf { display: inline-flex; }
  .navi { position: absolute; left: 0; right: 0; top: 100%; background: var(--papier); border-bottom: 1px solid var(--linie);
    padding: 8px var(--rand) 20px; display: none; }
  .navi.ist-offen { display: block; }
  .navi ul { flex-direction: column; align-items: stretch; gap: 2px; }
  .navi a { padding: 12px 4px; border-radius: 0; font-size: 1.05rem; border-bottom: 1px solid var(--linie); }
  .navi a.navi__kontakt { margin: 12px 0 0; text-align: center; border-radius: 999px; border: 0; }
  html:not(.js) .navi { display: block; position: static; border: 0; padding: 0 0 8px; }
  html:not(.js) .menue-knopf { display: none; }
  html:not(.js) .kopf__zeile { flex-wrap: wrap; }
  .laender { grid-template-columns: 1fr; }
  .laender__bruecke { width: 60px; height: 70px; margin: -8px auto; }
  .laender__bruecke svg { width: 70px; height: 60px; transform: rotate(90deg) translateX(5px); }
}
@media (max-width: 640px) {
  body { font-size: 1.02rem; }
  .kuerzel__reihe { grid-template-columns: repeat(5, 1fr); gap: 4px; }
  .wort { font-size: .62rem; letter-spacing: .01em; hyphens: none; }
  .verb { grid-template-columns: 1fr; }
  .verb__zeichen { max-width: 104px; }
  .verb__text { grid-template-columns: 1fr; }
  .verb__text > *, .verb__nr { grid-column: 1; grid-row: auto; }
  .verb__nr { line-height: 1.4; margin-bottom: .3rem; }
  .grundsaetze { grid-template-columns: 1fr; }
  .grundsaetze li, .grundsaetze li + li { padding: 24px 0 8px; border-left: 0; }
  .grundsaetze li + li { border-top: 1px solid rgba(255,255,255,.18); }
  .fakten div { grid-template-columns: 1fr; gap: 2px; }
  .fuss__zeile { grid-template-columns: 1fr; }
  .recht dl { grid-template-columns: 1fr; gap: 0; }
  .recht dd { margin-bottom: .6rem; }
  .fehlt { grid-template-columns: 1fr; }
  .fehlt svg { max-width: 180px; order: -1; }
}

/* Herstellerhinweis (Vorlage cctest/vorlagen/csl-atthis-signum/signum.css) */
.csl-atthis-signum {
  display: inline-flex; align-items: center; gap: 6px;
  font: 400 11px/1.4 system-ui, -apple-system, "Segoe UI", sans-serif; letter-spacing: 0.02em;
  text-transform: none; color: inherit; text-decoration: none; border: 0;
}
.csl-atthis-signum span { opacity: 0.6; transition: opacity 0.2s; }
.csl-atthis-signum svg { display: block; flex: none; opacity: 0.9; }
.csl-atthis-signum:hover span, .csl-atthis-signum:focus-visible span { opacity: 0.95; }

/* Unterseiten: nur der Rückweg, auch auf dem Handy sichtbar */
@media (max-width: 820px) {
  .navi--schlicht { display: block; position: static; background: none; border: 0; padding: 0; }
  .navi--schlicht a { border: 0; padding: 8px 0; font-size: .95rem; }
}

/* Flächen mit Aussenabstand: Innenbreite an Kopf und Abschnitte angleichen */
.haltung > *, .kontakt__innen, .fuss__zeile, .auctor { max-width: calc(var(--breite) - 2 * var(--rand)); }