/* ══════════════════════════════════════════════════════════════
   lhb-base.css – Landesheimatbund Sachsen-Anhalt e. V.
   Globales CSS für alle Seiten. Seitenspezifisches CSS gehört
   NICHT hierher, sondern in den <style>-Block der jeweiligen
   HTML-Datei.
   ══════════════════════════════════════════════════════════════ */


/* ── RESET + VARIABLEN ── */
*{ box-sizing: border-box; margin: 0; padding: 0; }

/* Zentrale Variablen: components/lhb-design-tokens.css */

html{ scroll-behavior: smooth; }

body{
  font-family: var(--lhb-font-body);
  color: var(--schwarz);
  background: var(--weiss);
  max-width: 1440px;
  margin: 0 auto;
  overflow-x: hidden;
  padding-top: 136px;
  border-left: var(--linie) solid var(--lhb-line-color);
  border-right: var(--linie) solid var(--lhb-line-color);
}

a{ text-decoration: none; color: inherit; }

/* v356: Tastaturnutzende koennen die wiederkehrende Navigation ueberspringen. */
.lhb-skip-link{
  position: fixed;
  top: 10px;
  left: max(12px, calc((100vw - min(100vw, 1440px)) / 2 + 12px));
  z-index: 12000;
  padding: 11px 15px;
  border: var(--lhb-line-width-medium) solid var(--lhb-line-color);
  background: var(--lhb-color-paper);
  color: var(--lhb-color-ink);
  font: 800 12px/1.2 var(--lhb-font-display);
  letter-spacing: .06em;
  text-transform: uppercase;
  transform: translateY(-180%);
  transition: transform .12s ease;
}
.lhb-skip-link:focus,
.lhb-skip-link:focus-visible{ transform: translateY(0); }

/* v356.1: Nach Aktivierung des Skip-Links wird der erste Haupttitel als
   wahrnehmbares Fokusziel markiert. Der Fokus ist nur bei der Tastaturnutzung
   sichtbar und veraendert das normale Seitenlayout nicht. */
.lhb-skip-focus-target{ scroll-margin-top:calc(var(--lhb-active-header-height, 136px) + 12px); }
.lhb-skip-focus-target:focus{
  outline:var(--lhb-focus-width) solid var(--lhb-focus-color);
  outline-offset:6px;
}

/* Mobile Breitenarchitektur: einheitliche Viewport-Breite fuer Header,
   Hauptbereich und Footer; verhindert seitliches Panning durch ueberbreite
   Grid-/Bild-/Header-Elemente. */
html,body{
  width: 100%;
}
img,svg,video,canvas{
  max-width: 100%;
}

/* ── FOKUS-SICHTBARKEIT (WCAG 2.4.7) ── */
:focus-visible{
  outline: var(--lhb-focus-width) solid var(--lhb-focus-color);
  outline-offset: var(--lhb-focus-offset);
}

/* v356: Bewegungsreduktion respektiert die Betriebssystempraeferenz global. */
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior: auto; }
  *,*::before,*::after{
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}


/* ══════════════════════════════
   STICKY HEADER
   ══════════════════════════════ */
:root{ --lhb-active-header-height:136px; }

.sr-only{
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0);
  white-space: nowrap; border: 0;
}

.hd{
  position: fixed;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  max-width: 1440px;
  z-index: 1001;
  background: var(--weiss);
  border-bottom: var(--linie) solid var(--lhb-line-color);
  border-left: var(--linie) solid var(--lhb-line-color);
  border-right: var(--linie) solid var(--lhb-line-color);
  display: grid;
  grid-template-columns: minmax(360px, 32%) minmax(0, 1fr) auto;
  align-items: stretch;
  height: 136px;
  overflow: visible;
}

.hd-left{
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 0 28px;
  border-right: var(--linie) solid var(--lhb-line-color);
  grid-row: 1 / span 2;
}

.hd-left a{
  width: 100%;
  height: 100%;
}

.hd-left svg{
  height: clamp(78px, 7vw, 96px) !important;
  width: auto;
  max-width: 100%;
}

.hd-right{
  display: grid;
  grid-template-rows: 67px 66px;
  min-width: 0;
}

.hd-nav{
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  align-items: stretch;
  min-width: 0;
  overflow: hidden;
}

.hd-nav-primary{
  justify-content: stretch;
  padding: 0 18px;
  border-bottom: var(--lhb-line-width-medium) solid var(--lhb-line-color);
}

.hd-nav-secondary{
  justify-content: stretch;
  padding: 0 18px;
  background: var(--weiss);
}

.hd-nav a{
  font-family: var(--lhb-font-display);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.035em;
  text-transform: uppercase;
  color: var(--schwarz);
  padding: 0 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  border-bottom: var(--linie) solid transparent;
  margin-bottom: calc(-1 * var(--linie));
  white-space: normal;
  line-height: 1.15;
}

.hd-nav-secondary a{
  justify-content: center;
  text-align: center;
  font-size: 11px;
  letter-spacing: 0.035em;
  line-height: 1.15;
  color: var(--schwarz);
  white-space: normal;
  hyphens: none;
}

.hd-nav a.on{ color: var(--lila); }
.hd-nav a:hover{ color: var(--schwarz); }
.hd-nav-secondary a:hover{ color: var(--lila); }

.hd-burger{
  display: none;
  align-items: center;
  justify-content: center;
  width: 72px;
  height: 136px;
  border: none;
  background: none;
  cursor: pointer;
  border-left: var(--linie) solid var(--lhb-line-color);
  flex-direction: column;
  gap: 5px;
  padding: 0;
  grid-row: 1 / span 2;
}

.hd-burger span{
  display: block;
  width: 22px;
  height: 2.5px;
  background: var(--schwarz);
}


@media (max-width: 1240px) {
  .hd{ grid-template-columns: minmax(300px, 29%) minmax(0, 1fr) auto; }
  .hd-left{ padding: 0 22px; }
  .hd-left svg{ height: clamp(70px, 7vw, 88px) !important; }
  .hd-nav-primary,.hd-nav-secondary{ padding-left: 14px; padding-right: 14px; }
  .hd-nav a{ font-size: var(--lhb-type-ui-size); padding: 0 7px; letter-spacing: 0.025em; }
  .hd-nav-secondary a{ font-size: var(--lhb-type-ui-size); line-height: 1.12; }
}

/* v204: Der Desktop-Header verteilt seine Spalten relativ zur auf 1440 px
   begrenzten Headerbreite, nicht relativ zur Viewportbreite. Dadurch bleibt die
   Navigation auch auf sehr breiten Monitoren unverzerrt. */

/* ══════════════════════════════
   VOLLBILD-OVERLAY
   ══════════════════════════════ */
.overlay{
  display: none;
  position: fixed;
  inset: 0;
  z-index: 1002;
  background: var(--lila);
  flex-direction: column;
  justify-content: flex-start;
  padding: 64px 32px 40px;
  overflow-y: auto;
}

.overlay.open{ display: flex; }

.overlay-close{
  position: absolute;
  top: 20px;
  right: 24px;
  background: none;
  border: none;
  font-family: var(--lhb-font-display);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--weiss);
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 8px;
}

.overlay-kicker{
  width: min(900px, 100%);
  margin: 28px auto 8px;
  font-family: var(--lhb-font-display);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--lhb-overlay-light-65);
}

.overlay-nav a{
  display: block;
  font-family: var(--lhb-font-display);
  font-size: clamp(24px, 5.6vw, 40px);
  font-weight: 800;
  letter-spacing: .002em;
  text-transform: uppercase;
  color: var(--weiss);
  line-height: 1.2;
  padding: 7px 0;
  border-bottom: var(--lhb-line-width-thin) solid var(--lhb-overlay-light-20);
}

.overlay-nav a:last-child{ border-bottom: none; }
.overlay-nav a.on{ color: var(--weiss); }
.overlay-nav a em{ font-style: italic; color: var(--weiss); opacity: 1; }

