/* a.l.s.o. Events & Treffpunkte – Werte aus dem Staging-Design übernommen */
.also-list,
.also-detail,
.also-related,
.also-cards {
	--also-petrol: #005866;
	--also-petrol-muted: rgba(0, 88, 102, 0.34);
	--also-box-bg: rgba(0, 88, 102, 0.06);
	--also-text: #212529;
	--also-button: #008fa5;
	--also-radius: 5px;
	--also-font: "Barlow", system-ui, sans-serif;
	--also-font-cond: "Barlow Condensed", "Barlow", system-ui, sans-serif;
	font-family: var(--also-font);
	color: var(--also-text);
}

/* Nur für Screenreader – unabhängig vom Theme */
.also-list .screen-reader-text,
.also-detail .screen-reader-text,
.also-cards .screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

/* Zeile */
.also-row {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: 20px 40px;
	align-items: start;
	padding: 20px 0;
	border-bottom: 2px solid var(--also-petrol-muted);
}
.also-row:first-child { padding-top: 0; }
.also-row.has-media { grid-template-columns: auto minmax(0, 1fr) 183px; }

/* Box links */
.also-box {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	min-width: 82px;
	min-height: 96px;
	padding: 10px;
	border-radius: var(--also-radius);
	background: var(--also-box-bg);
	text-align: center;
	text-decoration: none !important;
}
.also-box--wide { width: 142px; min-height: 113px; }
.also-box__big {
	font-family: var(--also-font);
	font-weight: 800;
	font-size: 40px;
	line-height: 1.2;
	color: var(--also-petrol);
	letter-spacing: -0.1px;
}
.also-box--wide .also-box__big { font-size: 30px; line-height: 1.5; }
.also-box__small {
	font-family: var(--also-font-cond);
	font-weight: 800;
	font-size: 16px;
	line-height: 1.8;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	color: var(--also-petrol-muted);
}

/* Text */
.also-row__title {
	margin: 0 0 4px;
	font-family: var(--also-font-cond);
	font-weight: 800;
	font-size: 25px;
	line-height: 1.8;
	letter-spacing: -0.1px;
	color: var(--also-text);
}
.also-row__title a { color: inherit; text-decoration: none; transition: color 0.15s; }

/* Ganze Zeile klickbar: der Titel-Link legt sich unsichtbar über die Zeile */
.also-row { position: relative; }
.also-row__title a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.also-row__title a:focus-visible { outline: none; }
.also-row__title a:focus-visible::after { outline: 2px solid var(--also-petrol); outline-offset: 4px; border-radius: var(--also-radius); }
.also-row:hover .also-row__title a,
.also-row__title a:focus-visible {
	color: var(--also-petrol);
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 4px;
}
.also-row:hover .also-box { background: rgba(0, 88, 102, 0.1); }
.also-media__img { transition: transform 0.3s; }
.also-row:hover .also-media--cover .also-media__img { transform: scale(1.04); }
.also-row__text,
.also-row__hint {
	margin: 0;
	font-size: 18px;
	line-height: 1.6;
	max-width: 60ch;
}
.also-row__hint { margin-top: 4px; font-size: 16px; color: var(--also-petrol); }

/* Bild 3:2 */
.also-row__media { display: block; }
.also-media {
	position: relative;
	aspect-ratio: 3 / 2;
	overflow: hidden;
	border-radius: var(--also-radius);
	background: var(--also-box-bg);
}
.also-media__img {
	position: relative;
	z-index: 1;
	display: block;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	object-fit: cover;
}
.also-media--contain .also-media__img { object-fit: contain; object-position: center !important; }
.also-media__backdrop {
	position: absolute;
	inset: -20px;
	background-size: cover;
	background-position: center;
	filter: blur(16px) saturate(1.1);
	opacity: 0.55;
}

/* Platzhalter ohne Bild: hellblau mit dezentem weißen Logo */
.also-media--placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	background: #bbdae4;
}
.also-media__logo {
	width: 62%;
	height: 50%;
	background: #fff;
	opacity: 0.6;
	-webkit-mask: var(--also-logo) center / contain no-repeat;
	mask: var(--also-logo) center / contain no-repeat;
}
.also-media__wordmark {
	font-family: var(--also-font-cond);
	font-weight: 800;
	font-size: 34px;
	letter-spacing: 1px;
	color: #fff;
	opacity: 0.7;
}

