

:root {
  --bg:      #F5F8FC;
  --surface: #FFFFFF;
  --text:    #0E1B2A;
  --muted:   #57687A;
  --accent:  #1F5FA8;
  --accent2: #9DBBD8;

  --linie:      rgba(31,95,168,.16);
  --linie-fein: rgba(14,27,42,.10);
  --akzent-tint: rgba(157,187,216,.16);
  --akzent-tint-stark: rgba(157,187,216,.28);
  --akzent-hover: #17497f;

  --site-bg:      #F5F8FC;
  --site-surface: #FFFFFF;
  --site-text:    #0E1B2A;
  --site-muted:   #57687A;
  --site-accent:  #1F5FA8;

  --serif: "Libre Baskerville", Georgia, "Times New Roman", serif;
  --grotesk: "Barlow", system-ui, sans-serif;

  --raum: clamp(64px, 9vw, 104px);
  --huelle: 720px;
  --breit: 1040px;
  --rand: clamp(20px, 5vw, 32px);
  --radius: 4px}

* { box-sizing: border-box}

html { -webkit-text-size-adjust: 100%}

body {
  margin: 0;
  font-family: var(--grotesk);
  font-weight: 400;
  line-height: 1.75;
  color: var(--text);
  font-size: clamp(16px, 1.05vw, 17px);
  
  background: linear-gradient(180deg, #F5F8FC 0%, #EAF0F7 100%);
  background-size: 100% 220%;
  background-attachment: fixed;
  animation: bnt-drift 70s ease-in-out infinite alternate;
  -webkit-font-smoothing: antialiased}

@keyframes bnt-drift {
  from { background-position: 0 0}
  to   { background-position: 0 100%}
}

img { max-width: 100%; display: block}

h1, h2, h3, h4 {
  font-family: var(--serif);
  font-weight: 700;
  line-height: 1.2;
  color: var(--text);
  margin: 0 0 .6em}

p { margin: 0 0 1.1em}

a { color: var(--accent); text-decoration: none}
a:hover { color: var(--akzent-hover); text-decoration: underline}

:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
  border-radius: 2px}

.bnt-huelle {
  width: 100%;
  max-width: var(--huelle);
  margin-inline: auto;
  padding-inline: var(--rand)}
.bnt-huelle--breit { max-width: var(--breit)}

.bnt-sektion { padding-block: var(--raum)}

.bnt-mass { max-width: 68ch}

.bnt-anker { margin-bottom: clamp(28px, 4vw, 44px)}
.bnt-anker-ziffer {
  font-family: var(--serif);
  font-weight: 400;
  font-size: clamp(44px, 7vw, 76px);
  line-height: 1;
  color: var(--accent);
  display: block;
  letter-spacing: -.01em}
.bnt-anker-linie {
  width: 56px;
  height: 1px;
  background: var(--accent);
  border: 0;
  margin: 18px 0}
.bnt-anker-titel {
  font-size: clamp(1.5rem, 3.4vw, 2.25rem);
  margin: 0}
.bnt-anker-vor {
  text-transform: uppercase;
  letter-spacing: .16em;
  font-size: 12px;
  color: var(--muted);
  font-family: var(--grotesk);
  font-weight: 600}

.bnt-kopfzeile {
  position: sticky;
  top: 0;
  z-index: 40;
  background: rgba(245,248,252,.86);
  backdrop-filter: blur(8px);
  transition: background .25s ease, border-color .25s ease}
.bnt-kopfzeile.is-scrolled { border-bottom: 1px solid var(--linie-fein)}

.bnt-kopf-marke {
  height: 88px;
  display: flex;
  align-items: center;
  justify-content: center}

.bnt-kopf-navreihe {
  height: 46px;
  border-top: 1px solid var(--linie);
  border-bottom: 1px solid var(--linie);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative}

.bnt-wortmarke {
  display: inline-flex;
  align-items: center;
  gap: .5em;
  text-decoration: none;
  color: var(--text)}
.bnt-wortmarke:hover { text-decoration: none}
.bnt-wortmarke svg {
  width: 30px;
  height: 30px;
  color: var(--accent);
  flex: none}
.bnt-wortmarke span {
  font-family: var(--serif);
  font-weight: 700;
  font-size: clamp(1.35rem, 2.4vw, 1.7rem);
  letter-spacing: .01em;
  line-height: 1}

.bnt-nav {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 0}
.bnt-nav li { display: flex; align-items: center; min-width: 0}
.bnt-nav li + li::before {
  content: "·";
  color: var(--muted);
  margin: 0 .7em}
.bnt-nav a {
  font-size: 15px;
  color: var(--muted);
  text-decoration: none;
  letter-spacing: .01em;
  padding: 4px 0}
.bnt-nav a:hover,
.bnt-nav a[aria-current="page"] { color: var(--accent)}

.bnt-burger {
  position: absolute;
  right: var(--rand);
  top: 50%;
  transform: translateY(-50%);
  display: none;
  border: 0;
  background: none;
  color: var(--text);
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  padding: 6px}

