/* se_events – »Das Kurprogramm« (Redesign 07.10.2026): je Tag eine Doppelseite, links Vorschau des Tages, rechts Programm.
   Zeitleiste/Filter in der Fahrplan-Bauform .gm-fp, Fakten in .gm-hours-card (Impressum). Nur Tokens, ein Radius, sticky nie in <section>.
   Bestandsmaß ohne Token: Feldhöhe 2.75rem (= .gf-input/.gf-select in se_form, GOLDENE REGEL Felder gleich hoch).
   Eigene Maße des Heftes: Programmfoto 10rem/7.5rem, Kalenderblatt im Tageskopf 5.5rem breit. */
.evk, .evk-detail { --evk-feld-h: 2.75rem; }
section:has(.evk, .evk-detail) { overflow: visible; } /* gm-layout.css: section{overflow:hidden} würde jedes sticky kappen */
/* Erster Blick: auf Kalender und Termin trägt die Seite selbst das Bild – Theme-Hero (Video, Claim) entfällt hier,
   die Seitenpille (h1 der Liste) bleibt; auf der Detailroute ist die Pille nur Zierde (Content trägt h1). */
body:has(.evk-detail) :is(.page-title-section, .gm-subhero-signet, .gm-claim) { display: none !important; } /* nur Detailseite (16:9-Termin-Foto ist der Kopf); Listen tragen den Möwen-Hero wie alle Unterseiten (Nutzer 09.10.2026). !important: Bootstrap .d-md-block */
body:has(.evk-detail) .gm-titlehead { display: none; }
/* Klebende Zeilen sitzen direkt an der Unterkante der Seitenkopfzeile (--gm-sticky-h, gm-hero.js), nicht 12 px darunter wie --gm-subnav-top:
   sonst scheint in der Fuge Inhalt durch (Verdict-Pass 5, R2). */
:root { --evk-oben: var(--gm-sticky-h, 90px); }
/* Fokus nie unter Zeitleiste + klebender Kapitelzeile (WCAG 2.4.11, Verdict-Pass 5 R1) bzw. unter der Rückweg-Zeile der Detailseite */
html:has(.evk) { scroll-padding-top: calc(var(--evk-oben) + var(--evk-kopf-h, 6.5rem) + var(--gm-space-sm)); } /* Zeitleiste klebt nicht mehr (Nutzer 09.10.2026) */
html:has(.evk-detail) { scroll-padding-top: calc(var(--evk-oben) + 3.5rem + var(--gm-space-sm)); }

/* ── Zeitleiste: klebt allein; Filter scrollen mit ── */
.evk-zeit { background: var(--gm-white); padding-block: var(--gm-space-xs); border-bottom: 1px solid var(--fp-line); }
.evk-zeit .gm-fp-daysel { margin: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); } /* volle Breite (Nutzer 09.10.2026); mobil 3+2 weiter unten */
/* !important nur gegen globale Kettenregeln, deren Spezifität (bis 0,12,2) keine Komponentenregel erreicht:
   gm-content.css .gm-prose a:not(…) färbt jeden Link primary (aktiver Knopf: primary auf primary), gm.css färbt
   ihn bei :hover/:focus, und gm.css #content :is(li) a:not(…) unterstreicht und fettet jeden Link in einem <li>. */
.evk .gm-fp-daybtn { text-decoration: none; }
.evk .gm-fp-daybtn.is-active { color: var(--gm-white) !important; }
.evk .gm-fp-daybtn-num { white-space: nowrap; }
/* Bereichsleiste (Graal-Müritz | Mit Umland | Höhepunkte): Bauform .gm-tab-btn, gleiche Kettenregeln wie oben; mobil drei gleich breite Spalten in EINER Zeile */
.evk-bereich { margin-top: var(--gm-space-lg); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); } /* Luft zum Einleitungstext, volle Breite (Nutzer 09.10.2026) */
.evk-bereich .gm-tab-btn { justify-content: center; }
.evk .evk-bereich .gm-tab-btn { text-decoration: none; }
.evk .evk-bereich .gm-tab-btn.is-active { color: var(--gm-text-invers) !important; }
@media (max-width: 35rem) {
  .evk-bereich { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gm-space-xs); }
  /* zweizeilig erlaubt: »Graal‑Müritz-Kalender« bricht nur am Bindestrich vor »Kalender« (Ortsname per Output-Filter geschützt) */
  .evk-bereich .gm-tab-btn { justify-content: center; text-align: center; padding: .5rem 0; font-size: var(--gm-fs-kompakt); line-height: 1.2; }
  .evk-bereich .gm-tab-btn i { display: none; }
}
@media (max-width: 22.4rem) { .evk-bereich .gm-tab-btn { font-size: .8125rem; } } /* 320 px: »Graal‑Müritz-« passt sonst nicht in 91 px (gemessen 93 px) */

/* ── Suche und Filter ── */
.evk-steuer { display: flex; flex-wrap: wrap; align-items: center; gap: var(--gm-space-xs) var(--gm-space-md); margin: var(--gm-space-md) 0 var(--gm-space-lg); }
.evk-filter[open] { flex-basis: 100%; }
.evk-filter > summary { display: inline-flex; align-items: center; gap: var(--gm-space-xs); list-style: none; font-size: var(--gm-fs-kompakt); font-weight: var(--gm-fw-betont); color: var(--gm-ink); }
.evk-filter > summary::-webkit-details-marker, .evk-dauer > summary::-webkit-details-marker, .evk-kal > summary::-webkit-details-marker { display: none; }
.evk-filter[open] > summary { background: var(--fp-accent); color: var(--gm-white); border-color: var(--fp-accent); }
/* »Suche und Filter« ist Arbeitsgerät (Nutzer 09.10.2026: deutlicher, markanter): volle Zeile in der Kachelbauform der Zeitleiste
   (Radius und 1-px-Linie wie die Kacheln), Grundschrift, mind. 48 px hoch; geöffnet wie bisher in der Akzentfarbe */
.evk-filter { flex: 1 1 16rem; }
.evk .evk-filter > summary { display: flex; min-height: 3rem; padding: var(--gm-space-xs) var(--gm-space-md); border: 1px solid var(--fp-line);
  border-radius: var(--gm-radius); background: var(--gm-white); color: var(--gm-primary); font-size: 1rem; }
