/* ==========================================================================
   Aegis Termine – Sektion "Die nächsten Termine"
   Alle Stellschrauben stehen oben als Variablen. Überschreiben im Avada
   Custom CSS, z. B.:  .aegis-termine { --aegis-termine-name-size: 24px; }
   ========================================================================== */

/* Sofia Sans Extra Condensed 400 / 600 / 800 – im Plugin mitgeliefert (SIL OFL, siehe fonts/OFL.txt),
   damit die Sektion unabhängig von den Avada-Typografie-Einstellungen ist. Eigener Name, damit
   nichts mit Avadas Einbindung kollidiert. */
@font-face {
	font-family: "Aegis Termine Sofia";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("fonts/sofia-sans-extra-condensed-latin-400-normal.woff2") format("woff2");
}
@font-face {
	font-family: "Aegis Termine Sofia";
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url("fonts/sofia-sans-extra-condensed-latin-600-normal.woff2") format("woff2");
}
@font-face {
	font-family: "Aegis Termine Sofia";
	font-style: normal;
	font-weight: 800;
	font-display: swap;
	src: url("fonts/sofia-sans-extra-condensed-latin-800-normal.woff2") format("woff2");
}

/* Sofia Sans in normaler Breite – für Datumsblock und Preise (Anlehnung ans Leporello). */
@font-face {
	font-family: "Aegis Termine Sofia Normal";
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url("fonts/sofia-sans-latin-700-normal.woff2") format("woff2");
}
@font-face {
	font-family: "Aegis Termine Sofia Normal";
	font-style: normal;
	font-weight: 800;
	font-display: swap;
	src: url("fonts/sofia-sans-latin-800-normal.woff2") format("woff2");
}

.aegis-termine {
	/* Farben */
	--aegis-termine-bg: #f8f5ee;
	--aegis-termine-karte: #ffffff;
	--aegis-termine-text: #141617;
	--aegis-termine-grau: #5a524c;
	--aegis-termine-akzent: #b42d25;
	--aegis-termine-akzent-hover: #80241a;
	--aegis-termine-ersatz: #551111;      /* Fläche, wenn Libri kein Bild hat */
	--aegis-termine-bild-leer: #d9d1c2;   /* Grund hinter Bildern beim Laden */

	/* Schriften – Bookmania kommt über das Adobe-Fonts-Kit der Website, Sofia Sans aus dem Plugin */
	--aegis-termine-serif: bookmania, "Bookman Old Style", Georgia, serif;
	--aegis-termine-cond: "Aegis Termine Sofia", "Sofia Sans Extra Condensed", Arial, Helvetica, sans-serif;
	--aegis-termine-wide: "Aegis Termine Sofia Normal", "Sofia Sans", Arial, Helvetica, sans-serif;

	/* Größen */
	--aegis-termine-dachzeile-size: 20px;
	--aegis-termine-titel-size: 52px;
	--aegis-termine-alle-size: 22px;
	--aegis-termine-meta-size: 18px;
	--aegis-termine-name-size: 26px;
	--aegis-termine-preis-size: 16px;
	--aegis-termine-tag-weight: 700;
	--aegis-termine-button-size: 20px;
	--aegis-termine-tag-size: 50px;
	--aegis-termine-monat-size: 15px;

	/* Maße */
	--aegis-termine-max: 1280px;
	--aegis-termine-pad-y: 88px;
	--aegis-termine-pad-x: 80px;
	--aegis-termine-gap: 32px;
	--aegis-termine-bild-hoehe: 240px;
	--aegis-termine-badge: 90px; /* Datumsblock, quadratisch */
	--aegis-termine-karte-pad: 28px;
	--aegis-termine-wisch-breite: min(85%, 400px); /* Kartenbreite in der Wischreihe (Handy/Tablet) */

	background: var(--aegis-termine-bg);
	color: var(--aegis-termine-text);
	font-family: var(--aegis-termine-serif);
	padding: var(--aegis-termine-pad-y) var(--aegis-termine-pad-x);
	box-sizing: border-box;
}

