/* ARIA Features – Farben aus dem Theme abgeleitet (hell/dunkel tauglich). */

.aria-features {
	--aria-features-accent: var(--wp--preset--color--accent-1, #3ddc84);
	--aria-features-line: color-mix(in srgb, currentColor 14%, transparent);
	--aria-features-soft: color-mix(in srgb, currentColor 4%, transparent);
	--aria-features-muted: color-mix(in srgb, currentColor 62%, transparent);
	display: flow-root;
}

.aria-features-intro {
	max-width: var(--wp--style--global--content-size, 760px);
	margin: 0 auto 2.5rem;
	font-size: 1.1rem;
}

/* Sprungnavigation zu den Bereichen */
.aria-features-nav { margin: 0 0 3rem; }
.aria-features-nav ul {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}
.aria-features-nav a {
	display: inline-block;
	padding: .35rem .9rem;
	border: 1px solid var(--aria-features-line);
	border-radius: 999px;
	background: var(--aria-features-soft);
	color: inherit;
	font-size: .9rem;
	text-decoration: none;
}
.aria-features-nav a:hover,
.aria-features-nav a:focus-visible {
	border-color: var(--aria-features-accent);
	color: var(--aria-features-accent);
}

.aria-features-section,
.aria-features-gallery { margin-top: 4rem; scroll-margin-top: 200px; }
.aria-features-section__title { margin: 0 0 2rem; }

/* Einzelne Funktion (Kern-Block «Medien und Text») */
.aria-features .aria-feature { margin-block: 0 3.5rem; gap: 0; scroll-margin-top: 200px; }
.aria-features .aria-feature .wp-block-media-text__content { padding: 0 2.5rem; }
.aria-features .aria-feature__title { margin: 0 0 .8rem; }
/* Screenshots sind freigestellt (nur das A.R.I.A.-Fenster, transparenter Rand):
   kein Rahmen ums Bild, der Schatten folgt der Form des Fensters. */
.aria-features .aria-feature .wp-block-media-text__media img {
	border: 0;
	border-radius: 0;
	box-shadow: none;
	background: transparent;
	filter: drop-shadow(0 14px 22px color-mix(in srgb, var(--aria-features-accent) 22%, transparent));
}
.aria-features .aria-feature--text {
	max-width: var(--wp--style--global--content-size, 760px);
	margin-inline: auto;
}

/* Theme-Galerie */
.aria-features-gallery__text { margin-bottom: 1.5rem; }
.aria-features .aria-theme-gallery.wp-block-gallery { gap: 1.2rem; }
/* Letzte Reihe nicht auf volle Breite ziehen: alle Kacheln gleich gross. */
.aria-features .aria-theme-gallery.wp-block-gallery.has-nested-images figure.wp-block-image { flex-grow: 0; }
.aria-features .aria-theme-gallery figure.wp-block-image {
	border: 1px solid var(--aria-features-line);
	border-radius: 10px;
	overflow: hidden;
}
.aria-features .aria-theme-gallery.wp-block-gallery.has-nested-images figure.wp-block-image figcaption {
	padding: .5rem .7rem;
	background: linear-gradient(0deg, rgba(0, 0, 0, .85), rgba(0, 0, 0, 0));
	color: #e8ffe8;
	font-size: .85rem;
	letter-spacing: .04em;
}

@media (max-width: 781px) {
	.aria-features .aria-feature .wp-block-media-text__content { padding: 1.2rem 0 0; }
	.aria-features .aria-feature { margin-bottom: 2.8rem; }
}
@media (max-width: 600px) {
	.aria-features .aria-theme-gallery.wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image) {
		width: 100%;
	}
}