.evk .evk-filter > summary .fa-sliders { color: var(--gm-sea); font-size: 1.15em; }
.evk .evk-filter > summary .evk-auf-zu { margin-left: auto; }
.evk .evk-filter:not([open]) > summary:hover { background: var(--gm-flaeche-ruhig); }
.evk .evk-filter[open] > summary { background: var(--fp-accent); color: var(--gm-white); border-color: var(--fp-accent); }
.evk .evk-filter[open] > summary .fa-sliders { color: inherit; }
.evk-auf-zu, .evk-dauer > summary i { transition: transform var(--gm-dur-fast) var(--gm-ease-out); }
.evk-filter[open] .evk-auf-zu, .evk-dauer[open] > summary i { transform: rotate(180deg); }
.evk-panel { margin-top: var(--gm-space-sm); padding: var(--gm-space-md) var(--gm-space-lg) var(--gm-space-lg); background: var(--fp-soft); border: 1px solid var(--gm-border); border-radius: var(--gm-radius); }
.evk-felder { display: grid; grid-template-columns: minmax(0, 2fr) repeat(2, minmax(0, 1fr)); grid-template-rows: auto auto; gap: var(--gm-space-3xs) var(--gm-space-sm); }
.evk-feld { display: grid; grid-template-rows: subgrid; grid-row: span 2; margin: 0; font-size: var(--gm-fs-kompakt); font-weight: var(--gm-fw-betont); color: var(--gm-ink); }
.evk-feld input { width: 100%; min-width: 0; height: var(--evk-feld-h); box-sizing: border-box; padding: 0 var(--gm-space-sm); font: inherit; font-size: var(--gm-fs-fliess); font-weight: var(--gm-fw-text); color: var(--gm-ink); background: var(--gm-white); border: 1px solid var(--gm-border); border-radius: var(--gm-radius); }
.evk-feld input:focus-visible { outline: var(--gm-focus-width) solid var(--gm-fokus); outline-offset: var(--gm-focus-offset); border-color: var(--gm-fokus); }
.evk-panel .gm-fp-filt { margin: var(--gm-space-md) 0 0; padding: 0; border: 0; min-width: 0; }
.evk-panel legend { float: none; width: 100%; margin: 0 0 var(--gm-space-2xs); padding: 0; font-size: var(--gm-fs-kompakt); font-weight: var(--gm-fw-betont); line-height: var(--gm-lh-titel); color: var(--gm-ink); }
.evk-chip { position: relative; display: inline-flex; align-items: center; gap: var(--gm-space-3xs); margin: 0; background: var(--gm-white); }
.evk-chip input { position: absolute; opacity: 0; pointer-events: none; }
.evk-chip i { display: none; }
.evk-chip:has(input:checked) { background: var(--fp-accent); color: var(--gm-white); border-color: var(--fp-accent); }
.evk-chip:has(input:checked) i { display: inline; } /* Häkchen: Zustand nicht nur über Farbe (WCAG 1.4.1) */
.evk-chip:has(input:focus-visible) { outline: var(--gm-focus-width) solid var(--gm-fokus); outline-offset: var(--gm-focus-offset); }
.evk-knoepfe { display: flex; flex-wrap: wrap; align-items: center; gap: var(--gm-space-sm) var(--gm-space-lg); margin: var(--gm-space-lg) 0 0; }
.evk-anzahl { margin: 0 0 0 auto; font-size: var(--gm-fs-kompakt); color: var(--gm-text); font-variant-numeric: tabular-nums; }

/* ── Doppelseite: Papier (Creme), Kapitelzeile über beiden Spalten, links Vorschau des Tages randlos, rechts Programm, Heftfalz dazwischen ── */
.evk-tag + .evk-tag { margin-top: var(--gm-space-2xl); }
.evk-blatt { --evk-rand: clamp(var(--gm-space-lg), 3vw, var(--gm-space-2xl)); display: grid; grid-template-columns: minmax(0, 46fr) minmax(0, 54fr); grid-template-rows: auto 1fr;
  grid-template-areas: "kopf kopf" "bild prog"; background: var(--gm-flaeche-ruhig); color: var(--gm-ink); border-radius: var(--gm-radius); overflow: clip; }
.evk-blatt--einzeln { grid-template-columns: minmax(0, 1fr); grid-template-areas: "kopf" "prog"; }
/* Falz: Haarlinie plus ein Hauch Schatten am Bund – nur wenn links ein Bild liegt */
.evk-blatt:not(.evk-blatt--einzeln) .evk-programm { background-image: linear-gradient(90deg, color-mix(in srgb, var(--gm-ink) 7%, transparent), color-mix(in srgb, var(--gm-ink) 0%, transparent) var(--gm-space-xl)); box-shadow: inset 1px 0 0 var(--fp-line); }

/* Kopf: Bauform der Event-Cards (.gm-event-date + Kalenderblatt .gm-event-cal, gm-content.css) – nur das Blatt ist größer (Kurprogramm) */
/* Kapitelzeile (Runde 9, Nutzer 09.10.2026): über der ganzen Doppelseite, klebt unter der Zeitleiste; ihre Höhe (--evk-kopf-h, events.js)
   setzt die Vorschau des Tages darunter. Blattfarbe, Haarlinie unten, unter der Zeitleiste (z 5), über dem Inhalt. */
.evk-kopfzeile { grid-area: kopf; position: sticky; top: var(--evk-oben); z-index: 3;
  padding: 0; background: var(--gm-flaeche-ruhig); border-bottom: 1px solid var(--fp-line); }
.evk-programm > .evk-eintraege:first-child { margin-top: 0; } /* Programm beginnt direkt unter der Kapitelzeile, ohne zweite Linie */
.evk-programm > .evk-eintraege:first-child > .evk-e:first-child { border-top: 0; }
/* Kalenderblatt als Daumenregister (Nutzer 09.10.2026): bündig links, volle Höhe der Kapitelzeile, quadratisch (--evk-blatt minus Haarlinie);
   Bauform innen wie sitewide (Monatsbalken oben, Ziffer mittig), Haarlinie oben/links/rechts (unten keine), nur oben links gerundet, kein Schatten. */
.evk-blatt { --evk-blatt: 6.5rem; }
.evk .evk-datum { display: grid; grid-template-columns: auto 1fr; align-items: stretch; gap: 0; margin: 0; }
.evk .evk-datum > div { display: flex; flex-direction: column; justify-content: center; gap: var(--gm-space-3xs); padding-inline: var(--gm-space-md); } /* Wochentag und Meta vertikal mittig */
.evk .evk-tagkopf { margin: 0; font-family: var(--gm-font-head); font-size: var(--gm-fs-h3); font-weight: var(--gm-fw-titel); line-height: 1.1; color: var(--gm-primary); } /* Wochentag neben dem Blatt: eine Stufe unter h2 (Nutzer 08.10.2026) */
.evk-datum .gm-event-cal { display: flex; flex-direction: column; width: calc(var(--evk-blatt) - 1px); height: calc(var(--evk-blatt) - 1px); aspect-ratio: 1 / 1;
  border: 1px solid var(--fp-line); border-bottom: 0; border-radius: var(--gm-radius) 0 0 0; box-shadow: none; } /* Rundung nur oben links; Haarlinie oben, links, rechts; unten läuft das Blatt in die Zeile aus (Nutzer 09.10.2026) */
.evk-datum .gm-event-cal-m { font-size: var(--gm-fs-label); padding-block: var(--gm-space-3xs); border-radius: 0; }
.evk-datum .gm-event-cal-d { display: grid; place-items: center; flex: 1; padding: 0; font-size: 3.25rem; font-variant-numeric: lining-nums; }
.evk-kopf-meta { margin: 0; font-size: var(--gm-fs-lead); font-weight: var(--gm-fw-text); line-height: var(--gm-lh-titel); color: var(--gm-text); font-variant-numeric: tabular-nums; } /* eine Stufe über Fließtext */