.overlay-nav-secondary a{
  font-size: clamp(20px, 4.2vw, 30px);
  line-height: 1.1;
  color: var(--lhb-overlay-light-92);
}

.overlay-footer{
  margin-top: 32px;
  font-family: var(--lhb-font-body);
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0.08em;
  color: var(--lhb-color-paper);
}

@media (max-width: 700px) {
  .overlay{ padding: 56px 22px 32px; }
  .overlay-kicker{ margin-top: 22px; }
  .overlay-nav a{ font-size: clamp(24px, 8.5vw, 36px); line-height: 1.08; padding: 7px 0; }
  .overlay-nav-secondary a{ font-size: clamp(20px, 7vw, 30px); line-height: 1.08; }
}


/* ══════════════════════════════
   BLOCK-LABEL (Abschnittsbezeichnung)
   ══════════════════════════════ */
.block-label{
  padding: 18px 28px;
  background: var(--weiss);
  border-top: var(--linie) solid var(--lhb-line-color);
  border-bottom: var(--linie) solid var(--lhb-line-color);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}


/* v348: semantische Abschnittsheader erhalten auf Desktop/Tablet mehr vertikale Luft.
   Funktionale/UI-nahe block-label-Varianten (Journal, Podcast, Detailseiten) bleiben kompakt. */
.block-label--section{
  padding-block: 24px !important;
}
@media (min-width:761px) and (max-width:1100px){
  .block-label--section{ padding-block: 22px !important; }
}
@media (max-width:760px){
  .block-label--section{ padding-block:18px !important; }
}


.block-label-text{
  font-family: var(--lhb-font-display);
  font-size: clamp(18px, 2.2vw, 30px);
  line-height: 1.05;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
  color: var(--schwarz);
}

.block-label-link{
  font-family: var(--lhb-font-display);
  font-size: var(--lhb-type-ui-size);
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--lila);
  display: flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}

.block-label-link:hover{ color: var(--schwarz); }

/* Variante: Zurück-Link im block-label (Vereinsprofil) */
.block-label-back{
  font-family: var(--lhb-font-display);
  font-size: var(--lhb-type-ui-size);
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--lhb-overlay-light-60);
  display: flex;
  align-items: center;
  gap: 4px;
}

.block-label-back:hover{ color: var(--weiss); }

/* Variante: Zähler rechts im block-label */
.block-label-count{
  font-family: var(--lhb-font-body);
  font-size: var(--lhb-type-meta-size);
  font-weight: 400;
  color: var(--lhb-overlay-light-50);
}


/* ══════════════════════════════
   GLOBALE BILDNACHWEISE
   Copyrightangaben erscheinen auf Bildern als kleines ©-Symbol.
   Der vollständige Rechtehinweis wird nur auf Hover/Fokus eingeblendet.
   ══════════════════════════════ */
.lhb-img-wrap{
  position: relative;
  display: inline-block;
  max-width: 100%;
  vertical-align: top;
  container-type: inline-size;
}

.lhb-img-wrap > img{
  display: block;
}

.img-credit{
  position: absolute;
  right: 4px;
  bottom: 4px;
  z-index: 8;
}

.img-credit-btn{
  padding: 0;
  border: none;
  background: transparent;
  color: var(--lhb-overlay-light-88);
  font-family: var(--lhb-font-body);
  font-size: var(--lhb-type-credit-size);
  font-weight: 400;
  font-style: normal;
  line-height: 1;
  letter-spacing: 0;
  cursor: pointer;
  user-select: none;
  appearance: none;
  text-shadow: 0 0 1px rgba(0,0,0,0.75), 0 1px 2px rgba(0,0,0,0.75);
  opacity: 0.86;
}

@supports (font-size: 1cqw) {
  .img-credit{
    right: clamp(3px, 0.7cqw, 7px);
    bottom: clamp(3px, 0.7cqw, 7px);
  }

  .img-credit-btn{
    font-size: clamp(7px, 1cqw, 10px);
  }
}

.img-credit-btn:hover,.img-credit:focus-within .img-credit-btn{
  opacity: 1;
}

.img-credit-overlay{
  display: none;
  position: absolute;
  right: 0;
  bottom: 18px;
  min-width: 180px;
  max-width: min(72vw, 320px);
  padding: 10px 12px;
  background: var(--lhb-overlay-dark-94);
  color: var(--weiss);
  border: var(--lhb-line-width-thin) solid var(--lhb-overlay-light-08);
  border-radius: 4px;
  font-family: var(--lhb-font-body);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.45;
  white-space: normal;
  width: max-content;
  pointer-events: none;
  box-shadow: 0 10px 24px rgba(0,0,0,0.18);
}

.img-credit-overlay::after{
  content: "";
  position: absolute;
  right: 8px;
  bottom: -7px;
  width: 0;
  height: 0;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-top: 7px solid var(--lhb-overlay-dark-94);
}

.img-credit-caption{
  display: block;
  margin-bottom: 8px;
  color: var(--weiss);
}

.img-credit-caption:last-child{
  margin-bottom: 0;
}

.img-credit-meta{
  display: block;
  color: var(--lhb-overlay-light-82);
  font-size: 11px;
}

.img-credit:hover .img-credit-overlay,.img-credit:focus-within .img-credit-overlay{
  display: block;
}


/* ══════════════════════════════
   STORY-COVER (Journal)
   Desktop: Diagonale Lila-Fläche links, Foto rechts.
   Panel-Unterkante (56% × 86% = 48,2%) ist immer breiter als
   die Textbox (46%), damit Text nie ins Bild ragt.
   Mobil: Gestapelt – solider Lila-Block oben, Foto darunter.
   ══════════════════════════════ */
.cover{
  position: relative;
  height: 72vh; min-height: 460px; max-height: 700px;
  overflow: hidden;
  border-bottom: var(--linie) solid var(--lhb-line-color);
}

.cover-img{
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover; object-position: center 35%;
  background: var(--lhb-color-accent-deep);
}

.cover-panel{
  position: absolute; inset: 0;
  background: var(--lila);
  clip-path: polygon(0 0, 100% 0, 86% 100%, 0 100%);
  width: 43%;
}

.cover-text{
  position: absolute; bottom: 0; left: 0;
  width: 38%; padding: 2.5rem 2rem;
}

.cover-kicker{
  font-family: var(--lhb-font-display);
  font-size: 10px; font-weight: 700;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--lhb-overlay-light-50); margin-bottom: 0.75rem;
}

/* Titeladaptiv: 5.5rem (88px) max – trägt Ein-Wort- und Mehrzeiler.
   Bei 4 Zeilen à 88px × 0.88 = 310px + ~130px = 440px < 460px min-height. */
.cover-title{
  font-family: var(--lhb-font-display);
  font-size: clamp(2.8rem, 8vw, 5.5rem);
  font-weight: 800; line-height: 0.88;
  letter-spacing: 0; text-transform: uppercase;
  color: var(--weiss); margin-bottom: 1.25rem;
  word-break: break-word; hyphens: auto; -webkit-hyphens: auto;
  overflow-wrap: break-word;
}

.cover-meta{
  font-family: var(--lhb-font-display);
  font-size: 10px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.1em;
  color: var(--lhb-overlay-light-45);
  border-top: var(--lhb-line-width-thin) solid var(--lhb-overlay-light-20);
  padding-top: 0.75rem;
  display: flex; gap: 1.5rem; flex-wrap: wrap;
}

.cover-cr{
  position: absolute; bottom: 0.6rem; right: 0.75rem;
  font-size: 10px; color: var(--lhb-overlay-light-40); font-style: italic;
}


/* ══════════════════════════════
   FOOTER
   ══════════════════════════════ */
footer{
  border-top: var(--linie) solid var(--lhb-line-color);
}

.ft-top{
  display: grid;
  grid-template-columns: minmax(0, 1.65fr) minmax(300px, 1.15fr) minmax(220px, .8fr);
  border-bottom: var(--lhb-line-width-medium) solid var(--lhb-line-color);
}