.bnt-schublade {
  position: fixed;
  top: 0;
  right: 0;
  height: 100dvh;
  width: min(80vw, 320px);
  background: var(--surface);
  border-left: 1px solid var(--linie);
  transform: translateX(100%);
  transition: transform .3s ease;
  z-index: 60;
  padding: 28px var(--rand);
  overflow-y: auto}
.bnt-schublade.is-open { transform: translateX(0)}
.bnt-schublade ul { list-style: none; margin: 32px 0 0; padding: 0}
.bnt-schublade li { border-bottom: 1px solid var(--linie-fein)}
.bnt-schublade a {
  display: block;
  padding: 14px 0;
  font-size: 1.05rem;
  color: var(--text);
  text-decoration: none}
.bnt-schublade a:hover { color: var(--accent)}
.bnt-schublade-zu {
  border: 0;
  background: none;
  font-size: 22px;
  color: var(--muted);
  cursor: pointer;
  float: right;
  padding: 4px}

.bnt-abdunkeln {
  position: fixed;
  inset: 0;
  background: rgba(14,27,42,.42);
  opacity: 0;
  visibility: hidden;
  transition: opacity .3s ease, visibility .3s ease;
  z-index: 50}
.bnt-abdunkeln.is-open { opacity: 1; visibility: visible}

.pressable-jvy {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5em;
  font-family: var(--grotesk);
  font-weight: 600;
  font-size: 1rem;
  line-height: 1;
  padding: 14px 26px;
  border-radius: var(--radius);
  border: 1px solid transparent;
  cursor: pointer;
  text-decoration: none;
  transition: background .2s ease, color .2s ease, border-color .2s ease;
  min-height: 48px}
.pressable-jvy:hover { text-decoration: none}
.pressable-jvy:disabled { opacity: .5; cursor: not-allowed}

.pressable-jvy--primary {
  background: var(--accent);
  color: #fff}
.pressable-jvy--primary:hover { background: var(--akzent-hover); color: #fff}

.pressable-jvy--ghost {
  background: transparent;
  color: var(--accent);
  border-color: var(--linie)}
.pressable-jvy--ghost:hover { border-color: var(--accent); color: var(--accent)}

.bnt-feld { margin-bottom: 20px}
.bnt-feld label,
.bnt-etikett {
  display: block;
  font-size: 14px;
  font-weight: 600;
  color: var(--text);
  margin-bottom: 7px}
.bnt-feld-hinweis { font-size: 13px; color: var(--muted)}

.input-1i6 {
  width: 100%;
  min-width: 0;
  font-family: var(--grotesk);
  font-size: 1rem;
  color: var(--text);
  background: var(--surface);
  border: 1px solid var(--linie);
  border-radius: var(--radius);
  padding: 13px 15px;
  min-height: 48px;
  transition: border-color .2s ease, box-shadow .2s ease}
textarea.input-1i6 { min-height: 140px; resize: vertical; line-height: 1.6}
.input-1i6::placeholder { color: var(--muted)}
.input-1i6:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--akzent-tint-stark)}

.tile-p78 {
  background: var(--surface);
  border: 1px solid var(--linie-fein);
  border-radius: var(--radius);
  padding: clamp(22px, 3vw, 30px)}

.badge-gi8 {
  display: inline-flex;
  align-items: center;
  gap: .4em;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--accent);
  background: var(--akzent-tint);
  border-radius: 999px;
  padding: 5px 12px}

.bnt-buehne { padding-block: clamp(56px, 8vw, 96px)}
.bnt-buehne-raster {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(32px, 5vw, 52px);
  align-items: end}
.bnt-buehne-titel {
  font-size: clamp(2.1rem, 5.5vw, 3.4rem);
  margin: 0 0 .4em}
.bnt-buehne-lead {
  font-size: clamp(1.05rem, 2vw, 1.25rem);
  color: var(--muted);
  max-width: 60ch}
.bnt-buehne-tat { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 28px}

.bnt-statreihe {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(24px, 4vw, 44px);
  margin-top: 40px;
  padding-top: 28px;
  border-top: 1px solid var(--linie)}
.bnt-stat { min-width: 0}
.bnt-stat-zahl {
  font-family: var(--serif);
  font-weight: 400;
  font-size: clamp(2rem, 4vw, 2.9rem);
  color: var(--accent);
  line-height: 1}
.bnt-stat-label {
  display: block;
  font-size: 14px;
  color: var(--muted);
  margin-top: 8px}

.bnt-preiskarte { align-self: end}
.bnt-preiskarte .bnt-preis-kopf {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 16px}
.bnt-preis-wert {
  font-family: var(--serif);
  font-size: 2.2rem;
  color: var(--text)}
.bnt-preis-liste { list-style: none; margin: 0 0 22px; padding: 0}
.bnt-preis-liste li {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 10px;
  padding: 11px 0;
  border-bottom: 1px solid var(--linie-fein);
  font-size: 15px}
.bnt-preis-liste li:last-child { border-bottom: 0}
.bnt-preis-liste span:last-child { color: var(--muted)}

@media (min-width: 900px) {
  .bnt-buehne-raster { grid-template-columns: 1.5fr .9fr}
}

