/*
 Theme Name:   Edelhoftheater (Divi Child)
 Theme URI:    https://geh-online.eu
 Description:  Child-Theme fuer die Seite des Edelhoftheater Kirrweiler e.V. Gestaltung: Richtung C, modern und warm.
 Author:       geh online
 Author URI:   https://geh-online.eu
 Template:     Divi
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 Text Domain:  edelhof-child
*/

/* ── Schriften: lokal gehostet (DSGVO), kein Google-CDN ──
   EB Garamond (Ueberschriften, verwandt mit der Wortmarke im Logo) und
   Source Sans 3 (Text und Bedienung). Beide SIL Open Font License 1.1. */

@font-face {
	font-family: 'EB Garamond';
	font-style: normal;
	font-weight: 400 700;
	font-display: swap;
	src: url('fonts/eb-garamond-latin-variable.woff2') format('woff2');
}
@font-face {
	font-family: 'EB Garamond';
	font-style: italic;
	font-weight: 400 700;
	font-display: swap;
	src: url('fonts/eb-garamond-italic-latin-variable.woff2') format('woff2');
}
@font-face {
	font-family: 'Source Sans 3';
	font-style: normal;
	font-weight: 400 700;
	font-display: swap;
	src: url('fonts/source-sans-3-latin-variable.woff2') format('woff2');
}

/* ── Tokens: Rot, Nacht und Licht ────────────────────────
   Logo-Rot exakt aus der Logodatei. Nacht fuer dunkle Baender (Licht aus,
   20 Uhr), Licht nur auf dunklem Grund (Belegung, Hinweise), Papierweiss
   als Grund. Dieselben Werte in werkzeuge/divi-grundlage.php. */
:root {
	--gh-akzent:        #820000;  /* Logo-Rot: Knoepfe, Links */
	--gh-akzent-dunkel: #a3160f;  /* Hover */
	--gh-titel:         #1b1714;
	--gh-text:          #1b1714;
	--gh-grund:         #faf6ef;  /* Papierweiss */
	--gh-auf-akzent:    #ffffff;
	--gh-grund-hell:    #f1ebe0;  /* Papier, abgesetzt */
	--gh-nacht:         #16131c;
	--gh-nacht-2:       #2a2533;
	--gh-licht:         #f2b630;  /* nur auf Nacht */
	--gh-grau:          #5e5650;
	--gh-linie:         #e2d9cb;
	--gh-schatten:      rgba(130, 0, 0, 0.14);
	--gh-radius:        14px;

	--gh-schrift-text:  'Source Sans 3', 'Segoe UI', system-ui, sans-serif;
	--gh-schrift-titel: 'EB Garamond', Georgia, 'Times New Roman', serif;
}

/* ── Grundregeln ────────────────────────────────────── */
body {
	color: var(--gh-text);
	background: var(--gh-grund);
}
body,
.entry-content,
#main-content {
	font-family: var(--gh-schrift-text);
}
h1, h2, h3, h4, h5, h6,
.entry-title,
.et_pb_post .entry-title {
	font-family: var(--gh-schrift-titel);
	color: var(--gh-titel);
	font-weight: 500;
	letter-spacing: -0.01em;
}
a { color: var(--gh-akzent); }
a:hover { color: var(--gh-akzent-dunkel); }
:focus-visible {
	outline: 3px solid var(--gh-akzent);
	outline-offset: 2px;
}

/* width/height im HTML verhindern das Springen. Ohne height:auto wird
   die Attributhoehe zur festen Hoehe und aspect-ratio wirkungslos. */
img,
video { height: auto; }
.entry-content img { max-width: 100%; }

.entry-content p { line-height: 1.7; }
.entry-content h2,
.entry-content h3 { margin: 1.4em 0 0.5em; }

/* Einzelbilder im Inhalt: begrenzt, damit beim Oeffnen noch Kontext
   sichtbar bleibt und nicht nur Foto */
.entry-content figure:not(.wp-block-gallery figure) {
	margin: 1.5em auto;
	max-width: 720px;
	text-align: center;
}
.entry-content figure:not(.wp-block-gallery figure) img {
	max-height: 62vh;
	width: auto;
	max-width: 100%;
	border-radius: var(--gh-radius);
}

/* Footer: Copyright links, Signatur rechts */
#footer-info {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 0.5em 2em;
	width: 100%;
}

/* Von divi5.mjs gesetzt: gekappte Module mittig */
.gh-mitte,
.gh-mitte .et_pb_text_inner p,
.gh-mitte .et_pb_text_inner ul,
.gh-mitte .et_pb_text_inner ol {
	margin-left: auto;
	margin-right: auto;
}

/* ── Tabellen ───────────────────────────────────────────
   inc/tabellen.php setzt data-label je Zelle und die ARIA-Rollen.
   Zweispalter (Merkmal/Wert) bekommen die Klasse gh-zweispalter und
   bleiben auch mobil Tabelle. */
.entry-content table {
	border-collapse: collapse;
	width: 100%;
	border: 0;
	margin: 1.5em 0 2em;
}
.entry-content th,
.entry-content td {
	padding: 8px 12px;
	border: 0;
	border-bottom: 1px solid var(--gh-linie);
	text-align: left;
	white-space: normal;
}
.entry-content thead th {
	background: var(--gh-akzent);
	color: var(--gh-auf-akzent);
	font-weight: 700;
}
.entry-content tbody tr:nth-child(even) td { background: var(--gh-grund-hell); }

table.gh-zweispalter {
	table-layout: fixed;
	max-width: 100%;
}
table.gh-zweispalter td {
	min-width: 0;
	overflow-wrap: anywhere;
}
table.gh-zweispalter td:first-child,
table.gh-zweispalter th[scope="row"] {
	font-weight: 700;
	color: var(--gh-titel);
	white-space: normal;
	width: 38%;
}

/* ── Media-Queries: immer hinter die Grundregeln ──────── */

/* Datentabellen mobil: jede Zeile ein Block, Spaltenname an der
   Zelle. Kein seitliches Wischen. */
@media (max-width: 767px) {
	.entry-content table:not(.gh-zweispalter),
	.entry-content table:not(.gh-zweispalter) tbody,
	.entry-content table:not(.gh-zweispalter) tr,
	.entry-content table:not(.gh-zweispalter) td,
	.entry-content table:not(.gh-zweispalter) th {
		display: block;
		width: 100%;
	}
	.entry-content table:not(.gh-zweispalter) thead,
	.entry-content table:not(.gh-zweispalter) tr.gh-kopfzeile { display: none; }
	.entry-content table:not(.gh-zweispalter) tr {
		margin-bottom: 14px;
		border: 1px solid var(--gh-linie);
		border-radius: 10px;
		padding: 10px 14px;
		background: var(--gh-grund);
	}
	.entry-content table:not(.gh-zweispalter) td {
		display: grid;
		grid-template-columns: minmax(6em, 40%) 1fr;
		gap: 0 12px;
		padding: 5px 0;
		border: 0;
		min-width: 0;
		background: transparent;
	}
	.entry-content table:not(.gh-zweispalter) td::before {
		content: attr(data-label);
		font-weight: 700;
		color: var(--gh-titel);
		white-space: normal;
	}
	.entry-content table:not(.gh-zweispalter) td:not([data-label]) { grid-template-columns: 1fr; }
	.entry-content table:not(.gh-zweispalter) td:not([data-label])::before { content: none; }
	.entry-content table:not(.gh-zweispalter) td:empty { display: none; }
}

@media (prefers-reduced-motion: reduce) {
	/* Weniger Bewegung heisst nicht keine: Ueberblendungen bleiben kurz,
	   alles, was sich bewegt oder waechst, springt sofort an sein Ziel. */
	*, *::before, *::after { animation: none !important; transition-property: opacity, color, background-color, border-color !important; transition-duration: .15s !important; }
}

