:root{
  --gruen:#3e5a4c; --gruen-dunkel:#314a3e; --gruen-hell:#eef2ef;
  --ink:#26332b; --muted:#61705f; --line:#e2e8de; --bg:#ffffff; --sand:#f5f7f3;
  --maxw:1300px; --radius:14px; --schatten:0 14px 34px rgba(35,60,45,.12);
}
*{box-sizing:border-box; margin:0; padding:0}
html{scroll-behavior:smooth}
body{font-family:'Encode Sans',system-ui,sans-serif; color:var(--ink); background:var(--bg); line-height:1.6}
img{max-width:100%; display:block}
a{color:var(--gruen); text-decoration:none}

/* ---------- Kopf ---------- */
.kopf{position:sticky; top:0; z-index:60; background:#fff; border-bottom:1px solid var(--line); box-shadow:0 2px 14px rgba(20,60,20,.05)}
.kopf-innen{max-width:var(--maxw); margin:0 auto; padding:10px 24px; display:flex; align-items:center; gap:16px}
.marke img{height:66px; width:auto}
.hauptnav{display:flex; align-items:center; gap:0; margin-left:auto; flex-wrap:nowrap}
.nav-item{position:relative}
.nav-item>a{display:flex; align-items:center; gap:4px; white-space:nowrap; padding:11px 9px; color:#333; font-family:'Encode Sans Condensed','Encode Sans',sans-serif;
  font-weight:600; font-size:.92rem; text-transform:uppercase; letter-spacing:.01em}
.nav-item>a:hover{color:var(--gruen)}
.nav-item .pf{font-size:.7em; color:var(--muted)}
/* "Bei uns" (Partner/Sponsoren) dezent hervorheben: kleiner grüner Punkt vor dem Label */
.nav-item.nav-hervor>a::before{content:""; flex:0 0 auto; width:7px; height:7px; border-radius:50%; background:var(--gruen)}
.nav-item.nav-hervor>a{color:var(--gruen)}
/* dasselbe im mobilen Menü */
.mn-haupt.nav-hervor{color:var(--gruen)}
.mn-haupt.nav-hervor::before{content:"\2022"; color:var(--gruen); margin-right:8px}
.dropdown{position:absolute; top:100%; left:0; min-width:250px; background:#fff; border:1px solid var(--line);
  border-radius:12px; box-shadow:var(--schatten); padding:8px; opacity:0; visibility:hidden; transform:translateY(6px);
  transition:opacity .16s, transform .16s}
.nav-item:hover .dropdown{opacity:1; visibility:visible; transform:translateY(0)}
.dropdown a{display:block; padding:9px 12px; border-radius:8px; color:var(--ink); font-weight:600; font-size:.9rem}
.dropdown a:hover{background:var(--gruen-hell); color:var(--gruen-dunkel)}

.burger{display:none; flex-direction:column; gap:5px; background:none; border:0; cursor:pointer; padding:8px; margin-left:auto}
.burger span{width:26px; height:3px; background:var(--gruen); border-radius:2px}
.mobilnav{display:none}

/* ---------- Suche im Header ---------- */
.kopf-suche{position:relative; display:flex; align-items:center}
.such-knopf{display:flex; align-items:center; justify-content:center; width:40px; height:40px; border:0; background:none; color:var(--gruen-dunkel); cursor:pointer; border-radius:50%}
.such-knopf:hover{background:var(--gruen-hell)}
.such-feld{width:0; overflow:hidden; transition:width .22s ease}
.kopf-suche.offen .such-feld{width:220px; margin-left:6px}
.such-feld input{width:100%; border:0; border-bottom:2px solid var(--gruen); background:none; padding:8px 4px; font-size:.98rem; font-family:inherit; color:var(--ink); outline:none}
.such-feld input::placeholder{color:var(--muted)}
.mobil-suche{display:flex; gap:8px; padding:12px 0}
.mobil-suche input{flex:1; border:1px solid var(--line); border-radius:8px; padding:11px 14px; font-size:1rem; font-family:inherit; color:var(--ink); outline:none}
.mobil-suche input:focus{border-color:var(--gruen)}
.mobil-suche button{display:flex; align-items:center; justify-content:center; width:46px; border:0; background:var(--gruen); color:#fff; border-radius:8px; cursor:pointer}

/* ---------- Drehtermin-Alarm ---------- */
.beitrag-text .dreh-alarm{background:var(--gruen-hell); border:1px solid var(--line); border-left:4px solid var(--gruen); border-radius:var(--radius); padding:22px 24px; margin:26px 0}
.da-titel{display:block; font-weight:800; color:var(--gruen-dunkel); font-size:1.15rem; margin-bottom:4px}
.beitrag-text .dreh-alarm .da-text p{margin:0 0 14px; color:var(--ink); font-size:1rem}
.da-form{display:flex; gap:10px; flex-wrap:wrap}
.da-form input[type=email]{flex:1; min-width:200px; border:1px solid var(--line); border-radius:8px; padding:12px 14px; font-size:1rem; font-family:inherit; color:var(--ink); outline:none}
.da-form input[type=email]:focus{border-color:var(--gruen)}
.da-form button{border:0; background:var(--gruen); color:#fff; font-weight:700; padding:12px 22px; border-radius:8px; cursor:pointer; font-size:1rem}
.da-form button:hover{background:var(--gruen-dunkel)}
.da-form button:disabled{opacity:.7; cursor:default}
.da-hp{position:absolute; left:-9999px; width:1px; height:1px; opacity:0}
.beitrag-text .dreh-alarm .da-hinweis{margin:12px 0 0; font-size:.85rem; color:var(--muted)}
.beitrag-text .dreh-alarm .da-danke{margin:0; font-weight:600; color:var(--gruen-dunkel)}

/* ---------- Suchergebnis-Seite ---------- */
.such-seite{max-width:820px; margin:0 auto; padding:54px 24px 70px}
.such-seite h1{font-size:2rem; font-weight:800; color:var(--gruen-dunkel); margin:0 0 22px}
.suche-gross{display:flex; gap:10px; margin-bottom:26px}
.suche-gross input{flex:1; border:2px solid var(--line); border-radius:10px; padding:14px 18px; font-size:1.1rem; font-family:inherit; color:var(--ink); outline:none}
.suche-gross input:focus{border-color:var(--gruen)}
.suche-gross button{border:0; background:var(--gruen); color:#fff; font-weight:700; padding:0 26px; border-radius:10px; cursor:pointer; font-size:1rem}
.suche-gross button:hover{background:var(--gruen-dunkel)}
.such-hinweis{color:var(--muted); font-size:1.08rem}
.such-treffer-zahl{color:var(--muted); margin-bottom:22px}
.such-gruppe{margin-bottom:30px}
.such-gruppe h2{font-size:1.15rem; font-weight:700; color:var(--gruen-dunkel); margin:0 0 6px; display:flex; align-items:center; gap:9px}
.such-gruppe-zahl{background:var(--gruen-hell); color:var(--gruen-dunkel); font-size:.8rem; font-weight:700; padding:2px 9px; border-radius:20px}
.such-liste{list-style:none; margin:0; padding:0}
.such-treffer{display:block; padding:14px 4px; border-bottom:1px solid var(--line)}
.such-treffer:hover{background:var(--sand)}
.st-titel{display:block; font-weight:700; color:var(--ink); font-size:1.08rem}
.st-auszug{display:block; color:var(--muted); font-size:.95rem; margin-top:3px}
.st-auszug mark, .such-treffer mark{background:#fff2b8; color:inherit; padding:0 2px; border-radius:3px}
@media (max-width:1180px){ .kopf-suche{display:none} }

/* ---------- Hero ---------- */
.hero{position:relative; min-height:100vh; display:flex; align-items:center; justify-content:center;
  background-size:cover; background-position:center; background-attachment:fixed; text-align:center; color:#fff}
.hero::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(15,40,15,.18), rgba(15,40,15,.52))}
.hero-inner{position:relative; z-index:2; max-width:1180px; padding:60px 24px}
.hero-inner h1{font-weight:700; font-size:clamp(2rem,4.6vw,4rem); line-height:1.08; letter-spacing:-.01em; white-space:nowrap; text-shadow:0 3px 22px rgba(0,0,0,.45)}
.hero-inner p{margin-top:22px; font-size:clamp(1.05rem,1.8vw,1.35rem); font-weight:400; text-shadow:0 2px 14px rgba(0,0,0,.4); opacity:.96}
.hero-cta{margin-top:30px; display:inline-flex; gap:14px; flex-wrap:wrap; justify-content:center}

/* ---------- Buttons ---------- */
.btn{display:inline-block; background:var(--gruen); color:#fff; font-weight:700; padding:13px 26px; border-radius:8px;
  font-size:.95rem; transition:background .18s}
.btn:hover{background:var(--gruen-dunkel)}
.btn-weiss{background:#fff; color:var(--gruen-dunkel)}
.btn-weiss:hover{background:#f0f0f0}

/* ---------- Abschnitte ---------- */
.abschnitt{max-width:var(--maxw); margin:0 auto; padding:70px 24px}
.abschnitt.sand{max-width:none; background:var(--sand)}
.abschnitt.sand>*{max-width:var(--maxw); margin-left:auto; margin-right:auto}
.kopfzeile{text-align:center; max-width:760px; margin:0 auto 44px}
.kopfzeile h2{font-size:clamp(1.9rem,3.6vw,2.7rem); font-weight:800; color:var(--gruen-dunkel)}
.kopfzeile p{margin-top:12px; color:var(--muted); font-size:1.1rem}
.intro{text-align:center; max-width:820px; margin:0 auto; font-size:1.2rem; color:var(--ink)}
.intro strong{color:var(--gruen-dunkel)}

/* Karten-Raster */
.raster{display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:26px}
.karte{background:#fff; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden;
  box-shadow:0 8px 22px rgba(20,60,20,.06); transition:transform .18s, box-shadow .18s}
.karte:hover{transform:translateY(-4px); box-shadow:var(--schatten)}
.karte-bild{aspect-ratio:3/2; overflow:hidden}
.karte-bild img{width:100%; height:100%; object-fit:cover}
.karte-text{padding:20px 22px}
.karte-text .tag{display:inline-block; background:var(--gruen-hell); color:var(--gruen-dunkel); font-weight:700;
  font-size:.72rem; text-transform:uppercase; letter-spacing:.05em; padding:4px 11px; border-radius:999px}
.karte-text h3{margin:11px 0 7px; font-size:1.3rem; font-weight:700; color:var(--ink)}
.karte-text p{color:var(--muted); font-size:.98rem}

/* ---------- Fuss ---------- */
.fuss{background:#3e5a4c; color:#d7e2da}
.fuss-innen{max-width:var(--maxw); margin:0 auto; padding:60px 24px 44px; display:grid;
  grid-template-columns:1.6fr 1fr 1fr 1fr 1.4fr; gap:40px}
.fuss-marke img{height:92px; width:auto; margin-bottom:16px; filter:brightness(0) invert(1); opacity:.95}
.fuss-marke p{font-size:.98rem; opacity:.88; max-width:340px; line-height:1.65}
.fuss-social-row{display:flex; gap:12px; margin-top:20px; flex-wrap:wrap}
.fuss-social-row a{width:42px; height:42px; display:inline-flex; align-items:center; justify-content:center;
  border:1px solid rgba(255,255,255,.3); border-radius:50%; color:#fff; transition:background .16s}
.fuss-social-row a:hover{background:rgba(255,255,255,.16)}
.fuss-social-row svg{width:20px; height:20px; fill:currentColor}
.fuss-titel{display:block; color:#fff; font-family:'Encode Sans Condensed','Encode Sans',sans-serif; font-weight:600;
  font-size:1.02rem; text-transform:uppercase; letter-spacing:.05em; margin-bottom:15px}
.fuss-spalte a{display:block; color:#d7e2da; padding:6px 0; font-size:.96rem}
.fuss-spalte a:hover{color:#fff; padding-left:4px; transition:padding .15s}
.fuss-copy{border-top:1px solid rgba(255,255,255,.16); text-align:center; padding:22px; font-size:.86rem; opacity:.8}
.fuss-copy a{color:#d7e2da}
.fuss-nl-text{font-size:.92rem; opacity:.88; line-height:1.55; margin:0 0 14px}
.fuss-nl-opt{display:block; font-size:.9rem; margin-bottom:8px; cursor:pointer; color:#d7e2da}
.fuss-nl-opt input{margin-right:8px; vertical-align:middle; accent-color:#fff}
.fuss-nl-input{display:block; width:100%; box-sizing:border-box; padding:10px 12px; border:none;
  border-radius:6px; font-size:.92rem; margin-bottom:10px; font-family:inherit}
.fuss-nl-btn{display:block; width:100%; background:#fff; color:#2d5a3d; border:none; border-radius:6px;
  padding:10px 16px; font-size:.92rem; font-weight:700; cursor:pointer; transition:background .16s}
.fuss-nl-btn:hover{background:#eef3ef}

/* ---------- Mobil ---------- */
@media (max-width:1180px){
  .hauptnav{display:none}
  .burger{display:flex}
  .mobilnav{display:none; flex-direction:column; padding:10px 24px calc(20px + env(safe-area-inset-bottom)); background:#fff; border-top:1px solid var(--line)}
  /* Bei offenem Menü: Header als Vollbild-Overlay, Menü scrollt selbst, Hintergrund gesperrt. */
  body.nav-offen{overflow:hidden}
  body.nav-offen .kopf{position:fixed; inset:0; display:flex; flex-direction:column}
  body.nav-offen .mobilnav{display:flex; flex:1; min-height:0; overflow-y:auto; -webkit-overflow-scrolling:touch; overscroll-behavior:contain}
  .mn-haupt{padding:12px 0; font-weight:700; text-transform:uppercase; font-size:.9rem; color:var(--ink); border-top:1px solid var(--line)}
  .mn-sub{padding:7px 0 7px 16px; color:var(--muted); font-size:.92rem}
  .fuss-innen{grid-template-columns:1fr 1fr; gap:26px}
  .hero{background-attachment:scroll; min-height:78vh; background-position:center top}
  .hero-inner h1{white-space:normal; font-size:clamp(1.9rem,7vw,2.8rem)}
}
@media (max-width:620px){
  .fuss-innen{grid-template-columns:1fr}
  .marke img{height:48px}
}

/* ---------- Seitenkopf (Uebersichtsseiten) ---------- */
.kicker-hell{display:inline-block; color:#fff; font-family:'Encode Sans Condensed','Encode Sans',sans-serif;
  font-weight:600; text-transform:uppercase; letter-spacing:.08em; font-size:.9rem; opacity:.9; margin-bottom:10px}
.seite-kopf{background:linear-gradient(135deg, var(--gruen-dunkel), var(--gruen)); color:#fff; padding:64px 24px}
.seite-kopf-innen{max-width:var(--maxw); margin:0 auto}
.seite-kopf h1{font-weight:700; font-size:clamp(2rem,4vw,3rem); letter-spacing:-.01em}
.seite-kopf p{margin-top:12px; font-size:1.15rem; opacity:.92; max-width:640px}

/* ---------- Detail-Hero ---------- */
.detail-hero{min-height:56vh; display:flex; align-items:flex-end; background-size:cover; background-position:center; color:#fff}
.detail-hero-innen{max-width:var(--maxw); width:100%; margin:0 auto; padding:0 24px 54px}
.detail-hero-innen p{max-width:65ch}
.detail-hero h1{font-weight:700; font-size:clamp(2.2rem,4.6vw,3.6rem); line-height:1.06; letter-spacing:-.01em; text-shadow:0 3px 20px rgba(0,0,0,.4)}
.detail-hero p{margin-top:14px; font-size:1.2rem; max-width:680px; text-shadow:0 2px 14px rgba(0,0,0,.4)}

/* ---------- Beitrag ---------- */
.breadcrumb{max-width:var(--maxw); margin:0 auto; padding:20px 24px 0}
.breadcrumb-innen{font-size:.85rem; color:var(--muted); display:flex; flex-wrap:wrap; align-items:center; gap:7px; line-height:1.4}
.breadcrumb a{color:var(--gruen); text-decoration:none; font-weight:600}
.breadcrumb a:hover{text-decoration:underline}
.bc-sep{color:var(--muted); opacity:.5}
.bc-current{color:var(--muted)}
.breadcrumb + .beitrag{padding-top:26px}
.beitrag{max-width:var(--maxw); margin:0 auto; padding:60px 24px; display:grid; grid-template-columns:1fr 320px; gap:48px; align-items:start}
.beitrag-voll{grid-template-columns:1fr}
.beitrag-text{font-size:1.13rem; line-height:1.72; color:#2a352a}
.beitrag-text p{margin:0 0 20px}
.beitrag-text > :first-child{margin-top:0}
.beitrag-text p a:not(.btn):not(.ext-link):not(.tel-link), .beitrag-text li a:not(.btn):not(.ext-link):not(.tel-link), .beitrag-text .faq-a a:not(.btn):not(.ext-link){color:var(--gruen-dunkel); text-decoration:underline; text-decoration-color:rgba(62,90,76,.4); text-underline-offset:3px; text-decoration-thickness:1px}
.beitrag-text p a:not(.btn):hover, .beitrag-text li a:not(.btn):hover{text-decoration-color:var(--gruen)}
.beitrag-text .abschnitt-h{font-size:1.85rem; font-weight:800; color:var(--gruen-dunkel); margin:46px 0 18px; letter-spacing:-.015em; line-height:1.18}
.beitrag-text .abschnitt-h::after{content:''; display:block; width:54px; height:3px; margin-top:12px; background:var(--gruen); border-radius:2px}
.beitrag-text .abschnitt-eyebrow + .abschnitt-h::after,.beitrag-text .abschnitt-h3::after{content:none}
.beitrag-text .abschnitt-h3{font-size:1.28rem; font-weight:700; color:var(--ink); margin:32px 0 10px; line-height:1.25}
/* Eyebrow-Kicker über einer Abschnittsüberschrift, als Einheit mit der Überschrift */
.beitrag-text .abschnitt-eyebrow{display:flex; align-items:center; gap:10px; font-size:.75rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--gruen); margin:54px 0 0}
.beitrag-text .abschnitt-eyebrow::before{content:''; flex:0 0 auto; width:26px; height:2px; background:var(--gruen); border-radius:2px}
.beitrag-text .abschnitt-eyebrow + .abschnitt-h{margin-top:8px}
.beitrag-text .abschnitt-eyebrow + .abschnitt-h3{margin-top:6px}
/* Anzeige-Hinweis (Sponsored) */
.beitrag-text .anzeige-hinweis{display:inline-flex; align-items:center; gap:8px; font-size:.82rem; color:var(--muted); margin:0 0 22px}
.anzeige-hinweis span{background:var(--gruen-hell); color:var(--gruen-dunkel); font-weight:700; text-transform:uppercase; letter-spacing:.05em; font-size:.7rem; padding:2px 8px; border-radius:5px}
/* Fakten-Box (Auf einen Blick) */
.beitrag-text .fakten-box{margin:24px 0; background:var(--sand); border:1px solid var(--line); border-radius:var(--radius); padding:6px 24px; display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:0 36px}
.fb-zeile{padding:13px 2px; border-bottom:1px solid var(--line)}
.beitrag-text .fb-zeile dt{font-size:.74rem; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:var(--gruen); margin:0 0 3px}
.beitrag-text .fb-zeile dd{margin:0; color:var(--ink)}
.fb-zeile.fb-breit{grid-column:1 / -1}
.fb-zeile.fb-breit dd{font-weight:600}
@media (max-width:540px){ .beitrag-text .fakten-box{grid-template-columns:1fr; gap:0} }
/* Kontakt-Zeile mit Telefon */
.beitrag-text .kontakt-zeile{display:flex; align-items:baseline; flex-wrap:wrap; gap:6px 10px; background:var(--gruen-hell); border-left:3px solid var(--gruen); border-radius:8px; padding:14px 18px; margin:22px 0; font-size:1rem; color:var(--ink); overflow-wrap:anywhere}
.kz-ico{color:var(--gruen); font-size:1.1rem}
.tel-link{font-weight:700; white-space:nowrap}
.beitrag-text .foto-credit{font-size:.82rem; font-style:italic; color:var(--muted); margin:8px 0 0}
.bild-credit{font-size:.76rem; font-style:italic; color:var(--muted)}
.beitrag-text .bildreihe{display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:16px; margin:24px 0}
.br-item{margin:0}
.br-item img{width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:var(--radius); display:block}
.br-item figcaption{margin-top:6px; font-size:.82rem; color:var(--muted)}
.beitrag-text .inline-bild{margin:24px 0}
.beitrag-text .inline-bild img{border-radius:var(--radius)}
.beitrag-text figcaption{margin-top:8px; font-size:.9rem; color:var(--muted)}
.fakten{background:var(--sand); border:1px solid var(--line); border-radius:var(--radius); padding:22px 26px 26px; position:sticky; top:110px}
.fakten h3{font-size:1.12rem; font-weight:800; color:var(--gruen-dunkel); margin:0 0 8px; padding-bottom:12px; border-bottom:2px solid var(--gruen)}
.fakten dl{margin:0}
.fakten dt{font-weight:700; color:var(--gruen); font-size:.72rem; text-transform:uppercase; letter-spacing:.06em; margin-top:16px}
.fakten dd + dt{padding-top:16px; border-top:1px solid var(--line)}
.fakten dd{margin:3px 0 0; color:var(--ink)}
@media (max-width:900px){ .beitrag{grid-template-columns:1fr} .fakten{position:static} }

/* Fakten oben als Pillen (statt Sidebar), gesamte Seite */
.beitrag-text .fakten-pillen{display:flex; flex-wrap:wrap; gap:10px; margin:0 0 32px}
.fakten-pillen .fakt-pill{display:inline-flex; align-items:baseline; gap:8px; background:var(--gruen-hell); border:1px solid var(--line); border-radius:999px; padding:8px 16px; font-size:.98rem; line-height:1.3}
.fakten-pillen .fakt-pill .fp-label{font-size:.68rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:var(--gruen)}
.fakten-pillen .fakt-pill .fp-wert{color:var(--ink); font-weight:600}
.fakten-pillen .fakt-pill a{color:var(--gruen-dunkel)}
@media(max-width:540px){ .fakten-pillen .fakt-pill{font-size:.9rem; padding:7px 13px} }

/* Instagram-Video: Kennzeichnung wie im Original (Folgen-Button + Musik-Credit) */
.insta-video .insta-block{text-align:center; margin-top:14px}
.insta-video .insta-text{font-size:.95rem; color:#3a3a3a; margin:0 0 10px}
.insta-video .insta-btn{display:inline-block; background:var(--gruen); color:#fff; padding:10px 22px; border-radius:8px; font-size:.9rem; font-weight:700; text-decoration:none}
.insta-video .insta-btn:hover{background:var(--gruen-dunkel)}
.insta-video .insta-musik{font-size:.64rem; color:#aaa; margin-top:12px}

/* Filmreihe "Geschichte 950" mit schrittweiser Freischaltung */
.beitrag-text .filmreihe{margin:30px 0}
.film-featured{background:var(--sand); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; margin-bottom:26px; position:relative; box-shadow:var(--schatten)}
.film-featured .film-neu{position:absolute; top:16px; left:16px; z-index:2; background:var(--gruen); color:#fff; font-family:'Encode Sans Condensed','Encode Sans',sans-serif; font-weight:700; font-size:.72rem; text-transform:uppercase; letter-spacing:.05em; padding:5px 13px; border-radius:999px}
.film-featured .film-video{aspect-ratio:16/9}
.film-featured .film-body{padding:22px 26px 26px}
.film-featured .film-titel{font-size:1.6rem}
.film-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:22px}
.film-card{background:#fff; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; display:flex; flex-direction:column}
.film-video{position:relative; aspect-ratio:16/9; background:#0c1410}
.film-video video{width:100%; height:100%; object-fit:cover; display:block}
.film-locked{background-size:cover; background-position:center; display:flex; align-items:center; justify-content:center}
.film-locked::after{content:''; position:absolute; inset:0; background:rgba(18,32,22,.58)}
.film-lock{position:relative; z-index:1; width:54px; height:54px; display:grid; place-items:center; border-radius:50%; background:rgba(255,255,255,.16); color:#fff; backdrop-filter:blur(2px)}
.film-card.is-locked .film-titel{color:var(--muted)}
.film-body{padding:16px 18px 18px; display:flex; flex-direction:column; gap:6px}
.film-kicker{font-family:'Encode Sans Condensed','Encode Sans',sans-serif; font-weight:700; font-size:.72rem; text-transform:uppercase; letter-spacing:.06em; color:var(--gruen)}
.film-titel{font-size:1.18rem; font-weight:700; color:var(--gruen-dunkel); margin:0; line-height:1.25}
.film-text{font-size:.98rem; line-height:1.55; color:#2a352a; margin:2px 0 0}
.film-credit{font-size:.8rem; color:var(--muted); font-style:italic; margin:4px 0 0}
.film-frei{font-size:.9rem; font-weight:600; color:var(--gruen); margin:2px 0 0; display:inline-flex; align-items:center; gap:6px}
.film-frei::before{content:'\1F512'; font-style:normal}
@media(max-width:600px){ .film-grid{grid-template-columns:1fr} .film-featured .film-titel{font-size:1.35rem} }

/* Termin-/Programmeinträge (Feste): Datum als abgesetzte Kopfzeile, Jahres-/Datumsziffern in Tabellenziffern */
.beitrag-text .termin{border-left:3px solid var(--gruen); padding:2px 0 2px 18px; margin:20px 0}
.termin .termin-kopf{display:flex; flex-wrap:wrap; align-items:baseline; gap:6px 12px; margin-bottom:5px}
.termin .termin-datum{font-family:'Encode Sans Condensed','Encode Sans',sans-serif; font-weight:800; font-size:.82rem; text-transform:uppercase; letter-spacing:.05em; color:var(--gruen); font-variant-numeric:lining-nums tabular-nums}
.termin .termin-titel{font-weight:700; font-size:1.12rem; color:var(--gruen-dunkel); line-height:1.2}
.termin .termin-text{margin:0; color:#2a352a}
.beitrag-text{font-variant-numeric:lining-nums proportional-nums}

/* Podcast-Folgen-Übersicht */
.beitrag-text .podcast-folgen{display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:22px; margin:28px 0}
.pf-karte{display:flex; flex-direction:column; background:#fff; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; text-decoration:none; transition:box-shadow .15s, transform .15s}
.pf-karte:hover{box-shadow:var(--schatten); transform:translateY(-2px)}
.pf-bild{aspect-ratio:1/1; overflow:hidden; background:var(--gruen-hell)}
.pf-bild img{width:100%; height:100%; object-fit:cover; display:block}
.pf-body{padding:15px 17px 17px; display:flex; flex-direction:column; gap:5px}
.pf-kat{align-self:flex-start; font-family:'Encode Sans Condensed','Encode Sans',sans-serif; font-weight:700; font-size:.68rem; text-transform:uppercase; letter-spacing:.05em; color:var(--gruen); background:var(--gruen-hell); border-radius:999px; padding:3px 11px}
.pf-titel{font-size:1.12rem; font-weight:700; color:var(--gruen-dunkel); margin:2px 0 0; line-height:1.25}
.pf-gast{font-size:.95rem; color:#2a352a; margin:0; font-weight:600}
.pf-datum{font-size:.85rem; color:var(--muted); margin:0}

/* ---------- Inhalts-Bausteine ---------- */
.beitrag-text .tp-podcast, .beitrag-text .tp-karte{margin:26px 0}
.pc-fassade{background:var(--gruen-hell); border:1px solid var(--line); border-radius:14px; padding:30px 26px; text-align:center}
.pc-fassade p{color:var(--muted); margin-bottom:14px}

.buchtipp{margin:30px 0; background:var(--sand); border:1px solid var(--line); border-radius:14px; padding:26px}
.buchtipp .tag{display:inline-block; background:var(--gruen); color:#fff; font-weight:700; font-size:.72rem; text-transform:uppercase; letter-spacing:.05em; padding:4px 12px; border-radius:999px; margin-bottom:16px}
.buch-innen{display:flex; gap:24px; align-items:flex-start}
.buch-cover{width:150px; flex:0 0 150px; border-radius:8px; box-shadow:0 8px 22px rgba(20,60,20,.2)}
.buch-text h3{font-size:1.35rem; color:var(--gruen-dunkel); font-weight:700}
.buch-autor{color:var(--muted); font-weight:600; margin:2px 0 10px}
.buch-meta{color:var(--muted); font-size:.9rem; margin-top:8px}
.buch-text .btn{margin-top:14px}

.karte-fassade{background:var(--gruen-hell); border:1px solid var(--line); border-radius:14px; padding:44px 26px; text-align:center}
.kf-hinweis{color:var(--muted); font-size:.88rem; margin-top:12px}
.karte-map{height:440px; border-radius:14px; overflow:hidden; z-index:1}
.karte-liste{list-style:none; margin:22px 0 0; padding:0; column-count:2; column-gap:48px}
.karte-liste li{color:var(--ink); font-weight:600; font-size:1.02rem; margin-bottom:18px; break-inside:avoid}
.karte-liste .mk-kopf{display:flex; align-items:center; gap:13px}
.mk-nr{display:inline-grid; place-items:center; width:30px; height:30px; flex:0 0 30px; border-radius:50%; background:var(--gruen); color:#fff; font-size:.9rem; font-weight:700}
.mk-audio{flex:none; font-size:.7rem; font-weight:700; letter-spacing:.02em; color:var(--gruen); background:var(--gruen-hell); border:1px solid var(--line); border-radius:999px; padding:2px 10px}
.mk-transcript{margin:8px 0 0 43px}
.mk-transcript summary{cursor:pointer; color:var(--gruen-dunkel); font-weight:700; font-size:.9rem; list-style:none; display:inline-flex; align-items:center; gap:6px}
.mk-transcript summary::-webkit-details-marker{display:none}
.mk-transcript summary::before{content:'\25B8'; transition:transform .15s}
.mk-transcript[open] summary::before{transform:rotate(90deg)}
.mk-transcript-body{margin-top:10px; font-weight:400; font-size:.98rem; line-height:1.62; color:#2a352a}
.mk-transcript-body p{margin:0 0 12px}
@media(max-width:640px){ .karte-liste{column-count:1} }

/* ---------- Audioguide (Stationen mit Audio und Nachlese-Text) ---------- */
.beitrag-text .audioguide{margin:26px 0; display:flex; flex-direction:column; gap:16px}
.beitrag-text .ag-station{background:#fff; border:1px solid var(--line); border-left:4px solid var(--gruen); border-radius:14px; padding:20px 22px}
.ag-kopf{display:flex; align-items:flex-start; gap:12px}
.ag-nr{flex:0 0 32px; width:32px; height:32px; border-radius:50%; background:var(--gruen); color:#fff; font-weight:700; font-size:1rem; display:flex; align-items:center; justify-content:center; margin-top:2px}
.beitrag-text .ag-titel{margin:0; font-size:1.2rem; color:var(--gruen-dunkel); line-height:1.25}
.beitrag-text .ag-titel::after{display:none}
.ag-sub{display:block; font-weight:600; font-size:.92rem; color:var(--muted); margin-top:2px}
.beitrag-text .ag-teaser{margin:12px 0 0; color:var(--ink); font-size:1rem; line-height:1.6}
.beitrag-text .ag-bild{margin:16px 0 0}
.beitrag-text .ag-bild img{width:100%; aspect-ratio:16/9; object-fit:cover; border-radius:12px; display:block}
.ag-player{margin-top:14px; display:flex; align-items:center; gap:12px; flex-wrap:wrap}
.ag-hoeren{font-size:.82rem; font-weight:700; color:var(--gruen-dunkel); text-transform:uppercase; letter-spacing:.04em; white-space:nowrap}
.ag-player audio{flex:1; min-width:240px; height:40px}
.ag-text{margin-top:12px}
.ag-text summary{cursor:pointer; color:var(--gruen-dunkel); font-weight:700; font-size:.92rem; list-style:none; display:inline-flex; align-items:center; gap:6px}
.ag-text summary::-webkit-details-marker{display:none}
.ag-text summary::before{content:'\25B8'; transition:transform .15s}
.ag-text[open] summary::before{transform:rotate(90deg)}
.ag-text-body{margin-top:10px; font-size:1rem; line-height:1.65; color:#2a352a}
.ag-text-body p{margin:0 0 12px}
.ag-text-body p:last-child{margin-bottom:0}
@media(max-width:560px){ .beitrag-text .ag-station{padding:16px} .ag-player audio{min-width:100%} }

/* ---------- Tagesempfehlung (/heute) ---------- */
.heute-wrap{max-width:900px}
.heute-h2{font-size:clamp(1.4rem,2.6vw,1.9rem); font-weight:800; color:var(--gruen-dunkel); margin:36px 0 16px}
.heute-wetter{display:flex; align-items:center; gap:14px; padding:16px 20px; border-radius:14px; border:1px solid var(--line);
  background:var(--sand); color:var(--ink); flex-wrap:wrap; transition:border-color .15s, box-shadow .15s}
.heute-wetter:hover{border-color:#c8ddd1; box-shadow:0 6px 18px rgba(35,60,45,.08)}
.hw-dot{width:14px; height:14px; border-radius:50%; flex:0 0 14px; background:var(--muted)}
.l-schoen .hw-dot{background:#3aa657} .heute-wetter.l-schoen{background:#eef7f0; border-color:#cfe8d6}
.l-mittel .hw-dot{background:#e0a13a} .heute-wetter.l-mittel{background:#fbf3e6; border-color:#efd9b4}
.l-nass  .hw-dot{background:#3a78c0} .heute-wetter.l-nass{background:#eaf1f9; border-color:#c6d9ef}
.l-schnee .hw-dot{background:#7fb2e0} .heute-wetter.l-schnee{background:#eef4fb; border-color:#d3e3f4}
.hw-text{flex:1; min-width:220px; font-size:1.02rem; line-height:1.5}
.hw-mehr{color:var(--gruen); font-weight:700; font-size:.9rem; white-space:nowrap}
.heute-top{display:flex; background:#fff; border:1px solid var(--line); border-radius:16px; overflow:hidden; text-decoration:none;
  color:var(--ink); box-shadow:var(--schatten); transition:transform .15s, box-shadow .15s}
.heute-top:hover{transform:translateY(-3px); box-shadow:0 16px 36px rgba(35,60,45,.16)}
.ht-bild{flex:0 0 40%; min-height:210px; background-size:cover; background-position:center}
.ht-text{padding:22px 24px; display:flex; flex-direction:column; align-items:flex-start; gap:8px}
.ht-text h3{font-size:1.5rem; font-weight:800; color:var(--gruen-dunkel); margin:2px 0}
.ht-text p{color:var(--ink); font-size:1.05rem; line-height:1.55}
.ht-cta{margin-top:6px; color:#fff; background:var(--gruen); font-weight:700; font-size:.92rem; padding:9px 18px; border-radius:8px}
.heute-top:hover .ht-cta{background:var(--gruen-dunkel)}
.heute-alt-titel{margin:26px 0 12px; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.05em; font-size:.82rem}
.heute-box{margin:26px 0 0; background:var(--gruen-hell); border:1px solid var(--line); border-left:4px solid var(--gruen); border-radius:14px; padding:18px 22px}
.hb-titel{display:block; font-weight:800; color:var(--gruen-dunkel); font-size:1.05rem; margin-bottom:6px}
.heute-box p{margin:6px 0 0; color:var(--ink); font-size:1rem; line-height:1.55}
.heute-box a{color:var(--gruen); font-weight:600}
.heute-events{border:1px solid var(--line); border-radius:14px; overflow:hidden}
.he-zeile{display:flex; gap:16px; align-items:baseline; padding:13px 18px; border-top:1px solid var(--line); text-decoration:none; color:var(--ink)}
.he-zeile:first-child{border-top:none}
.he-zeile:hover{background:var(--sand)}
.he-datum{flex:0 0 78px; font-weight:700; color:var(--gruen-dunkel); font-size:.92rem}
.he-titel{font-size:1rem}
.he-ort{color:var(--muted); font-size:.9rem}
.heute-mehr{margin-top:14px}
.heute-mehr a{color:var(--gruen); font-weight:700}
@media(max-width:640px){ .heute-top{flex-direction:column} .ht-bild{flex:none; width:100%; aspect-ratio:16/9; min-height:0} }

/* Startseiten-Block Heute */
.start-heute{max-width:var(--maxw); margin:0 auto; padding:0 24px}
.sh-karte{display:flex; gap:0; background:#fff; border:1px solid var(--line); border-radius:16px; overflow:hidden; box-shadow:var(--schatten); text-decoration:none; color:var(--ink); margin-top:-40px; position:relative; z-index:5; transition:transform .15s, box-shadow .15s}
.sh-karte:hover{transform:translateY(-3px); box-shadow:0 16px 36px rgba(35,60,45,.16)}
.sh-links{flex:1; padding:22px 26px}
.sh-eyebrow{display:block; font-family:'Encode Sans Condensed','Encode Sans',sans-serif; font-weight:600; text-transform:uppercase; letter-spacing:.05em; font-size:.8rem; color:var(--gruen); margin-bottom:6px}
.sh-wetter{display:inline-flex; align-items:center; gap:8px; font-weight:700; color:var(--gruen-dunkel); margin-bottom:8px}
.sh-wetter .hw-dot{width:11px; height:11px; flex:0 0 11px}
.sh-tipp{font-size:1.05rem; line-height:1.5}
.sh-tipp b{color:var(--gruen-dunkel)}
.sh-cta{align-self:center; padding:0 26px; color:var(--gruen); font-weight:700; white-space:nowrap}
@media(max-width:620px){ .sh-karte{flex-direction:column} .sh-cta{align-self:flex-start; padding:0 26px 20px} }

/* ---------- 404-Seite ---------- */
.fehler{min-height:72vh; display:flex; align-items:center; justify-content:center; text-align:center; color:#fff;
  background-size:cover; background-position:center; padding:80px 24px}
.fehler-innen{max-width:660px}
.fehler-num{display:block; font-weight:800; font-size:clamp(4.5rem,15vw,9rem); line-height:1; letter-spacing:-.02em;
  text-shadow:0 4px 26px rgba(0,0,0,.5); opacity:.96}
.fehler h1{font-weight:800; font-size:clamp(1.6rem,4vw,2.6rem); margin-top:4px; text-shadow:0 2px 16px rgba(0,0,0,.45)}
.fehler p{margin-top:16px; font-size:1.12rem; line-height:1.6; text-shadow:0 2px 12px rgba(0,0,0,.4); opacity:.97}
.fehler-sub{font-weight:700; margin-top:24px}
.fehler-links{margin-top:14px; display:inline-flex; gap:12px; flex-wrap:wrap; justify-content:center}
.fehler-suche{margin:26px auto 0; display:flex; max-width:440px; background:#fff; border-radius:10px; overflow:hidden; box-shadow:0 10px 30px rgba(0,0,0,.25)}
.fehler-suche input{flex:1; border:0; padding:13px 16px; font-size:1rem; font-family:inherit; color:var(--ink); outline:none}
.fehler-suche input::placeholder{color:var(--muted)}
.fehler-suche button{border:0; background:var(--gruen); color:#fff; width:52px; display:flex; align-items:center; justify-content:center; cursor:pointer}
.fehler-suche button:hover{background:var(--gruen-dunkel)}

/* ---------- Sprachumschalter (mit Flagge) ---------- */
.sprachwahl{display:inline-flex; align-items:center; gap:2px}
.sw-opt{display:inline-flex; align-items:center; gap:5px; padding:5px 8px; border-radius:8px;
  font-family:'Encode Sans Condensed','Encode Sans',sans-serif; font-weight:700; font-size:.82rem;
  text-transform:uppercase; letter-spacing:.03em; color:var(--muted); transition:background .15s, color .15s}
.sw-opt:hover{color:var(--gruen); background:var(--gruen-hell)}
.sw-opt.aktiv{color:var(--gruen-dunkel)}
.sw-flag{width:20px; height:14px; flex:0 0 20px; border-radius:3px; overflow:hidden; display:block;
  box-shadow:0 0 0 1px rgba(0,0,0,.14)}
.sw-opt.aktiv .sw-flag{box-shadow:0 0 0 2px var(--gruen)}
/* Kopf: rechts neben der Navigation */
.sprachwahl-kopf{margin-left:6px}
/* Mobil: eigene Zeile im Menü */
.mn-sprache{padding:14px 0 4px; border-top:1px solid var(--line); margin-top:6px}
.sprachwahl-mobil .sw-opt{font-size:.9rem; padding:8px 12px}
/* Fuss: zentriert, helle Schrift auf dunklem Grund */
.fuss-sprache-wrap{display:flex; justify-content:center; padding:6px 24px 0}
.sprachwahl-fuss .sw-opt{color:#d7e2da}
.sprachwahl-fuss .sw-opt:hover{color:#fff; background:rgba(255,255,255,.14)}
.sprachwahl-fuss .sw-opt.aktiv{color:#fff}
.sprachwahl-fuss .sw-flag{box-shadow:0 0 0 1px rgba(255,255,255,.35)}
.sprachwahl-fuss .sw-opt.aktiv .sw-flag{box-shadow:0 0 0 2px #fff}
.tp-pin span{display:grid; place-items:center; width:28px; height:28px; border-radius:50%; background:var(--gruen); color:#fff; font-weight:700; font-size:.85rem; border:2px solid #fff; box-shadow:0 2px 6px rgba(0,0,0,.4)}
.beitrag-text .karte-tipp{color:var(--muted); font-size:.88rem; margin-top:42px}
.leaflet-popup-content .popup-audio{width:100%; height:34px; display:block; margin:8px 0 4px}
.leaflet-popup-content strong{font-family:'Encode Sans Condensed','Encode Sans',sans-serif}
.leaflet-popup-content{font-family:'Encode Sans',sans-serif; font-size:.95rem}
.leaflet-popup-content .gm-link{color:var(--gruen); font-weight:700}
.leaflet-popup-content .do-link{color:var(--gruen-dunkel); font-weight:700; text-decoration:none}
.mk-link{margin-left:8px; color:var(--gruen); font-weight:600; font-size:.86rem; text-decoration:none; white-space:nowrap}
.mk-link:hover{text-decoration:underline}

/* ---------- Bilderkacheln (mit Foto, interne Verlinkung) ---------- */
.beitrag-text .bildkacheln{margin:28px 0; display:grid; grid-template-columns:repeat(3,1fr); gap:18px}
@media(max-width:820px){ .beitrag-text .bildkacheln{grid-template-columns:repeat(2,1fr)} }
@media(max-width:560px){ .beitrag-text .bildkacheln{grid-template-columns:1fr} }
.bk{display:flex; flex-direction:column; background:#fff; border:1px solid var(--line); border-radius:14px; overflow:hidden; text-decoration:none; color:var(--ink); transition:border-color .15s, box-shadow .15s, transform .15s}
.bk:hover{border-color:var(--gruen); box-shadow:0 10px 26px rgba(20,60,20,.12); transform:translateY(-3px)}
.bk-bild{width:100%; aspect-ratio:16/9; object-fit:cover; display:block; background:var(--gruen-hell)}
.bk:hover .bk-bild{filter:brightness(1.03)}
.bk-inhalt{position:relative; padding:14px 16px 16px}
.bk-titel{display:block; font-weight:700; color:var(--gruen-dunkel); font-size:1.05rem; padding-right:16px}
.bk-text{display:block; color:var(--muted); font-size:.86rem; margin-top:4px; line-height:1.4}
.bk-pfeil{position:absolute; top:14px; right:14px; color:var(--gruen); font-size:1.2rem; line-height:1}

/* ---------- Themen-Kacheln (interne Verlinkung) ---------- */
.beitrag-text .kacheln{margin:26px 0; display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:14px}
.kachel{position:relative; display:block; background:#fff; border:1px solid var(--line); border-radius:14px; padding:20px 22px; text-decoration:none; color:var(--ink); transition:border-color .15s, box-shadow .15s, transform .15s}
.kachel:hover{border-color:var(--gruen); box-shadow:0 8px 22px rgba(20,60,20,.08); transform:translateY(-2px)}
.kachel-titel{display:block; font-weight:700; color:var(--gruen-dunkel); font-size:1.08rem; margin-bottom:6px; padding-right:16px}
.kachel-text{display:block; color:var(--muted); font-size:.9rem; line-height:1.45}
.kachel-pfeil{position:absolute; top:18px; right:18px; color:var(--gruen); font-size:1.3rem; line-height:1}

/* ---------- Drehtermine (Scraper) ---------- */
.beitrag-text .drehtermine{margin:24px 0}
.dt-liste{display:block; margin-top:4px}
.dt-zeile{display:grid; grid-template-columns:160px 130px 1fr; gap:20px; align-items:baseline; padding:15px 4px; border-bottom:1px solid var(--line)}
.dt-zeile:first-child{border-top:1px solid var(--line)}
.dt-datum{font-weight:700; color:var(--ink)}
.dt-zeit{color:var(--gruen); font-weight:600}
.dt-ort{color:var(--ink)}
.dt-leer{background:var(--gruen-hell); border:1px solid var(--line); border-radius:10px; padding:18px; color:var(--ink)}
.dt-stand{margin-top:12px; font-size:.82rem; color:var(--muted)}
@media(max-width:640px){ .dt-zeile{grid-template-columns:1fr; gap:2px} .dt-zeit{font-size:.9rem} }

/* ---------- TV-Ausstrahlungen ---------- */
.beitrag-text .ausstrahlungen{margin:24px 0}
.tv-liste{display:block; margin-top:4px}
.tv-zeile{display:grid; grid-template-columns:150px 100px 130px 1fr; gap:16px; align-items:baseline; padding:15px 4px; border-bottom:1px solid var(--line)}
.tv-zeile:first-child{border-top:1px solid var(--line)}
.tv-datum{font-weight:700; color:var(--ink)}
.tv-zeit{color:var(--gruen); font-weight:600}
.tv-sender{font-weight:600; color:var(--gruen-dunkel)}
.tv-folge{color:var(--muted)}
@media(max-width:700px){ .tv-zeile{grid-template-columns:1fr 1fr; gap:4px} .tv-folge{grid-column:1 / -1} .tv-zeit{font-size:.9rem} }

/* ---------- Wetter-Vorhersage ---------- */
.beitrag-text .wetter-box{margin:24px 0}
.wetter-jetzt{display:flex; align-items:center; gap:22px; background:var(--gruen-hell); border:1px solid var(--line); border-left:4px solid var(--gruen); border-radius:var(--radius); padding:20px 24px}
.wj-temp{font-size:3rem; font-weight:800; color:var(--gruen-dunkel); line-height:1}
.wj-grad{font-size:1.3rem; font-weight:700; vertical-align:super}
.wj-info{display:flex; flex-direction:column; gap:3px}
.wj-lage{font-size:1.2rem; font-weight:700; color:var(--ink)}
.wj-wind{color:var(--muted); font-size:.92rem}
.wetter-tage{display:grid; grid-template-columns:repeat(5,1fr); gap:10px; margin-top:14px}
.wt-tag{border:1px solid var(--line); border-radius:10px; padding:12px 10px; text-align:center; display:flex; flex-direction:column; gap:5px}
.wt-name{font-weight:700; color:var(--gruen-dunkel)}
.wt-lage{font-size:.82rem; color:var(--muted); min-height:2.4em; display:flex; align-items:center; justify-content:center}
.wt-temp{font-size:.95rem} .wt-temp b{color:var(--ink)}
.wt-regen{font-size:.78rem; color:var(--gruen)}
.beitrag-text .wetter-quelle{margin:12px 0 0; font-size:.82rem; color:var(--muted)}
@media(max-width:640px){ .wetter-tage{grid-template-columns:repeat(2,1fr)} .wetter-jetzt{flex-wrap:wrap; gap:14px} }

/* ---------- Webcams ---------- */
.beitrag-text .tp-webcams{margin:24px 0}
.wc-fassade{background:var(--sand); border:1px dashed var(--line); border-radius:var(--radius); padding:26px; text-align:center}
.wc-fassade p{margin:0 0 14px; color:var(--ink)}
.wc-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:16px}
.wc-cam{margin:0}
.wc-cam img{width:100%; aspect-ratio:16/10; object-fit:cover; border-radius:var(--radius); display:block}
.wc-cam figcaption{margin-top:8px; font-size:.9rem; color:var(--muted)}

/* ---------- Tippliste (Ausflugstipps nach Wetter) ---------- */
.beitrag-text .tippliste{display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:18px; margin:22px 0}
.tl-item{border:1px solid var(--line); border-left:3px solid var(--gruen); border-radius:var(--radius); background:#fff; overflow:hidden; display:flex; flex-direction:column}
.tl-body{padding:16px 18px}
.tl-body > :last-child{margin-bottom:0}
.tippliste-bild .tl-item{border-left:1px solid var(--line)}
.tl-bildlink{display:block}
.tl-bild{width:100%; aspect-ratio:16/10; object-fit:cover; display:block; transition:transform .3s ease}
.tl-bildlink:hover .tl-bild{transform:scale(1.04)}
.beitrag-text .tl-titel{font-size:1.12rem; font-weight:700; margin:0 0 6px; color:var(--gruen-dunkel)}
.tl-titel a{color:var(--gruen-dunkel)}
.tl-titel a:hover{color:var(--gruen)}
.beitrag-text .tl-text{margin:0 0 8px; font-size:.98rem; color:var(--ink)}
.beitrag-text .tl-meta{margin:0 0 8px; font-size:.85rem; color:var(--muted)}
.beitrag-text .tl-cta{margin:10px 0 0; font-weight:700; font-size:.92rem}
.tl-cta a{color:var(--gruen)}
.tl-pfeil{font-weight:700}
.beitrag-text .go-button-wrap{margin:22px 0}
.go-button{display:inline-flex; align-items:center; gap:6px}
.beitrag-text .tp-video-mp4{margin:24px 0}
.tp-video-mp4 video{width:100%; border-radius:var(--radius); display:block; background:#000}
/* Instagram-Hochformat-Video: auf Desktop schmaler und zentriert, mobil volle Breite */
.insta-video video{max-width:400px; margin-left:auto; margin-right:auto}
.tp-video-mp4 figcaption{margin-top:8px; font-size:.9rem; color:var(--muted)}
.beitrag-text .tp-audio{margin:18px 0 24px; padding:14px 16px; background:var(--gruen-hell); border:1px solid var(--line); border-left:4px solid var(--gruen); border-radius:var(--radius)}
.tp-audio .tp-audio-titel{display:flex; align-items:center; gap:8px; font-family:'Encode Sans Condensed','Encode Sans',sans-serif; font-weight:700; font-size:.86rem; letter-spacing:.03em; text-transform:uppercase; color:var(--gruen-dunkel); margin:0 0 10px}
.tp-audio .tp-audio-titel::before{content:''; width:20px; height:20px; flex:none; background:var(--gruen); -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3a8 8 0 0 0-8 8v6a2 2 0 0 0 2 2h1a1 1 0 0 0 1-1v-5a1 1 0 0 0-1-1H6v-1a6 6 0 0 1 12 0v1h-1a1 1 0 0 0-1 1v5a1 1 0 0 0 1 1h1a2 2 0 0 0 2-2v-6a8 8 0 0 0-8-8z'/%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 24 24'%3E%3Cpath d='M12 3a8 8 0 0 0-8 8v6a2 2 0 0 0 2 2h1a1 1 0 0 0 1-1v-5a1 1 0 0 0-1-1H6v-1a6 6 0 0 1 12 0v1h-1a1 1 0 0 0-1 1v5a1 1 0 0 0 1 1h1a2 2 0 0 0 2-2v-6a8 8 0 0 0-8-8z'/%3E%3C/svg%3E") center/contain no-repeat}
.tp-audio .tp-audio-titel{position:relative}
.tp-audio .tp-audio-dauer{margin-left:auto; font-size:.8rem; font-weight:600; letter-spacing:0; text-transform:none; color:var(--gruen-dunkel); background:#fff; border:1px solid var(--line); border-radius:999px; padding:2px 10px}
.tp-audio audio{width:100%; height:40px; display:block}
.tp-audio audio::-webkit-media-controls-panel{background:#fff}

/* Nummerierte Stationen (Ortsspaziergang) */
.beitrag-text .station-kopf{display:flex; align-items:center; gap:16px; margin:52px 0 16px}
.station-kopf .station-num{flex:none; width:44px; height:44px; display:flex; align-items:center; justify-content:center; background:var(--gruen); color:#fff; border-radius:50%; font-family:'Encode Sans Condensed','Encode Sans',sans-serif; font-weight:800; font-size:1.25rem; box-shadow:0 6px 16px rgba(62,90,76,.28)}
.beitrag-text .station-kopf .station-titel{margin:0}
.beitrag-text .station-kopf .station-titel::after{display:none}
@media(max-width:540px){.beitrag-text .station-kopf{gap:12px} .station-kopf .station-num{width:38px; height:38px; font-size:1.1rem}}

/* Wissenswertes-/Tipp-Box pro Station */
.beitrag-text .tipp-box{display:flex; gap:12px; margin:18px 0 24px; padding:16px 18px; background:#fff; border:1px solid var(--line); border-left:4px solid var(--gruen); border-radius:var(--radius); box-shadow:0 6px 18px rgba(35,60,45,.06); font-size:1.02rem; line-height:1.6}
.tipp-box::before{content:''; flex:none; width:22px; height:22px; margin-top:1px; background:var(--gruen); -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z'/%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 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z'/%3E%3C/svg%3E") center/contain no-repeat}
.tipp-box .tipp-inhalt{color:#2a352a}
.tipp-box .tipp-label{font-weight:700; color:var(--gruen-dunkel)}

/* ---------- FAQ-Akkordeon ---------- */
.beitrag-text .tp-faq{margin:26px 0}
.faq-item{border:1px solid var(--line); border-left:3px solid var(--gruen); border-radius:10px; margin-bottom:10px; background:#fff; overflow:hidden}
.faq-item summary{list-style:none; cursor:pointer; padding:16px 48px 16px 20px; font-weight:700; color:var(--gruen-dunkel); position:relative}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+"; position:absolute; right:20px; top:50%; transform:translateY(-50%); font-size:1.5rem; color:var(--gruen); font-weight:400; line-height:1}
.faq-item[open] summary::after{content:"\2212"}
.faq-item[open] summary{border-bottom:1px solid var(--line)}
.faq-a{padding:16px 20px 6px; color:var(--ink)}
.faq-a p{margin:0 0 12px; line-height:1.65}

/* ---------- Filmografie (Chronologische Übersicht) ---------- */
.beitrag-text .filmliste{margin:24px 0}
.film-zeile{display:grid; grid-template-columns:96px 1fr; gap:20px; align-items:baseline; padding:14px 4px; border-bottom:1px solid var(--line)}
.film-zeile:first-child{border-top:1px solid var(--line)}
.film-jahr{font-weight:700; color:var(--gruen); font-size:1.05rem}
.film-info{display:flex; flex-direction:column; gap:2px}
.film-titel{font-weight:700; color:var(--ink); font-size:1.05rem}
.film-meta{color:var(--muted); font-size:.9rem}
@media(max-width:600px){ .film-zeile{grid-template-columns:1fr; gap:2px} }

/* ---------- Figuren-Karten (fu-card) ---------- */
.beitrag-text .figuren{margin:28px 0; display:grid; grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); gap:16px}
.fu-card{display:flex; gap:16px; background:#fff; border:1px solid var(--line); border-left:3px solid var(--gruen); border-radius:14px; padding:20px; text-decoration:none; color:var(--ink); transition:border-color .15s, box-shadow .15s, transform .15s}
.fu-card:hover{border-color:var(--gruen); box-shadow:0 8px 22px rgba(20,60,20,.1); transform:translateY(-2px)}
.fu-init{flex:0 0 auto; width:52px; height:52px; border-radius:50%; background:var(--gruen); color:#fff; display:grid; place-items:center; font-size:1.5rem; font-weight:700}
.fu-body{display:flex; flex-direction:column; min-width:0}
.fu-role{font-size:.76rem; text-transform:uppercase; letter-spacing:.04em; color:var(--gruen); font-weight:700}
.fu-name{font-weight:700; color:var(--gruen-dunkel); font-size:1.15rem; margin:2px 0}
.fu-actor{color:var(--muted); font-size:.88rem; margin-bottom:6px}
.fu-text{color:var(--ink); font-size:.92rem; line-height:1.5}
.fu-pills{display:flex; flex-wrap:wrap; gap:6px; margin-top:12px}
.fu-pill{background:var(--gruen-hell); color:var(--gruen-dunkel); font-size:.75rem; font-weight:600; padding:3px 10px; border-radius:999px}
.fu-arrow{color:var(--gruen); font-weight:700; font-size:.9rem; margin-top:12px}

/* ---------- Episodenliste (Staffel-Akkordeon mit Folgen) ---------- */
.beitrag-text .episoden{margin:26px 0; display:grid; gap:16px}
.epi-staffel{border:1px solid var(--line); border-radius:14px; overflow:hidden; background:#fff}
.epi-staffel-kopf{list-style:none; cursor:pointer; display:flex; align-items:center; gap:14px; padding:16px 20px; background:var(--sand)}
.epi-staffel-kopf::-webkit-details-marker{display:none}
.epi-staffel-kopf::after{content:"\25BE"; margin-left:auto; color:var(--gruen); transition:transform .2s}
.epi-staffel[open] .epi-staffel-kopf::after{transform:rotate(180deg)}
.epi-badge{background:var(--gruen); color:#fff; font-size:.72rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase; padding:5px 12px; border-radius:999px; white-space:nowrap}
.epi-staffel-titel{color:var(--gruen-dunkel); font-size:1.15rem; font-weight:700}
.epi-staffel-count{color:var(--muted); font-size:.9rem}
.epi-folge{display:flex; align-items:center; gap:16px; padding:14px 20px; border-top:1px solid var(--line)}
.epi-num{color:var(--muted); font-weight:700; min-width:24px; text-align:center}
.epi-info{display:flex; flex-direction:column; gap:2px; margin-right:auto}
.epi-titel{font-weight:700; color:var(--ink); font-size:1.05rem}
.epi-datum{color:var(--muted); font-size:.88rem}
.epi-ansehen{background:var(--gruen); color:#fff; font-weight:700; font-size:.88rem; padding:9px 18px; border-radius:999px; text-decoration:none; white-space:nowrap; display:inline-flex; align-items:center; gap:7px}
.epi-ansehen:hover{background:var(--gruen-dunkel)}
.epi-play{font-size:.7em}
@media(max-width:600px){ .epi-folge{flex-wrap:wrap} .epi-info{flex:1 1 60%} }

/* ---------- Aktionsboxen (CTA) ---------- */
.beitrag-text .aktionsbox{margin:28px 0; border-radius:16px; padding:30px 32px}
.ab-hell{background:var(--gruen-hell); border:1px solid var(--line); border-left:4px solid var(--gruen)}
.ab-gruen{background:var(--gruen); color:#fff}
.ab-eyebrow{display:block; font-size:.78rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--gruen); margin-bottom:10px}
.ab-gruen .ab-eyebrow{color:rgba(255,255,255,.72)}
.ab-titel{margin:0 0 12px; color:var(--gruen-dunkel); font-size:1.5rem; line-height:1.15}
.ab-gruen .ab-titel{color:#fff}
.ab-text p{margin:0 0 10px; color:var(--ink)}
.ab-text p:last-child{margin-bottom:0}
.ab-gruen .ab-text p{color:rgba(255,255,255,.92)}
.ab-buttons{display:flex; flex-wrap:wrap; gap:10px; margin-top:18px}
.ab-gruen .ab-buttons .btn{background:#fff; color:var(--gruen-dunkel)}
.btn-ab-ghost{background:#fff; color:var(--gruen-dunkel); border:1px solid var(--line)}
.btn-ab-ghost:hover{border-color:var(--gruen); background:#fff}
.beitrag-text .ab-fuss{margin-top:34px; font-size:.86rem; color:var(--muted)}
.ab-gruen .ab-fuss{color:rgba(255,255,255,.78)}
.ab-gruen .ab-fuss a, .ab-gruen .ab-text a{color:#fff}
.fm-nackt{background:none; border:0; padding:0; margin-top:14px}

/* ---------- Frag den Michi ---------- */
.frag-michi{margin:34px 0; background:var(--gruen-hell); border:1px solid var(--line); border-radius:16px; padding:30px}
.frag-michi h2{margin-top:0; color:var(--gruen-dunkel)}
.fm-intro{color:var(--muted); max-width:640px}
.fm-form{margin-top:18px; display:block}
.fm-form label{display:block; font-weight:700; font-size:.85rem; margin:12px 0 5px; color:var(--ink)}
.fm-form textarea, .fm-form input[type=text], .fm-form input[type=email]{width:100%; padding:11px 13px; border:1px solid var(--line); border-radius:10px; font:inherit; background:#fff}
.fm-form textarea{min-height:96px; resize:vertical}
.fm-zwei{display:grid; grid-template-columns:1fr 1fr; gap:14px}
.fm-hp{position:absolute; left:-9999px; width:1px; height:1px; opacity:0}
.fm-form .btn{margin-top:16px}
.beitrag-text .fm-hinweis{font-size:.82rem; color:var(--muted); margin-top:24px}
.fm-danke{background:#fff; border:1px solid var(--line); border-radius:12px; padding:22px; font-weight:600; color:var(--gruen-dunkel)}
.fm-antworten{margin-top:30px; border-top:1px solid var(--line); padding-top:22px}
.fm-antworten h3{color:var(--gruen-dunkel); font-size:1.2rem}
.fm-qa{background:#fff; border:1px solid var(--line); border-radius:12px; padding:18px 20px; margin-bottom:14px}
.fm-q{font-weight:700; color:var(--ink); margin:0 0 8px}
.fm-q::before{content:"F: "; color:var(--gruen)}
.fm-a{margin:0; color:var(--ink)}
.fm-a-label{font-weight:700; color:var(--gruen)}
@media (max-width:600px){ .fm-zwei{grid-template-columns:1fr} }

/* Externe Links im Fließtext, klickbar und gekennzeichnet */
.ext-link{color:var(--gruen-dunkel); font-weight:600; text-decoration:none; border-bottom:1px solid rgba(62,90,76,.35)}
.ext-link:hover{border-bottom-color:var(--gruen)}
.ext-ico{font-size:.72em; vertical-align:super; margin-left:1px; opacity:.65}

/* ---------- Feedback-Widget ---------- */
.feedback{max-width:var(--maxw); margin:0 auto 44px; padding:0 24px}
.feedback-innen{background:var(--sand); border:1px solid var(--line); border-radius:14px; padding:30px; text-align:center}
.fb-frage{font-size:1.15rem; font-weight:700; color:var(--gruen-dunkel); margin-bottom:16px}
.fb-buttons{display:flex; gap:14px; justify-content:center}
.fb-btn{display:inline-flex; align-items:center; gap:8px; background:#fff; border:1px solid var(--line); border-radius:999px; padding:11px 24px; font-weight:700; color:var(--ink); cursor:pointer; font-family:inherit; transition:border-color .15s, color .15s}
.fb-btn:hover{border-color:var(--gruen); color:var(--gruen)}
.fb-danke{font-size:1.1rem; font-weight:700; color:var(--gruen)}
@media (max-width:600px){ .buch-innen{flex-direction:column} .buch-cover{width:130px} }

/* ---------- Video-Baustein (YouTube, datenschutzfreundlich) ---------- */
.beitrag-text .tp-video{margin:26px 0}
.vid-fassade{position:relative; background:var(--gruen-hell); border:1px solid var(--line); border-radius:14px; padding:54px 26px; text-align:center; overflow:hidden}
.vid-fassade::before{content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(62,90,76,.14), rgba(62,90,76,.30)); pointer-events:none}
.vid-fassade > *{position:relative}
.vid-titel{display:block; font-weight:700; color:var(--gruen-dunkel); font-size:1.15rem; margin-bottom:8px}
.vid-fassade p{color:var(--muted); font-size:.88rem; margin-bottom:16px}
.vid-load::before{content:"\25B6"; margin-right:8px; font-size:.8em}
.vid-rahmen{position:relative; aspect-ratio:16/9; border-radius:14px; overflow:hidden; background:#000}
.vid-rahmen iframe{position:absolute; inset:0; width:100%; height:100%; border:0}
.pc-rahmen{position:relative; aspect-ratio:16/9; border-radius:14px; overflow:hidden; background:#000}
.pc-rahmen iframe{position:absolute; inset:0; width:100%; height:100%; border:0}

/* ---------- Bildergalerie ---------- */
.beitrag-text .tp-galerie{margin:28px 0; display:grid; grid-template-columns:repeat(3,1fr); gap:12px}
.gal-item{margin:0; position:relative; border-radius:12px; overflow:hidden; cursor:zoom-in; aspect-ratio:4/3; background:var(--gruen-hell)}
.gal-item img{width:100%; height:100%; object-fit:cover; display:block; transition:transform .3s}
.gal-item:hover img{transform:scale(1.05)}
.gal-item figcaption{position:absolute; left:0; right:0; bottom:0; padding:20px 12px 9px; font-size:.8rem; color:#fff; background:linear-gradient(180deg, transparent, rgba(10,25,15,.78)); opacity:0; transition:opacity .2s}
.gal-item:hover figcaption{opacity:1}
@media (max-width:720px){ .beitrag-text .tp-galerie{grid-template-columns:repeat(2,1fr); gap:8px} }

/* ---------- Lightbox ---------- */
.tp-lightbox{position:fixed; inset:0; z-index:2000; background:rgba(8,18,12,.94); display:flex; flex-direction:column; align-items:center; justify-content:center; opacity:0; visibility:hidden; transition:opacity .2s}
.tp-lightbox.auf{opacity:1; visibility:visible}
.tp-lightbox img{max-width:92vw; max-height:82vh; border-radius:8px; box-shadow:0 20px 60px rgba(0,0,0,.6)}
.lb-cap{color:#eef; margin-top:14px; font-size:.95rem; min-height:1.2em; text-align:center; padding:0 20px}
.lb-zu{position:absolute; top:18px; right:22px; background:none; border:0; color:#fff; font-size:2.2rem; line-height:1; cursor:pointer; opacity:.8}
.lb-zu:hover{opacity:1}
.lb-nav{position:absolute; top:50%; transform:translateY(-50%); background:rgba(255,255,255,.12); border:0; color:#fff; font-size:2rem; width:52px; height:52px; border-radius:50%; cursor:pointer; display:grid; place-items:center}
.lb-nav:hover{background:rgba(255,255,255,.24)}
.lb-prev{left:18px}
.lb-next{right:18px}
@media (max-width:600px){ .lb-nav{width:42px; height:42px; font-size:1.6rem} }

/* ---------- Was ist los (Veranstaltungskalender) ---------- */
.wl-kalender{margin-top:26px;display:flex;flex-direction:column;gap:28px}
.wl-tag-gruppe{display:flex;flex-direction:column;gap:10px}
.wl-datumkopf{display:flex;align-items:baseline;gap:12px;padding-bottom:8px;border-bottom:2px solid var(--gruen)}
.wl-dk-tag{font-family:'Encode Sans Condensed',sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--gruen-dunkel)}
.wl-dk-datum{font-size:1.15rem;font-weight:700;color:#1c2a20}
.wl-dk-heute{margin-left:auto;background:var(--gruen);color:#fff;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;padding:2px 10px;border-radius:999px}
.wl-dk-morgen{background:var(--gruen-dunkel)}
.wl-event{display:flex;gap:14px;padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:#fff;transition:box-shadow .15s,border-color .15s}
.wl-event:hover{box-shadow:0 4px 16px rgba(20,40,25,.08);border-color:#cfe0d2}
.wl-event.wl-hl{border-left:4px solid var(--gruen)}
.wl-event.wl-dreh{border-left:4px solid #c0392b;background:#fbf4f3}
.wl-ev-body{flex:1;min-width:0}
.wl-badge{display:inline-block;font-family:'Encode Sans Condensed',sans-serif;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--gruen-dunkel);background:#eaf3ea;padding:2px 9px;border-radius:6px;margin-bottom:6px}
.wl-badge-hl{background:var(--gruen);color:#fff}
.wl-badge-dreh{background:#c0392b;color:#fff}
.wl-ev-titel{margin:0 0 6px;font-size:1.12rem;line-height:1.3}
.wl-ev-titel a{color:#17251b;text-decoration:none}
.wl-ev-titel a:hover{color:var(--gruen);text-decoration:underline}
.wl-ext{font-size:.8em;color:var(--muted)}
.wl-ev-meta{display:flex;flex-wrap:wrap;gap:6px 16px;color:var(--muted);font-size:.92rem}
.wl-zeit{font-weight:700;color:var(--gruen-dunkel)}
.wl-bis{font-style:italic}
.wl-stand{margin-top:26px;padding-top:14px;border-top:1px solid var(--line);color:var(--muted);font-size:.86rem;line-height:1.6}
.wl-leer{margin-top:24px;padding:20px;background:var(--sand);border-radius:12px;color:var(--muted)}

/* Startseite: Künstlerweg-Banner */
.kw-banner{background:linear-gradient(135deg,var(--gruen-dunkel),var(--gruen)); color:#fff; border-radius:var(--radius); padding:48px 44px; box-shadow:var(--schatten)}
.kw-banner .tag{display:inline-block; background:rgba(255,255,255,.16); color:#fff; font-family:'Encode Sans Condensed','Encode Sans',sans-serif; font-weight:700; font-size:.72rem; text-transform:uppercase; letter-spacing:.05em; padding:5px 13px; border-radius:999px; margin-bottom:14px}
.kw-banner h2{font-size:clamp(1.7rem,3vw,2.4rem); font-weight:800; margin:0 0 12px}
.kw-text{max-width:760px}
.kw-banner p{font-size:1.1rem; opacity:.95; margin:0 0 22px}
.kw-banner .btn{background:#fff; color:var(--gruen-dunkel)}
.kw-banner .btn:hover{background:#eef2ef}
@media(max-width:600px){ .kw-banner{padding:34px 26px} }

/* ---------- Consent-Banner ---------- */
.consent{position:fixed;left:0;right:0;bottom:0;z-index:1000;padding:16px;display:flex;justify-content:center;background:linear-gradient(to top,rgba(18,32,22,.28),rgba(18,32,22,0));pointer-events:none}
.consent[hidden]{display:none}
.consent-box{pointer-events:auto;background:#fff;max-width:760px;width:100%;border:1px solid var(--line);border-top:4px solid var(--gruen);border-radius:16px;box-shadow:0 12px 40px rgba(20,40,25,.22);padding:22px 24px}
.consent-titel{margin:0 0 8px;font-size:1.18rem;color:var(--gruen-dunkel)}
.consent-text{margin:0;color:#33413a;font-size:.96rem;line-height:1.6}
.consent-text a{color:var(--gruen-dunkel);text-decoration:underline}
.consent-optionen{margin-top:16px;display:flex;flex-direction:column;gap:8px}
.consent-optionen[hidden]{display:none}
.consent-opt{display:flex;align-items:center;justify-content:space-between;gap:16px;border:1px solid var(--line);border-radius:10px;padding:10px 14px;cursor:pointer}
.consent-opt-fix{opacity:.7;cursor:default}
.consent-opt span{display:flex;flex-direction:column}
.consent-opt small{color:var(--muted);font-size:.82rem;margin-top:2px}
.consent-opt input{width:20px;height:20px;flex:none;accent-color:var(--gruen)}
.consent-knoepfe{margin-top:18px;display:flex;flex-wrap:wrap;gap:10px}
.consent-knoepfe .btn[hidden]{display:none}
.consent-btn-alle{background:var(--gruen);color:#fff}
.consent-btn-speichern{background:var(--gruen);color:#fff}
@media (max-width:600px){
  .consent{padding:0}
  .consent-box{border-radius:16px 16px 0 0;max-width:none;padding:18px 18px 22px}
  .consent-knoepfe .btn{flex:1 1 100%;text-align:center}
}

/* ============================================================
   Feinschliff 2026-07-09: Typografie, Zustände und App-WebView (iOS + Android)
   Additive Überschreibungen, greifen site-weit über die zentralen Klassen.
   Volle Inhaltsbreite und Markenschrift bleiben bewusst erhalten.
   ============================================================ */

/* -- App-WebView Grundlagen: Textgröße stabil, sauberes Tap-Verhalten -- */
html{ -webkit-text-size-adjust:100%; text-size-adjust:100% }
body{ -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; text-rendering:optimizeLegibility;
  font-feature-settings:"kern","liga","calt" }
a, button, summary, label, input, textarea, .btn{ -webkit-tap-highlight-color:rgba(62,90,76,.12) }

/* Anker-Sprünge landen nicht unter dem klebenden Kopf */
:where([id]){ scroll-margin-top:100px }

/* Klebender Kopf respektiert Notch/Statusleiste (oben und seitlich) */
.kopf{ padding-top:env(safe-area-inset-top) }
.kopf-innen{ padding-left:max(24px, env(safe-area-inset-left)); padding-right:max(24px, env(safe-area-inset-right)) }
.mobilnav{ padding-left:max(24px, env(safe-area-inset-left)); padding-right:max(24px, env(safe-area-inset-right)) }

/* -- Typografie: ausgewogene Zeilenumbrüche, keine Schusterjungen -- */
h1, h2, h3,
.hero-inner h1, .seite-kopf h1, .detail-hero h1, .kopfzeile h2, .such-seite h1,
.beitrag-text .abschnitt-h, .beitrag-text .abschnitt-h3, .ab-titel, .kw-banner h2,
.card-titel, .bk-titel, .kachel-titel, .tl-titel, .fu-name, .pf-titel{ text-wrap:balance }
.beitrag-text p, .intro, .seite-kopf p, .detail-hero p, .detail-hero-innen p,
.kopfzeile p, .hero-inner p, .fm-intro, .consent-text, .wl-stand{ text-wrap:pretty }

/* -- Interaktion: sichtbarer Fokus-Ring (Tastatur/App) und Druck-Feedback -- */
:focus-visible{ outline:2px solid var(--gruen); outline-offset:2px; border-radius:5px }
.btn{ transition:background .18s, transform .12s ease, box-shadow .18s }
.btn:active{ transform:translateY(1px) }
.fb-btn:active, .epi-ansehen:active, .consent-opt:active{ transform:translateY(1px) }

/* -- Hero: stabile Höhe in der App (dvh statt vh, kein Springen) -- */
.hero{ min-height:100dvh }
.tp-lightbox img{ max-height:82dvh }
@media (max-width:1080px){ .hero{ min-height:78dvh } }

/* -- Consent-Banner und Fuß: über dem Home-Indikator, nicht darunter -- */
.consent{ padding-bottom:max(16px, calc(env(safe-area-inset-bottom) + 8px));
  padding-left:max(16px, env(safe-area-inset-left)); padding-right:max(16px, env(safe-area-inset-right)) }
@media (max-width:600px){
  .consent{ padding:0 }
  .consent-box{ padding-bottom:max(22px, calc(env(safe-area-inset-bottom) + 16px)) }
}
.fuss-copy{ padding-bottom:max(22px, calc(env(safe-area-inset-bottom) + 14px)) }

/* -- Mobiler Rhythmus (die App ist die Mobilansicht): engere vertikale Abstände,
      etwas mehr Inhaltsbreite, passendere Überschriftengrößen -- */
@media (max-width:640px){
  .abschnitt{ padding:46px 20px }
  .beitrag{ padding:34px 20px }
  .breadcrumb{ padding:16px 20px 0 }
  .breadcrumb + .beitrag{ padding-top:20px }
  .seite-kopf{ padding:42px 20px }
  .detail-hero-innen{ padding:0 20px 34px }
  .kopfzeile{ margin-bottom:32px }
  .beitrag-text .abschnitt-h{ font-size:1.5rem; margin:34px 0 14px }
  .beitrag-text .station-kopf{ margin:38px 0 14px }
  .fuss-innen{ padding:44px 22px 30px }
  .feedback{ padding:0 20px }
}

/* App-Store-Buttons (Treffpunkt App-Seite) */
.beitrag-text .app-stores{display:flex;flex-wrap:wrap;gap:12px;margin:22px 0}
.app-store-btn{display:inline-flex;flex-direction:column;justify-content:center;background:#1c2a22;color:#fff;border-radius:11px;padding:10px 20px;min-width:180px;text-decoration:none;line-height:1.15;transition:background .15s}
.app-store-btn:hover{background:#0f1a14}
.app-store-btn .as-klein{font-size:.68rem;opacity:.8;text-transform:uppercase;letter-spacing:.04em}
.app-store-btn .as-gross{font-family:'Encode Sans Condensed','Encode Sans',sans-serif;font-size:1.18rem;font-weight:700}
@media(max-width:480px){.app-store-btn{min-width:0;flex:1}}

/* Prominenter App-Hinweis im Footer */
.fuss-app{display:inline-flex;align-items:center;gap:13px;margin-top:18px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);border-radius:12px;padding:12px 18px;text-decoration:none;color:#fff;transition:background .15s}
.fuss-app:hover{background:rgba(255,255,255,.2)}
.fuss-app svg{width:26px;height:26px;flex:none}
.fuss-app span{display:flex;flex-direction:column;line-height:1.3;font-size:.82rem;color:#d7e2da}
.fuss-app strong{font-size:1.02rem;color:#fff;font-family:'Encode Sans Condensed','Encode Sans',sans-serif}

/* App-Startscreen (/app-start) */
.app-kopf{background:var(--gruen);color:#fff;padding:44px 20px 40px}
.app-kopf-inner{max-width:var(--maxw);margin:0 auto}
.app-kopf .tag{background:rgba(255,255,255,.16);color:#fff}
.app-kopf h1{margin:14px 0 10px;font-size:2rem;line-height:1.15}
.app-kopf p{margin:0 0 20px;max-width:640px;color:rgba(255,255,255,.92)}
.app-schnell{display:flex;flex-wrap:wrap;gap:10px}
.app-mehr{margin-top:18px}
/* Push-Nachrichten-Archiv auf dem App-Start */
.tb-pa-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px;max-width:820px}
.tb-pa-item{background:#fff;border:1px solid var(--line);border-left:4px solid var(--gruen);border-radius:var(--radius);padding:14px 18px}
.tb-pa-datum{font-size:.78rem;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin-bottom:4px}
.tb-pa-title{font-weight:650;line-height:1.3;margin-bottom:4px}
.tb-pa-body{color:#4a5a4f;font-size:.94rem;line-height:1.45}
.tb-pa-link{display:inline-block;margin-top:8px;font-size:.9rem;font-weight:600;color:var(--gruen);text-decoration:none}
.tb-pa-link:hover{text-decoration:underline}

/* Rundes Autor-Porträt (Wer hier schreibt), Text fließt herum */
.autor-portrait{float:right;width:250px;height:250px;margin:4px 0 20px 32px;border-radius:50%;overflow:hidden;box-shadow:0 6px 22px rgba(0,0,0,.15);border:5px solid #fff}
.autor-portrait img{width:100%;height:100%;object-fit:cover;object-position:52% 26%;display:block}
@media(max-width:560px){.autor-portrait{float:none;margin:0 auto 20px;width:200px;height:200px}}

/* Frühling-Status auf der Startseite (wird gedreht / im ZDF) */
.fr-status{max-width:var(--maxw);margin:0 auto;padding:0 20px}
.fr-status-innen{background:var(--gruen-hell);border:1px solid var(--line);border-radius:var(--radius);padding:18px 20px 20px;margin-top:6px}
.frs-eyebrow{display:flex;align-items:center;gap:10px;font-size:.75rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--gruen);margin-bottom:14px}
.frs-eyebrow::before{content:'';width:26px;height:2px;background:var(--gruen);border-radius:2px}
.frs-karten{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.frs-karte{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:13px 16px;text-decoration:none;color:inherit;transition:border-color .15s,box-shadow .15s}
.frs-karte:hover{border-color:var(--gruen);box-shadow:0 4px 14px rgba(0,0,0,.06)}
.frs-ico{flex:0 0 auto;width:44px;height:44px;display:flex;align-items:center;justify-content:center;background:var(--gruen-hell);color:var(--gruen);border-radius:10px}
.frs-karte.is-live .frs-ico{background:#fdeaea;color:#c0392b}
.frs-txt{display:flex;flex-direction:column;gap:3px;min-width:0}
.frs-txt strong{display:flex;align-items:center;gap:7px;font-weight:700;color:var(--ink);line-height:1.25}
.frs-txt span{color:#5c6b60;font-size:.9rem;line-height:1.3}
.frs-dot{width:9px;height:9px;border-radius:50%;background:#c0392b;box-shadow:0 0 0 0 rgba(192,57,43,.5);animation:frs-puls 1.6s infinite}
@keyframes frs-puls{0%{box-shadow:0 0 0 0 rgba(192,57,43,.5)}70%{box-shadow:0 0 0 8px rgba(192,57,43,0)}100%{box-shadow:0 0 0 0 rgba(192,57,43,0)}}
@media(max-width:640px){.frs-karten{grid-template-columns:1fr}}

/* Merkliste: Merken-Buttons, Header-Zähler, leere Liste */
.karte-bild{position:relative}
.merken-btn{position:absolute;top:10px;right:10px;width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;padding:0;border:none;border-radius:50%;background:rgba(255,255,255,.92);color:#c0392b;cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.18);transition:transform .12s,background .15s;z-index:2}
.merken-btn svg{fill:none;stroke:currentColor;stroke-width:1.9}
.merken-btn:hover{transform:scale(1.08);background:#fff}
.merken-btn.is-an svg{fill:currentColor;stroke:currentColor}
.merken-btn:active{transform:scale(.94)}
/* Beschriftete Variante (Detailseite) */
.detail-hero-aktionen{margin-top:16px}
.merken-btn-label{position:static;width:auto;height:auto;gap:9px;padding:11px 20px;border-radius:30px;background:rgba(255,255,255,.94);color:var(--gruen-dunkel);font-weight:650;font-size:.95rem}
.merken-btn-label .mb-text{line-height:1}
.merken-btn-label svg{stroke:#c0392b}
.merken-btn-label.is-an{background:#c0392b;color:#fff}
.merken-btn-label.is-an svg{fill:#fff;stroke:#fff}
/* Header-Zähler */
.kopf-merk{position:relative;display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;color:var(--gruen-dunkel);border-radius:10px;text-decoration:none}
.kopf-merk:hover{background:var(--gruen-hell);color:var(--gruen)}
.kopf-merk svg{fill:none;stroke:currentColor}
.merk-zahl{position:absolute;top:2px;right:2px;min-width:17px;height:17px;padding:0 4px;display:inline-flex;align-items:center;justify-content:center;background:#c0392b;color:#fff;font-size:.68rem;font-weight:700;border-radius:9px;line-height:1}
.merk-zahl[hidden]{display:none}
.merkliste-leer{color:var(--muted);font-size:1.02rem;max-width:640px}

/* ---------- Aktuelles / Instagram-Feed (4:5 wie Instagram) ---------- */
.insta-feed{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:22px}
.ig-karte{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:0 8px 22px rgba(20,60,20,.06);transition:transform .18s,box-shadow .18s}
.ig-karte:hover{transform:translateY(-3px);box-shadow:var(--schatten)}
.ig-bildlink{position:relative;display:block;background:var(--gruen-hell)}
.ig-bild{width:100%;aspect-ratio:4/5;object-fit:cover;display:block}
.ig-video{position:absolute;top:12px;right:12px;width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:rgba(18,32,22,.55);color:#fff;font-size:.9rem;padding-left:3px}
.ig-body{display:flex;flex-direction:column;gap:8px;padding:15px 17px 17px}
.ig-datum{font-family:'Encode Sans Condensed','Encode Sans',sans-serif;font-weight:700;font-size:.74rem;text-transform:uppercase;letter-spacing:.05em;color:var(--gruen)}
.ig-text{margin:0;color:#2a352a;font-size:.96rem;line-height:1.55;display:-webkit-box;-webkit-line-clamp:6;-webkit-box-orient:vertical;overflow:hidden}
.ig-mehr{align-self:flex-start;color:var(--gruen-dunkel);font-weight:700;font-size:.88rem;text-decoration:none}
.ig-mehr:hover{text-decoration:underline}
.ig-folgen{text-align:center;margin-top:34px}

/* Sprachumschalter im Header */
.kopf-sprache{display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:38px;padding:0 10px;margin-right:2px;font-weight:700;font-size:.82rem;letter-spacing:.03em;color:var(--gruen-dunkel);border:1px solid var(--line);border-radius:9px;text-decoration:none}
.kopf-sprache:hover{background:var(--gruen-hell);color:var(--gruen);border-color:var(--gruen)}
.fuss-sprache{color:inherit;text-decoration:underline;text-underline-offset:2px}
.fuss-sprache:hover{color:#fff}

/* ---------- Kopf zweizeilig ab Desktop: Logo bleibt frei, Navigation kommt in eine eigene Zeile darunter ---------- */
@media (min-width:1081px){
  .kopf-innen{flex-wrap:wrap; row-gap:2px; column-gap:14px}
  .marke{flex:0 0 auto}
  .marke img{height:60px}
  .kopf-merk{margin-left:auto}
  .hauptnav{order:10; flex-basis:100%; width:100%; margin-left:0; justify-content:center; flex-wrap:wrap;
    border-top:1px solid var(--line); margin-top:4px}
  .nav-item>a{padding:12px 11px; font-size:1rem}
}