/* Farben und Schriften aus dem Gestaltungsprofil (E-057) */
html:where(:not([class^="m3d-"], [class*=" m3d-"], [class^="m3d-"] *, [class*=" m3d-"] *)) {
	scroll-behavior: smooth;
}

/* Grundfarbe hier, damit die Hintergrund-Animation der Seiten sichtbar bleibt */
body:where(:not([class^="m3d-"], [class*=" m3d-"], [class^="m3d-"] *, [class*=" m3d-"] *)) {
	--grund: var(--m3d-farbe-grund);
	margin: 0;
	min-height: 100vh;
	background: radial-gradient(120% 80% at 78% 0%, var(--m3d-farbe-grund-schein) 0%, transparent 55%), linear-gradient(180deg, var(--m3d-farbe-grund-verlauf), var(--grund));
	background-attachment: fixed;
	/* volle Grundfarbe unter den Verläufen: Android füllt beim schnellen Wischen noch nicht gezeichnete Flächen damit (sonst weiß) */
	background-color: var(--grund);
	color: var(--m3d-farbe-text);
	font-family: var(--m3d-schrift-text);
	-webkit-font-smoothing: antialiased;
	/* kein farbiges Aufblitzen beim Antippen (Android, iPad/iPhone); wird vererbt */
	-webkit-tap-highlight-color: transparent;
	overflow-x: hidden;
}

/* Schleier über der Animation, links dunkler für den Text */
body:where(:not([class^="m3d-"], [class*=" m3d-"], [class^="m3d-"] *, [class*=" m3d-"] *))::after {
	content: "";
	position: fixed;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background: linear-gradient(90deg, color-mix(in srgb, var(--grund) 92%, transparent) 0%, color-mix(in srgb, var(--grund) 62%, transparent) 34%, transparent 62%), radial-gradient(90% 70% at 50% 120%, color-mix(in srgb, var(--grund) 70%, transparent), transparent 60%);
}

[data-m3d-platz="kopf"]:where(:not([class^="m3d-"], [class*=" m3d-"], [class^="m3d-"] *, [class*=" m3d-"] *)) {
	display: block;
	position: sticky;
	top: 0;
	z-index: 50;
}

[data-m3d-platz="inhalt"]:where(:not([class^="m3d-"], [class*=" m3d-"], [class^="m3d-"] *, [class*=" m3d-"] *)) {
	display: block;
}

[data-m3d-platz="fuss"]:where(:not([class^="m3d-"], [class*=" m3d-"], [class^="m3d-"] *, [class*=" m3d-"] *)) {
	display: block;
}

@media (max-width: 820px) {
	body:where(:not([class^="m3d-"], [class*=" m3d-"], [class^="m3d-"] *, [class*=" m3d-"] *))::after {
		background: linear-gradient(180deg, color-mix(in srgb, var(--grund) 72%, transparent), color-mix(in srgb, var(--grund) 88%, transparent));
	}
}