:root {
  color-scheme: light;
  --standardtext: #54616d;
  --standardtext-dunkel: #243142;
  --firmenfarbe: #1a6ecc;
  --firmenfarbe-dunkel: #1466c3;
  --firmenhintergrund: aliceblue;
  --sekundaerfarbe: #6c757d;
  --hellgrau: #f5f7f9;
  --linienfarbe: #dce2e9;
  --seitenhintergrund: #fff;
  --menuefarbe: #4b545e;
  --menuefarbe-aktiv: #202428;
  --eckenradius: 8px;
  --seitenbreite: 1140px;
  --spaltenabstand: 24px;
}

*,
*::before,
*::after { box-sizing: border-box; }

html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  margin: 0;
  color: var(--standardtext);
  background: var(--seitenhintergrund);
  font: 16px/1.5 "Source Sans Pro", Calibri, Candara, Arial, sans-serif;
}

@font-face {
  font-family: "Source Sans Pro";
  font-style: normal;
  font-weight: 400;
  src: url("fonts/SourceSansPro-Regular.ttf") format("truetype");
  font-display: swap;
}
@font-face {
  font-family: "Source Sans Pro";
  font-style: italic;
  font-weight: 400;
  src: url("fonts/source-sans-pro-v21-latin-ext_latin-italic.ttf") format("truetype");
  font-display: swap;
}
@font-face {
  font-family: "Source Sans Pro";
  font-style: normal;
  font-weight: 600 800;
  src: url("fonts/source-sans-pro-v21-latin-ext_latin-600.ttf") format("truetype");
  font-display: swap;
}

h1, h2, h3, h4 { margin: 0 0 .75rem; color: var(--standardtext-dunkel); font-weight: 400; line-height: 1.25; }
.ueberschrift1, h1 { font-size: clamp(1.8rem, 3vw, 2.5rem); }
.ueberschrift2, h2 { font-size: clamp(1.45rem, 2.2vw, 1.9rem); }
.ueberschrift3, h3 { font-size: 1.35rem; }
h4 { font-size: 1.15rem; }
strong { font-weight: 700; }
p { margin: 0 0 1rem; }
ul { margin: 0 0 1rem; padding-left: 1.4rem; }
li { margin-bottom: .45rem; }
main p, main li { max-width: 65ch; text-wrap: pretty; }
a { color: var(--firmenfarbe); text-decoration: none; }
a:hover { color: var(--firmenfarbe-dunkel); text-decoration: underline; }
img, video { max-width: 100%; height: auto; }
.svg-icon-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
a:focus-visible, button:focus-visible, [tabindex]:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--firmenfarbe) 40%, transparent);
  outline-offset: 2px;
}