.ft-col{
  padding: 28px 24px;
  border-right: var(--lhb-line-width-medium) solid var(--lhb-line-color);
}

.ft-col:last-child{ border-right: none; }

.ft-col-label{
  font-family: var(--lhb-font-display);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--lila);
  margin-bottom: 14px;
}

.ft-logo-zone{
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}

.ft-tagline{
  font-family: var(--lhb-font-display);
  font-size: 13px;
  font-weight: 700;
  font-style: italic;
  color: var(--lila);
  margin-bottom: 12px;
  line-height: 1.2;
}

.ft-col-body{
  font-family: var(--lhb-font-body);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.8;
  color: var(--lhb-neutral-700);
}

.ft-col-body a{ color: var(--lhb-neutral-700); }
.ft-col-body a:hover{ color: var(--lila); }

.ft-links{
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.ft-links a{
  font-family: var(--lhb-font-body);
  font-size: 12px;
  font-weight: 400;
  color: var(--lhb-neutral-700);
  display: flex;
  align-items: center;
  gap: 6px;
}

.ft-links a i{ font-size: 12px; color: var(--lhb-neutral-575); }
.ft-links a:hover{ color: var(--lila); }

.ft-social{
  margin-top: 14px;
  font-family: var(--lhb-font-body);
  font-size: 12px;
  font-weight: 400;
  color: var(--lhb-neutral-700);
}

.ft-social a{ color: var(--lila); }
.ft-social a:hover{ text-decoration: underline; }

.ft-funding{
  margin-top:18px;
  max-width:520px;
}
.ft-funding__text{
  margin:0;
  max-width:430px;
  font-family:var(--lhb-font-body);
  font-size:12px;
  font-weight:400;
  line-height:1.55;
  color:var(--lhb-neutral-700);
}
.ft-funding__logo{
  display:block;
  width:min(430px,100%);
  height:auto;
  margin:0;
  object-fit:contain;
  object-position:left center;
}


.ft-newsletter-title{
  max-width:520px;
  margin:0 0 10px;
  font-family:var(--lhb-font-display);
  font-size:clamp(22px,2.2vw,31px);
  font-weight:800;
  line-height:1.08;
  letter-spacing:-.02em;
  text-transform:uppercase;
}
.ft-newsletter-copy{max-width:520px;margin-bottom:16px;font-size:13px;line-height:1.55;}
.ft-newsletter{max-width:520px;}
.ft-newsletter .lhb-form__label{display:block;margin-bottom:5px;font-family:var(--lhb-font-body);font-size:11px;font-weight:400;color:var(--lhb-neutral-700);}
.ft-newsletter-archive{display:inline-flex;align-items:center;gap:6px;margin-top:11px;color:var(--lhb-neutral-700);font-family:var(--lhb-font-body);font-size:12px;}
.ft-newsletter-archive:hover{color:var(--lila);}
.ft-service-note{max-width:250px;margin-top:18px;color:var(--lhb-neutral-575);font-family:var(--lhb-font-body);font-size:11px;line-height:1.5;}

.ft-newsletter input[type=email]{
  width: 100%;
  border: var(--lhb-line-width-thin) solid var(--lhb-neutral-275);
  padding: 8px 10px;
  font-family: var(--lhb-font-body);
  font-size: 12px;
  font-weight: 400;
  margin-bottom: 8px;
}

.ft-newsletter input:focus-visible{ border-color: var(--lila); outline:var(--lhb-focus-width) solid var(--lhb-focus-color); outline-offset:var(--lhb-focus-offset); }

.ft-newsletter button{
  width: 100%;
  background: var(--lila);
  color: var(--weiss);
  border: none;
  padding: 9px;
  font-family: var(--lhb-font-display);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  cursor: pointer;
}

.ft-newsletter button:hover{ background: var(--schwarz); }

.ft-bottom{
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 24px;
}

.ft-bottom-left{
  font-family: var(--lhb-font-body);
  font-size: var(--lhb-type-meta-size);
  font-weight: 400;
  letter-spacing: 0.04em;
  color: var(--lhb-color-text-meta);
}

.ft-bottom-right{
  display: flex;
  gap: 20px;
}

.ft-bottom-right a{
  font-family: var(--lhb-font-display);
  font-size: var(--lhb-type-ui-size);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--lhb-color-text-meta);
}

.ft-bottom-right a:hover{ color: var(--schwarz); }



/* Header: frueher auf Hamburger-Menue umschalten, damit die Navigation
   bei schmalen Quer- und Hochformatbreiten nicht gedrueckt wird. */
@media (max-width: 1280px) {
  :root{ --lhb-active-header-height:76px; }
  body{ padding-top: 76px; }
  .hd{ height: 76px; grid-template-columns: minmax(0, 1fr) 64px; grid-template-rows: 76px; }
  .hd-left{ padding: 0 18px; grid-row: 1; border-right: none; }
  .hd-left svg{ height: 48px !important; width: auto !important; max-width: min(260px, calc(100vw - 104px)) !important; }
  .hd-right{ display: none; }
  .hd-nav{ display: none; }
  .hd-burger{
    display: flex;
    border-left: var(--linie) solid var(--lhb-line-color);
    width: 64px;
    height: 76px;
    grid-row: 1;
    grid-column: 2;
  }
}

/* ══════════════════════════════
   RESPONSIVE
   ══════════════════════════════ */
@media (max-width: 900px) {

  /* Body */
  html,body{
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
  }
  body{
    margin: 0;
    border-left: none;
    border-right: none;
  }
  main,footer,.block-label{
    max-width: 100%;
  }

  /* Header */
  body{ padding-top: 76px; }
  .hd{
    left: 0;
    right: 0;
    transform: none;
    width: 100%;
    max-width: 100%;
    height: 76px;
    border-left: none;
    border-right: none;
    grid-template-columns: minmax(0, 1fr) 64px;
    grid-template-rows: 76px;
    overflow: hidden;
  }
  .hd-left{
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    border-right: none;
    padding: 0 18px;
    grid-row: 1;
  }
  .hd-left a{
    min-width: 0;
    max-width: 100%;
  }
  .hd-left svg{
    height: 48px !important;
    width: auto !important;
    max-width: min(260px, calc(100vw - 108px)) !important;
    flex-shrink: 1 !important;
  }
  .hd-right{ display: none; }
  .hd-nav{ display: none; }
  .hd-burger{
    display: flex;
    border-left: var(--linie) solid var(--lhb-line-color);
    width: 64px;
    height: 76px;
    min-width: 64px;
    grid-row: 1;
    grid-column: 2;
  }

  /* Cover: Gestapelt – Lila-Block oben, Foto darunter */
  .cover{
    display: flex;
    flex-direction: column;
    height: auto; min-height: auto; max-height: none;
  }
  .cover-panel{ display: none; }
  .cover-text{
    position: static; width: 100%;
    background: var(--lila);
    padding: 1.25rem 1.25rem 1rem;
    order: 1; animation: none;
  }
  .cover-title{
    font-size: clamp(2rem, 11vw, 3.8rem);
    margin-bottom: 0.5rem;
  }
  .cover-kicker{ margin-bottom: 0.45rem; }
  .cover-meta{ font-size: var(--lhb-type-meta-size); gap: 1rem; padding-top: 0.5rem; }
  .cover-img{
    position: static; width: 100%;
    height: auto; min-height: auto; max-height: none;
    aspect-ratio: 3 / 2; object-position: center center;
    order: 2;
  }
  .cover-cr{ color: var(--lhb-overlay-light-50); }

  /* Footer */
  .ft-top{ grid-template-columns: minmax(0,1.25fr) minmax(280px,1fr); }
  .ft-col{ border-bottom: var(--lhb-line-width-medium) solid var(--lhb-line-color); }
  .ft-col--newsletter{border-right:none;}
  .ft-col--service{grid-column:1 / -1;}
  .ft-service-note{max-width:520px;}
}

