/* [agwp_layers] – Ebenen-Umschalter ohne JavaScript
   Aktive Ebene = angehakter Radio-Button, Panel-Wechsel per :has(). */

.agwp-layers { --agwp-layers-gap: 18px; }

/* Reiter */
#top .agwp-layers__tabs {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
	border: 1px solid var(--agwp-line);
	border-radius: var(--agwp-r-xl);
	overflow: hidden;
	background: var(--agwp-bg2);
}
#top .agwp-layers__tab {
	position: relative;
	display: block;
	margin: 0;
	padding: 30px 30px 34px;
	border-right: 1px solid var(--agwp-line);
	background: transparent;
	color: var(--agwp-ink);
	font: inherit;
	font-weight: 400;
	text-align: left;
	cursor: pointer;
	transition: background-color .35s, color .35s;
}
#top .agwp-layers__tab:last-child { border-right: 0; }
#top .agwp-layers__tab:hover { background: var(--agwp-accsoft); }

/* Radio unsichtbar, aber fokussierbar */
.agwp-layers__radio {
	position: absolute;
	opacity: 0;
	width: 1px;
	height: 1px;
	margin: 0;
	pointer-events: none;
}
#top .agwp-layers__tab:has(.agwp-layers__radio:focus-visible) {
	outline: 3px solid color-mix(in oklab, var(--agwp-acc) 70%, transparent);
	outline-offset: -3px;
}

/* aktiv */
#top .agwp-layers__tab:has(.agwp-layers__radio:checked) { background: var(--agwp-acc); color: var(--agwp-onacc); }

.agwp-layers__top {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 34px;
}
#top .agwp-layers .agwp-layers__num { font: 500 var(--agwp-fs-kicker)/1.4 var(--agwp-font-mono); opacity: .8; }
#top .agwp-layers .agwp-layers__icon { font-size: 22px; font-weight: 700; line-height: 1; }
#top .agwp-layers .agwp-layers__icon::before { content: "+"; }
#top .agwp-layers .agwp-layers__tab:has(.agwp-layers__radio:checked) .agwp-layers__icon::before { content: "\25CF"; }

#top .agwp-layers__title {
	display: block;
	font-family: var(--agwp-font-head);
	font-size: clamp(2.125rem, 3.4vw, 3rem);
	font-weight: 800;
	line-height: 1;
	letter-spacing: -.03em;
}
#top .agwp-layers__sub { display: block; margin-top: 10px; font-size: 1rem; font-weight: 600; opacity: .85; }

/* Panels: nur das zur aktiven Ebene passende zeigen */
.agwp-layers__panel {
	display: none;
	margin-top: var(--agwp-layers-gap);
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr));
	gap: var(--agwp-layers-gap);
}
.agwp-layers:has(.agwp-layers__tab:nth-child(1) .agwp-layers__radio:checked) .agwp-layers__panel:nth-child(1),
.agwp-layers:has(.agwp-layers__tab:nth-child(2) .agwp-layers__radio:checked) .agwp-layers__panel:nth-child(2),
.agwp-layers:has(.agwp-layers__tab:nth-child(3) .agwp-layers__radio:checked) .agwp-layers__panel:nth-child(3),
.agwp-layers:has(.agwp-layers__tab:nth-child(4) .agwp-layers__radio:checked) .agwp-layers__panel:nth-child(4),
.agwp-layers:has(.agwp-layers__tab:nth-child(5) .agwp-layers__radio:checked) .agwp-layers__panel:nth-child(5),
.agwp-layers:has(.agwp-layers__tab:nth-child(6) .agwp-layers__radio:checked) .agwp-layers__panel:nth-child(6) { display: grid; }

/* Sehr alte Browser ohne :has(): alle Panels untereinander zeigen */
@supports not selector(:has(*)) {
	.agwp-layers__panel { display: grid; }
}

#top .agwp-layers__card {
	background: var(--agwp-bg2);
	border: 1px solid var(--agwp-line);
	border-radius: var(--agwp-r-xl);
	padding: clamp(28px, 3.5vw, 44px);
}
#top .agwp-layers__claim {
	margin: 0 0 14px;
	font-family: var(--agwp-font-head);
	font-size: clamp(1.625rem, 2.6vw, 2.25rem);
	font-weight: 800;
	line-height: 1.1;
	letter-spacing: -.02em;
	color: var(--agwp-ink);
	text-wrap: balance;
}
#top .agwp-layers__text,
#top .agwp-layers__text p { color: var(--agwp-ink2); font-size: var(--agwp-fs-body); line-height: 1.6; text-wrap: pretty; }
#top .agwp-layers__text p { margin: 0 0 .8em; }
#top .agwp-layers__text p:last-child { margin-bottom: 0; }
#top .agwp-layers__cta {
	display: inline-flex;
	gap: 8px;
	margin-top: 26px;
	font-weight: 800;
	color: var(--agwp-accink);
	text-decoration: none;
}
#top .agwp-layers__cta::after { content: "\2192"; transition: transform .2s; }
#top .agwp-layers__cta:hover::after { transform: translateX(3px); }

#top .agwp-layers__pills {
	background: var(--agwp-surf);
	border-radius: var(--agwp-r-xl);
	padding: clamp(28px, 3.5vw, 44px);
}
#top .agwp-layers__pills .agwp-pills { margin: 0; align-content: flex-start; }

/* Mobil: Reiter untereinander, Trennlinien horizontal */
@media (max-width: 880px) {
	#top .agwp-layers__tab { border-right: 0; border-bottom: 1px solid var(--agwp-line); padding: 22px 24px 24px; }
	#top .agwp-layers__tab:last-child { border-bottom: 0; }
	.agwp-layers__top { margin-bottom: 18px; }
}