.aegis-termine *,
.aegis-termine *::before,
.aegis-termine *::after {
	box-sizing: border-box;
}

.aegis-termine--ohne-hintergrund {
	background: transparent;
}

.aegis-termine__inner {
	max-width: var(--aegis-termine-max);
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: 48px;
}

/* Kopf ------------------------------------------------------------------ */

.aegis-termine .aegis-termine__kopf {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 24px 32px;
	flex-wrap: wrap;
	margin: 0;
}

.aegis-termine .aegis-termine__dachzeile {
	margin: 0 0 6px;
	font-family: var(--aegis-termine-cond);
	font-weight: 600;
	font-size: var(--aegis-termine-dachzeile-size);
	line-height: 1.2;
	letter-spacing: 3px;
	text-transform: uppercase;
	color: var(--aegis-termine-akzent);
}

.aegis-termine .aegis-termine__titel {
	margin: 0;
	padding: 0;
	font-family: var(--aegis-termine-serif);
	font-weight: 400;
	font-size: var(--aegis-termine-titel-size);
	line-height: 1.1;
	letter-spacing: -1px;
	color: var(--aegis-termine-text);
}

.aegis-termine .aegis-termine__alle {
	font-family: var(--aegis-termine-cond);
	font-size: var(--aegis-termine-alle-size);
	letter-spacing: 1px;
	color: var(--aegis-termine-text);
	text-decoration: none;
	padding-bottom: 6px;
}

.aegis-termine .aegis-termine__alle:hover,
.aegis-termine .aegis-termine__alle:focus-visible {
	color: var(--aegis-termine-akzent);
	text-decoration: underline;
	text-underline-offset: 4px;
}

/* Karten ---------------------------------------------------------------- */

.aegis-termine .aegis-termine__liste {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--aegis-termine-gap);
}

.aegis-termine .aegis-termine__karte {
	position: relative; /* Bezugsrahmen für die klickbare Fläche */
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	background: var(--aegis-termine-karte);
}

/* Ganze Karte klickbar: Der Link sitzt im Titel und spannt eine unsichtbare Fläche über die Karte. */
.aegis-termine .aegis-termine__link {
	color: inherit;
	text-decoration: none;
}

.aegis-termine .aegis-termine__link::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
}

.aegis-termine .aegis-termine__link:focus-visible {
	outline: none;
}

/* Rahmen nur bei Tastaturbedienung – nicht nach Mausklick (auch nicht nach "Weitere Termine"). */
.aegis-termine .aegis-termine__karte:has(.aegis-termine__link:focus-visible) {
	outline: 2px solid var(--aegis-termine-akzent);
	outline-offset: 3px;
}

.aegis-termine .aegis-termine__karte:hover .aegis-termine__name {
	color: var(--aegis-termine-akzent);
}

.aegis-termine .aegis-termine__karte:hover .aegis-termine__button {
	background: var(--aegis-termine-akzent-hover);
}

.aegis-termine .aegis-termine__karte::before {
	content: none; /* Avada-Listenpunkte unterdrücken */
}

.aegis-termine__bild {
	position: relative;
	height: var(--aegis-termine-bild-hoehe);
	background: var(--aegis-termine-bild-leer);
}

.aegis-termine__bild img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center 30%;
}

.aegis-termine__bild-ersatz {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	padding: 24px;
	background: var(--aegis-termine-ersatz);
	color: var(--aegis-termine-bg);
	font-family: var(--aegis-termine-cond);
	font-weight: 600;
	font-size: 22px;
	letter-spacing: 3px;
	text-transform: uppercase;
	text-align: center;
}

.aegis-termine .aegis-termine__datum {
	position: absolute;
	left: 20px;
	bottom: calc(var(--aegis-termine-badge) / -3);
	width: var(--aegis-termine-badge);
	height: var(--aegis-termine-badge);
	margin: 0;
	background: var(--aegis-termine-akzent);
	color: #ffffff;
	font-family: var(--aegis-termine-wide);
	display: flex;
	align-items: center;
	justify-content: center;
}