/* ════════════════════════════════════════════════════════════
   Bausteine der Seiten (Rot, Nacht und Licht)
   Jede Klasse haengt an einem Divi-Modul (Erweitert > CSS-Klasse).
   Ohne diese Datei sind die Module trotzdem lesbar.
   ════════════════════════════════════════════════════════════ */

/* ── Kopf ── */
#main-header{ background:var(--gh-grund); box-shadow:none; border-bottom:1px solid var(--gh-linie); }
#top-menu li a{ font-family:var(--gh-schrift-text); font-weight:600; font-size:16px; color:var(--gh-text); }
#top-menu li.current-menu-item > a, #top-menu li a:hover{ color:var(--gh-akzent); opacity:1; }
#top-menu li.ehc-menue-karten > a{ background:var(--gh-akzent); color:#fff !important; border-radius:999px; padding:10px 22px !important; }
#top-menu li.ehc-menue-karten > a:hover{ background:var(--gh-akzent-dunkel); }
#top-menu li.ehc-menue-karten{ padding-right:0; }
#main-header .container{ width:90%; max-width:1180px; }
#logo{ max-height:76px; }
#main-header.et-fixed-header #logo{ max-height:46px !important; }
#logo{ transition:max-height .3s ease; }
#et_top_search, #et_search_icon, .et-cart-info{ display:none !important; }

/* ── Ueberschriften: Garamond kursiv, gross und eng ── */
.ehc-titel h1, .ehc-h2 h2, .ehc-h2 .et_pb_module_header{ font-family:var(--gh-schrift-titel) !important; font-style:italic; font-weight:500 !important; letter-spacing:-0.015em; }
.ehc-titel h1{ font-size:clamp(2.6rem,5vw,4.75rem) !important; line-height:.9 !important; }
.ehc-h2 h2, .ehc-h2 .et_pb_module_header{ font-size:clamp(2.3rem,5vw,4rem) !important; line-height:1 !important; }

/* ── Kennzeile ueber Titeln: klein, rot, gesperrt ── */
.ehc-marke p{ font-size:.8rem !important; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--gh-akzent) !important; margin:0 !important; }
.ehc-marke--hell p{ color:var(--gh-licht) !important; }

/* ── Knoepfe ──
   Divi 5 legt den Knopf als Flex-Element in einen Block-Wrapper, dadurch
   fuellt er die ganze Breite. :where() haelt das Gewicht auf null, damit
   die Ausrichtung im Builder weiterhin gewinnt. */
:where(.et_pb_button_module_wrapper) > :where(.et_pb_button){ display:inline-flex; width:auto; }
.et_pb_button{ min-height:52px; align-items:center; transition:background-color .15s ease, color .15s ease, box-shadow .15s ease, transform .12s ease-out; }
.et_pb_button:active, .ehc-abendliste__link:active, #place_order:active, .single_add_to_cart_button:active{ transform:scale(.97); }

/* ── Belegungsbalken: gefuellt ist verkauft ── */
.ehc-balken{ display:block; height:8px; border-radius:999px; background:var(--gh-linie); overflow:hidden; }
.ehc-balken i{ display:block; height:100%; width:100%; transform:scaleX(var(--voll-faktor,0)); transform-origin:left center; background:var(--gh-nacht); border-radius:999px; }
/* Belegung ohne Skript: inc/abende.php setzt data-stufe in 5er-Schritten */
.ehc-balken[data-stufe="0"]{ --voll-faktor:0; }
.ehc-balken[data-stufe="5"]{ --voll-faktor:0.05; }
.ehc-balken[data-stufe="10"]{ --voll-faktor:0.1; }
.ehc-balken[data-stufe="15"]{ --voll-faktor:0.15; }
.ehc-balken[data-stufe="20"]{ --voll-faktor:0.2; }
.ehc-balken[data-stufe="25"]{ --voll-faktor:0.25; }
.ehc-balken[data-stufe="30"]{ --voll-faktor:0.3; }
.ehc-balken[data-stufe="35"]{ --voll-faktor:0.35; }
.ehc-balken[data-stufe="40"]{ --voll-faktor:0.4; }
.ehc-balken[data-stufe="45"]{ --voll-faktor:0.45; }
.ehc-balken[data-stufe="50"]{ --voll-faktor:0.5; }
.ehc-balken[data-stufe="55"]{ --voll-faktor:0.55; }
.ehc-balken[data-stufe="60"]{ --voll-faktor:0.6; }
.ehc-balken[data-stufe="65"]{ --voll-faktor:0.65; }
.ehc-balken[data-stufe="70"]{ --voll-faktor:0.7; }
.ehc-balken[data-stufe="75"]{ --voll-faktor:0.75; }
.ehc-balken[data-stufe="80"]{ --voll-faktor:0.8; }
.ehc-balken[data-stufe="85"]{ --voll-faktor:0.85; }
.ehc-balken[data-stufe="90"]{ --voll-faktor:0.9; }
.ehc-balken[data-stufe="95"]{ --voll-faktor:0.95; }
.ehc-balken[data-stufe="100"]{ --voll-faktor:1; }
.ehc-balken--hell{ background:var(--gh-nacht-2); }
.ehc-balken--hell i{ background:var(--gh-licht); }

/* ── Held ── */
.ehc-held__bild img{ width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:var(--gh-radius); }
/* Held: helle, warme Buehne, das Plakat in einem zarten weinroten Schein */
.ehc-held--buehne{ position:relative; overflow:hidden; }
.ehc-held--buehne::before{ content:""; position:absolute; left:50%; top:-10%; width:70%; height:120%; pointer-events:none;
	background:radial-gradient(ellipse 45% 55% at 62% 42%, rgba(130,0,0,.10), rgba(130,0,0,.04) 45%, transparent 72%); }