/* Vorschau des Tages: Text auf eigenem deckenden Verlauf (Kontrast am Textkasten) */
.evk-auf { grid-area: bild; position: sticky; top: calc(var(--evk-oben) + var(--evk-kopf-h, 8rem)); align-self: start; display: grid; margin: 0;
  aspect-ratio: 16 / 9; max-height: calc(100vh - var(--evk-oben) - var(--evk-kopf-h, 8rem)); background: var(--gm-primary); } /* alle Vorschaufotos 16:9 (Nutzer 08.10.2026) */
.evk-auf > * { grid-area: 1 / 1; }
.evk-auf-img { width: 100%; height: 100%; min-height: 0; object-fit: cover; }
.evk-auf-tipp { justify-self: start; padding: var(--gm-space-3xs) var(--gm-space-xs); background: var(--gm-sun); color: var(--gm-ink); border-radius: var(--gm-radius);
  font-size: var(--gm-fs-label); font-weight: var(--gm-fw-label); letter-spacing: var(--gm-ls-label); text-transform: var(--gm-tt-label); line-height: var(--gm-lh-titel); }
.evk-auf-text { align-self: end; display: grid; gap: var(--gm-space-xs); padding: var(--gm-space-3xl) var(--evk-rand) var(--evk-rand); color: var(--gm-text-on-photo);
  background: linear-gradient(0deg, color-mix(in srgb, var(--gm-ink) 78%, transparent) 0, color-mix(in srgb, var(--gm-ink) 78%, transparent) calc(100% - var(--gm-space-3xl)), color-mix(in srgb, var(--gm-ink) 0%, transparent) 100%); }
.evk-auf-zeit { font-size: var(--gm-fs-kompakt); font-weight: var(--gm-fw-betont); color: var(--gm-label-on-photo); font-variant-numeric: tabular-nums; }
.evk-auf-tag { display: none; white-space: nowrap; } /* Tag in der Bildzeile nur Desktop (Tagkopf steht dort unter dem Foto); aria-hidden, der Tagkopf trägt ihn für Screenreader */
@media (min-width: 48rem) { .evk-auf-tag { display: inline; } }
.evk-auf-titel { font-family: var(--gm-font-head); font-size: var(--gm-fs-h2); font-weight: var(--gm-fw-titel); line-height: 1.1; text-wrap: balance; }
/* »Zum Termin« (Vorschau des Tages): Knopfbauform der Aktionszeile (btn btn-sm gm-fp-ev-cta) als Outline auf dem Foto (Bootstrap btn-outline-light):
   weißer Rand und weiße Schrift auf demselben Glasgrund wie die Urheberzeile (Tinte 78 % + Weichzeichner, Kontrast am Knopf, nicht am Motiv);
   Hover/Fokus weiß gefüllt mit Tinte-Text. Eine Stufe kleiner (--klein). Die ganze Bildfläche bleibt klickbar (::after). */
.gm-fp-ev-cta--klein { --bs-btn-font-size: var(--gm-fs-klein); --bs-btn-padding-y: var(--gm-space-3xs); --bs-btn-padding-x: var(--gm-space-2xs); } /* eine Stufe unter btn-sm, Radius bleibt */
.evk .evk-auf-link { justify-self: start; display: inline-flex; align-items: center; gap: var(--gm-space-2xs); font-weight: var(--gm-fw-betont); text-decoration: none !important;
  --bs-btn-bg: color-mix(in srgb, var(--gm-ink) 78%, transparent); --bs-btn-border-color: var(--gm-white); --bs-btn-color: var(--gm-white);
  --bs-btn-hover-bg: var(--gm-white); --bs-btn-hover-border-color: var(--gm-white); --bs-btn-hover-color: var(--gm-primary);
  --bs-btn-active-bg: var(--gm-white); --bs-btn-active-border-color: var(--gm-white); --bs-btn-active-color: var(--gm-primary);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); color: var(--bs-btn-color) !important; }
.evk .evk-auf:hover .evk-auf-link, .evk .evk-auf-link:focus-visible { background: var(--gm-white); border-color: var(--gm-white); color: var(--gm-primary) !important; }
.evk-auf-link::after { content: ""; position: absolute; inset: 0; } /* ganzes Bild klickbar */
.evk-auf-link i { order: 2; margin: 0 !important; } /* Pfeil rechts */
.evk-auf-link i { transition: transform var(--gm-dur-fast) var(--gm-ease-out); }
.evk-auf:hover .evk-auf-link i { transform: translateX(3px); }
.evk .evk-auf-link:focus-visible { outline: var(--gm-focus-width) solid var(--gm-fokus-invers); outline-offset: var(--gm-focus-offset); }

/* Urheber im Bild (§ 13 UrhG): eigener Kasten mit fester Deckung 78 % (= --gm-deckung-fest) – lesbar auf jedem Motiv */
.evk-credit { position: relative; z-index: 1; align-self: end; justify-self: end; max-width: 100%; margin: 0; padding: var(--gm-space-3xs) var(--gm-space-xs);
  background: color-mix(in srgb, var(--gm-ink) 78%, transparent); color: var(--gm-text-on-photo); font-size: var(--gm-fs-klein); font-weight: var(--gm-fw-text); line-height: var(--gm-lh-titel); overflow-wrap: anywhere; border-radius: var(--gm-radius) 0 0; }
.evk-auf .evk-credit { align-self: start; border-radius: 0 0 0 var(--gm-radius); }
.evk-e-bild, .evk-leiste-bild, .evk-titelbild { position: relative; display: grid; margin: 0; }
:is(.evk-e-bild, .evk-leiste-bild, .evk-titelbild) > * { grid-area: 1 / 1; }
/* Fotos im Programmeintrag (≤ 10rem): nur ©-Chip unten rechts (Glasgrund wie .evk-credit), voller Urheber als natives Popover unter dem Chip */
.evk-credit-chip { position: relative; z-index: 2; align-self: end; justify-self: end; display: grid; place-items: center; width: var(--gm-target-min); height: var(--gm-target-min); margin: var(--gm-space-2xs);
  padding: 0; border: 0; border-radius: 50%; background: color-mix(in srgb, var(--gm-white) 70%, transparent); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  color: var(--gm-ink); font: var(--gm-fw-betont) .75rem/1 var(--gm-font-body); opacity: .75; cursor: help; transition: opacity var(--gm-dur-fast) var(--gm-ease-out); }
.evk-credit-chip--ki { font-size: .625rem; } /* »KI« 10 px, bold */
.evk-e:is(:hover, :focus-within) .evk-credit-chip, .evk-credit-chip:hover, .evk-credit-chip:focus-visible { opacity: 1; }
.evk-credit-chip:focus-visible { outline: var(--gm-focus-width) solid var(--gm-fokus); outline-offset: 2px; }
.evk-credit-pop { margin: 0; padding: var(--gm-space-3xs) var(--gm-space-xs); max-width: 18rem; border: 0; border-radius: var(--gm-radius); box-shadow: var(--gm-shadow-overlay);
  background: var(--gm-ink); color: var(--gm-white); font-size: var(--gm-fs-klein); line-height: var(--gm-lh-titel);
  inset: auto var(--gm-space-md) var(--gm-space-md) auto; } /* ohne Anchor Positioning: unten rechts im Fenster */