.aegis-termine__datum time {
	display: flex;
	flex-direction: column;
	align-items: center;
	line-height: 1;
}

.aegis-termine__tag {
	font-weight: var(--aegis-termine-tag-weight);
	font-size: var(--aegis-termine-tag-size);
	line-height: 0.85;
	letter-spacing: -1px;
}

.aegis-termine__monat {
	font-weight: 800;
	font-size: var(--aegis-termine-monat-size);
	letter-spacing: 1.5px;
	text-transform: uppercase;
	margin-top: 4px;
}

.aegis-termine__text {
	display: flex;
	flex-direction: column;
	gap: 12px;
	flex-grow: 1;
	padding: calc(var(--aegis-termine-badge) / 3 + 20px) var(--aegis-termine-karte-pad) var(--aegis-termine-karte-pad);
}

.aegis-termine .aegis-termine__meta {
	margin: 0;
	font-family: var(--aegis-termine-cond);
	font-weight: 600;
	font-size: var(--aegis-termine-meta-size);
	line-height: 1.3;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: var(--aegis-termine-grau);
}

.aegis-termine .aegis-termine__name {
	margin: 0;
	padding: 0;
	flex-grow: 1;
	font-family: var(--aegis-termine-serif);
	font-weight: 400;
	font-size: var(--aegis-termine-name-size);
	line-height: 1.25;
	letter-spacing: -0.3px;
	color: var(--aegis-termine-text);
}

.aegis-termine .aegis-termine__preis {
	margin: 0;
	font-family: var(--aegis-termine-wide);
	font-weight: 700;
	font-size: var(--aegis-termine-preis-size);
	line-height: 1.4;
	letter-spacing: 0.5px;
	text-transform: uppercase;
	color: var(--aegis-termine-grau);
}

.aegis-termine .aegis-termine__button {
	align-self: flex-start;
	display: inline-flex;
	align-items: center;
	min-height: 48px;
	margin-top: 8px;
	padding: 0 22px;
	background: var(--aegis-termine-akzent);
	color: #ffffff;
	font-family: var(--aegis-termine-cond);
	font-size: var(--aegis-termine-button-size);
	letter-spacing: 1px;
	text-decoration: none;
	border-radius: 0;
	transition: background-color 0.15s ease;
}

/* Hat der Button ein anderes Ziel als die Karte, liegt er über der Kartenfläche. */
.aegis-termine a.aegis-termine__button {
	position: relative;
	z-index: 2;
}

.aegis-termine .aegis-termine__name {
	transition: color 0.15s ease;
}

.aegis-termine .aegis-termine__button:hover,
.aegis-termine .aegis-termine__button:focus-visible {
	background: var(--aegis-termine-akzent-hover);
	color: #ffffff;
}

.aegis-termine a:focus-visible {
	outline: 2px solid var(--aegis-termine-akzent);
	outline-offset: 3px;
}

.aegis-termine .aegis-termine__leer {
	margin: 0;
	font-size: 18px;
}

.aegis-termine .aegis-termine__leer a {
	color: var(--aegis-termine-akzent);
}

.aegis-termine .screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	white-space: nowrap;
}

/* Weitere Termine (Desktop) ----------------------------------------------- */

.aegis-termine .aegis-termine__karte.is-versteckt {
	display: none;
}

.aegis-termine__mehr-wrap {
	display: flex;
	justify-content: center;
}

.aegis-termine .aegis-termine__mehr {
	display: inline-flex;
	align-items: center;
	min-height: 48px;
	margin: 0;
	padding: 0 32px;
	background: transparent;
	border: 1px solid var(--aegis-termine-text);
	border-radius: 0;
	color: var(--aegis-termine-text);
	font-family: var(--aegis-termine-cond);
	font-size: var(--aegis-termine-button-size);
	letter-spacing: 1px;
	cursor: pointer;
	transition: background-color 0.15s ease, color 0.15s ease;
}