@media (max-width: 600px) {

  /* Footer */
  .ft-top{ grid-template-columns: 1fr; }
  .ft-col{ border-right: none; }
  .ft-col--service{grid-column:auto;}
  .ft-col:last-child{ border-bottom: none; }
  .ft-bottom{ flex-direction: column; gap: 12px; padding: 14px 16px; }
  .ft-bottom-right{ flex-wrap: wrap; gap: 10px; }
}


/* v31: stabile Korrektur Story-Hero und lila Titeltafeln */
@media (min-width: 769px) {
  .cover-panel{
    width: var(--lhb-journal-hero-panel-width);
    clip-path: var(--lhb-journal-hero-panel-clip);
  }

  .cover-text{
    width: var(--lhb-journal-hero-text-width);
  }
}


/* v39: Story-Cover im Hochformat wieder vollbreit stapeln.
   Das greift gezielt bei Tablet-/Viewport-Hochformaten, die breiter als
   der bisherige 900px-Breakpoint sind, und ueberschreibt die Desktop-Tafel. */
@media (orientation: portrait) and (max-width: 1200px) {
  .cover{
    display: flex;
    flex-direction: column;
    height: auto;
    min-height: auto;
    max-height: none;
  }

  .cover-panel{
    display: none;
  }

  .cover-text{
    position: static;
    width: 100%;
    background: var(--lila);
    padding: 1.25rem 1.25rem 1rem;
    order: 1;
  }

  .cover-title{
    font-size: clamp(2rem, 11vw, 3.8rem);
    margin-bottom: 0.5rem;
  }

  .cover-kicker{
    margin-bottom: 0.45rem;
  }

  .cover-meta{
    font-size: var(--lhb-type-meta-size);
    gap: 1rem;
    padding-top: 0.5rem;
  }

  .cover-img{
    position: static;
    width: 100%;
    height: auto;
    min-height: auto;
    max-height: none;
    aspect-ratio: 3 / 2;
    object-position: center center;
    order: 2;
  }
}

.purple-title h1,.story-purple-title h1,.art-purple-title h1,.article-purple-title h1,.story-card--solo h2{
  line-height: 0.98;
  letter-spacing: 0;
  max-width: 88%;
}

/* Klickbare Metadaten-Chips */
a.art-tag:hover,a.tag-chip:hover,a.verein-tag:hover,a.va-tag:hover,a.fol-tag:hover{
  color: var(--lila) !important;
  border-color: var(--lila) !important;
}


/* Einheitliche Hover-Bildunterschriften für Hero- und Arbeitsfeldbilder.
   Kein Verlauf: nur klare Flächen in Weiß/Schwarz/Lila. */
.lhb-hover-figure{position:relative;display:block;overflow:hidden;background:var(--lhb-neutral-150);color:var(--schwarz)}
.lhb-hover-figure>img{width:100%;height:100%;object-fit:cover;display:block}
.lhb-hover-caption{position:absolute;left:0;right:0;bottom:0;z-index:6;box-sizing:border-box;padding:12px 16px;background:var(--lhb-overlay-light-94);color:var(--schwarz);border-top:var(--lhb-line-width-medium) solid var(--lhb-line-color);transform:translateY(100%);transition:transform .22s ease;pointer-events:none}
.lhb-hover-figure:hover .lhb-hover-caption,.lhb-hover-figure:focus-within .lhb-hover-caption{transform:translateY(0)}
.lhb-hover-caption strong{display:block;font-family:var(--lhb-font-display);font-size:clamp(16px,1.65vw,26px);font-weight:800;letter-spacing: 0;line-height:1.08;color:var(--schwarz)}
.lhb-hover-caption span{display:block;margin-top:6px;font-family:var(--lhb-font-body);font-size:12px;line-height:1.32;color:var(--lhb-neutral-750)}
.lhb-hover-caption.is-dark{background:var(--lhb-overlay-dark-92);color:var(--weiss);border-top:var(--lhb-line-width-medium) solid var(--lila)}
.lhb-hover-caption.is-dark strong{color:var(--weiss)}
.lhb-hover-caption.is-dark span{color:var(--lhb-overlay-light-82)}


/* v26_26: typographic and caption refinements */
.lhb-hover-caption{position:absolute;left:0;right:0;bottom:0;z-index:6;box-sizing:border-box;padding:8px 10px;background:var(--lhb-overlay-light-95);color:var(--schwarz);border-top:var(--lhb-line-width-medium) solid var(--lhb-line-color);transform:translateY(100%);transition:transform .22s ease;pointer-events:none}
.lhb-hover-figure:hover .lhb-hover-caption,.lhb-hover-figure:focus-within .lhb-hover-caption{transform:translateY(0)}
.lhb-hover-caption strong{display:block;font-family:var(--lhb-font-display);font-size:clamp(12px,.95vw,15px);font-weight:800;letter-spacing:0;line-height:1.12;color:var(--schwarz)}
.lhb-hover-caption span{display:block;margin-top:4px;font-family:var(--lhb-font-body);font-size:11px;line-height:1.25;color:var(--lhb-neutral-750)}
.hero-foto .lhb-hover-caption,.ike-hero .lhb-hover-caption,.hf-hero .lhb-hover-caption,.af-hero .lhb-hover-caption{padding:14px 18px}
.hero-foto .lhb-hover-caption strong,.ike-hero .lhb-hover-caption strong,.hf-hero .lhb-hover-caption strong,.af-hero .lhb-hover-caption strong{font-size:clamp(18px,2vw,30px);letter-spacing: 0;line-height:1.08}
.hero-foto .lhb-hover-caption span,.ike-hero .lhb-hover-caption span,.hf-hero .lhb-hover-caption span,.af-hero .lhb-hover-caption span{font-size:12px;line-height:1.32}
.series-thumb .lhb-hover-caption{padding:7px 8px;border-top:var(--lhb-line-width-medium) solid var(--lhb-line-color)}
.series-thumb .lhb-hover-caption strong{font-size:12px;line-height:1.12;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.series-thumb .lhb-hover-caption span{font-size:10.5px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lhb-hover-caption.is-dark{background:var(--lhb-overlay-dark-92);color:var(--weiss);border-top:var(--lhb-line-width-medium) solid var(--lila)}
.lhb-hover-caption.is-dark strong{color:var(--weiss)}
.lhb-hover-caption.is-dark span{color:var(--lhb-overlay-light-82)}


/* v26_26: grossformatige Ueberschriften etwas weiter gestellt und laufstabiler */
[class$="-title"],[class*="-title"],blockquote,h1,h2,h3{
  overflow-wrap: normal;
  word-break: normal;
  text-wrap: balance;
}


/* v26_44: verbindliches Netzwerktreffen-Modul für Arbeitsfeldseiten */
.network-callout{display:grid;grid-template-columns:var(--lhb-grid-standard-split);background:var(--lila);color:var(--weiss);border-bottom:var(--linie) solid var(--lhb-line-color);min-height:var(--lhb-network-callout-min-height)}
.network-callout-head{padding:34px 30px;border-right:var(--linie) solid var(--lhb-line-color);display:flex;flex-direction:column;justify-content:center;min-width:0}
.network-callout-body{padding:34px 30px;display:flex;flex-direction:column;justify-content:center;gap:16px;max-width:980px;min-width:0}
.network-callout .network-kicker{font-family:var(--lhb-font-display);font-size:10px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:var(--lhb-overlay-light-75);margin-bottom:14px}
.network-callout h2{font-family:var(--lhb-font-display);font-size:clamp(28px,3.1vw,44px);font-weight:800;letter-spacing:.004em;line-height:1.02;text-transform:uppercase;margin:0;color:var(--weiss)}
.network-callout p{font-family:var(--lhb-font-body);font-size:16px;line-height:1.65;color:var(--lhb-overlay-light-92);margin:0;max-width:820px}
.network-callout-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:4px}
@media(max-width:900px){.network-callout{grid-template-columns:1fr;min-height:0}.network-callout-head{border-right:none;border-bottom:var(--linie) solid var(--lhb-line-color)}.network-callout-head,.network-callout-body{padding:26px 22px}}

/* v26_44: Listen für Landesverzeichnis / Netzwerk-Rückblicke */
.lhb-list-page{background:var(--weiss)}
.lhb-list-hero{display:grid;grid-template-columns:var(--lhb-grid-subpage-hero);border-bottom:var(--linie) solid var(--lhb-line-color);min-height:320px}
.lhb-list-hero-left{padding:42px 36px;border-right:var(--linie) solid var(--lhb-line-color)}
.lhb-list-hero-right{padding:42px 36px;font-family:var(--lhb-font-body);font-size:18px;line-height:1.65;color:var(--lhb-neutral-900);display:flex;flex-direction:column;justify-content:center;gap:16px}
.lhb-list-kicker{font-family:var(--lhb-font-display);font-size:10px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:var(--lila);margin-bottom:16px}
.lhb-list-title{font-family:var(--lhb-font-display);font-size:clamp(38px,5vw,72px);font-weight:800;letter-spacing:.004em;line-height:.96;text-transform:uppercase;margin:0}
.lhb-entry-row{display:grid;grid-template-columns:var(--lhb-grid-documentary-row);border-bottom:var(--linie) solid var(--lhb-line-color)}
.lhb-entry-media{padding:24px;border-right:var(--linie) solid var(--lhb-line-color);display:flex;align-items:flex-start}.lhb-entry-media figure{margin:0;width:100%}.lhb-entry-media img{width:100%;aspect-ratio:16/9;object-fit:cover;border:var(--linie) solid var(--lhb-line-color);display:block}.lhb-entry-placeholder{width:100%;aspect-ratio:16/9;border:var(--linie) solid var(--lhb-line-color);display:flex;align-items:center;justify-content:center;text-align:center;background:var(--lhb-surface-placeholder);color:var(--lila);font-family:var(--lhb-font-display);font-size:10px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;padding:16px;box-sizing:border-box}
.lhb-entry-copy{padding:28px 30px;display:flex;flex-direction:column;gap:14px}.lhb-entry-copy h2{font-family:var(--lhb-font-display);font-size:clamp(26px,2.5vw,38px);font-weight:800;letter-spacing:.004em;line-height:1.04;text-transform:uppercase;margin:0}.lhb-entry-copy p{font-family:var(--lhb-font-body);font-size:16px;line-height:1.7;color:var(--lhb-neutral-800);margin:0}.lhb-entry-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px}
@media(max-width:900px){.lhb-list-hero,.lhb-entry-row{grid-template-columns:1fr}.lhb-list-hero-left,.lhb-entry-media{border-right:none;border-bottom:var(--linie) solid var(--lhb-line-color)}.lhb-list-hero-left,.lhb-list-hero-right,.lhb-entry-copy,.lhb-entry-media{padding-left:22px;padding-right:22px}}

