/* ==========================================================
   EBK – ZENTRALE EINSTELLUNGEN
   HIER zuerst ändern: Farben, Schrift, Größen, Breiten, Logo
   ========================================================== */

:root {
  /* ===== EBK-FARBEN ===== */
  --ebk-green: #73b61a;
  --ebk-green-hover: #5e9414;
  --ebk-blue: #007ab2;

  /* ===== GRUNDFARBEN ===== */
  --ebk-text: #1e293b;
  --ebk-menu-text: #173b63;
  --ebk-muted: #475569;
  --ebk-light: #94a3b8;
  --ebk-border: #e2e8f0;
  --ebk-soft: #f8fafc;
  --ebk-white: #ffffff;

  /* ===== SCHRIFT ===== */
  --ebk-font: Arial, Helvetica, sans-serif;
  --ebk-font-text: 1rem;
  --ebk-font-small: .875rem;

  /* Überschriften */
  --ebk-font-h1: 2.25rem;
  --ebk-font-h2: 1.5rem;
  --ebk-font-h3: 1.25rem;

  /* Menü */
  --ebk-font-menu: .9rem;
  --ebk-font-menu-section: .72rem;
  --ebk-font-menu-subtitle: .60rem;

  /* ===== BREITEN ===== */
  --ebk-page-width: 80rem;
  --ebk-content-width: 48rem;

  /* ===== LOGO ===== */
  --ebk-logo-height: 8rem;
  --ebk-logo-width: 34rem;

  /* ===== KARTEN / FORMEN ===== */
  --ebk-radius: 1rem;
  --ebk-radius-small: .5rem;

  /* ===== ABSTÄNDE ===== */
  --ebk-space-xs: .5rem;
  --ebk-space-sm: .75rem;
  --ebk-space-md: 1rem;
  --ebk-space-lg: 1.5rem;
  --ebk-space-xl: 2rem;

  /* ===== CASSIOPEIA ===== */
  --cassiopeia-color-primary: var(--ebk-green);
  --cassiopeia-color-link: var(--ebk-blue);
  --cassiopeia-color-hover: var(--ebk-green-hover);
}

/* ==========================================================
   template-bereinigt.css – Ausbildungsvorbereitung
   Eigenständiges CSS ohne Tailwind-Abhängigkeit
   ========================================================== */