.bnt-buehne--typo { text-align: center; padding-block: clamp(72px, 12vw, 140px)}
.bnt-buehne--typo .bnt-buehne-titel {
  font-size: clamp(2.6rem, 7vw, 4.6rem);
  margin-inline: auto}
.bnt-buehne--typo .bnt-buehne-lead { margin-inline: auto}

.bnt-buehne--rahmen .bnt-rahmen {
  border: 1px solid var(--linie);
  border-radius: var(--radius);
  padding: clamp(40px, 7vw, 88px);
  text-align: center}

.bnt-buehne--geteilt .bnt-buehne-raster { align-items: center}
.bnt-buehne-bild {
  aspect-ratio: 4/5;
  border-radius: var(--radius);
  overflow: hidden;
  border: 1px solid var(--linie-fein)}
.bnt-buehne-bild img { width: 100%; height: 100%; object-fit: cover}
@media (min-width: 900px) {
  .bnt-buehne--geteilt .bnt-buehne-raster { grid-template-columns: 1.1fr .9fr}
}

.bnt-buehne--kompakt { text-align: center; padding-block: clamp(52px, 8vw, 88px)}
.bnt-buehne--kompakt .bnt-buehne-lead { margin-inline: auto}

.bnt-journal {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 24px}
.bnt-journal-karte {
  display: flex;
  flex-direction: column;
  min-width: 0;
  height: 100%}
.bnt-journal-bild {
  aspect-ratio: 16/10;
  border-radius: var(--radius);
  overflow: hidden;
  margin-bottom: 18px;
  border: 1px solid var(--linie-fein)}
.bnt-journal-bild img { width: 100%; height: 100%; object-fit: cover}
.bnt-journal-datum {
  font-size: 13px;
  color: var(--muted);
  letter-spacing: .04em;
  text-transform: uppercase}
.bnt-journal-titel {
  font-size: 1.2rem;
  margin: 8px 0 0;
  color: var(--text)}
a.bnt-journal-karte:hover .bnt-journal-titel { color: var(--accent)}

.bnt-material {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 24px}
.bnt-material-karte {
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-width: 0}
.bnt-material-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  color: var(--muted)}
.bnt-material-groesse::before { content: "· "}

.bnt-downloads { border-top: 1px solid var(--linie)}
.bnt-download-zeile {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px;
  justify-content: space-between;
  padding: 22px 0;
  border-bottom: 1px solid var(--linie);
  text-decoration: none;
  color: var(--text)}
.bnt-download-zeile:hover { color: var(--accent); text-decoration: none}
.bnt-download-zeile > div { min-width: 0}
.bnt-download-titel { font-family: var(--serif); font-size: 1.15rem}
.bnt-download-info { font-size: 13px; color: var(--muted)}

.bnt-schritte {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 28px}
.bnt-schritt { min-width: 0}
.bnt-schritt-nr {
  font-family: var(--serif);
  font-size: clamp(2.2rem, 4vw, 3rem);
  color: var(--accent);
  line-height: 1;
  display: block}
.bnt-schritt-nr + hr {
  width: 40px; height: 1px; background: var(--accent); border: 0; margin: 14px 0}
.bnt-schritt-titel { font-size: 1.15rem; margin: 0 0 .4em}
.bnt-schritt p { color: var(--muted); font-size: 15px; margin: 0}

.bnt-zeitstrahl { list-style: none; margin: 0; padding: 0; position: relative}
.bnt-zeitstrahl::before {
  content: "";
  position: absolute;
  left: 15px; top: 8px; bottom: 8px;
  width: 1px;
  background: var(--linie)}
.bnt-zeitstrahl li {
  position: relative;
  padding: 0 0 40px 52px;
  min-width: 0}
.bnt-zeitstrahl li:last-child { padding-bottom: 0}
.bnt-zeitstrahl-punkt {
  position: absolute;
  left: 0; top: 0;
  width: 32px; height: 32px;
  border-radius: 50%;
  border: 1px solid var(--accent);
  background: var(--surface);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--serif);
  color: var(--accent);
  font-size: 14px}

.bnt-schritte--chips .bnt-schritt {
  padding-top: 20px;
  border-top: 1px solid var(--linie)}
.bnt-schritt-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px}

.bnt-fallstudie {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 28px}
.bnt-akt { min-width: 0}
.bnt-akt-marke {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .16em;
  color: var(--accent);
  font-weight: 600;
  display: block;
  margin-bottom: 12px}
.bnt-akt h3 { font-size: 1.2rem}
.bnt-akt p { color: var(--muted); margin: 0}

.bnt-fallstudie--zahl {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(24px, 4vw, 44px);
  align-items: start}
.bnt-fallzahl {
  font-family: var(--serif);
  font-size: clamp(3.4rem, 9vw, 6rem);
  color: var(--accent);
  line-height: .95}
.bnt-fallzahl small {
  display: block;
  font-family: var(--grotesk);
  font-size: 14px;
  color: var(--muted);
  margin-top: 12px;
  letter-spacing: .04em;
  text-transform: uppercase}
@media (min-width: 820px) {
  .bnt-fallstudie--zahl { grid-template-columns: .8fr 1.2fr}
}