@supports (position-area: bottom) { .evk-credit-pop { inset: auto; position-area: bottom span-left; margin-top: var(--gm-space-3xs); } } /* am Chip (implizite Verankerung über popovertarget) */
/* kleine Bilder (≤ 10rem, Bildleiste): Urheber ungekürzt unter dem Bild */
.evk-credit--unter { grid-area: auto; justify-self: start; margin-top: var(--gm-space-3xs); padding: 0; background: none; color: var(--gm-text); border-radius: 0; }

/* Programm */
.evk-programm { grid-area: prog; padding: 0 var(--evk-rand) var(--evk-rand); }
.evk-eintraege { margin: var(--gm-space-lg) 0 0; padding: 0; list-style: none; }
/* Programmeintrag – ein Eintrag = ein Ziel: Titel-Link als .stretched-link (Bootstrap) über dem ganzen Eintrag, Tickets und ©-Chip darüber.
   Hover/Fokus: nur der Grund eine Stufe dunkler (Creme → Sand) und der Pfeil bei »Zum Termin« wandert; Titel ohne Unterstreichung.
   Hover-Fläche bündig mit dem Blatt (Innenkante/Falz bis Außenkante), Text fluchtet mit dem Tageskopf. */
.evk-e { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--gm-space-sm) var(--gm-space-lg);
  margin-inline: calc(-1 * var(--evk-rand)); padding: var(--gm-space-md) var(--evk-rand); border-top: 1px solid var(--fp-line);
  transition: background-color var(--gm-dur-fast) var(--gm-ease-out); }
.evk-e:hover, .evk-e:has(.evk-e-titel a:focus-visible) { background: color-mix(in srgb, var(--gm-sand) 45%, var(--gm-flaeche-ruhig)); }
.evk-e:has(.evk-e-titel a:focus-visible) { outline: var(--gm-focus-width) solid var(--gm-fokus); outline-offset: -3px; }
/* stylelint-disable-next-line declaration-property-value-disallowed-list */
.evk .evk-e-titel a:focus-visible { outline: 0; } /* Fokusring sitzt am ganzen Eintrag (:has, wie .gm-ziel) – WCAG 2.4.7 erfüllt */
/* Raster: Text links, Foto rechts (Zeile 1), Meta-/Aktionszeile über die volle Breite darunter (Zeile 2) – »Zum Termin →« fluchtet
   mit der rechten Fotokante. Rhythmus: Uhrzeit → Titel 4 px, Titel → Untertitel 0, → Adresse 6 px, → Meta-Zeile 12 px (Zeilenabstand). */
.evk-e:not(.evk-e--bild) { grid-template-columns: minmax(0, 1fr); }
.evk-e-text { grid-row: 1; display: flex; flex-direction: column; min-width: 0; }
.evk-e > .evk-e-aktion { grid-column: 1 / -1; }
.evk .evk-e-text > *, .evk .evk-e-aktion { margin: 0; } /* .evk vorn: schlägt .gm-prose p (Absatzrand 1rem, Zeilenhöhe 1.7) */
.evk .evk-e-text > .evk-e-titel { margin-top: var(--gm-space-3xs); }
.evk .evk-e-text > .evk-e-ort { margin-top: var(--gm-space-2xs); }
.evk .evk-e-text > .evk-e-teaser + .evk-e-ort { margin-top: var(--gm-space-xs); }
.evk-e-bild { grid-column: 2; grid-row: 1; width: 10rem; align-self: start; }
.evk-e-bild img, .evk-leiste-bild img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--gm-radius); } /* 16:9, Zuschnitt am Fokuspunkt (object-position) */
:is(.evk, .evk-detail) .evk-e-zeit { display: block; font-size: var(--gm-fs-fliess); font-weight: var(--gm-fw-betont); line-height: var(--gm-lh-titel); color: var(--gm-primary); letter-spacing: .01em; /* Uhrzeit eine Stufe auffälliger: Fließgröße, Marine (Nutzer 09.10.2026) */ font-variant-numeric: tabular-nums; }
.evk .evk-e-titel { font-family: var(--gm-font-head); font-size: var(--gm-fs-h5); font-weight: var(--gm-fw-titel); line-height: var(--gm-lh-titel); color: var(--gm-primary); text-wrap: balance; }
.evk .evk-e-titel a, .evk .evk-leiste-titel, .evk-detail .evk-leiste-titel { color: var(--gm-primary) !important; font-weight: inherit !important; text-decoration: none !important; }
.evk-e--abgesagt .evk-e-titel a { text-decoration: line-through !important; }
.evk .evk-e-teaser { max-width: var(--gm-measure); margin-top: var(--gm-space-xs); font-size: var(--gm-fs-kompakt); line-height: var(--gm-lh-titel); color: var(--gm-text); } /* Teaser-Satz (Runde 8): serverseitig an Wort-/Satzgrenze gekürzt, kein line-clamp */
.evk .evk-e-text > .evk-e-zusatz { margin-top: calc(var(--gm-space-3xs) / 2); font-family: var(--gm-font-head); font-size: var(--gm-fs-fliess); font-style: italic; line-height: var(--gm-lh-titel); color: var(--gm-text); } /* Bauform der Unterzeile im Detail (.evk-unterzeile), eine Stufe kleiner */
:is(.evk, .evk-detail) .evk-e-ort { font-size: var(--gm-fs-kompakt); line-height: var(--gm-lh-titel); color: var(--gm-text); }
.evk-e-ort i { color: var(--gm-sea); }
.evk-preis { font-size: var(--gm-fs-kompakt); font-weight: var(--gm-fw-betont); color: var(--gm-ink); font-variant-numeric: tabular-nums; }
/* Aktionszeile: Eintrag = links Preis + Plaketten (brechen nur unter sich um), rechts die Knopfgruppe; Karte = nur »Zum Termin →« (Kanon gm-link-arrow) */
:is(.evk, .evk-detail) .evk-e-aktion { display: flex; align-items: center; align-items: last baseline; gap: var(--gm-space-sm); margin: 0; font-size: var(--gm-fs-kompakt); line-height: var(--gm-lh-titel); }
.evk-e-meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--gm-space-xs) var(--gm-space-sm); min-width: 0; }
/* Fußleiste des Programmeintrags (Nutzer 09.10.2026 »Buttonleiste durchziehen als optischen Abschluss«): über die volle Eintragsbreite,
   12 px unter der tieferen Spalte (Text oder Foto). Haarlinie oben wie .evk-dauer, die Leiste IST die Gruppenfläche (Weiß, radius-group):
   links Preis + Plaketten, rechts die Knöpfe ohne zweite Fläche. Mobil zwei Zeilen innen: Preis, darunter beide Knöpfe gleich breit. */
.evk .evk-e { row-gap: var(--gm-space-sm); }
:is(.evk, .evk-detail) .evk-e > .evk-e-fuss { align-items: center; justify-content: space-between; gap: var(--gm-space-sm);
  padding: var(--gm-space-3xs) var(--gm-space-3xs) var(--gm-space-3xs) var(--gm-space-sm); background: var(--gm-flaeche-grund); border-top: 1px solid var(--fp-line); border-radius: var(--gm-radius-group); }
