/* Plus Jakarta Sans – lokal ausgeliefert, keine Verbindung zu Google.
   Erzeugt von build/fonts.mjs, Lizenz: SIL Open Font License 1.1 */
@font-face {
 
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url('/assets/fonts/plus-jakarta-sans-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
  }
@font-face {
 
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url('/assets/fonts/plus-jakarta-sans-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  }

/* ---- aus style-hover / style-focus des Entwurfs erzeugt ---- */
.h1:hover, .h1:focus-visible{color:#fff;text-decoration:underline;}
.h2:hover, .h2:focus-visible{color:var(--red);}
.h3:hover, .h3:focus-visible{background:var(--red-dark);color:#fff;}
.h4:hover, .h4:focus-visible{background:var(--gray-light);color:var(--navy);}
.h5:hover, .h5:focus-visible{color:#fff;}
.h6:hover, .h6:focus-visible{border-color:#fff;background:rgba(255,255,255,.08);color:#fff;}
.h7:hover, .h7:focus-visible{border-color:#fff;background:rgba(255,255,255,.1);color:#fff;}
.h8:hover, .h8:focus-visible{border-color:var(--red);color:var(--red);}
.h9:focus{border-color:var(--navy);outline:none;}
.ha:hover, .ha:focus-visible{background:var(--red-dark);}

/* ---- Navigation: welche Fassung erscheint, entscheidet die Breite ---- */
/* Das hidden-Attribut allein reicht nicht: der Entwurf setzt display:flex
   direkt am Element, und ein Inline-Stil schlägt die Regel des Browsers. */
.nav-mobil[hidden] { display: none !important; }
@media (max-width: 1080px) {
  .nur-breit { display: none !important; }
  .nav-desktop { display: none !important; }
}
@media (min-width: 1081px) {
  .nav-knopf { display: none !important; }
  .nav-mobil { display: none !important; }
}

/* ---- Sprungmarke: unsichtbar, bis sie den Fokus bekommt ---- */
.sprungmarke {
  position: absolute; left: -9999px; top: 0; z-index: 500;
  background: var(--navy); color: #fff; font-weight: 700;
  padding: 12px 20px; border-radius: 0 0 10px 0;
}
.sprungmarke:focus { left: 0; }

/* ---- Einwilligungsbanner ---- */
#cookie-banner {
  position: fixed; inset: auto 0 0 0; z-index: 450;
  padding: 16px; display: flex; justify-content: center;
}
#cookie-banner[hidden] { display: none; }
.cookie-karte {
  max-width: 560px; background: #fff; color: var(--navy);
  border: 1px solid var(--line); border-radius: 16px;
  box-shadow: 0 18px 50px rgba(36,49,74,.22); padding: 24px;
}
.cookie-karte h2 { font-size: 21px; }
.cookie-karte p { margin-top: 12px; font-size: 16px; line-height: 1.65; color: var(--gray); }
.cookie-knoepfe { margin-top: 20px; display: flex; flex-wrap: wrap; gap: 12px; }
.cookie-knoepfe button {
  flex: 1 1 160px; min-height: 46px; border-radius: 10px;
  font-weight: 700; font-size: 16px; cursor: pointer; padding: 13px 22px;
}
.cookie-ja { background: var(--red); color: #fff; border: 1.5px solid var(--red); }
.cookie-ja:hover { background: var(--red-dark); border-color: var(--red-dark); }
.cookie-nein { background: #fff; color: var(--navy); border: 1.5px solid var(--navy); }
.cookie-nein:hover { background: var(--gray-light); }
.cookie-fuss { font-size: 14px; }