.ehc-held__buehne{ position:relative; z-index:1; align-self:center; }
.ehc-held__plakat{ max-width:460px; margin:0 0 0 auto !important; }
.ehc-held__plakat img{ width:100%; height:auto; border-radius:6px; box-shadow:0 1px 2px rgba(130,0,0,.10), 0 34px 60px -26px rgba(130,0,0,.40); }
.ehc-lead.ehc-lead--hell p{ color:#ddd7e3 !important; }
/* Naechster Abend: weisse Karte wie eine Eintrittskarte */
.ehc-held .ehc-naechster{ background:#fff; color:var(--gh-text); box-shadow:0 1px 2px rgba(130,0,0,.06), 0 24px 50px -28px rgba(130,0,0,.32); }
.ehc-held .ehc-naechster .et_pb_text_inner, .ehc-held .ehc-naechster__kopf strong, .ehc-held .ehc-naechster__frei{ color:var(--gh-text); }
.ehc-held .ehc-naechster__kopf{ color:var(--gh-grau); }
.ehc-held .ehc-naechster__frei strong{ color:var(--gh-akzent); }
.ehc-held .ehc-balken--hell{ background:var(--gh-linie); }
.ehc-held .ehc-balken--hell i{ background:var(--gh-nacht); }
.ehc-knopf-pfeil.ehc-knopf-pfeil .et_pb_button{ min-height:44px; }
/* Der ganze Kasten fuehrt zum Abend (inc/abende.php) */
.ehc-naechster__link{ display:block; color:inherit !important; text-decoration:none; }
.ehc-naechster__weiter{ display:inline-flex; align-items:center; min-height:52px; margin-top:18px; padding:0 28px; border-radius:999px;
	background:var(--gh-akzent); color:#fff; font-weight:700; font-size:18px; transition:background-color .15s ease, transform .12s ease-out; }
.ehc-naechster__link:active .ehc-naechster__weiter{ transform:scale(.97); }
.ehc-naechster__link:focus-visible{ outline:3px solid var(--gh-akzent); outline-offset:4px; border-radius:var(--gh-radius); }
.ehc-lead p{ color:var(--gh-grau) !important; }
.ehc-naechster{ background:var(--gh-nacht); color:#fff; border-radius:var(--gh-radius); padding:22px 24px !important; max-width:460px; margin-bottom:18px !important; }
.ehc-naechster .et_pb_text_inner{ color:#fff; }
.ehc-naechster__kopf{ display:flex; justify-content:space-between; gap:12px; font-size:.9rem; color:#bdb6c6; margin-bottom:14px; }
.ehc-naechster__kopf strong{ color:#fff; }
.ehc-naechster__frei{ margin:14px 0 0 !important; padding-bottom:0 !important; color:#fff; }
.ehc-naechster__frei strong{ font-family:var(--gh-schrift-titel); font-style:italic; font-size:1.8rem; font-weight:500; color:var(--gh-licht); }

/* ── Alle Abende ── */
.ehc-abendliste{ list-style:none !important; margin:0 !important; padding:0 !important; display:grid; gap:10px; }
.ehc-abendliste li{ display:grid; grid-template-columns:170px 1fr 150px; gap:24px; align-items:center; background:var(--gh-grund-hell);
	border-radius:var(--gh-radius); padding:18px 22px !important; margin:0 !important; list-style:none !important; }
.ehc-abendliste__tag{ font-family:var(--gh-schrift-titel); font-style:italic; font-weight:500; font-size:1.5rem; }
.ehc-abendliste__frei{ font-weight:600; text-align:right; }
.ehc-abendliste li.ist-knapp .ehc-abendliste__frei{ color:var(--gh-akzent); }
.ehc-abendliste li.ist-aus{ background:transparent; box-shadow:inset 0 0 0 1px var(--gh-linie); }
.ehc-abendliste li.ist-aus span{ color:#6f675f; }
.ehc-abendliste li.ist-aus .ehc-balken i{ background:#c9c0b4; }
/* Mehr als 50 frei: keine Zahl, kein Balken (werkzeuge/divi/abende.mjs).
   Der Text nimmt den Platz des Balkens, sonst bricht er in der schmalen
   Spalte um. */
.ehc-balken-leer{ display:none; }
/* Jede Zeile fuehrt zum Kauf dieses Abends (inc/abende.php).
   Das Raster wandert vom Listenpunkt auf den Link. */
.ehc-abendliste li:has(> .ehc-abendliste__link){ display:block; padding:0 !important; }
.ehc-abendliste__link{ display:grid; grid-template-columns:170px 1fr 150px; gap:24px; align-items:center; padding:18px 22px;
	color:inherit !important; text-decoration:none; border-radius:var(--gh-radius); transition:background-color .15s ease; }
.ehc-abendliste__link:hover{ background:#e9e0d1; }
.ehc-abendliste__link:focus-visible{ outline:3px solid var(--gh-akzent); outline-offset:2px; }

.ehc-abendliste li.ist-viel .ehc-abendliste__frei{ grid-column:2 / -1; }

/* ── Weg zum Platz (Nacht) ── */
.ehc-weg .et_pb_text_inner{ color:#ddd7e3; }
.ehc-w3w{ display:flex; flex-direction:column; gap:4px; }
.ehc-w3w span{ font-size:.82rem; color:#a59eb0; }
.ehc-w3w strong{ font-family:var(--gh-schrift-titel); font-style:italic; font-weight:500; font-size:1.9rem; color:var(--gh-licht); }
.ehc-schritt h3{ color:#fff !important; font-family:var(--gh-schrift-titel) !important; font-style:italic; font-weight:500 !important; font-size:1.8rem !important; margin:28px 0 8px !important; padding:0 !important; }
.ehc-karte, .ehc-karte .et_pb_image_wrap{ overflow:hidden; border-radius:var(--gh-radius); }
.ehc-karte img{ transition:transform .7s cubic-bezier(.65,0,.35,1); transform-origin:0 0; transform:translate(0,0) scale(1); }

/* ── Chronik ── */
.ehc-plakat .et_pb_image_wrap, .ehc-chronik-karte .ehc-chronik-karte__plakat .et_pb_image_wrap{ display:flex !important; width:100%; aspect-ratio:560/792; align-items:flex-end; justify-content:center; }
/* Jedes Plakat in seinem eigenen Format, unten auf einer Linie wie auf
   einem Regal. Kein Rahmen, keine leeren Streifen bei Quer- und
   Quadratformaten (2025 ist quadratisch). */
.ehc-plakat img, .ehc-chronik-karte .ehc-chronik-karte__plakat img{ width:100%; height:auto; max-height:100%; object-fit:contain; object-position:50% 100%; border-radius:var(--gh-radius);
	filter:drop-shadow(0 12px 18px rgba(130,0,0,.20)); transition:transform .3s cubic-bezier(.23,1,.32,1), filter .3s ease; }
/* width:100% statt auto: Ein noch nicht geladenes Bild haette sonst 0 px
   und wuerde mit loading=lazy nie geladen. drop-shadow folgt dem Plakat,
   nicht dem Rahmen, auch wenn ein sehr hohes Plakat seitlich Luft hat. */
/* Hover: Schatten im Weinrot des Logos, das Plakat hebt sich leicht */
@media (hover:hover) and (pointer:fine){
	.ehc-plakat a:hover img, .ehc-plakat a:focus-visible img{ transform:translateY(-6px); filter:drop-shadow(0 18px 26px rgba(130,0,0,.38)); }
}
.ehc-plakat__text p strong{ font-family:var(--gh-schrift-titel); font-style:italic; font-weight:500; font-size:1.5rem; color:var(--gh-akzent); }
.ehc-plakat__text{ color:var(--gh-grau); }

/* ── Mitmachen ── */
.ehc-mitmachen img{ aspect-ratio:4/3; object-fit:cover; }

/* ── Fuss ── */
#main-footer, #footer-bottom{ background:var(--gh-nacht); }
#footer-info, #footer-info a, #main-footer .footer-widget, #main-footer a{ color:#c9c3d1; }

/* ── Papierweiss als Grund aller Abschnitte ──
   Divi setzt jede Section ohne eigene Farbe auf Weiss. Abschnitte mit
   eigener Farbe (Nacht, Papier abgesetzt) behalten ihre, weil Divi sie
   ueber die Abschnittsklasse spezifischer setzt. */
#page-container, #main-content, .et_pb_section{ background-color:var(--gh-grund); }

/* ── Terminliste (Das Stueck, [ehc_termine]) ── */
.ehc-terminliste{ list-style:none !important; margin:0 !important; padding:0 !important; }
.ehc-terminliste li{ margin:0 !important; padding:12px 0 !important; border-top:1px solid var(--gh-nacht-2); list-style:none !important; }
.ehc-terminliste li:last-child{ border-bottom:1px solid var(--gh-nacht-2); }
.ehc-terminliste strong{ font-family:var(--gh-schrift-titel); font-style:italic; font-weight:500; font-size:1.5rem; color:var(--gh-licht); }
.ehc-terminliste__aus{ margin-left:.5em; font-size:.85rem; letter-spacing:.08em; text-transform:uppercase; color:#bdb6c6; }

/* ── Unterseiten (Karten, Spielort, Stück, Presse, Fragen, Verein, Kontakt) ── */

/* ── Kleine Ueberschrift in Karten und Spalten (h3), Garamond kursiv wie ehc-h2 ── */
.ehc-h3 h3, .ehc-h3 .et_pb_module_header{ font-family:var(--gh-schrift-titel) !important; font-style:italic; font-weight:500 !important; letter-spacing:-0.01em; line-height:1.05 !important; margin:0 0 12px !important; padding:0 !important; }

/* ── Bilder in den Koepfen: gleiche Form wie auf der Startseite ── */
.ehc-karten-kopf__bild img, .ehc-spielort-kopf__bild img{ width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:var(--gh-radius); }
.ehc-karten-kopf__bild img{ object-position:50% 70%; }

/* ── Preise: zwei grosse Zahlen, nebeneinander ── */
.ehc-preise{ margin-top:32px; }
.ehc-preis{ background:var(--gh-grund-hell); border-radius:var(--gh-radius); padding:28px 32px !important; }
.ehc-preis p{ margin:0 !important; padding:0 !important; display:flex; align-items:baseline; gap:20px; flex-wrap:wrap; }
.ehc-preis strong{ font-family:var(--gh-schrift-titel); font-style:italic; font-weight:500; font-size:3rem; line-height:1; color:var(--gh-akzent); }
.ehc-preis span{ font-size:1.05rem; font-weight:600; }

/* ── Ablauf der Online-Bestellung: wirkliche Reihenfolge, deshalb Zaehler ── */
.ehc-karten-ablauf h3{ font-family:var(--gh-schrift-titel) !important; font-style:italic; font-weight:500 !important; font-size:1.8rem !important; margin:0 0 18px !important; padding:0 !important; }
.ehc-schritte{ list-style:none !important; counter-reset:schritt; margin:0 !important; padding:0 !important; display:grid; gap:12px; }
.ehc-schritte li{ counter-increment:schritt; display:block; position:relative; background:#fff; border-radius:var(--gh-radius); padding:18px 22px 18px 4rem !important; margin:0 !important; list-style:none !important; }
.ehc-schritte li::before{ content:counter(schritt); position:absolute; left:22px; top:14px; font-family:var(--gh-schrift-titel); font-style:italic; font-size:2rem; line-height:1; color:var(--gh-akzent); }

/* ── Auf einen Blick (Spielort): Angaben als Zeilen mit Linie ── */
.ehc-fakten{ margin:0 !important; padding:0 !important; display:grid; }
.ehc-fakten > div{ display:grid; grid-template-columns:9rem 1fr; gap:6px 24px; padding:16px 0; border-top:1px solid var(--gh-linie); }
.ehc-fakten > div:last-child{ border-bottom:1px solid var(--gh-linie); }
.ehc-fakten dt{ font-size:.82rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--gh-grau); padding-top:.3em; }
.ehc-fakten dd{ margin:0 !important; font-size:1.1rem; }

/* ── Anfahrt (Nacht): Links in Licht, Lageplan in Bildform ── */
.ehc-anfahrt .et_pb_text_inner a{ color:var(--gh-licht); text-decoration:underline; text-underline-offset:3px; }
.ehc-anfahrt .et_pb_text_inner a:hover{ text-decoration-thickness:2px; }
.ehc-lageplan img{ width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:var(--gh-radius); }

/* Platzhalter fuer Dinge, die der Verein noch liefert. Muss vor dem Livegang
   leer sein; die Umrandung faellt beim Durchsehen auf. */
.ehc-todo, .ehc-todo p, p.ehc-todo{ margin:0 0 8px !important; padding:8px 12px !important; border-radius:8px; background:#fff4d6; color:#5a4300 !important; box-shadow:inset 0 0 0 1px #e0b84d; font-size:.95rem !important; line-height:1.5 !important; }
.ehc-todo p{ margin:0 !important; padding:0 !important; box-shadow:none; background:none; }

/* Bild im Seitenverhaeltnis 4:3, ohne Personenkoepfe zu beschneiden
   (nur Luftbilder und Tribuene): oben ausrichten, gekuerzt wird unten. */
.ehc-bild-4-3 img{ width:100%; aspect-ratio:4/3; object-fit:cover; object-position:50% 0%; border-radius:var(--gh-radius); }

/* Text auf Nacht (Das Stueck, Presse, Fragen) */
.ehc-nacht h3{ color:#fff !important; font-family:var(--gh-schrift-titel) !important; font-style:italic; font-weight:500 !important; font-size:1.8rem !important; margin:0 0 8px !important; padding:0 !important; }
.ehc-nacht-abschnitt .ehc-nacht + .ehc-nacht h3{ margin-top:20px !important; }
.ehc-nacht a{ color:var(--gh-licht); text-decoration:underline; text-underline-offset:3px; }
.ehc-nacht a:hover{ color:#fff; }

/* Terminliste Das Stueck */
.ehc-termine ul{ list-style:none !important; margin:0 !important; padding:0 !important; display:grid; gap:0; }
.ehc-termine li{ margin:0 !important; padding:12px 0 !important; border-top:1px solid var(--gh-nacht-2); list-style:none !important; }
.ehc-termine li:last-child{ border-bottom:1px solid var(--gh-nacht-2); }
.ehc-termine strong{ font-family:var(--gh-schrift-titel); font-style:italic; font-weight:500; font-size:1.5rem; color:var(--gh-licht); }

/* Presse: ein Eintrag je Zeile, Trennlinie oben */
.ehc-presse-eintrag{ border-top:1px solid var(--gh-linie); padding-top:36px !important; margin-top:36px !important; }
.ehc-presse-eintrag:first-of-type{ margin-top:12px !important; }
.ehc-zitat p{ font-family:var(--gh-schrift-titel); font-style:italic; font-size:1.55rem !important; line-height:1.35 !important; color:var(--gh-titel); }

/* Haeufige Fragen: h3 als Frage, Abstand zwischen den Paaren */
.ehc-frage{ margin-bottom:28px !important; }
.ehc-frage h3{ font-size:1.5rem !important; line-height:1.25 !important; margin:0 0 8px !important; padding:0 !important; }
.ehc-frage p{ margin:0 0 8px !important; }

/* Kachel: ruhige Flaeche auf Papier, ohne Rahmen und Schatten */
.ehc-kachel{ height:100%; }
.ehc-kachel .et_pb_text_inner{ overflow-wrap:break-word; }

/* Links in Kachel-Texten und Listen: Logo-Rot, unterstrichen */
.ehc-kontakt a,
.ehc-liste a{ color:var(--gh-akzent); text-decoration:underline; text-underline-offset:.15em; }
.ehc-kontakt a:hover,
.ehc-liste a:hover{ color:var(--gh-akzent-dunkel); }

/* Aufzaehlung im Text-Modul */
.ehc-liste{ margin:0 0 1em; padding-left:1.2em; }
.ehc-liste li{ margin:0 0 .5em; }

/* Unterstuetzer-Logos: klein und in ihren eigenen Farben */
.ehc-sponsor img{ display:block; width:100%; height:auto !important; }

@media (max-width: 980px){
	.ehc-fakten > div{ grid-template-columns:1fr; }
	.ehc-preis strong{ font-size:2.4rem; }
	.ehc-presse-eintrag{ padding-top:28px !important; margin-top:28px !important; }
	.ehc-zitat p{ font-size:1.35rem !important; }
}

/* ── Rechtsseiten (Impressum, Datenschutz, Ticketbedingungen) ── */
/* Kopf: Titel kleiner als auf der Startseite. „Ticketbedingungen“ ist
   17 Zeichen lang und liefe mit der Startseitengroesse
   clamp(3.4rem, 8vw, 7.2rem) bei 390 px ueber den Rand
   (54 px x ca. 6,8 em = 370 px bei 351 px Platz). */
.ehc-recht-kopf .ehc-titel h1{ font-size:clamp(2.5rem, 7.5vw, 6rem) !important; line-height:.95 !important; }

/* Zwischenueberschriften der Rechtstexte: ehc-h2 waere bis 4rem gross,
   bei 15 Abschnitten zu laut. */
.ehc-recht .ehc-h2 h2{ font-size:clamp(1.7rem, 2.6vw, 2.2rem) !important; line-height:1.1 !important; }

/* Anker: Abstand fuer die feste Kopfzeile von Divi */
.ehc-recht [id]{ scroll-margin-top:120px; }

/* Lesespalte */
.ehc-recht .et_pb_text_inner h3{ font-size:1.25rem; font-weight:600; margin:1.4em 0 .4em; padding:0; }
.ehc-recht .et_pb_text_inner ol,
.ehc-recht .et_pb_text_inner ul{ padding-left:1.4em; margin:0 0 1em; }
.ehc-recht .et_pb_text_inner li{ margin:0 0 .5em; padding-left:.2em; }
.ehc-recht .et_pb_text_inner ol li::marker{ font-weight:700; color:var(--gh-grau); }

/* Verzeichnis in der Randspalte */
.ehc-recht__inhalt-titel{ margin:0 0 .6em !important; color:var(--gh-titel); }
.ehc-recht__inhalt ul{ list-style:none !important; padding:0 !important; margin:0 !important; border-top:1px solid var(--gh-linie); }
.ehc-recht__inhalt li{ margin:0 !important; padding:0 !important; border-bottom:1px solid var(--gh-linie); }
.ehc-recht__inhalt a{ display:block; padding:9px 0; color:var(--gh-text); text-decoration:none; }
.ehc-recht__inhalt a:hover{ color:var(--gh-akzent); text-decoration:underline; }

/* ── Media-Queries: hinter den Grundregeln ──────────────── */

/* Desktop: Randspalte schmal, Lesespalte breit, Verzeichnis laeuft mit */
@media (min-width: 981px){
	.ehc-recht .ehc-recht__rand{ flex:0 0 26% !important; width:26% !important; max-width:26% !important; }
	.ehc-recht .ehc-recht__haupt{ flex:1 1 0 !important; width:auto !important; max-width:none !important; min-width:0; }
	.ehc-recht-kopf .ehc-recht__rand{ padding-top:1.1rem; }
	.ehc-recht__rand .ehc-recht__inhalt{ position:sticky; top:120px; }
}

/* Tablet und Handy: Spalten untereinander, Verzeichnis vor dem Text */
@media (max-width: 980px){
	.ehc-recht .ehc-recht__rand,
	.ehc-recht .ehc-recht__haupt{ flex:0 0 100% !important; width:100% !important; max-width:100% !important; }
	.ehc-recht__inhalt{ background:var(--gh-grund-hell); border-radius:var(--gh-radius); padding:16px 20px !important; }
	.ehc-recht__inhalt ul{ border-top:0; }
	.ehc-recht__inhalt li:last-child{ border-bottom:0; }
}

/* ── Chronik: Plakatwand und Einzelseite (Theme Builder, werkzeuge/divi/chronik-vorlagen.mjs) ── */
/* Kopf: Einleitung unten an der Titelzeile ausrichten */
.ehc-chronik-kopf .ehc-chronik-kopf__lead{ align-self:flex-end; }

/* ── Karte: Plakat, Jahr, Titel, Vorlage ── */
.ehc-chronik-karte{ position:relative; }
.ehc-chronik-karte .et_pb_module{ margin-bottom:0 !important; }

/* Plakate stehen unbeschnitten in einem einheitlichen Rahmen 560:792.
   Quer- und Quadratformate (Piraten, Ich + Du) bekommen dunklen Rand statt
   abgeschnittener Kanten. */
.ehc-chronik-karte .ehc-chronik-karte__plakat{ margin-bottom:16px !important; }
.ehc-chronik-karte .ehc-chronik-karte__plakat img{
	display:block;
	transition:transform .25s ease, box-shadow .25s ease;
}
@media (hover:hover) and (pointer:fine){ .ehc-chronik-karte:hover .ehc-chronik-karte__plakat img{ transform:translateY(-6px); filter:drop-shadow(0 18px 26px rgba(130,0,0,.38)); } }

/* Jahr: gross, kursiv, Logo-Rot */
.ehc-chronik-karte__jahr p{ margin:0 !important; padding:0 !important; font-family:var(--gh-schrift-titel); font-style:italic; font-weight:500; font-size:1.9rem; line-height:1; color:var(--gh-akzent); }

/* Kein Plakat erhalten: das Jahr wird selbst zur Tafel im Plakatformat,
   Nacht mit Licht. Titel und Vorlage stehen darunter wie bei allen Karten. */
.ehc-chronik-karte:not(:has(.ehc-chronik-karte__plakat)) .ehc-chronik-karte__jahr{
	display:flex; flex-direction:column; justify-content:flex-end; align-items:flex-start; aspect-ratio:560/792;
	padding:20px 22px !important; background:var(--gh-grund-hell); border-radius:var(--gh-radius);
	box-shadow:inset 0 0 0 1px var(--gh-linie), 0 14px 30px -14px rgba(130,0,0,.30);
	transition:transform .25s ease;
}
.ehc-chronik-karte:not(:has(.ehc-chronik-karte__plakat)) .ehc-chronik-karte__jahr p{ font-size:clamp(2.6rem, 4.6vw, 4.2rem); color:var(--gh-akzent); }
.ehc-chronik-karte:not(:has(.ehc-chronik-karte__plakat)):hover .ehc-chronik-karte__jahr{ transform:translateY(-4px); }
/* Titel auf derselben Hoehe wie bei Karten mit Plakat (dort steht das Jahr dazwischen) */
.ehc-chronik-karte:not(:has(.ehc-chronik-karte__plakat)) .et_pb_button_module_wrapper{ margin-top:calc(16px + 1.9rem + 6px) !important; }

/* Titel: ein Knopf-Modul ohne Knopf. Der Link spannt sich ueber die ganze
   Karte, so gibt es einen Link und einen Tabstopp je Produktion. */
.ehc-chronik-karte .et_pb_button_module_wrapper{ position:static !important; margin:6px 0 4px !important; }
.ehc-chronik-karte .ehc-chronik-karte__titel{
	position:static !important; display:inline !important; padding:0 !important; border:0 !important; border-radius:0 !important;
	background:transparent !important; box-shadow:none !important;
	font-family:var(--gh-schrift-titel) !important; font-weight:500 !important; font-size:1.35rem !important; line-height:1.15 !important;
	color:var(--gh-text) !important; text-decoration:none;
}
.ehc-chronik-karte .ehc-chronik-karte__titel::after{
	content:"" !important; display:block !important; position:absolute !important; inset:0; z-index:1;
	margin:0 !important; opacity:1 !important; font-size:0 !important; border-radius:var(--gh-radius);
}
.ehc-chronik-karte .ehc-chronik-karte__titel:hover,
.ehc-chronik-karte:hover .ehc-chronik-karte__titel{ background:transparent !important; padding:0 !important; color:var(--gh-akzent) !important; text-decoration:underline; text-underline-offset:.15em; }
.ehc-chronik-karte .ehc-chronik-karte__titel:focus-visible{ outline:0; }
.ehc-chronik-karte .ehc-chronik-karte__titel:focus-visible::after{ outline:3px solid var(--gh-akzent); outline-offset:6px; }

/* Vorlage und Besonderes: klein, ruhig */
.ehc-chronik-karte__zeile p,
.ehc-chronik-karte__besonders p{ margin:0 !important; padding:0 !important; font-size:.95rem; line-height:1.4; color:var(--gh-grau); }
.ehc-chronik-karte__besonders p{ margin-top:4px !important; font-style:italic; }

/* ── Einzelseite ── */
.ehc-produktion__plakat .et_pb_image_wrap{ display:block; }
.ehc-produktion .ehc-produktion__plakat img{
	display:block; width:auto; max-width:100%; max-height:calc(100vh - 150px); margin:0 auto;
	aspect-ratio:auto; object-fit:contain; border-radius:var(--gh-radius);
	box-shadow:0 1px 2px rgba(130,0,0,.08), 0 22px 44px -18px rgba(130,0,0,.42);
}

/* Ohne Plakat: Tafel mit dem Jahr an seiner Stelle */
.ehc-produktion__ersatz{ display:none !important; }
.ehc-produktion__bild:not(:has(.ehc-produktion__plakat)) .ehc-produktion__ersatz{
	display:flex !important; flex-direction:column; justify-content:flex-end; align-items:flex-start; aspect-ratio:560/792; max-height:calc(100vh - 150px);
	padding:32px 34px !important; background:var(--gh-grund-hell); border-radius:var(--gh-radius);
	box-shadow:inset 0 0 0 1px var(--gh-linie);
}
.ehc-produktion__ersatz p{ margin:0 !important; padding:0 !important; font-family:var(--gh-schrift-titel); font-style:italic; font-weight:500; font-size:clamp(4rem, 9vw, 8rem); line-height:.9; color:var(--gh-akzent); }

.ehc-produktion__jahr p{ margin:0 !important; padding:0 !important; font-family:var(--gh-schrift-titel); font-style:italic; font-weight:500; font-size:clamp(2rem, 3.4vw, 2.8rem); line-height:1; color:var(--gh-akzent); }

/* Titel kleiner als auf der Startseite: es gibt lange wie
   „Im Märchenhaft oder der Aufstand der Stiefmütter“. */
.ehc-produktion__titel.ehc-titel h1{ font-size:clamp(2.6rem, 5vw, 4.6rem) !important; line-height:.95 !important; overflow-wrap:break-word; }

/* Abgesagt, Hoerfassung, geplant */
.ehc-produktion__status p{ display:inline-block; margin:0 !important; padding:5px 14px !important; border-radius:999px; background:var(--gh-nacht); color:var(--gh-licht); font-size:.8rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; }

/* Angaben: Zeilen mit Linie, wie .ehc-fakten auf der Spielort-Seite */
.ehc-produktion .ehc-angabe{ margin:0 !important; padding:14px 0 !important; border-bottom:1px solid var(--gh-linie); }
.ehc-produktion :not(.ehc-angabe) + .ehc-angabe{ border-top:1px solid var(--gh-linie); }
.ehc-angabe p{ display:grid; grid-template-columns:7.5rem 1fr; gap:4px 20px; margin:0 !important; padding:0 !important; font-size:1.05rem; line-height:1.5; }
.ehc-angabe__name{ font-size:.78rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--gh-grau); padding-top:.3em; }

.ehc-produktion__inhalt{ margin:28px 0 32px !important; }
.ehc-produktion__inhalt p{ font-size:1.1rem; line-height:1.7; }
.ehc-produktion__inhalt p:last-child{ padding-bottom:0; }
.ehc-produktion__knoepfe .et_pb_module{ margin-bottom:0 !important; }

/* Weitere Jahre */
.ehc-weitere .ehc-chronik-raster{ margin-top:40px; }
.ehc-weitere .ehc-knopf-pfeil{ margin-top:40px !important; }

/* ── Media-Queries: hinter den Grundregeln ── */

/* Desktop: Plakat laeuft beim Lesen mit */
@media (min-width: 981px){
	.ehc-produktion .ehc-produktion__bild{ position:sticky; top:110px; align-self:flex-start; }
}

@media (max-width: 980px){
	.ehc-produktion__ersatz p{ font-size:clamp(3.4rem, 18vw, 6rem); }
	.ehc-produktion .ehc-produktion__plakat img{ max-height:70vh; }
	.ehc-produktion__bild:not(:has(.ehc-produktion__plakat)) .ehc-produktion__ersatz{ aspect-ratio:auto; min-height:220px; max-height:none; }
}

@media (max-width: 600px){
	.ehc-chronik-karte__jahr p{ font-size:1.55rem; }
	.ehc-chronik-karte:not(:has(.ehc-chronik-karte__plakat)) .ehc-chronik-karte__jahr{ padding:14px 14px !important; }
	.ehc-chronik-karte:not(:has(.ehc-chronik-karte__plakat)) .ehc-chronik-karte__jahr p{ font-size:2.2rem; }
	.ehc-chronik-karte:not(:has(.ehc-chronik-karte__plakat)) .et_pb_button_module_wrapper{ margin-top:calc(16px + 1.55rem + 6px) !important; }
	/* „Wirtschaftskriminalität“ muss bei 320 px in die halbe Breite passen */
	.ehc-chronik-karte .ehc-chronik-karte__titel{ font-size:max(1rem, min(1.12rem, 4.1vw)) !important; }
	.ehc-chronik-karte__zeile p,
	.ehc-chronik-karte__besonders p{ font-size:.86rem; }
	.ehc-produktion__titel.ehc-titel h1{ font-size:clamp(1.9rem, 8.4vw, 3rem) !important; }
	.ehc-angabe p{ grid-template-columns:1fr; gap:2px; }
}

/* Fokus auf dunklem Grund: Licht statt Rot (Rot auf Nacht hat nur 1,7:1) */
.ehc-weg :focus-visible, .ehc-nacht-abschnitt :focus-visible, #main-footer :focus-visible, #footer-bottom :focus-visible{ outline-color:var(--gh-licht) !important; }

/* Das Stueck: die drei Versprechen unter dem Inhalt */
.et_pb_row.ehc-versprechen{ margin-top:56px !important; }

/* ── Reiter "Vorschau Kartenkauf" (inc/vorschau-reiter.php, nur Vorfuehrung) ── */
.ehc-vorschau-reiter{ position:fixed; right:0; top:50%; transform:translateY(-50%); z-index:9000; font-family:var(--gh-schrift-text); }
.ehc-vorschau-reiter summary{ list-style:none; cursor:pointer; writing-mode:vertical-rl; transform:rotate(180deg); display:flex; align-items:center; gap:6px;
	padding:16px 10px; border-radius:0 12px 12px 0; background:var(--gh-nacht); color:#fff; font-weight:700; font-size:15px; box-shadow:0 10px 24px -12px rgba(130,0,0,.5); }
.ehc-vorschau-reiter summary::-webkit-details-marker{ display:none; }
.ehc-vorschau-reiter summary small{ font-weight:400; font-size:12px; color:#ddd7e3; }
.ehc-vorschau-reiter summary:focus-visible{ outline:3px solid var(--gh-akzent); outline-offset:2px; }
.ehc-vorschau-reiter[open] summary{ background:var(--gh-akzent); }
.ehc-vorschau-reiter__inhalt{ position:absolute; right:100%; top:50%; transform:translateY(-50%); width:250px; margin-right:8px; padding:18px; border-radius:var(--gh-radius);
	background:#fff; box-shadow:0 1px 2px rgba(130,0,0,.08), 0 24px 48px -20px rgba(130,0,0,.35); }
.ehc-vorschau-reiter__inhalt p{ margin:0 0 12px !important; padding:0 !important; font-size:15px; color:var(--gh-grau); line-height:1.4; }
.ehc-vorschau-reiter__inhalt a{ display:flex; align-items:center; min-height:48px; padding:0 16px; margin-top:8px; border-radius:999px; background:var(--gh-grund-hell);
	color:var(--gh-text); font-weight:700; text-decoration:none; }
.ehc-vorschau-reiter__inhalt a:hover, .ehc-vorschau-reiter__inhalt a:focus-visible{ background:var(--gh-akzent); color:#fff; }
@media (max-width: 767px){
	/* Handy: kleine Pille unten rechts statt Reiter am Rand, verdeckt keinen Text */
	.ehc-vorschau-reiter{ top:auto; bottom:12px; right:12px; transform:none; }
	.ehc-vorschau-reiter summary{ writing-mode:horizontal-tb; transform:none; padding:10px 16px; border-radius:999px; font-size:14px; min-height:44px; }
	.ehc-vorschau-reiter summary small{ display:none; }
	.ehc-vorschau-reiter__inhalt{ top:auto; bottom:calc(100% + 8px); right:0; margin-right:0; transform:none; width:min(260px, calc(100vw - 24px)); }
}

/* ── Sprunglink (functions.php) ── */
.gh-sprunglink{ position:absolute; left:16px; top:-100px; z-index:100000; background:var(--gh-nacht); color:#fff; padding:12px 18px; border-radius:999px; font-weight:700; text-decoration:none; }
.gh-sprunglink:focus{ top:16px; outline:3px solid var(--gh-licht); outline-offset:2px; }

/* ── Bewegung (js/balken.js, js/bewegung.js) ──
   Greift nur, wenn das Skript die Klassen setzt. Ohne Skript und bei
   "weniger Bewegung" steht alles still und vollstaendig da. */
.ehc-balken.ist-wachsend i{ transition:transform .6s cubic-bezier(.23,1,.32,1); }
.ehc-fuehren-an .ehc-weg__karte{ position:sticky; top:110px; align-self:flex-start; }
.ehc-fuehren-an .ehc-schritt{ opacity:.7; transition:opacity .4s ease; }
.ehc-fuehren-an .ehc-schritt.ist-aktiv{ opacity:1; }
/* Garten: Buchsgarten mit Heckenmuster (Mitte 45 % / 27 %), Zoom 2,2 */
.ehc-karte[data-ort="garten"] img{ transform:translate(-49%,-9.4%) scale(2.2); }
/* Buehne: die beiden Holzpodeste (Mitte 56 % / 68 %), Zoom 2,4 */
.ehc-karte[data-ort="buehne"] img{ transform:translate(-84.4%,-113.2%) scale(2.4); }
.ehc-karte[data-ort="tribuene"] img{ transform:translate(-84.4%,-113.2%) scale(2.4); }
/* Tribuene: zweites Foto liegt deckungsgleich ueber der Karte und zoomt
   auf die Sitzreihen. Ohne Skript steht es als eigenes Bild darunter. */
/* (sticky aus dem Block oben ist zugleich Bezugsrahmen fuer das Tribuenenfoto) */
.ehc-fuehren-an .ehc-karte-tribuene{ position:absolute !important; inset:0; margin:0 !important; opacity:0; transition:opacity .5s ease; pointer-events:none; }
.ehc-fuehren-an .ehc-karte-tribuene, .ehc-fuehren-an .ehc-karte-tribuene .et_pb_image_wrap{ width:100%; height:100%; overflow:hidden; border-radius:var(--gh-radius); }
.ehc-fuehren-an .ehc-karte-tribuene img{ width:100%; height:100%; object-fit:cover; transform-origin:0 0; transform:translate(-51.9%,-73.9%) scale(2); transition:transform .9s cubic-bezier(.23,1,.32,1); }
.ehc-weg__karte[data-ort="tribuene"] .ehc-karte-tribuene{ opacity:1; }
.ehc-weg__karte[data-ort="tribuene"] .ehc-karte-tribuene img{ transform:translate(-62.3%,-88.7%) scale(2.2); }

@media (max-width: 980px){
	.ehc-held__bild img{ aspect-ratio:4/3; }
	.ehc-held__plakat{ max-width:340px; }
	.ehc-fuehren-an .ehc-weg__karte{ order:-1; position:sticky !important; top:0; z-index:3; background:var(--gh-nacht); padding:8px 0 12px; }
	.ehc-fuehren-an .ehc-weg__karte .ehc-karte img{ max-height:38vh; object-fit:cover; }
	.ehc-fuehren-an .ehc-weg__karte .ehc-karte-tribuene{ inset:8px 0 12px; height:auto; }
	.ehc-held--buehne::before{ left:0; width:100%; top:30%; }
	.ehc-abendliste li{ grid-template-columns:1fr auto; gap:10px 16px; padding:16px 18px !important; }
	.ehc-abendliste .ehc-balken{ grid-column:1 / -1; grid-row:2; }
	.ehc-abendliste li.ist-viel .ehc-abendliste__frei{ grid-column:auto; }
	.ehc-abendliste__link{ grid-template-columns:1fr auto; gap:10px 16px; padding:16px 18px; }
	.ehc-naechster{ max-width:none; }
}

/* Tablet: Zeilen mit Seitentitel (h1) einspaltig. In einer halben
   Spalte bricht der grosse Titel sonst nach einem Wort um. */
@media (max-width: 980px){
	.et_pb_row:has(.ehc-titel) > .et_pb_column{ flex:0 0 100% !important; width:100% !important; max-width:100% !important; }
	.et_pb_row:has(.ehc-titel) > .et_pb_column + .et_pb_column{ margin-top:32px; }
}

/* Schmale Handys: lange Woerter wie "Edelhoftheater" oder
   "Ticketbedingungen" passen sonst bei 320 px nicht in die Zeile. */
@media (max-width: 600px){
	.ehc-titel h1, .ehc-recht-kopf .ehc-titel h1{ font-size:clamp(2.3rem, 12vw, 3.4rem) !important; }
}


/* ── Pruefrunde 3 (03.10.2026) ── */
/* Geschrumpfter Kopf: Linie statt grauem Divi-Schatten */
#main-header.et-fixed-header{ box-shadow:0 1px 0 var(--gh-linie) !important; }
/* Unsichtbare Divi-Suche ist kein Tabstopp */
.et_search_outer, .et_search_form_container{ display:none !important; }
@media (max-width: 980px){
	/* Logo und Menue auf der Inhaltskante wie die Divi-Zeilen (90 %) */
	#main-header .container{ width:90% !important; max-width:none; padding-left:0 !important; padding-right:0 !important; }
}
@media (max-width: 980px){
	/* Keine einzelne Karte allein in der letzten Reihe (39 Produktionen in
	   zwei Spalten): Die letzte Karte bei ungerader Zahl liegt quer ueber
	   beide Spalten, Plakat links, Angaben rechts. Gilt fuer jede Anzahl. */
	.ehc-chronik-raster > .ehc-chronik-karte:last-child:nth-child(odd){
		flex:0 0 100% !important; width:100% !important; max-width:100% !important;
		display:grid !important; grid-template-columns:minmax(0,1fr) minmax(0,1fr); column-gap:24px; align-content:start;
	}
	.ehc-chronik-raster > .ehc-chronik-karte:last-child:nth-child(odd) > :first-child{ grid-column:1; grid-row:1 / span 6; margin-bottom:0 !important; }
	.ehc-chronik-raster > .ehc-chronik-karte:last-child:nth-child(odd) > :not(:first-child){ grid-column:2; }
	.ehc-chronik-raster > .ehc-chronik-karte:last-child:nth-child(odd) .et_pb_button_module_wrapper{ margin-top:0 !important; }
}

/* Spielzeit-Tafel: steht an Stelle des Plakats, bis das Plakat der
   Spielzeit da ist (Startseite, Karten). Plakatformat, Logo-Rot. */
.ehc-spielzeit-tafel{ display:flex; flex-direction:column; justify-content:flex-end; gap:10px; aspect-ratio:560/792; width:100%;
	padding:clamp(24px,3.4vw,40px); border-radius:6px; background:var(--gh-akzent); color:#fff;
	background-image:radial-gradient(ellipse 80% 55% at 50% 0%, rgba(255,255,255,.14), transparent 70%);
	box-shadow:0 1px 2px rgba(130,0,0,.10), 0 34px 60px -26px rgba(130,0,0,.45); }
.ehc-spielzeit-tafel__jahr{ font-family:var(--gh-schrift-titel); font-style:italic; font-weight:500; font-size:clamp(4rem,9vw,7.5rem); line-height:.85; letter-spacing:-.02em; }
.ehc-spielzeit-tafel__titel{ font-family:var(--gh-schrift-titel); font-style:italic; font-weight:500; font-size:clamp(1.8rem,3.2vw,2.6rem); line-height:1; }
.ehc-spielzeit-tafel__zeile{ font-size:1rem; font-weight:600; letter-spacing:.04em; color:rgba(255,255,255,.88); padding-top:14px; border-top:1px solid rgba(255,255,255,.35); }
.ehc-held__plakat .et_pb_text_inner, .ehc-karten-plakat .et_pb_text_inner{ width:100%; }

/* Termine und Angaben auf hellem Grund (frueher Nacht, Pruefrunde 3) */
.ehc-hell-abschnitt .ehc-termine strong, .ehc-hell-abschnitt .ehc-terminliste strong{ color:var(--gh-akzent); }
.ehc-hell-abschnitt .ehc-termine li, .ehc-hell-abschnitt .ehc-terminliste li{ border-color:var(--gh-linie); }
.ehc-hell-abschnitt .ehc-terminliste__aus{ color:var(--gh-grau); }
.ehc-hell-abschnitt .ehc-h3 h3{ font-size:1.8rem !important; margin:0 0 8px !important; }
.ehc-hell-abschnitt .ehc-h3 + .ehc-h3 h3{ margin-top:20px !important; }

@media (max-width: 767px){
	.ehc-spielzeit-tafel{ aspect-ratio:auto; min-height:0; padding:24px 22px; }
	.ehc-spielzeit-tafel__jahr{ font-size:3.6rem; }
	.ehc-held__plakat:has(.ehc-spielzeit-tafel){ max-width:none !important; }
}
@media (max-width: 480px){
	/* Chronik als Liste: Plakat links, Angaben rechts. Keine 2+1, Titel mit 16 px passen. */
	.ehc-chronik-raster > .ehc-chronik-karte{
		flex:0 0 100% !important; width:100% !important; max-width:100% !important;
		display:grid !important; grid-template-columns:34% minmax(0,1fr); column-gap:16px; align-content:start;
	}
	.ehc-chronik-raster > .ehc-chronik-karte > :first-child{ grid-column:1; grid-row:1 / span 6; margin-bottom:0 !important; }
	.ehc-chronik-raster > .ehc-chronik-karte > :not(:first-child){ grid-column:2; }
	.ehc-chronik-raster > .ehc-chronik-karte .et_pb_button_module_wrapper{ margin-top:0 !important; }
	.ehc-chronik-karte:not(:has(.ehc-chronik-karte__plakat)) .ehc-chronik-karte__jahr p{ font-size:1.6rem; }
}
/* Kontakt: Spielort hell (sonst Nacht direkt ueber der Nacht-Fusszeile) */
.ehc-hell-abschnitt .ehc-w3w span{ color:var(--gh-grau); }
.ehc-hell-abschnitt .ehc-w3w strong{ color:var(--gh-akzent); }

/* ── Pruefrunde 5 ── */
/* Plakate in einem sichtbaren, gleich grossen Rahmen: alle Oberkanten auf einer Linie,
   quadratische Plakate (2025) und Logos (Ich + Du) sitzen unten im Rahmen. */
.ehc-plakat .et_pb_image_wrap{ background:#fff; border-radius:var(--gh-radius); padding:clamp(6px,1.1vw,14px); box-shadow:inset 0 0 0 1px var(--gh-linie); }
.ehc-plakat img{ border-radius:6px; }
/* Drei Plakate bleiben drei nebeneinander (Das Stueck), auch auf Tablet und Handy */
.ehc-plakatreihe--3{ flex-wrap:nowrap !important; }
.ehc-plakatreihe--3 > .et_pb_column{ flex:1 1 0 !important; width:auto !important; max-width:none !important; min-width:0; }
@media (max-width: 600px){ .ehc-plakatreihe--3{ column-gap:12px !important; gap:12px !important; } .ehc-plakatreihe--3 .ehc-plakat__text p strong{ font-size:1.2rem; } }
/* Zwei Knoepfe nebeneinander (Mitmachen-Kopf) */
.ehc-spalte-knoepfe{ flex-direction:row !important; flex-wrap:wrap !important; align-items:center; column-gap:16px; }
.ehc-spalte-knoepfe > :not(.et_pb_button_module_wrapper){ flex:0 0 100%; width:100%; }
.ehc-spalte-knoepfe > .et_pb_button_module_wrapper{ flex:0 0 auto; width:auto; margin-bottom:12px !important; }
/* Anfahrt: Lageplan laeuft neben dem langen Weg mit */
@media (min-width: 981px){ .ehc-anfahrt__bild{ position:sticky; top:110px; align-self:flex-start; } }
/* Chronik-Einzelseite ohne Plakat: rote Tafel wie die Spielzeit-Tafel */
.ehc-produktion__bild:not(:has(.ehc-produktion__plakat)) .ehc-produktion__ersatz{
	background:var(--gh-akzent) !important; box-shadow:0 1px 2px rgba(130,0,0,.10), 0 34px 60px -26px rgba(130,0,0,.45) !important;
	background-image:radial-gradient(ellipse 80% 55% at 50% 0%, rgba(255,255,255,.14), transparent 70%) !important; }
.ehc-produktion__ersatz p{ color:#fff !important; }
.ehc-produktion__ersatz .et_pb_text_inner::after{ content:"Edelhoftheater Kirrweiler"; display:block; margin-top:18px; padding-top:14px; border-top:1px solid rgba(255,255,255,.35);
	font-family:var(--gh-schrift-text); font-style:normal; font-size:1rem; font-weight:600; letter-spacing:.04em; color:rgba(255,255,255,.88); }
.ehc-naechster__preis{ margin:6px 0 0 !important; padding:0 !important; font-size:1rem; color:var(--gh-grau); }
.ehc-held .ehc-naechster .ehc-naechster__preis{ color:var(--gh-grau); }

/* E-Mail-Adressen nicht am Bindestrich umbrechen (ich-will-auch@…), ab Tablet */
@media (min-width: 768px){ .et_pb_text_inner a[href^="mailto:"]{ white-space:nowrap; } }

/* ── Videos nach Klick (inc/einbettung.php) ── */
.ehc-video{ border-radius:var(--gh-radius); overflow:hidden; background:var(--gh-akzent); color:#fff; position:relative; }
/* Vor dem Klick so hoch wie der Inhalt (mind. 16:9), danach genau 16:9 fuer das Video */
.ehc-video:not([data-offen]) .ehc-video__tor{ min-height:min(240px, 56.25vw); }
.ehc-video[data-offen]{ aspect-ratio:16/9; }
.ehc-video__tor{ display:flex; flex-direction:column; justify-content:flex-end; align-items:flex-start; gap:12px; padding:clamp(18px,2.4vw,28px);
	background-image:radial-gradient(ellipse 80% 60% at 50% 0%, rgba(255,255,255,.14), transparent 70%); }
.ehc-video__titel{ margin:0 !important; padding:0 !important; font-family:var(--gh-schrift-titel); font-style:italic; font-weight:500; font-size:clamp(1.4rem,2.2vw,1.8rem); line-height:1.1; color:#fff; }
.ehc-video__knopf{ display:inline-flex; align-items:center; gap:10px; min-height:48px; padding:0 22px 0 16px; border:0; border-radius:999px; background:#fff; color:var(--gh-akzent);
	font:700 1rem/1.2 var(--gh-schrift-text); cursor:pointer; transition:transform .12s ease-out; }
.ehc-video__knopf::before{ content:""; width:0; height:0; border-style:solid; border-width:7px 0 7px 12px; border-color:transparent transparent transparent currentColor; }
.ehc-video__knopf:active{ transform:scale(.97); }
.ehc-video__knopf:focus-visible{ outline:3px solid #fff; outline-offset:3px; }
.ehc-video__hinweis{ margin:0 !important; padding:0 !important; font-size:.9rem; line-height:1.4; color:rgba(255,255,255,.88); }
.ehc-video__hinweis a{ color:#fff; text-decoration:underline; text-underline-offset:.15em; }
.ehc-video__ziel, .ehc-video__ziel iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.ehc-video__ziel:focus{ outline:none; }