.container {
  width: 100%;
  max-width: var(--seitenbreite);
  margin-inline: auto;
  padding-inline: 15px;
}
.seiteninhalt { flex: 1 0 auto; overflow-x: clip; padding-block: 2rem 3rem; }
main section { margin-block: 3rem; }
.seiteninhalt > section:first-of-type,
.seiteninhalt > .container > section:first-of-type,
.seiteninhalt > div > section:first-of-type,
.seiteninhalt > div > .container > section:first-of-type,
.seiteninhalt > .r-content > section:first-of-type,
.seiteninhalt > .r-content > .container > section:first-of-type,
.seiteninhalt > .r-content > .r-data-block > .r-grid > section:first-of-type { margin-block-start: 0; }
.banner {
  position: relative;
  min-height: 220px;
  overflow: hidden;
  margin-block: 1.5rem 2rem;
  border-radius: var(--eckenradius);
  color: #fff;
  background: #18202e url("https://www.intex-publishing.de/cms/images/cms/bannerfahrtenbuch.jpg") center / cover no-repeat;
}
.banner__logo {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 72px;
  height: 72px;
  object-fit: contain;
}
.banner__titel {
  position: absolute;
  right: 20px;
  bottom: 12px;
  margin: 0;
  color: #fff;
  font-size: clamp(1.25rem, 3vw, 2rem);
  font-weight: 800;
}
.banner__slogans {
  position: absolute;
  bottom: 24px;
  left: 20px;
  width: min(60%, 760px);
  min-height: 72px;
  display: grid;
  align-items: center;
  padding: .8rem 1rem;
  border-radius: var(--eckenradius);
  background: var(--firmenfarbe);
  font-size: clamp(1rem, 2.8vw, 1.75rem);
  font-weight: 700;
}
.banner__slogans span {
  grid-area: 1 / 1;
  opacity: 0;
  animation: slogan 30s ease-in-out infinite;
}
.banner__slogans span:nth-child(2) { animation-delay: 6s; }
.banner__slogans span:nth-child(3) { animation-delay: 12s; }
.banner__slogans span:nth-child(4) { animation-delay: 18s; }
.banner__slogans span:nth-child(5) { animation-delay: 24s; }
@keyframes slogan {
  0%, 20%, 100% { opacity: 0; }
  10%, 15% { opacity: 1; }
}
.galerie { width: 100%; max-width: 1000px; margin: 4.5rem auto; }
.galerie__buehne {
  position: relative;
  width: 100%;
  aspect-ratio: var(--galerie-verhaeltnis, 16 / 10);
  overflow: hidden;
  contain: layout paint;
}
.galerie__slide {
  position: absolute;
  inset: 0;
  z-index: 0;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0s linear .7s;
}
.galerie__slide.is-active {
  z-index: 1;
  opacity: 1;
  pointer-events: auto;
  transition: opacity .7s ease;
}
.galerie__bild { display: block; width: 100%; height: 100%; object-fit: contain; }
.galerie__pfeil {
  position: absolute;
  top: 50%;
  z-index: 2;
  width: 44px;
  height: 44px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 0;
  border-radius: 50%;
  color: #fff;
  background: rgb(32 36 40 / 72%);
  cursor: pointer;
  transform: translateY(-50%);
}
.galerie__pfeil:hover { background: var(--firmenfarbe); }
.galerie__pfeil svg { display: block; width: 20px; height: 20px; fill: currentColor; }
.galerie__pfeil--links { left: 12px; }
.galerie__pfeil--links svg { transform: translateX(-1px) rotate(180deg); }
.galerie__pfeil--rechts { right: 12px; }
.galerie__pfeil--rechts svg { transform: translateX(1px); }
.galerie__caption {
  width: 100%;
  min-height: 1.5em;
  margin: .75rem auto;
  color: var(--sekundaerfarbe);
  text-align: center;
}
.galerie__steuerung,
.galerie__punkte { display: flex; align-items: center; justify-content: center; gap: .5rem; }
.galerie__steuerung { flex-wrap: wrap; }
.galerie__punkt {
  width: 12px;
  height: 12px;
  min-height: 12px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: var(--linienfarbe);
  cursor: pointer;
}
.galerie__punkt[aria-current="true"] { background: var(--firmenfarbe); }
.galerie__pause {
  width: 44px;
  height: 44px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 1px solid var(--linienfarbe);
  border-radius: 50%;
  color: var(--standardtext);
  background: var(--seitenhintergrund);
  cursor: pointer;
}
.galerie__pause svg { display: none; width: 14px; height: 14px; fill: currentColor; }
.galerie__pause[aria-pressed="false"] .galerie__pause-symbol,
.galerie__pause[aria-pressed="true"] .galerie__play-symbol { display: block; }
.spalten { display: grid; gap: var(--spaltenabstand); }
.spalten-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.spalten-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.spalten-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.spalten-1-2 { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); }
.spalten-2-1 { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
.kartenstapel { display: grid; align-content: start; gap: 1rem; }
.kartenstapel-karten { display: grid; gap: 1rem; }
.karte {
  min-width: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  padding: 0;
  border: 1px solid var(--linienfarbe);
  border-radius: var(--eckenradius);
  color: inherit;
  background: #fff;
  box-shadow: 0 2px 6px rgb(0 0 0 / 8%);
  text-decoration: none;
  transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
.karte:hover, .karte:focus-visible {
  border-color: var(--firmenfarbe);
  color: inherit;
  background: var(--firmenhintergrund);
  box-shadow: 0 4px 12px rgb(0 0 0 / 12%);
  text-decoration: none;
  transform: translateY(-2px);
}
.karten_ueberschrift {
  display: flex;
  align-items: center;
  gap: .35rem;
  padding: .45rem .8rem;
  color: #fff;
  font-weight: 600;
  line-height: 1.35;
}
.karten_ueberschrift--firma { background: var(--firmenfarbe); }
.karten_ueberschrift--sekundaer { background: var(--sekundaerfarbe); }
.karten_ueberschrift h3 { margin: 0; color: inherit; font-size: 1rem; font-weight: inherit; line-height: inherit; }
.karten_ueberschrift .icon { flex: 0 0 auto; }
.karten_inhalt {
  flex: 1 1 auto;
  padding: .55rem .8rem;
  font-size: 1rem;
  line-height: 1.5;
}
.karten_inhalt--weiss { color: var(--standardtext); background: #fff; }
.karten_inhalt--hellblau { color: var(--standardtext); background: var(--firmenhintergrund); }
.karten_inhalt--firma { color: #fff; background: var(--firmenfarbe); }
.karten_inhalt--produkt { display: flex; align-items: flex-start; gap: .75rem; }
.karten_inhalt--produkt img { flex: 0 0 64px; width: 64px; height: 64px; object-fit: contain; }
.karten_inhalt--produkt p { flex: 1 1 auto; }
.karten_inhalt p { margin: 0; }
.karten_inhalt p + p { margin-top: .55rem; }
.karten_inhalt .kleingedruckt { margin-top: .55rem; }
.karten_fuss {
  padding: .45rem .8rem;
  border-top: 1px solid var(--linienfarbe);
  color: var(--sekundaerfarbe);
  background: #fff;
  font-size: .75rem;
}
.karten_fuss p { margin: 0; }
.menue-karten .karte { min-height: 11.8rem; }
.menue-karten-produkte .karte { height: 104px; min-height: 0; }
.produkte-bereiche .karte { height: 130px; min-height: 0; }
.service-menue .karte { height: 130px; min-height: 0; }
.shop-karten .karte { height: 130px; min-height: 0; }
.shop-karten .karten_inhalt--produkt { padding-block: .25rem; line-height: 1.2; }
.produkte-bereiche .karten_inhalt { padding-block: .35rem; line-height: 1.15; }
.zentriert { text-align: center; }
main .zentriert p, main p.zentriert { margin-inline: auto; }
.rechtsbuendig { text-align: right; }
.vertikal-zentriert { align-self: center; }
.bild-zentriert { display: block; margin-inline: auto; }
.ikon, .spalten article > img:not([class]) { display: block; width: 64px; height: 64px; margin-bottom: .9rem; object-fit: contain; }
.groesse-48 { width: 48px; height: 48px; max-width: 100%; }
.groesse-64 { width: 64px; height: 64px; max-width: 100%; }
.groesse-96 { width: 96px; height: 96px; max-width: 100%; }
.groesse-128 { width: 128px; height: 128px; max-width: 100%; }
.groesse-256 { width: 256px; height: 256px; max-width: 100%; }
.bild-proportionen.groesse-48 { width: auto; height: 48px; object-fit: contain; }
.bild-proportionen.groesse-128 { width: auto; height: 128px; object-fit: contain; }
.abgerundet { border-radius: 5px; }
.umrandet { border: 1px solid var(--linienfarbe); border-radius: var(--eckenradius); }
.hintergrund-hell { background: var(--hellgrau); }
.hintergrund-firma { background: var(--firmenhintergrund); }
.innenabstand { padding: 1.5rem; }
.tabelle { width: 100%; border-collapse: collapse; color: var(--standardtext); }
.tabellen-scroll { max-width: 100%; overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; }
.tabelle th, .tabelle td { padding: .7rem .85rem; border: 1px solid var(--linienfarbe); text-align: left; vertical-align: top; }
.tabelle .tabellenkopf th { color: var(--standardtext-dunkel); background: var(--hellgrau); font-size: .9rem; font-weight: 600; }
.tabelle .tabellenzwischenueberschrift th, .tabelle .tabellenzwischenueberschrift td { background: var(--hellgrau); font-weight: 700; }
.tabelle .tabellenfuss th, .tabelle .tabellenfuss td { background: var(--hellgrau); }
.tabelle .icon.svg-gruen { width: 1.25rem; height: 1.25rem; stroke: currentColor; stroke-width: .7; paint-order: stroke; }
.inhaltskarte--nummeriert { position: relative; min-width: 0; }
.inhaltskarte--nummeriert::before {
  position: absolute;
  right: .75rem;
  bottom: .1rem;
  z-index: 0;
  color: var(--linienfarbe);
  content: attr(data-number);
  font-size: clamp(6rem, 12vw, 9rem);
  font-weight: 800;
  line-height: .8;
  opacity: .38;
  pointer-events: none;
}
.inhaltskarte--nummeriert > * { position: relative; z-index: 1; }
.alternativen-erganzungen > header,
.alternativen-erganzungen > .zentriert { text-align: center; }
.alternativen-erganzungen > .spalten > article {
  display: flex;
  flex-direction: column;
  border: 0;
  border-radius: var(--eckenradius);
  background: var(--hellgrau);
}
.alternativen-erganzungen > .spalten > article > img { align-self: flex-start; }
.alternativen-erganzungen > .spalten > article > div {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
}
.alternativen-erganzungen > .spalten > article .schalter { align-self: flex-start; margin-top: auto; }
svg.svg-rot { color: #c0392b; fill: currentColor; }
svg.svg-gruen { color: #198754; fill: currentColor; }
svg.svg-firmenblau { color: var(--firmenfarbe); fill: currentColor; }
svg.svg-sekundaer { color: var(--sekundaerfarbe); fill: currentColor; }
svg.svg-linie { fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.liste-check li > svg.svg-gruen { color: #198754; }
.kleingedruckt { color: var(--sekundaerfarbe); font-size: .875rem; }
.abstand-oben { margin-top: 1.5rem; }
.etiketten { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; }
main p.etiketten { max-width: none; }
.etikett { padding: .2rem .65rem; border-radius: var(--eckenradius); background: var(--hellgrau); font-size: .75rem; }
.etikett-firma { color: #fff; background: var(--firmenfarbe); }
.etikett-gruen { color: #fff; background: #198754; }
.schaltergruppe { display: flex; flex-wrap: wrap; justify-content: center; gap: .75rem; margin-block: 1.5rem; }
.cta-abschluss { padding: 2rem 1.5rem; border-radius: var(--eckenradius); background: var(--firmenhintergrund); text-align: center; }
.cta-abschluss h2 { margin-bottom: 1.25rem; }
.cta-abschluss .schaltergruppe { margin: 0; }
.akkordeon { display: grid; gap: .5rem; }
.akkordeon-eintrag { overflow: hidden; border: 1px solid var(--linienfarbe); border-radius: var(--eckenradius); background: #fff; }
.akkordeon-eintrag summary {
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .75rem 1rem;
  color: #000;
  background: #fff;
  cursor: pointer;
  list-style: none;
}
.akkordeon-eintrag summary::-webkit-details-marker { display: none; }
.akkordeon-eintrag summary::after { color: var(--firmenfarbe); content: "+"; font-size: 1.35rem; line-height: 1; }
.akkordeon-eintrag[open] summary::after { content: "\2212"; }
.akkordeon-eintrag summary:focus-visible { outline: 3px solid color-mix(in srgb, var(--firmenfarbe) 40%, transparent); outline-offset: -3px; }
.akkordeon-antwort { padding: .75rem 1rem; border-top: 1px solid var(--linienfarbe); }
.akkordeon-antwort > :last-child { margin-bottom: 0; }
.akkordeon-eintrag.akkordeon-primary summary { color: #fff; background: var(--firmenfarbe); }
.akkordeon-eintrag.akkordeon-primary summary::after { color: #fff; }
.formularfeld { display: grid; gap: .35rem; }
.formularfeld label { font-weight: 600; }
.formularfeld input, .formularfeld select, .formularfeld textarea {
  width: 100%;
  min-height: 44px;
  padding: .45rem .65rem;
  border: 1px solid var(--linienfarbe);
  border-radius: var(--eckenradius);
  color: var(--standardtext-dunkel);
  background: #fff;
  font: inherit;
}
.formularfeld input:focus, .formularfeld select:focus, .formularfeld textarea:focus {
  border-color: var(--firmenfarbe);
  outline: 3px solid color-mix(in srgb, var(--firmenfarbe) 25%, transparent);
}
.formular-aktionen { align-self: end; margin: 0; }
.faq-seite .seiteninhalt { padding-block: 2rem 4rem; }
.faq-seite .seiteninhalt > .container > header.abstand-oben { margin-top: 0; }
.faq-seite main form { margin-block: 2rem 2.5rem; }
.faq-seite main > .container > h2 { margin-top: 2.5rem; }
.faq-seite main .akkordeon { max-width: 65ch; margin-bottom: 2rem; }
.faq-seite .seiteninhalt section { margin-block: .5rem 2rem; }
.faq-seite .seiteninhalt h1,
.faq-seite .seiteninhalt h2 { max-width: 65ch; text-wrap: pretty; }
.faq-seite .seiteninhalt h2 { margin-block: 2rem 1rem; }
.faq-seite .dachzeile { margin-bottom: .65rem; }
.faq-seite .seiteninhalt p,
.faq-seite .seiteninhalt li,
.faq-seite .seiteninhalt summary,
.faq-seite .seiteninhalt .akkordeon-antwort { max-width: 65ch; text-wrap: pretty; }
.faq-seite .r-content .akkordeon { max-width: 65ch; margin-block: 1.5rem 2rem; }
.faq-seite .r-content > :last-child { margin-bottom: 0; }
.dachzeile {
  margin-bottom: .65rem;
  color: var(--firmenfarbe);
  font-size: .85rem;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.liste-standard { padding-left: 1.4rem; list-style: disc; }
.liste-checkblau,
.liste-plusgruen { padding: 0; list-style: none; }
.liste-checkblau li,
.liste-plusgruen li { position: relative; padding-left: 1.5rem; }
.liste-checkblau li::before,
.liste-plusgruen li::before {
  position: absolute;
  top: 0;
  left: 0;
  font-weight: 700;
}
.liste-checkblau li::before { content: "\2713"; color: var(--firmenfarbe); }
.liste-plusgruen li::before { content: "\002B"; color: #27833b; }
.liste-check { padding: 0; list-style: none; }
.liste-check li { position: relative; padding-left: 1.5rem; }
.liste-check li > svg { position: absolute; top: .3em; left: 0; width: 1rem; height: 1rem; color: var(--firmenfarbe); }
.icon { width: 1em; height: 1em; display: inline-block; fill: currentColor; vertical-align: -.125em; }
.schalter {
  max-width: fit-content;
  min-width: 120px;
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .45rem;
  padding: .5rem .9rem;
  border: 1px solid var(--firmenfarbe);
  border-radius: var(--eckenradius);
  color: #fff;
  background: var(--firmenfarbe);
  font: inherit;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  box-shadow: 2px 2px 4px rgb(0 0 0 / 18%);
}
.schalter:hover { color: #fff; border-color: var(--firmenfarbe-dunkel); background: var(--firmenfarbe-dunkel); box-shadow: 3px 3px 5px rgb(0 0 0 / 22%); text-decoration: none; }
.schalter:active { transform: translate(1px, 1px); box-shadow: 1px 1px 2px rgb(0 0 0 / 18%); }
.schalter-zweit { border-color: var(--menuefarbe); background: var(--menuefarbe); }
.schalter-zweit:hover { border-color: var(--menuefarbe-aktiv); background: var(--menuefarbe-aktiv); }
.paginierung { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .5rem; margin-block: 2rem; }
.paginierung .schalter { min-height: 44px; min-width: 44px; }
.paginierung .paginierung-seite { padding-inline: .5rem; }
.paginierung .paginierung-navigation { min-width: 100px; }
.paginierung .paginierung-aktuell { box-shadow: none; cursor: default; }

.r-topbar-page { flex: 1 0 auto; }
.hauptnavigation { min-height: 50px; color: #fff; background: var(--menuefarbe); }
.navigation-inhalt { width: 100%; display: flex; align-items: center; margin-inline: auto; }
.hauptnavigation li { margin: 0; }
.marke {
  min-height: 50px;
  display: inline-flex;
  align-items: center;
  padding: 0 1rem;
  color: #fff;
  background: var(--firmenfarbe);
  font-weight: 600;
}
.marke:first-of-type { width: 64px; flex: 0 0 64px; justify-content: center; padding: 0; border-right: 1px solid rgb(255 255 255 / 60%); }
.marke:nth-of-type(2) { padding-inline: 1.25rem; font-size: 1.25rem; }
.marke:hover, .marke:focus { color: #fff; text-decoration: none; }
.menue-schalter {
  width: 44px;
  height: 40px;
  display: none;
  align-items: center;
  justify-content: center;
  margin-left: auto;
  border: 1px solid #fff9;
  border-radius: 6px;
  color: #fff;
  background: transparent;
  cursor: pointer;
}
.menue-symbol {
  width: 1.5em;
  height: 1.5em;
  display: block;
  background: center / 100% 100% no-repeat url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='white' stroke-linecap='round' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
.menue-inhalt { display: flex; flex: 1 1 auto; align-items: center; }
.menue-links { display: flex; align-items: center; gap: 2px; margin: 0; padding: 0; list-style: none; }
.kunden-login { margin-left: auto; }
.menue-link { min-height: 50px; display: flex; align-items: center; gap: .35rem; padding: 0 1rem; color: #fff; }
.menue-link:hover { color: #fff; background: var(--sekundaerfarbe); text-decoration: none; }
.menue-punkt.aktuell .menue-link { color: #fff; background: var(--firmenfarbe); text-decoration: none; }
.menue-aktion { background: var(--firmenfarbe); }
.menue-link svg { width: 1em; height: 1em; fill: currentColor; }
.breadcrumb-wrapper { width: 100%; }
.breadcrumb-container { width: min(calc(100% - 30px), var(--seitenbreite)); margin: .5rem auto; }
.seitenpfad { display: flex; flex-wrap: wrap; gap: .4rem; margin: 0; padding: 0; list-style: none; }
.seitenpfad-punkt + .seitenpfad-punkt::before { padding-right: .4rem; color: var(--sekundaerfarbe); content: "/"; }
.seitenpfad-punkt.aktuell { color: var(--sekundaerfarbe); }
.vorlesbar { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
[data-title], [data-tooltip] { position: relative; }
[data-title]::after, [data-tooltip]::after {
  position: absolute;
  top: calc(100% + 8px);
  left: 50%;
  z-index: 1101;
  width: max-content;
  max-width: min(280px, calc(100vw - 24px));
  padding: .35rem .6rem;
  border-radius: var(--eckenradius);
  color: #fff;
  background: var(--standardtext-dunkel);
  font-size: .8rem;
  font-weight: 400;
  line-height: 1.35;
  text-align: center;
  white-space: normal;
  content: attr(data-title);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translate(-50%, -3px);
  transition: opacity .15s ease, transform .15s ease, visibility .15s ease;
}
[data-tooltip]::after { content: attr(data-tooltip); }
[data-title]:hover::after, [data-title]:focus-visible::after,
[data-tooltip]:hover::after, [data-tooltip]:focus-visible::after {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, 0);
}
[data-title]:hover, [data-title]:focus-visible,
[data-tooltip]:hover, [data-tooltip]:focus-visible { z-index: 1100; }
@supports (anchor-name: --intex-tooltip) and (position-try-fallbacks: flip-block) {
  [data-title], [data-tooltip] { anchor-scope: --intex-tooltip; }
  [data-title]:hover, [data-title]:focus-visible,
  [data-tooltip]:hover, [data-tooltip]:focus-visible { anchor-name: --intex-tooltip; }
  [data-title]::after, [data-tooltip]::after {
    position: fixed;
    top: auto;
    left: auto;
    position-anchor: --intex-tooltip;
    position-area: bottom;
    position-try-fallbacks: flip-block, flip-inline, flip-block flip-inline;
    position-visibility: anchors-visible;
    justify-self: anchor-center;
    margin-block-start: 8px;
    transform: none;
  }
  [data-title]:hover::after, [data-title]:focus-visible::after,
  [data-tooltip]:hover::after, [data-tooltip]:focus-visible::after { transform: none; }
}

footer {
  width: 100%;
  margin-top: auto;
  padding: 1rem 15px 1.5rem;
  color: var(--standardtext);
  background: var(--hellgrau);
  font-size: .9rem;
}
.footer-container { max-width: var(--seitenbreite); }
.footer-actions { display: flex; justify-content: center; gap: .5rem; margin-bottom: 1rem; }
.footer-actions .schalter { min-width: 44px; }
.footer-columns { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--spaltenabstand); }
.footer-column h4 { margin-bottom: .75rem; }
.footer-support-info { display: grid; gap: .65rem; }
.footer-support-item { display: grid; grid-template-columns: 110px minmax(0, 1fr); gap: .75rem; }
.footer-support-item svg { margin-right: .25rem; }
.footer-copyright-info address { font-style: normal; }
.footer-logo img { width: 100px; }
.footer-topflow { position: fixed; right: 30px; bottom: 20px; z-index: 99; display: none; }
.footer-topflow.is-visible { display: inline-flex; }
.cookie-alert {
  position: fixed;
  inset: auto 0 0;
  z-index: 1055;
  display: none;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 1rem;
  padding: 1rem;
  color: #fff;
  background: #212529e6;
}
.cookie-alert.show { display: flex; }
.cookie-alert a { color: #fff; text-decoration: underline; }

@media (max-width: 991px) {
  .navigation-inhalt { flex-wrap: wrap; }
  .menue-schalter { display: inline-flex; }
  .menue-inhalt { flex: 0 0 100%; flex-direction: column; align-items: stretch; }
  .menue-inhalt:not(.show) { display: none; }
  .menue-links, .kunden-login { width: 100%; flex-direction: column; align-items: stretch; margin: 0; padding: 0; }
  .menue-link { min-height: 44px; padding: .6rem 1rem; }
  .footer-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .menue-karten.spalten-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
  .banner { min-height: 180px; }
  .banner__logo { top: 12px; right: 12px; width: 56px; height: 56px; }
  .banner__titel { right: 12px; bottom: 10px; }
  .banner__slogans { bottom: 54px; left: 12px; width: calc(100% - 24px); min-height: 64px; }
}
@media (min-width: 992px) {
  .menue-schalter { display: none; }
}
@media (max-width: 767px) {
  .spalten-4, .spalten-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tabellen-scroll--breit > .tabelle { min-width: 42rem; }
}
@media (max-width: 575px) {
  .spalten-2, .spalten-3, .spalten-4, .spalten-1-2, .spalten-2-1,
  .footer-columns { grid-template-columns: minmax(0, 1fr); }
  .menue-karten.spalten-4 { grid-template-columns: minmax(0, 1fr); }
  .innenabstand { padding: 1rem; }
  .footer-support-item { grid-template-columns: 100px minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .banner__slogans span { animation: none; }
  .banner__slogans span:first-child { opacity: 1; }
  .galerie__slide { transition: none; }
}
@media print {
  body { display: block; color: #000; background: #fff; }
  .hauptnavigation, .menue-schalter, .schalter,
  .cookie-alert, .footer-topflow { display: none !important; }
  .tabellen-scroll { overflow: visible; }
  a { color: inherit; }
}