.bnt-orte {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 24px}
.bnt-ort-bild {
  aspect-ratio: 3/4;
  border-radius: var(--radius);
  overflow: hidden;
  border: 1px solid var(--linie-fein);
  margin-bottom: 12px}
.bnt-ort-bild img { width: 100%; height: 100%; object-fit: cover}
.bnt-ort-text { font-size: 14px; color: var(--muted)}

.bnt-anfahrt {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(24px, 4vw, 40px)}
.bnt-anfahrt address { font-style: normal; line-height: 1.9}
.bnt-anfahrt-liste { list-style: none; margin: 0; padding: 0}
.bnt-anfahrt-liste li {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: baseline;
  padding: 12px 0;
  border-bottom: 1px solid var(--linie-fein)}
.bnt-anfahrt-liste li i { color: var(--accent); flex: none}
@media (min-width: 820px) {
  .bnt-anfahrt { grid-template-columns: 1fr 1fr}
}

.bnt-zitat { text-align: center; max-width: 780px; margin-inline: auto}
.bnt-zitat-text {
  font-family: var(--serif);
  font-weight: 400;
  font-size: clamp(1.4rem, 3.4vw, 2.1rem);
  line-height: 1.45;
  color: var(--text);
  margin: 0}
.bnt-zitat-quelle {
  margin-top: 24px;
  padding-top: 16px;
  display: inline-block;
  border-top: 1px solid var(--accent);
  font-size: 14px;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--muted)}

.bnt-zitat--gross .bnt-zitat-text { font-size: clamp(1.8rem, 5.5vw, 3.4rem); line-height: 1.3}

.bnt-zitat--portrait {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(24px, 4vw, 44px);
  align-items: center;
  text-align: left;
  max-width: var(--breit)}
.bnt-zitat--portrait .bnt-zitat-text { font-size: clamp(1.3rem, 2.6vw, 1.8rem)}
.bnt-zitat-bild {
  aspect-ratio: 1/1;
  border-radius: var(--radius);
  overflow: hidden;
  border: 1px solid var(--linie-fein)}
.bnt-zitat-bild img { width: 100%; height: 100%; object-fit: cover}
@media (min-width: 820px) {
  .bnt-zitat--portrait { grid-template-columns: .7fr 1.3fr}
}

.bnt-stimmen {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 24px}
.bnt-stimme-karte { display: flex; flex-direction: column; gap: 16px; min-width: 0}
.bnt-stimme-karte p { margin: 0; color: var(--text)}
.bnt-sterne { color: var(--accent); font-size: 14px; letter-spacing: .1em}
.bnt-stimme-quelle {
  font-size: 14px;
  color: var(--muted);
  margin-top: auto;
  padding-top: 12px;
  border-top: 1px solid var(--linie-fein)}
.bnt-stimme-quelle strong { color: var(--text); font-family: var(--serif); font-weight: 700}

.bnt-stimmen--zwei { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr))}
.bnt-stimmen--drei { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr))}

.bnt-newsletter {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(28px, 4vw, 48px);
  align-items: center}
.bnt-newsletter-versprechen h2 { font-size: clamp(1.6rem, 3.4vw, 2.3rem)}
.bnt-newsletter-versprechen p { color: var(--muted); margin: 0}
.bnt-newsletter-form .bnt-feld:last-of-type { margin-bottom: 16px}
@media (min-width: 820px) {
  .bnt-newsletter { grid-template-columns: 1fr 1fr}
}

.bnt-newsletter--band {
  background: var(--akzent-tint);
  border-radius: var(--radius);
  padding: clamp(32px, 5vw, 56px);
  text-align: center}
.bnt-newsletter--band .bnt-inline-form {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: center;
  max-width: 520px;
  margin: 22px auto 0}
.bnt-newsletter--band .input-1i6 { flex: 1 1 240px}
.bnt-newsletter--band .pressable-jvy { flex: 0 0 auto}

.bnt-newsletter--karte {
  border: 1px solid var(--linie);
  border-radius: var(--radius);
  padding: clamp(28px, 4vw, 44px);
  display: grid;
  grid-template-columns: 1fr;
  gap: 28px;
  align-items: center}
.bnt-newsletter-illu {
  aspect-ratio: 4/3;
  border-radius: var(--radius);
  background: var(--akzent-tint);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--accent);
  font-size: 48px}
@media (min-width: 720px) {
  .bnt-newsletter--karte { grid-template-columns: .8fr 1.2fr}
}

.bnt-kontakt {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(32px, 5vw, 56px);
  align-items: start}
.bnt-kontakt-info { list-style: none; margin: 24px 0 0; padding: 0}
.bnt-kontakt-info li {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  align-items: baseline;
  padding: 14px 0;
  border-bottom: 1px solid var(--linie-fein)}
.bnt-kontakt-info i { color: var(--accent); flex: none; width: 20px}
.bnt-kontakt-info a { color: var(--text)}
.bnt-kontakt-info a:hover { color: var(--accent)}
.bnt-feld-reihe { display: flex; flex-wrap: wrap; gap: 20px}
.bnt-feld-reihe > .bnt-feld { flex: 1 1 220px; min-width: 0; margin-bottom: 0}
@media (min-width: 820px) {
  .bnt-kontakt { grid-template-columns: 1fr 1.1fr}
}