/* Ruhige, beschnittfreie Bildrahmen */
.lhb-contain-frame{background:var(--lhb-neutral-70);display:flex;align-items:center;justify-content:center;overflow:hidden}
.lhb-contain-frame img{width:100%;height:100%;object-fit:contain;display:block}

/* v26_53: mobile Grundrevision – einheitliche Regeln fuer Smartphone-Ansichten */
@media (max-width: 760px) {
  :root{ --linie: 2px; --lhb-active-header-height:72px; }
  html,body{ max-width: 100%; overflow-x: hidden; }
  body{ padding-top: 72px; border-left: 0; border-right: 0; }
  .hd{ height: 72px; grid-template-rows: 72px; grid-template-columns: minmax(0, 1fr) 60px; }
  .hd-left{ padding: 0 14px; }
  .hd-left svg{ height: 44px !important; max-width: calc(100vw - 92px) !important; }
  .hd-burger{ width: 60px; min-width: 60px; height: 72px; }

  main{ max-width: 100%; overflow-x: hidden; }
  .block-label{ padding: 10px 16px; gap: 12px; }
  .block-label-text{ font-size: clamp(18px, 4vw, 24px); letter-spacing: 0; line-height: 1.08; }
  .block-label-link{ font-size: var(--lhb-type-ui-size); letter-spacing: .08em; white-space: nowrap; }

  /* Wiederkehrende Hero-, Modul- und Zweispaltenmuster */
  .af-hero,.hf-hero,.ike-hero,.nd-hero,.doc-hero,.sub-hero,.mem-hero,.hist-hero,.vn-hero,.lhb-hero,.af-module,.hf-module,.ike-module,.nd-module,.doc-section,.section,.mem-section,.hist-section,.vn-section,.lhb-section,.contact-panel,.map-module,.mkf-callout,.lhb-list-hero,.lhb-entry-row,.vn-event-row,.ak-hero,.ak-item,.event-detail-layout,.event-hero,.event-content-grid{
    grid-template-columns: 1fr !important;
    min-height: 0 !important;
    height: auto !important;
  }
  .af-hero-text,.hf-hero-text,.ike-hero-text,.nd-hero-text,.doc-hero-left,.sub-left,.mem-left,.hist-left,.vn-left,.lhb-hero-left,.af-module-head,.hf-module-left,.ike-module-left,.nd-module-left,.doc-section-head,.head,.mem-head,.hist-head,.vn-head,.lhb-head,.contact-left,.map-copy,.lhb-list-hero-left,.lhb-entry-media,.vn-event-title,.ak-left,.ak-head,.event-detail-main,.event-hero-left{
    border-right: none !important;
    border-bottom: var(--linie) solid var(--lhb-line-color) !important;
  }

  /* Seitenabstaende */
  .af-hero-text,.hf-hero-text,.ike-hero-text,.nd-hero-text,.af-module-head,.af-module-body,.hf-module-left,.hf-module-right,.ike-module-left,.ike-module-right,.nd-module-left,.nd-module-right,.doc-hero-left,.doc-hero-right,.doc-section-head,.doc-section-body,.entry-copy,.entry-gallery,.contact-left,.contact-right,.map-copy,.content-card-body,.content-card-footer,.lhb-list-hero-left,.lhb-list-hero-right,.lhb-entry-copy,.vn-event-title,.vn-event-body,.ak-left,.ak-right,.ak-head,.ak-body{
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  /* Typografie auf Smartphone-Breiten */
  .af-title,.hf-title,.ike-title,.doc-hero h1,.nd-hero h1,.sub-left .title,.hist-title,.vn-title,.lhb-title,.lhb-list-title{ font-size: clamp(34px, 12vw, 48px) !important; line-height: .96 !important; }
  .af-title em,.ike-title-sub,.nd-hero h1 span{ font-size: .72em !important; }
  .af-lead,.hf-lead,.ike-lead,.nd-lead,.doc-hero p,.sub-right .text,.hist-text,.vn-text,.lhb-list-hero-right{ font-size: 16px !important; line-height: 1.55 !important; }
  .af-module-title,.hf-module h2,.ike-module h2,.nd-module h2,.doc-section-head h2,.entry-copy h2,.map-copy h2,.contact-left h2,.network-callout h2{ font-size: clamp(26px, 8.5vw, 34px) !important; line-height: 1.05 !important; }
  p,li{ overflow-wrap: anywhere; }

  /* Buttons: kein seitliches Ueberlaufen */
  .af-actions,.hf-actions,.ike-actions,.nd-actions,.network-callout-actions,.series-actions,.lhb-entry-actions,.vn-event-actions,.hist-actions,.vn-actions{ gap: 10px !important; }
  .vn-event-actions a{
    max-width: 100%;
    white-space: normal;
    text-align: center;
    justify-content: center;
    line-height: 1.25;
  }

  /* Bilder, Karten, Videos */
  .af-hero-image,.hf-hero-card,.ike-hero-carousel,.nd-hero-image,#vereins-preview-map,.content-card-image,.series-thumb img,.gallery-item img,.entry-gallery img{
    max-width: 100%;
  }
  .af-hero-image,.hf-hero-card,.ike-hero-carousel,.nd-hero-image{ min-height: 260px !important; height: 260px !important; }
  .content-strip,.hf-grid3,.ike-grid3,.nd-band,.af-grid5,.hist-grid,.vn-grid,.gallery-grid,.doc-grid,.reihen-grid{ grid-template-columns: 1fr !important; }
  .content-card,.hf-card,.ike-card,.nd-card,.af-card,.hist-card,.vn-card{
    min-height: 0 !important;
    border-right: none !important;
    border-bottom: var(--linie) solid var(--lhb-line-color) !important;
  }
  iframe{ max-width: 100%; }
  .youtube-embed{ width: 100% !important; aspect-ratio: 16/9; }

  /* Lightboxen: vollstaendige Bilder statt Beschnitt */
  .lightbox,.network-lightbox,.tdhf-lightbox{ padding: 12px !important; }
  .lightbox img,.network-lightbox img,.tdhf-lightbox img{
    max-width: 94vw !important;
    max-height: calc(88vh - 96px) !important;
    object-fit: contain !important;
  }
  .lhb-hover-caption{ display: none; }
}