:is(.evk, .evk-detail) .evk-e-fuss > .evk-e-knoepfe { margin-left: auto; padding: 0; background: none; border-radius: 0; }
.evk-preis-betrag { font-size: var(--gm-fs-fliess); font-weight: var(--gm-fw-betont); color: var(--gm-primary); font-variant-numeric: tabular-nums; }
/* Knopfgruppe des Programmeintrags (Runde 7, Nutzer 09.10.2026): Bauform der Kopfzeile »WebCam | Service« (gm-header.css: btn-group auf
   Gruppenfläche, --gm-radius-group, Polster 3xs), hier Weiß auf dem Creme-Blatt. Tickets Outline (weiß, Tinte), »Zum Termin →« Marine gefüllt.
   Über der Klickfläche des Titels (stretched-link); ein Radius je Ebene (Gruppe radius-group, Knopf radius), kein Schatten. */
:is(.evk, .evk-detail) .evk-e-knoepfe { position: relative; z-index: 2; flex: none; gap: var(--gm-space-3xs); padding: var(--gm-space-3xs); background: var(--gm-flaeche-grund); border-radius: var(--gm-radius-group); }
:is(.evk, .evk-detail) .evk-e-knoepfe.btn-group > .btn, .evk-detail .evk-zurueck > .btn, :is(.evk, .evk-detail) .evk-knopf { display: inline-flex; align-items: center; justify-content: center; gap: var(--gm-space-2xs); margin: 0; border-radius: var(--gm-radius); font-weight: var(--gm-fw-betont); white-space: nowrap; color: var(--bs-btn-color); text-decoration: none; }
:is(.evk, .evk-detail) .evk-e-knoepfe.btn-group > .btn:hover, .evk-detail .evk-zurueck > .btn:hover, :is(.evk, .evk-detail) .evk-knopf:hover { color: var(--bs-btn-hover-color); }
:is(.evk, .evk-detail) .evk-e-knoepfe.btn-group > .btn:focus-visible, .evk-detail .evk-zurueck > .btn:focus-visible, :is(.evk, .evk-detail) .evk-knopf:focus-visible { z-index: 1; outline: var(--gm-focus-width) solid var(--gm-fokus); outline-offset: var(--gm-focus-offset); }
:is(.evk, .evk-detail) .evk-e-knoepfe > .evk-e-ticket, .evk-detail .evk-zurueck > .btn, :is(.evk, .evk-detail) .evk-knopf.btn-outline-secondary { --bs-btn-bg: var(--gm-flaeche-grund); --bs-btn-color: var(--gm-ink); --bs-btn-hover-bg: var(--gm-flaeche-ruhig); --bs-btn-hover-color: var(--gm-primary); --bs-btn-hover-border-color: var(--bs-btn-border-color); --bs-btn-active-bg: var(--gm-flaeche-ruhig); --bs-btn-active-color: var(--gm-primary); }
:is(.evk, .evk-detail) .evk-e-knoepfe > .evk-e-zum, :is(.evk, .evk-detail) .evk-knopf.btn-primary { --bs-btn-bg: var(--gm-flaeche-marke); --bs-btn-border-color: var(--gm-flaeche-marke); --bs-btn-color: var(--gm-text-invers);
  --bs-btn-hover-bg: var(--gm-primary-hover); --bs-btn-hover-border-color: var(--gm-primary-hover); --bs-btn-hover-color: var(--gm-text-invers);
  --bs-btn-active-bg: var(--gm-primary-hover); --bs-btn-active-border-color: var(--gm-primary-hover); --bs-btn-active-color: var(--gm-text-invers); }
:is(.evk, .evk-detail) .evk-e-knoepfe .evk-e-zum i, :is(.evk, .evk-detail) .evk-knopf .fa-arrow-right { order: 2; margin: 0; transition: transform var(--gm-dur-fast) var(--gm-ease-out); } /* Pfeil rechts */
:is(.evk-e, .evk-karte):hover .evk-e-zum i, :is(.evk, .evk-detail) .evk-e-zum:focus-visible i, :is(.evk, .evk-detail) .evk-knopf:is(:hover, :focus-visible) .fa-arrow-right { transform: translateX(3px); }
/* Einzelknöpfe (Runde 11, Nutzer 09.10.2026: jede Aktion ein Knopf): Weitere Tage, Alle Veranstaltungen, Alles zur Veranstaltung, Route planen … */
:is(.evk, .evk-detail) .evk-knopf i { margin: 0; }
/* Kompakt: Vorschau des Tages (Verweis) und Folgetage einer Serie – ohne Foto, kleinerer Titel */
.evk .evk-e--kompakt .evk-e-titel { font-size: var(--gm-fs-h6); }
.evk-e-verweis { font-weight: var(--gm-fw-text); color: var(--gm-text); }

/* Außerdem geöffnet: Dauerangebote als Karten – Bauform .evk-karte wie »Ebenfalls« im Detail (Nutzer 08.10.2026) */
.evk-dauer { margin-top: var(--gm-space-lg); border-top: 1px solid var(--fp-line); }
.evk-dauer > summary { display: flex; align-items: center; gap: var(--gm-space-xs); min-height: 2.75rem; padding-top: var(--gm-space-sm); list-style: none; cursor: pointer; font-size: var(--gm-fs-kompakt); font-weight: var(--gm-fw-betont); color: var(--gm-primary); }
.evk-dauer > summary:focus-visible { outline: var(--gm-focus-width) solid var(--gm-fokus); outline-offset: var(--gm-focus-offset); border-radius: var(--gm-radius); }
.evk-dauer .evk-eintraege { margin-top: var(--gm-space-sm); } /* auto-fill: ein einzelnes Dauerangebot bleibt Kartenbreite statt Programmspalte (»Ebenfalls« behält auto-fit) */

/* Fotonachweis, Weitere Tage, Leer, Quelle */
.evk-nachweis { margin-top: var(--gm-space-xl); font-size: var(--gm-fs-klein); color: var(--gm-text); }
.evk-nachweis summary { cursor: pointer; }
.evk-nachweis summary:focus-visible { outline: var(--gm-focus-width) solid var(--gm-fokus); outline-offset: var(--gm-focus-offset); border-radius: var(--gm-radius); }
.evk-nachweis ul { margin: var(--gm-space-xs) 0 0; padding-left: var(--gm-space-lg); }
.evk .evk-weiter { margin: var(--gm-space-xl) 0 0; } /* .evk davor: .gm-prose p (0,1,1) setzte margin-top sonst auf 0 */
.evk-leer { margin-top: var(--gm-space-md); }
.evk-leer p { margin: 0 0 var(--gm-space-xs); }
.evk-leer p:last-child { margin: 0; }
.evk-quelle { margin: var(--gm-space-xl) 0 0; padding-top: var(--gm-space-sm); border-top: 1px solid var(--gm-border); font-size: var(--gm-fs-klein); color: var(--gm-text); }

