/* ==========================================================================
   Mörikeschule – Variante B: großes Startbild, elegante Überschriften, viel Luft
   Baut auf der Grundgestaltung (cassiopeia_moerike/css/moerike.css) auf.
   ========================================================================== */

/* Überschriftenschrift Lora (lokal) – zweite Schrift neben Arial (CI), Entscheidung offen */
@font-face{font-family:"Lora";src:url(../fonts/lora-latin.woff2) format("woff2");font-weight:400 700;font-style:normal;font-display:swap;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}
@font-face{font-family:"Lora";src:url(../fonts/lora-latin-ext.woff2) format("woff2");font-weight:400 700;font-style:normal;font-display:swap;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-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root{
  --titel-schrift:"Lora",Georgia,"Times New Roman",serif;
  --cassiopeia-font-family-headings:var(--titel-schrift);
  --abstand:clamp(56px,8vw,104px);   /* Luft zwischen den Abschnitten */
}
.variante-b h1,.variante-b h2,.variante-b h3,.variante-b .h1,.variante-b .h2,.variante-b .h3{font-family:var(--titel-schrift);font-weight:600;letter-spacing:-.005em}
.variante-b .modul-titel,.variante-b .bereich-titel{font-family:var(--titel-schrift);font-weight:600}
.b-ueber{font-family:var(--schrift);font-size:13px;font-weight:var(--fett);letter-spacing:.14em;text-transform:uppercase;color:var(--orange);margin:0 0 14px}
.b-abschnitt-titel{font-size:var(--gr-h2);margin:0 0 24px}

/* ---------- Kopfzeile über dem Startbild ---------- */
.variante-b .kopf-ueber-bild{position:fixed;left:0;right:0;top:0;background:linear-gradient(180deg,rgba(0,0,0,.55) 0,rgba(0,0,0,0) 100%);transition:background-color .35s ease,box-shadow .35s ease}
.variante-b .kopf-ueber-bild .logo img{filter:brightness(0) invert(1);transition:filter .35s ease}
.variante-b .kopf-ueber-bild:not(.gescrollt) .hauptmenue > ul > li > a,
.variante-b .kopf-ueber-bild:not(.gescrollt) .hauptmenue > ul > li > .mod-menu__toggle-sub{color:#fff}
.variante-b .kopf-ueber-bild:not(.gescrollt) .hauptmenue > ul > li > a:hover,
.variante-b .kopf-ueber-bild:not(.gescrollt) .hauptmenue > ul > li:focus-within > a,
.variante-b .kopf-ueber-bild:not(.gescrollt) .hauptmenue > ul > li.active > a,
.variante-b .kopf-ueber-bild:not(.gescrollt) .hauptmenue > ul > li > .mod-menu__toggle-sub:hover{color:var(--orange-hell)}
.variante-b .kopf-ueber-bild.gescrollt{background:var(--orange)}
.variante-b .kopf-ueber-bild.gescrollt .logo img{filter:none}
.variante-b .kopf-ueber-bild.gescrollt::before{display:none}

/* ---------- Großes Startbild ---------- */
.b-held{position:relative;min-height:560px;height:88vh;height:88svh;max-height:980px;display:flex;align-items:flex-end;overflow:hidden;background:var(--dunkel);color:#fff;isolation:isolate}
.b-held-bild{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 45%;z-index:-2;animation:b-ruhig-zoom 14s ease-out both}
.b-held::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(0,0,0,.35) 0,rgba(0,0,0,.05) 32%,rgba(0,0,0,.2) 55%,rgba(0,0,0,.78) 100%)}
.b-held-inhalt{padding-bottom:130px}
.b-held .b-ueber{color:#FFFFFF}
.b-held h1{color:#fff;font-size:clamp(30px,4.2vw,50px);line-height:1.12;max-width:19ch;margin:0 0 18px;text-shadow:0 2px 24px rgba(0,0,0,.35)}
.b-held-text{font-size:clamp(17px,1.6vw,20px);max-width:46ch;margin:0;color:#FFFFFF}
@keyframes b-ruhig-zoom{from{transform:scale(1.07)}to{transform:scale(1)}}

/* ---------- Schnellzugriff (überlappt das Startbild) ---------- */
.b-schnell{position:relative;z-index:5;margin-top:-80px}
.schnell-liste{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);background:#fff;border-radius:var(--rund);box-shadow:0 18px 44px rgba(0,0,0,.14);overflow:hidden}
.schnell-liste li + li{border-left:1px solid var(--grau-linie)}
.schnell-liste li:nth-child(3){border-left:0}
.schnell-liste li:nth-child(n+3){border-top:1px solid var(--grau-linie)}
.schnell{display:flex;flex-direction:column;gap:2px;padding:20px 18px 18px;text-decoration:none;color:var(--text);font-weight:var(--fett);height:100%;transition:background-color .2s}
.schnell span{font-weight:400;font-size:var(--gr-klein);color:var(--text-leise)}
.schnell::before{content:"";width:30px;height:30px;margin-bottom:8px;background:var(--orange);-webkit-mask:var(--maske) left center/contain no-repeat;mask:var(--maske) left center/contain no-repeat}
.schnell:hover,.schnell:focus-visible{background:var(--orange-hell);color:var(--text)}
.schnell-krank{--maske:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='M14 14.8V4a2 2 0 0 0-4 0v10.8a4 4 0 1 0 4 0z'/%3E%3Cpath d='M12 11v6'/%3E%3C/svg%3E")}
.schnell-termine{--maske:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M16 3v4M8 3v4M3 10h18M8 14h2M14 14h2M8 17h2'/%3E%3C/svg%3E")}
.schnell-downloads{--maske:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 3H6a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z'/%3E%3Cpath d='M14 3v6h6M12 12v6M9 15l3 3 3-3'/%3E%3C/svg%3E")}
.schnell-kontakt{--maske:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1 1 .4 1.9.7 2.8a2 2 0 0 1-.5 2.1L8 9.9a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.8.7a2 2 0 0 1 1.7 2z'/%3E%3C/svg%3E")}

/* ---------- Hinweise in Variante B: mehr Luft ---------- */
.variante-b .bereich-hinweise{padding:var(--abstand) 0 0}

/* ---------- Statement ---------- */
.b-statement{padding:var(--abstand) 0}
.b-statement .innen{max-width:940px;text-align:center}
.statement-text{font-family:var(--titel-schrift);font-weight:400;font-size:clamp(20px,2.3vw,27px);line-height:1.5;color:var(--text);margin:0}
.statement-text strong{color:var(--text);font-weight:600;text-decoration:underline;text-decoration-color:var(--orange);text-decoration-thickness:2px;text-underline-offset:5px}

/* ---------- Schularten als Bild-Text-Abschnitte ---------- */
.b-schularten{padding:0 0 var(--abstand);counter-reset:schulart}
.b-schularten .karte{counter-increment:schulart;display:grid;gap:24px;background:none;box-shadow:none;border-radius:0;padding:0;text-align:left;margin:0 0 var(--abstand)}
.b-schularten .karte:last-child{margin-bottom:0}
.b-schularten .karte::before{content:"";display:block;width:100%;height:auto;aspect-ratio:16/9;margin:0;border-radius:var(--rund);background:var(--ton) var(--symbol-b) center/clamp(64px,8vw,96px) no-repeat}
.b-schularten .karte-grundschule{--ton:var(--grau-hell);--symbol-b:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23D76817%27%20stroke-width%3D%271.5%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M4%2019.5V5a2%202%200%200%201%202-2h12v18H6a2%202%200%200%201-2-1.5zM4%2019.5A2%202%200%200%201%206%2018h12%27%2F%3E%3Cpath%20d%3D%27M9%207h6M9%2010.5h4%27%2F%3E%3C%2Fsvg%3E")}
.b-schularten .karte-sprache{--ton:var(--grau-hell);--symbol-b:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23D76817%27%20stroke-width%3D%271.5%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M3%205h11v8H8l-3%203v-3H3z%27%2F%3E%3Cpath%20d%3D%27M10%2016v1h6l3%203v-3h2V9h-5%27%2F%3E%3C%2Fsvg%3E")}
.b-schularten .karte-werkreal{--ton:var(--grau-hell);--symbol-b:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23D76817%27%20stroke-width%3D%271.5%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M2%209l10-5%2010%205-10%205z%27%2F%3E%3Cpath%20d%3D%27M6%2011v5c3%202.5%209%202.5%2012%200v-5M22%209v6%27%2F%3E%3C%2Fsvg%3E")}
.b-schularten .karte .modul-inhalt::before{content:"0" counter(schulart);display:block;font-family:var(--titel-schrift);font-size:15px;font-weight:600;color:var(--orange);letter-spacing:.08em;margin-bottom:10px}
.b-schularten .karte h2{font-size:var(--gr-h2);margin:0 0 14px}
.b-schularten .karte p{font-size:calc(var(--gr-text) + 1px);line-height:1.7;max-width:52ch}

/* ---------- Zahlen-Band ---------- */
.b-zahlen{background:var(--orange);color:var(--dunkel);padding:clamp(30px,4vw,44px) 0}
.zahlen-liste{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:28px 20px}
.zahlen-liste li{display:flex;flex-direction:column;gap:4px}
.zahl{font-family:var(--titel-schrift);font-weight:500;font-size:clamp(28px,3vw,38px);line-height:1.1}
.zahl-text{font-size:var(--gr-klein);font-weight:400}

/* ---------- Aktionen, Start, Galerie in Variante B ---------- */
.variante-b .bereich-aktionen{padding:var(--abstand) 0 0}
.variante-b .aktion{box-shadow:none;border:1px solid var(--grau-linie)}
.variante-b .bereich-start{padding:var(--abstand) 0}
.variante-b .box-beitraege{background:none;border:1px solid var(--grau-linie)}
.b-galerie{padding:var(--abstand) 0;background:var(--grau-hell)}
.b-galerie .galerie-liste{grid-template-columns:repeat(2,1fr);gap:10px}
.b-galerie .galerie-liste li{aspect-ratio:4/3}

/* ---------- Fußbereich Variante B ---------- */
.variante-b .fuss{border-top:0}
.b-fuss-kopf{display:flex;flex-wrap:wrap;gap:18px 40px;align-items:center;justify-content:space-between;padding-top:48px;padding-bottom:28px;border-bottom:1px solid rgba(255,255,255,.14)}
.b-fuss-logo{height:58px;width:auto;filter:brightness(0) invert(1)}
.b-fuss-adresse p{margin:0;color:#FFFFFF}
.b-fuss-adresse a{color:#FFFFFF}
.variante-b .fuss-spalten{padding-top:40px}
.b-fuss-recht ul{display:flex;flex-direction:row;flex-wrap:wrap;gap:6px 18px;list-style:none;margin:0;padding:0}
.b-fuss-recht a{color:#FFFFFF;text-decoration:none}
.b-fuss-recht a:hover{color:#fff;text-decoration:underline}

/* ---------- Tablet ---------- */
@media (min-width:768px){
  .schnell-liste{grid-template-columns:repeat(4,1fr)}
  .schnell-liste li:nth-child(3){border-left:1px solid var(--grau-linie)}
  .schnell-liste li:nth-child(n+3){border-top:0}
  .schnell{padding:24px 24px 22px}
  .b-schularten .karte{grid-template-columns:5fr 7fr;gap:clamp(32px,5vw,72px);align-items:center}
  .b-schularten .karte:nth-child(even){grid-template-columns:7fr 5fr}
  .b-schularten .karte:nth-child(even)::before{order:2}
  .zahlen-liste{display:flex;justify-content:space-between;gap:24px}
  .b-galerie .galerie-liste{grid-template-columns:repeat(4,1fr);grid-auto-rows:clamp(150px,16vw,230px)}
  .b-galerie .galerie-liste li{aspect-ratio:auto}
  .b-galerie .galerie-liste li:first-child{grid-column:span 2;grid-row:span 2}
}

/* ---------- Desktop ---------- */
@media (min-width:1100px){
  .variante-b .kopf-ueber-bild .innen{min-height:96px}
  .b-held-inhalt{padding-bottom:150px}
  .b-schnell{margin-top:-90px}
}

/* Bedienungshilfe auf dem Handy etwas kleiner, damit sie weniger verdeckt */
@media (max-width:767px){html body ._access-icon{width:44px!important;height:44px!important;background-size:26px!important}}

/* Weniger Bewegung, wenn im Gerät so eingestellt */
@media (prefers-reduced-motion:reduce){
  .b-held-bild{animation:none}
}

/* ---------- Kontaktzeile oben (Desktop) und Kontakt-Knopf (Handy) ---------- */
.b-kontaktzeile{display:none;font-size:var(--gr-klein)}
.b-kontaktzeile .innen{display:flex;justify-content:space-between;align-items:center;gap:8px 24px;min-height:0;padding-top:8px;padding-bottom:8px}
.b-kontaktzeile p{margin:0}
.b-kontaktzeile strong{font-weight:var(--halbfett)}
.b-kontaktzeile .kontakt-teil::before{content:"·";margin:0 .5em}
.kontakt-feld strong,.kontakt-feld .kontakt-teil{display:block}
.b-fuss-adresse .kontakt-teil::before{content:" · "}
.b-kontaktzeile a{color:inherit;text-decoration:none}
.b-kontaktzeile a:hover{text-decoration:underline;text-decoration-color:currentColor}
.b-kontaktzeile ul{display:flex;flex-direction:row;gap:4px 18px;list-style:none;margin:0;padding:0}
/* Unterseiten: Kopf orange -> dunkle Schrift; Startseite: weiß über dem Foto */
.variante-b .kopf .b-kontaktzeile{color:var(--dunkel);border-bottom:1px solid rgba(19,41,75,.15)}
.variante-b .kopf-ueber-bild:not(.gescrollt) .b-kontaktzeile{color:#fff;border-bottom-color:rgba(255,255,255,.25)}

.kontakt-knopf{display:inline-flex;align-items:center;gap:8px;min-height:48px;padding:8px 14px;margin-left:auto;border:0;border-radius:6px;background:rgba(255,255,255,.92);color:var(--dunkel);font:600 16px/1 var(--schrift);cursor:pointer}
.kontakt-knopf-symbol{width:20px;height:20px;background:currentColor;-webkit-mask:var(--maske) center/contain no-repeat;mask:var(--maske) center/contain no-repeat;--maske:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linejoin='round'%3E%3Cpath d='M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1 1 .4 1.9.7 2.8a2 2 0 0 1-.5 2.1L8 9.9a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.8.7a2 2 0 0 1 1.7 2z'/%3E%3C/svg%3E")}
.kontakt-feld{position:absolute;left:12px;right:12px;top:100%;z-index:20;background:#fff;color:var(--dunkel);border-radius:var(--rund);box-shadow:var(--schatten-hoch);padding:18px 20px}
.kontakt-feld[hidden]{display:none}
.kontakt-feld p{margin:0 0 10px;line-height:1.7}
.kontakt-feld a{color:var(--dunkel)}
.kontakt-feld-anfahrt{margin:0!important}
@media (max-width:420px){.kontakt-knopf-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.kontakt-knopf{padding:8px 12px}}

@media (min-width:1100px){
  .b-kontaktzeile{display:block}
  .kontakt-knopf,.kontakt-feld{display:none!important}
}
.b-kontaktzeile .kontakt-teil,.b-kontaktzeile li{white-space:nowrap}
.b-kontaktzeile-adresse{display:flex;flex-wrap:wrap;align-items:center}

/* Kontaktzeile beim Scrollen ausblenden, damit die Kopfleiste schmal bleibt */
.b-kontaktzeile{overflow:hidden;max-height:60px;transition:max-height .3s ease,opacity .25s ease}
.kopf.gescrollt .b-kontaktzeile{max-height:0;opacity:0;border-bottom-width:0;visibility:hidden}
@media (prefers-reduced-motion:reduce){.b-kontaktzeile{transition:none}}

/* „Spenden & helfen“ näher am Menüpunkt, leicht nach rechts */
@media (min-width:1100px){
  .variante-b .hauptmenue > ul > li.item-700::before{top:-2px;left:calc(50% + 14px)}
}

/* ---------- Mega-Menü mit Bild und Text (Positionen mega-<ID>) ---------- */
.hauptmenue .mega-modul{display:none}
@media (min-width:1100px){
  .hauptmenue > ul > li.hat-mega-modul{position:static}
  .hauptmenue > ul > li.hat-mega-modul > .mod-menu__sub{left:20px;right:20px;display:flex;flex-wrap:nowrap;align-items:flex-start;gap:0 28px;padding:24px 28px}
  .hauptmenue > ul > li.hat-mega-modul > .mod-menu__sub > li:not(.mega-modul){flex:0 0 220px}
  .hauptmenue > ul > li.item-700.hat-mega-modul > .mod-menu__sub{flex-wrap:wrap;flex-direction:column;max-height:none}
  .hauptmenue > ul > li.hat-mega-modul > .mod-menu__sub > .mega-modul{display:block;flex:1 1 auto;margin-left:auto;padding-left:28px;border-left:1px solid var(--grau-linie);white-space:normal}
  .hauptmenue .mega-modul *{white-space:normal}
  .mega-karte{display:grid;grid-template-columns:minmax(200px,1fr) 1.2fr;gap:22px;align-items:start}
  .mega-karte img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;border-radius:var(--rund-klein)}
  .mega-titel{font-family:var(--titel-schrift);font-size:var(--gr-h4);font-weight:600;margin:0 0 6px;color:var(--dunkel)}
  .mega-text p{margin:0 0 10px;font-size:var(--gr-klein);line-height:1.55;color:var(--dunkel);font-weight:400}
  .hauptmenue .mega-text a.mega-link{display:inline;padding:0;font-size:var(--gr-klein);font-weight:var(--fett);color:var(--dunkel);text-decoration:underline;text-decoration-color:var(--orange);text-decoration-thickness:2px;text-underline-offset:4px;background:none}
  .hauptmenue .mega-text a.mega-link:hover{background:none;color:var(--orange)}
}
/* Förderverein: Links links untereinander, Bild und Text rechts */
@media (min-width:1100px){
  .hauptmenue > ul > li.item-700.hat-mega-modul > .mod-menu__sub{display:grid;grid-template-columns:220px 1fr;grid-auto-rows:auto;gap:0 28px}
  .hauptmenue > ul > li.item-700.hat-mega-modul > .mod-menu__sub > li:not(.mega-modul){grid-column:1}
  .hauptmenue > ul > li.item-700.hat-mega-modul > .mod-menu__sub > .mega-modul{grid-column:2;grid-row:1 / 4;margin-left:0}
}
/* Linkliste: eigenes Symbol vorhanden, daher kein zusätzlicher Pfeil */
main .link-liste a::after{display:none!important}

/* ---------- Unterseiten: einheitlicher Abstand unter der Kopfleiste ---------- */
.variante-b .seite{padding-top:clamp(32px,4vw,56px);padding-bottom:clamp(48px,6vw,80px)}
.variante-b .seite-inhalt .page-header h1,.variante-b .seite-inhalt > h1{font-size:var(--gr-h1);margin:0 0 .7em}

/* „Spenden & helfen“ direkt über dem Wort „Förderverein“, leicht nach rechts versetzt */
@media (min-width:1100px){
  .variante-b .hauptmenue > ul > li.item-700::before{display:none}
  .variante-b .hauptmenue > ul > li.item-700 > a{position:relative}
  .variante-b .hauptmenue > ul > li.item-700 > a::after{content:"Spenden & helfen";position:absolute;left:44%;bottom:calc(100% - 8px);white-space:nowrap;background:var(--dunkel);color:#fff;font-size:11px;font-weight:700;line-height:1.5;letter-spacing:.02em;padding:0 7px;border-radius:3px;pointer-events:none}
}

/* Mega-Menü: Links in zwei Spalten links, Bild und Text rechts (auch bei vielen Punkten) */
@media (min-width:1100px){
  .variante-b .hauptmenue > ul > li.hat-mega-modul > .mod-menu__sub{display:grid;grid-template-columns:230px 230px minmax(0,1fr);grid-auto-flow:row;column-gap:28px;row-gap:0;align-items:start}
  .variante-b .hauptmenue > ul > li.hat-mega-modul > .mod-menu__sub > li:not(.mega-modul){grid-column:auto}
  .variante-b .hauptmenue > ul > li.hat-mega-modul > .mod-menu__sub > .mega-modul{grid-column:3;grid-row:1 / span 12;margin-left:0}
  .variante-b .hauptmenue > ul > li.item-700.hat-mega-modul > .mod-menu__sub{grid-template-columns:230px minmax(0,1fr)}
  .variante-b .hauptmenue > ul > li.item-700.hat-mega-modul > .mod-menu__sub > li:not(.mega-modul){grid-column:1}
  .variante-b .hauptmenue > ul > li.item-700.hat-mega-modul > .mod-menu__sub > .mega-modul{grid-column:2}
}

/* ---------- Beitragslisten (Aktuelles u. a.): sauberer Rand, Bilder passen hinein ---------- */
.variante-b .blog-items{display:block;margin:0;width:auto}
.variante-b .blog-item,.variante-b .com-content-category-blog__item{display:block;overflow:visible;background:#fff;border:1px solid var(--grau-linie);box-shadow:none;border-radius:var(--rund);padding:clamp(18px,3vw,28px);margin:0 0 24px}
.variante-b .blog-item .page-header h2{font-size:var(--gr-h2);margin:0 0 8px}
.variante-b .blog-item .page-header h2 a{text-decoration:none;color:var(--dunkel)}
.variante-b .blog-item .page-header h2 a:hover{color:var(--orange)}
/* Angaben unter dem Titel: eine ruhige Zeile, ohne „Details“ und Zugriffszähler */
.variante-b .article-info{display:flex;flex-wrap:wrap;gap:2px 16px;margin:0 0 16px;font-size:var(--gr-klein);color:var(--dunkel)}
.variante-b .article-info dd{margin:0}
.variante-b .article-info .article-info-term,.variante-b .article-info .hits{display:none}
.variante-b .article-info [class^="icon-"],.variante-b .article-info [class*=" icon-"]{color:var(--orange)}
/* Bilder in Beiträgen: nie breiter als die Spalte, abgerundete Ecken */
.variante-b .seite-inhalt img{max-width:100%;height:auto;border-radius:var(--rund)}
.variante-b .seite-inhalt .item-content > img,.variante-b .seite-inhalt .com-content-article__body img{display:block;margin:12px 0}
.variante-b .readmore{margin:8px 0 0}

/* „Weiterlesen“ als deutlicher Knopf in der Hausfarbe */
.variante-b .readmore .btn,.variante-b .readmore .btn-secondary{display:inline-flex;align-items:center;gap:6px;background:var(--orange);border:2px solid var(--orange);color:var(--dunkel);font-weight:var(--fett);font-size:var(--gr-text);padding:9px 18px;border-radius:6px;text-decoration:none;white-space:normal;text-align:left}
.variante-b .readmore .btn:hover,.variante-b .readmore .btn:focus{background:var(--dunkel);border-color:var(--dunkel);color:#fff}
.variante-b .readmore .icon-chevron-right{order:2;font-size:.8em}
/* „Weiterlesen“: oranger Rahmen statt Fläche */
.variante-b .readmore .btn,.variante-b .readmore .btn-secondary{background:#fff;border-color:var(--orange);color:var(--dunkel)}
.variante-b .readmore .btn:hover,.variante-b .readmore .btn:focus{background:var(--orange);border-color:var(--orange);color:var(--dunkel)}

/* Handy/Tablet: aufgeklapptes Menü liegt auf Weiß – dunkle Schrift, auch über dem Startbild */
@media (max-width:1099px){
  .variante-b .kopf-ueber-bild:not(.gescrollt) .hauptmenue > ul > li > a,
  .variante-b .kopf-ueber-bild:not(.gescrollt) .hauptmenue > ul > li > .mod-menu__toggle-sub,
  .variante-b .kopf-ueber-bild .hauptmenue a,
  .variante-b .kopf-ueber-bild .hauptmenue .mod-menu__toggle-sub{color:var(--dunkel)}
  .variante-b .kopf-ueber-bild .hauptmenue a:hover,.variante-b .kopf-ueber-bild .hauptmenue a[aria-current="page"]{color:var(--orange)}
  .variante-b .hauptmenue > ul > li.item-700 > a::after{display:none}
}
@media (max-width:1099px){
  .variante-b .kopf-ueber-bild:not(.gescrollt) .hauptmenue > ul > li.active > a,
  .variante-b .kopf-ueber-bild:not(.gescrollt) .hauptmenue > ul > li > a:hover,
  .variante-b .kopf-ueber-bild:not(.gescrollt) .hauptmenue > ul > li:focus-within > a,
  .variante-b .kopf-ueber-bild:not(.gescrollt) .hauptmenue > ul > li > .mod-menu__toggle-sub:hover{color:var(--orange)}
}

/* Bedienungshilfe und Nach-oben: gleiche Größe auf allen Geräten */
html body ._access-icon,.variante-b .nach-oben{width:48px!important;height:48px!important;border-radius:8px!important}
html body ._access-icon{background-size:30px!important}
@media (max-width:767px){html body ._access-icon{width:48px!important;height:48px!important;background-size:30px!important}}
.variante-b .nach-oben{bottom:74px}
@media (min-width:1100px){.variante-b .nach-oben{bottom:24px}}

/* ---------- Banner auf Unterseiten: volle Breite, keine graue Kante ---------- */
.variante-b .bereich-held-klein{background:#fff}
.variante-b .bereich-held-klein .held{display:block;min-height:0;max-width:none}
.variante-b .bereich-held-klein .held-bild{position:static;width:100%}
.variante-b .bereich-held-klein .held-bild img{display:block;width:100%;height:clamp(110px,18vw,260px);object-fit:cover;object-position:50% 50%;border-radius:0}
.variante-b .bereich-held-klein .held-text{display:none}

/* ---------- Knopf mit orangem Rahmen ---------- */
.moerike .btn-rahmen{background:#fff;border:2px solid var(--orange);color:var(--dunkel)}
.moerike .btn-rahmen:hover,.moerike .btn-rahmen:focus{background:var(--orange);border-color:var(--orange);color:var(--dunkel)}

/* ---------- Förderverein: Einstieg ---------- */
.fv-einstieg{max-width:820px;margin:0 auto;text-align:center;padding:8px 0 4px}
.fv-einstieg h1{font-size:clamp(28px,3.6vw,42px);margin:0 0 14px}
.fv-lead{font-size:calc(var(--gr-text) + 2px);line-height:1.65;margin:0 auto 24px;max-width:62ch}
.fv-knoepfe{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin:0 0 32px}
.fv-knoepfe .btn{min-width:180px}
.fv-fakten{list-style:none;margin:0;padding:22px 0 0;display:grid;grid-template-columns:repeat(3,1fr);gap:16px;border-top:1px solid var(--grau-linie)}
.fv-fakten li{display:flex;flex-direction:column;gap:2px}
.fv-fakten strong{font-family:var(--titel-schrift);font-size:clamp(22px,2.4vw,30px);font-weight:600;color:var(--orange)}
.fv-fakten span{font-size:var(--gr-klein)}
@media (max-width:640px){.fv-fakten{grid-template-columns:1fr;gap:12px}}

/* ---------- Förderverein: drei Schritte ---------- */
.fv-schritte{border:2px solid var(--orange);border-radius:var(--rund);padding:clamp(22px,4vw,40px);background:#fff}
.fv-schritte h2{text-align:center;margin:0 0 24px}
.fv-schritte ol{list-style:none;counter-reset:schritt;margin:0;padding:0;display:grid;gap:18px}
.fv-schritte li{counter-increment:schritt;display:grid;grid-template-columns:44px 1fr;column-gap:14px;align-items:start}
.fv-schritte li::before{content:counter(schritt);grid-row:1 / span 2;width:44px;height:44px;border-radius:50%;background:var(--orange);color:var(--dunkel);font-family:var(--titel-schrift);font-weight:600;font-size:20px;display:flex;align-items:center;justify-content:center}
.fv-schritte li strong{display:block;font-size:calc(var(--gr-text) + 1px)}
.fv-frage{text-align:center;margin:24px 0 0;font-size:var(--gr-klein)}
@media (min-width:768px){.fv-schritte ol{grid-template-columns:repeat(3,1fr)}}

/* Wer/Wie/Was auf der Vereinsseite: ohne Farbkreis */
.variante-b .bereich-karten .karte:not([class*="karte-"])::before{display:none}
.variante-b.ist-unterseite .bereich-aktionen{padding-bottom:clamp(40px,5vw,64px)}

/* Startbild „ausgezoomt“: Höhe passend zum Bildformat (3:2), damit das ganze Gebäude sichtbar ist */
.b-held{height:auto;min-height:0;max-height:none;aspect-ratio:1280/830}
.b-held-bild{animation:none;object-position:50% 50%}
@media (max-width:767px){.b-held{aspect-ratio:auto;min-height:560px}.b-held-bild{object-position:40% 50%}}
@media (min-width:1600px){.b-held{aspect-ratio:auto;height:min(64vw,92vh)}}

/* Beitragslisten in Spalten (in Joomla am Menüpunkt: „Spalten“) */
.variante-b .blog-items.columns-2,.variante-b .blog-items.columns-3,.variante-b .blog-items.columns-4{display:grid;grid-template-columns:1fr;gap:24px;margin:0}
.variante-b .blog-items[class*="columns-"] > .blog-item{width:auto;margin:0}
@media (min-width:700px){.variante-b .blog-items.columns-2,.variante-b .blog-items.columns-3,.variante-b .blog-items.columns-4{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1100px){.variante-b .blog-items.columns-3{grid-template-columns:repeat(3,1fr)}.variante-b .blog-items.columns-4{grid-template-columns:repeat(4,1fr)}}
.variante-b .blog-items[class*="columns-"] .page-header h2{font-size:var(--gr-h3)}
.variante-b .blog-items[class*="columns-"]{align-items:start}

/* ---------- Förderverein: Seite „Mitmachen“ ---------- */
.fv-lead-links{font-size:calc(var(--gr-text) + 1px);line-height:1.7}
.fv-sprung{display:grid;gap:10px;margin:24px 0 8px}
.fv-sprung a{display:flex;align-items:center;gap:12px;padding:14px 16px;border:1px solid var(--grau-linie);border-radius:var(--rund);text-decoration:none;color:var(--dunkel);font-weight:var(--fett);transition:border-color .2s,background-color .2s}
.fv-sprung a:hover{border-color:var(--orange);background:var(--grau-hell)}
.fv-sprung span,.fv-nr{flex:none;width:34px;height:34px;border-radius:50%;background:var(--orange);color:var(--dunkel);display:inline-flex;align-items:center;justify-content:center;font-family:var(--titel-schrift);font-weight:600}
@media (min-width:700px){.fv-sprung{grid-template-columns:repeat(3,1fr)}}
.fv-block{padding:clamp(28px,4vw,40px) 0;border-top:1px solid var(--grau-linie);scroll-margin-top:110px}
.fv-block:first-of-type{margin-top:24px}
.fv-block h2{display:flex;align-items:center;gap:12px;margin:0 0 14px}
.fv-kasten,.fv-konto{background:var(--grau-hell);border-radius:var(--rund);padding:20px 22px;margin:18px 0}
.fv-kasten-titel{font-family:var(--titel-schrift);font-size:var(--gr-h4);font-weight:600;margin:0 0 10px}
.fv-kasten ol{margin:0 0 16px;padding-left:1.3em}
.fv-kasten li{margin:4px 0}
.fv-klein{font-size:var(--gr-klein);margin:8px 0 0}
.fv-konto dl{display:grid;grid-template-columns:auto 1fr;gap:6px 18px;margin:0}
.fv-konto dt{font-weight:var(--fett)}
.fv-konto dd{margin:0}
.fv-iban{font-variant-numeric:tabular-nums;letter-spacing:.03em;font-weight:var(--halbfett)}
.fv-schluss{border-left:4px solid var(--orange);padding:14px 18px;background:var(--grau-hell);border-radius:0 var(--rund) var(--rund) 0}
.variante-b .seite-sidebar .modul .btn{width:100%}
.variante-b .seite-sidebar img{display:block;margin:0 auto}
/* Spalten immer exakt gleich breit (Inhalt darf sie nicht aufdrücken) */
@media (min-width:700px){.variante-b .blog-items.columns-2,.variante-b .blog-items.columns-3,.variante-b .blog-items.columns-4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1100px){.variante-b .blog-items.columns-3{grid-template-columns:repeat(3,minmax(0,1fr))}.variante-b .blog-items.columns-4{grid-template-columns:repeat(4,minmax(0,1fr))}}
.variante-b .blog-items[class*="columns-"] > .blog-item{min-width:0;overflow-wrap:anywhere}

/* Mauerwerk-Layout für Beitragsspalten (per JS aktiviert, ohne JS normales Raster) */
@media (min-width:700px){
  .variante-b .blog-items.mauerwerk{grid-auto-rows:4px;row-gap:0;column-gap:24px;align-items:start}
  .variante-b .blog-items.mauerwerk > .blog-item{margin-bottom:24px}
}

/* ---------- Seite „Vorstellung“ ---------- */
.vs-block{padding:clamp(28px,4vw,44px) 0;border-top:1px solid var(--grau-linie)}
.vs-block:first-child{border-top:0;padding-top:4px}
.vs-block > h2{margin:0 0 20px}
.vs-leitung,.vs-sekretariat{display:grid;gap:24px;align-items:center}
.vs-leitung h2,.vs-sekretariat h2{margin:0 0 12px}
.vs-leitung img,.vs-sekretariat img{width:100%;height:auto;border-radius:var(--rund)}
.vs-leitung img{max-width:360px}
@media (min-width:800px){.vs-leitung{grid-template-columns:minmax(0,320px) 1fr;gap:36px}.vs-sekretariat{grid-template-columns:1fr minmax(0,1fr);gap:36px}}
.vs-kontakt{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;margin:0 0 16px}
.vs-kontakt dt{font-weight:var(--fett)}
.vs-kontakt dd{margin:0}
.vs-hinweis{background:var(--grau-hell);border-left:4px solid var(--orange);padding:12px 16px;border-radius:0 var(--rund) var(--rund) 0;margin:0}
.personen{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 20px}
@media (min-width:900px){.personen{grid-template-columns:repeat(4,minmax(0,1fr))}}
.person img,.person-ohne-bild{display:block;width:100%;height:auto;aspect-ratio:200/255;object-fit:cover;border-radius:var(--rund);background:var(--grau-hell);margin:0 0 12px}
.person-name{font-weight:var(--fett);margin:0}
.person-rolle{font-size:var(--gr-klein);margin:2px 0 8px}
.person-kontakt{font-size:var(--gr-klein);margin:0;line-height:1.7}
.vs-karten{display:grid;gap:16px}
@media (min-width:700px){.vs-karten{grid-template-columns:repeat(2,minmax(0,1fr))}}
.vs-karte{border:1px solid var(--grau-linie);border-radius:var(--rund);padding:18px 20px}
.vs-karte p{margin:0}
.vs-karte-titel{font-family:var(--titel-schrift);font-size:var(--gr-h4);font-weight:600;margin:0 0 6px!important}
.vs-kollegium{width:100%;height:auto;border-radius:var(--rund);margin:0 0 20px}
.vs-namen{list-style:none;margin:0;padding:0;columns:2;column-gap:24px;font-size:var(--gr-klein);line-height:1.9}
@media (min-width:700px){.vs-namen{columns:3}}
@media (min-width:1000px){.vs-namen{columns:4}}
.vs-digital{text-align:center}
.vs-digital img{max-width:320px;margin:8px auto 0}

/* ---------- Downloads in zwei Spalten ---------- */
.download-raster{display:grid;gap:20px;margin-top:20px}
@media (min-width:800px){.download-raster{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}}
.download-gruppe{border:1px solid var(--grau-linie);border-radius:var(--rund);padding:18px 20px 6px}
.download-gruppe h2{font-size:var(--gr-h3);margin:0 0 10px}
.download-gruppe .download-liste{margin-bottom:10px;border-top:0}
.download-gruppe .download-liste li:last-child{border-bottom:0}
.seite-sidebar .neue-downloads{border-top:0;margin:0 0 8px}
.seite-sidebar .neue-downloads li{padding:9px 0 9px 28px;border-bottom:1px solid var(--grau-linie)}
.seite-sidebar .neue-downloads li::before{top:11px;width:18px;height:18px}
.seite-sidebar .neue-downloads a{font-weight:var(--halbfett);border:0;padding:0;display:inline}
.neue-downloads-alle{margin:6px 0 0;font-size:var(--gr-klein)}
.seite-sidebar .neue-downloads li{display:block}.seite-sidebar .neue-downloads .datei-info{white-space:nowrap}

/* Abgerundete Ecken für alle Inhaltsbilder: Hauptinhalt, Seitenleiste, Module, Karten */
.variante-b main img{border-radius:var(--rund)}
/* Ausnahmen: großes Startbild, Banner über die volle Breite, Bilder in Rahmen mit eigener Rundung */
.variante-b .b-held-bild,.variante-b .bereich-held img,.variante-b .aktion-bild img,.variante-b .galerie img{border-radius:0}

/* ---------- VORSCHAU „volle Breite“ ---------- */
.seite-breit{display:block}
.seite-breit .seite-inhalt > .com-content-article > .page-header,.seite-breit .page-header{margin-bottom:8px}
/* Unterseiten-Leiste aus dem Seitenleisten-Menü */
.unterseiten{order:-1;margin:0 0 28px;padding:0 0 18px;border-bottom:1px solid var(--grau-linie)}
.unterseiten .modul{background:none;padding:0;margin:0}
.unterseiten .modul-titel{display:none}
.unterseiten ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.unterseiten ul ul{display:contents}
.unterseiten li{display:contents}
.unterseiten .mod-menu__toggle-sub,.unterseiten .mod-menu__separator,.unterseiten .nav-header{display:none}
.unterseiten a{display:inline-block;padding:7px 14px;border:1px solid var(--grau-linie);border-radius:6px;text-decoration:none;color:var(--dunkel);font-size:var(--gr-klein);font-weight:var(--halbfett);background:#fff;transition:border-color .2s,background-color .2s}
.unterseiten a:hover{border-color:var(--orange)}
.unterseiten a[aria-current="page"],.unterseiten .current > a{background:var(--orange);border-color:var(--orange);color:var(--dunkel)}
@media (max-width:767px){.unterseiten ul{flex-wrap:nowrap;overflow-x:auto;padding-bottom:6px;-webkit-overflow-scrolling:touch}.unterseiten a{white-space:nowrap}}
/* Band „Mehr zum Thema“ */
.band-mehr{background:var(--grau-hell);padding:clamp(36px,5vw,56px) 0}
.band-mehr-titel{margin:0 0 20px}
.band-mehr-raster{display:grid;gap:20px}
@media (min-width:768px){.band-mehr-raster{grid-template-columns:repeat(3,minmax(0,1fr));align-items:start}}
.band-mehr .modul{background:#fff;border-radius:var(--rund);padding:20px 22px;margin:0}
.unterseiten ul,.unterseiten .mod-menu{flex-direction:row!important;align-items:center}
.unterseiten a{width:auto;flex:none}
.unterseiten a:not(:hover){text-decoration:none}
.download-gruppe .link-liste{margin-bottom:10px;border-top:0}.download-gruppe .link-liste li:last-child{border-bottom:0}
/* Downloads/Links: Kästen lückenlos in zwei Spalten */
@media (min-width:800px){.download-raster{display:block;columns:2;column-gap:20px}.download-gruppe{break-inside:avoid;margin:0 0 20px;display:inline-block;width:100%}}
/* Erster (langer) Kasten links über die ganze Höhe, die übrigen rechts untereinander */
@media (min-width:800px){
  .download-raster.erste-links{display:grid;columns:auto;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-flow:row dense;gap:20px;align-items:start}
  .download-raster.erste-links > .download-gruppe{margin:0;grid-column:2}
  .download-raster.erste-links > .download-gruppe:first-child{grid-column:1;grid-row:1 / span 20}
}

/* Downloads: Knöpfe für angemeldete Personen (Bearbeiten, Datei hinzufügen) */
.download-liste .download-bearbeiten{margin-left:10px;font-size:var(--gr-klein);font-weight:var(--fett);white-space:nowrap}
.download-neu{margin:14px 0 0}

/* Inhalte strukturieren: Kästen nebeneinander, Tabellen, Fußnoten (z. B. Ganztagesbetrieb) */
.info-raster{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));margin:0 0 1.6em}
.info-raster-2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.info-kasten{background:var(--grau-hell);border-radius:var(--rund);padding:20px 22px}
.info-kasten h3{margin:0 0 .6em;font-size:var(--gr-h3)}
.info-kasten ul{margin:0;padding-left:20px}
.info-kasten li{margin:4px 0}
.tabelle-rahmen{overflow-x:auto;margin:0 0 1.6em}
.inhalt-tabelle{width:100%;border-collapse:collapse;font-size:15px;background:var(--weiss)}
.inhalt-tabelle th,.inhalt-tabelle td{text-align:left;vertical-align:top;padding:9px 12px;border-bottom:1px solid var(--grau-linie)}
.inhalt-tabelle thead th{background:var(--grau-hell);font-weight:var(--fett)}
.inhalt-tabelle tbody th{font-weight:var(--fett);width:4.5em}
.inhalt-tabelle tr.pause td{padding-top:3px;padding-bottom:3px;font-size:var(--gr-klein);border-bottom-style:dashed}
.inhalt-tabelle tr.mittag td{background:var(--grau-hell)}
.info-kasten .inhalt-tabelle{background:none}
.info-kasten .inhalt-tabelle td{padding-left:0}
.fussnote{font-size:var(--gr-klein);margin:10px 0 0}
.hinweis > div > p + p{margin-top:8px}
.seite-inhalt .hinweis{margin:0 0 1.6em}
.inhalt-bild{display:block;margin:0 auto;border-radius:var(--rund)}

/* Fuß: YouTube als Symbol statt Text (Titel bleibt für Screenreader) */
.symbol-youtube{--maske:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' fill-rule='evenodd' d='M21.6 7.2a2.6 2.6 0 0 0-1.8-1.8C18.2 5 12 5 12 5s-6.2 0-7.8.4A2.6 2.6 0 0 0 2.4 7.2C2 8.8 2 12 2 12s0 3.2.4 4.8a2.6 2.6 0 0 0 1.8 1.8C5.8 19 12 19 12 19s6.2 0 7.8-.4a2.6 2.6 0 0 0 1.8-1.8c.4-1.6.4-4.8.4-4.8s0-3.2-.4-4.8ZM10 15V9l5.2 3L10 15Z'/%3E%3C/svg%3E")}
.b-fuss-recht .symbol-youtube{width:1.6em;height:1.6em;padding:0!important;vertical-align:-.45em}
.b-fuss-recht .item-771 a::after{content:none!important}

/* Kopf: Symbole oben rechts (Kontaktformular, YouTube) */
.symbol-brief{--maske:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m3 7 9 6 9-6'/%3E%3C/svg%3E")}
.b-kontaktzeile .b-kontaktzeile-symbole{gap:0;flex:none;align-items:center}
.b-kontaktzeile-symbole li{display:flex;align-items:center}
.b-kontaktzeile-symbole li + li::before{content:"";width:1px;height:1em;background:currentColor;opacity:.5;margin:0 8px}
.b-kontaktzeile-symbole a{display:inline-flex;align-items:center;justify-content:center;padding:2px}
.b-kontaktzeile-symbole .symbol{width:1.35em;height:1.35em;vertical-align:middle}
.b-kontaktzeile-symbole .symbol-youtube{width:1.6em;height:1.6em}
.b-kontaktzeile-symbole a::after{content:none!important}

/* Kontaktseite: zwei Spalten (Text links, Formular rechts), Formular nicht über die volle Breite */
.kontakt-spalten{display:grid;gap:32px}
@media (min-width:900px){.kontakt-spalten{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:56px;align-items:start}}
.kontakt-spalte-form > h2:first-child{margin-top:0}
.kontakt-spalte-form .com-contact__form{max-width:640px}
.kontakt-oben .hinweis{margin-bottom:24px}
.com-contact > h1 + .page-header h2{margin-top:.2em}
.com-contact .kontakt-spalten{margin-top:36px}
@media (min-width:900px){.com-contact .kontakt-spalten{margin-top:44px}}

/* Aufnahmeantrag Förderverein: Felder platzsparend nebeneinander, Auswahl (Frau/Herr/Divers) in einer Zeile */
.fv-gruppe{margin-bottom:8px!important}
.fv-zeile{display:grid;gap:0 20px}
@media (min-width:600px){
  .fv-zeile-2{grid-template-columns:1fr 1fr}
  .fv-zeile-plz{grid-template-columns:minmax(0,1fr) minmax(0,2.5fr)}
}
.fv-gruppe .radio{display:flex;flex-wrap:wrap;gap:4px 22px;padding-top:6px}
.fv-gruppe .radio .form-check{margin:0}
.fv-gruppe .control-group{margin-bottom:16px}
.fv-gruppe .controls > fieldset{margin:0;padding:0;border:0}
.fv-gruppe .controls .checkboxes,.fv-gruppe .controls .radio{margin:0}
.fv-gruppe .form-check{min-height:0;margin-bottom:0}
.fv-bild{margin:18px 0 8px}
.fv-bild img{display:block;width:110px;height:auto;margin:0}

/* DSGVO-Feld unten links, über dem Barrierefreiheits-Symbol (52 px breit, unten 74 px) */
.dsgvo-feld{position:fixed;left:12px;bottom:129px;z-index:9990;font-family:var(--schrift)}
.dsgvo-knopf{display:block;width:52px;padding:6px 0;border:0;border-radius:6px;background:var(--orange);color:#fff;font:800 10.5px/1.2 var(--schrift);letter-spacing:.05em;cursor:pointer}
.dsgvo-knopf:hover,.dsgvo-knopf[aria-expanded="true"]{background:var(--dunkel);color:#fff;box-shadow:0 0 0 2px #fff}
.dsgvo-info{position:absolute;left:0;bottom:calc(100% + 10px);width:min(320px,calc(100vw - 24px));background:var(--weiss);color:var(--dunkel);border-radius:var(--rund);box-shadow:var(--schatten-hoch);padding:16px 18px 14px;font-size:var(--gr-klein);line-height:1.5}
.dsgvo-info[hidden]{display:none}
.dsgvo-kopf{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin:0 0 8px}
.dsgvo-titel{margin:0;font-weight:var(--fett);font-size:13px;letter-spacing:.08em;text-transform:uppercase}
.dsgvo-zu{border:0;background:none;color:var(--dunkel);font-size:22px;line-height:1;padding:0 2px;cursor:pointer}
.dsgvo-info ul{margin:0 0 10px;padding-left:18px}
.dsgvo-info li{margin:4px 0}
.dsgvo-info p{margin:0}
.dsgvo-info a{font-weight:var(--fett)}
@media print{.dsgvo-feld{display:none}}

/* Fuß: keine farbigen Balken vor den Überschriften (Wunsch der Nutzerin: keine Akzentstreifen) */
.fuss .modul-titel::before{content:none!important;display:none!important}

/* Inhaltsseiten: Leitsatz, Fakten, Vorstand, Frage-Kasten (z. B. Förderverein › Der Verein) */
.seite-lead{font-family:var(--titel-schrift);font-size:clamp(20px,2.2vw,26px);line-height:1.35;font-weight:600;margin:0 0 1.4em;max-width:40ch}
.fakten-liste{list-style:none;margin:18px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:12px}
.fakten-liste li{background:var(--grau-hell);border-radius:var(--rund);padding:12px 18px;min-width:140px}
.fakt-zahl{display:block;font-family:var(--titel-schrift);font-size:24px;font-weight:600;color:var(--dunkel)}
.fakt-text{display:block;font-size:var(--gr-klein)}
.vorstand-liste{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
.vorstand-liste li{border:1px solid var(--grau-linie);border-radius:var(--rund);padding:12px 16px}
.vorstand-rolle{display:block;font-size:var(--gr-klein);letter-spacing:.04em}
.vorstand-name{display:block;font-weight:var(--fett)}
.fv-fragen{display:flex;gap:20px;align-items:flex-start;margin-top:2em}
.fv-fragen img{flex:none;width:72px;height:auto}
.fv-fragen h2{margin-top:0}
.fv-fragen p:last-child{margin-bottom:0}
@media (max-width:600px){.fv-fragen{flex-direction:column}}

/* Aktionsbanner mit den neuen SVG-Grafiken: helles Grau wie die Grafik (statt Ausnahme-Grau der alten Fotos) */
.aktion:has(.aktion-bild img[src$=".svg"]){background:var(--grau-hell)}
.fv-schluss{border-left:0!important;border-radius:var(--rund)!important}
.vs-hinweis{border-left:0!important;border-radius:var(--rund)!important}

/* Inhaltsseiten: Schwerpunkte als Kacheln, Schulknigge als Karten */
.schwerpunkte{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.schwerpunkte li{background:var(--grau-hell);border-radius:var(--rund);padding:16px 18px;font-family:var(--titel-schrift);font-weight:600;font-size:18px;line-height:1.3}
.knigge-raster .info-kasten h2{font-size:var(--gr-h3);margin:0 0 .5em}
.knigge-raster .info-kasten p{margin:0}
@media (min-width:900px){.knigge-raster{grid-template-columns:repeat(3,1fr)}}
.fuss a:has(> img)::after{content:none!important}

/* Ablauf in Stufen (z. B. „Wie entsteht die SMV?“), Listen mit Luft, Hausordnung-Fuß */
.ablauf{list-style:none;margin:20px 0 1.6em;padding:0;display:grid;gap:30px;max-width:720px}
.ablauf-stufe{position:relative;background:var(--grau-hell);border-radius:var(--rund);padding:16px 20px}
.ablauf-stufe p{margin:0}
.ablauf-titel{font-family:var(--titel-schrift);font-weight:600;font-size:var(--gr-h3);margin-bottom:4px!important}
.ablauf-stufe + .ablauf-stufe::before{content:"";position:absolute;left:32px;top:-26px;width:16px;height:22px;background:var(--orange);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 22'%3E%3Cpath d='M8 0v16M2 11l6 7 6-7' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 22'%3E%3Cpath d='M8 0v16M2 11l6 7 6-7' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}
.ablauf-ziel{background:var(--weiss);border:2px solid var(--orange)}
.vorstand-karte{border:1px solid var(--grau-linie);border-radius:var(--rund);padding:12px 16px;max-width:280px;margin-top:12px}
.liste-luftig{padding-left:20px;margin:0 0 1.6em}
.liste-luftig li{margin:8px 0}
.hausordnung-fuss{margin-top:2em;padding-top:16px;border-top:1px solid var(--grau-linie);font-size:var(--gr-klein)}
.hausordnung-fuss p{margin:0 0 8px}
.info-kasten h2:first-child{margin-top:0}
.inhalt-tabelle tbody th[scope="row"]{width:auto;white-space:nowrap}
.info-kasten h3:first-child{margin-top:0}
@media (min-width:900px){.info-raster-2{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Unterseiten-Knöpfe: aktive Seite dunkel mit weißer Schrift (Kontrast 13,5 : 1 statt 3,8 : 1) */
.unterseiten a[aria-current="page"],.unterseiten .current > a{background:var(--dunkel)!important;border-color:var(--dunkel)!important;color:#fff!important;text-decoration:none!important}
.unterseiten-knopf{display:none}

/* ===== Handy (bis 767 px) ===== */
@media (max-width:767px){
  /* Menü-Knopf nur mit drei Strichen, Text bleibt für Screenreader */
  .menue-knopf-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  /* Unterseiten als Aufklapp-Liste */
  .unterseiten.klappbar .unterseiten-knopf{display:flex;width:100%;justify-content:space-between;align-items:center;gap:12px;padding:11px 16px;border:1px solid var(--grau-linie);border-radius:var(--rund);background:var(--weiss);color:var(--dunkel);font:600 var(--gr-text)/1.3 var(--schrift);text-align:left;cursor:pointer}
  .unterseiten-knopf .uk-label{font-size:var(--gr-klein);font-weight:400;display:block}
  .unterseiten-knopf::after{content:"+";flex:none;width:26px;height:26px;display:flex;align-items:center;justify-content:center;border-radius:6px;background:var(--grau-hell);font-size:19px;font-weight:700}
  .unterseiten-knopf[aria-expanded="true"]::after{content:"−"}
  .unterseiten.klappbar ul{display:none!important}
  .unterseiten.klappbar.offen ul,.unterseiten.klappbar.offen .mod-menu{display:flex!important;flex-direction:column!important;align-items:stretch!important;flex-wrap:nowrap;overflow:visible;gap:6px;margin-top:8px!important}
  .unterseiten.klappbar.offen ul ul{display:contents!important}
  .unterseiten.klappbar.offen a{display:block;border-radius:var(--rund);white-space:normal}
  /* Footer: Spalten zum Aufklappen, unterste Zeile untereinander, Platz für die Handy-Leiste */
  .fuss-spalten.klappbar{gap:0;padding-top:24px;padding-bottom:24px}
  .fuss-spalten.klappbar .fuss-spalte{border-bottom:1px solid rgba(255,255,255,.15)}
  .fuss-spalten.klappbar .modul-titel{margin:0}
  .fuss-klapp-knopf{display:flex;width:100%;justify-content:space-between;align-items:center;padding:14px 0;border:0;background:none;color:#fff;font:inherit;cursor:pointer;text-align:left}
  .fuss-klapp-knopf::after{content:"+";font-size:20px;font-weight:700;line-height:1}
  .fuss-klapp-knopf[aria-expanded="true"]::after{content:"−"}
  .fuss-spalten.klappbar .modul-inhalt[hidden]{display:none}
  .fuss-spalten.klappbar .modul-inhalt{padding-bottom:16px}
  .fuss-unten .innen{flex-direction:column;align-items:flex-start;gap:12px}
  .fuss-unten{padding-bottom:calc(72px + env(safe-area-inset-bottom))}
  .nach-oben{bottom:84px!important}
}

/* Knöpfe gut lesbar: Nachtblau mit weißer Schrift (14,5 : 1), Orange nur als Hervorhebung beim Drüberfahren/Fokus.
   Im dunklen Fuß: weißer Knopf mit dunkler Schrift. */
.moerike .btn-primary,.moerike .btn-sm.btn-primary{background:var(--dunkel);border-color:var(--dunkel);color:#fff}
.moerike .btn-primary:hover,.moerike .btn-primary:focus-visible{background:var(--orange);border-color:var(--orange);color:var(--dunkel)}
.moerike .fuss .btn-primary{background:#fff;border-color:#fff;color:var(--dunkel)}
.moerike .fuss .btn-primary:hover,.moerike .fuss .btn-primary:focus-visible{background:var(--orange);border-color:var(--orange);color:var(--dunkel)}

/* Ohne feste Handy-Leiste: kein Zusatzabstand unten */
body.moerike:not(:has(.mobil-leiste)){padding-bottom:0}
@media (max-width:767px){
  body:not(:has(.mobil-leiste)) .fuss-unten{padding-bottom:calc(16px + env(safe-area-inset-bottom))}
  body:not(:has(.mobil-leiste)) .nach-oben{bottom:16px!important}
}
html body:not(:has(.mobil-leiste)) ._access-icon{bottom:16px!important}

/* ===== Knöpfe (siehe Handbuch, Kapitel 15) =====
   Alle Knöpfe gleich groß wie die Unterseiten-Knöpfe (15 px, eckig 6 px).
   Bei dieser Schriftgröße ist Weiß auf Orange nicht barrierefrei (3,6 : 1, nötig 4,5 : 1),
   deshalb: weiße Fläche, oranger Rahmen, dunkle Schrift (13,5 : 1).
   1. btn-primary / btn-rahmen  weiß mit orangem Rahmen (Standard), beim Drüberfahren dunkel
   2. btn-dunkel                nachtblaue Fläche, weiße Schrift (sparsam) */
.moerike .btn,.variante-b .readmore .btn,.variante-b .readmore .btn-secondary{font-size:var(--gr-klein);font-weight:var(--fett);line-height:1.3;padding:6px 14px;border-width:2px;border-style:solid;border-radius:6px}
.moerike .btn-primary,.moerike .btn-sm.btn-primary,.moerike .btn-rahmen,.variante-b .readmore .btn,.variante-b .readmore .btn-secondary{background:var(--weiss);border-color:var(--orange);color:var(--dunkel)}
.moerike .btn-primary:hover,.moerike .btn-primary:focus-visible,.moerike .btn-rahmen:hover,.moerike .btn-rahmen:focus-visible,.variante-b .readmore .btn:hover,.variante-b .readmore .btn:focus-visible{background:var(--dunkel);border-color:var(--dunkel);color:#fff}
.moerike .btn-dunkel{background:var(--dunkel);border-color:var(--dunkel);color:#fff}
.moerike .btn-dunkel:hover,.moerike .btn-dunkel:focus-visible{background:var(--weiss);border-color:var(--dunkel);color:var(--dunkel)}
/* Im dunklen Fuß: dunkle Fläche mit orangem Rahmen und weißer Schrift, beim Drüberfahren weiß */
.moerike .fuss .btn-primary{background:transparent;border-color:var(--orange);color:#fff}
.moerike .fuss .btn-primary:hover,.moerike .fuss .btn-primary:focus-visible{background:#fff;border-color:#fff;color:var(--dunkel)}

/* Fakten mit Text (z. B. Elterncafe: Bei wem / Wo / Wann), Themen als Kacheln, Kontaktkarte */
.cafe-fakten li{flex:1 1 220px}
.fakt-wert{display:block;font-weight:var(--fett);margin-top:2px}
.themen-liste{list-style:none;margin:12px 0 1.2em;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.themen-liste li{border:1px solid var(--grau-linie);border-radius:var(--rund);padding:8px 14px;background:var(--weiss)}
.kontakt-karte{max-width:360px}
.kontakt-karte p{margin:8px 0 0}
/* Knopfreihe in Beiträgen */
.knopf-reihe{display:flex;flex-wrap:wrap;gap:12px;margin:12px 0 1.6em}
.info-kasten h3.mit-ikon,.info-kasten h2.mit-ikon{margin-top:0}
/* Bilder in Beiträgen nebeneinander (statt Tabellen) */
.bild-raster{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(min(200px,45%),1fr));margin:16px 0 1.4em;padding:0}
.bild-raster img{display:block;width:100%;height:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--rund)}
.bild-raster p{margin:0}
.abschnitt{padding:clamp(24px,3.5vw,36px) 0 0;margin-top:clamp(24px,3.5vw,36px);border-top:1px solid var(--grau-linie)}
.hervorgehoben{font-family:var(--titel-schrift);font-weight:600;font-size:clamp(18px,1.8vw,21px);line-height:1.45}
.unterseiten a[aria-current="page"]:hover,.unterseiten .current > a:hover{text-decoration:none!important}
/* Zeitleiste (Schulgeschichte) */
.zeitleiste{list-style:none;margin:24px 0 0;padding:0}
.zeit-eintrag{display:grid;gap:6px 32px;padding:24px 0;border-top:1px solid var(--grau-linie)}
.zeit-eintrag:first-child{border-top:0;padding-top:0}
.zeit-jahr{font-family:var(--titel-schrift);font-weight:600;font-size:clamp(20px,2vw,24px);line-height:1.3;color:var(--dunkel);margin:0}
.zeit-text p:last-child{margin-bottom:0}
.zeit-bild{margin:4px 0 16px}
.zeit-bild img{display:block;width:100%;height:auto;border-radius:var(--rund)}
.zeit-bild figcaption{font-size:var(--gr-klein);margin-top:6px}
@media (min-width:900px){
  .zeit-eintrag{grid-template-columns:220px minmax(0,1fr)}
  .zeit-bild{float:right;width:min(340px,45%);margin:4px 0 12px 24px}
  .zeit-text::after{content:"";display:block;clear:both}
}
.download-gruppe{scroll-margin-top:110px}
.schwerpunkte{margin-bottom:1.4em}
.schwerpunkte li.mit-ikon{gap:14px}
.kontakt-bild img{display:block;width:100%;height:auto;border-radius:var(--rund)}
.fakten-liste{margin-bottom:1.4em}
.schwerpunkte-text li{font-family:var(--schrift);font-size:var(--gr-text);font-weight:var(--fett);line-height:1.45}
/* Untermenü: beim Überfahren nur unterstreichen, kein grauer Hintergrund */
.hauptmenue .mod-menu__sub a:hover,.hauptmenue .mod-menu__sub a:focus{background:none!important;text-decoration:underline;text-underline-offset:4px}
@media (min-width:900px){.kontakt-spalten.kontakt-einspaltig{grid-template-columns:minmax(0,1fr)}}
.bild-text{align-items:start}
.bild-text h2.mit-ikon:first-child{margin-top:0}
p.mit-ikon{gap:14px}
/* Schnellzugriff Startseite: Mensa (statt Sekretariat, Telefon steht in der Kopfzeile) */
.schnell-mensa{--maske:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M8%203v18M5%203v5a3%203%200%200%200%206%200V3M17%2021V3c-2%201-3%203.5-3%207s1%204%203%204%22%2F%3E%3C%2Fsvg%3E")}
/* Joomla-Masonry (Blog mit Spaltenreihenfolge): Karten immer volle Spaltenbreite, auch bei kurzem Text */
.variante-b .blog-items[class*="masonry-"] > .blog-item{display:block;width:100%}
.unterseiten .categories-module li.active > a{background:var(--dunkel)!important;border-color:var(--dunkel)!important;color:#fff!important;text-decoration:none!important}
/* Barrierefreiheit wie im Handbuch: keine kleine Schrift auf Orange.
   Nummern-Kreise weiß mit orangem Rahmen und dunkler Zahl (13,5 : 1) */
.fv-schritte li::before,.fv-sprung span,.fv-nr{background:var(--weiss);border:2px solid var(--orange);color:var(--dunkel);box-sizing:border-box}
/* Krankmeldung (Startseite): hellgrau statt Orange, Symbol bleibt orange */
.box-krankmeldung{background:var(--grau-hell);color:var(--dunkel)}
.box-krankmeldung .modul-titel::before{background:var(--orange)}
/* Zahlenband (Startseite): hellgrau statt Orange, kleine Beschriftung sonst nicht lesbar */
.b-zahlen{background:var(--grau-hell);color:var(--dunkel)}
/* Startbild: auf breiten Bildschirmen nur den Himmel beschneiden, die Schule mit Arkaden bleibt sichtbar */
@media (min-width:768px){.b-held{aspect-ratio:auto;height:min(64.8vw,92vh);height:min(64.8vw,92svh);min-height:520px}.b-held-bild{object-position:50% 100%}}
/* Kontaktzeile oben: mehr Luft zwischen Text und Trennlinie */
.b-kontaktzeile .innen{padding-top:10px;padding-bottom:14px}
/* Hervorgehobener Kasten (pre) in Beiträgen: normale Schrift, bricht auf dem Handy um */
.seite-inhalt pre{font-family:var(--schrift);font-size:inherit;line-height:1.6;color:var(--dunkel);white-space:pre-wrap;overflow-wrap:anywhere;word-break:normal;background:var(--grau-hell);border:0;border-radius:var(--rund);padding:18px 22px;margin:0 0 1.4em;max-width:100%;overflow:visible}
.seite-inhalt pre strong{font-family:var(--titel-schrift);font-weight:600;font-size:1.1em}
/* Zitat (blockquote): hellgrauer Kasten mit großem orangem Anführungszeichen */
.seite-inhalt blockquote{position:relative;margin:0 0 1.4em;padding:20px 24px 20px 64px;background:var(--grau-hell);border-radius:var(--rund);font-family:var(--titel-schrift);font-size:clamp(17px,1.6vw,19px);line-height:1.5}
.seite-inhalt blockquote::before{content:"„";position:absolute;left:20px;top:-6px;font-size:64px;line-height:1;color:var(--orange);font-family:var(--titel-schrift)}
.seite-inhalt blockquote p:last-child{margin-bottom:0}
@media (max-width:599px){.seite-inhalt pre{padding:14px 16px}.seite-inhalt blockquote{padding:16px 16px 16px 48px}.seite-inhalt blockquote::before{left:12px;font-size:52px}}
/* Zurück-Link auf Detailseiten */
.zurueck-link{margin:0 0 18px}
.zurueck-link a{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border:1px solid var(--grau-linie);border-radius:6px;text-decoration:none;color:var(--dunkel);font-size:var(--gr-klein);font-weight:var(--halbfett);background:#fff}
.zurueck-link a:hover,.zurueck-link a:focus-visible{border-color:var(--orange)}
/* SYMBOLE-ANFANG */
/* Symbole für Beiträge (support@home): Klasse mit-ikon + ikon-NAME an Überschrift oder Listenpunkt, Farbe immer CI-Orange */
.mit-ikon{display:flex;align-items:center;gap:12px}
.mit-ikon::before{content:"";flex:none;width:36px;height:36px;background:var(--orange);-webkit-mask:var(--ikon) center/contain no-repeat;mask:var(--ikon) center/contain no-repeat}
li.mit-ikon::before{width:28px;height:28px}
.ikon-gross::before{width:48px;height:48px}
.ikon-herz{--ikon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%2020s-7-4.5-7-10a4%204%200%200%201%207-2.6A4%204%200%200%201%2019%2010c0%205.5-7%2010-7%2010z%22%2F%3E%3C%2Fsvg%3E")}
.ikon-menschen{--ikon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%229%22%20cy%3D%228%22%20r%3D%223%22%2F%3E%3Cpath%20d%3D%22M3%2020a6%206%200%200%201%2012%200%22%2F%3E%3Ccircle%20cx%3D%2217%22%20cy%3D%229%22%20r%3D%222.5%22%2F%3E%3Cpath%20d%3D%22M16%2014.1A5%205%200%200%201%2021%2019%22%2F%3E%3C%2Fsvg%3E")}
.ikon-buch{--ikon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%2019.5V5a2%202%200%200%201%202-2h12v18H6a2%202%200%200%201-2-1.5zM4%2019.5A2%202%200%200%201%206%2018h12%22%2F%3E%3Cpath%20d%3D%22M9%207h6M9%2010.5h4%22%2F%3E%3C%2Fsvg%3E")}
.ikon-abschluss{--ikon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M2%209l10-5%2010%205-10%205z%22%2F%3E%3Cpath%20d%3D%22M6%2011v5c3%202.5%209%202.5%2012%200v-5M22%209v6%22%2F%3E%3C%2Fsvg%3E")}
.ikon-ziel{--ikon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%229%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%225%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%221%22%2F%3E%3C%2Fsvg%3E")}
.ikon-pokal{--ikon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M8%204h8v5a4%204%200%200%201-8%200zM8%206H5a3%203%200%200%200%203%204M16%206h3a3%203%200%200%201-3%204M12%2013v4M8%2021h8M10%2017h4v4h-4z%22%2F%3E%3C%2Fsvg%3E")}
.ikon-uhr{--ikon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%229%22%2F%3E%3Cpath%20d%3D%22M12%207v5l3%202%22%2F%3E%3C%2Fsvg%3E")}
.ikon-kalender{--ikon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%225%22%20width%3D%2218%22%20height%3D%2216%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M3%2010h18M8%203v4M16%203v4%22%2F%3E%3C%2Fsvg%3E")}
.ikon-besteck{--ikon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M8%203v18M5%203v5a3%203%200%200%200%206%200V3M17%2021V3c-2%201-3%203.5-3%207s1%204%203%204%22%2F%3E%3C%2Fsvg%3E")}
.ikon-sprechen{--ikon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%205h11v8H8l-3%203v-3H3z%22%2F%3E%3Cpath%20d%3D%22M10%2016v1h6l3%203v-3h2V9h-5%22%2F%3E%3C%2Fsvg%3E")}
.ikon-dokument{--ikon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M6%203h8l4%204v14H6zM14%203v4h4M9%2012h6M9%2016h6%22%2F%3E%3C%2Fsvg%3E")}
.ikon-haus{--ikon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%2011l9-7%209%207M5%2010v10h14V10M10%2020v-6h4v6%22%2F%3E%3C%2Fsvg%3E")}
.ikon-stern{--ikon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%203l2.7%205.6%206.1.9-4.4%204.3%201%206.1L12%2017l-5.4%202.9%201-6.1-4.4-4.3%206.1-.9z%22%2F%3E%3C%2Fsvg%3E")}
.ikon-idee{--ikon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M9%2018h6M10%2021h4M12%203a6%206%200%200%200-4%2010.5c.8.8%201%201.5%201%202.5h6c0-1%20.2-1.7%201-2.5A6%206%200%200%200%2012%203z%22%2F%3E%3C%2Fsvg%3E")}
.ikon-verbindung{--ikon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M10%2014a4%204%200%200%200%205.7%200l3-3a4%204%200%200%200-5.7-5.7l-1%201M14%2010a4%204%200%200%200-5.7%200l-3%203a4%204%200%200%200%205.7%205.7l1-1%22%2F%3E%3C%2Fsvg%3E")}
.ikon-koffer{--ikon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%227%22%20width%3D%2218%22%20height%3D%2213%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M9%207V5a1%201%200%200%201%201-1h4a1%201%200%200%201%201%201v2M3%2012h18%22%2F%3E%3C%2Fsvg%3E")}
.ikon-pinsel{--ikon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M14%204l6%206-8%208-6-6zM6%2012l-2.5%202.5a2.5%202.5%200%200%200%203.5%203.5L9.5%2015.5%22%2F%3E%3C%2Fsvg%3E")}
.ikon-geraete{--ikon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%222%22%20y%3D%224%22%20width%3D%2214%22%20height%3D%2210%22%20rx%3D%221%22%2F%3E%3Cpath%20d%3D%22M5%2018h8%22%2F%3E%3Crect%20x%3D%2216%22%20y%3D%229%22%20width%3D%226%22%20height%3D%2211%22%20rx%3D%221.5%22%2F%3E%3Cpath%20d%3D%22M18.5%2017.5h1%22%2F%3E%3C%2Fsvg%3E")}
.ikon-zug{--ikon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%225%22%20y%3D%223%22%20width%3D%2214%22%20height%3D%2213%22%20rx%3D%223%22%2F%3E%3Cpath%20d%3D%22M5%2010h14M9%203v7M15%203v7%22%2F%3E%3Ccircle%20cx%3D%229%22%20cy%3D%2213%22%20r%3D%22.8%22%2F%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%2213%22%20r%3D%22.8%22%2F%3E%3Cpath%20d%3D%22M8%2016l-2.5%205M16%2016l2.5%205M6.5%2019h11%22%2F%3E%3C%2Fsvg%3E")}
.ikon-schloss{--ikon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%225%22%20y%3D%2210%22%20width%3D%2214%22%20height%3D%2211%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M8%2010V7a4%204%200%200%201%208%200v3M12%2014v3%22%2F%3E%3C%2Fsvg%3E")}
/* SYMBOLE-ENDE */
/* Zurück-Button in der Unterseiten-Leiste: links neben den Unterseiten */
.unterseiten.mit-zurueck{display:flex;flex-wrap:wrap;align-items:flex-start;gap:8px}
.unterseiten.mit-zurueck .zurueck-link{margin:0}
.unterseiten.mit-zurueck .zurueck-link a{padding:7px 14px}
/* Seitenzahlen (Blätter-Navigation) in CI statt Joomla-Blau: wie die Unterseiten-Buttons */
.moerike .pagination{display:flex;flex-wrap:wrap;gap:6px;padding:0;margin:24px 0}
.moerike .pagination .page-link{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:0 12px;border:1px solid var(--grau-linie);border-radius:6px!important;background:#fff;color:var(--dunkel);font-weight:var(--fett);text-decoration:none;box-shadow:none}
.moerike .pagination .page-link:hover,.moerike .pagination .page-link:focus-visible{border-color:var(--orange);background:#fff;color:var(--dunkel)}
.moerike .pagination .active .page-link,.moerike .pagination .page-item.active > .page-link{background:var(--dunkel);border-color:var(--dunkel);color:#fff}
.moerike .pagination .disabled .page-link{background:var(--grau-hell);border-color:var(--grau-hell);color:var(--grau-text,#6b6b6b)}
.moerike .com-content-category-blog__counter,.moerike .counter{font-size:var(--gr-klein)}
/* Einleitungsbild (Liste) und Beitragsbild (Detail) aus „Bilder und Links“: einheitlich, ohne Umfließen */
.moerike .blog-item > .item-image,.moerike .com-content-article .item-image{float:none!important;margin:0 0 18px!important;width:100%;max-width:100%}
.moerike .blog-item > .item-image img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:var(--rund)}
.moerike .com-content-article .item-image img{display:block;width:100%;height:auto;max-height:520px;object-fit:cover;border-radius:var(--rund)}
.moerike .item-image figcaption{font-size:var(--gr-klein);margin-top:6px}
/* Liste: Einleitungsbild ab Tablet links neben dem Text (ca. ein Drittel, 4:3), auf dem Handy darüber */
@media (min-width:768px){
  .moerike .blog-item:has(> .item-image){display:grid;grid-template-columns:minmax(0,34%) minmax(0,1fr);gap:0 28px;align-items:start}
  .moerike .blog-item > .item-image{margin:0!important}
  .moerike .blog-item > .item-image img{aspect-ratio:4/3}
}
.moerike .com-content-article .item-image img{cursor:zoom-in}
/* Handy: Platz unter dem Fußbereich, damit die schwebenden Buttons (DSGVO, Bedienungshilfe, nach oben) keine Links verdecken */
@media (max-width:767px){
  .fuss-unten{padding-bottom:120px!important}
}
/* Handy-Menü (Burger): Hauptpunkte fett, Unterpunkte normal */
@media (max-width:1099px){
  .moerike .hauptmenue > ul > li > a,.moerike .hauptmenue > ul > li > .nav-header,.moerike .hauptmenue > ul > li > .mod-menu__heading{font-weight:var(--fett)}
  .moerike .hauptmenue .mod-menu__sub a,.moerike .hauptmenue .mod-menu__sub .nav-header{font-weight:400}
}