[data-folds] { border-top: 1px solid var(--linie)}
[data-panel] { border-bottom: 1px solid var(--linie)}
[data-fold-head] {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  background: none;
  border: 0;
  cursor: pointer;
  text-align: left;
  padding: 22px 0;
  font-family: var(--serif);
  font-size: 1.1rem;
  color: var(--text)}
[data-fold-head] .bnt-falt-zeichen { color: var(--accent); transition: transform .3s ease; flex: none}
.is-open [data-fold-head] .bnt-falt-zeichen { transform: rotate(45deg)}
[data-panel] .bnt-falt-koerper {
  max-height: 0;
  overflow: hidden;
  transition: max-height .3s ease}
[data-panel].is-open .bnt-falt-koerper { max-height: 600px}
.bnt-falt-koerper p { padding-bottom: 22px; color: var(--muted); margin: 0}

.reel-ha5 { padding-bottom: 44px}
.reel-ha5 .swiper-slide { height: auto}
.reel-ha5 .swiper-slide > * { height: 100%}
.swiper-pagination-bullet { background: var(--accent2); opacity: 1}
.swiper-pagination-bullet-active { background: var(--accent)}
.swiper-button-prev, .swiper-button-next { color: var(--accent)}
.swiper-button-prev::after, .swiper-button-next::after { font-size: 22px}

.site-modal,
.overlay-box-oq0 {
  position: fixed;
  inset: 0;
  z-index: 90;
  display: none;
  align-items: center;
  justify-content: center;
  padding: var(--rand);
  background: rgba(14,27,42,.5)}
.site-modal.is-open,
.overlay-box-oq0.is-open { display: flex}
.site-modal-dialog,
.overlay-box-oq0 > * {
  background: var(--surface);
  border-radius: var(--radius);
  border: 1px solid var(--linie);
  max-width: 460px;
  width: 100%;
  padding: clamp(28px, 4vw, 40px);
  text-align: center}
.overlay-box-oq0 h3 { font-size: 1.5rem}
.overlay-box-oq0 p { color: var(--muted)}

.bnt-rechtstext { max-width: 68ch}
.bnt-rechtstext h2 { font-size: 1.4rem; margin-top: 2em}
.bnt-rechtstext h3 { font-size: 1.1rem; margin-top: 1.6em}
.bnt-rechtstext p, .bnt-rechtstext li { color: var(--muted)}

.bnt-fusszeile { margin-top: var(--raum); padding-top: var(--raum)}
.bnt-fuss-raster {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 24px;
  padding-bottom: 48px}
.bnt-fuss-marke { min-width: 0}
.bnt-fuss-marke p { color: var(--muted); font-size: 15px; margin: 16px 0 0}
.bnt-fuss-kontakt { list-style: none; margin: 18px 0 0; padding: 0; font-size: 15px}
.bnt-fuss-kontakt li { margin-bottom: 6px}
.bnt-fuss-kontakt a { color: var(--muted)}
.bnt-fuss-kontakt a:hover { color: var(--accent)}

.bnt-fuss-spalte { min-width: 0}
.bnt-fuss-spalte h3 {
  font-family: var(--grotesk);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: var(--muted);
  margin: 0 0 16px}
.bnt-fuss-spalte ul { list-style: none; margin: 0; padding: 0}
.bnt-fuss-spalte li { margin-bottom: 10px}
.bnt-fuss-spalte a { font-size: 15px; color: var(--text)}
.bnt-fuss-spalte a:hover { color: var(--accent)}

.bnt-fuss-schluss {
  border-top: 1px solid var(--linie);
  padding-block: 24px 40px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px 24px;
  align-items: center;
  justify-content: space-between;
  font-size: 14px;
  color: var(--muted)}
.bnt-fuss-schluss nav { display: flex; flex-wrap: wrap; gap: 8px 20px}
.bnt-fuss-schluss a { color: var(--muted)}
.bnt-fuss-schluss a:hover { color: var(--accent)}

@media (max-width: 720px) {
  .bnt-nav { display: none}
  .bnt-burger { display: block}
}

@media (prefers-reduced-motion: reduce) {
  * { animation-duration: .001ms !important; transition-duration: .001ms !important}
  body { animation: none}
}