/* ── Menüs (Kalender, Einladen): aufgeklappte Fläche = Höhenstufe 3 (--gm-shadow-overlay) ── */
.evk-kal { display: inline-block; position: relative; }
.evk-kal > summary { list-style: none; cursor: pointer; }
.evk-kal ul { position: absolute; z-index: 4; left: 0; top: calc(100% + var(--gm-space-3xs)); min-width: 15rem; margin: 0; padding: var(--gm-space-3xs) 0; list-style: none; background: var(--gm-white); border: 1px solid var(--gm-border); border-radius: var(--gm-radius); box-shadow: var(--gm-shadow-overlay); }
.evk-kal--rechts ul { left: auto; right: 0; }
@media (min-width: 561px) { .evk-kal ul { width: max-content; } .evk-kal li :is(a, button) { white-space: nowrap; } }
.evk-kal li :is(a, button) { display: flex; align-items: center; gap: var(--gm-space-xs); width: 100%; min-height: var(--gm-target-min); padding: var(--gm-space-xs) var(--gm-space-md); font: inherit; font-size: var(--gm-fs-kompakt); font-weight: var(--gm-fw-betont); color: var(--gm-primary); text-align: left; text-decoration: none !important; background: none; border: 0; cursor: pointer; }
.evk-kal li :is(a, button):hover, .evk-kal li :is(a, button):focus-visible { background: var(--fp-soft); }
.evk-kal li :is(a, button):focus-visible { outline: var(--gm-focus-width) solid var(--gm-fokus); outline-offset: calc(-1 * var(--gm-focus-width)); }
.evk-kal li i { width: 1.25em; color: var(--gm-sea); }

/* ── Detail: Titelbild, Kopf mit Aktionen, Lesespalte + Faktenkarte, Adresse (Karte), Ebenfalls ── */
.evk-detail { margin-bottom: var(--gm-space-xl); }
.evk-titelbild { margin-bottom: var(--gm-space-xl); }
/* Rückweg-Zeile der Detailseite (Runde 8): klebt an der Kopfzeile (--evk-oben), Blattfarbe, Haarlinie; Ziel 44 px */
.evk-detail { --evk-zurueck-h: 2.75rem; }
.evk-zurueck { position: sticky; top: var(--evk-oben); z-index: 4; display: flex; align-items: center; height: var(--evk-zurueck-h); margin-bottom: var(--gm-space-sm);
  background: var(--gm-flaeche-ruhig); border-bottom: 1px solid var(--fp-line); padding-inline: var(--gm-space-xs); }
.evk-detail .evk-zurueck > .btn i { margin: 0; transition: transform var(--gm-dur-fast) var(--gm-ease-out); } /* Knopf wie »Tickets« (Nutzer 09.10.2026 »Buttonlösung«) */
@media (hover: hover) and (pointer: fine) { .evk-detail .evk-zurueck > .btn:hover i { transform: translateX(-3px); } } /* Pfeil links weicht nach links */
.evk-titelbild img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; max-height: calc(50vh - var(--evk-zurueck-h) - var(--gm-space-sm)); object-fit: cover; border-radius: var(--gm-radius); } /* 16:9 vollbreit, höchstens 50vh abzüglich Rückweg-Zeile (Runde 8): h1, Datum und Tickets im ersten Viewport (Nutzer 09.10.2026: 55vh; gemessen 1280 × 900 lagen die Tickets dann bei 921 px, also unter dem Falz); Zuschnitt am Fokuspunkt */
.evk-titelbild .evk-credit { border-radius: var(--gm-radius) 0; } /* Hero 16:9 in voller Inhaltsbreite, Urheber unten rechts im Bild (Nutzer-Vorgabe 08.10.2026) */
.evk-kopf { max-width: 52rem; }
.evk-detail .evk-h1 { margin: 0; font-family: var(--gm-font-head); font-size: var(--gm-fs-h1); font-weight: var(--gm-fw-titel); line-height: 1.05; letter-spacing: -.01em; color: var(--gm-primary); text-wrap: balance; overflow-wrap: break-word; }
.evk-unterzeile { margin: var(--gm-space-xs) 0 0; font-family: var(--gm-font-head); font-size: var(--gm-fs-h5); font-style: italic; color: var(--gm-text); }
.evk-lead { margin: var(--gm-space-md) 0 0; font-size: var(--gm-fs-lead); color: var(--gm-ink); font-variant-numeric: tabular-nums; }
.evk-plaketten { display: flex; flex-wrap: wrap; gap: var(--gm-space-2xs); margin: var(--gm-space-sm) 0 0; }
.evk-detail .evk-aktion { display: flex; flex-wrap: wrap; align-items: flex-start; gap: var(--gm-space-xs); margin-top: var(--gm-space-lg); }
.evk-aktion .btn i { margin-right: var(--gm-space-3xs); }
.evk-raster { display: grid; gap: var(--gm-space-xl) var(--gm-gap-wide); }
.evk-seite { display: grid; gap: var(--gm-gap); align-content: start; }
.evk-haupt > :first-child { margin-top: 0; }
.evk-seite .gm-hours-card { height: auto; overflow: visible; } /* overflow sichtbar: sonst schneidet die Karte das Kalendermenü ab */
.evk-seite .gm-hours-h { border-radius: var(--gm-radius) var(--gm-radius) 0 0; line-height: var(--gm-lh-titel); }
.evk-seite .gm-hours-list li { display: flex; flex-wrap: nowrap; justify-content: space-between; align-items: baseline; gap: var(--gm-space-md); }
.evk-seite .gm-hours-list span { flex: 0 0 auto; }
.evk-seite .gm-hours-list strong { flex: 0 1 auto; min-width: 0; white-space: normal; text-align: right; overflow-wrap: break-word; }
.evk-seite .gm-hours-list strong a { color: inherit; }
.evk-seite .gm-hours-list small { display: block; margin-top: var(--gm-space-3xs); font-size: var(--gm-fs-kompakt); font-weight: var(--gm-fw-text); color: var(--gm-text); }
.evk-seite .gm-hours-list li.evk-veranstalter strong { flex: 1 1 auto; text-align: left; } /* Veranstalter: Block linksbündig in der Wertespalte (Nutzer 09.10.2026) */
.evk-seite .gm-hours-list li.evk-veranstalter small a { font-weight: var(--gm-fw-text) !important; } /* Kontakt nicht fett: gm.css setzt Fließtext-Links per #content (ID-Spezifität) auf betont */
.evk-seite .gm-hours-list .evk-mail { overflow-wrap: anywhere; }
/* Preise: jede Angabe eine Zeile (Label links, Betrag rechts, tabellarisch), Fußnote zu Quelle und Stand */
.evk-seite .gm-hours-list li.evk-preise { flex-wrap: wrap; row-gap: var(--gm-space-2xs); }
.evk-preisliste { flex: 1 1 100%; margin: 0; padding: 0; list-style: none; }
.evk-seite .gm-hours-list .evk-preisliste li { display: flex; justify-content: space-between; gap: var(--gm-space-md); padding: var(--gm-space-3xs) 0; border: 0; }
.evk-seite .gm-hours-list .evk-preisliste span { white-space: normal; }
.evk-betrag { flex: none; font-weight: var(--gm-fw-betont); color: var(--gm-primary); font-variant-numeric: tabular-nums; }
.evk-seite .gm-hours-list .evk-preis-text { display: block; color: var(--gm-text); }
.evk-seite .gm-hours-list .evk-preis-fuss { flex: 1 1 100%; margin-top: var(--gm-space-2xs); font-size: var(--gm-fs-klein); line-height: var(--gm-lh-titel); color: color-mix(in srgb, var(--gm-ink) 70%, transparent); }
.evk-weitere li { flex-wrap: nowrap; align-items: center; }
.evk-weitere strong { margin-left: auto; }
.evk-seite .gm-hours-list small .gm-link-arrow { font-weight: var(--gm-fw-betont); }
.evk-text { max-width: var(--gm-measure); font-size: var(--gm-fs-fliess); line-height: var(--gm-lh-body); color: var(--gm-ink); }
.evk-text p { margin: 0 0 var(--gm-space-md); }
.evk-text-lead { font-size: var(--gm-fs-lead); } /* Kurzbeschreibung vor der Detailbeschreibung */
.evk-text :is(ul, ol) { margin: 0 0 var(--gm-space-md); padding-left: var(--gm-space-lg); }
.evk-detail .evk-h2 { margin: 0 0 var(--gm-space-md); font-family: var(--gm-font-head); font-size: var(--gm-fs-h3); font-weight: var(--gm-fw-titel); line-height: var(--gm-lh-titel); color: var(--gm-primary); }
/* Adresse mit Karte in voller Inhaltsbreite unter Text und Faktenkasten; Consent-Fläche höchstens 16:10 bzw. 24rem */
.evk-anfahrt { margin-top: var(--gm-space-xl); padding: 0; background: none; } /* Theme: section{padding:90px 0; background} */
.evk-anfahrt .gm-karte-kompakt { margin: 0; }
.evk-anfahrt .gm-map { height: auto; aspect-ratio: 16 / 10; max-height: 24rem; } /* Consent-Kasten und geladene Karte gleich hoch */
.evk-anfahrt .gm-map-consent-box i { font-size: var(--gm-fs-h4); margin-bottom: var(--gm-space-xs); }
.evk-anfahrt .gm-map-consent-box p { margin-bottom: var(--gm-space-sm); }
.evk-ebenfalls { margin-top: var(--gm-space-xl); padding: var(--gm-space-xl) 0 0; background: none; border-top: 1px solid var(--gm-border-subtle); }
/* Karte – EINE Bauform für »Ebenfalls« (Detail) und Dauerangebote (Liste): Raster mit Umbruch (auto-fit: keine leere Spur), Karten gleich hoch;
   Karte = Foto 16:9 (ohne Foto Platzhalter gleicher Höhe) / Text / Fuß »Zum Termin →« – der Fuß steht in jeder Karte auf derselben Höhe.
   Ein Ziel je Karte: Titel als .stretched-link; Urheber als Zeile im Bild (.evk-credit, Karte ≥ 16rem, § 13 UrhG). */