:root {
  --ebk-blue: #007ab2;
  --ebk-green: #73b61a;
  --ebk-green-hover: #5e9414;
  --text: #1e293b;
  --text-muted: #475569;
  --border-light: #e2e8f0;
  --border-card: #f1f5f9;
  --info-bg: #ecfdf5;
  --white: #ffffff;
  --content-width: 48rem;
  --page-width: 80rem;
  --radius: 1rem;
  --shadow-sm: 0 1px 2px rgb(0 0 0 / 5%);
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

.av-seite {
  max-width: var(--page-width);
  margin: 0 auto;
  padding: 3rem 1rem;
  font-family: Arial, Helvetica, sans-serif;
  color: var(--text);
}

.av-seite img {
  max-width: 100%;
  height: auto;
}

.av-seite h1,
.av-seite h2,
.av-seite h3,
.av-seite p {
  margin-top: 0;
}

.av-zurueck,
.av-kopf,
.info-box,
.textbereich,
.berufsfelder,
.textabschnitt {
  width: 100%;
  max-width: var(--content-width);
  margin-left: auto;
  margin-right: auto;
}

.av-zurueck {
  margin-bottom: 1.5rem;
}

.av-zurueck__icon {
  display: block;
  width: 80px;
}

.av-kopf {
  padding-bottom: 1rem;
  margin-bottom: 1rem;
  border-bottom: 1px solid var(--border-light);
  text-align: center;
}

.av-kicker {
  display: block;
  margin-bottom: 0.5rem;
  color: var(--ebk-green);
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.av-titel {
  margin-bottom: 0;
  color: var(--ebk-blue);
  font-size: 1.875rem;
  line-height: 2.25rem;
  font-weight: 800;
  letter-spacing: -0.025em;
}

.av-einleitung {
  margin: 0.75rem 0 0;
  color: var(--text-muted);
  font-size: 0.875rem;
  line-height: 1.625;
}

.info-box {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  margin-bottom: 1rem;
  padding: 1rem;
  background: var(--info-bg);
  border-left: 4px solid var(--ebk-green);
  border-radius: 0 var(--radius) var(--radius) 0;
  box-shadow: var(--shadow-sm);
}

.info-box--letzte {
  margin-bottom: 2.5rem;
}

.info-box__icon {
  flex: 0 0 auto;
  object-fit: contain;
}

.info-box__inhalt {
  min-width: 0;
  text-align: left;
}

.info-box__titel {
  margin-bottom: 0.5rem;
  color: var(--ebk-blue);
  font-size: 1.25rem;
  line-height: 1.75rem;
  font-weight: 800;
}

.info-box__highlight {
  margin-bottom: 0.5rem;
  font-weight: 700;
}

.absatz-klein {
  margin-bottom: 0.5rem;
}

.fliesztext,
.textbereich,
.textabschnitt__text,
.berufsfeld-box__text {
  color: var(--text-muted);
  font-size: 0.875rem;
  line-height: 1.625;
}

.fliesztext {
  margin-bottom: 0;
}

.textbereich,
.textabschnitt {
  margin-bottom: 2.5rem;
}

.textbereich > * + *,
.textabschnitt__text--weit > * + * {
  margin-top: 1rem;
}

.textabschnitt__text > * + *,
.berufsfeld-box__text > * + * {
  margin-top: 0.75rem;
}

.abschnitt-titel {
  margin-bottom: 1rem;
  color: var(--ebk-blue);
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 800;
}

.berufsfelder {
  margin-bottom: 3.5rem;
}

.berufsfelder-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
  align-items: stretch;
}

.berufsfeld-box {
  height: 100%;
  padding: 1.5rem;
  background: var(--white);
  border: 1px solid var(--border-card);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
}

.berufsfeld-box__titel {
  margin-bottom: 1rem;
  color: var(--ebk-blue);
  font-size: 1.25rem;
  line-height: 1.75rem;
  font-weight: 800;
  text-align: center;
}

@media (min-width: 768px) {
  .av-titel {
    font-size: 2.25rem;
    line-height: 2.5rem;
  }

  .berufsfelder-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 520px) {
  .av-seite {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }

  .info-box {
    gap: 0.75rem;
  }

  .info-box__icon {
    width: 40px;
  }

  .berufsfeld-box {
    padding: 1.25rem;
  }
}
/* ==========================================================
   WEGWEISER / DOWNLOADBEREICH
   ========================================================== */

.wegweiser-seite {
  width: 100%;
  max-width: 56rem;
  margin: 0 auto;
  padding: 3rem 1rem;
  font-family: Arial, Helvetica, sans-serif;
  color: var(--text);
}

.wegweiser-seite > * + * {
  margin-top: 4rem;
}

.wegweiser-kopf {
  width: 100%;
  max-width: 42rem;
  margin: 0 auto;
  text-align: center;
}

.wegweiser-kopf > * + * {
  margin-top: 1rem;
}

.wegweiser-badge,
.berater-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.375rem 1rem;
  border-radius: 9999px;
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.wegweiser-badge {
  color: var(--ebk-green);
  background: rgb(46 139 87 / 10%);
}

.wegweiser-titel {
  margin: 0;
  color: var(--text);
  font-size: 1.875rem;
  line-height: 2.25rem;
  font-weight: 800;
  letter-spacing: -0.025em;
}

.wegweiser-einleitung {
  margin: 0;
  color: var(--text-muted);
  font-size: 0.875rem;
  line-height: 1.625;
}

/* ---------- Dokumentkarte ---------- */

.dokument-karte {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2rem;
  width: 100%;
  max-width: 48rem;
  margin-left: auto;
  margin-right: auto;
  padding: 1.5rem;
  background: linear-gradient(135deg, #f8fafc, rgb(241 245 249 / 50%));
  border: 1px solid rgb(226 232 240 / 80%);
  border-radius: var(--radius);
  box-shadow: 0 4px 10px rgb(15 23 42 / 8%);
  transition: border-color 0.3s ease, box-shadow 0.3s ease, transform 0.3s ease;
}

.dokument-karte:hover {
  border-color: rgb(46 139 87 / 20%);
  box-shadow: 0 8px 18px rgb(15 23 42 / 10%);
}

.dokument-vorschau {
  position: relative;
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: 8rem;
  height: 11rem;
  overflow: hidden;
  background: var(--white);
  border: 1px solid var(--border-light);
  border-radius: 0.5rem;
  box-shadow: 0 4px 10px rgb(15 23 42 / 10%);
}

.dokument-vorschau__inhalt {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  background: #f8fafc;
}

.dokument-vorschau__pdf {
  margin-bottom: 0.5rem;
  color: #ef4444;
  font-size: 3rem;
  transition: transform 0.3s ease;
}

.dokument-vorschau:hover .dokument-vorschau__pdf {
  transform: scale(1.1);
}

.dokument-vorschau__titel {
  color: #94a3b8;
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.dokument-vorschau__typ {
  margin-top: 0.25rem;
  color: #94a3b8;
  font-size: 0.5625rem;
}

.dokument-info {
  flex: 1 1 auto;
  width: 100%;
  text-align: center;
}

.dokument-info > * + * {
  margin-top: 1rem;
}

.dokument-info__titel {
  margin: 0;
  color: var(--text);
  font-size: 1.125rem;
  line-height: 1.75rem;
  font-weight: 700;
}

.dokument-info__meta {
  margin: 0.125rem 0 0;
  color: #94a3b8;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.dokument-info__text {
  margin: 0;
  color: var(--text-muted);
  font-size: 0.875rem;
  line-height: 1.625;
}

.dokument-download {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  padding-top: 0.5rem;
}

.download-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  width: 100%;
  padding: 0.75rem 1.5rem;
  color: var(--white);
  background: var(--ebk-green);
  border-radius: 9999px;
  box-shadow: 0 4px 8px rgb(15 23 42 / 12%);
  font-size: 0.875rem;
  font-weight: 800;
  text-decoration: none;
  transition: background-color 0.3s ease, box-shadow 0.3s ease, transform 0.3s ease;
}

.download-button:hover {
  background: color-mix(in srgb, var(--ebk-green) 86%, black);
  box-shadow: 0 8px 14px rgb(15 23 42 / 15%);
  transform: translateY(-2px);
}

.download-button:active {
  transform: scale(0.95);
}

.dokument-dateiinfo {
  color: #94a3b8;
  font-size: 0.75rem;
  font-weight: 500;
}

/* ---------- Inhaltsübersicht ---------- */

.wegweiser-inhalte {
  width: 100%;
  max-width: 42rem;
  margin-left: auto;
  margin-right: auto;
  padding-top: 2.5rem;
  border-top: 1px solid rgb(226 232 240 / 60%);
}

.wegweiser-inhalte__titel {
  margin: 0 0 1.5rem;
  color: #94a3b8;
  font-size: 0.875rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-align: center;
  text-transform: uppercase;
}

.wegweiser-checkliste {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
}

.wegweiser-check {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
}

.wegweiser-check__icon {
  flex: 0 0 auto;
  margin-top: 0.125rem;
  color: var(--ebk-green);
  font-size: 0.875rem;
}

.wegweiser-check__text {
  color: var(--text-muted);
  font-size: 0.875rem;
  line-height: 1.5;
}

/* ---------- Trenner ---------- */

.wegweiser-trenner {
  display: flex;
  align-items: center;
  width: 100%;
  max-width: 48rem;
  margin-left: auto;
  margin-right: auto;
  padding: 1.25rem 0;
}

.wegweiser-trenner__linie {
  flex: 1 1 auto;
  border-top: 1px solid var(--border-light);
}

.wegweiser-trenner__text {
  flex: 0 0 auto;
  margin: 0 1rem;
  color: #94a3b8;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-align: center;
  text-transform: uppercase;
}

/* ---------- KI-Berater ---------- */

.berater-box {
  width: 100%;
  max-width: 56rem;
  margin-left: auto;
  margin-right: auto;
  padding: 1.5rem;
  background: linear-gradient(135deg, #f8fafc, rgb(241 245 249 / 50%));
  border: 1px solid rgb(226 232 240 / 80%);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
}

.berater-kopf {
  max-width: 42rem;
  margin: 0 auto 2rem;
  text-align: center;
}

.berater-kopf > * + * {
  margin-top: 1rem;
}

.berater-badge {
  color: var(--ebk-blue);
  background: rgb(15 76 129 / 10%);
}

.berater-status {
  display: inline-block;
  width: 0.5rem;
  height: 0.5rem;
  background: var(--ebk-blue);
  border-radius: 50%;
  animation: ebk-pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

@keyframes ebk-pulse {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.45;
  }
}

.berater-titel {
  margin: 0;
  color: var(--text);
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 800;
  letter-spacing: -0.025em;
}

.berater-text {
  max-width: 42rem;
  margin-left: auto;
  margin-right: auto;
  color: var(--text-muted);
  font-size: 0.875rem;
  line-height: 1.625;
}

.berater-inhalt {
  min-height: 1px;
  overflow: hidden;
  background: var(--white);
  border: 1px solid var(--border-light);
  border-radius: 0.75rem;
  box-shadow: 0 4px 10px rgb(15 23 42 / 8%);
}

/* ---------- Responsive Wegweiser ---------- */

@media (min-width: 640px) {
  .wegweiser-seite {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }

  .wegweiser-titel {
    font-size: 2.25rem;
    line-height: 2.5rem;
  }

  .wegweiser-checkliste {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dokument-download {
    flex-direction: row;
  }

  .download-button {
    width: auto;
  }
}

@media (min-width: 768px) {
  .wegweiser-einleitung {
    font-size: 1rem;
  }

  .dokument-karte {
    flex-direction: row;
    padding: 2.5rem;
  }

  .dokument-info {
    text-align: left;
  }

  .berater-box {
    padding: 2.5rem;
  }

  .berater-titel {
    font-size: 1.875rem;
    line-height: 2.25rem;
  }
}

@media (min-width: 1024px) {
  .wegweiser-seite {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}

@media (max-width: 520px) {
  .wegweiser-seite {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }

  .wegweiser-seite > * + * {
    margin-top: 3rem;
  }

  .wegweiser-trenner__text {
    margin-left: 0.75rem;
    margin-right: 0.75rem;
    letter-spacing: 0.06em;
  }
}
/* ==========================================================
   SEKRETARIATE / SERVICE & VERWALTUNG
   ========================================================== */

.sekretariat-seite {
  width: 100%;
  max-width: 56rem;
  margin: 0 auto;
  padding: 2rem 1rem;
  font-family: Arial, Helvetica, sans-serif;
  color: var(--text);
}

/* ---------- Kopfbereich ---------- */

.sekretariat-kopf {
  padding-bottom: 1.5rem;
  margin-bottom: 2rem;
  border-bottom: 1px solid var(--border-light);
}

.sekretariat-kicker {
  display: block;
  margin-bottom: 0.5rem;
  color: var(--ebk-green);
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.sekretariat-titel {
  margin: 0;
  color: var(--ebk-blue);
  font-size: 1.875rem;
  line-height: 2.25rem;
  font-weight: 800;
  letter-spacing: -0.025em;
}

.sekretariat-einleitung {
  margin: 0.75rem 0 0;
  color: var(--text-muted);
  font-size: 1.125rem;
  line-height: 1.625;
}

/* ---------- Standortkarten ---------- */

.sekretariat-standorte {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
  margin-bottom: 3rem;
}

.standort-karte {
  padding: 1.5rem;
  background: #f8fafc;
  border: 1px solid var(--border-card);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
}

.standort-kopf {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 1rem;
}

.standort-icon {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  font-size: 1.125rem;
}

.standort-icon--blau {
  color: var(--ebk-blue);
  background: rgb(15 76 129 / 10%);
}

.standort-icon--gruen {
  color: var(--ebk-green);
  background: rgb(46 139 87 / 10%);
}

.standort-titel {
  margin: 0;
  color: var(--text);
  font-size: 1.125rem;
  line-height: 1.5rem;
  font-weight: 800;
}

.standort-untertitel {
  margin: 0;
  color: #64748b;
  font-size: 0.75rem;
}

.standort-adresse {
  margin: 0 0 1rem;
  color: var(--text-muted);
  font-size: 0.875rem;
  line-height: 1.5;
}

.standort-kontakt {
  padding-top: 1rem;
  border-top: 1px solid rgb(226 232 240 / 60%);
  font-size: 0.875rem;
}

.standort-kontakt > * + * {
  margin-top: 0.5rem;
}

.standort-kontaktzeile {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  margin: 0;
  color: #334155;
}

.standort-kontaktzeile i {
  width: 1rem;
  flex: 0 0 1rem;
  color: #94a3b8;
  text-align: center;
}

.standort-link,
.ferien-link {
  color: var(--ebk-blue);
  font-weight: 500;
  text-decoration: none;
}

.standort-link:hover,
.ferien-link:hover {
  text-decoration: underline;
}

.ferien-link {
  font-weight: 700;
}

/* ---------- Öffnungszeiten ---------- */

.oeffnungszeiten-box {
  margin-bottom: 3rem;
  padding: 1.5rem;
  background: rgb(15 76 129 / 5%);
  border: 1px solid rgb(15 76 129 / 10%);
  border-radius: var(--radius);
}

.oeffnungszeiten-titel {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0 0 1rem;
  color: var(--ebk-blue);
  font-size: 1.25rem;
  line-height: 1.75rem;
  font-weight: 700;
}

.oeffnungszeiten-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
  margin-bottom: 1.5rem;
}

.oeffnungszeit-karte {
  padding: 1rem;
  background: var(--white);
  border-radius: 0.75rem;
  box-shadow: var(--shadow-sm);
}

.oeffnungszeit-tag {
  display: block;
  margin-bottom: 0.25rem;
  color: var(--text);
  font-size: 0.875rem;
  font-weight: 700;
}

.oeffnungszeit-uhrzeit {
  color: var(--text-muted);
  font-size: 0.875rem;
}

.ferienhinweis {
  padding: 1rem;
  background: rgb(255 255 255 / 80%);
  border-left: 4px solid var(--ebk-green);
  border-radius: 0 0.75rem 0.75rem 0;
}

.ferienhinweis-titel {
  display: block;
  margin-bottom: 0.25rem;
  color: var(--ebk-green);
  font-size: 0.875rem;
  font-weight: 700;
  letter-spacing: 0.025em;
  text-transform: uppercase;
}

.ferienhinweis-text {
  margin: 0;
  color: #334155;
  font-size: 0.875rem;
  line-height: 1.625;
}

/* ---------- Dienstleistungen ---------- */

.dienstleistungen-titel {
  margin: 0 0 1.5rem;
  color: var(--text);
  font-size: 1.25rem;
  line-height: 1.75rem;
  font-weight: 700;
}

.dienstleistungen-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
}

.dienstleistung {
  display: flex;
  gap: 0.75rem;
}

.dienstleistung-icon {
  flex: 0 0 auto;
  margin-top: 0.25rem;
  color: var(--ebk-green);
}

.dienstleistung-titel {
  margin: 0;
  color: var(--text);
  font-weight: 700;
}

.dienstleistung-text {
  margin: 0;
  color: #64748b;
  font-size: 0.875rem;
  line-height: 1.5;
}

/* ---------- Responsive Sekretariat ---------- */

@media (min-width: 640px) {
  .oeffnungszeiten-grid,
  .dienstleistungen-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 768px) {
  .sekretariat-titel {
    font-size: 2.25rem;
    line-height: 2.5rem;
  }

  .sekretariat-standorte {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .oeffnungszeiten-box {
    padding: 2rem;
  }
}

/* ==========================================================
   EBK UTILITY-KOMPATIBILITÄT
   Ermöglicht bestehende Artikelcodes ohne Tailwind-CDN.
   ========================================================== */

/* EBK utility compatibility layer – replaces Tailwind for article content */
.bg-gradient-to-br{background-image:linear-gradient(to bottom right,var(--tw-gradient-from,#f8fafc),var(--tw-gradient-to,#f1f5f9));}
.bg-gradient-to-tr{background-image:linear-gradient(to top right,var(--tw-gradient-from,#f59e0b),var(--tw-gradient-to,#9333ea));}
.from-slate-50{--tw-gradient-from:#f8fafc;}
.to-slate-100{--tw-gradient-to:#f1f5f9;}
.to-slate-100\/50{--tw-gradient-to:rgba(241,245,249,.5);}
.from-amber-500{--tw-gradient-from:#f59e0b;}
.via-red-500{--tw-gradient-via:#ef4444;}
.to-purple-600{--tw-gradient-to:#9333ea;}
.from-amber-500.via-red-500.to-purple-600{background-image:linear-gradient(to top right,#f59e0b,#ef4444,#9333ea);}
.group:hover .group-hover\:bg-ebkGreen{background-color:var(--ebk-green);}
.group:hover .group-hover\:text-white{color:#fff;}
.group:hover .group-hover\:scale-110{transform:scale(1.1);}
.group:hover .group-hover\:translate-x-1{transform:translateX(.25rem);}
.hover\:underline:hover{text-decoration:underline;}
.hover\:opacity-90:hover{opacity:.9;}
.hover\:bg-ebkGreen:hover{background-color:var(--ebk-green);}
.hover\:bg-ebkGreenHover:hover{background-color:var(--ebk-green-hover);}
.hover\:text-ebkGreen:hover{color:var(--ebk-green);}
.hover\:text-ebkBlue:hover{color:var(--ebk-blue);}
.hover\:shadow-md:hover{box-shadow:0 4px 10px rgba(15,23,42,.10);}
.hover\:shadow-lg:hover{box-shadow:0 10px 18px rgba(15,23,42,.14);}
.hover\:shadow-xl:hover{box-shadow:0 18px 28px rgba(15,23,42,.16);}
.hover\:translate-x-1:hover{transform:translateX(.25rem);}
.hover\:-translate-y-0\.5:hover{transform:translateY(-.125rem);}
.active\:scale-95:active{transform:scale(.95);}
.focus\:ring-4:focus{box-shadow:0 0 0 4px rgba(110,231,183,.5);}
.focus\:ring-emerald-300:focus{--tw-ring-color:#6ee7b7;}
.pointer-events-none{pointer-events:none;}
.mx-auto{margin-left:auto;margin-right:auto;}

.-top-3{top:-0.75rem;}
.absolute{position:absolute;}
.bg-\[\#1877F2\]{background-color:#1877F2;}
.bg-amber-50{background-color:#fffbeb;}
.bg-blue-50{background-color:#eff6ff;}
.bg-ebkBlue{background-color:var(--ebk-blue);}
.bg-ebkBlue\/10{background-color:color-mix(in srgb, var(--ebk-blue) 10%, transparent);}
.bg-ebkBlue\/5{background-color:color-mix(in srgb, var(--ebk-blue) 5%, transparent);}
.bg-ebkGreen{background-color:var(--ebk-green);}
.bg-ebkGreen\/10{background-color:color-mix(in srgb, var(--ebk-green) 10%, transparent);}
.bg-emerald-50{background-color:#ecfdf5;}
.bg-emerald-50\/50{background-color:rgba(236,253,245,0.5);}
.bg-rose-50{background-color:#fff1f2;}
.bg-rose-500\/10{background-color:rgba(244,63,94,0.1);}
.bg-slate-100{background-color:#f1f5f9;}
.bg-slate-50{background-color:#f8fafc;}
.bg-slate-50\/50{background-color:rgba(248,250,252,0.5);}
.bg-slate-800{background-color:#1e293b;}
.bg-slate-950{background-color:#020617;}
.bg-white{background-color:#ffffff;}
.block{display:block;}
.border{border-width:1px;border-style:solid;}
.border-amber-500{border-color:#f59e0b;}
.border-b{border-bottom-width:1px;border-bottom-style:solid;}
.border-blue-500{border-color:#3b82f6;}
.border-ebkBlue\/10{border-color:color-mix(in srgb, var(--ebk-blue) 10%, transparent);}
.border-ebkGreen{border-color:var(--ebk-green);}
.border-emerald-100{border-color:#d1fae5;}
.border-emerald-200{border-color:#a7f3d0;}
.border-emerald-500{border-color:#10b981;}
.border-l-3{border-left-width:3px;border-left-style:solid;}
.border-l-4{border-left-width:4px;border-left-style:solid;}
.border-rose-100{border-color:#ffe4e6;}
.border-rose-500{border-color:#f43f5e;}
.border-slate-100{border-color:#f1f5f9;}
.border-slate-100\/80{border-color:rgba(241,245,249,0.8);}
.border-slate-200{border-color:#e2e8f0;}
.border-slate-200\/60{border-color:rgba(226,232,240,0.6);}
.border-slate-200\/80{border-color:rgba(226,232,240,0.8);}
.border-slate-800{border-color:#1e293b;}
.border-t{border-top-width:1px;border-top-style:solid;}
.duration-200{transition-duration:.2s;}
.duration-300{transition-duration:.3s;}
.flex{display:flex;}
.flex-col{flex-direction:column;}
.flex-grow{flex-grow:1;}
.flex-shrink-0{flex-shrink:0;}
.flex-wrap{flex-wrap:wrap;}
.font-black{font-weight:900;}
.font-bold{font-weight:700;}
.font-extrabold{font-weight:800;}
.font-medium{font-weight:500;}
.font-normal{font-weight:400;}
.font-sans{font-family:Arial,Helvetica,sans-serif;}
.font-semibold{font-weight:600;}
.font-serif{font-family:Georgia,serif;}
.gap-1\.5{gap:0.375rem;}
.gap-2{gap:0.5rem;}
.gap-2\.5{gap:0.625rem;}
.gap-3{gap:0.75rem;}
.gap-3\.5{gap:0.875rem;}
.gap-4{gap:1rem;}
.gap-5{gap:1.25rem;}
.gap-6{gap:1.5rem;}
.gap-8{gap:2rem;}
.grid{display:grid;}
.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr));}
.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr));}
.group:hover .group-hover\:bg-ebkGreen{background-color:var(--ebk-green);}
.group:hover .group-hover\:text-white{color:#ffffff;}
.group:hover .group-hover\:translate-x-1{transform:translateX(.25rem);}
.h-10{height:2.5rem;}
.h-12{height:3rem;}
.h-16{height:4rem;}
.h-20{height:5rem;}
.h-32{height:8rem;}
.h-36{height:9rem;}
.h-48{height:12rem;}
.h-5{height:1.25rem;}
.h-6{height:1.5rem;}
.h-8{height:2rem;}
.h-full{height:100%;}
.hidden{display:none;}
.hover\:-translate-y-0\.5:hover{transform:translateY(-.125rem);}
.hover\:bg-ebkBlue\/90:hover{background-color:color-mix(in srgb, var(--ebk-blue) 90%, transparent);}
.hover\:bg-ebkGreenHover:hover{background-color:var(--ebk-green-hover);}
.hover\:bg-slate-50:hover{background-color:#f8fafc;}
.hover\:bg-slate-50\/80:hover{background-color:rgba(248,250,252,0.8);}
.hover\:border-ebkGreen:hover{border-color:var(--ebk-green);}
.hover\:border-ebkGreen\/30:hover{border-color:color-mix(in srgb, var(--ebk-green) 30%, transparent);}
.hover\:opacity-90:hover{opacity:0.9;}
.hover\:shadow-lg:hover{box-shadow:0 10px 18px rgba(15,23,42,.14);}
.hover\:shadow-md:hover{box-shadow:0 4px 10px rgba(15,23,42,.10);}
.hover\:shadow-xl:hover{box-shadow:0 18px 28px rgba(15,23,42,.16);}
.hover\:text-ebkBlue:hover{color:var(--ebk-blue);}
.hover\:text-ebkGreen:hover{color:var(--ebk-green);}
.hover\:translate-x-1:hover{transform:translateX(.25rem);}
.inline-flex{display:inline-flex;}
.italic{font-style:italic;}
.items-center{align-items:center;}
.items-start{align-items:flex-start;}
.justify-between{justify-content:space-between;}
.justify-center{justify-content:center;}
.leading-relaxed{line-height:1.625;}
.leading-snug{line-height:1.375;}
.leading-tight{line-height:1.25;}
.left-6{left:1.5rem;}
@media (min-width:1024px){.lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (min-width:1024px){.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr));}}
@media (min-width:1024px){.lg\:px-8{padding-left:2rem;padding-right:2rem;}}
.list-none{list-style:none;}
.max-w-2xl{max-width:42rem;}
.max-w-3xl{max-width:48rem;}
.max-w-4xl{max-width:56rem;}
.max-w-5xl{max-width:64rem;}
.max-w-6xl{max-width:72rem;}
.max-w-7xl{max-width:80rem;}
.max-w-md{max-width:28rem;}
.mb-1{margin-bottom:0.25rem;}
.mb-1\.5{margin-bottom:0.375rem;}
.mb-10{margin-bottom:2.5rem;}
.mb-12{margin-bottom:3rem;}
.mb-16{margin-bottom:4rem;}
.mb-2{margin-bottom:0.5rem;}
.mb-2\.5{margin-bottom:0.625rem;}
.mb-3{margin-bottom:0.75rem;}
.mb-4{margin-bottom:1rem;}
.mb-6{margin-bottom:1.5rem;}
.mb-8{margin-bottom:2rem;}
@media (min-width:768px){.md\:col-span-2{grid-column:span 2 / span 2;}}
@media (min-width:768px){.md\:flex-row{flex-direction:row;}}
@media (min-width:768px){.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (min-width:768px){.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr));}}
@media (min-width:768px){.md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr));}}
@media (min-width:768px){.md\:max-w-xl{max-width:36rem;}}
@media (min-width:768px){.md\:mx-auto{margin-left:auto;margin-right:auto;}}
@media (min-width:768px){.md\:p-10{padding:2.5rem;}}
@media (min-width:768px){.md\:p-8{padding:2rem;}}
@media (min-width:768px){.md\:px-12{padding-left:3rem;padding-right:3rem;}}
@media (min-width:768px){.md\:py-10{padding-top:2.5rem;padding-bottom:2.5rem;}}
@media (min-width:768px){.md\:text-2xl{font-size:1.5rem;line-height:2rem;}}
@media (min-width:768px){.md\:text-3xl{font-size:1.875rem;line-height:2.25rem;}}
@media (min-width:768px){.md\:text-4xl{font-size:2.25rem;line-height:2.5rem;}}
@media (min-width:768px){.md\:text-base{font-size:1rem;line-height:1.5rem;}}
@media (min-width:768px){.md\:text-left{text-align:left;}}
@media (min-width:768px){.md\:text-lg{font-size:1.125rem;line-height:1.75rem;}}
@media (min-width:768px){.md\:text-sm{font-size:0.875rem;line-height:1.25rem;}}
@media (min-width:768px){.md\:text-xl{font-size:1.25rem;line-height:1.75rem;}}
@media (min-width:768px){.md\:text-xs{font-size:0.75rem;line-height:1rem;}}
@media (min-width:768px){.md\:w-auto{width:auto;}}
.ml-1{margin-left:0.25rem;}
.mr-1{margin-right:0.25rem;}
.mt-0\.5{margin-top:0.125rem;}
.mt-1{margin-top:0.25rem;}
.mt-2{margin-top:0.5rem;}
.mt-3{margin-top:0.75rem;}
.mt-4{margin-top:1rem;}
.mt-6{margin-top:1.5rem;}
.mt-8{margin-top:2rem;}
.mx-auto{margin-left:auto;margin-right:auto;}
.my-4{margin-top:1rem;margin-bottom:1rem;}
.my-6{margin-top:1.5rem;margin-bottom:1.5rem;}
.object-cover{object-fit:cover;}
.overflow-hidden{overflow:hidden;}
.overflow-x-hidden{overflow-x:hidden;}
.p-3{padding:0.75rem;}
.p-4{padding:1rem;}
.p-5{padding:1.25rem;}
.p-6{padding:1.5rem;}
.pb-0\.5{padding-bottom:0.125rem;}
.pb-1{padding-bottom:0.25rem;}
.pb-2{padding-bottom:0.5rem;}
.pb-4{padding-bottom:1rem;}
.pb-6{padding-bottom:1.5rem;}
.pb-8{padding-bottom:2rem;}
.pl-1{padding-left:0.25rem;}
.pl-2{padding-left:0.5rem;}
.pointer-events-none{pointer-events:none;}
.pt-12{padding-top:3rem;}
.pt-2{padding-top:0.5rem;}
.pt-3{padding-top:0.75rem;}
.pt-4{padding-top:1rem;}
.px-10{padding-left:2.5rem;padding-right:2.5rem;}
.px-3{padding-left:0.75rem;padding-right:0.75rem;}
.px-4{padding-left:1rem;padding-right:1rem;}
.px-5{padding-left:1.25rem;padding-right:1.25rem;}
.px-6{padding-left:1.5rem;padding-right:1.5rem;}
.px-8{padding-left:2rem;padding-right:2rem;}
.py-1{padding-top:0.25rem;padding-bottom:0.25rem;}
.py-1\.5{padding-top:0.375rem;padding-bottom:0.375rem;}
.py-12{padding-top:3rem;padding-bottom:3rem;}
.py-2{padding-top:0.5rem;padding-bottom:0.5rem;}
.py-2\.5{padding-top:0.625rem;padding-bottom:0.625rem;}
.py-3{padding-top:0.75rem;padding-bottom:0.75rem;}
.py-4{padding-top:1rem;padding-bottom:1rem;}
.py-6{padding-top:1.5rem;padding-bottom:1.5rem;}
.py-8{padding-top:2rem;padding-bottom:2rem;}
.relative{position:relative;}
.right-6{right:1.5rem;}
.rounded-2xl{border-radius:1rem;}
.rounded-3xl{border-radius:1.5rem;}
.rounded-full{border-radius:9999px;}
.rounded-lg{border-radius:0.5rem;}
.rounded-r-2xl{border-radius:0 1rem 1rem 0;}
.rounded-r-3xl{border-radius:0 1.5rem 1.5rem 0;}
.rounded-r-xl{border-radius:0 0.75rem 0.75rem 0;}
.rounded-xl{border-radius:0.75rem;}
.scroll-mt-6{scroll-margin-top:1.5rem;}
.select-none{user-select:none;}
.shadow-inner{box-shadow:inset 0 2px 4px rgba(15,23,42,.06);}
.shadow-lg{box-shadow:0 10px 18px rgba(15,23,42,.14);}
.shadow-md{box-shadow:0 4px 10px rgba(15,23,42,.10);}
.shadow-sm{box-shadow:0 1px 2px rgba(15,23,42,.06);}
.shadow-xs{box-shadow:0 1px 1px rgba(15,23,42,.04);}
@media (min-width:640px){.sm\:flex-row{flex-direction:row;}}
@media (min-width:640px){.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (min-width:640px){.sm\:items-start{align-items:flex-start;}}
@media (min-width:640px){.sm\:justify-start{justify-content:flex-start;}}
@media (min-width:640px){.sm\:px-6{padding-left:1.5rem;padding-right:1.5rem;}}
@media (min-width:640px){.sm\:text-left{text-align:left;}}
@media (min-width:640px){.sm\:w-auto{width:auto;}}
.space-y-1 > * + *{margin-top:0.25rem;}
.space-y-1\.5 > * + *{margin-top:0.375rem;}
.space-y-12 > * + *{margin-top:3rem;}
.space-y-16 > * + *{margin-top:4rem;}
.space-y-2 > * + *{margin-top:0.5rem;}
.space-y-2\.5 > * + *{margin-top:0.625rem;}
.space-y-3 > * + *{margin-top:0.75rem;}
.space-y-4 > * + *{margin-top:1rem;}
.space-y-5 > * + *{margin-top:1.25rem;}
.space-y-6 > * + *{margin-top:1.5rem;}
.space-y-8 > * + *{margin-top:2rem;}
.text-2xl{font-size:1.5rem;line-height:2rem;}
.text-3xl{font-size:1.875rem;line-height:2.25rem;}
.text-7xl{font-size:4.5rem;line-height:1;}
.text-\[10px\]{font-size:10px;}
.text-\[11px\]{font-size:11px;}
.text-\[13px\]{font-size:13px;}
.text-\[9px\]{font-size:9px;}
.text-amber-900{color:#78350f;}
.text-amber-950{color:#451a03;}
.text-base{font-size:1rem;line-height:1.5rem;}
.text-blue-600{color:#2563eb;}
.text-blue-700{color:#1d4ed8;}
.text-center{text-align:center;}
.text-cyan-400{color:#22d3ee;}
.text-ebkBlue{color:var(--ebk-blue);}
.text-ebkGreen{color:var(--ebk-green);}
.text-emerald-600{color:#059669;}
.text-emerald-700{color:#047857;}
.text-emerald-800{color:#065f46;}
.text-emerald-900{color:#064e3b;}
.text-left{text-align:left;}
.text-lg{font-size:1.125rem;line-height:1.75rem;}
.text-purple-600{color:#9333ea;}
.text-right{text-align:right;}
.text-rose-600{color:#e11d48;}
.text-rose-700{color:#be123c;}
.text-rose-800{color:#9f1239;}
.text-rose-950{color:#4c0519;}
.text-slate-200\/80{color:rgba(226,232,240,0.8);}
.text-slate-400{color:#94a3b8;}
.text-slate-500{color:#64748b;}
.text-slate-600{color:#475569;}
.text-slate-700{color:#334155;}
.text-slate-800{color:#1e293b;}
.text-sm{font-size:0.875rem;line-height:1.25rem;}
.text-white{color:#ffffff;}
.text-xl{font-size:1.25rem;line-height:1.75rem;}
.text-xs{font-size:0.75rem;line-height:1rem;}
.top-4{top:1rem;}
.tracking-tight{letter-spacing:-0.025em;}
.tracking-wide{letter-spacing:0.025em;}
.tracking-wider{letter-spacing:0.05em;}
.transition-all{transition-property:all;transition-timing-function:ease;}
.transition-colors{transition-property:color,background-color,border-color;transition-timing-function:ease;}
.transition-opacity{transition-property:opacity;transition-timing-function:ease;}
.transition-shadow{transition-property:box-shadow;transition-timing-function:ease;}
.transition-transform{transition-property:transform;transition-timing-function:ease;}
.uppercase{text-transform:uppercase;}
.w-10{width:2.5rem;}
.w-12{width:3rem;}
.w-16{width:4rem;}
.w-2\.5{width:0.625rem;}
.w-24{width:6rem;}
.w-28{width:7rem;}
.w-4{width:1rem;}
.w-40{width:10rem;}
.w-5{width:1.25rem;}
.w-8{width:2rem;}
.w-full{width:100%;}
.whitespace-nowrap{white-space:nowrap;}

/* Ergänzende Sonderklassen */
.bg-indigo-50{background-color:#eef2ff;}
.bg-purple-50{background-color:#faf5ff;}
.text-indigo-600{color:#4f46e5;}
.border-2{border-width:2px;border-style:solid;}
.font-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;}
.list-disc{list-style-type:disc;}
.list-inside{list-style-position:inside;}
.rounded-r-lg{border-radius:0 .5rem .5rem 0;}
.underline{text-decoration:underline;}
.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px;}
.focus\:ring-4:focus{box-shadow:0 0 0 4px var(--tw-ring-color,rgba(110,231,183,.5));}
.focus\:ring-emerald-300:focus{--tw-ring-color:#6ee7b7;}
@media (min-width:640px){.sm\:inline{display:inline;}}


/* ==========================================================
   V5 – Header / Hamburger-Sidenav
   ========================================================== */
.sidenav-transition{transition:transform .4s cubic-bezier(.16,1,.3,1);}
.dropdown-menu.show,
.dropdown.show .dropdown-menu,
.nav-item.dropdown:hover .dropdown-menu{
  display:block!important;
  opacity:1!important;
  visibility:visible!important;
}

.fixed{position:fixed;}
.sticky{position:sticky;}
.top-0{top:0;}
.right-0{right:0;}
.inset-0{inset:0;}
.z-10{z-index:10;}
.z-40{z-index:40;}
.z-50{z-index:50;}
.w-80{width:20rem;}
.w-auto{width:auto;}
.h-16{height:4rem;}
.h-24{height:6rem;}
.flex-1{flex:1 1 0%;}
.overflow-y-auto{overflow-y:auto;}
.translate-x-full{transform:translateX(100%);}
.opacity-0{opacity:0;}
.opacity-100{opacity:1;}
.bg-black\/40{background-color:rgba(0,0,0,.4);}
.shadow-2xl{box-shadow:0 25px 50px -12px rgba(15,23,42,.25);}
.border-l{border-left-width:1px;border-left-style:solid;}
.leading-normal{line-height:1.5;}
.py-1{padding-top:.25rem;padding-bottom:.25rem;}
.py-2\.5{padding-top:.625rem;padding-bottom:.625rem;}
.px-3\.5{padding-left:.875rem;padding-right:.875rem;}
.pl-1\.5{padding-left:.375rem;}
.space-y-2\.5 > * + *{margin-top:.625rem;}
.gap-2\.5{gap:.625rem;}
.bg-slate-200{background-color:#e2e8f0;}
.hover\:bg-slate-200:hover{background-color:#e2e8f0;}
.hover\:text-slate-800:hover{color:#1e293b;}
.hidden{display:none;}
.sm\:inline-flex{display:none;}

@media (min-width:640px){
  .sm\:inline-flex{display:inline-flex;}
  .sm\:px-6{padding-left:1.5rem;padding-right:1.5rem;}
}
@media (min-width:768px){
  .md\:h-24{height:6rem;}
  .md\:px-12{padding-left:3rem;padding-right:3rem;}
  .md\:py-6{padding-top:1.5rem;padding-bottom:1.5rem;}
  .md\:px-4{padding-left:1rem;padding-right:1rem;}
  .md\:px-5{padding-left:1.25rem;padding-right:1.25rem;}
}

/* ==========================================================
   V6 – Joomla Footer / EBK
   ========================================================== */

/* Weißer, zentrierter Footer – überschreibt Cassiopeia */
.container-footer,
body .container-footer,
.container-footer .grid-child,
footer.footer,
[role="contentinfo"] {
  background-color: #ffffff !important;
  background-image: none !important;
  border-top: 1px solid #e2e8f0 !important;
  padding-top: 2rem !important;
  padding-bottom: 2rem !important;
  text-align: center !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  float: none !important;
}

body .container-footer .mod-custom,
body .container-footer .custom,
body .container-footer .grid-child {
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
}

.container-footer a,
body .container-footer a {
  color: #475569 !important;
  text-decoration: none !important;
  font-weight: 600 !important;
  transition: color .2s ease-in-out !important;
}

.container-footer a:hover,
body .container-footer a:hover {
  color: var(--ebk-green) !important;
}

/* Semantische Footer-Klassen */
.ebk-footer {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  text-align: center;
}

.ebk-footer__links {
  width: 100%;
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  justify-content: center;
  column-gap: 1.5rem;
  row-gap: .5rem;
  font-size: .75rem;
  line-height: 1rem;
  font-weight: 600;
  text-align: center;
}

.ebk-footer__trenner {
  color: #cbd5e1;
}

.ebk-footer__copyright {
  width: 100%;
  max-width: 36rem;
  margin: 0 auto;
  padding-top: .75rem;
  border-top: 1px solid #f1f5f9;
  color: #94a3b8;
  font-size: .6875rem;
  line-height: 1rem;
  letter-spacing: .025em;
  text-align: center;
}

@media (max-width: 639px) {
  .ebk-footer__trenner {
    display: none;
  }

  .ebk-footer__links {
    flex-direction: column;
    gap: .625rem;
  }
}

/* ==========================================================
   EBK CASSIOPEIA CHILD – CMS-GRUNDAUFBAU
   Joomla 6 / Cassiopeia
   ========================================================== */

:root {
  --ebk-green: #73b61a;
  --ebk-green-hover: #5e9414;
  --ebk-blue: #007ab2;
  --ebk-text: #1e293b;
  --ebk-muted: #475569;
  --ebk-border: #e2e8f0;
  --ebk-soft: #f8fafc;
  --ebk-width: 80rem;

  /* Cassiopeia-Variablen an EBK angleichen */
  --cassiopeia-color-primary: var(--ebk-green);
  --cassiopeia-color-link: var(--ebk-blue);
  --cassiopeia-color-hover: var(--ebk-green-hover);
}

/* ---------- Grundlayout ---------- */

body {
  color: var(--ebk-text);
  background: #fff;
}

.site-grid {
  max-width: var(--ebk-width);
  margin-inline: auto;
  width: 100%;
}

main {
  min-width: 0;
}

/* Joomla-Artikel ohne zusätzliche Layout-Hacks */
.com-content-article,
.blog,
.blog-featured,
.category-list {
  width: 100%;
}

.item-page,
.com-content-article__body {
  min-width: 0;
}

/* ---------- Cassiopeia Header ---------- */

.container-header {
  background: #fff !important;
  background-image: none !important;
  box-shadow: 0 1px 0 var(--ebk-border);
  color: var(--ebk-text);
}

.container-header .grid-child {
  max-width: var(--ebk-width);
  margin-inline: auto;
}

.container-header .navbar-brand {
  margin: 0;
  padding: .75rem 0;
}

.container-header .navbar-brand img,
.container-header .brand-logo img {
  width: auto;
  max-height: 6rem;
  object-fit: contain;
}

.container-header a {
  color: inherit;
}

.container-nav {
  align-items: center;
}

/* ---------- Einzelner CTA im Header ----------
   Joomla-Modul: Menü, Position "search", Modulklasse "ebk-header-cta"
*/
.ebk-header-cta .mod-menu,
.ebk-header-cta ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.ebk-header-cta li {
  margin: 0;
}

.ebk-header-cta a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.75rem;
  padding: .7rem 1.15rem;
  border-radius: 9999px;
  background: var(--ebk-green);
  color: #fff !important;
  font-size: .8125rem;
  font-weight: 800;
  text-decoration: none !important;
  box-shadow: 0 4px 10px rgb(15 23 42 / 12%);
  transition: .2s ease;
}

.ebk-header-cta a:hover,
.ebk-header-cta a:focus {
  background: var(--ebk-green-hover);
  transform: translateY(-1px);
  box-shadow: 0 8px 16px rgb(15 23 42 / 14%);
}

/* ---------- EBK Offcanvas-Menü ----------
   Joomla-Modul: Hauptmenü, Position "menu", Layout "ebk-offcanvas"
*/

.ebk-nav {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.ebk-menu-toggle,
.ebk-menu-close {
  border: 0;
  cursor: pointer;
  font: inherit;
}

.ebk-menu-toggle {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  min-height: 2.75rem;
  padding: .65rem .9rem;
  border-radius: .75rem;
  background: #f1f5f9;
  color: #334155;
  font-size: .8125rem;
  font-weight: 800;
  transition: .2s ease;
}

.ebk-menu-toggle:hover,
.ebk-menu-toggle:focus {
  background: #e2e8f0;
}

.ebk-menu-toggle__icon {
  width: 1.25rem;
  height: 1rem;
  display: inline-flex;
  flex-direction: column;
  justify-content: space-between;
}

.ebk-menu-toggle__icon::before,
.ebk-menu-toggle__icon::after,
.ebk-menu-toggle__icon span {
  content: "";
  display: block;
  width: 100%;
  height: 2px;
  border-radius: 2px;
  background: currentColor;
}

.ebk-sidenav {
  position: fixed;
  z-index: 1051;
  top: 0;
  right: 0;
  width: min(22rem, 90vw);
  height: 100dvh;
  display: flex;
  flex-direction: column;
  background: #fff;
  box-shadow: -18px 0 40px rgb(15 23 42 / 18%);
  transform: translateX(105%);
  transition: transform .35s cubic-bezier(.16,1,.3,1);
  visibility: hidden;
}

.ebk-sidenav.is-open {
  transform: translateX(0);
  visibility: visible;
}

.ebk-sidenav__head {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.25rem 1.5rem;
  background: #fff;
  border-bottom: 1px solid #f1f5f9;
}

.ebk-sidenav__title {
  color: var(--ebk-green);
  font-size: 1.05rem;
  font-weight: 800;
}

.ebk-menu-close {
  width: 2.5rem;
  height: 2.5rem;
  display: inline-grid;
  place-items: center;
  border-radius: 50%;
  background: #f1f5f9;
  color: #64748b;
  font-size: 1.35rem;
  line-height: 1;
}

.ebk-sidenav__body {
  overflow-y: auto;
  padding: 1.25rem 1.5rem 2rem;
}

.ebk-sidenav__body .mod-menu,
.ebk-sidenav__body ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.ebk-sidenav__body .mod-menu > li {
  border-bottom: 1px solid #f1f5f9;
}

.ebk-sidenav__body .mod-menu a,
.ebk-sidenav__body .mod-menu .nav-header,
.ebk-sidenav__body .mod-menu .separator {
  display: flex;
  align-items: center;
  gap: .65rem;
  width: 100%;
  padding: .75rem .25rem;
  color: #475569;
  font-size: .9rem;
  font-weight: 650;
  text-decoration: none;
}

.ebk-sidenav__body .mod-menu a:hover,
.ebk-sidenav__body .mod-menu a:focus,
.ebk-sidenav__body .mod-menu .active > a,
.ebk-sidenav__body .mod-menu .current > a {
  color: var(--ebk-green);
}

.ebk-sidenav__body .mod-menu ul {
  padding: 0 0 .65rem 1rem;
}

.ebk-sidenav__body .mod-menu ul a {
  padding-top: .45rem;
  padding-bottom: .45rem;
  font-size: .82rem;
  font-weight: 550;
}

/* Optionale Menü-Überschrift:
   Im Menüpunkt "Link CSS Style" die Klasse ebk-menu-section eintragen. */
.ebk-sidenav__body .ebk-menu-section > a,
.ebk-sidenav__body .ebk-menu-section > .nav-header {
  margin-top: 1rem;
  color: #94a3b8;
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}

/* Optional hervorgehobener Menüpunkt */
.ebk-sidenav__body .ebk-menu-highlight > a {
  color: var(--ebk-green);
  font-weight: 800;
}

.ebk-sidenav-overlay {
  position: fixed;
  z-index: 1050;
  inset: 0;
  background: rgb(0 0 0 / 38%);
  opacity: 0;
  visibility: hidden;
  transition: opacity .25s ease, visibility .25s ease;
}

.ebk-sidenav-overlay.is-open {
  opacity: 1;
  visibility: visible;
}

body.ebk-menu-open {
  overflow: hidden;
}

/* ---------- Joomla Content ---------- */

.container-component {
  min-width: 0;
}

/* Standardisierte Artikelbreite. Artikel können weiterhin eigene
   .max-w-* / EBK-Klassen aus den Altseiten benutzen. */
main > .com-content-article,
main > .blog,
main > .blog-featured,
main > .category-list {
  max-width: 80rem;
  margin-inline: auto;
}

/* Joomla Standardbuttons ins EBK-Design */
.btn-primary,
.btn-primary:focus,
.btn-primary:hover {
  background-color: var(--ebk-green);
  border-color: var(--ebk-green);
  color: #fff;
}

.btn-primary:hover {
  background-color: var(--ebk-green-hover);
  border-color: var(--ebk-green-hover);
}

a {
  text-underline-offset: .16em;
}

/* ---------- Footer ----------
   Empfohlen: Menü-Modul auf Position "footer",
   Modulklasse "ebk-footer-menu".
*/

.container-footer {
  background: #fff !important;
  background-image: none !important;
  border-top: 1px solid var(--ebk-border);
  color: #64748b;
}

.container-footer .grid-child {
  max-width: var(--ebk-width);
  margin-inline: auto;
}

.ebk-footer-menu .mod-menu,
.ebk-footer-menu ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .75rem 1.5rem;
  width: 100%;
  list-style: none;
  margin: 0;
  padding: 0;
}

.ebk-footer-menu a {
  color: #475569 !important;
  font-size: .78rem;
  font-weight: 650;
  text-decoration: none;
}

.ebk-footer-menu a:hover,
.ebk-footer-menu a:focus {
  color: var(--ebk-green) !important;
}

.ebk-copyright {
  width: 100%;
  margin: .85rem auto 0;
  padding-top: .85rem;
  border-top: 1px solid #f1f5f9;
  color: #94a3b8;
  font-size: .7rem;
  text-align: center;
}

/* ---------- Responsive ---------- */

@media (max-width: 767.98px) {
  .container-header .navbar-brand img,
  .container-header .brand-logo img {
    max-height: 4rem;
  }

  .ebk-header-cta {
    display: none;
  }
}

@media (max-width: 575.98px) {
  .ebk-footer-menu .mod-menu,
  .ebk-footer-menu ul {
    flex-direction: column;
    align-items: center;
  }
}

/* ==========================================================
   EBK Header – größeres Logo / Hauptmenü rechts
   ========================================================== */

.container-header .grid-child,
.container-header .container-nav {
  width: 100%;
}

/* Logo links und deutlich größer */
.container-header .navbar-brand,
.container-header .brand-logo {
  flex: 0 0 auto;
  margin-right: auto;
}

.container-header .navbar-brand img,
.container-header .brand-logo img {
  width: auto;
  height: auto;
  max-height: 8rem;
  max-width: min(34rem, 48vw);
}

/* Hauptmenü konsequent rechts */
.container-header .container-nav {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.container-header .container-nav .moduletable,
.container-header .container-nav > nav,
.container-header .ebk-nav {
  margin-left: auto;
}

.ebk-nav {
  width: auto;
  flex: 0 0 auto;
  justify-content: flex-end;
}

@media (max-width: 767.98px) {
  .container-header .navbar-brand img,
  .container-header .brand-logo img {
    max-height: 5.5rem;
    max-width: 62vw;
  }
}

@media (max-width: 479.98px) {
  .container-header .navbar-brand img,
  .container-header .brand-logo img {
    max-height: 4.5rem;
    max-width: 58vw;
  }
}

/* ==========================================================
   V1.0.3 – EBK OFFCANVAS-MENÜ
   Bereichsüberschriften, Icons, Hervorhebung
   ========================================================== */

.ebk-sidenav {
  width: min(22rem, 92vw);
}

.ebk-sidenav__head {
  padding: 1rem 1.25rem;
}

.ebk-sidenav__title {
  color: var(--ebk-green);
  font-size: 1.05rem;
  font-weight: 800;
}

.ebk-sidenav__body {
  padding: 1rem 1.25rem 2rem;
}

.ebk-sidenav__body .mod-menu > li {
  border-bottom: 0;
}

/* Bereichsüberschriften */
.ebk-sidenav__body .ebk-menu-section > a,
.ebk-sidenav__body .ebk-menu-section > .nav-header,
.ebk-sidenav__body .ebk-menu-section > span {
  display: block;
  margin: 1.25rem 0 .45rem;
  padding: 0;
  color: #94a3b8;
  font-size: .72rem;
  line-height: 1.2;
  font-weight: 800;
  letter-spacing: .035em;
  text-transform: uppercase;
  pointer-events: none;
}

/* Normale Menülinks */
.ebk-sidenav__body .mod-menu a {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: .8rem;
  min-height: 2.35rem;
  padding: .5rem .2rem;
  border-radius: .45rem;
  color: #173b63;
  font-size: .9rem;
  line-height: 1.25rem;
  font-weight: 600;
  text-decoration: none;
  transition: color .18s ease, background-color .18s ease;
}

.ebk-sidenav__body .mod-menu a:hover,
.ebk-sidenav__body .mod-menu a:focus {
  color: var(--ebk-green);
  background: rgb(115 182 26 / 5%);
}

/* Aktueller Menüpunkt */
.ebk-sidenav__body .mod-menu .active > a,
.ebk-sidenav__body .mod-menu .current > a {
  color: var(--ebk-green);
}

/* Icon-Grundstil */
.ebk-sidenav__body .mod-menu a[class*="ebk-icon-"]::before {
  content: "";
  flex: 0 0 1.1rem;
  width: 1.1rem;
  height: 1.1rem;
  margin-top: .07rem;
  background-color: #94a3b8;
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
}

.ebk-sidenav__body .mod-menu a[class*="ebk-icon-"]:hover::before,
.ebk-sidenav__body .mod-menu .active > a[class*="ebk-icon-"]::before,
.ebk-sidenav__body .mod-menu .current > a[class*="ebk-icon-"]::before,
.ebk-sidenav__body .mod-menu a.ebk-menu-highlight::before {
  background-color: var(--ebk-green);
}

/* Kleine, unabhängige SVG-Icons als CSS-Masken */
.ebk-icon-compass::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20Zm3.4 6.6-1.9 4.9-4.9 1.9 1.9-4.9 4.9-1.9Z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20Zm3.4 6.6-1.9 4.9-4.9 1.9 1.9-4.9 4.9-1.9Z'/%3E%3C/svg%3E");
}
.ebk-icon-users::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 11a4 4 0 1 0 0-8 4 4 0 0 0 0 8Zm8 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6ZM2 20v-2c0-3 3-5 6-5s6 2 6 5v2H2Zm13 0v-2c0-1.4-.5-2.7-1.4-3.7.7-.2 1.5-.3 2.4-.3 2.8 0 6 1.8 6 4.5V20h-7Z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 11a4 4 0 1 0 0-8 4 4 0 0 0 0 8Zm8 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6ZM2 20v-2c0-3 3-5 6-5s6 2 6 5v2H2Zm13 0v-2c0-1.4-.5-2.7-1.4-3.7.7-.2 1.5-.3 2.4-.3 2.8 0 6 1.8 6 4.5V20h-7Z'/%3E%3C/svg%3E");
}
.ebk-icon-user-tie::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 11a4 4 0 1 0 0-8 4 4 0 0 0 0 8Zm-7 9v-2c0-3.3 3.1-5 7-5s7 1.7 7 5v2H5Zm6-6 1 1 1-1-1-1-1 1Zm1 2-1 4h2l-1-4Z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 11a4 4 0 1 0 0-8 4 4 0 0 0 0 8Zm-7 9v-2c0-3.3 3.1-5 7-5s7 1.7 7 5v2H5Zm6-6 1 1 1-1-1-1-1 1Zm1 2-1 4h2l-1-4Z'/%3E%3C/svg%3E");
}
.ebk-icon-briefcase::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 4h6a2 2 0 0 1 2 2v1h3a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V9a2 2 0 0 1 2-2h3V6a2 2 0 0 1 2-2Zm0 3h6V6H9v1Zm-5 4v7h16v-7h-6v2h-4v-2H4Z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 4h6a2 2 0 0 1 2 2v1h3a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V9a2 2 0 0 1 2-2h3V6a2 2 0 0 1 2-2Zm0 3h6V6H9v1Zm-5 4v7h16v-7h-6v2h-4v-2H4Z'/%3E%3C/svg%3E");
}
.ebk-icon-list::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 6h2v2H4V6Zm4 0h12v2H8V6ZM4 11h2v2H4v-2Zm4 0h12v2H8v-2ZM4 16h2v2H4v-2Zm4 0h12v2H8v-2Z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 6h2v2H4V6Zm4 0h12v2H8V6ZM4 11h2v2H4v-2Zm4 0h12v2H8v-2ZM4 16h2v2H4v-2Zm4 0h12v2H8v-2Z'/%3E%3C/svg%3E");
}
.ebk-icon-signup::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 3h10a2 2 0 0 1 2 2v6h-2V5H5v14h7v2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2Zm13.7 9.3 3 3-6.4 6.4-3.8.8.8-3.8 6.4-6.4Z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 3h10a2 2 0 0 1 2 2v6h-2V5H5v14h7v2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2Zm13.7 9.3 3 3-6.4 6.4-3.8.8.8-3.8 6.4-6.4Z'/%3E%3C/svg%3E");
}
.ebk-icon-signpost::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M11 2h2v4h6l3 3-3 3h-6v10h-2V12H5L2 9l3-3h6V2Zm-5 6-1 1 1 1h5V8H6Zm7 0v2h5l1-1-1-1h-5Z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M11 2h2v4h6l3 3-3 3h-6v10h-2V12H5L2 9l3-3h6V2Zm-5 6-1 1 1 1h5V8H6Zm7 0v2h5l1-1-1-1h-5Z'/%3E%3C/svg%3E");
}
.ebk-icon-robot::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M11 2h2v3h4a3 3 0 0 1 3 3v8a3 3 0 0 1-3 3h-1v2h-2v-2h-4v2H8v-2H7a3 3 0 0 1-3-3V8a3 3 0 0 1 3-3h4V2ZM7 7a1 1 0 0 0-1 1v8a1 1 0 0 0 1 1h10a1 1 0 0 0 1-1V8a1 1 0 0 0-1-1H7Zm2 3a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3Zm6 0a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3ZM9 15h6v1H9v-1Z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M11 2h2v3h4a3 3 0 0 1 3 3v8a3 3 0 0 1-3 3h-1v2h-2v-2h-4v2H8v-2H7a3 3 0 0 1-3-3V8a3 3 0 0 1 3-3h4V2ZM7 7a1 1 0 0 0-1 1v8a1 1 0 0 0 1 1h10a1 1 0 0 0 1-1V8a1 1 0 0 0-1-1H7Zm2 3a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3Zm6 0a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3ZM9 15h6v1H9v-1Z'/%3E%3C/svg%3E");
}
.ebk-icon-road::before,
.ebk-icon-building::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 2h8l4 20h-6l-1-6h-2l-1 6H4L8 2Zm3 3-1 6h4l-1-6h-2Zm0 8-.5 2h3L13 13h-2Z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 2h8l4 20h-6l-1-6h-2l-1 6H4L8 2Zm3 3-1 6h4l-1-6h-2Zm0 8-.5 2h3L13 13h-2Z'/%3E%3C/svg%3E");
}
.ebk-icon-documents::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 2h10v3h3v15H7V2Zm2 2v14h9V7h-3V4H9ZM4 5h2v16h11v1H4V5Z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 2h10v3h3v15H7V2Zm2 2v14h9V7h-3V4H9ZM4 5h2v16h11v1H4V5Z'/%3E%3C/svg%3E");
}
.ebk-icon-heart::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 21 4.3 13.8A5 5 0 0 1 11 6.4L12 7.5l1-1.1a5 5 0 0 1 6.7 7.4L12 21Z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 21 4.3 13.8A5 5 0 0 1 11 6.4L12 7.5l1-1.1a5 5 0 0 1 6.7 7.4L12 21Z'/%3E%3C/svg%3E");
}
.ebk-icon-star::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m12 2 3 6 6.5 1-4.7 4.6 1.1 6.4-5.9-3.1L6.1 20l1.1-6.4L2.5 9 9 8l3-6Z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m12 2 3 6 6.5 1-4.7 4.6 1.1 6.4-5.9-3.1L6.1 20l1.1-6.4L2.5 9 9 8l3-6Z'/%3E%3C/svg%3E");
}

/* Hervorgehobener Punkt "Mein Weg am EBK" */
.ebk-sidenav__body a.ebk-menu-highlight {
  color: var(--ebk-green);
  font-weight: 800;
}

/* Unterzeile: wird per data-ebk-subtitle im Link ergänzt */
.ebk-sidenav__body a[data-ebk-subtitle] {
  flex-wrap: wrap;
}

.ebk-sidenav__body a[data-ebk-subtitle]::after {
  content: attr(data-ebk-subtitle);
  flex-basis: calc(100% - 1.9rem);
  margin-left: 1.9rem;
  margin-top: -.25rem;
  color: #94a3b8;
  font-size: .58rem;
  line-height: 1.15;
  font-weight: 400;
}

/* Footer im Offcanvas */
.ebk-sidenav__footer {
  margin-top: auto;
  padding: 1.1rem 1.25rem;
  border-top: 1px solid #f1f5f9;
  background: #f8fafc;
  color: #94a3b8;
  font-size: .68rem;
  text-align: center;
}

/* ==========================================================
   V1.0.4 – TYPOGRAFIE / MENÜ-FEINSCHLIFF / UNTERMENÜS
   ========================================================== */

/* Globale Typografie */
body {
  font-family: var(--ebk-font);
  font-size: var(--ebk-font-text);
}

h1 { font-size: var(--ebk-font-h1); }
h2 { font-size: var(--ebk-font-h2); }
h3 { font-size: var(--ebk-font-h3); }

/* Logo über zentrale Variablen steuern */
.container-header .navbar-brand img,
.container-header .brand-logo img {
  max-height: var(--ebk-logo-height);
  max-width: min(var(--ebk-logo-width), 48vw);
}

/* ---------- Offcanvas-Menü: näher an der Vorlage ---------- */

.ebk-sidenav {
  width: min(21rem, 92vw);
}

.ebk-sidenav__head {
  padding: 1.15rem 1.35rem;
}

.ebk-sidenav__title {
  font-size: 1.05rem;
  letter-spacing: -.01em;
}

.ebk-sidenav__body {
  padding: .85rem 1.35rem 1.75rem;
}

/* Bereichsüberschriften */
.ebk-sidenav__body .ebk-menu-section > a,
.ebk-sidenav__body .ebk-menu-section > .nav-header,
.ebk-sidenav__body .ebk-menu-section > span {
  margin: 1.15rem 0 .35rem;
  padding: 0;
  color: var(--ebk-light);
  font-size: var(--ebk-font-menu-section);
  line-height: 1.15;
  font-weight: 800;
  letter-spacing: .045em;
  text-transform: uppercase;
}

/* normale Menüeinträge */
.ebk-sidenav__body .mod-menu a {
  gap: .72rem;
  min-height: 2.2rem;
  padding: .42rem .15rem;
  color: var(--ebk-menu-text);
  font-size: var(--ebk-font-menu);
  line-height: 1.2rem;
  font-weight: 600;
}

.ebk-sidenav__body .mod-menu a[class*="ebk-icon-"]::before {
  flex-basis: 1rem;
  width: 1rem;
  height: 1rem;
  margin-top: .08rem;
}

.ebk-sidenav__body a[data-ebk-subtitle]::after {
  flex-basis: calc(100% - 1.72rem);
  margin-left: 1.72rem;
  margin-top: -.18rem;
  color: var(--ebk-light);
  font-size: var(--ebk-font-menu-subtitle);
  line-height: 1.15;
}

/* ---------- Aufklappbare Untermenüs ---------- */

.ebk-sidenav__body .mod-menu li.deeper {
  position: relative;
}

/* Pfeilbutton wird per JS erzeugt */
.ebk-submenu-toggle {
  position: absolute;
  top: .28rem;
  right: 0;
  z-index: 2;
  width: 2rem;
  height: 2rem;
  display: grid;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: .4rem;
  background: transparent;
  color: #94a3b8;
  cursor: pointer;
  transition: background-color .18s ease, color .18s ease;
}

.ebk-submenu-toggle:hover,
.ebk-submenu-toggle:focus {
  color: var(--ebk-green);
  background: rgb(115 182 26 / 7%);
}

.ebk-submenu-toggle::before {
  content: "";
  width: .48rem;
  height: .48rem;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg) translate(-1px, -1px);
  transition: transform .2s ease;
}

.ebk-submenu-toggle[aria-expanded="true"]::before {
  transform: rotate(225deg) translate(-1px, -1px);
}

/* Platz für den Pfeil rechts */
.ebk-sidenav__body .mod-menu li.deeper > a {
  padding-right: 2.25rem;
}

/* Untermenü geschlossen */
.ebk-sidenav__body .mod-menu li.deeper > ul {
  display: none;
  margin: .05rem 0 .4rem 1.7rem;
  padding: 0 0 0 .75rem;
  border-left: 1px solid #e2e8f0;
}

/* Untermenü geöffnet */
.ebk-sidenav__body .mod-menu li.deeper.ebk-submenu-open > ul {
  display: block;
}

.ebk-sidenav__body .mod-menu li.deeper > ul a {
  min-height: 1.85rem;
  padding: .34rem .1rem;
  color: #64748b;
  font-size: .8rem;
  line-height: 1.1rem;
  font-weight: 500;
}

.ebk-sidenav__body .mod-menu li.deeper > ul a:hover,
.ebk-sidenav__body .mod-menu li.deeper > ul .active > a {
  color: var(--ebk-green);
}

/* Aktiver Elternpunkt darf automatisch offen wirken */
.ebk-sidenav__body .mod-menu li.deeper.active > ul,
.ebk-sidenav__body .mod-menu li.deeper.current > ul {
  display: block;
}

/* Mobile Logo-Werte */
@media (max-width: 767.98px) {
  .container-header .navbar-brand img,
  .container-header .brand-logo img {
    max-height: 5.5rem;
    max-width: 62vw;
  }
}

@media (max-width: 479.98px) {
  .container-header .navbar-brand img,
  .container-header .brand-logo img {
    max-height: 4.5rem;
    max-width: 58vw;
  }
}

/* ==========================================================
   V1.0.5 – EBK-BAUKASTEN FÜR JOOMLA-ARTIKEL
   Kurze, verständliche Klassen statt langer Utility-Ketten
   ========================================================== */

/* ---------- Gemeinsame Inhaltsbreite ---------- */
.ebk-inhalt {
  width: 100%;
  max-width: var(--ebk-content-width);
  margin-inline: auto;
}

/* ---------- Grüne Hinweisbox ---------- */
.ebk-hinweisbox {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  width: 100%;
  max-width: var(--ebk-content-width);
  margin: 0 auto 1rem;
  padding: 1rem;
  border-left: 4px solid var(--ebk-green);
  border-radius: 0 var(--ebk-radius) var(--ebk-radius) 0;
  background: #ecfdf5;
  box-shadow: 0 1px 3px rgb(15 23 42 / 8%);
}

.ebk-hinweisbox__icon {
  flex: 0 0 auto;
  width: 50px;
  height: 50px;
  object-fit: contain;
}

.ebk-hinweisbox h2,
.ebk-hinweisbox h3,
.ebk-hinweisbox h4 {
  margin-top: 0;
  margin-bottom: .35rem;
  color: var(--ebk-green);
}

.ebk-hinweisbox p:last-child {
  margin-bottom: 0;
}

/* Blaue Variante */
.ebk-infobox {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  width: 100%;
  max-width: var(--ebk-content-width);
  margin: 0 auto 1rem;
  padding: 1rem;
  border-left: 4px solid var(--ebk-blue);
  border-radius: 0 var(--ebk-radius) var(--ebk-radius) 0;
  background: #eff8fc;
  box-shadow: 0 1px 3px rgb(15 23 42 / 8%);
}

.ebk-infobox__icon {
  flex: 0 0 auto;
  width: 50px;
  height: 50px;
  object-fit: contain;
}

.ebk-infobox h2,
.ebk-infobox h3,
.ebk-infobox h4 {
  margin-top: 0;
  margin-bottom: .35rem;
  color: var(--ebk-blue);
}

.ebk-infobox p:last-child {
  margin-bottom: 0;
}

/* Dezente Warn-/Wichtig-Box */
.ebk-warnbox {
  width: 100%;
  max-width: var(--ebk-content-width);
  margin: 0 auto 1rem;
  padding: 1rem;
  border-left: 4px solid #d97706;
  border-radius: 0 var(--ebk-radius) var(--ebk-radius) 0;
  background: #fffbeb;
  box-shadow: 0 1px 3px rgb(15 23 42 / 8%);
}

/* ---------- Kartenraster ---------- */
.ebk-boxen {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  gap: 1.5rem;
  width: 100%;
  max-width: var(--ebk-content-width);
  margin: 0 auto 3.5rem;
}

/* Eine Karte */
.ebk-box {
  height: 100%;
  padding: 1.5rem;
  border: 1px solid #f1f5f9;
  border-radius: var(--ebk-radius);
  background: var(--ebk-white);
  box-shadow: 0 1px 3px rgb(15 23 42 / 8%);
  font-size: var(--ebk-font-small);
  line-height: 1.65;
}

.ebk-box h2,
.ebk-box h3 {
  margin-top: 0;
  margin-bottom: 1rem;
  color: var(--ebk-blue);
  font-weight: 800;
  text-align: center;
}

.ebk-box h3 {
  font-size: 1.25rem;
}

.ebk-box p {
  color: #475569;
}

.ebk-box p:last-child {
  margin-bottom: 0;
}

/* Optional: 3 Karten nebeneinander */
.ebk-boxen--3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

/* Optional: einzelne Karte über volle Breite */
.ebk-box--breit {
  grid-column: 1 / -1;
}

/* ---------- Bildkarte ---------- */
.ebk-bildbox {
  overflow: hidden;
  border: 1px solid #f1f5f9;
  border-radius: var(--ebk-radius);
  background: var(--ebk-white);
  box-shadow: 0 1px 3px rgb(15 23 42 / 8%);
}

.ebk-bildbox img {
  display: block;
  width: 100%;
  height: auto;
}

.ebk-bildbox__inhalt {
  padding: 1.25rem;
}

/* ---------- Buttons ---------- */
.ebk-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  min-height: 2.65rem;
  padding: .65rem 1.15rem;
  border: 0;
  border-radius: .65rem;
  font-family: var(--ebk-font);
  font-size: .9rem;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none !important;
  cursor: pointer;
  transition: transform .15s ease, background-color .15s ease,
              box-shadow .15s ease;
}

.ebk-button:hover {
  transform: translateY(-1px);
}

.ebk-button--gruen {
  background: var(--ebk-green);
  color: #fff !important;
}

.ebk-button--gruen:hover,
.ebk-button--gruen:focus {
  background: var(--ebk-green-hover);
  color: #fff !important;
}

.ebk-button--blau {
  background: var(--ebk-blue);
  color: #fff !important;
}

.ebk-button--blau:hover,
.ebk-button--blau:focus {
  background: #006591;
  color: #fff !important;
}

/* ---------- Kleine Helfer ---------- */
.ebk-text-blau  { color: var(--ebk-blue) !important; }
.ebk-text-gruen { color: var(--ebk-green) !important; }
.ebk-text-mitte { text-align: center !important; }

.ebk-abstand-unten {
  margin-bottom: 2rem !important;
}

/* ---------- Responsive ---------- */
@media (max-width: 767.98px) {
  .ebk-boxen,
  .ebk-boxen--3 {
    grid-template-columns: 1fr;
    gap: 1rem;
    margin-bottom: 2rem;
  }

  .ebk-hinweisbox,
  .ebk-infobox {
    gap: .75rem;
  }

  .ebk-hinweisbox__icon,
  .ebk-infobox__icon {
    width: 42px;
    height: 42px;
  }
}


/* ==========================================================
   V1.0.6 – MENÜ-KORREKTUR
   ========================================================== */

/* Offcanvas bleibt weiß */
.ebk-sidenav,
.ebk-sidenav__body,
.ebk-sidenav__body .mod-menu,
.ebk-sidenav__body .mod-menu li { background:#fff; }

/* Normale Menüeinträge dunkelgrau */
.container-header .ebk-sidenav__body .mod-menu li > a,
.container-header .ebk-sidenav__body .mod-menu li > a:link,
.container-header .ebk-sidenav__body .mod-menu li > a:visited {
  color:#4b5563 !important;
  background:transparent;
  font-size:var(--ebk-font-menu);
  font-weight:600;
  text-decoration:none;
}

/* Hover + Fokus grün */
.container-header .ebk-sidenav__body .mod-menu li > a:hover,
.container-header .ebk-sidenav__body .mod-menu li > a:focus-visible {
  color:var(--ebk-green) !important;
  background:rgb(115 182 26 / 6%);
}

/* Aktiver Menüpunkt grün */
.container-header .ebk-sidenav__body .mod-menu li.active > a,
.container-header .ebk-sidenav__body .mod-menu li.current > a {
  color:var(--ebk-green) !important;
}

/* Kapitelüberschriften: grau + Kapitälchen */
.container-header .ebk-sidenav__body .mod-menu li.ebk-menu-section > a,
.container-header .ebk-sidenav__body .mod-menu li.ebk-menu-section > span,
.container-header .ebk-sidenav__body .mod-menu .nav-header {
  display:block;
  margin:1.15rem 0 .35rem;
  padding:0;
  color:#9ca3af !important;
  background:transparent !important;
  font-size:var(--ebk-font-menu-section);
  line-height:1.15;
  font-weight:800;
  font-variant-caps:all-small-caps;
  text-transform:uppercase;
  letter-spacing:.07em;
}

/* Mein Weg am EBK */
.container-header .ebk-sidenav__body .mod-menu a.ebk-menu-highlight,
.container-header .ebk-sidenav__body .mod-menu a.ebk-menu-highlight:visited {
  color:var(--ebk-green) !important;
  font-weight:800;
}

/* Home: Link-CSS-Klasse = ebk-icon-home */
.ebk-icon-home::before {
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3 2 11h3v10h6v-6h2v6h6V11h3L12 3Zm5 16h-2v-6H9v6H7v-9l5-4 5 4v9Z'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3 2 11h3v10h6v-6h2v6h6V11h3L12 3Zm5 16h-2v-6H9v6H7v-9l5-4 5 4v9Z'/%3E%3C/svg%3E");
}
.container-header .ebk-sidenav__body .mod-menu a.ebk-icon-home {
  margin-bottom:.65rem;
  font-weight:700;
}



/* ==========================================================
   V1.0.7 – MENÜ TYPOGRAFIE / HOME / ABSTÄNDE
   ========================================================== */

/* Elegantere, ruhigere Menütypografie */
.ebk-sidenav,
.ebk-sidenav button,
.ebk-sidenav a,
.ebk-sidenav span {
  font-family: "Segoe UI", "Helvetica Neue", Arial, sans-serif;
}

.ebk-sidenav__title {
  color: var(--ebk-green);
  font-size: 1.02rem;
  font-weight: 700;
  letter-spacing: -.015em;
}

/* Normale Menüeinträge */
.container-header .ebk-sidenav__body .mod-menu li > a,
.container-header .ebk-sidenav__body .mod-menu li > a:link,
.container-header .ebk-sidenav__body .mod-menu li > a:visited {
  color: #4b5563 !important;
  font-size: .875rem;
  line-height: 1.3;
  font-weight: 600;
  letter-spacing: -.005em;
}

/* Nur echter Hover wird grün */
.container-header .ebk-sidenav__body .mod-menu li > a:hover,
.container-header .ebk-sidenav__body .mod-menu li > a:focus-visible {
  color: var(--ebk-green) !important;
}

/* Aktiver Menüpunkt NICHT mehr automatisch grün */
.container-header .ebk-sidenav__body .mod-menu li.active > a,
.container-header .ebk-sidenav__body .mod-menu li.current > a,
.container-header .ebk-sidenav__body .mod-menu li.default > a,
.container-header .ebk-sidenav__body .mod-menu li > a[aria-current="page"] {
  color: #4b5563 !important;
}

/* Mein Weg bleibt die bewusste grüne Ausnahme */
.container-header .ebk-sidenav__body .mod-menu a.ebk-menu-highlight,
.container-header .ebk-sidenav__body .mod-menu a.ebk-menu-highlight:visited {
  color: var(--ebk-green) !important;
}

/* HOME: dunkelgrau und eigener Block mit Luft nach unten */
.container-header .ebk-sidenav__body .mod-menu li > a.ebk-icon-home,
.container-header .ebk-sidenav__body .mod-menu li > a.ebk-icon-home:link,
.container-header .ebk-sidenav__body .mod-menu li > a.ebk-icon-home:visited,
.container-header .ebk-sidenav__body .mod-menu li.active > a.ebk-icon-home,
.container-header .ebk-sidenav__body .mod-menu li.current > a.ebk-icon-home,
.container-header .ebk-sidenav__body .mod-menu li.default > a.ebk-icon-home,
.container-header .ebk-sidenav__body .mod-menu li > a.ebk-icon-home[aria-current="page"] {
  color: #4b5563 !important;
  margin: 0 0 1.35rem;
  padding: .45rem .15rem;
  font-weight: 600;
}

.container-header .ebk-sidenav__body .mod-menu li > a.ebk-icon-home:hover,
.container-header .ebk-sidenav__body .mod-menu li > a.ebk-icon-home:focus-visible {
  color: var(--ebk-green) !important;
}

/* Home-Icon ebenfalls grau; nur beim Hover grün */
.container-header .ebk-sidenav__body .mod-menu a.ebk-icon-home::before {
  background-color: #94a3b8 !important;
}
.container-header .ebk-sidenav__body .mod-menu a.ebk-icon-home:hover::before,
.container-header .ebk-sidenav__body .mod-menu a.ebk-icon-home:focus-visible::before {
  background-color: var(--ebk-green) !important;
}

/* Kapitelüberschriften sauber auf eigener Zeile */
.container-header .ebk-sidenav__body .mod-menu li.ebk-menu-section,
.container-header .ebk-sidenav__body .mod-menu li:has(> .nav-header) {
  clear: both;
  width: 100%;
  margin: 0;
}

.container-header .ebk-sidenav__body .mod-menu li.ebk-menu-section > a,
.container-header .ebk-sidenav__body .mod-menu li.ebk-menu-section > span,
.container-header .ebk-sidenav__body .mod-menu .nav-header {
  margin: 1.35rem 0 .55rem !important;
  color: #9ca3af !important;
  font-size: .69rem;
  line-height: 1.2;
  font-weight: 700;
  font-variant-caps: all-small-caps;
  text-transform: uppercase;
  letter-spacing: .095em;
}

/* Falls die erste Kapitelüberschrift direkt auf Home folgt */
.container-header .ebk-sidenav__body .mod-menu li:has(> a.ebk-icon-home) + li.ebk-menu-section,
.container-header .ebk-sidenav__body .mod-menu li:has(> a.ebk-icon-home) + li:has(> .nav-header) {
  margin-top: .25rem;
}

/* etwas feinere vertikale Abstände */
.container-header .ebk-sidenav__body .mod-menu li:not(.ebk-menu-section) > a {
  padding-top: .42rem;
  padding-bottom: .42rem;
}



/* ==========================================================
   V1.0.8 – BOXEN FLEXIBLER / 2ER- UND 3ER-RASTER
   ========================================================== */

/* Grüne Hinweisbox:
   nicht mehr auf die schmale Textbreite zentriert,
   sondern linksbündig und breiter im verfügbaren Inhaltsbereich */
.ebk-hinweisbox {
  width: 100%;
  max-width: var(--ebk-page-width);
  margin-left: 0;
  margin-right: 0;
}

/* Optional weiterhin eine schmale, zentrierte Variante */
.ebk-hinweisbox--schmal {
  max-width: var(--ebk-content-width);
  margin-left: auto;
  margin-right: auto;
}

/* Weiße Boxen:
   nutzen jetzt flexibel die verfügbare Breite */
.ebk-boxen {
  width: 100%;
  max-width: none;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.5rem;
}

/* Optional: etwas schmaler und zentriert */
.ebk-boxen--schmal {
  max-width: var(--ebk-content-width);
  margin-left: auto;
  margin-right: auto;
}

/* Drei Boxen nebeneinander */
.ebk-boxen--3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

/* Flexible Kartenbreite */
.ebk-box {
  min-width: 0;
  width: 100%;
}

/* Bei mittleren Bildschirmen werden 3 Boxen zu 2 + 1 */
@media (max-width: 991.98px) {
  .ebk-boxen--3 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Auf kleinen Bildschirmen alles untereinander */
@media (max-width: 767.98px) {
  .ebk-boxen,
  .ebk-boxen--3 {
    grid-template-columns: 1fr;
  }

  .ebk-hinweisbox {
    max-width: 100%;
  }
}



/* ==========================================================
   V1.0.9 – BILDUNGSWEGE-KARTEN
   Große Angebotskarten wie in "Unsere Bildungswege"
   ========================================================== */

/* Raster: standardmäßig zwei große Karten nebeneinander */
.ebk-bildungswege {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  gap: 1.5rem;
  width: 100%;
  margin: 0 auto 2rem;
}

/* Einzelne große Bildungsgang-Karte */
.ebk-bildungsweg {
  min-width: 0;
  height: 100%;
  padding: 1.15rem 1.25rem 1.35rem;
  border: 1px solid #dfe4ea;
  border-radius: .65rem;
  background: #fff;
  box-shadow: 0 2px 5px rgb(15 23 42 / 9%);
  color: #475569;
}

/* Kopf: Buchstaben-Kachel + Titel */
.ebk-bildungsweg__kopf {
  display: grid;
  grid-template-columns: 2.4rem minmax(0, 1fr);
  align-items: center;
  gap: .9rem;
  margin-bottom: 1rem;
}

.ebk-bildungsweg__kennung {
  display: grid;
  place-items: center;
  width: 2.4rem;
  height: 2.4rem;
  border-radius: .45rem;
  background: #ecfdf5;
  color: #059669;
  font-size: 1rem;
  font-weight: 800;
  line-height: 1;
}

.ebk-bildungsweg__kennung--gruen {
  background: var(--ebk-green);
  color: #fff;
}

.ebk-bildungsweg__titel {
  margin: 0;
  color: #1f2937;
  font-size: 1rem;
  line-height: 1.25;
  font-weight: 800;
}

.ebk-bildungsweg__untertitel {
  display: block;
  margin-top: .1rem;
  color: #94a3b8;
  font-size: .68rem;
  line-height: 1.25;
  font-weight: 700;
  letter-spacing: .035em;
  text-transform: uppercase;
}

/* Einleitung */
.ebk-bildungsweg__text {
  margin: 0 0 1rem;
  color: #475569;
  font-size: .82rem;
  line-height: 1.55;
}

/* Trennlinie */
.ebk-bildungsweg__trenner {
  height: 1px;
  margin: 0 0 1rem;
  border: 0;
  background: #eef2f6;
}

/* Unterbereiche innerhalb der Karte */
.ebk-bildungsweg__spalten {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.5rem;
}

.ebk-bildungsweg__bereich h3,
.ebk-bildungsweg__bereich h4 {
  margin: 0 0 .45rem;
  color: #94a3b8;
  font-size: .67rem;
  line-height: 1.25;
  font-weight: 800;
  letter-spacing: .045em;
  text-transform: uppercase;
}

/* Listen ohne Standard-Aufzählungszeichen */
.ebk-bildungsweg__liste {
  margin: 0;
  padding: 0;
  list-style: none;
}

.ebk-bildungsweg__liste li {
  position: relative;
  margin: 0 0 .38rem;
  padding-left: 1rem;
  color: #475569;
  font-size: .8rem;
  line-height: 1.35;
}

/* grüner Haken */
.ebk-bildungsweg__liste li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--ebk-green);
  font-weight: 800;
}

/* Ganze Karte optional klickbar */
a.ebk-bildungsweg {
  display: block;
  color: inherit;
  text-decoration: none !important;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

a.ebk-bildungsweg:hover,
a.ebk-bildungsweg:focus-visible {
  transform: translateY(-2px);
  border-color: rgb(115 182 26 / 55%);
  box-shadow: 0 6px 16px rgb(15 23 42 / 12%);
}

/* Responsive */
@media (max-width: 900px) {
  .ebk-bildungswege {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 520px) {
  .ebk-bildungsweg {
    padding: 1rem;
  }

  .ebk-bildungsweg__spalten {
    grid-template-columns: 1fr;
    gap: 1rem;
  }
}

/* ==========================================================
   V1.0.10 – MENÜ KOMPAKTER / ÜBERSCHRIFTEN GRÖSSER
   ========================================================== */
.ebk-sidenav__body { padding-top:.55rem; padding-bottom:1.15rem; }

.container-header .ebk-sidenav__body .mod-menu li > a.ebk-icon-home,
.container-header .ebk-sidenav__body .mod-menu li > a.ebk-icon-home:link,
.container-header .ebk-sidenav__body .mod-menu li > a.ebk-icon-home:visited {
  margin-bottom:.45rem; padding-top:.30rem; padding-bottom:.30rem;
}

/* Kapitelüberschriften */
.container-header .ebk-sidenav__body .mod-menu li.ebk-menu-section > a,
.container-header .ebk-sidenav__body .mod-menu li.ebk-menu-section > span,
.container-header .ebk-sidenav__body .mod-menu .nav-header {
  margin-top:.70rem !important;
  margin-bottom:.28rem !important;
  font-size:.78rem;
  line-height:1.15;
  font-weight:800;
  letter-spacing:.075em;
}

/* Menüeinträge enger */
.container-header .ebk-sidenav__body .mod-menu li:not(.ebk-menu-section) > a {
  min-height:1.9rem;
  padding-top:.27rem;
  padding-bottom:.27rem;
  font-size:.875rem;
  line-height:1.18;
}

/* Icons */
.ebk-sidenav__body .mod-menu a[class*="ebk-icon-"]::before {
  width:.95rem; height:.95rem; flex-basis:.95rem; margin-top:.06rem;
}

/* Abstand zwischen Kapiteln */
.container-header .ebk-sidenav__body .mod-menu li.ebk-menu-section:not(:first-child) {
  margin-top:.30rem;
}

/* KI-Unterzeile */
.ebk-sidenav__body a[data-ebk-subtitle]::after {
  margin-top:-.10rem;
  font-size:.60rem;
}

/* ==========================================================
   V1.0.11 – LUFTIGERE ÜBERSCHRIFTEN
   Höhere, offenere Schriftwirkung
   ========================================================== */

/* Überschriften: schmalere/vertikalere Systemschrift statt Arial */
h1, h2, h3,
.ebk-sidenav__title,
.ebk-box h2, .ebk-box h3,
.ebk-bildungsweg__titel {
  font-family: "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  font-stretch: normal;
  letter-spacing: .005em;
}

/* Hauptüberschriften weniger gedrungen */
h1 {
  line-height: 1.22;
  font-weight: 700;
}
h2 {
  line-height: 1.28;
  font-weight: 700;
}
h3 {
  line-height: 1.32;
  font-weight: 700;
}

/* Menü-Kapitel: größer, höhere Zeile, weniger schwere Laufweite */
.container-header .ebk-sidenav__body .mod-menu li.ebk-menu-section > a,
.container-header .ebk-sidenav__body .mod-menu li.ebk-menu-section > span,
.container-header .ebk-sidenav__body .mod-menu .nav-header {
  font-family: "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  font-size: .82rem;
  line-height: 1.35;
  font-weight: 700;
  letter-spacing: .065em;
}

/* Bildungswege- und Kartenüberschriften */
.ebk-box h2,
.ebk-box h3,
.ebk-bildungsweg__titel {
  line-height: 1.35;
  font-weight: 700;
}



/* ==========================================================
   V1.0.12 – EINHEITLICHE EBK-TYPOGRAFIE + LINKS
   ========================================================== */

/* Zentrale Typografie-Variablen */
:root {
  --ebk-font-body: "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  --ebk-font-heading: "Segoe UI", "Helvetica Neue", Arial, sans-serif;

  --ebk-weight-normal: 400;
  --ebk-weight-medium: 500;
  --ebk-weight-semibold: 600;
  --ebk-weight-bold: 700;

  --ebk-line-body: 1.6;
  --ebk-line-heading: 1.25;

  --ebk-letter-heading: .002em;
  --ebk-letter-caps: .07em;
}

/* Grundschrift */
html,
body {
  font-family: var(--ebk-font-body);
}

body {
  font-size: var(--ebk-font-text);
  line-height: var(--ebk-line-body);
  font-weight: var(--ebk-weight-normal);
  color: var(--ebk-text);
}

/* Fließtext */
p,
li,
td,
th,
input,
textarea,
select,
button {
  font-family: var(--ebk-font-body);
}

/* Hauptüberschriften */
h1,
h2,
h3,
h4,
h5,
h6,
.ebk-box h2,
.ebk-box h3,
.ebk-bildungsweg__titel,
.ebk-sidenav__title {
  font-family: var(--ebk-font-heading);
  color: #1f2937;
  font-weight: var(--ebk-weight-bold);
  letter-spacing: var(--ebk-letter-heading);
}

h1 {
  font-size: var(--ebk-font-h1);
  line-height: 1.18;
  margin-bottom: .8rem;
}

h2 {
  font-size: var(--ebk-font-h2);
  line-height: 1.24;
  margin-bottom: .7rem;
}

h3 {
  font-size: var(--ebk-font-h3);
  line-height: 1.3;
  margin-bottom: .55rem;
}

h4,
h5,
h6 {
  line-height: 1.35;
}

/* EBK-Farbüberschriften in Bausteinen */
.ebk-box h2,
.ebk-box h3,
.ebk-bildungsweg__titel {
  font-weight: var(--ebk-weight-bold);
}

.ebk-box h2,
.ebk-box h3 {
  color: var(--ebk-blue);
}

/* Kleine Kapitel-/Kapitälchen-Überschriften */
.container-header .ebk-sidenav__body .mod-menu li.ebk-menu-section > a,
.container-header .ebk-sidenav__body .mod-menu li.ebk-menu-section > span,
.container-header .ebk-sidenav__body .mod-menu .nav-header,
.ebk-bildungsweg__untertitel,
.ebk-bildungsweg__bereich h3,
.ebk-bildungsweg__bereich h4 {
  font-family: var(--ebk-font-heading);
  font-weight: var(--ebk-weight-bold);
  letter-spacing: var(--ebk-letter-caps);
}

/* Menütexte */
.ebk-sidenav,
.ebk-sidenav a,
.ebk-sidenav button,
.ebk-sidenav span {
  font-family: var(--ebk-font-body);
}

.container-header .ebk-sidenav__body .mod-menu li > a {
  font-weight: var(--ebk-weight-semibold);
  line-height: 1.28;
}

/* ==========================================================
   LINKS – KEINE UNTERSTREICHUNG
   ========================================================== */

a,
a:link,
a:visited {
  text-decoration: none !important;
}

/* Links bleiben über Farbe/Hover erkennbar */
a:hover,
a:focus-visible {
  text-decoration: none !important;
}

/* Artikel-Links: EBK-Blau, beim Hover EBK-Grün */
main a:not(.btn):not(.ebk-button):not(.ebk-bildungsweg),
.com-content-article a:not(.btn):not(.ebk-button):not(.ebk-bildungsweg) {
  color: var(--ebk-blue);
}

main a:not(.btn):not(.ebk-button):not(.ebk-bildungsweg):hover,
main a:not(.btn):not(.ebk-button):not(.ebk-bildungsweg):focus-visible,
.com-content-article a:not(.btn):not(.ebk-button):not(.ebk-bildungsweg):hover,
.com-content-article a:not(.btn):not(.ebk-button):not(.ebk-bildungsweg):focus-visible {
  color: var(--ebk-green);
}

/* Tastaturfokus sichtbar halten */
a:focus-visible,
button:focus-visible {
  outline: 2px solid var(--ebk-green);
  outline-offset: 3px;
}


/* ==========================================================
   V1.0.13 – HINWEISBOX SEITENABSTAND
   ========================================================== */

/* Grüne Hinweisbox: 20 px Abstand links und rechts */
.ebk-hinweisbox {
  width: calc(100% - 40px);
  max-width: none;
  margin-left: 20px;
  margin-right: 20px;
  box-sizing: border-box;
}

@media (max-width: 479.98px) {
  .ebk-hinweisbox {
    width: calc(100% - 40px);
    margin-left: 20px;
    margin-right: 20px;
  }
}

/* ==========================================================
   V1.0.14 – EBK-KONTAKTMODUL
   Bild links / Ansprechpartner + Foto rechts
   ========================================================== */
.ebk-kontaktmodul{display:flex;align-items:center;justify-content:space-between;gap:2rem;width:100%}
.ebk-kontaktmodul__bild-links{flex:0 1 auto;margin-right:auto;text-align:left}
.ebk-kontaktmodul__bild-links img{display:block;width:auto;height:auto;max-width:250px;max-height:120px;object-fit:contain}
.ebk-kontaktmodul__kontakt{display:flex;align-items:center;justify-content:flex-end;gap:1rem;flex:0 0 auto;margin-left:auto}
.ebk-kontaktmodul__daten{text-align:right}
.ebk-kontaktmodul__label{margin-bottom:.25rem;color:#94a3b8;font-size:.75rem;line-height:1.2;font-weight:700;letter-spacing:.07em;text-transform:uppercase}
.ebk-kontaktmodul__name{margin-bottom:.15rem;color:#374151;font-size:1rem;line-height:1.3;font-weight:700}
.ebk-kontaktmodul__mail{color:var(--ebk-blue)!important;font-size:.875rem;line-height:1.3;text-decoration:none!important}
.ebk-kontaktmodul__mail:hover,.ebk-kontaktmodul__mail:focus-visible{color:var(--ebk-green)!important}
.ebk-kontaktmodul__person{flex:0 0 auto}
.ebk-kontaktmodul__person img{display:block;width:80px;height:80px;object-fit:cover;border-radius:50%}
@media(max-width:767.98px){
 .ebk-kontaktmodul{gap:1rem}
 .ebk-kontaktmodul__bild-links img{max-width:130px;max-height:90px}
 .ebk-kontaktmodul__kontakt{gap:.75rem}
 .ebk-kontaktmodul__person img{width:65px;height:65px}
}
@media(max-width:479.98px){
 .ebk-kontaktmodul{flex-direction:column;align-items:stretch}
 .ebk-kontaktmodul__bild-links{margin-right:0}
 .ebk-kontaktmodul__kontakt{width:100%;margin-left:0}
}


/* ==========================================================
   V1.0.15 – KONTAKTFOTO RECHTECKIG
   ========================================================== */

/* Personenfoto: rechteckig mit leicht abgerundeten Ecken */
.ebk-kontaktmodul__person img {
  width: 110px;
  height: 90px;
  object-fit: cover;
  border-radius: 6px;
}

@media (max-width: 767.98px) {
  .ebk-kontaktmodul__person img {
    width: 95px;
    height: 78px;
    border-radius: 6px;
  }
}


/* ==========================================================
   V1.0.16 – KONTAKTFOTO 150 x 188 PX
   ========================================================== */

.ebk-kontaktmodul__person img {
  width: 150px;
  height: 188px;
  object-fit: cover;
  border-radius: 6px;
}

/* Auch auf Tablet/Smartphone in gewünschter Bildgröße */
@media (max-width: 767.98px) {
  .ebk-kontaktmodul__person img {
    width: 150px;
    height: 188px;
    border-radius: 6px;
  }
}


/* ==========================================================
   V1.0.17 – KONTAKTBOX
   Personenfoto links / Kontaktdaten rechts
   Gleiches Design wie EBK-Kontaktmodul
   ========================================================== */

.ebk-kontaktbox {
  display: flex;
  align-items: center;
  gap: 1.25rem;
  width: 100%;
}

.ebk-kontaktbox__person {
  flex: 0 0 auto;
}

.ebk-kontaktbox__person img {
  display: block;
  width: 150px;
  height: 188px;
  object-fit: cover;
  border-radius: 6px;
}

.ebk-kontaktbox__daten {
  text-align: left;
}

.ebk-kontaktbox__label {
  margin-bottom: .25rem;
  color: #94a3b8;
  font-size: .75rem;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.ebk-kontaktbox__name {
  margin-bottom: .15rem;
  color: #374151;
  font-size: 1rem;
  line-height: 1.3;
  font-weight: 700;
}

.ebk-kontaktbox__mail {
  color: var(--ebk-blue) !important;
  font-size: .875rem;
  line-height: 1.3;
  text-decoration: none !important;
}

.ebk-kontaktbox__mail:hover,
.ebk-kontaktbox__mail:focus-visible {
  color: var(--ebk-green) !important;
}

@media (max-width: 479.98px) {
  .ebk-kontaktbox {
    gap: 1rem;
  }

  .ebk-kontaktbox__person img {
    width: 120px;
    height: 150px;
  }
}