.cookie-bar-i0e-overlay{position:fixed;inset:0;opacity:0;visibility:hidden;transition:.25s;z-index:9998}
.cookie-bar-i0e-overlay.is-open{opacity:1;visibility:visible}
.cookie-bar-i0e-panel{position:fixed;background:var(--site-surface,#fff);color:var(--site-text,#1a1a1a);
  box-shadow:0 20px 60px rgba(0,0,0,.28);padding:24px;opacity:0;visibility:hidden;transition:.25s;z-index:9999}
.cookie-bar-i0e-panel.is-open{opacity:1;visibility:visible}
.cookie-bar-i0e-panel h3{margin:0 0 8px;font-size:1.2rem}
.cookie-bar-i0e-panel>p{margin:0 0 16px;color:var(--site-muted,#666);font-size:.95rem}
.cookie-bar-i0e-cat{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 0;border-top:1px solid rgba(128,128,128,.2)}
.cookie-bar-i0e-cat h4{margin:0 0 2px;font-size:.98rem}
.cookie-bar-i0e-cat p{margin:0;color:var(--site-muted,#777);font-size:.85rem}
.cookie-bar-i0e-switch{position:relative;flex:0 0 auto;width:44px;height:24px}
.cookie-bar-i0e-switch input{opacity:0;width:0;height:0;position:absolute}
.cookie-bar-i0e-switch span{position:absolute;inset:0;background:#c9c9c9;border-radius:999px;transition:.2s;cursor:pointer}
.cookie-bar-i0e-switch span::before{content:"";position:absolute;width:18px;height:18px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.2s}
.cookie-bar-i0e-switch input:checked+span{background:var(--site-accent,#2b7)}
.cookie-bar-i0e-switch input:checked+span::before{transform:translateX(20px)}
.cookie-bar-i0e-switch input:disabled+span{opacity:.6;cursor:not-allowed}
.cookie-bar-i0e-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.cookie-bar-i0e-actions button{flex:1;min-width:140px;padding:11px 16px;border:none;border-radius:10px;font:inherit;font-weight:600;cursor:pointer}
.cookie-bar-i0e-actions #cookie-bar-i0e-all{background:var(--site-accent,#2b7);color:#fff}
.cookie-bar-i0e-actions #cookie-bar-i0e-save{background:transparent;color:var(--site-text,#222);border:1px solid rgba(128,128,128,.4)}
.cookie-bar-i0e-links{display:flex;gap:16px;margin-top:14px;font-size:.85rem}
.cookie-bar-i0e-links a{color:var(--site-accent,#2b7);text-decoration:underline}
.cookie-bar-i0e-trigger{position:fixed;left:18px;bottom:18px;width:44px;height:44px;border-radius:50%;border:none;cursor:pointer;
  background:var(--site-surface,#fff);color:var(--site-accent,#2b7);box-shadow:0 6px 18px rgba(0,0,0,.2);z-index:9997;font-size:1.1rem}

.cookie-bar-i0e-overlay{background:transparent;pointer-events:none}
.cookie-bar-i0e-panel{left:24px;bottom:24px;width:min(380px,calc(100% - 32px));border-radius:16px;transform:translateY(24px)}
.cookie-bar-i0e-panel.is-open{transform:translateY(0)}
@media(max-width:520px){.cookie-bar-i0e-panel{left:16px;right:16px;width:auto}}
@media(max-width:520px){.cookie-bar-i0e-actions button{min-width:100%}}
#fab-stack-de6{left:auto !important;right:18px !important}
@media(max-width:520px){#fab-stack-de6{right:12px !important}}

.submit-ok-r77{position:fixed;inset:0;z-index:10000;display:none;align-items:center;justify-content:center;
  padding:20px;background:rgba(8,10,14,.55);backdrop-filter:blur(2px)}
.submit-ok-r77.is-open{display:flex}
.submit-ok-r77__box{width:min(420px,100%);background:var(--site-surface,#fff);color:var(--site-text,#15181d);
  border-radius:16px;padding:32px 28px;text-align:center;box-shadow:0 24px 60px rgba(0,0,0,.28);
  animation:submit-ok-r77-in .22s ease-out}
@keyframes submit-ok-r77-in{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:none}}
.submit-ok-r77__mark{width:56px;height:56px;margin:0 auto 18px;border-radius:50%;display:flex;
  align-items:center;justify-content:center;font-size:26px;line-height:1;
  background:var(--site-accent,#2e7d5b);color:#fff}
.submit-ok-r77__title{margin:0 0 10px;font-size:1.35rem;line-height:1.25}
.submit-ok-r77__text{margin:0 0 24px;line-height:1.6;color:var(--site-muted,#5b6472)}
.submit-ok-r77__close{display:inline-block;cursor:pointer;border:0;border-radius:999px;
  padding:12px 30px;font:inherit;font-weight:600;background:var(--site-accent,#2e7d5b);color:#fff}
.submit-ok-r77__close:hover{filter:brightness(1.08)}
.submit-ok-r77__close:focus-visible{outline:2px solid var(--site-text,#15181d);outline-offset:3px}
@media(prefers-reduced-motion:reduce){.submit-ok-r77__box{animation:none}}

*,*::before,*::after{box-sizing:border-box}
html,body{overflow-x:hidden;overflow-x:clip;max-width:100%}
img,svg,video,iframe,canvas{max-width:100%}
table{max-width:100%}

.simpleParallax{display:block;width:100%;height:100%}
.simpleParallax img{width:100%;height:100%;object-fit:cover}

blockquote, figure { margin-left: 0; margin-right: 0}

figure > blockquote, figure > figcaption { margin-left: 0; margin-right: 0}

html.no-aos [data-aos]{opacity:1 !important;transform:none !important}

@media(prefers-reduced-motion:reduce){
  [data-aos]{opacity:1 !important;transform:none !important;transition:none !important}
}

.legal-doc{max-width:72ch;margin:0 auto;padding:64px 20px;line-height:1.7}
.legal-doc h1{margin:0 0 .6em}
.legal-doc h2{margin:1.8em 0 .5em}
.legal-doc h3{margin:1.4em 0 .4em}
.legal-doc p,.legal-doc li{margin:0 0 .8em}
.legal-doc ul,.legal-doc ol{padding-left:1.4em;margin:0 0 1em}
.legal-doc table{width:100%;border-collapse:collapse;margin:0 0 1.2em}
.legal-doc th,.legal-doc td{border:1px solid currentColor;padding:.5em;text-align:left}

@media (max-width: 720px) {
  body { overflow-x: hidden}
  h1, h2, h3, p, li, td { overflow-wrap: break-word}
  
  input, select, textarea { max-width: 100%; min-width: 0}
  
  img, svg, video, iframe, table { max-width: 100%}
}

#mobile-nav-670{position:fixed;top:0;right:0;bottom:0;width:min(84vw,360px);padding:72px 28px 28px;background:var(--site-surface,#fff);color:var(--site-text,#111);box-shadow:-12px 0 40px rgba(0,0,0,.18);transform:translateX(100%);visibility:hidden;transition:transform .28s ease,visibility .28s;z-index:9999;overflow-y:auto}
#mobile-nav-670.is-open{transform:none;visibility:visible}
#mobile-nav-670 a{display:block;padding:.6em 0;font-size:1.1rem;color:inherit;text-decoration:none}
#dim-l0w{position:fixed;inset:0;background:rgba(0,0,0,.45);opacity:0;visibility:hidden;transition:.25s;z-index:9998}
#dim-l0w.is-open{opacity:1;visibility:visible}
#burger-1z0{appearance:none;-webkit-appearance:none;background:none;border:0;padding:.4em;color:inherit;font:inherit;cursor:pointer;line-height:1}
#nav-close-203{appearance:none;-webkit-appearance:none;background:none;border:0;padding:.4em;color:inherit;font:inherit;cursor:pointer;line-height:1}
#top-btn-lyq{appearance:none;-webkit-appearance:none;background:none;border:0;padding:.4em;color:inherit;font:inherit;cursor:pointer;line-height:1}

@media (max-width: 720px) {
  
.bnt-kopf-marke,
.bnt-kopf-navreihe,
.bnt-wortmarke,
.bnt-nav li,
.pressable-jvy,
.badge-gi8,
.bnt-journal-karte,
.bnt-material-karte,
.bnt-zeitstrahl-punkt,
.bnt-stimme-karte,
.bnt-newsletter-illu,
.site-modal.is-open, .overlay-box-oq0.is-open,
.cookie-bar-i0e-cat,
.cookie-bar-i0e-links,
.submit-ok-r77.is-open,
.submit-ok-r77__mark { flex-wrap: wrap}
  
.bnt-kopf-marke > *,
.bnt-kopf-navreihe > *,
.bnt-wortmarke > *,
.bnt-nav li > *,
.pressable-jvy > *,
.badge-gi8 > *,
.bnt-journal-karte > *,
.bnt-material-karte > *,
.bnt-zeitstrahl-punkt > *,
.bnt-stimme-karte > *,
.bnt-newsletter-illu > *,
.site-modal.is-open, .overlay-box-oq0.is-open > *,
.cookie-bar-i0e-cat > *,
.cookie-bar-i0e-links > *,
.submit-ok-r77.is-open > *,
.submit-ok-r77__mark > * { min-width: 0}
}

.cookie-bar-i0e-overlay{position:fixed;inset:0;opacity:0;visibility:hidden;transition:.25s;z-index:9998;}
.cookie-bar-i0e-overlay.is-open{opacity:1;visibility:visible;}
.cookie-bar-i0e-panel{position:fixed;background:var(--site-surface,#fff);color:var(--site-text,#1a1a1a);
  box-shadow:0 20px 60px rgba(0,0,0,.28);padding:24px;opacity:0;visibility:hidden;transition:.25s;z-index:9999;}
.cookie-bar-i0e-panel.is-open{opacity:1;visibility:visible;}
.cookie-bar-i0e-panel h3{margin:0 0 8px;font-size:1.2rem;}
.cookie-bar-i0e-panel>p{margin:0 0 16px;color:var(--site-muted,#666);font-size:.95rem;}
.cookie-bar-i0e-cat{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 0;border-top:1px solid rgba(128,128,128,.2);}
.cookie-bar-i0e-cat h4{margin:0 0 2px;font-size:.98rem;}
.cookie-bar-i0e-cat p{margin:0;color:var(--site-muted,#777);font-size:.85rem;}
.cookie-bar-i0e-switch{position:relative;flex:0 0 auto;width:44px;height:24px;}
.cookie-bar-i0e-switch input{opacity:0;width:0;height:0;position:absolute;}
.cookie-bar-i0e-switch span{position:absolute;inset:0;background:#c9c9c9;border-radius:999px;transition:.2s;cursor:pointer;}
.cookie-bar-i0e-switch span::before{content:"";position:absolute;width:18px;height:18px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.2s;}
.cookie-bar-i0e-switch input:checked+span{background:var(--site-accent,#2b7);}
.cookie-bar-i0e-switch input:checked+span::before{transform:translateX(20px);}
.cookie-bar-i0e-switch input:disabled+span{opacity:.6;cursor:not-allowed;}
.cookie-bar-i0e-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px;}
.cookie-bar-i0e-actions button{flex:1;min-width:140px;padding:11px 16px;border:none;border-radius:10px;font:inherit;font-weight:600;cursor:pointer;}
.cookie-bar-i0e-actions #cookie-bar-i0e-all{background:var(--site-accent,#2b7);color:#fff;}
.cookie-bar-i0e-actions #cookie-bar-i0e-save{background:transparent;color:var(--site-text,#222);border:1px solid rgba(128,128,128,.4);}
.cookie-bar-i0e-links{display:flex;gap:16px;margin-top:14px;font-size:.85rem;}
.cookie-bar-i0e-links a{color:var(--site-accent,#2b7);text-decoration:underline;}
.cookie-bar-i0e-trigger{position:fixed;left:18px;bottom:18px;width:44px;height:44px;border-radius:50%;border:none;cursor:pointer;
  background:var(--site-surface,#fff);color:var(--site-accent,#2b7);box-shadow:0 6px 18px rgba(0,0,0,.2);z-index:9997;font-size:1.1rem;}

.cookie-bar-i0e-overlay{background:transparent;pointer-events:none;}
.cookie-bar-i0e-panel{left:24px;bottom:24px;width:min(380px,calc(100% - 32px));border-radius:16px;transform:translateY(24px);}
.cookie-bar-i0e-panel.is-open{transform:translateY(0);}
@media(max-width:520px){.cookie-bar-i0e-panel{left:16px;right:16px;width:auto;}}
@media(max-width:520px){.cookie-bar-i0e-actions button{min-width:100%;}}
#fab-stack-de6{left:auto !important;right:18px !important;}
@media(max-width:520px){#fab-stack-de6{right:12px !important;}}

.submit-ok-r77{position:fixed;inset:0;z-index:10000;display:none;align-items:center;justify-content:center;
  padding:20px;background:rgba(8,10,14,.55);backdrop-filter:blur(2px);}
.submit-ok-r77.is-open{display:flex;}
.submit-ok-r77__box{width:min(420px,100%);background:var(--site-surface,#fff);color:var(--site-text,#15181d);
  border-radius:16px;padding:32px 28px;text-align:center;box-shadow:0 24px 60px rgba(0,0,0,.28);
  animation:submit-ok-r77-in .22s ease-out;}
@keyframes submit-ok-r77-in{from{opacity:0;transform:translateY(12px) scale(.97);}to{opacity:1;transform:none;}}
.submit-ok-r77__mark{width:56px;height:56px;margin:0 auto 18px;border-radius:50%;display:flex;
  align-items:center;justify-content:center;font-size:26px;line-height:1;
  background:var(--site-accent,#2e7d5b);color:#fff;}
.submit-ok-r77__title{margin:0 0 10px;font-size:1.35rem;line-height:1.25;}
.submit-ok-r77__text{margin:0 0 24px;line-height:1.6;color:var(--site-muted,#5b6472);}
.submit-ok-r77__close{display:inline-block;cursor:pointer;border:0;border-radius:999px;
  padding:12px 30px;font:inherit;font-weight:600;background:var(--site-accent,#2e7d5b);color:#fff;}
.submit-ok-r77__close:hover{filter:brightness(1.08);}
.submit-ok-r77__close:focus-visible{outline:2px solid var(--site-text,#15181d);outline-offset:3px;}
@media(prefers-reduced-motion:reduce){.submit-ok-r77__box{animation:none;}}

*,*::before,*::after{box-sizing:border-box;}
html,body{overflow-x:hidden;overflow-x:clip;max-width:100%;}
img,svg,video,iframe,canvas{max-width:100%;}
table{max-width:100%;}

.simpleParallax{display:block;width:100%;height:100%;}
.simpleParallax img{width:100%;height:100%;object-fit:cover;}

blockquote, figure { margin-left: 0; margin-right: 0; }

figure > blockquote, figure > figcaption { margin-left: 0; margin-right: 0; }

html.no-aos [data-aos]{opacity:1 !important;transform:none !important;}

@media(prefers-reduced-motion:reduce){
  [data-aos]{opacity:1 !important;transform:none !important;transition:none !important;}
}

.legal-doc{max-width:72ch;margin:0 auto;padding:64px 20px;line-height:1.7;}
.legal-doc h1{margin:0 0 .6em;}
.legal-doc h2{margin:1.8em 0 .5em;}
.legal-doc h3{margin:1.4em 0 .4em;}
.legal-doc p,.legal-doc li{margin:0 0 .8em;}
.legal-doc ul,.legal-doc ol{padding-left:1.4em;margin:0 0 1em;}
.legal-doc table{width:100%;border-collapse:collapse;margin:0 0 1.2em;}
.legal-doc th,.legal-doc td{border:1px solid currentColor;padding:.5em;text-align:left;}

@media (max-width: 720px) {
  body { overflow-x: hidden; }
  h1, h2, h3, p, li, td { overflow-wrap: break-word; }
  
  input, select, textarea { max-width: 100%; min-width: 0; }
  
  img, svg, video, iframe, table { max-width: 100%; }
}
