/*
 * Gestalterische Verfeinerungen, die über die Design-Tokens in theme.json
 * hinausgehen: Kartenoptik, Kopfbereich, Dropdown-Menü, Sprunglink.
 * Design-Tokens (Farben, Typografie, Abstände) gehören in theme.json —
 * hier nur Struktur- und Interaktionsdetails, die dort nicht abbildbar sind.
 */

/* Nur für Screenreader hörbar, visuell ausgeblendet — Standardmuster von WordPress */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}

/* Basisgrösse für alle Inline-Icons (siehe plugins/egw-dokumente/icons.php) */
.egw-icon {
	width: 1.15em;
	height: 1.15em;
	vertical-align: -0.2em;
	flex-shrink: 0;
	color: var(--wp--preset--color--akzent-warm);
}

/* Sanftere, einheitliche Bewegung bei Hover- und Einblend-Effekten */
:root {
	--egw-uebergang: 0.25s cubic-bezier(0.25, 0.1, 0.25, 1);
}

/* Karten und Listenzeilen blenden beim Scrollen dezent ein. Wer reduzierte
   Bewegung eingestellt hat, bekommt sofort den Endzustand ohne Animation. */
.egw-reveal {
	opacity: 0;
	transform: translateY(14px);
	transition: opacity var(--egw-uebergang), transform var(--egw-uebergang);
}

.egw-reveal.ist-sichtbar {
	opacity: 1;
	transform: none;
}

@media (prefers-reduced-motion: reduce) {
	.egw-reveal {
		opacity: 1;
		transform: none;
		transition: none;
	}
}

/* Sprunglink für Tastatur- und Screenreader-Nutzung */
.egw-skip-link {
	position: absolute;
	left: -999px;
	top: 0.75rem;
	z-index: 100;
	padding: 0.6rem 1.1rem;
	background: var(--wp--preset--color--akzent);
	color: var(--wp--preset--color--basis);
	border-radius: 2px;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	text-decoration: none;
}

.egw-skip-link:focus {
	left: 0.75rem;
}

/* Kopfbereich: bleibt beim Scrollen sichtbar */
.egw-kopfbereich {
	position: sticky;
	top: 0;
	z-index: 40;
}

/* Markenzeichen im Kopfbereich: Blitzsymbol vor dem Seitentitel */
.egw-marke {
	align-items: center;
	gap: 0.5rem;
}

.egw-marke__icon {
	width: 1.7rem;
	height: 1.7rem;
	color: var(--wp--preset--color--akzent-warm);
}

/* Dropdown-Untermenüs der Hauptnavigation */
.wp-block-navigation__submenu-container {
	background: var(--wp--preset--color--basis);
	border: 1px solid var(--wp--preset--color--linie);
	border-radius: 4px;
	box-shadow: 0 10px 28px rgba(27, 39, 51, 0.09);
	padding: 0.4rem 0;
}

.wp-block-navigation__submenu-container a {
	padding: 0.6rem 1.25rem !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	font-weight: 500 !important;
	white-space: nowrap;
}

.wp-block-navigation__submenu-container a:hover {
	background: var(--wp--preset--color--flaeche);
}

/* Mobiles Überlagerungsmenü */
.wp-block-navigation__responsive-container.is-menu-open {
	background: var(--wp--preset--color--basis);
}

/* Hero-Fläche der Startseite */
.egw-hero h1 {
	max-width: 20ch;
}

.egw-hero__lead {
	max-width: 60ch;
	color: var(--wp--preset--color--text-leise);
}

.egw-aktuell-karte {
	border: 1px solid var(--wp--preset--color--linie);
	border-radius: 8px;
	box-shadow: 0 12px 32px rgba(27, 39, 51, 0.06);
	transition: box-shadow var(--egw-uebergang), transform var(--egw-uebergang);
}

.egw-aktuell-karte:hover {
	box-shadow: 0 16px 40px rgba(27, 39, 51, 0.09);
	transform: translateY(-2px);
}

.egw-aktuell-karte :last-child {
	margin-bottom: 0 !important;
}

/* Kleine Eyebrow-Beschriftung über einem Titel */
.egw-kicker {
	margin: 0 0 0.35rem !important;
	color: var(--wp--preset--color--akzent);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

/* Verweiskacheln (Übersichtsseiten wie «Informationen», «Kontaktaufnahme») */
.egw-kachelreihe {
	display: grid !important;
	grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
	gap: var(--wp--preset--spacing--40);
}

.egw-kachel {
	padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--40) var(--wp--preset--spacing--50);
	border: 1px solid var(--wp--preset--color--linie);
	border-radius: 6px;
	background: var(--wp--preset--color--basis);
	transition: border-color var(--egw-uebergang), box-shadow var(--egw-uebergang), transform var(--egw-uebergang);
}

.egw-kachel:hover {
	border-color: var(--wp--preset--color--akzent-warm);
	box-shadow: 0 10px 24px rgba(27, 39, 51, 0.08);
	transform: translateY(-2px);
}

.egw-kachel__icon {
	display: block;
	width: 2rem;
	height: 2rem;
	margin-bottom: 0.75rem;
	color: var(--wp--preset--color--akzent-warm);
}

.egw-kachel h3 a {
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 0.4em;
}

.egw-kachel h3 a::after {
	content: "\2192";
	color: var(--wp--preset--color--akzent-warm);
	transition: transform var(--egw-uebergang);
}

.egw-kachel:hover h3 a::after {
	transform: translateX(3px);
}

/* Vorstandskarten */
.egw-vorstandskarte {
	text-align: center;
	padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--30);
	border: 1px solid var(--wp--preset--color--linie);
	border-radius: 6px;
	background: var(--wp--preset--color--basis);
	transition: box-shadow var(--egw-uebergang), transform var(--egw-uebergang);
}

.egw-vorstandskarte:hover {
	box-shadow: 0 10px 24px rgba(27, 39, 51, 0.07);
	transform: translateY(-2px);
}

.egw-vorstandskarte figure.wp-block-image {
	margin-left: auto;
	margin-right: auto;
}

/* Fussbereich */
.egw-fussbereich__titel {
	margin: 0 0 0.5rem !important;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: var(--wp--preset--color--text);
	overflow-wrap: normal;
	word-break: normal;
}

.egw-fussbereich__zeile {
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

/* Suchformular auf der 404-Seite */
.wp-block-search__button {
	border-radius: 2px !important;
}