/* Button */
.also-button {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	margin-top: 40px;
	padding: 10px 25px 12px;
	border-radius: 8px;
	background: var(--also-button);
	color: #fff !important;
	font-family: var(--also-font);
	font-weight: 800;
	font-size: 16px;
	text-transform: uppercase;
	text-decoration: none !important;
	transition: background 0.2s;
}
.also-button:hover { background: var(--also-petrol); }

.also-empty { padding: 20px 0; font-size: 18px; }

/* Filterleiste */
.also-filter {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
	gap: 14px;
	align-items: center;
	margin-bottom: 40px;
	padding: 28px;
	border-radius: var(--also-radius);
	background: var(--also-box-bg);
}
.also-filter__tabs { display: flex; gap: 6px; grid-column: 1 / -1; }
.also-filter__tab {
	padding: 10px 20px;
	border-radius: var(--also-radius);
	font-family: var(--also-font-cond);
	font-weight: 800;
	font-size: 18px;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	color: var(--also-petrol);
	text-decoration: none !important;
	transition: background 0.2s;
}
.also-filter__tab:hover { background: rgba(0, 88, 102, 0.1); }
.also-filter__tab.is-active { background: var(--also-petrol); color: #fff; }
.also-filter__field { display: block; margin: 0; }
.also-filter__field input,
.also-filter__field select {
	box-sizing: border-box;
	width: 100%;
	height: 52px;
	padding: 0 16px;
	border: 1px solid var(--also-petrol-muted);
	border-radius: var(--also-radius);
	background-color: #fff;
	font: inherit;
	font-size: 18px;
	color: var(--also-text);
}
.also-filter__field input:focus,
.also-filter__field select:focus { outline: 2px solid var(--also-button); outline-offset: 1px; }
.also-filter__field--search { grid-column: 1 / 4; grid-row: 2; }
.also-filter__label {
	display: block;
	margin: 0 0 6px;
	font-family: var(--also-font-cond);
	font-weight: 800;
	font-size: 14px;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: var(--also-petrol);
}
/* Eigener Pfeil statt Browser-Standard: sitzt 16px vom Rand, überall gleich */
.also-filter__field select {
	-webkit-appearance: none;
	appearance: none;
	padding-right: 48px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%23005866' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 18px center;
	background-size: 14px 9px;
	cursor: pointer;
}
.also-filter__field select::-ms-expand { display: none; }
.also-filter__submit {
	grid-column: 4;
	grid-row: 2;
	height: 52px;
	padding: 0 32px;
	border: 0;
	border-radius: var(--also-radius);
	background: var(--also-button);
	color: #fff;
	font: inherit;
	font-size: 18px;
	font-weight: 800;
	text-transform: uppercase;
	cursor: pointer;
	transition: background 0.2s;
}
.also-filter__submit:hover { background: var(--also-petrol); }
.also-filter__reset { grid-column: 4; grid-row: 3; align-self: end; padding-bottom: 14px; justify-self: center; font-size: 16px; color: var(--also-petrol); }

.also-pagination { display: flex; gap: 6px; justify-content: center; margin-top: 30px; }
.also-pagination a,
.also-pagination span {
	min-width: 36px;
	padding: 6px 10px;
	border-radius: var(--also-radius);
	text-align: center;
	color: var(--also-petrol);
	text-decoration: none;
}
.also-pagination span { background: var(--also-petrol); color: #fff; }

/* Detailseite */
.also-detail { padding: 56px 0 56px; }
.also-detail__past {
	padding: 10px 14px;
	border-radius: var(--also-radius);
	background: var(--also-box-bg);
	color: var(--also-petrol);
}
.also-detail__head { display: flex; gap: 30px; align-items: center; margin-bottom: 30px; }
.also-detail__facts p { margin: 0; font-size: 18px; line-height: 1.6; }
.also-detail__date { font-weight: 800; color: var(--also-petrol); }
.also-detail__subline { font-size: 20px !important; }
.also-detail__image { margin: 0 0 30px; }
.also-detail__image img { width: 100%; height: auto; border-radius: var(--also-radius); }
.also-detail__text { font-size: 18px; line-height: 1.7; }
.also-detail__organizer {
	display: flex;
	gap: 20px;
	align-items: center;
	margin-top: 30px;
	padding: 20px;
	border-radius: var(--also-radius);
	background: var(--also-box-bg);
}
.also-detail__organizer p { margin: 0; }
.also-detail__organizer-logo { max-width: 180px; height: auto; }

/* Handy */
@media (max-width: 767px) {
	.also-row,
	.also-row.has-media {
		grid-template-columns: auto minmax(0, 1fr);
		gap: 14px 18px;
	}
	.also-row__media { grid-column: 1 / -1; }
	/* Platzhalter bringt auf dem Handy keine Information – nur echte Bilder zeigen, und flacher */
	.also-row.has-placeholder .also-row__media { display: none; }
	.also-row.has-media .also-media { aspect-ratio: 16 / 9; }
	.also-box { min-width: 64px; min-height: 76px; padding: 8px; }
	.also-box__big { font-size: 30px; }
	.also-box--wide { width: 104px; min-height: 86px; }
	.also-box--wide .also-box__big { font-size: 22px; }
	.also-box__small { font-size: 13px; letter-spacing: 1px; }
	.also-row__title { font-size: 22px; line-height: 1.3; }
	.also-row__text { font-size: 16px; }
	.also-filter { grid-template-columns: minmax(0, 1fr); padding: 18px; gap: 10px; }
	.also-filter__tabs,
	.also-filter__field--search,
	.also-filter__submit,
	.also-filter__reset { grid-column: auto; grid-row: auto; }
	.also-filter__tab { flex: 1; text-align: center; }
	.also-filter__submit { width: 100%; }
	.also-detail__head { gap: 18px; }
	.also-detail { padding: 32px 0 40px; }
}

/* Nächste Termine (regelmäßige Angebote) als Datums-Kacheln */
.also-detail__next { margin: 0 0 30px; }
.also-detail__next-title {
	margin: 0 0 14px;
	font-family: var(--also-font-cond);
	font-weight: 800;
	font-size: 25px;
	color: var(--also-text);
}
.also-dates {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(84px, 1fr));
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.also-date {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 10px 6px 12px;
	border-radius: var(--also-radius);
	background: var(--also-box-bg);
	text-align: center;
	line-height: 1.1;
}
.also-date.is-next { background: var(--also-petrol); }
.also-date.is-next .also-date__wd,
.also-date.is-next .also-date__day,
.also-date.is-next .also-date__month { color: #fff; }
.also-date__wd,
.also-date__month {
	font-family: var(--also-font-cond);
	font-weight: 800;
	font-size: 14px;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: var(--also-petrol-muted);
}
.also-date__day {
	margin: 2px 0;
	font-weight: 800;
	font-size: 32px;
	color: var(--also-petrol);
}
.also-date.is-ausfall { background: transparent; border: 2px dashed var(--also-petrol-muted); }
.also-date.is-ausfall .also-date__day { color: var(--also-petrol-muted); text-decoration: line-through; }
.also-date__note {
	margin-top: 4px;
	font-size: 12px;
	font-weight: 800;
	text-transform: uppercase;
	color: #b3401a;
}

/* „Weitere Termine" unter der Detailseite */
.also-related {
	padding: 48px 0 80px;
	border-top: 2px solid var(--also-petrol-muted);
}
.also-related__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 16px;
	margin: 0 0 24px;
}
.also-related__title {
	margin: 0;
	font-family: var(--also-font-cond);
	font-weight: 800;
	font-size: 32px;
	line-height: 1.2;
	color: var(--also-text);
}
/* CTA-Vorlage aus Elementor direkt vor dem Footer */
.also-cta { margin-top: 0; }
@media (max-width: 767px) {
	.also-related { padding: 32px 0 48px; }
	.also-related__title { font-size: 26px; }
}

/* Termin-Karten (wie die „Bereiche“-Karten der Startseite) */
.also-cards {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
}
.also-card {
	position: relative;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border-radius: var(--also-radius);
	background: #fff;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05), 0 8px 19px rgba(0, 0, 0, 0.1);
	transition: transform 0.2s, box-shadow 0.2s;
}
.also-card:hover { transform: translateY(-3px); box-shadow: 0 4px 10px rgba(0, 0, 0, 0.07), 0 14px 28px rgba(0, 0, 0, 0.13); }
.also-card__media { position: relative; }
.also-card__media .also-media { border-radius: 0; }
.also-card:hover .also-media--cover .also-media__img { transform: scale(1.04); }
.also-card__date {
	position: absolute;
	top: 14px;
	left: 14px;
	z-index: 2;
	min-width: 54px;
	padding: 6px 10px 7px;
	border-radius: var(--also-radius);
	background: #fff;
	text-align: center;
	line-height: 1;
}
.also-card__date b { display: block; font-family: var(--also-font); font-weight: 800; font-size: 26px; color: var(--also-petrol); }
.also-card__date span { font-family: var(--also-font-cond); font-weight: 800; font-size: 13px; letter-spacing: 1.5px; text-transform: uppercase; color: var(--also-petrol-muted); }
.also-card__body { padding: 18px 20px 20px; }
.also-card__meta {
	margin: 0 0 4px;
	font-family: var(--also-font-cond);
	font-weight: 800;
	font-size: 14px;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: var(--also-button);
}
.also-card__title {
	margin: 0 0 6px;
	font-family: var(--also-font-cond);
	font-weight: 800;
	font-size: 24px;
	line-height: 1.4;
	color: #00353d;
}
.also-card__title a { color: inherit; text-decoration: none; }
.also-card__title a::after { content: ""; position: absolute; inset: 0; z-index: 3; }
.also-card__title a:focus-visible { outline: none; }
.also-card__title a:focus-visible::after { outline: 2px solid var(--also-petrol); outline-offset: 3px; border-radius: var(--also-radius); }
.also-card__text {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
	margin: 0;
	font-size: 16px;
	line-height: 1.8;
}
.also-card__footer {
	margin-top: auto;
	padding: 12px 20px;
	background: var(--also-button);
	transition: background 0.2s;
	color: #fff;
	font-weight: 800;
	font-size: 16px;
}
.also-card__chevron { display: inline-block; margin-left: 4px; transition: transform 0.2s; }
.also-card:hover .also-card__chevron { transform: translateX(3px); }
.also-card:hover .also-card__footer { background: var(--also-petrol); }
.also-related__all {
	flex-shrink: 0;
	font-weight: 700;
	font-size: 16px;
	color: var(--also-button);
	text-decoration: none;
}
.also-related__all:hover { color: var(--also-petrol); text-decoration: underline; text-underline-offset: 3px; }
.also-related__all:hover .also-card__chevron { transform: translateX(3px); }

@media (max-width: 1024px) {
	.also-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
	.also-cards { grid-template-columns: minmax(0, 1fr); gap: 16px; }
	.also-card__title { font-size: 22px; }
}

/* Status: abgesagt / verschoben / fällt aus (ab 1.5.0) */
.also-row__status,
.also-card__status,
.also-detail__status {
	margin: 0 0 6px;
	font-size: 16px;
	line-height: 1.5;
}
.also-status {
	display: inline-block;
	padding: 2px 10px 3px;
	border-radius: var(--also-radius);
	background: #b3401a;
	color: #fff;
	font-family: var(--also-font-cond);
	font-weight: 800;
	font-size: 14px;
	line-height: 1.4;
	letter-spacing: 1px;
	text-transform: uppercase;
	vertical-align: middle;
}
.also-status--verschoben { background: #8a5a00; }
.also-status__note {
	margin-left: 6px;
	font-weight: 700;
	color: #b3401a;
	vertical-align: middle;
}
.also-status--verschoben + .also-status__note { color: #8a5a00; }

/* Ausgegraut, Badge bleibt kräftig */
.also-row.is-muted .also-box,
.also-row.is-muted .also-row__media,
.also-card.is-muted .also-card__media {
	opacity: 0.5;
	filter: grayscale(1);
}
.also-row.is-muted .also-row__title,
.also-row.is-muted .also-row__text,
.also-row.is-muted .also-row__hint,
.also-card.is-muted .also-card__title,
.also-card.is-muted .also-card__text,
.also-card.is-muted .also-card__meta { color: #6c757d; }

.also-detail__status {
	margin-bottom: 20px;
	padding: 10px 14px;
	border-radius: var(--also-radius);
	background: #fbeee9;
}
.also-detail__status.is-verschoben { background: #fbf3e2; }