:root {
  color-scheme: light dark;
  --abstand-gross: clamp(6rem, 3.5rem + 8vw, 11rem);
  --abstand-klein: clamp(2rem, 1.5rem + 2vw, 3rem);
  --abstand-knapp: 1rem;
  --abstand-mittel: clamp(4rem, 2.5rem + 5vw, 7rem);
  --breite: 90rem;
  --breite-schmal: 42rem;
  --breite-weit: none;
  --dachzeile-abstand: clamp(1rem, 0.6rem + 1vw, 1.5rem);
  --dachzeile-farbe: var(--text);
  --dachzeile-gewicht: 400;
  --dachzeile-groesse: 0.875rem;
  --dachzeile-laufweite: normal;
  --dachzeile-schreibweise: none;
  --einheit: 0.5rem;
  --einheit-flaeche: var(--einheit);
  --einleitung-breite: 42ch;
  --einleitung-farbe: var(--text);
  --einleitung-gewicht: var(--gewicht-text);
  --einleitung-groesse: clamp(1.013rem, 0.945rem + 0.27vw, 1.238rem);
  --gewicht-betont: 500;
  --gewicht-display: var(--gewicht-h1);
  --gewicht-fett: 600;
  --gewicht-h1: 800;
  --gewicht-text: 300;
  --gewicht-titel: 300;
  --groesse-h1: clamp(2.75rem, 0.5rem + 8.5vw, 10rem);
  --groesse-h2: clamp(1.625rem, 1rem + 2vw, 2.75rem);
  --groesse-h3: clamp(0.9rem, 0.8rem + 0.4vw, 1.2rem);
  --groesse-hero-gross: clamp(3.5rem, 1rem + 11vw, 15rem);
  --groesse-hero-riesig: clamp(4.5rem, 1rem + 17vw, 24rem);
  --groesse-klein: 0.8125rem;
  --groesse-text: clamp(1rem, 0.96rem + 0.2vw, 1.0625rem);
  --kasten-abstand: 2rem;
  --kasten-radius: 1rem;
  --kasten-schatten-deckkraft: 16%;
  --kasten-schatten-groesse: 0px;
  --kasten-schatten-unschaerfe: 48px;
  --kasten-schatten-y: 16px;
  --knopf-grund: var(--text);
  --knopf-text: var(--grund);
  --kopftitel-farbe: var(--akzent-text);
  --kopftitel-groesse: clamp(1.25rem, 0.75rem + 2.2vw, 2.5rem);
  --laufweite-display: var(--laufweite-h1);
  --laufweite-h1: normal;
  --laufweite-titel: -0.015em;
  --link-abstand: 0.25em;
  --link-dicke: 1px;
  --link-farbe: var(--text);
  --link-gewicht: var(--gewicht-betont);
  --marke-groesse: var(--groesse-text);
  --navigation-farbe: var(--text);
  --navigation-gewicht: 500;
  --navigation-groesse: 0.9375rem;
  --radius: 0.625rem;
  --radius-knopf: 0.5rem;
  --rand: clamp(1rem, 4vw, 4rem);
  --randtext-groesse: 0.625rem;
  --randtext-schreibung: uppercase;
  --randtext-sperrung: 0.25em;
  --schreibweise-display: var(--schreibweise-h1);
  --schreibweise-h1: none;
  --schreibweise-h2: none;
  --schrift-display: var(--schrift-titel);
  --schrift-text: "Inter Tight", system-ui, sans-serif;
  --schrift-titel: "Inter Tight", system-ui, sans-serif;
  --silbentrennung: auto;
  --text-breite: 85ch;
  --trennlinie-art: dotted;
  --zeile-display: 0.92;
  --zeile-h1: 1.05;
  --zeile-text: 1.55;
  --zeile-titel: 1.1;
  --akzent: #ff8361;
  --akzent-2: var(--akzent-text);
  --akzent-text: #d12d00;
  --auf-akzent: #3b3b3b;
  --auf-schleier: #ffffff;
  --flaeche: #ffffff;
  --gedaempft: #636363;
  --grund: #f6f6f6;
  --kasten-schatten-farbe: #000000;
  --linie: #cfcfcf;
  --schleier: rgba(20, 20, 20, 0.6);
  --seite-grund: #e4e4e4;
  --text: #1c1c1c;
  --titel-farbe-2: var(--text);
}
@media (prefers-color-scheme: dark) {
  :root {
    --akzent: #b3b3b3;
    --akzent-2: var(--akzent-text);
    --akzent-text: var(--akzent);
    --auf-akzent: #101010;
    --auf-schleier: #ffffff;
    --flaeche: #050505;
    --gedaempft: #a3a3a3;
    --grund: #101010;
    --kasten-schatten-farbe: #000000;
    --linie: #2c2c2c;
    --schleier: rgba(10, 10, 10, 0.6);
    --seite-grund: #050505;
    --text: #f1f1f1;
    --titel-farbe-2: var(--text);
  }
}
:root[data-farbe="hell"] {
  color-scheme: light;
  --akzent: #ff8361;
  --akzent-2: var(--akzent-text);
  --akzent-text: #d12d00;
  --auf-akzent: #3b3b3b;
  --auf-schleier: #ffffff;
  --flaeche: #ffffff;
  --gedaempft: #636363;
  --grund: #f6f6f6;
  --kasten-schatten-farbe: #000000;
  --linie: #cfcfcf;
  --schleier: rgba(20, 20, 20, 0.6);
  --seite-grund: #e4e4e4;
  --text: #1c1c1c;
  --titel-farbe-2: var(--text);
}
:root[data-farbe="dunkel"] {
  color-scheme: dark;
  --akzent: #b3b3b3;
  --akzent-2: var(--akzent-text);
  --akzent-text: var(--akzent);
  --auf-akzent: #101010;
  --auf-schleier: #ffffff;
  --flaeche: #050505;
  --gedaempft: #a3a3a3;
  --grund: #101010;
  --kasten-schatten-farbe: #000000;
  --linie: #2c2c2c;
  --schleier: rgba(10, 10, 10, 0.6);
  --seite-grund: #050505;
  --text: #f1f1f1;
  --titel-farbe-2: var(--text);
}
.grund--invers, .invers-offen:popover-open {
  color-scheme: dark;
  --akzent: #b3b3b3;
  --akzent-2: var(--akzent-text);
  --akzent-text: var(--akzent);
  --auf-akzent: #101010;
  --auf-schleier: #ffffff;
  --flaeche: #050505;
  --gedaempft: #a3a3a3;
  --grund: #101010;
  --kasten-schatten-farbe: #000000;
  --linie: #2c2c2c;
  --schleier: rgba(10, 10, 10, 0.6);
  --seite-grund: #050505;
  --text: #f1f1f1;
  --titel-farbe-2: var(--text);
}
@media (prefers-color-scheme: dark) {
:root:not([data-farbe="hell"]) .grund--invers, :root:not([data-farbe="hell"]) .invers-offen:popover-open {
  color-scheme: light;
  --akzent: #ff8361;
  --akzent-2: var(--akzent-text);
  --akzent-text: #d12d00;
  --auf-akzent: #3b3b3b;
  --auf-schleier: #ffffff;
  --flaeche: #ffffff;
  --gedaempft: #636363;
  --grund: #f6f6f6;
  --kasten-schatten-farbe: #000000;
  --linie: #cfcfcf;
  --schleier: rgba(20, 20, 20, 0.6);
  --seite-grund: #e4e4e4;
  --text: #1c1c1c;
  --titel-farbe-2: var(--text);
}
}
:root[data-farbe="dunkel"] .grund--invers, :root[data-farbe="dunkel"] .invers-offen:popover-open {
  color-scheme: light;
  --akzent: #ff8361;
  --akzent-2: var(--akzent-text);
  --akzent-text: #d12d00;
  --auf-akzent: #3b3b3b;
  --auf-schleier: #ffffff;
  --flaeche: #ffffff;
  --gedaempft: #636363;
  --grund: #f6f6f6;
  --kasten-schatten-farbe: #000000;
  --linie: #cfcfcf;
  --schleier: rgba(20, 20, 20, 0.6);
  --seite-grund: #e4e4e4;
  --text: #1c1c1c;
  --titel-farbe-2: var(--text);
}
:root[data-farbe="hell"] .grund--invers, :root[data-farbe="hell"] .invers-offen:popover-open {
  color-scheme: dark;
  --akzent: #b3b3b3;
  --akzent-2: var(--akzent-text);
  --akzent-text: var(--akzent);
  --auf-akzent: #101010;
  --auf-schleier: #ffffff;
  --flaeche: #050505;
  --gedaempft: #a3a3a3;
  --grund: #101010;
  --kasten-schatten-farbe: #000000;
  --linie: #2c2c2c;
  --schleier: rgba(10, 10, 10, 0.6);
  --seite-grund: #050505;
  --text: #f1f1f1;
  --titel-farbe-2: var(--text);
}
@font-face { font-family: "Inter Tight"; src: url("schriften/1266c17bda/InterTight-Thin.woff2") format("woff2"); font-weight: 100; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter Tight"; src: url("schriften/a4de1d4f00/InterTight-ExtraLight.woff2") format("woff2"); font-weight: 200; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter Tight"; src: url("schriften/58f55b4a36/InterTight-Light.woff2") format("woff2"); font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter Tight"; src: url("schriften/55e81c9c4b/InterTight-Regular.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter Tight"; src: url("schriften/335b70d046/InterTight-Medium.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter Tight"; src: url("schriften/9bbfab3651/InterTight-SemiBold.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter Tight"; src: url("schriften/b5336d29f0/InterTight-Bold.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter Tight"; src: url("schriften/13d468c584/InterTight-ExtraBold.woff2") format("woff2"); font-weight: 800; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter Tight"; src: url("schriften/04b39c0b80/InterTight-Black.woff2") format("woff2"); font-weight: 900; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter Tight"; src: url("schriften/da8556146c/InterTight-ThinItalic.woff2") format("woff2"); font-weight: 100; font-style: italic; font-display: swap; }
@font-face { font-family: "Inter Tight"; src: url("schriften/2fd72e60fd/InterTight-ExtraLightItalic.woff2") format("woff2"); font-weight: 200; font-style: italic; font-display: swap; }
@font-face { font-family: "Inter Tight"; src: url("schriften/e741ed8c4a/InterTight-LightItalic.woff2") format("woff2"); font-weight: 300; font-style: italic; font-display: swap; }
@font-face { font-family: "Inter Tight"; src: url("schriften/f086ddb6de/InterTight-Italic.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Inter Tight"; src: url("schriften/4a90042e95/InterTight-MediumItalic.woff2") format("woff2"); font-weight: 500; font-style: italic; font-display: swap; }
@font-face { font-family: "Inter Tight"; src: url("schriften/e400409cc4/InterTight-SemiBoldItalic.woff2") format("woff2"); font-weight: 600; font-style: italic; font-display: swap; }
@font-face { font-family: "Inter Tight"; src: url("schriften/552adb2e23/InterTight-BoldItalic.woff2") format("woff2"); font-weight: 700; font-style: italic; font-display: swap; }
@font-face { font-family: "Inter Tight"; src: url("schriften/9cff1d3ecb/InterTight-ExtraBoldItalic.woff2") format("woff2"); font-weight: 800; font-style: italic; font-display: swap; }
@font-face { font-family: "Inter Tight"; src: url("schriften/fe34bfe9ee/InterTight-BlackItalic.woff2") format("woff2"); font-weight: 900; font-style: italic; font-display: swap; }
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--grund);
  color: var(--text);
  font-family: var(--schrift-text);
  font-size: var(--groesse-text);
  font-weight: var(--gewicht-text);
  line-height: var(--zeile-text);
}
img, svg { display: block; max-width: 100%; height: auto; }
strong, b { font-weight: var(--gewicht-fett); }
a[data-mail] { text-decoration: underline; cursor: pointer; }
a { color: var(--link-farbe); text-underline-offset: var(--link-abstand); text-decoration-thickness: var(--link-dicke); }
:focus-visible { outline: 2px solid var(--akzent-text); outline-offset: 3px; }
h1, h2, h3, h4 { font-family: var(--schrift-titel); line-height: var(--zeile-titel); font-weight: var(--gewicht-titel); letter-spacing: var(--laufweite-titel); margin: 0 0 calc(var(--einheit) * 2); }
h1 { font-size: var(--groesse-h1); font-weight: var(--gewicht-h1); letter-spacing: var(--laufweite-h1); text-transform: var(--schreibweise-h1); line-height: var(--zeile-h1); }
h1, h2 { overflow-wrap: break-word; }
h1, h2, h3, h4 { hyphens: var(--silbentrennung); hyphenate-limit-chars: 10 4 4; text-wrap: balance; }
.silbentrennung--aus { --silbentrennung: manual; }
h2 { font-size: var(--groesse-h2); text-transform: var(--schreibweise-h2); }
h1.wie-h2 { font-size: var(--groesse-h2); font-weight: var(--gewicht-titel); letter-spacing: var(--laufweite-titel); text-transform: var(--schreibweise-h2); line-height: var(--zeile-titel); }
.titel-zeile-2 { display: block; color: var(--titel-farbe-2); }
.titel-zusatz { color: color-mix(in srgb, currentColor 22%, var(--grund)); }
h3 { font-size: var(--groesse-h3); }
h4 { font-size: var(--groesse-text); font-weight: var(--gewicht-titel); letter-spacing: normal; }
p, ul, ol, blockquote, pre { margin: 0 0 calc(var(--einheit) * 2); }
:where(p, ul, ol, blockquote, pre):last-child { margin-bottom: 0; }
blockquote { border-left: 3px solid var(--linie); padding-left: calc(var(--einheit) * 2); color: var(--gedaempft); }
code { font-size: 0.9em; background: var(--flaeche); padding: 0.1em 0.3em; border-radius: calc(var(--radius) / 2); }
pre { background: var(--flaeche); padding: calc(var(--einheit) * 2); border-radius: var(--radius); overflow-x: auto; }
pre code { background: none; padding: 0; }
hr { border: 0; border-top: 1px var(--trennlinie-art) var(--linie); margin: calc(var(--einheit) * 4) 0; }
.sprungmarke { position: absolute; left: -100vw; }
.sprungmarke:focus { left: var(--rand); top: var(--einheit); z-index: 10; background: var(--grund); padding: var(--einheit); }
.block { padding-inline: var(--rand); container-type: inline-size; }
.block > * { max-width: var(--breite); margin-inline: auto; }
.breite--schmal > * { max-width: var(--breite-schmal); }
.breite--weit > * { max-width: var(--breite-weit); }
.breite--voll > * { max-width: none; }
.breite--voll { padding-inline: 0; }
.fehlerseite { max-width: var(--breite-schmal); margin: 0 auto; padding: calc(var(--einheit) * 12) var(--rand); }
.abstand--keiner { padding-block: 0; }
.abstand--knapp { padding-block: var(--abstand-knapp); }
.abstand--klein { padding-block: var(--abstand-klein); }
.abstand--mittel { padding-block: var(--abstand-mittel); }
.abstand--gross { padding-block: var(--abstand-gross); }
.abstand-oben--keiner { padding-block-start: 0; }
.abstand-oben--knapp { padding-block-start: var(--abstand-knapp); }
.abstand-oben--klein { padding-block-start: var(--abstand-klein); }
.abstand-oben--mittel { padding-block-start: var(--abstand-mittel); }
.abstand-oben--gross { padding-block-start: var(--abstand-gross); }
.abstand-unten--keiner { padding-block-end: 0; }
.abstand-unten--knapp { padding-block-end: var(--abstand-knapp); }
.abstand-unten--klein { padding-block-end: var(--abstand-klein); }
.abstand-unten--mittel { padding-block-end: var(--abstand-mittel); }
.abstand-unten--gross { padding-block-end: var(--abstand-gross); }
.grund--flaeche { background: var(--flaeche); }
.grund--akzent { background: var(--akzent); color: var(--auf-akzent); }
.grund--invers { background: var(--grund); color: var(--text); }
.grund--akzent a { color: inherit; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
.knopf {
  display: inline-block; padding: calc(var(--einheit) * 1.5) calc(var(--einheit) * 3);
  border: 2px solid var(--knopf-grund); border-radius: var(--radius-knopf); background: var(--knopf-grund); color: var(--knopf-text);
  font-weight: var(--gewicht-betont); line-height: var(--zeile-titel); text-decoration: none; transition: background 0.15s, color 0.15s;
}
.knopf:hover { background: transparent; color: var(--knopf-grund); }
.knopf--zweit { background: transparent; color: var(--knopf-grund); }
.knopf--zweit:hover { background: var(--knopf-grund); color: var(--knopf-text); }
.grund--akzent .knopf { border-color: var(--auf-akzent); background: var(--auf-akzent); color: var(--akzent); }
.grund--akzent .knopf:hover, .grund--akzent .knopf--zweit { background: transparent; color: var(--auf-akzent); }
.grund--akzent .knopf--zweit:hover { background: var(--auf-akzent); color: var(--akzent); }
.bildflaeche--verlauf { background: linear-gradient(135deg, var(--akzent), var(--flaeche)); }
.bildflaeche--akzent { background: var(--akzent); }
.bildflaeche--flaeche { background: var(--flaeche); }
.grund--flaeche .bildflaeche--flaeche { background: var(--grund); }
:root { --kante-hoehe: clamp(1.5rem, 4vw, 3.5rem); }
:is(.kante--schraeg, .kante--welle, .kante--zacken, .kante--spitze, .kante--spitze-schatten) {
  position: relative; z-index: 1;
  border-bottom: var(--kante-hoehe) solid transparent; margin-bottom: calc(var(--kante-hoehe) * -1);
}
:is(.kante--schraeg, .kante--welle, .kante--zacken, .kante--spitze, .kante--spitze-schatten) + .block { border-top: var(--kante-hoehe) solid transparent; }
:is(.kante--schraeg, .kante--welle, .kante--zacken, .kante--spitze, .kante--spitze-schatten):has(+ :is(.kante--schraeg, .kante--welle, .kante--zacken, .kante--spitze, .kante--spitze-schatten)) { z-index: 2; }
:is(.kante--schraeg, .kante--welle, .kante--zacken, .kante--spitze, .kante--spitze-schatten):has(+ :is(.kante--schraeg, .kante--welle, .kante--zacken, .kante--spitze, .kante--spitze-schatten) + :is(.kante--schraeg, .kante--welle, .kante--zacken, .kante--spitze, .kante--spitze-schatten)) { z-index: 3; }
:is(.kante--schraeg, .kante--welle, .kante--zacken, .kante--spitze, .kante--spitze-schatten):has(+ :is(.kante--schraeg, .kante--welle, .kante--zacken, .kante--spitze, .kante--spitze-schatten) + :is(.kante--schraeg, .kante--welle, .kante--zacken, .kante--spitze, .kante--spitze-schatten) + :is(.kante--schraeg, .kante--welle, .kante--zacken, .kante--spitze, .kante--spitze-schatten)) { z-index: 4; }
.kante--schraeg { clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--kante-hoehe)), 0 100%); }
.kante--spitze { clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--kante-hoehe)), 50% 100%, 0 calc(100% - var(--kante-hoehe))); }
.kante--spitze-schatten { clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--kante-hoehe) * 0.62), 50% 100%, 0 calc(100% - var(--kante-hoehe) * 0.62)); }
.kante--spitze-schatten::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: calc(var(--kante-hoehe) * -1); height: var(--kante-hoehe); pointer-events: none;
  background: color-mix(in srgb, var(--text) 50%, transparent);
  clip-path: polygon(0 0, 50% 100%, 100% 0, 100% 38%, 50% 100%, 0 38%);
}
.kante--welle {
  mask:
    linear-gradient(#000 0 0) top / 100% calc(100% - var(--kante-hoehe) + 1px) no-repeat,
    radial-gradient(circle var(--kante-hoehe) at 50% 0, #000 calc(100% - 1px), transparent 100%) bottom / calc(var(--kante-hoehe) * 2) var(--kante-hoehe) repeat-x;
}
.kante--zacken {
  mask:
    linear-gradient(#000 0 0) top / 100% calc(100% - var(--kante-hoehe) + 1px) no-repeat,
    conic-gradient(from -45deg at 50% 100%, #000 90deg, transparent 0) bottom / calc(var(--kante-hoehe) * 2) var(--kante-hoehe) repeat-x;
}
.netz--instagram { --netz: #e4405f; }
.netz--linkedin { --netz: #0a66c2; }
.netz--facebook { --netz: #0866ff; }
.netz--youtube { --netz: #ff0000; }
.netz--x { --netz: #000000; }
.netz--xing { --netz: #006567; }
.netz--behance { --netz: #1769ff; }
.netz--pinterest { --netz: #bd081c; }
.netz--tiktok { --netz: #000000; }
.netz--github { --netz: #181717; }
.netz--mastodon { --netz: #6364ff; }
.netz--vimeo { --netz: #1ab7ea; }
.bildlage--oben { object-position: 50% 0%; }
.bildlage--oberes-drittel { object-position: 50% 30%; }
.bildlage--mitte { object-position: 50% 50%; }
.bildlage--unteres-drittel { object-position: 50% 70%; }
.bildlage--unten { object-position: 50% 100%; }
@media (hover: hover) and (pointer: fine) {
  .ziehbar { cursor: grab; }
  .wird-gezogen { cursor: grabbing; user-select: none; scroll-snap-type: none !important; scroll-behavior: auto !important; }
  .wird-gezogen a, .wird-gezogen img { pointer-events: none; }
}
.nur-vorleser { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
@media (prefers-reduced-motion: no-preference) {
  :is(.mikro--sanft, .mikro--fuellen, .mikro--pfeil) :is(.karten__bildrahmen, .aufrufkarte) {
    transition: translate 0.35s cubic-bezier(0.2, 0.7, 0.2, 1), box-shadow 0.35s;
  }
  :is(.mikro--sanft, .mikro--fuellen, .mikro--pfeil) :is(.karten__karte:hover .karten__bildrahmen, .aufrufkarte:hover) {
    translate: 0 -0.25rem; box-shadow: 0 1rem 2.5rem rgb(0 0 0 / 0.12);
  }
  :is(.mikro--sanft, .mikro--fuellen, .mikro--pfeil):not(.block--kopf, .block--fuss) :is(p, li) > a:not(.knopf, .beitrag__link, .ohne-mikro) {
    font-weight: var(--link-gewicht); text-decoration: none; padding-bottom: 0.1em;
    background: linear-gradient(currentColor, currentColor) no-repeat 100% 100% / 0% var(--link-dicke);
    transition: background-size 0.4s cubic-bezier(0.2, 0.7, 0.2, 1);
  }
  :is(.mikro--sanft, .mikro--fuellen, .mikro--pfeil):not(.block--kopf, .block--fuss) :is(p, li) > a:not(.knopf, .beitrag__link, .ohne-mikro):is(:hover, :focus-visible) {
    background-position: 0 100%; background-size: 100% var(--link-dicke);
  }
  .mikro--fuellen:not(.grund--akzent, .variante--vollbild) .knopf:not(.aufrufkarte__knopf) {
    transition: color 0.3s, border-color 0.3s, background-size 0.4s cubic-bezier(0.2, 0.7, 0.2, 1);
  }
  .mikro--fuellen:not(.grund--akzent, .variante--vollbild) .knopf:not(.knopf--zweit, .aufrufkarte__knopf) {
    background: linear-gradient(var(--akzent), var(--akzent)) no-repeat left / 0% 100% var(--knopf-grund);
  }
  .mikro--fuellen:not(.grund--akzent, .variante--vollbild) .knopf:not(.knopf--zweit, .aufrufkarte__knopf):hover {
    background: linear-gradient(var(--akzent), var(--akzent)) no-repeat left / 100% 100% var(--knopf-grund);
    color: var(--auf-akzent); border-color: var(--akzent);
  }
  .mikro--fuellen:not(.grund--akzent, .variante--vollbild) .knopf--zweit:not(.aufrufkarte__knopf) {
    background: linear-gradient(var(--knopf-grund), var(--knopf-grund)) no-repeat left / 0% 100%;
  }
  .mikro--fuellen:not(.grund--akzent, .variante--vollbild) .knopf--zweit:not(.aufrufkarte__knopf):hover { background-size: 100% 100%; color: var(--knopf-text); }
  .mikro--pfeil .knopf:not(.aufrufkarte__knopf)::after { content: "→"; display: inline-block; margin-left: 0.5em; transition: translate 0.25s cubic-bezier(0.2, 0.7, 0.2, 1); }
  .mikro--pfeil .knopf:not(.aufrufkarte__knopf):hover::after { translate: 0.3em 0; }
  .mikro--pfeil:not(.grund--akzent, .variante--vollbild) .knopf:not(.knopf--zweit, .aufrufkarte__knopf):hover { background: var(--knopf-grund); color: var(--knopf-text); border-color: var(--knopf-grund); }
  .mikro--pfeil:not(.grund--akzent, .variante--vollbild) .knopf--zweit:not(.aufrufkarte__knopf):hover { background: transparent; color: var(--knopf-grund); }
}
:root:has(.mit-kasten) {
  --kasten-breite: calc(var(--breite) + 2 * var(--rand));
  --kasten-platz: calc((100vw - var(--kasten-breite) - 2 * var(--einheit)) * 1000);
  --kasten-luft: clamp(0px, var(--kasten-platz), var(--kasten-abstand));
  --kasten-ecke: clamp(0px, var(--kasten-platz), var(--kasten-radius));
  --kasten-schatten: 0 var(--kasten-schatten-y) var(--kasten-schatten-unschaerfe) var(--kasten-schatten-groesse)
    color-mix(in srgb, var(--kasten-schatten-farbe) var(--kasten-schatten-deckkraft), transparent);
}
.mit-kasten { background: var(--seite-grund); }
.mit-kasten > main,
:is(.kasten--alles, .kasten--ohne-fuss) > .block--kopf,
.kasten--ohne-kopf > footer { max-width: var(--kasten-breite); margin-inline: auto; }
.kasten--alles > footer { max-width: var(--kasten-breite); margin-inline: auto; }
:is(.kasten--alles, .kasten--ohne-fuss) { position: relative; padding-block: var(--kasten-luft); }
:is(.kasten--alles, .kasten--ohne-fuss)::before {
  content: ""; position: absolute; z-index: -1; top: var(--kasten-luft); bottom: var(--kasten-luft); pointer-events: none;
  left: max(0px, (100% - var(--kasten-breite)) / 2); right: max(0px, (100% - var(--kasten-breite)) / 2);
  background: var(--grund); border-radius: var(--kasten-ecke); box-shadow: var(--kasten-schatten);
}
.kasten--ohne-fuss > footer { position: absolute; top: 100%; left: 0; right: 0; }
:is(.kasten--ohne-kopf, .kasten--inhalt) > main { position: relative; margin-top: var(--kasten-luft); background: var(--grund); }
.kasten--inhalt > main { margin-bottom: var(--kasten-luft); border-radius: var(--kasten-ecke); }
.kasten--ohne-kopf > main { border-radius: var(--kasten-ecke) var(--kasten-ecke) 0 0; }
.kasten--ohne-kopf > footer { position: relative; margin-bottom: var(--kasten-luft); background: var(--grund); border-radius: 0 0 var(--kasten-ecke) var(--kasten-ecke); }
:is(.kasten--ohne-kopf, .kasten--inhalt) > main::before, .kasten--ohne-kopf > footer::before {
  content: ""; position: absolute; z-index: -1; inset: 0; border-radius: inherit; box-shadow: var(--kasten-schatten); pointer-events: none;
}
:is(.kasten--ohne-kopf, .kasten--inhalt) > main > :first-child,
:is(.kasten--alles, .kasten--ohne-fuss):has(> main > .block--hero:first-child .hero--voll) > main > :first-child,
:is(.kasten--alles, .kasten--ohne-fuss):has(> main > .block--hero.variante--vollbild:first-child):has(.kopf--ueber) > main > :first-child {
  border-top-left-radius: var(--kasten-ecke); border-top-right-radius: var(--kasten-ecke); overflow: clip;
}
:is(.kasten--ohne-fuss, .kasten--inhalt) > main > :last-child,
:is(.kasten--alles, .kasten--ohne-kopf) > footer > :last-child {
  border-bottom-left-radius: var(--kasten-ecke); border-bottom-right-radius: var(--kasten-ecke); overflow: clip;
}
:is(.kasten--alles, .kasten--ohne-fuss):has(.kopf--fixiert)::after {
  content: ""; position: fixed; z-index: 9; top: 0; pointer-events: none;
  left: max(0px, (100% - var(--kasten-breite)) / 2); right: max(0px, (100% - var(--kasten-breite)) / 2);
  height: calc(var(--kasten-luft) + var(--kasten-ecke));
  background:
    radial-gradient(circle at 100% 100%, transparent calc(var(--kasten-ecke) - 0.5px), var(--seite-grund) var(--kasten-ecke)) left bottom / var(--kasten-ecke) var(--kasten-ecke) no-repeat,
    radial-gradient(circle at 0 100%, transparent calc(var(--kasten-ecke) - 0.5px), var(--seite-grund) var(--kasten-ecke)) right bottom / var(--kasten-ecke) var(--kasten-ecke) no-repeat,
    linear-gradient(var(--seite-grund), var(--seite-grund)) top / 100% var(--kasten-luft) no-repeat;
}
@keyframes kasten-streifen { from { opacity: 0; } to { opacity: 1; } }
@supports (animation-timeline: scroll()) {
  :is(.kasten--alles, .kasten--ohne-fuss):has(.kopf--fixiert)::after {
    animation: kasten-streifen linear both; animation-timeline: scroll(root); animation-range: 0px 8px;
  }
}

@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    [data-bewegung="scroll"] > * {
      animation: bewegung-scroll linear both;
      animation-timeline: view();
      animation-range: entry 0% entry 90%;
    }
  }
}
@keyframes bewegung-scroll {
  from { opacity: 0; transform: translateY(3rem) scale(0.98); }
}
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    [data-bewegung="parallax"] { view-timeline: --parallax block; }
    [data-bewegung="parallax"]:is(.variante--vollbild) .hero__bild,
    [data-bewegung="parallax"] :is(.aufrufkarte__bild, .karten__bild) {
      animation: bewegung-parallax linear both; animation-timeline: --parallax; animation-range: cover;
    }
    [data-bewegung="parallax"] img.bildtext__bild,
    [data-bewegung="parallax"]:not(.variante--vollbild) img.hero__bild {
      animation: bewegung-ausschnitt linear both; animation-timeline: --parallax; animation-range: cover;
    }
  }
}
@keyframes bewegung-parallax {
  from { transform: translateY(-7%) scale(1.16); }
  to { transform: translateY(7%) scale(1.16); }
}
@keyframes bewegung-ausschnitt {
  from { object-position: 50% 15%; }
  to { object-position: 50% 85%; }
}
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    [data-bewegung="maske"] :is(h1, h2) {
      animation: bewegung-maske linear both; animation-timeline: view(); animation-range: entry 10% cover 35%;
    }
    [data-bewegung="maske"] :is(p, li, .knopf, img) {
      animation: bewegung-nach linear both; animation-timeline: view(); animation-range: entry 20% cover 30%;
    }
  }
}
@keyframes bewegung-maske {
  from { clip-path: inset(-0.5em -0.5em 100% -0.5em); transform: translateY(40%); opacity: 0; }
  to { clip-path: inset(-0.5em -0.5em -0.5em -0.5em); transform: none; opacity: 1; }
}
@keyframes bewegung-nach {
  from { opacity: 0; transform: translateY(1rem); }
}
@media (prefers-reduced-motion: no-preference) {
  .block[data-bewegung="stapel"] { position: sticky; top: var(--stapel-oben, 0px); }
  .block[data-bewegung="stapel"]:not(:has(+ .block[data-bewegung="stapel"])) { position: relative; }
  .block[data-bewegung="stapel"] ~ .block:not([data-bewegung="stapel"]) { position: relative; }
  :is(.block[data-bewegung="stapel"], .block[data-bewegung="stapel"] ~ .block):not(.grund--flaeche, .grund--akzent) { background: var(--grund); }
  .block[data-bewegung="stapel"] + .block[data-bewegung="stapel"] { box-shadow: 0 -1.5rem 3rem rgb(0 0 0 / 0.12); }
}
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    [data-bewegung="woerter"] :is(h1, h2) { view-timeline: --woerter block; }
    [data-bewegung="woerter"] .wort {
      animation: bewegung-wort linear both; animation-timeline: --woerter;
      animation-range: cover calc(10% + 35% * var(--i) / var(--n)) cover calc(20% + 35% * var(--i) / var(--n));
    }
  }
}
@keyframes bewegung-wort {
  from { opacity: 0.15; }
}
.vorhang > :first-child { position: relative; z-index: 1; }
.vorhang > .grund--standard:first-child { background: var(--grund); }
.vorhang > :last-child { position: sticky; bottom: 0; z-index: 0; }
@property --grund { syntax: "<color>"; inherits: true; initial-value: white; }
@property --text { syntax: "<color>"; inherits: true; initial-value: black; }
@property --gedaempft { syntax: "<color>"; inherits: true; initial-value: gray; }
@property --linie { syntax: "<color>"; inherits: true; initial-value: silver; }
@property --flaeche { syntax: "<color>"; inherits: true; initial-value: white; }
:root.farbwechsel { transition: --grund 0.6s ease, --text 0.6s ease, --gedaempft 0.6s ease, --linie 0.6s ease, --flaeche 0.6s ease; }
@media (prefers-reduced-motion: reduce) { :root.farbwechsel { transition-duration: 0.01s; } }
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .seitwaerts-an { min-height: calc(var(--hoehe) + var(--weg)); view-timeline: --seitwaerts block; overflow-x: clip; }
    .seitwaerts-an .karten { position: sticky; top: max(0px, calc((100svh - var(--hoehe)) / 2)); }
    .block.seitwaerts-an .karten.karten--band .karten__raster { overflow: visible; scroll-snap-type: none; animation: bewegung-seitwaerts linear both; animation-timeline: --seitwaerts; animation-range: contain 0% contain 100%; }
    [data-bewegung="tiefe"] { view-timeline: --tiefe block; overflow: clip; }
    [data-bewegung="tiefe"] > * { animation: bewegung-tiefe linear both; animation-timeline: --tiefe; animation-range: cover; }
  }
}
@keyframes bewegung-seitwaerts { to { transform: translateX(calc(-1 * var(--weg))); } }
@keyframes bewegung-tiefe { from { transform: translateY(3svh); } to { transform: translateY(-3svh); } }

.hero__effekt { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 1; }
@media screen and (prefers-reduced-motion: no-preference) {
  :root[data-js] .hero[data-effekt]:not([data-effekt="tinte"], .hero--effekt-aus) .hero__titel { -webkit-text-fill-color: transparent; animation: effekt-sicher 0.01s 2.5s both; }
  :root[data-js] .hero.hero--effekt-an[data-effekt]:not([data-effekt="tinte"], .hero--effekt-aus) .hero__titel { animation: none; }
}
@keyframes effekt-sicher { to { -webkit-text-fill-color: currentColor; opacity: 1; } }
@media print { .hero__effekt { display: none; } }
@media screen {
  .hero--effekt-an[data-effekt="morph"] { min-height: calc(var(--effekt-woerter, 1) * 100svh); }
  .hero--effekt-an[data-effekt="morph"] .hero__effekt { position: sticky; top: 0; height: 100svh; margin-bottom: -100svh; display: block; z-index: 2; }
  .hero--effekt-an[data-effekt="morph"] .hero__folien { position: sticky; top: 0; }
  .hero[data-effekt="tinte"] .hero__folie { position: relative; isolation: isolate; }
  .hero--effekt-an[data-effekt="tinte"] .hero__effekt { z-index: -1; }
  .hero--effekt-an[data-effekt="tinte"] .hero__inhalt { mix-blend-mode: difference; }
  .hero--effekt-an[data-effekt="tinte"] :is(.hero__titel, .hero__text, .hero__dachzeile, .hero__zeile, .hero__zeile--akzent) { color: #fff; }
}

@view-transition { navigation: auto; }
.block--kopf { view-transition-name: kopf; }
.leiste { view-transition-name: leiste; }
.nach-oben { view-transition-name: nach-oben; }
::view-transition-group(kopf), ::view-transition-group(leiste), ::view-transition-group(nach-oben),
::view-transition-old(kopf), ::view-transition-new(kopf) { animation-duration: 0.15s; }
@media (prefers-reduced-motion: reduce) {
  ::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*) { animation: none !important; }
}
::view-transition-old(root) { animation: 0.2s ease both seitenwechsel-aus; }
::view-transition-new(root) { animation: 0.25s ease 0.05s both seitenwechsel-ein; }
@keyframes seitenwechsel-aus { to { opacity: 0; } }
@keyframes seitenwechsel-ein { from { opacity: 0; } }

.fliesstext__text > :is(p, ul, ol) { max-width: var(--text-breite); }
.fliesstext__titel:where(h1) { font-size: min(var(--groesse-h1), 7.5cqi, calc(var(--breite) * 0.075)); }
.breite--schmal .fliesstext__titel:where(h1) { font-size: min(var(--groesse-h1), 7.5cqi, calc(var(--breite-schmal) * 0.075)); }
:is(.breite--weit, .breite--voll) .fliesstext__titel:where(h1) { font-size: min(var(--groesse-h1), 7.5cqi); }
.fliesstext__text :is(h2, h3, h4)[id] { scroll-margin-top: calc(var(--einheit) * 4); }
.verzeichnis { margin-block: 0 calc(var(--einheit) * 4); padding: calc(var(--einheit) * 2) calc(var(--einheit) * 3); border-left: 3px solid var(--akzent); background: var(--flaeche); border-radius: 0 var(--radius) var(--radius) 0; }
.grund--flaeche .verzeichnis { background: var(--grund); }
.grund--akzent .verzeichnis { background: var(--grund); color: var(--text); border-left-color: var(--akzent-text); }
.verzeichnis__titel { margin: 0 0 var(--einheit); font-weight: var(--gewicht-betont); }
.verzeichnis__liste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: calc(var(--einheit) * 0.75); }
.verzeichnis__eintrag--unter { padding-left: calc(var(--einheit) * 2.5); font-size: var(--groesse-klein); }
.verzeichnis a { text-decoration: none; }
.verzeichnis a:hover { text-decoration: underline; }
@container (min-width: 56rem) {
  .fliesstext--seitlich { display: grid; grid-template-columns: minmax(12rem, 1fr) 3fr; column-gap: calc(var(--einheit) * 6); align-items: start; }
  .fliesstext--seitlich > .fliesstext__titel { grid-column: 1 / -1; }
  .fliesstext--seitlich > .verzeichnis { position: sticky; top: calc(var(--einheit) * 4); margin: 0; }
}
.block:has(> .fliesstext--titel-linie) { overflow-x: clip; }
.fliesstext--titel-linie .fliesstext__titel { position: relative; width: fit-content; font-family: var(--schrift-titel); font-size: clamp(1.5rem, 1rem + 2vw, 2.8125rem); font-weight: var(--gewicht-h1); line-height: 1.2; text-transform: uppercase; }
.fliesstext--titel-linie .fliesstext__titel::before { content: ""; position: absolute; top: 0.6em; right: calc(100% + 0.9rem); width: 50vw; height: 1px; background: var(--linie); }
.fliesstext--versal :is(h2, h3):not(.fliesstext__titel) { font-family: var(--schrift-titel); font-size: clamp(1.25rem, 1rem + 0.9vw, 1.875rem); font-weight: 500; line-height: 1.3; text-transform: uppercase; color: var(--text); }
.fliesstext--haken ul { list-style: none; padding-inline-start: 0; }
.fliesstext--haken ul > li { position: relative; padding-inline-start: 3.4em; margin-block: 1.1em; min-height: 2.6em; padding-block-start: 0.55em; }
.fliesstext--haken ul > li::before { content: ""; position: absolute; left: 0; top: 0; width: 2.6em; aspect-ratio: 1; border-radius: 0.35em; background: var(--akzent); }
.fliesstext--haken ul > li::after { content: ""; position: absolute; left: 0.7em; top: 0.75em; width: 1.1em; height: 0.55em; border-left: 0.3em solid #fff; border-bottom: 0.3em solid #fff; rotate: -45deg; }

.fuss { color: var(--gedaempft); font-size: var(--groesse-klein); }
.fuss a { color: var(--gedaempft); text-decoration: none; }
.fuss a:hover, .fuss a[aria-current="page"] { color: var(--text); text-decoration: underline; }
.fuss__name { color: var(--text); font-weight: var(--gewicht-betont); }
.fuss__kontakt { font-style: normal; }
.fuss__titel { font-size: var(--groesse-klein); font-family: var(--schrift-text); color: var(--text); margin-bottom: var(--einheit); }
.fuss--titel-gross .fuss__titel { text-transform: uppercase; letter-spacing: 0.06em; }
.fuss__liste, .fuss__links { list-style: none; margin: 0; padding: 0; }
.fuss__liste li + li { margin-top: calc(var(--einheit) * 0.5); }
.fuss__wege { display: flex; flex-direction: column; align-items: flex-start; gap: calc(var(--einheit) * 0.5); margin-top: var(--einheit); }
.fuss__spalten { display: grid; grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); gap: calc(var(--einheit) * 4); }
.fuss__zeile { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--einheit) calc(var(--einheit) * 3); }
.fuss__spalten + .fuss__zeile { margin-top: calc(var(--einheit) * 4); padding-top: calc(var(--einheit) * 2); border-top: 1px var(--trennlinie-art) var(--linie); }
.fuss__links { display: flex; flex-wrap: wrap; align-items: center; }
.fuss__links li + li::before { content: "|"; color: var(--linie); margin-inline: calc(var(--einheit) * 1.5); }
.fuss__haus { display: flex; }
.fuss .fuss__monogramm {
  display: inline-block; margin-bottom: calc(var(--einheit) * 4); color: var(--text); text-decoration: none;
  font-family: var(--schrift-titel); font-size: var(--groesse-h1); font-weight: var(--gewicht-h1); letter-spacing: var(--laufweite-h1); line-height: 0.9;
}
.fuss .fuss__monogramm:hover { color: var(--text); text-decoration: none; }
@supports (animation-timeline: scroll()) {
  @media (prefers-reduced-motion: no-preference) {
    .monogramm-an .fuss__monogramm--steigen { overflow: clip; padding-block: 0.1em; margin-top: -0.1em; margin-bottom: calc(var(--einheit) * 4 - 0.1em); }
    .monogramm-an .fuss__monogramm--steigen .fuss__monogramm-text {
      display: block; animation: fuss-monogramm linear both; animation-timeline: scroll(root block);
    }
  }
}
@keyframes fuss-monogramm { from { transform: translateY(100%); } to { transform: none; } }
@media (prefers-reduced-motion: no-preference) {
  .monogramm-an .fuss__monogramm--zeichen .fuss__zeichen { display: inline-block; opacity: 0; }
  .monogramm-an .fuss__monogramm--zeichen.laeuft .fuss__zeichen { animation: fuss-zeichen 0.6s cubic-bezier(0.2, 0.7, 0.2, 1) both; animation-delay: calc(var(--i, 0) * 0.12s); }
}
@keyframes fuss-zeichen { from { opacity: 0; transform: translateY(0.35em); } to { opacity: 1; transform: none; } }
.fuss__zeile:has(.fuss__social) { justify-content: flex-start; }
.fuss__social { display: flex; flex-wrap: wrap; align-items: center; gap: calc(var(--einheit) * 2.5); list-style: none; margin: 0 0 0 auto; padding: 0; }
.fuss .fuss__social a { display: inline-flex; color: var(--text); opacity: 0.7; transition: opacity 0.15s; }
.fuss .fuss__social a:hover { color: var(--text); opacity: 1; text-decoration: none; }
.fuss__social svg { width: 1.25rem; height: 1.25rem; fill: currentColor; }
.fuss__haus svg { width: 1.2em; height: 1.2em; }
.fuss__wortmarke {
  margin: calc(var(--einheit) * 6) 0 0; padding-bottom: 0.06em; overflow: clip; color: var(--text);
  font-family: var(--schrift-display); font-weight: var(--gewicht-display); letter-spacing: var(--laufweite-display);
  text-transform: var(--schreibweise-display); line-height: var(--zeile-display); font-size: min(var(--groesse-hero-riesig), 20vw);
  view-timeline: --fuss-wortmarke block;
}
.fuss__wortmarke-text { display: block; }
.fuss__wortmarke.eingepasst { font-size: var(--einpassen); white-space: nowrap; }
.fuss__wortmarke.messen { font-size: 100px; width: max-content; white-space: nowrap; }
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .fuss__wortmarke-text { animation: fuss-wortmarke linear both; animation-timeline: --fuss-wortmarke; animation-range: entry 0% entry 100%; }
  }
}
@keyframes fuss-wortmarke { from { transform: translateY(75%); } to { transform: none; } }
.variante--gross .fuss__satz { font-family: var(--schrift-titel); font-size: var(--groesse-h1); line-height: var(--zeile-titel); color: var(--text); max-width: 20ch; margin-bottom: calc(var(--einheit) * 4); }
.variante--gross .fuss__wege a { color: var(--akzent-text); }
:root:has(.nach-oben) { scroll-behavior: smooth; }
.fuss .nach-oben {
  --nach-oben-groesse: calc(var(--einheit) * 4 + var(--groesse-text));
  position: fixed; z-index: 30; right: var(--rand); bottom: calc(var(--einheit) * 2);
  display: grid; place-items: center; width: var(--nach-oben-groesse); height: var(--nach-oben-groesse);
  border-radius: 50%; background: var(--text); color: var(--grund); text-decoration: none;
  box-shadow: 0 0.5rem 2rem rgb(0 0 0 / 0.18); transition: background 0.15s;
}
.fuss .nach-oben:hover { color: var(--grund); background: color-mix(in srgb, var(--text) 85%, var(--grund)); text-decoration: none; }
.fuss .nach-oben:focus-visible { outline-offset: 3px; }
.nach-oben__pfeil { width: 45%; height: 45%; }
.nach-oben__ring { display: none; }
@supports (animation-timeline: scroll()) {
  @media (prefers-reduced-motion: no-preference) {
    @keyframes nach-oben-ein { from { opacity: 0; visibility: hidden; translate: 0 50%; } to { opacity: 1; visibility: visible; translate: 0 0; } }
    @keyframes nach-oben-ring { from { transform: rotate(0deg); } to { transform: rotate(180deg); } }
    .fuss .nach-oben {
      opacity: 0; visibility: hidden;
      animation: nach-oben-ein linear both; animation-timeline: scroll(root block); animation-range: 0 min(100vh, 50%);
    }
    .nach-oben__ring {
      --ring-strich: calc(var(--nach-oben-groesse) / 16);
      --ring-farbe: color-mix(in oklab, var(--akzent), var(--grund) 40%);
      display: block; position: absolute; inset: calc(var(--nach-oben-groesse) * 3.25 / 48); pointer-events: none;
    }
    .nach-oben__ring::before {
      content: ""; position: absolute; inset: 0; border-radius: 50%;
      border: var(--ring-strich) solid color-mix(in srgb, var(--grund) 10%, transparent);
    }
    .nach-oben__teil { position: absolute; top: 0; bottom: 0; width: 50%; overflow: hidden; }
    .nach-oben__teil:first-child { left: 50%; }
    .nach-oben__teil:last-child { left: 0; }
    .nach-oben__stand {
      position: absolute; top: 0; width: 200%; height: 100%; box-sizing: border-box;
      border-radius: 50%; border: var(--ring-strich) solid var(--ring-farbe);
      animation: nach-oben-ring linear both; animation-timeline: scroll(root block);
    }
    .nach-oben__teil:first-child .nach-oben__stand { left: -100%; clip-path: inset(0 50% 0 0); animation-range: 0% 50%; }
    .nach-oben__teil:last-child .nach-oben__stand { left: 0; clip-path: inset(0 0 0 50%); animation-range: 50% 100%; }
  }
}
.mit-kasten .fuss .nach-oben { right: calc(max(0px, (100% - var(--kasten-breite)) / 2) + var(--rand)); }
body:has(.nach-oben) .block--fuss:not(.variante--mittig, .variante--menues) { padding-bottom: calc(var(--abstand-mittel) + var(--einheit) * 8); }
body:has(.nach-oben) .leiste { max-width: min(calc(100vw - (var(--rand) + var(--einheit) * 6 + var(--groesse-text)) * 2), var(--breite-schmal)); }
:root:not(:has(.mit-kasten)) body:has(.fuss--vorhang) > main { position: relative; z-index: 1; background: var(--grund); }
:root:not(:has(.mit-kasten)) body:has(.fuss--vorhang) > footer { position: sticky; bottom: 0; z-index: 0; }
:root:not(:has(.mit-kasten)) body:has(.fuss--vorhang) > .block--kopf:not(:has(.kopf--fixiert)) { position: relative; z-index: 2; background: var(--grund); }
.variante--mittig .fuss { display: flex; flex-direction: column; align-items: center; text-align: center; gap: calc(var(--einheit) * 4); }
.fuss .fuss__logo { display: inline-flex; color: var(--text); }
.fuss__logo :is(img, svg) { height: clamp(4.5rem, 3.5rem + 3vw, 6.5rem); width: auto; }
.fuss__menue, .fuss__recht ul, .fuss__punkte { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; }
.fuss__menue { gap: var(--einheit) calc(var(--einheit) * 3.5); font-size: var(--einleitung-groesse); font-weight: 600; text-transform: uppercase; }
.fuss .fuss__menue a { color: var(--text); }
.variante--mittig .fuss__social { margin: calc(var(--einheit) * 5) 0 0; justify-content: center; gap: calc(var(--einheit) * 0.75); }
.fuss__vertretung { display: flex; flex-direction: column; align-items: center; gap: calc(var(--einheit) * 0.25); }
.fuss__vertretung-titel { margin: 0 0 calc(var(--einheit) * 0.25); color: var(--text); text-transform: uppercase; letter-spacing: 0.04em; }
.fuss__punkte li + li::before { content: "•"; margin-inline: 0.5em; color: var(--gedaempft); }
.fuss__recht ul { gap: var(--einheit) calc(var(--einheit) * 1.5); text-transform: uppercase; letter-spacing: 0.04em; }
.fuss .fuss__social--farbig a { width: 2.25rem; height: 2.25rem; align-items: center; justify-content: center; border-radius: calc(var(--radius) / 2); background: var(--netz, var(--text)); color: #fff; opacity: 1; transition: filter 0.15s; }
.fuss .fuss__social--farbig a:hover { color: #fff; filter: brightness(1.12); }
.fuss__social--farbig svg { width: 1.2rem; height: 1.2rem; }
.block:has(> .fuss--menues) { overflow-x: clip; background: var(--seite-grund); }
.fuss--menues { font-size: var(--groesse-klein); line-height: 1.7; }
.fuss--menues .fuss__logo { display: inline-block; width: clamp(3.5rem, 2.5rem + 2.5vw, 4.75rem); margin-bottom: calc(var(--einheit) * 3); }
.fuss--menues .fuss__logo svg, .fuss--menues .fuss__logo img { display: block; width: 100%; height: auto; }
.fuss__spalten--menues { display: grid; grid-template-columns: 1fr; gap: calc(var(--einheit) * 5); padding-bottom: calc(var(--einheit) * 5); }
.fuss--menues .fuss__kontakt { font-style: normal; }
.fuss__land { font-weight: 700; text-transform: uppercase; }
.fuss__zusatz > * { margin: 1em 0 0; }
.fuss__zusatz strong { font-weight: 700; text-transform: uppercase; }
.fuss--menues .fuss__wege { margin: 1.4em 0 0; }
.fuss--menues .fuss__titel { margin: 0 0 0.9em; font-family: var(--schrift-titel); font-size: clamp(1rem, 0.85rem + 0.4vw, 1.17rem); font-weight: 400; text-transform: uppercase; }
.fuss--menues .fuss__titel strong { font-weight: 700; }
.fuss--menues .fuss__liste { margin: 0; padding: 0; list-style: none; text-transform: uppercase; }
.fuss--menues a { color: inherit; text-decoration: none; }
.fuss--menues a:hover { text-decoration: underline; }
.fuss__leiste { position: relative; isolation: isolate; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: calc(var(--einheit) * 3); padding-block: calc(var(--einheit) * 4); }
.fuss__leiste::before { content: ""; position: absolute; z-index: -1; inset: 0 -100vw; background: var(--grund); }
.fuss--menues .fuss__social { margin: 0; gap: 0.75rem; }
.fuss__leiste-rechts { display: flex; flex-direction: column; align-items: flex-end; gap: 0.4rem; margin-left: auto; }
.fuss--menues .fuss__recht ul, .fuss__sprachen { display: flex; gap: 0; margin: 0; padding: 0; list-style: none; text-transform: none; letter-spacing: 0; }
.fuss--menues .fuss__recht li + li::before { content: "|"; margin: 0 0.35em; }
.fuss__sprachen { column-gap: 0.8em; text-transform: uppercase; }
.fuss__sprachen a[aria-current] { font-weight: 700; }
.fuss__social--rahmen a { display: grid; place-items: center; width: 2.5rem; height: 2.5rem; border: 2px solid var(--akzent); border-radius: 0.4rem; }
.fuss .fuss__social--rahmen a, .fuss .fuss__social--rahmen a:hover { color: var(--akzent); opacity: 1; }
.fuss__social--rahmen svg { width: 1.5rem; height: 1.5rem; }
.fuss .fuss__social--rahmen a:hover { background: var(--akzent); color: var(--auf-akzent); }
@container (min-width: 48rem) {
  .fuss__spalten--menues { grid-template-columns: 1.6fr repeat(3, 1fr); }
}

.hero { position: relative; }
.hero__folien { display: flex; gap: calc(var(--einheit) * 4); overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: thin; }
.hero--slider .hero__folien { scrollbar-width: none; }
.hero--slider .hero__folien::-webkit-scrollbar { display: none; }
.hero__folie { flex: 0 0 100%; scroll-snap-align: start; display: grid; align-items: center; gap: calc(var(--einheit) * 4); }
.variante--vollbild .hero__folie { min-height: 60svh; }
.hero.hero--kompakt .hero__folie { min-height: 0; }
.hero.hero--hoch .hero__folie { min-height: 60svh; }
.hero.hero--voll .hero__folie { min-height: 100svh; }
@media (max-width: 47.99rem) {
  .hero.hero--schmal-kompakt .hero__folie { min-height: 0; }
  .hero.hero--schmal-hoch .hero__folie { min-height: 60svh; }
  .hero.hero--schmal-voll .hero__folie { min-height: 100svh; }
}
.hero__dachzeile { font-size: var(--dachzeile-groesse); text-transform: var(--dachzeile-schreibweise); letter-spacing: var(--dachzeile-laufweite); font-weight: var(--dachzeile-gewicht); color: var(--dachzeile-farbe); margin-bottom: var(--dachzeile-abstand); }
.hero__inhalt { container-type: inline-size; }
.hero__titel { font-size: var(--groesse-h1); font-size: min(var(--groesse-h1), 11cqi, 14svh); font-weight: var(--gewicht-h1); letter-spacing: var(--laufweite-h1); text-transform: var(--schreibweise-h1); line-height: var(--zeile-h1); max-width: 20ch; }
.hero__titel:is(.hero__titel--gross, .hero__titel--riesig, .hero__titel--randvoll) { line-height: var(--zeile-display); max-width: none; }
.hero__titel--gross { font-size: min(var(--groesse-hero-gross), 16cqi); }
.hero__titel--riesig { font-size: min(var(--groesse-hero-riesig), 22cqi); }
.hero__titel--randvoll { font-size: min(var(--groesse-hero-riesig), 22cqi); }
.hero__titel--randvoll.eingepasst { font-size: var(--einpassen); white-space: nowrap; hyphens: manual; }
.hero__titel--randvoll.messen { font-size: 100px; width: max-content; white-space: nowrap; }
.hero__titel--display { font-family: var(--schrift-display); font-weight: var(--gewicht-display); letter-spacing: var(--laufweite-display); text-transform: var(--schreibweise-display); }
.hero__text { color: var(--einleitung-farbe); font-size: var(--einleitung-groesse); font-size: min(var(--einleitung-groesse), max(1rem, 2.5svh)); font-weight: var(--einleitung-gewicht); }
.hero__text > :is(p, ul, ol) { max-width: var(--einleitung-breite); }
.hero__knoepfe { display: flex; flex-wrap: wrap; gap: calc(var(--einheit) * 2); margin: calc(var(--einheit) * 4) 0 0; }
.hero--mittig .hero__inhalt { text-align: center; }
.hero--mittig :is(.hero__titel, .hero__text > *) { margin-inline: auto; }
.hero--mittig .hero__knoepfe { justify-content: center; }
.variante--vollbild .hero--unten .hero__folie { align-items: end; }
.grund--akzent :is(.hero__dachzeile, .hero__text) { color: inherit; }
.variante--geteilt .hero__bild { border-radius: var(--radius); aspect-ratio: 4 / 3; }
:is(img, video).hero__bild { width: 100%; height: 100%; object-fit: cover; display: block; }
@container (min-width: 48rem) {
  .variante--geteilt .hero__folie { grid-template-columns: 1fr 1fr; gap: calc(var(--einheit) * 6); }
  .variante--geteilt .hero__bild { aspect-ratio: auto; align-self: stretch; min-height: 22rem; }
  .variante--geteilt .hero--bild-links .hero__bild { order: -1; }
  .variante--geteilt .hero__folie--leer { grid-template-columns: 1fr; }
}
.block.variante--vollbild { padding: 0; }
.variante--vollbild > .hero { max-width: none; }
.variante--vollbild .hero__folien { gap: 0; }
.variante--vollbild .hero__folie { overflow: clip; position: relative; isolation: isolate; padding: min(var(--abstand-mittel), 8svh) var(--rand); color: var(--auf-schleier); }
.variante--vollbild .hero__bild { position: absolute; inset: 0; z-index: -2; border-radius: 0; }
.variante--vollbild .hero__folie::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--schleier); }
.variante--vollbild .hero__inhalt { width: 100%; max-width: var(--breite); margin-inline: auto; }
.variante--vollbild :is(.hero__dachzeile, .hero__text) { color: inherit; }
.variante--vollbild .knopf:hover { background: transparent; color: var(--auf-schleier); border-color: var(--auf-schleier); }
.variante--vollbild .knopf--zweit { background: transparent; color: var(--auf-schleier); border-color: var(--auf-schleier); }
.variante--vollbild .knopf--zweit:hover { background: color-mix(in srgb, var(--auf-schleier) 15%, transparent); }
.variante--vollbild .hero__folie--leer { --schleier: transparent; --auf-schleier: currentColor; color: inherit; }
.hero__steuerung { display: flex; align-items: center; justify-content: center; gap: calc(var(--einheit) * 2); margin-top: calc(var(--einheit) * 3); }
.hero__steuerung[hidden] { display: none; }
.hero__pfeil {
  font: inherit; font-size: var(--groesse-h3); line-height: 1; width: 2.75rem; height: 2.75rem; padding: 0 0 0.15em;
  border: 1px solid var(--linie); border-radius: 50%; background: var(--grund); color: var(--text); cursor: pointer;
}
.hero__pfeil:hover { border-color: currentColor; }
.hero__punkte { display: flex; gap: var(--einheit); }
.hero__punkt { width: 0.875rem; height: 0.875rem; padding: 0; border: 2px solid currentColor; border-radius: 50%; background: transparent; color: var(--gedaempft); cursor: pointer; }
.hero__punkt[aria-current="true"] { background: currentColor; color: var(--akzent-text); }
.hero__folien:focus-visible { outline-offset: -3px; }
.variante--vollbild .hero__steuerung { position: absolute; inset: auto 0 calc(var(--einheit) * 3); margin: 0; }
.variante--vollbild .hero--slider .hero__folie { padding-bottom: calc(var(--abstand-mittel) + 4rem); }
.variante--vollbild :is(.hero__pfeil, .hero__punkt, .hero__punkt[aria-current="true"]) { color: var(--auf-schleier); }
.variante--vollbild .hero__pfeil { background: transparent; border-color: currentColor; }
.variante--vollbild .hero:has(.hero__folie--leer) .hero__steuerung { --auf-schleier: var(--text); }
.variante--vollbild .hero:has(.hero__folie--leer) .hero__pfeil { background: var(--grund); }
.variante--vollbild .hero:has(.hero__folie--leer) .hero__punkte { background: var(--grund); padding: 0.25rem 0.5rem; border-radius: 1rem; }
.hero__zeile { display: block; }
.hero__zeile--akzent { color: var(--akzent-text); }
.variante--vollbild .hero__zeile--akzent { color: inherit; }
.hero__motiv {
  position: absolute; inset: 0; z-index: 0; display: grid; place-items: center; overflow: hidden; pointer-events: none;
  color: var(--text); opacity: 0.07;
}
.hero__motiv svg { height: min(85%, 52rem); width: auto; max-width: none; }
.hero__motiv svg :is(path, polygon, rect, circle, ellipse) { fill: currentColor; }
.hero__folien, .hero__steuerung { position: relative; z-index: 1; }
.hero__motiv--licht {
  opacity: 0.22;
  mask-image: radial-gradient(ellipse 30% 40% at 50% 50%, #000 0%, rgb(0 0 0 / 0.3) 70%);
  mask-size: 180% 180%; mask-repeat: no-repeat;
  animation: hero-licht 12s ease-in-out infinite;
}
@keyframes hero-licht {
  0%, 100% { mask-position: 10% 15%; }
  20% { mask-position: 70% 20%; }
  40% { mask-position: 80% 70%; }
  60% { mask-position: 20% 80%; }
  80% { mask-position: 55% 35%; }
}
[data-bewegung] .hero__titel[data-animation], [data-bewegung] .hero__titel[data-animation] .wort { animation: none; }
@media (prefers-reduced-motion: no-preference) {
  :root[data-js] .hero__titel[data-animation]:not(.gelaufen) { opacity: 0; animation: hero-sicher 0.01s 2.5s both; }
  :root[data-js] .hero__titel.laeuft:is([data-animation="maske"], [data-animation="zeilen"]:not(:has(.hero__zeile))) { animation: hero-maske 0.9s cubic-bezier(0.2, 0.7, 0.2, 1) both; }
  :root[data-js] .hero__titel.laeuft[data-animation="zeilen"] .hero__zeile { animation: hero-maske 0.8s cubic-bezier(0.2, 0.7, 0.2, 1) both; animation-delay: calc(var(--i, 0) * 0.12s); }
  :root[data-js] .hero__titel[data-animation="woerter"] .wort { display: inline-block; }
  :root[data-js] .hero__titel.laeuft[data-animation="woerter"] .wort { animation: hero-wort 0.6s ease-out both; animation-delay: calc(var(--i, 0) * 0.07s); }
}
@keyframes hero-maske {
  from { clip-path: inset(-0.5em -0.5em 100% -0.5em); transform: translateY(40%); opacity: 0; }
  to { clip-path: inset(-0.5em -0.5em -0.5em -0.5em); transform: none; opacity: 1; }
}
@keyframes hero-wort { from { opacity: 0; transform: translateY(0.3em); } }
@keyframes hero-sicher { to { opacity: 1; } }
.hero__unterzeile { margin: calc(var(--einheit) * 1.5) 0 0; font-size: var(--einleitung-groesse); font-weight: 700; line-height: 1.3; text-transform: uppercase; opacity: 0.85; }
.hero__plakette { margin: calc(var(--einheit) * 3) 0 0; font-size: var(--einleitung-groesse); }
.hero__plakette a {
  display: inline-block; padding: 0.35em 0.6em; border-radius: calc(var(--radius) / 2);
  background: var(--flaeche); color: var(--text); font-weight: 600; text-decoration: underline; text-underline-offset: 0.15em;
}
.hero__plakette a:hover { text-decoration-thickness: 2px; }
.hero--schatten :is(.hero__titel, .hero__unterzeile, .hero__text) { text-shadow: 0.03em 0.04em 0.06em rgb(0 0 0 / 0.55), 0 0 0.6em rgb(0 0 0 / 0.35); }
.hero--schatten .hero__titel { text-shadow: 0.02em 0.03em 0.04em rgb(0 0 0 / 0.5), 0 0 0.3em rgb(0 0 0 / 0.3); }
.variante--vollbild .hero--schleier-leicht .hero__folie::before { opacity: 0.5; }
.variante--vollbild .hero--schleier-ohne .hero__folie::before { content: none; }
.hero__wechsel { position: absolute; inset: 0; z-index: -2; pointer-events: none; }
.hero__wechsel img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; }
.hero--takt-schnell { --wechsel-takt: 4s; }
.hero--takt-mittel { --wechsel-takt: 6s; }
.hero--takt-langsam { --wechsel-takt: 9s; }
@media (prefers-reduced-motion: reduce) {
  .hero__wechsel { display: none; }
}
@media (prefers-reduced-motion: no-preference) {
  .hero__wechsel img { animation: var(--wechsel-art) calc(var(--wechsel-takt) * var(--wechsel-n)) linear calc(var(--wechsel-takt) * var(--wechsel-k)) infinite backwards; }
  .hero__wechsel img:nth-child(1) { --wechsel-k: 1; }
  .hero__wechsel img:nth-child(2) { --wechsel-k: 2; }
  .hero__wechsel img:nth-child(3) { --wechsel-k: 3; }
  .hero__wechsel img:nth-child(4) { --wechsel-k: 4; }
  .hero__wechsel:has(> img:nth-child(1):last-child) { --wechsel-n: 2; --wechsel-mitte: hero-wechsel-2; --wechsel-letzte: hero-wechsel-2-letzte; }
  .hero__wechsel:has(> img:nth-child(2):last-child) { --wechsel-n: 3; --wechsel-mitte: hero-wechsel-3; --wechsel-letzte: hero-wechsel-3-letzte; }
  .hero__wechsel:has(> img:nth-child(3):last-child) { --wechsel-n: 4; --wechsel-mitte: hero-wechsel-4; --wechsel-letzte: hero-wechsel-4-letzte; }
  .hero__wechsel:has(> img:nth-child(4):last-child) { --wechsel-n: 5; --wechsel-mitte: hero-wechsel-5; --wechsel-letzte: hero-wechsel-5-letzte; }
  .hero__wechsel img { --wechsel-art: var(--wechsel-mitte); }
  .hero__wechsel img:last-child { --wechsel-art: var(--wechsel-letzte); }
}
@keyframes hero-wechsel-2 { 0% { opacity: 0; } 10%, 60% { opacity: 1; } 60.01%, 100% { opacity: 0; } }
@keyframes hero-wechsel-2-letzte { 0% { opacity: 0; } 10%, 50% { opacity: 1; } 60%, 100% { opacity: 0; } }
@keyframes hero-wechsel-3 { 0% { opacity: 0; } 6.667%, 40% { opacity: 1; } 40.01%, 100% { opacity: 0; } }
@keyframes hero-wechsel-3-letzte { 0% { opacity: 0; } 6.667%, 33.333% { opacity: 1; } 40%, 100% { opacity: 0; } }
@keyframes hero-wechsel-4 { 0% { opacity: 0; } 5%, 30% { opacity: 1; } 30.01%, 100% { opacity: 0; } }
@keyframes hero-wechsel-4-letzte { 0% { opacity: 0; } 5%, 25% { opacity: 1; } 30%, 100% { opacity: 0; } }
@keyframes hero-wechsel-5 { 0% { opacity: 0; } 4%, 24% { opacity: 1; } 24.01%, 100% { opacity: 0; } }
@keyframes hero-wechsel-5-letzte { 0% { opacity: 0; } 4%, 20% { opacity: 1; } 24%, 100% { opacity: 0; } }
.hero__plakette-streifen { display: none; margin: 0; padding: calc(var(--einheit) * 1.5) var(--rand); background: var(--flaeche); color: var(--text); text-align: center; font-weight: 600; font-size: var(--groesse-klein); }
.hero__plakette-streifen a { color: inherit; text-decoration: underline; text-underline-offset: 0.15em; }
@media (max-width: 47.99rem) {
  .hero__plakette--im-bild { display: none; }
  .hero__plakette-streifen { display: block; }
}

.impressum > :not(h1) { max-width: var(--breite-schmal); }
.impressum > h1 { font-size: min(var(--groesse-h1), 7.5cqi); }
.impressum__teil h2, .impressum__zusatz h2 { font-size: var(--groesse-h3); margin-top: calc(var(--einheit) * 4); }
.impressum__teil > :last-child p:last-child, .impressum__teil > p:last-child { margin-bottom: 0; }
.variante--tabelle .impressum__teil { padding-block: calc(var(--einheit) * 1.5); border-top: 1px solid var(--linie); }
.variante--tabelle .impressum__teil:last-of-type { border-bottom: 1px solid var(--linie); }
.variante--tabelle .impressum__teil h2 { font-family: var(--schrift-text); font-size: var(--groesse-text); margin: 0 0 calc(var(--einheit) * 0.5); }
@container (min-width: 36rem) {
  .variante--tabelle .impressum__teil { display: grid; grid-template-columns: 14rem 1fr; gap: calc(var(--einheit) * 3); }
  .variante--tabelle .impressum__teil h2 { margin: 0; }
}

.kontakt__text { margin-bottom: calc(var(--einheit) * 3); }
.kontakt__text > :is(p, ul, ol) { max-width: var(--text-breite); }
.kontakt address { font-style: normal; }
.kontakt__teil p, .kontakt__teil address { margin: 0; }
.kontakt__hinweis { color: var(--gedaempft); }
.variante--zeilen .kontakt__angaben { display: flex; flex-direction: column; gap: var(--einheit); }
.kontakt__bez { display: inline-block; min-width: 5em; color: var(--gedaempft); }
.variante--spalten .kontakt__angaben { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: calc(var(--einheit) * 4); }
.kontakt__titel { font-family: var(--schrift-text); font-size: var(--groesse-text); color: var(--gedaempft); margin-bottom: var(--einheit); }
.variante--gross .kontakt__angaben { display: flex; flex-direction: column; gap: calc(var(--einheit) * 3); font-family: var(--schrift-titel); font-size: var(--groesse-h3); line-height: var(--zeile-text); }
.variante--gross .kontakt__hinweis { font-family: var(--schrift-text); font-size: var(--groesse-text); }
.kontakt__logo { color: var(--text); margin-bottom: calc(var(--einheit) * 4); }
.kontakt__logo :is(svg, img) { height: clamp(2rem, 1.5rem + 2vw, 3rem); width: auto; }
.kontakt__logo img { height: clamp(3rem, 2rem + 3vw, 5rem); }
.kontakt__kopieren { margin-left: var(--einheit); padding: 0.1em 0.6em; font: inherit; font-size: var(--groesse-klein); color: var(--gedaempft); background: none; border: 1px solid var(--linie); border-radius: var(--radius); cursor: pointer; }
.kontakt__kopieren:hover { color: var(--text); border-color: var(--text); }
.kontakt__ueberschrift:has(+ .kontakt__unterzeile) { margin-bottom: 0; }
.kontakt__unterzeile { margin: 0 0 calc(var(--einheit) * 4); font-weight: 700; }
@container (min-width: 40rem) {
  .kontakt--logo-rechts { display: grid; grid-template-columns: 1fr auto; column-gap: calc(var(--einheit) * 6); align-items: start; }
  .kontakt--logo-rechts > * { grid-column: 1; }
  .kontakt--logo-rechts > .kontakt__logo { grid-column: 2; grid-row: 1 / span 5; margin: 0; }
  .kontakt--logo-rechts .kontakt__logo img { height: clamp(4rem, 2rem + 5vw, 7rem); }
}

.kopf { display: flex; flex-wrap: wrap; align-items: center; gap: var(--einheit) calc(var(--einheit) * 3); }
.kopf__marke { font-family: var(--schrift-titel); font-weight: var(--gewicht-titel); font-size: var(--marke-groesse); color: var(--text); text-decoration: none; margin-inline-end: auto; }
.kopf__logo { display: block; height: 2rem; }
.kopf__logo--klein { height: 1.5rem; }
.kopf__logo--gross { height: 2.75rem; }
.kopf__logo--riesig { height: 3.75rem; }
.kopf__logo--maximal { height: 5.25rem; }
.kopf__logo svg { height: 100%; width: auto; }
.kopf__menue ul { display: flex; flex-wrap: wrap; gap: var(--einheit) calc(var(--einheit) * 3); list-style: none; margin: 0; padding: 0; font-size: var(--navigation-groesse); font-weight: var(--navigation-gewicht); }
.kopf__menue a { color: var(--navigation-farbe); text-decoration: none; }
.kopf__menue a:hover, .kopf__menue a[aria-current="page"] { color: var(--text); text-decoration: underline; }
.kopf--kraeftig .kopf__menue ul { font-family: var(--schrift-titel); font-weight: 800; font-size: calc(var(--navigation-groesse) * 1.6); line-height: var(--zeile-titel); }
.kopf--kraeftig .kopf__menue a { color: var(--text); }
.kopf--gross .kopf__menue ul { text-transform: uppercase; letter-spacing: 0.06em; }
@property --kopf-hell { syntax: "<number>"; inherits: true; initial-value: 0; }
.kopf__logo--bild { display: grid; grid-template: 100% / auto; }
.kopf__logo-bild { grid-area: 1 / 1; height: 100%; width: auto; max-width: none; }
.kopf--logo-hell .kopf__logo-bild { opacity: calc(1 - var(--kopf-hell)); }
.kopf--logo-hell .kopf__logo-bild--hell { opacity: var(--kopf-hell); }
.kopf--mittig { display: var(--kopf-raster, flex); grid-template-columns: 1fr auto 1fr auto; }
.kopf--mittig .kopf__nav { grid-column: 2 / 4; display: var(--kopf-raster, block); grid-template-columns: subgrid; align-items: center; }
.kopf--mittig .kopf__menue[popover]:not(:popover-open) { grid-column: 1 / 3; display: var(--kopf-raster, none); grid-template-columns: subgrid; align-items: center; }
.kopf--mittig .kopf__menue:not(:popover-open) > ul:first-of-type { justify-self: center; }
.kopf--mittig .kopf__marke { justify-self: start; }
.kopf--mittig > .kopf__farbe { grid-column: 4; }
.kopf__menue .kopf__rechts { display: none; }
.kopf--rechts .kopf__menue:not(:popover-open) .kopf__doppelt { display: none; }
.kopf--rechts .kopf__menue:not([popover]) { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--einheit) calc(var(--einheit) * 6); }
.kopf--rechts:not(.kopf--mittig) .kopf__menue[popover]:not(:popover-open) { display: var(--kopf-raster, none); grid-template-columns: auto auto; gap: calc(var(--einheit) * 6); align-items: center; }
.kopf--rechts .kopf__menue:not(:popover-open) > .kopf__rechts { display: flex; justify-self: end; }
.kopf__rechts li { display: flex; }
.kopf__rechts a { display: inline-flex; align-items: center; gap: 0.4em; }
.kopf__symbol { width: 1.15em; height: 1.15em; flex: none; }
.kopf__unter { position: relative; }
.kopf__unter > summary { cursor: pointer; list-style: none; color: var(--navigation-farbe); display: inline-flex; align-items: center; gap: 0.4em; }
.kopf__unter > summary::-webkit-details-marker { display: none; }
.kopf__unter > summary::after { content: ""; width: 0.4em; height: 0.4em; border-right: 2px solid; border-bottom: 2px solid; transform: translateY(-0.15em) rotate(45deg); transition: transform 0.15s; }
.kopf__unter[open] > summary::after { transform: translateY(0.1em) rotate(-135deg); }
.kopf__unter > summary:hover, .kopf__unter > .kopf__unter-aktiv, .kopf--kraeftig .kopf__unter > summary { color: var(--text); }
.kopf__menue .kopf__unter > ul {
  position: absolute; top: calc(100% + var(--einheit)); left: calc(var(--einheit) * -2); z-index: 20;
  flex-direction: column; flex-wrap: nowrap; gap: var(--einheit); min-width: 12rem; white-space: nowrap;
  padding: calc(var(--einheit) * 2); background: var(--grund); border: 1px solid var(--linie); border-radius: var(--radius);
  max-height: calc(100vh - var(--einheit) * 16); max-height: calc(100dvh - var(--einheit) * 16);
  overflow-y: auto; overscroll-behavior: contain;
}
.block--kopf:has(.kopf--fixiert) { position: sticky; top: 0; z-index: 10; }
:root:has(.kopf--fixiert) { scroll-padding-top: calc(var(--einheit) * 12); }
:where(.block--kopf:has(.kopf--fixiert)) { background: var(--grund); }
:is(.kasten--alles, .kasten--ohne-fuss) > .block--kopf:has(.kopf--fixiert) { top: var(--kasten-luft); }
:root:has(:is(.kasten--alles, .kasten--ohne-fuss) .kopf--fixiert) { scroll-padding-top: calc(var(--einheit) * 12 + var(--kasten-luft)); }
:where(:is(.kasten--ohne-kopf, .kasten--inhalt) > .block--kopf:has(.kopf--fixiert)) { background: var(--seite-grund); }
.kopf__knopf, .kopf__schliessen, .kopf__farbe {
  font: inherit; color: var(--text); background: none; cursor: pointer;
  border: 1px solid var(--linie); border-radius: var(--radius);
  padding: calc(var(--einheit) * 0.75) calc(var(--einheit) * 1.5);
  display: inline-flex; align-items: center; gap: var(--einheit);
}
.kopf__knopf { font-size: var(--navigation-groesse); }
.kopf__knopf:hover, .kopf__schliessen:hover, .kopf__farbe:hover { border-color: var(--text); }
.kopf__striche, .kopf__striche::before, .kopf__striche::after { display: block; width: 1.1em; height: 2px; background: currentColor; }
.kopf__striche { position: relative; }
.kopf__striche::before, .kopf__striche::after { content: ""; position: absolute; left: 0; }
.kopf__striche::before { top: -0.35em; }
.kopf__striche::after { top: 0.35em; }
.kopf__farbe { padding: calc(var(--einheit) * 0.75); }
:root:not([data-js]) .kopf__farbe { display: none; }
.kopf__farbe svg { width: 1.25em; height: 1.25em; }
.kopf__knopf { display: var(--kopf-knopf, inline-flex); }
.kopf__menue[popover]:not(:popover-open) {
  display: var(--kopf-leiste, none); position: static; inset: auto; width: auto; height: auto;
  margin: 0; padding: 0; border: 0; background: none; color: inherit; overflow: visible;
}
.kopf__menue:not(:popover-open) .kopf__schliessen { display: none; }
.kopf__menue:popover-open {
  inset: 0 0 auto; width: 100%; height: 100%; height: 100lvh; max-width: none; max-height: none; margin: 0; border: 0;
  padding: var(--rand); padding-bottom: calc(var(--rand) + 100lvh - 100svh); background: var(--grund); color: var(--text); overflow: auto;
}
.kopf__menue:popover-open::backdrop { background: transparent; }
.kopf__menue:popover-open ul { flex-direction: column; gap: calc(var(--einheit) * 2); margin-top: calc(var(--einheit) * 8); font-family: var(--schrift-titel); font-size: var(--groesse-h2); line-height: var(--zeile-titel); }
.kopf__menue:popover-open a { color: var(--text); }
.kopf--menue-normal .kopf__menue:popover-open ul { font-size: var(--groesse-h3); }
.kopf--menue-riesig .kopf__menue:popover-open ul { font-size: var(--groesse-h1); font-weight: 800; }
.kopf__schliessen { position: absolute; top: var(--rand); right: var(--rand); }
@container (min-width: 20rem) { .kopf--ab-20 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 22rem) { .kopf--ab-22 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 24rem) { .kopf--ab-24 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 26rem) { .kopf--ab-26 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 28rem) { .kopf--ab-28 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 30rem) { .kopf--ab-30 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 32rem) { .kopf--ab-32 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 34rem) { .kopf--ab-34 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 36rem) { .kopf--ab-36 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 38rem) { .kopf--ab-38 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 40rem) { .kopf--ab-40 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 42rem) { .kopf--ab-42 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 44rem) { .kopf--ab-44 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 46rem) { .kopf--ab-46 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 48rem) { .kopf--ab-48 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 50rem) { .kopf--ab-50 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 52rem) { .kopf--ab-52 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 54rem) { .kopf--ab-54 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 56rem) { .kopf--ab-56 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 58rem) { .kopf--ab-58 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 60rem) { .kopf--ab-60 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 62rem) { .kopf--ab-62 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 64rem) { .kopf--ab-64 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 66rem) { .kopf--ab-66 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 68rem) { .kopf--ab-68 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 70rem) { .kopf--ab-70 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 72rem) { .kopf--ab-72 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 74rem) { .kopf--ab-74 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 76rem) { .kopf--ab-76 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 78rem) { .kopf--ab-78 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 80rem) { .kopf--ab-80 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 82rem) { .kopf--ab-82 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 84rem) { .kopf--ab-84 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 86rem) { .kopf--ab-86 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 88rem) { .kopf--ab-88 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 90rem) { .kopf--ab-90 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 92rem) { .kopf--ab-92 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 94rem) { .kopf--ab-94 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 96rem) { .kopf--ab-96 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 98rem) { .kopf--ab-98 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 100rem) { .kopf--ab-100 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 102rem) { .kopf--ab-102 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 104rem) { .kopf--ab-104 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 106rem) { .kopf--ab-106 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 108rem) { .kopf--ab-108 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 110rem) { .kopf--ab-110 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 112rem) { .kopf--ab-112 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 114rem) { .kopf--ab-114 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 116rem) { .kopf--ab-116 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 118rem) { .kopf--ab-118 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
@container (min-width: 120rem) { .kopf--ab-120 { --kopf-leiste: block; --kopf-knopf: none; --kopf-raster: grid; } }
.kopf__menue:popover-open .kopf__unter > summary { color: var(--text); }
.kopf__menue:popover-open .kopf__unter > ul {
  position: static; min-width: 0; padding: 0 0 0 calc(var(--einheit) * 3); margin-top: calc(var(--einheit) * 2);
  background: none; border: 0; font-size: var(--groesse-h3); white-space: normal;
}
.kopf--menue-normal .kopf__menue:popover-open .kopf__unter > ul { font-size: var(--groesse-text); }
.kopf--menue-riesig .kopf__menue:popover-open .kopf__unter > ul { font-size: var(--groesse-h2); }
.leiste {
  position: fixed; z-index: 30; left: 50%; bottom: calc(var(--einheit) * 2); transform: translateX(-50%);
  display: flex; align-items: center; gap: calc(var(--einheit) * 0.5);
  max-width: min(calc(100vw - var(--einheit) * 4), var(--breite-schmal)); padding: calc(var(--einheit) * 0.5);
  background: var(--text); color: var(--grund); border-radius: calc(var(--radius-knopf) + var(--einheit) * 0.5);
  font-size: var(--groesse-klein); line-height: 1; box-shadow: 0 0.5rem 2rem rgb(0 0 0 / 0.18);
}
.leiste__liste { display: flex; gap: calc(var(--einheit) * 0.5); min-width: 0; list-style: none; margin: 0; padding: 0; overflow-x: auto; scrollbar-width: none; }
.leiste__liste::-webkit-scrollbar { display: none; }
@property --leiste-links { syntax: "<length>"; inherits: false; initial-value: 0px; }
@property --leiste-rechts { syntax: "<length>"; inherits: false; initial-value: 0px; }
@keyframes leiste-rand {
  from { --leiste-links: 0px; --leiste-rechts: 3rem; }
  8%, 92% { --leiste-links: 3rem; --leiste-rechts: 3rem; }
  to { --leiste-links: 3rem; --leiste-rechts: 0px; }
}
@supports (animation-timeline: scroll()) {
  .leiste__liste {
    mask-image: linear-gradient(to right, transparent, #000 var(--leiste-links), #000 calc(100% - var(--leiste-rechts)), transparent);
    animation: leiste-rand linear both; animation-timeline: scroll(self inline);
  }
}
.leiste a { display: block; white-space: nowrap; text-decoration: none; border-radius: var(--radius-knopf); padding: calc(var(--einheit) * 1.5) calc(var(--einheit) * 2); }
.leiste__link { color: color-mix(in srgb, var(--grund) 65%, transparent); background: color-mix(in srgb, var(--grund) 7%, transparent); transition: color 0.15s, background 0.15s; }
.leiste__link:hover { color: var(--grund); }
.leiste__link[aria-current] { color: var(--grund); background: color-mix(in srgb, var(--grund) 20%, transparent); }
.leiste__marke { flex: none; color: var(--grund); font-family: var(--schrift-titel); font-weight: var(--gewicht-h1); font-size: var(--groesse-text); }
.leiste__knopf { flex: none; background: var(--grund); color: var(--text); font-weight: var(--gewicht-betont); }
.leiste__knopf:hover { background: color-mix(in srgb, var(--grund) 85%, transparent); }
.leiste :focus-visible { outline-color: var(--grund); outline-offset: 2px; }
body:has(.leiste) .block--fuss { padding-bottom: calc(var(--abstand-mittel) + var(--einheit) * 8); }
:root:has(.leiste) { scroll-padding-bottom: calc(var(--einheit) * 10); }
.kopf--mega { position: relative; }
.kopf--mega .kopf__menue:not(:popover-open) .kopf__unter { position: static; }
.kopf--mega .kopf__menue:not(:popover-open) .kopf__unter > ul {
  left: 0; right: 0; top: calc(100% + var(--einheit));
  display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: calc(var(--einheit) * 0.5);
  min-width: 0; white-space: normal; padding: calc(var(--einheit) * 1.5);
  background: var(--flaeche); box-shadow: 0 1.5rem 3rem rgb(0 0 0 / 0.08);
}
.kopf--mega .kopf__menue:not(:popover-open) .kopf__unter > ul a {
  display: block; height: 100%; padding: calc(var(--einheit) * 1.5) calc(var(--einheit) * 2);
  border-radius: var(--radius-knopf); color: var(--text); text-decoration: none; transition: background 0.15s;
}
.kopf--mega .kopf__menue:not(:popover-open) .kopf__unter > ul a:is(:hover, [aria-current]) { background: var(--grund); text-decoration: none; }
.kopf__mega-titel { display: block; font-weight: var(--gewicht-betont); }
.kopf__mega-text {
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden;
  margin-top: 0.25em; font-size: var(--groesse-klein); font-weight: var(--gewicht-text); line-height: 1.4; color: var(--gedaempft);
}
.kopf__menue:popover-open .kopf__mega-text { display: none; }
:is(.kasten--alles, .kasten--ohne-fuss) > .block--kopf {
  --kopf-fest-rand: max(0px, (100% - var(--kasten-breite)) / 2); --kopf-fest-oben: var(--kasten-luft);
  border-radius: var(--kasten-ecke) var(--kasten-ecke) 0 0;
}
@property --kopf-farbe { syntax: "<color>"; inherits: true; initial-value: transparent; }
@property --kopf-grund { syntax: "<color>"; inherits: true; initial-value: transparent; }
@property --kopf-blur { syntax: "<length>"; inherits: true; initial-value: 0px; }
:root:not(:has(.kasten--ohne-kopf, .kasten--inhalt)):has(main > .block--hero.variante--vollbild:first-child) .block--kopf:has(.kopf--ueber) {
  --kopf-farbe: var(--auf-schleier); --kopf-grund: transparent; --kopf-blur: 0px; --kopf-hell: 1;
  --kopf-farbe-nach: var(--text); --kopf-grund-nach: var(--grund); --kopf-blur-nach: 0px;
  position: absolute; top: var(--kopf-fest-oben, 0px); left: var(--kopf-fest-rand, 0px); right: var(--kopf-fest-rand, 0px); z-index: 10; background: none;
}
:root:not(:has(.kasten--ohne-kopf, .kasten--inhalt)):has(main > .block--hero.variante--vollbild:first-child) .block--kopf:has(.kopf--ueber)::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: var(--kopf-grund); -webkit-backdrop-filter: blur(var(--kopf-blur)); backdrop-filter: blur(var(--kopf-blur));
}
:root:not(:has(.kasten--ohne-kopf, .kasten--inhalt)):has(main > .block--hero.variante--vollbild:first-child) .block--kopf:has(.kopf--ueber-glas) {
  --kopf-grund: color-mix(in srgb, var(--auf-schleier) 10%, transparent); --kopf-blur: 16px;
}
:root:not(:has(.kasten--ohne-kopf, .kasten--inhalt)):has(main > .block--hero.variante--vollbild:first-child) .block--kopf:has(.kopf--ueber-verlauf)::after {
  content: ""; position: absolute; inset: 0; z-index: -2; pointer-events: none;
  --v: var(--kopf-hell);
  background: linear-gradient(
    rgb(0 0 0 / calc(0.6 * var(--v))) 0%, rgb(0 0 0 / calc(0.6 * var(--v))) 15%, rgb(0 0 0 / calc(0.47 * var(--v))) 35%,
    rgb(0 0 0 / calc(0.3 * var(--v))) 55%, rgb(0 0 0 / calc(0.14 * var(--v))) 75%, rgb(0 0 0 / calc(0.04 * var(--v))) 90%, rgb(0 0 0 / 0) 100%);
}
:root:not(:has(.kasten--ohne-kopf, .kasten--inhalt)):has(main > .block--hero.variante--vollbild:first-child) .block--kopf:has(.kopf--nach-glas) {
  --kopf-grund-nach: color-mix(in srgb, var(--grund) 75%, transparent); --kopf-blur-nach: 16px;
}
:root:not(:has(.kasten--ohne-kopf, .kasten--inhalt)):has(main > .block--hero.variante--vollbild:first-child) .block--kopf:has(.kopf--ueber.kopf--fixiert) {
  position: fixed;
  --kopf-farbe: var(--kopf-farbe-nach); --kopf-grund: var(--kopf-grund-nach); --kopf-blur: var(--kopf-blur-nach); --kopf-hell: 0;
}
:root:not(:has(.kasten--ohne-kopf, .kasten--inhalt)):has(main > .block--hero.variante--vollbild:first-child) .kopf--ueber :is(.kopf__marke, .kopf__knopf, .kopf__farbe),
:root:not(:has(.kasten--ohne-kopf, .kasten--inhalt)):has(main > .block--hero.variante--vollbild:first-child) .kopf--ueber .kopf__menue:not(:popover-open) > ul > li > a,
:root:not(:has(.kasten--ohne-kopf, .kasten--inhalt)):has(main > .block--hero.variante--vollbild:first-child) .kopf--ueber .kopf__menue:not(:popover-open) > ul > li > .kopf__unter > summary {
  color: var(--kopf-farbe);
}
:root:not(:has(.kasten--ohne-kopf, .kasten--inhalt)):has(main > .block--hero.variante--vollbild:first-child) .kopf--ueber :is(.kopf__knopf, .kopf__farbe) { border-color: color-mix(in srgb, var(--kopf-farbe) 35%, transparent); }
:root:not(:has(.kasten--ohne-kopf, .kasten--inhalt)):has(main > .block--hero.variante--vollbild:first-child) .kopf--ueber :is(.kopf__knopf, .kopf__farbe):hover { border-color: var(--kopf-farbe); }
:root:has(main > .block--hero.variante--vollbild:first-child .hero__folie--leer:first-child) .block--kopf:has(.kopf--ueber) { --auf-schleier: var(--text); }
:root:has(main > .block--hero.grund--akzent.variante--vollbild:first-child .hero__folie--leer:first-child) .block--kopf:has(.kopf--ueber) { --auf-schleier: var(--auf-akzent); }
:root:not(:has(.kasten--ohne-kopf, .kasten--inhalt)):has(.kopf--ueber) main > .block--hero.variante--vollbild:first-child .hero__folie { padding-top: calc(min(var(--abstand-mittel), 8svh) + var(--einheit) * 10); }
@keyframes kopf-nach-hero { to { --kopf-farbe: var(--kopf-farbe-nach); --kopf-grund: var(--kopf-grund-nach); --kopf-blur: var(--kopf-blur-nach); --kopf-hell: 0; } }
@supports (timeline-scope: --a) and (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    :root:not(:has(.kasten--ohne-kopf, .kasten--inhalt)):has(.kopf--ueber.kopf--fixiert) { timeline-scope: --kopf-hero; }
    :root:not(:has(.kasten--ohne-kopf, .kasten--inhalt)):has(.kopf--ueber.kopf--fixiert) main > .block--hero.variante--vollbild:first-child { view-timeline: --kopf-hero block; view-timeline-inset: 0; }
    :root:not(:has(.kasten--ohne-kopf, .kasten--inhalt)):has(main > .block--hero.variante--vollbild:first-child) .block--kopf:has(.kopf--ueber.kopf--fixiert) {
      --kopf-farbe: var(--auf-schleier); --kopf-grund: transparent; --kopf-blur: 0px; --kopf-hell: 1;
      animation: kopf-nach-hero linear both; animation-timeline: --kopf-hero;
      animation-range: cover calc(100% - var(--einheit) * 14) cover calc(100% - var(--einheit) * 9);
    }
    :root:not(:has(.kasten--ohne-kopf, .kasten--inhalt)):has(main > .block--hero.variante--vollbild:first-child) .block--kopf:has(.kopf--ueber-glas.kopf--fixiert) {
      --kopf-grund: color-mix(in srgb, var(--auf-schleier) 10%, transparent); --kopf-blur: 16px;
    }
  }
}
.randtext {
  --randtext-lage: calc(var(--rand) / 2);
  --randtext-versatz: 0px;
  display: none; position: fixed; top: 50%; z-index: 5; margin: 0; pointer-events: none;
  writing-mode: vertical-rl; white-space: nowrap; line-height: 1;
  font-size: var(--randtext-groesse); letter-spacing: var(--randtext-sperrung); text-transform: var(--randtext-schreibung); color: var(--gedaempft);
}
.randtext.randtext--link { pointer-events: auto; text-decoration: none; transition: color .2s; }
.randtext.randtext--link:is(:hover, :focus-visible) { color: var(--text); }
.randtext--klein { --randtext-lage: calc(var(--rand) / 4); }
.randtext--gross { --randtext-lage: calc(var(--rand) * 3 / 4); }
.randtext:is(.randtext--am-inhalt, .randtext--im-kasten) { --randtext-versatz: max(0px, (100% - var(--breite)) / 2 - var(--rand)); }
.mit-kasten .randtext--am-inhalt { --randtext-versatz: max(0px, (100% - var(--kasten-breite)) / 2 - var(--rand)); }
@media (min-width: 64rem) {
  .randtext { display: block; }
  .randtext--links { left: max(var(--randtext-versatz) + var(--randtext-lage), 0.75em); transform: translate(-50%, -50%) rotate(180deg); }
  .randtext--rechts { right: max(var(--randtext-versatz) + var(--randtext-lage), 0.75em); transform: translate(50%, -50%); }
}
:root:not(:has(.kasten--ohne-kopf, .kasten--inhalt)):has(main > .block--hero:first-child .hero--voll) .block--kopf:not(:has(.kopf--ueber)) {
  position: absolute; top: var(--kopf-fest-oben, 0px); left: var(--kopf-fest-rand, 0px); right: var(--kopf-fest-rand, 0px); z-index: 10; background: var(--grund);
}
:root:not(:has(.kasten--ohne-kopf, .kasten--inhalt)):has(main > .block--hero:first-child .hero--voll) .block--kopf:has(.kopf--fixiert):not(:has(.kopf--ueber)) { position: fixed; }
:root:not(:has(.kasten--ohne-kopf, .kasten--inhalt)):has(main > .block--hero:first-child .hero--voll) main > .block--hero:first-child { padding-block: 0; }
:root:not(:has(.kasten--ohne-kopf, .kasten--inhalt)):has(main > .block--hero:first-child .hero--voll) main > .block--hero:first-child .hero__folie {
  padding-block: calc(min(var(--abstand-mittel), 8svh) + var(--einheit) * 9) min(var(--abstand-mittel), 8svh);
}
:root[data-js]:not([data-hero-weg]) body:has(main > .block--hero:first-child) .kopf--marke-spaeter .kopf__marke { opacity: 0; visibility: hidden; }
.kopf--marke-spaeter .kopf__marke { transition: opacity 0.3s, visibility 0.3s; }
@media (prefers-reduced-motion: reduce) { .kopf--marke-spaeter .kopf__marke { transition: none; } }
.block--kopf:has(.kopf--mischen) { mix-blend-mode: difference; background: transparent; }
.kopf--mischen :is(.kopf__marke, .kopf__knopf, .kopf__farbe), .kopf--mischen .kopf__menue:not(:popover-open) a { color: #fff; border-color: rgb(255 255 255 / 0.6); }
.kopf--mischen .kopf__striche, .kopf--mischen .kopf__striche::before, .kopf--mischen .kopf__striche::after { background: #fff; }
.kopf__menue:not(:popover-open) :is(.kopf__menue-logo, .kopf__nur-menue, .kopf__extra) { display: none; }
.kopf--knopf-symbol .kopf__knopf { border: 0; padding: calc(var(--einheit) * 0.75); font-size: var(--groesse-h3); min-width: 2.75rem; min-height: 2.75rem; justify-content: center; vertical-align: middle; }
.kopf--knopf-symbol .kopf__striche, .kopf--knopf-symbol .kopf__striche::before, .kopf--knopf-symbol .kopf__striche::after { height: 3px; width: 1.2em; }
.kopf__menue:popover-open .kopf__menue-logo { display: inline-flex; margin-top: calc(var(--einheit) * 6); }
.kopf__menue-logo :is(img, svg) { height: clamp(5rem, 4rem + 4vw, 7rem); width: auto; }
.kopf--menue-mittig .kopf__menue:popover-open { display: flex; flex-direction: column; align-items: center; text-align: center; gap: calc(var(--einheit) * 4); }
.kopf--menue-mittig .kopf__menue:popover-open > ul:first-of-type { width: min(100%, 26rem); margin-top: 0; gap: calc(var(--einheit) * 1.5); text-transform: none; letter-spacing: normal; font-family: var(--schrift-text); font-size: var(--groesse-h3); font-weight: 700; }
.kopf--menue-mittig .kopf__menue:popover-open > ul:first-of-type a { display: block; padding: 0.35em 1em; background: color-mix(in srgb, var(--text) 20%, var(--grund)); text-decoration: none; }
.kopf--menue-mittig .kopf__menue:popover-open > ul:first-of-type a:is(:hover, [aria-current="page"]) { background: color-mix(in srgb, var(--text) 32%, var(--grund)); }
.kopf__extra { display: flex; flex-direction: column; align-items: center; gap: calc(var(--einheit) * 3); margin-top: calc(var(--einheit) * 6); font-size: var(--groesse-text); }
.kopf__menue:popover-open .kopf__extra ul { flex-direction: row; flex-wrap: wrap; justify-content: center; margin: 0; font-family: var(--schrift-text); font-size: inherit; font-weight: 400; line-height: inherit; letter-spacing: normal; text-transform: none; }
.kopf__menue:popover-open .kopf__social { gap: calc(var(--einheit) * 1.5); }
.kopf__social a { display: inline-flex; }
.kopf__social svg { width: 1.4rem; height: 1.4rem; fill: currentColor; }
.kopf__social--farbig a { width: 2.75rem; height: 2.75rem; align-items: center; justify-content: center; border-radius: calc(var(--radius) / 2); background: var(--netz, var(--text)); }
.kopf__menue:popover-open .kopf__social--farbig a { color: #fff; }
.kopf__kontakt { max-width: 30rem; color: var(--gedaempft); }
.kopf__kontakt p { margin: 0; }
.kopf__kontakt-titel { color: var(--text); text-transform: uppercase; }
.kopf__menue:popover-open .kopf__kontakt a { color: var(--gedaempft); text-decoration: none; }
.kopf__menue:popover-open .kopf__extra .kopf__recht { gap: calc(var(--einheit) * 2); text-transform: uppercase; }
.kopf__menue:popover-open .kopf__recht a { color: var(--gedaempft); text-decoration: none; }
@media (max-width: 47.99rem) {
  .block--kopf:has(.kopf--ueber-ab-48) {
    position: relative !important; top: auto !important; left: auto !important; right: auto !important; animation: none !important;
    --kopf-farbe: var(--text) !important; --kopf-grund: var(--grund) !important; --kopf-blur: 0px !important; --kopf-hell: 0 !important;
  }
  .block--kopf:has(.kopf--ueber-ab-48.kopf--fixiert) { position: sticky !important; top: 0 !important; }
  :root:has(.kopf--ueber-ab-48) main > .block--hero.variante--vollbild:first-child .hero__folie { padding-top: min(var(--abstand-mittel), 8svh) !important; }
}
@media (max-width: 63.99rem) {
  .block--kopf:has(.kopf--ueber-ab-64) {
    position: relative !important; top: auto !important; left: auto !important; right: auto !important; animation: none !important;
    --kopf-farbe: var(--text) !important; --kopf-grund: var(--grund) !important; --kopf-blur: 0px !important; --kopf-hell: 0 !important;
  }
  .block--kopf:has(.kopf--ueber-ab-64.kopf--fixiert) { position: sticky !important; top: 0 !important; }
  :root:has(.kopf--ueber-ab-64) main > .block--hero.variante--vollbild:first-child .hero__folie { padding-top: min(var(--abstand-mittel), 8svh) !important; }
}
@media (max-width: 79.99rem) {
  .block--kopf:has(.kopf--ueber-ab-80) {
    position: relative !important; top: auto !important; left: auto !important; right: auto !important; animation: none !important;
    --kopf-farbe: var(--text) !important; --kopf-grund: var(--grund) !important; --kopf-blur: 0px !important; --kopf-hell: 0 !important;
  }
  .block--kopf:has(.kopf--ueber-ab-80.kopf--fixiert) { position: sticky !important; top: 0 !important; }
  :root:has(.kopf--ueber-ab-80) main > .block--hero.variante--vollbild:first-child .hero__folie { padding-top: min(var(--abstand-mittel), 8svh) !important; }
}
@media (prefers-reduced-motion: no-preference) {
  .kopf--effekt-blenden .kopf__menue:popover-open { transition: opacity 0.3s ease; }
  .kopf--effekt-schieben .kopf__menue:popover-open { transition: opacity 0.3s ease, translate 0.35s cubic-bezier(0.2, 0.7, 0.2, 1); }
  .kopf--effekt-aufziehen .kopf__menue:popover-open {
    --kreis: calc(100% - var(--rand) - 1.375rem) calc(var(--abstand-knapp) + 1.375rem);
    clip-path: circle(150% at var(--kreis)); transition: clip-path 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  }
  .kopf--nacheinander .kopf__menue:popover-open :is(ul > li, .kopf__menue-logo, .kopf__extra) { transition: opacity 0.35s ease, translate 0.35s cubic-bezier(0.2, 0.7, 0.2, 1); transition-delay: 0.12s; }
  .kopf--nacheinander .kopf__menue:popover-open ul > li:nth-child(2) { transition-delay: 0.17s; }
  .kopf--nacheinander .kopf__menue:popover-open ul > li:nth-child(3) { transition-delay: 0.22s; }
  .kopf--nacheinander .kopf__menue:popover-open ul > li:nth-child(4) { transition-delay: 0.27s; }
  .kopf--nacheinander .kopf__menue:popover-open ul > li:nth-child(5) { transition-delay: 0.32s; }
  .kopf--nacheinander .kopf__menue:popover-open ul > li:nth-child(n + 6) { transition-delay: 0.37s; }
  .kopf--nacheinander .kopf__menue:popover-open .kopf__extra { transition-delay: 0.42s; }
  @starting-style {
    .kopf--effekt-blenden .kopf__menue:popover-open { opacity: 0; }
    .kopf--effekt-schieben .kopf__menue:popover-open { opacity: 0; translate: 0 -2rem; }
    .kopf--effekt-aufziehen .kopf__menue:popover-open { clip-path: circle(0 at var(--kreis)); }
    .kopf--nacheinander .kopf__menue:popover-open :is(ul > li, .kopf__menue-logo, .kopf__extra) { opacity: 0; translate: 0 0.75rem; }
  }
}
.kopf__sprachen { display: flex; gap: 0.6em; list-style: none; margin: 0; padding: 0; font-size: var(--navigation-groesse); }
.kopf__sprachen a { color: var(--navigation-farbe); text-decoration: none; }
.kopf__sprachen a:hover { color: var(--text); text-decoration: underline; }
.kopf__sprachen a[aria-current] { color: var(--text); font-weight: 700; }
.kopf--mittig > .kopf__sprachen { grid-column: 4; grid-row: 1; justify-self: end; }
.kopf__aufruf {
  display: inline-flex; align-items: center; min-height: 2.75rem; padding: 0.3em 1.1em;
  border: 1px solid var(--akzent); border-radius: 999px; color: var(--text); text-decoration: none;
  font-size: var(--navigation-groesse); font-weight: var(--navigation-gewicht); line-height: 1.2; white-space: nowrap;
  transition: background-color 0.2s, color 0.2s;
}
.kopf__aufruf:is(:hover, :focus-visible) { background: var(--akzent); color: var(--auf-akzent); }
.kopf__aufruf--gross { text-transform: uppercase; letter-spacing: 0.02em; }
@media (prefers-reduced-motion: reduce) { .kopf__aufruf { transition: none; } }
.block--kopf:has(.kopf--schwebend) {
  position: absolute; top: var(--kopf-fest-oben, 0px); left: var(--kopf-fest-rand, 0px); right: var(--kopf-fest-rand, 0px);
  z-index: 10; background: none; pointer-events: none; padding-inline: calc(var(--rand) / 2);
}
.block--kopf:has(.kopf--schwebend.kopf--fixiert) { position: fixed; }
.kopf--schwebend > * { pointer-events: auto; }
.kopf--schwebend { align-items: flex-start; flex-wrap: nowrap; }
@container (max-width: 40rem) {
  .kopf--schwebend { column-gap: var(--einheit); }
  .kopf--schwebend .kopf__aufruf { font-size: min(var(--navigation-groesse), 0.9375rem); padding-inline: 0.9em; }
  .kopf--schwebend .kopf__sprachen { padding-inline: 0.6em; }
}
.kopf--schwebend :is(.kopf__sprachen, .kopf__aufruf, .kopf__knopf, .kopf__farbe) { background-color: color-mix(in srgb, var(--grund) 80%, transparent); border-radius: 999px; }
.kopf--schwebend .kopf__aufruf:is(:hover, :focus-visible) { background-color: var(--akzent); }
.kopf--schwebend .kopf__sprachen { align-items: center; min-height: 2.75rem; padding-inline: 0.9em; }
.kopf__betont { color: var(--akzent-text); }
.kopf__zahl {
  display: inline-grid; place-items: center; min-width: 1.35em; height: 1.35em; padding-inline: 0.25em; margin-inline-start: 0.2em;
  vertical-align: super; font-size: 0.375em; font-weight: 700; line-height: 1; letter-spacing: 0;
  border-radius: 999px; background: var(--akzent); color: var(--auf-akzent);
}
.kopf__menue:not([popover]) .kopf__zahl, .kopf__menue:not(:popover-open) .kopf__zahl { font-size: 0.7em; }
.kopf { --kopf-x: var(--rand); }
.kopf--schwebend { --kopf-x: calc(var(--rand) / 2); }
.kopf__menue:not(:popover-open) .kopf__aufruf--menue { display: none; }
.kopf--spalten .kopf__menue:popover-open {
  display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); align-content: safe center; align-items: center;
  gap: calc(var(--einheit) * 6) calc(var(--einheit) * 4); padding-inline: max(var(--rand), 10vw);
  padding-top: calc(var(--abstand-knapp) + 7rem); background: color-mix(in srgb, var(--grund) 95%, transparent);
}
.kopf--spalten .kopf__menue:popover-open > ul:first-of-type { grid-column: 2; grid-row: 1; margin: 0; gap: calc(var(--einheit) * 2); font-size: clamp(1.625rem, 0.9rem + 3.2vw, 3.6rem); line-height: 1.3; }
.kopf--spalten.kopf--menue-normal .kopf__menue:popover-open > ul:first-of-type { font-size: var(--groesse-h2); }
.kopf--menue-leicht .kopf__menue:popover-open > ul:first-of-type { font-weight: var(--navigation-gewicht); }
.kopf--spalten .kopf__menue:popover-open > ul:first-of-type a { text-decoration: none; }
.kopf--spalten .kopf__menue:popover-open > ul:first-of-type a:hover { text-decoration: underline; text-decoration-thickness: 0.05em; text-underline-offset: 0.12em; }
.kopf--spalten .kopf__menue:popover-open .kopf__menue-logo { position: absolute; top: var(--abstand-knapp); left: var(--kopf-x); margin: 0; }
.kopf--spalten .kopf__menue-logo :is(img, svg) { height: 2rem; }
.kopf--spalten:has(.kopf__logo--klein) .kopf__menue-logo :is(img, svg) { height: 1.5rem; }
.kopf--spalten:has(.kopf__logo--gross) .kopf__menue-logo :is(img, svg) { height: 2.75rem; }
.kopf--spalten:has(.kopf__logo--riesig) .kopf__menue-logo :is(img, svg) { height: 3.75rem; }
.kopf--spalten:has(.kopf__logo--maximal) .kopf__menue-logo :is(img, svg) { height: 5.25rem; }
.kopf--spalten .kopf__schliessen { top: var(--abstand-knapp); right: var(--kopf-x); width: 2.75rem; height: 2.75rem; padding: 0; border: 0; justify-content: center; }
.kopf__kreuz { position: relative; width: 1.5rem; height: 1.5rem; }
.kopf__kreuz::before, .kopf__kreuz::after { content: ""; position: absolute; left: -0.1rem; right: -0.1rem; top: 50%; height: 3px; margin-top: -1.5px; background: currentColor; rotate: 45deg; }
.kopf__kreuz::after { rotate: -45deg; }
.kopf--spalten .kopf__aufruf--menue { position: absolute; top: var(--abstand-knapp); right: calc(var(--kopf-x) + 2.75rem + var(--einheit) * 3); }
.kopf--spalten .kopf__menue:popover-open .kopf__extra { grid-column: 1; grid-row: 1; align-items: flex-start; gap: calc(var(--einheit) * 2); margin: 0; color: var(--text); line-height: 1.6; }
.kopf--spalten .kopf__extra :is(address, p) { margin: 0; font-style: normal; }
.kopf--spalten .kopf__extra strong { color: var(--akzent-text); font-weight: inherit; }
.kopf--spalten .kopf__menue:popover-open .kopf__extra a { color: var(--text); text-decoration: none; }
.kopf--spalten .kopf__menue:popover-open .kopf__extra a:hover { text-decoration: underline; }
.kopf--spalten .kopf__menue:popover-open .kopf__extra .kopf__recht { justify-content: flex-start; gap: 0; text-transform: none; }
.kopf--spalten .kopf__recht li + li::before { content: "|" / ""; margin-inline: 0.3em; }
.kopf--spalten .kopf__menue:popover-open .kopf__extra .kopf__social { justify-content: flex-start; gap: calc(var(--einheit) * 1.25); margin-top: calc(var(--einheit) * 4); }
@media (max-width: 47.99rem) {
  .kopf--spalten .kopf__menue:popover-open { grid-template-columns: minmax(0, 1fr); align-content: start; }
  .kopf--spalten .kopf__menue:popover-open > ul:first-of-type { grid-column: 1; grid-row: 1; gap: var(--einheit); }
  .kopf--spalten .kopf__menue:popover-open .kopf__extra { grid-column: 1; grid-row: 2; }
}
@container (max-width: 40rem) {
  .kopf--spalten .kopf__aufruf--menue { right: calc(var(--kopf-x) + 2.75rem + var(--einheit)); }
}
.kopf__social--rahmen a { display: grid; place-items: center; width: 2.5rem; height: 2.5rem; border: 2px solid var(--akzent); border-radius: 0.4rem; }
.kopf__menue:popover-open .kopf__social--rahmen a { color: var(--akzent-text); }
.kopf__menue:popover-open .kopf__social--rahmen a:hover { background: var(--akzent); color: var(--auf-akzent); }
.kopf__social--rahmen svg { width: 1.5rem; height: 1.5rem; }
.kopf:has(.kopf__titel) .kopf__marke { margin-inline-end: 0; }
.kopf__titel { margin-inline-end: auto; min-width: 0; display: flex; flex-direction: column; gap: 0.15em; }
.kopf__titel-text { margin: 0; font-family: var(--schrift-titel); font-size: var(--kopftitel-groesse); font-weight: var(--navigation-gewicht); line-height: 1.1; text-transform: uppercase; color: var(--kopftitel-farbe); overflow-wrap: anywhere; }
.kopf__unternav { display: flex; flex-wrap: wrap; list-style: none; margin: 0; padding: 0; font-size: calc(var(--kopftitel-groesse) * 0.6); font-weight: 300; line-height: 1.2; text-transform: uppercase; }
.kopf__unternav li + li::before { content: "|" / ""; margin-inline: 0.3em; color: var(--kopftitel-farbe); }
.kopf__unternav a { color: var(--text); text-decoration: none; }
.kopf__unternav a:hover { text-decoration: underline; }
.kopf__unternav a[aria-current] { font-weight: 700; }
.kopf--schwebend .kopf__titel { padding: 0.15em 0.4em; margin-inline-start: -0.4em; background: color-mix(in srgb, var(--grund) 92%, transparent); box-shadow: 0 0 2rem 1.25rem color-mix(in srgb, var(--grund) 92%, transparent); border-radius: var(--radius); }
.kopf--schwebend .kopf__marke { flex-shrink: 0; }
:root:has(.kopf--schwebend .kopf__titel) main { padding-block-start: calc(var(--abstand-knapp) + 5rem); }
@container (max-width: 40rem) {
  .kopf:has(.kopf__titel) .kopf__aufruf:not(.kopf__aufruf--menue) { display: none; }
  .kopf__unternav { font-size: 0.6875rem; }
}
@keyframes kopf-titel-weg { to { opacity: 0; visibility: hidden; } }
@supports (animation-timeline: scroll()) {
  @container (max-width: 40rem) {
    .kopf--schwebend .kopf__titel { animation: kopf-titel-weg linear both; animation-timeline: scroll(root); animation-range: 0 6rem; }
  }
}