@media (max-width: 420px) {
  .af-title,.hf-title,.ike-title,.doc-hero h1,.nd-hero h1,.lhb-list-title{ font-size: clamp(31px, 11.5vw, 42px) !important; }
  .af-hero-text,.hf-hero-text,.ike-hero-text,.nd-hero-text,.af-module-head,.af-module-body,.hf-module-left,.hf-module-right,.ike-module-left,.ike-module-right,.nd-module-left,.nd-module-right,.doc-hero-left,.doc-hero-right,.doc-section-head,.doc-section-body,.contact-left,.contact-right,.map-copy{ padding-left: 18px !important; padding-right: 18px !important; }
}


/* v26_54: mobile Nachschliff und neue Abschnittsheader */
@media (max-width: 760px) {
  .block-label{ padding: 18px 20px !important; align-items:flex-start !important; }
  .block-label-text{ line-height: 1.08 !important; }
  .block-label-link{ font-size: var(--lhb-type-ui-size) !important; letter-spacing: .08em !important; margin-top: 4px; }
  .hf-title{ font-size: clamp(30px, 10.2vw, 42px) !important; letter-spacing: -.035em !important; }
  .title{ font-size: clamp(30px, 10vw, 42px) !important; letter-spacing: -.03em !important; }
  .lhb-title{ font-size: clamp(30px, 9.5vw, 42px) !important; letter-spacing: -.035em !important; overflow-wrap: normal !important; word-break: normal !important; }
  .network-callout,.hero-reihen{ margin-bottom: 16px !important; }
}

/* Globale Hero-Akzentregel: zweite Titelzeile in Hero-Headlines wird ohne Trennzeichen, lila und kursiv gesetzt. */
.hero-title-accent{display:block;color:var(--flieder);font-style:italic}


/* v26_65: globale mobile Ueberschriften- und Sprungzielkorrektur
   Betrifft seitenuebergreifend Hero-, Kontakt-, Listen- und Ergebnisueberschriften. */
html{scroll-padding-top:152px}
[id]{scroll-margin-top:152px}

@media (max-width:760px){
  html{scroll-padding-top:88px}
  [id]{scroll-margin-top:88px}

  h1,h2,h3,.af-title,.hf-title,.ike-title,.nd-hero h1,.lhb-title,.lhb-list-title,.title,.contact-left h2,.result-title,.content-card h2,.content-card-title,.event-title,.series-title{
    max-width:100%;
    min-width:0;
    overflow-wrap:break-word!important;
    word-break:normal!important;
    hyphens:auto;
  }

  .result-title,.content-card-title{
    font-size:clamp(20px,6.8vw,28px)!important;
    line-height:1.08!important;
  }

  .contact-left h2{
    font-size:clamp(26px,8vw,34px)!important;
    line-height:1.04!important;
  }

  .lhb-title,.hist-title,.vn-title,.sub-left .title,.page-title{
    font-size:clamp(28px,8.2vw,38px)!important;
    line-height:.98!important;
  }

  .hero-title-accent{max-width:100%;display:block;}
}

@media (max-width:420px){
  .lhb-title,.hist-title,.vn-title,.sub-left .title,.page-title{
    font-size:clamp(26px,7.6vw,34px)!important;
  }
  .hf-title,.af-title,.ike-title,.nd-hero h1,.lhb-list-title{
    font-size:clamp(28px,9.2vw,38px)!important;
  }
}


/* v26_66: mobile Typografie und Kartenabstaende – globale Korrektur
   Keine Silbentrennung in schweren Ueberschriften; lieber skalieren.
   Mehr Zeilenabstand verhindert Kollisionen bei Umlauten. */