.evk-ebenfalls ul { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); grid-auto-rows: 1fr; gap: var(--gm-gap); margin: 0; padding: 0; list-style: none; }
.evk-karte { position: relative; display: grid; grid-template-rows: auto 1fr auto; background: var(--gm-flaeche-ruhig); border-radius: var(--gm-radius); overflow: clip; scroll-snap-align: start; }
.evk-karte:has(.evk-leiste-titel:focus-visible) { outline: var(--gm-focus-width) solid var(--gm-fokus); outline-offset: var(--gm-focus-offset); }
/* stylelint-disable-next-line declaration-property-value-disallowed-list */
.evk-karte .evk-leiste-titel:focus-visible { outline: 0; } /* Fokusring sitzt an der ganzen Karte (:has) – WCAG 2.4.7 erfüllt */
.evk-karte .evk-leiste-bild { margin: 0; }
.evk-karte .evk-leiste-bild img { border-radius: 0; }
.evk-karte-platz { display: grid; place-items: center; aspect-ratio: 16 / 9; padding: var(--gm-space-sm); background: color-mix(in srgb, var(--gm-sand) 45%, var(--gm-flaeche-ruhig));
  color: color-mix(in srgb, var(--gm-ink) 70%, transparent); font-family: var(--gm-font-head); font-size: var(--gm-fs-h5); font-weight: var(--gm-fw-text); line-height: var(--gm-lh-titel); text-align: center; text-wrap: balance; } /* ohne Foto: gleiche Höhe, Kategorie (sonst Ort) in der Titelschrift, Tinte 70 % = 4,82:1 (AA) */
.evk-karte-text { display: grid; align-content: start; gap: var(--gm-space-3xs); padding: var(--gm-space-sm) var(--gm-space-md) var(--gm-space-sm); }
.evk-karte .evk-e-zeit { margin: 0; }
.evk-leiste-titel { font-family: var(--gm-font-head); font-size: var(--gm-fs-h6); font-weight: var(--gm-fw-titel); line-height: var(--gm-lh-titel); }
.evk-karte .evk-leiste-titel { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; } /* höchstens zwei Zeilen */
.evk-karte .evk-e-ort { margin: 0; }
.evk-karte .evk-e-aktion { justify-content: flex-end; padding: 0 var(--gm-space-md) var(--gm-space-md); } /* »Ebenfalls«: ein Knopf »Zum Termin →« rechtsbündig am Kartenfuß */
.evk-fuss { margin-top: var(--gm-space-xl); background: none; } /* Theme: footer{background} – Fuß wie .evk-quelle der Liste: Linie, volle Breite */
.evk-fuss .evk-quelle { margin-top: 0; }
@media (min-width: 62rem) {
  /* EIN Gitter 7/5: Faktenkasten rechts ab Höhe der h1, klebt unter der Kopfzeile, solange der Text läuft */
  .evk-raster { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); grid-template-areas: "kopf seite" "haupt seite"; }
  .evk-raster .evk-kopf { grid-area: kopf; }
  .evk-raster .evk-haupt { grid-area: haupt; }
  .evk-raster .evk-seite { grid-area: seite; align-self: start; position: sticky; top: calc(var(--evk-oben) + var(--evk-zurueck-h) + var(--gm-space-md)); }
  /* Lange Serien: »Weitere Termine« scrollt in sich, damit der klebende Kasten nie höher als der Bildschirm wird */
  .evk-raster .evk-seite .evk-weitere { max-height: max(12rem, calc(100vh - var(--evk-oben) - 30rem)); overflow-y: auto; overscroll-behavior: contain; }
}
@media (max-width: 61.99rem) {
  /* Mobil: Kopf → Fakten → Karte → Text → Ebenfalls (das Gitter gibt seine Kinder an die Spalte ab) */
  .evk-d-innen { display: flex; flex-direction: column; }
  .evk-raster { display: contents; }
  .evk-d-innen > *, .evk-raster > * { order: 9; }
  .evk-kopf { order: 1; } .evk-seite { order: 2; margin-top: var(--gm-space-xl); } .evk-anfahrt { order: 3; margin-top: var(--gm-space-xl); } .evk-haupt { order: 4; margin-top: var(--gm-space-xl); }
}