.aegis-termine .aegis-termine__mehr:hover,
.aegis-termine .aegis-termine__mehr:focus-visible {
	background: var(--aegis-termine-text);
	color: var(--aegis-termine-bg);
}

.aegis-termine .aegis-termine__mehr:focus-visible {
	outline: 2px solid var(--aegis-termine-akzent);
	outline-offset: 3px;
}

.aegis-termine .aegis-termine__mehr[hidden] {
	display: none;
}

.aegis-termine a.aegis-termine__mehr {
	text-decoration: none;
	gap: 8px;
}

/* Programm-Kachel am Ende der Wischreihe – nur Handy/Tablet. */
.aegis-termine .aegis-termine__karte--programm {
	display: none;
}

.aegis-termine .aegis-termine__programm-kachel {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-end;
	gap: 8px;
	width: 100%;
	min-height: 320px;
	padding: var(--aegis-termine-karte-pad);
	background: var(--aegis-termine-ersatz);
	color: var(--aegis-termine-bg);
	font-family: var(--aegis-termine-serif);
	font-size: 30px;
	line-height: 1.15;
	text-decoration: none;
}

.aegis-termine .aegis-termine__programm-kachel:hover,
.aegis-termine .aegis-termine__programm-kachel:focus-visible {
	background: var(--aegis-termine-akzent);
	color: #ffffff;
}

/* Tablet ---------------------------------------------------------------- */

@media (max-width: 1100px) {
	.aegis-termine {
		--aegis-termine-pad-x: 40px;
		--aegis-termine-gap: 24px;
		--aegis-termine-name-size: 22px;
		--aegis-termine-karte-pad: 22px;
	}
}

/* Handy: Karten untereinander ------------------------------------------- */

@media (max-width: 800px) {
	.aegis-termine {
		--aegis-termine-pad-y: 56px;
		--aegis-termine-pad-x: 20px;
		--aegis-termine-titel-size: 36px;
		--aegis-termine-dachzeile-size: 17px;
		--aegis-termine-name-size: 24px;
		--aegis-termine-bild-hoehe: 200px;
	}

	.aegis-termine__inner {
		gap: 32px;
	}

	/* Wischreihe: alle Termine nebeneinander, die nächste Karte schaut rechts an. */
	.aegis-termine .aegis-termine__liste {
		grid-template-columns: none;
		grid-auto-flow: column;
		grid-auto-columns: var(--aegis-termine-wisch-breite);
		gap: 16px;
		overflow-x: auto;
		overscroll-behavior-x: contain;
		scroll-snap-type: x mandatory;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
		/* Reihe bis an den rechten Bildschirmrand ziehen, Fokusrahmen nicht abschneiden */
		margin-right: calc(var(--aegis-termine-pad-x) * -1);
		padding: 4px var(--aegis-termine-pad-x) 8px 4px;
		margin-left: -4px;
		scroll-padding-left: 4px;
	}

	.aegis-termine .aegis-termine__liste::-webkit-scrollbar {
		display: none;
	}

	.aegis-termine .aegis-termine__karte {
		scroll-snap-align: start;
	}

	/* Auf dem Handy sind alle Termine in der Reihe, am Ende die Programm-Kachel – kein Button darunter. */
	.aegis-termine .aegis-termine__karte.is-versteckt,
	.aegis-termine .aegis-termine__karte--programm {
		display: flex;
	}

	/* Gibt es eine Wischreihe mit Programm-Kachel, entfällt der Bereich unter der Reihe.
	   Ohne weitere Termine (keine Kachel) bleibt der Programm-Link darunter stehen. */
	.aegis-termine .aegis-termine__liste:has(.aegis-termine__karte--programm) + .aegis-termine__mehr-wrap {
		display: none;
	}
}