@media (max-width:760px){
  h1,h2,h3,.af-title,.hf-title,.ike-title,.nd-hero h1,.lhb-title,.lhb-list-title,.title,.page-title,.hist-title,.vn-title,.ins-title,.doc-hero h1,.sub-left .title,.contact-left h2,.result-title,.content-card h2,.content-card-title,.event-title,.series-title,.network-callout h2{
    hyphens:none!important;
    -webkit-hyphens:none!important;
    word-break:normal!important;
    overflow-wrap:normal!important;
    line-height:1.12!important;
    max-width:100%!important;
  }
  .af-title,.hf-title,.ike-title,.nd-hero h1,.lhb-title,.lhb-list-title,.title,.page-title,.hist-title,.vn-title,.ins-title,.doc-hero h1,.sub-left .title{
    line-height:1.08!important;
  }
  .hero-title-accent,.af-title em,.ike-title-sub,.nd-hero h1 span,.lhb-title .hero-title-accent{
    line-height:1.08!important;
  }
  .result-card,.content-card,.verein-karte,.va-card{
    box-sizing:border-box;
  }
  .result-media{
    justify-content:center!important;
    padding-left:10px!important;
    padding-right:10px!important;
    box-sizing:border-box!important;
    width:100%!important;
  }
  .result-image,.result-image-placeholder{
    max-width:calc(100% - 12px)!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
}
@media (max-width:420px){
  .result-card{padding-left:26px!important;padding-right:26px!important;}
  .content-card-body,.content-card-footer{padding-left:26px!important;padding-right:26px!important;}
}


/* v26_67: globale Typografie-/Kartenkorrektur
   Schwere Ueberschriften erhalten mehr Zeilenabstand; Linkkarten trennen
   Hauptzeile und Zusatzinformation konsequent zweizeilig. */
.doc-link,.lhb-btn{
  min-width: 0;
}
.doc-link > div,.doc-link .doc-link-copy,.doc-link .link-copy{
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 6px !important;
}
.doc-link strong,.doc-link-title{
  display: block !important;
  margin: 0 !important;
  line-height: 1.28 !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  hyphens: none !important;
}
.doc-link span,.doc-link-subtitle{
  display: block !important;
  margin: 0 !important;
  line-height: 1.42 !important;
  overflow-wrap: break-word !important;
  word-break: normal !important;
}
.lhb-quote blockquote,.network-callout h2{
  line-height: 1.08 !important;
}

@media (max-width: 760px) {
  h1,h2,h3,.af-title,.hf-title,.ike-title,.nd-hero h1,.lhb-title,.lhb-list-title,.title,.page-title,.hist-title,.vn-title,.ins-title,.doc-hero h1,.sub-left .title,.network-callout h2,.lhb-quote blockquote,.contact-left h2,.ins-head h2,.result-title,.content-card h2,.content-card-title,.event-title,.series-title{
    line-height: 1.15 !important;
  }
  .af-title,.hf-title,.ike-title,.nd-hero h1,.lhb-title,.lhb-list-title,.title,.page-title,.hist-title,.vn-title,.ins-title,.doc-hero h1,.sub-left .title{
    line-height: 1.12 !important;
  }
  .result-card{
    padding-left: 28px !important;
    padding-right: 28px !important;
  }
  .result-media{
    padding-left: 18px !important;
    padding-right: 18px !important;
  }
  .result-image,.result-image-placeholder{
    max-width: calc(100% - 36px) !important;
  }
  .doc-link{
    align-items: flex-start !important;
    gap: 14px !important;
  }
}

/* v26_73: verbindliche Hochformatregel fuer Ueberschriften.
   Umbruch ist nur zwischen Woertern erlaubt; die Schriftgroesse wird durch
   components.js an das laengste Wort und die verfuegbare Breite angepasst. */
@media (orientation: portrait) and (max-width: 760px) {
  main,main section,main article,main div,main header,main footer{ min-width: 0; }
  main section,main article{ max-width: 100%; }

  h1,h2,h3,.ak-title,.ak-head h2,.lhb-head h2,.lhb-title,.af-title,.hf-title,.ike-title,.nd-hero h1,.doc-hero h1,.hist-title,.vn-title,.page-title,.title,.ins-title,.feed-title,.lead-story-title,.journal-brand-title,.contact-left h2,.block-label-text,.series-title,.event-title{
    max-width: 100% !important;
    min-width: 0 !important;
    white-space: normal !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: none !important;
    -webkit-hyphens: none !important;
  }

  .ak-title,.lhb-head h2,.lhb-title,.af-title,.hf-title,.ike-title,.nd-hero h1,.doc-hero h1,.hist-title,.vn-title,.page-title,.title,.ins-title,.feed-title,.contact-left h2{
    line-height: 1.06 !important;
    letter-spacing: -.025em !important;
  }

  .ak-head h2,.block-label-text,.series-title,.event-title{
    line-height: 1.08 !important;
  }
}


/* ══════════════════════════════════════════════════════════════
   v86 – VERBINDLICHE REDAKTIONELLE BILD-/LIGHTBOX-KOMPONENTE
   Bild und Caption sind eine gemeinsame Karte. Auf Mobilgeräten
   stehen die Pfeile in einer eigenen Bedienzeile unter der Karte;
   auf größeren Ansichten liegen sie in den seitlichen Schwarzräumen.
   ══════════════════════════════════════════════════════════════ */
.lhb-lightbox-trigger{cursor:zoom-in}
.lhb-lightbox-trigger:focus-visible{outline:3px solid var(--lila);outline-offset:3px}
body.lhb-lightbox-open{overflow:hidden}
.lhb-global-lightbox{
  position:fixed;inset:0;z-index:12000;display:none;
  background:var(--lhb-overlay-dark-96);overscroll-behavior:contain;
  touch-action:pan-y;
}
.lhb-global-lightbox.is-open{display:block}
.lhb-global-lightbox.is-loading{cursor:progress}
.lhb-global-lightbox-stage{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  padding:22px 74px;overflow:auto;box-sizing:border-box;
}
.lhb-global-lightbox-shell{
  position:relative;display:flex;flex-direction:column;align-items:stretch;
  width:min(100%,1200px);max-width:100%;margin:auto;
}
.lhb-global-lightbox-frame{
  position:relative;display:flex;flex-direction:column;align-items:stretch;
  width:100%;min-width:0;background:transparent;
}
.lhb-global-lightbox-frame>img{
  display:block;width:100%;height:auto;object-fit:contain;
  background:transparent;border:var(--lhb-line-width-medium) solid var(--weiss);box-sizing:border-box;
}
.lhb-global-lightbox-caption{
  box-sizing:border-box;width:100%;min-width:0;padding:11px 14px 12px;
  overflow:auto;background:var(--weiss);color:var(--schwarz);
  font-family:var(--lhb-font-body);font-size:13px;line-height:1.38;
  overflow-wrap:normal;word-break:normal;hyphens:none;-webkit-hyphens:none;
}
.lhb-global-lightbox-caption strong{
  display:block;min-width:0;font-family:var(--lhb-font-display);font-size:15px;
  font-weight:800;letter-spacing:0;line-height:1.18;
  overflow-wrap:normal;word-break:normal;hyphens:none;-webkit-hyphens:none;
}
.lhb-global-lightbox-credit{display:block;margin-top:4px}
.lhb-global-lightbox-controls{display:contents}
.lhb-global-lightbox-counter{
  position:fixed;left:50%;bottom:4px;z-index:4;transform:translateX(-50%);
  color:var(--lhb-overlay-light-78);font-family:var(--lhb-font-body);font-size:12px;
  line-height:1;white-space:nowrap;
}
.lhb-global-lightbox-close,.lhb-global-lightbox-prev,.lhb-global-lightbox-next{
  position:fixed;z-index:5;border:var(--lhb-line-width-medium) solid var(--weiss);background:var(--schwarz);
  color:var(--weiss);cursor:pointer;font-family:var(--lhb-font-display);font-weight:800;
}
.lhb-global-lightbox-close{top:14px;right:16px;width:50px;height:50px;font-size:28px;line-height:1}
.lhb-global-lightbox-prev,.lhb-global-lightbox-next{
  top:50%;transform:translateY(-50%);width:48px;height:68px;font-size:36px;line-height:1;
}
.lhb-global-lightbox-prev{left:12px}.lhb-global-lightbox-next{right:12px}
.lhb-global-lightbox button[hidden],.lhb-global-lightbox [hidden]{display:none!important}

/* Natürliche redaktionelle Bildrahmen: keine hellen Innenstreifen durch contain
   in künstlich festgelegten Boxen. */
.lhb-natural-frame{display:inline-block;max-width:100%;background:transparent;overflow:visible}
.lhb-natural-frame>img{display:block;width:auto;height:auto;max-width:100%;object-fit:initial}

@media (max-width:760px){
  .lhb-global-lightbox-stage{
    align-items:center;justify-content:center;
    padding:62px 10px 12px;
  }
  .lhb-global-lightbox-shell{width:100%;max-width:100%;gap:10px}
  .lhb-global-lightbox-frame{width:100%}
  .lhb-global-lightbox-caption{
    max-height:34dvh;font-size:13px;padding:10px 12px 11px;
  }
  .lhb-global-lightbox-caption strong{font-size:15px;line-height:1.2}
  .lhb-global-lightbox-close{top:8px;right:8px;width:46px;height:46px}
  .lhb-global-lightbox-controls{
    display:grid;grid-template-columns:54px minmax(0,1fr) 54px;
    align-items:center;gap:10px;width:100%;min-height:54px;
  }
  .lhb-global-lightbox-prev,.lhb-global-lightbox-next{
    position:static;transform:none;width:54px;height:54px;font-size:31px;line-height:1;
    background:var(--schwarz);
  }
  .lhb-global-lightbox-prev{justify-self:start}.lhb-global-lightbox-next{justify-self:end}
  .lhb-global-lightbox-counter{
    position:static;transform:none;justify-self:center;color:var(--lhb-overlay-light-82);
    font-size:13px;
  }
  .lhb-hover-caption{display:none!important}
}

/* Headline-System: die JS-Berechnung darf nicht durch lokale !important-Regeln
   blockiert werden. Wörter bleiben intakt; ein kleiner rechter Sicherheitsraum
   ist Bestandteil der Messung. */
@media (max-width:900px){
  h1,h2,h3,[class*="-title"]{
    hyphens:none!important;-webkit-hyphens:none!important;
    overflow-wrap:normal!important;word-break:normal!important;
    max-width:100%;min-width:0;
  }
}

/* ══════════════════════════════
   HERO-SLIDER: GEMEINSAME NAVIGATION
   ══════════════════════════════ */
.hero-slider-controls{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 30px;
}
.hero-slider-arrow{
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--schwarz);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}
.hero-slider-arrow:hover{ color: var(--lila); }
.hero-slider-arrow:focus-visible{
  outline: 2px solid var(--lila);
  outline-offset: var(--lhb-focus-offset);
}