/* ── Tablet: Doppelseite gestapelt, Bild quer ── */
@media (max-width: 61.99rem) {
  .evk-blatt { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; grid-template-areas: "kopf" "bild" "prog"; }
  .evk-blatt:not(.evk-blatt--einzeln) .evk-programm { background-image: none; box-shadow: none; }
  .evk-auf { position: relative; top: auto; max-height: none; margin-top: var(--gm-space-lg); }
  .evk-programm { padding-top: 0; }
}

@media (max-width: 47.99rem) {
  /* Runde 12 (Nutzer 09.10.2026 »Pill und Button nicht so dicht«): Preis/Plaketten und Knöpfe zwei klar getrennte Zeilen (16 px);
     die Fläche umschließt die Knöpfe ringsum mit xs (8 px, Nutzer 09.10.2026 »Innenrand auf 8 px heben«), die Preiszeile fluchtet 16 px innen
     und steht 12 px unter der Kante */
  :is(.evk, .evk-detail) .evk-e > .evk-e-fuss { flex-wrap: wrap; row-gap: var(--gm-space-md); padding: var(--gm-space-xs); }
  :is(.evk, .evk-detail) .evk-e-fuss > .evk-e-meta { flex-basis: 100%; padding: var(--gm-space-3xs) var(--gm-space-xs) 0; }
  /* Luft mobil (Runde 12, Nutzer 09.10.2026 »zu gequetscht … luftiger, unaufgeregter, logischer«): EINE Stufenleiter –
     im Kopf (Uhrzeit, Titel, Untertitel) 4/2 px, Kopf → Text 12, im Text (Teaser → Ort) 8, Text → Fuß 16, Eintrag 24 oben und unten;
     Teaser und Ort in Fließtext-Zeilenhöhe. Nur Abstand, keine neue Fläche. */
  .evk .evk-e { row-gap: 0; padding-block: var(--gm-space-lg); }
  .evk .evk-e > .evk-e-fuss { margin-top: var(--gm-space-md); }
  .evk .evk-e-text > :is(.evk-e-teaser, .evk-e-ort) { margin-top: var(--gm-space-sm); line-height: var(--gm-lh-body); }
  .evk .evk-e-text > .evk-e-teaser + .evk-e-ort { margin-top: var(--gm-space-xs); }
  /* Mit Foto (Runde 12, Nutzer 09.10.2026 »volle Breite nutzen«): Foto nur neben dem Kopf (Uhrzeit, Titel, Untertitel),
     Teaser und Ort darunter über die volle Eintragsbreite. Der Textblock gibt seine Kinder ans Raster ab (Reihenfolge im DOM bleibt). */
  .evk .evk-e--bild { grid-template-rows: auto auto 1fr; } /* ist das Foto höher als der Kopf, wächst nur die dritte Zeile (fr) – Uhrzeit und Titel rücken nicht auseinander */
  .evk .evk-e--bild .evk-e-text { display: contents; }
  .evk .evk-e--bild :is(.evk-e-zeit, .evk-e-titel, .evk-e-zusatz) { grid-column: 1; }
  .evk .evk-e--bild :is(.evk-e-teaser, .evk-e-ort) { grid-column: 1 / -1; }
  .evk .evk-e--bild > .evk-e-bild { grid-column: 2; grid-row: 1 / span 3; }
  /* Knopfgruppe mobil: volle Eintragsbreite, Knöpfe gleich breit, Ziel 44 px; Preis/Plaketten als eigene Zeile darüber */
  :is(.evk, .evk-detail) .evk-e-fuss > .evk-e-knoepfe, .evk-knoepfe > .evk-e-knoepfe { flex: 1 1 100%; margin-left: 0; }
  .evk-detail { --evk-zurueck-h: 3.5rem; }
  .evk-detail .evk-zurueck > .btn, .evk-detail .evk-aktion .btn { min-height: 2.75rem; display: inline-flex; align-items: center; } /* Touch 44 px wie alle Knöpfe (Verdict-Pass 5 R5) */
  :is(.evk, .evk-detail) .evk-e-knoepfe.btn-group > .btn, :is(.evk, .evk-detail) .evk-knopf { flex: 1; min-height: 2.75rem; }
  .evk-weiter .evk-knopf { width: 100%; } /* Listenende mobil volle Breite */
}

@media (max-width: 560px) {
  /* Zeitleiste 3 + 2 im Sechserraster: alle fünf Knöpfe ganz sichtbar (320 px: 92 bzw. 142 px breit); fünf gleiche
     Spalten (55 px) trügen »Wochenende« (gemessen 76–90 px) nicht. Sperrung .06em = .gm-event-cal-m. */
  /* Zeitleiste randlos wie das Blatt, Knöpfe im 16-px-Rand des Inhalts (Runde 12, Nutzer 09.10.2026 »nicht bis an die Ränder«):
     der weiße Grund deckt die volle Breite – neben der klebenden Leiste scheint kein Inhalt mehr durch */
  .evk-zeit { margin-inline: calc(50% - 50vw); padding-inline: var(--gm-space-md); }
  .evk-zeit .gm-fp-daysel { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: var(--gm-space-2xs); }
  .evk-zeit .gm-fp-daybtn { grid-column: span 2; min-width: 0; padding: var(--gm-space-2xs) var(--gm-space-3xs); }
  .evk-zeit .gm-fp-daybtn:nth-child(n+4) { grid-column: span 3; }
  .evk-zeit .gm-fp-daybtn-wd { letter-spacing: .06em; }
  html:has(.evk) { scroll-padding-top: calc(var(--evk-oben) + var(--evk-kopf-h, 4.5rem) + var(--gm-space-sm)); }
  /* Heft mobil: Blatt randlos bis an den Bildschirmrand, Vorschau des Tages 4:5 unter dem Ziffernkopf */
  .evk-blatt { --evk-rand: var(--gm-space-md); margin-inline: calc(50% - 50vw); border-radius: 0; }
  .evk-e-bild { width: 7.5rem; }
  /* Tagkopf mobil eine Stufe kleiner: Blatt 4.5rem, Wochentag h4, Meta Fließtext */
  .evk-blatt { --evk-blatt: 4.5rem; } /* Kapitelzeile mobil 72 px: frisst als klebende Zeile wenig Höhe (Runde 9) */
  .evk-datum .gm-event-cal-d { font-size: 2.25rem; }
  .evk .evk-tagkopf { font-size: var(--gm-fs-h5); }
  .evk-kopf-meta { font-size: var(--gm-fs-klein); }
  .evk-e { gap: var(--gm-space-sm) var(--gm-space-md); }
  .evk-felder { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: auto auto auto auto; }
  .evk-feld--q { grid-column: 1 / -1; }
  .evk-panel { padding: var(--gm-space-md); }
  .evk .evk-kal ul, .evk-detail .evk-kal ul { position: static; min-width: 0; margin-top: var(--gm-space-3xs); box-shadow: none; } /* mobil im Fluss: nie über den Rand */
}
@media (prefers-reduced-motion: reduce) {
  .evk-auf-zu, .evk-dauer > summary i, .evk-auf-link i, :is(.evk, .evk-detail) .evk-e-zum i, .evk-detail .evk-zurueck > .btn i, :is(.evk, .evk-detail) .evk-knopf i { transition: none; }
}