/* ══════════════════════════════
   v104 – GLOBALE TYPOGRAFIE- UND FILTERREGELN
   ══════════════════════════════ */
/* Hauptüberschriften erhalten etwas mehr vertikalen Atemraum. Die besondere
   Wortmarke des Sachsen-Anhalt-Journals bleibt von dieser Regel ausgenommen. */
.af-title,.hf-title,.ike-title,.nd-hero h1,.lhb-title,.lhb-list-title,.title,.page-title,.hist-title,.vn-title,.ins-title,.ak-title,.doc-hero h1,.hero-reihen-title,.pub-hero h1,.pd-info h1{
  line-height: 1 !important;
}

/* Einheitliche, diskrete Rücksetzung aller Filter – analog Veranstaltungen. */
.filter-reset,.lhb-filter-reset{
  font-family: var(--lhb-font-display);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--text-meta);
  background: none;
  border: none;
  cursor: pointer;
  padding: 7px 0;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  white-space: nowrap;
}
.filter-reset:hover,.lhb-filter-reset:hover{ color: var(--lila); }

/* v368: Das Navigationsoverlay nutzt die vorhandene Hoehe in der gesamten
   Hamburger-Spanne bis 1280 px. components.js misst den realen Inhalt und setzt
   die groesstmoegliche Typografie ohne vertikalen Overflow; die Desktop-
   Maximalwerte bleiben bei ausreichend hohen Viewports erhalten. */
@media (max-width:1280px){
  .overlay{
    --overlay-primary-size:40px;
    --overlay-secondary-size:30px;
    --overlay-link-pad:7px;
    --overlay-kicker-gap:28px;
  }
  .overlay-nav a{
    font-size:var(--overlay-primary-size)!important;
    padding:var(--overlay-link-pad) 0!important;
  }
  .overlay-nav-secondary a{font-size:var(--overlay-secondary-size)!important}
  .overlay-kicker{margin:var(--overlay-kicker-gap) auto 4px!important}
  .overlay-footer{display:none}
}

/* v123: kompaktes, einheitliches mobiles Navigationsoverlay. */
@media (max-width:700px){
  .overlay{
    padding:max(44px,calc(env(safe-area-inset-top) + 36px)) 22px max(12px,env(safe-area-inset-bottom));
    overflow:hidden;
  }
  .overlay-close{top:max(12px,env(safe-area-inset-top));right:18px;font-size:11px}
  .overlay-nav a{
    font-size:clamp(19px,4.1vh,29px);
    line-height:1.01;
    padding:4px 0;
    letter-spacing:-.015em;
  }
  .overlay-kicker{margin:12px auto 4px;font-size:var(--lhb-type-kicker-size)}
  .overlay-nav-secondary a{
    font-size:clamp(16px,3.25vh,23px);
    line-height:1.01;
    padding:3px 0;
  }
  .overlay-nav a em{font-style:normal}
  .overlay-footer{display:none}
}
@media (max-width:700px) and (max-height:760px){
  .overlay-nav a{font-size:clamp(17px,3.7vh,24px);padding:2px 0}
  .overlay-nav-secondary a{font-size:clamp(14px,2.9vh,20px);padding:2px 0}
  .overlay-kicker{margin-top:8px}
}

/* v125: Mobile Navigation nutzt die verfuegbare Viewporthoehe vollstaendig.
   Die konkreten Schriftgroessen werden von components.js als CSS-Variablen
   nach realer Inhaltsmessung gesetzt. */
@media (max-width:700px){
  .overlay{
    --overlay-primary-size:24px;
    --overlay-secondary-size:19px;
    --overlay-link-pad:3px;
    --overlay-kicker-gap:8px;
    justify-content:flex-start;
  }
  .overlay-nav a{
    font-size:var(--overlay-primary-size)!important;
    line-height:1.02!important;
    padding:var(--overlay-link-pad) 0!important;
  }
  .overlay-nav-secondary a{
    font-size:var(--overlay-secondary-size)!important;
  }
  .overlay-kicker{
    margin:var(--overlay-kicker-gap) auto 4px!important;
  }
}


/* v126: mehr Luft innerhalb mehrzeiliger Menuepunkte bei weiterhin vollstaendigem Viewport-Fit. */
@media (max-width:700px){
  .overlay-nav a{line-height:1.16!important}
  .overlay-nav-secondary a{line-height:1.18!important}
}


/* v138: semantische Kartentitel. Der Haupttitel bleibt praegnant; der Nebentitel
   beginnt nach dem ersten Punkt, wird kleiner und normal gesetzt. */
.lhb-card-title{display:block;overflow-wrap:normal!important;word-break:normal!important;hyphens:none!important;color:inherit;text-decoration:inherit}
.lhb-card-title__main{display:block;font:inherit;font-weight:800;line-height:inherit;text-transform:inherit;overflow-wrap:normal;word-break:normal;hyphens:none}
.lhb-card-title__sub{display:block;margin-top:.16em;font-family:var(--lhb-font-body);font-size:.82em;font-weight:400;line-height:1.24;text-transform:none;letter-spacing:0;overflow-wrap:normal;word-break:normal;hyphens:none}

/* v155 – globaler Kantenvertrag: gemeinsame Abschnittskanten haben genau
   einen Eigentuemer. Blocktitel zeichnen nur ihre Unterkante; die Linie zum
   vorherigen Abschnitt kommt von dessen Abschlusskante. Vor dem Footer
   zeichnet ausschliesslich der Footer die Trennlinie. */
.block-label{
  border-top: 0 !important;
}
main > :last-child{
  border-bottom: 0 !important;
}
#lhb-footer > footer{
  border-top: var(--linie) solid var(--lhb-line-color) !important;
}


/* v369: Das Hamburger-Overlay priorisiert die vollstaendige Uebersicht aller
   zwoelf Navigationsziele. Breite Laptop-/Tablet-Overlays werden nicht mehr
   bis zur maximal moeglichen Gross-Typografie aufgeblasen; 32/24 px sind die
   gestalterischen Obergrenzen, die reale Hoehenmessung darf bei Bedarf weiter
   verdichten. Der Kicker "Arbeitsfelder" folgt derselben linken Inhaltsachse
   wie beide Navigationsebenen. Scrollen bleibt nur die Notfallreserve fuer
   extrem kleine Viewports. */
@media (min-width:701px) and (max-width:1280px){
  .overlay{
    --overlay-primary-size:32px;
    --overlay-secondary-size:24px;
    --overlay-link-pad:5px;
    --overlay-kicker-gap:15px;
    padding:52px 32px 18px;
  }
  .overlay-kicker{
    width:100%;
    margin:var(--overlay-kicker-gap) 0 4px!important;
  }
}
html.lhb-overlay-open,html.lhb-overlay-open body{
  overflow:hidden!important;
}

/* ══════════════════════════════
   v386.5 – HORIZONTALE SCROLLER: GEMEINSAME MAUS-/TASTATURNAVIGATION
   ══════════════════════════════ */
.lhb-horizontal-scroll-controls{
  display:none;
  align-items:center;
  gap:2px;
}
.lhb-horizontal-scroll-arrow{
  display:grid;
  place-items:center;
  width:26px;
  height:26px;
  padding:0;
  border:0;
  background:transparent;
  color:var(--lila);
  font-size:16px;
  line-height:1;
  cursor:pointer;
  transition:color .16s ease,opacity .16s ease,background-color .16s ease;
}
.lhb-horizontal-scroll-arrow:hover:not(:disabled){
  background:var(--lhb-neutral-100);
  color:var(--schwarz);
}
.lhb-horizontal-scroll-arrow:focus-visible{
  outline:2px solid var(--lila);
  outline-offset:var(--lhb-focus-offset);
}
.lhb-horizontal-scroll-arrow:disabled{
  color:var(--text-meta);
  opacity:.32;
  cursor:default;
}
@media (hover:hover) and (pointer:fine){
  .lhb-horizontal-scroll-controls.is-ready:not([hidden]){display:inline-flex}
}