:root {
	--page-bg: #ffffff;
	--surface: #ffffff;
	--surface-soft: #f4f4f5;
	/* Softfill: Struktur entsteht ueber gefuellte Flaechen, nicht ueber
	   Rahmen. Die Linienfarben liegen deshalb dicht am Untergrund. */
	--line: #f4f4f5;
	--line-strong: #e4e4e7;
	--text: #18181b;
	--muted: #71717a;
	--accent: #f4f4f5;
	--accent-strong: #27272a;
	/* Flaeche und Radius der Panels - Karten, Formulare, Infoboxen. */
	--panel: #f4f4f5;
	--panel-radius: 14px;
	/* Buttons sind die einzige dunkle Flaeche und tragen weisse Schrift. */
	--surface-deep: #18181b;
	--surface-deep-hover: #3f3f46;
	--footer-bg: #f4f4f5;
	--footer-subline-bg: #ededee;
	/* Kein Schlagschatten mehr: die Seite ist durchgehend weiss. */
	--shadow: none;
}

* {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
	/* data-theme am <html> gibt dem Wurzelelement einen eigenen Hintergrund
	   (DaisyUI). Dadurch wird der body-Hintergrund nicht mehr auf die
	   Leinwand uebertragen und oberhalb des Inhalts blieb ein Streifen.
	   Deshalb hier derselbe Ton wie beim body. */
}

/* html[data-theme] statt nur html: DaisyUI setzt seinen Hintergrund ueber
   den Attributselektor [data-theme] und wuerde ein blosses html
   ueberschreiben. */
html[data-theme] {
	background: var(--page-bg);
}

body {
	margin: 0;
	background: var(--page-bg);
	color: var(--text);
	font-family: "Jost", sans-serif;
	line-height: 1.6;
}

img {
	display: block;
	max-width: 100%;
}

a {
	color: inherit;
	text-decoration: none;
}

.site-shell {
	width: min(1200px, calc(100% - 32px));
	/* Oben buendig: ein Aussenabstand liesse hier den Seitenhintergrund
	   als schmalen Streifen ueber dem Kopfbereich durchscheinen. */
	margin: 0 auto 16px;
	background: var(--surface);
	box-shadow: var(--shadow);
	min-height: calc(100vh - 16px);
}

.site-header {
	padding-top: 28px;
	background: var(--surface);
	text-align: center;
}

.site-brand {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 118px;
	padding: 10px 18px;
}

.site-brand img {
	max-height: 96px;
	width: auto;
	object-fit: contain;
}

.brand-fallback {
	width: 118px;
	height: 118px;
	border: 1px solid var(--line-strong);
	border-radius: 999px;
	display: grid;
	place-items: center;
	padding: 16px;
	font-size: 0.95rem;
	line-height: 1.2;
	text-transform: lowercase;
	letter-spacing: 0.02em;
	color: var(--muted);
	background: rgba(255, 255, 255, 0.9);
	position: relative;
	overflow: hidden;
}

.brand-fallback::after {
	content: "";
	position: absolute;
	inset: 11px;
	border: 1px solid rgba(228, 228, 231, 0.72);
	border-radius: 999px;
	pointer-events: none;
}

.brand-fallback strong {
	display: block;
	font-family: "Cormorant Garamond", serif;
	font-size: 2rem;
	font-weight: 500;
	line-height: 0.8;
	margin-top: 0.25rem;
	color: var(--accent-strong);
}

.main-nav {
	margin-top: 22px;
	border-top: 1px solid var(--line-strong);
	border-bottom: 1px solid var(--line-strong);
	background: var(--surface);
	padding: 0 20px;
}

.nav-toggle {
	display: none;
	align-items: center;
	justify-content: center;
	margin: 14px 0 0 16px;
	padding: 9px 12px;
	border: 1px solid rgba(39, 39, 42, 0.38);
	background: rgba(255, 255, 255, 0.96);
	color: #27272a;
	cursor: pointer;
	transition: background 180ms ease, border-color 180ms ease;
}

.nav-toggle:hover {
	background: #e4e4e7;
	border-color: rgba(39, 39, 42, 0.64);
}

.nav-toggle svg {
	width: 19px;
	height: 19px;
}

.main-nav ul {
	list-style: none;
	display: flex;
	justify-content: center;
	gap: clamp(18px, 4vw, 42px);
	margin: 0;
	padding: 0;
	flex-wrap: wrap;
}

.main-nav li {
	position: relative;
}

.nav-submenu-toggle {
	display: none;
	border: 0;
	background: transparent;
	color: #27272a;
	cursor: pointer;
	padding: 0;
}

.nav-submenu-toggle svg {
	width: 18px;
	height: 18px;
	transition: transform 180ms ease;
}

.has-dropdown.is-submenu-open > .nav-submenu-toggle svg {
	transform: rotate(180deg);
}

.main-nav a {
	display: inline-block;
	padding: 14px 0;
	font-size: 0.82rem;
	font-weight: 400;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: #27272a;
	position: relative;
}

.main-nav a::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 9px;
	height: 1px;
	background: var(--accent-strong);
	transform: scaleX(0);
	transform-origin: center;
	transition: transform 180ms ease;
}

.main-nav a:hover::after,
.main-nav a[aria-current="page"]::after {
	transform: scaleX(1);
}

.nav-dropdown {
	display: none !important;
	position: absolute;
	top: calc(100% - 1px);
	left: 50%;
	transform: translateX(-50%);
	min-width: 210px;
	background: #f4f4f5;
	border: 1px solid rgba(228, 228, 231, 0.95);
	box-shadow: 0 16px 30px rgba(24, 24, 27, 0.12);
	padding: 10px 0;
	z-index: 70;
	gap: 0;
	flex-direction: column;
	align-items: stretch;
	flex-wrap: nowrap;
}

.main-nav .nav-dropdown li {
	width: 100%;
}

.main-nav .nav-dropdown a {
	display: block;
	padding: 9px 16px;
	font-size: 0.77rem;
	line-height: 1.3;
	letter-spacing: 0.1em;
	white-space: nowrap;
	text-align: center;
}

.main-nav .nav-dropdown a::after {
	display: none;
}

.main-nav li.has-dropdown:hover > .nav-dropdown,
.main-nav li.has-dropdown:focus-within > .nav-dropdown {
	display: flex !important;
}

.main-content {
	padding: 34px 0 80px;
}

.site-footer {
	margin-top: 36px;
	background: var(--footer-bg);
	color: #18181b;
}

.footer-main {
	padding: 46px 0 40px;
}

.footer-grid {
	width: min(1350px, calc(100% - 56px));
	margin: 0 auto;
	display: grid;
	grid-template-columns: minmax(260px, 1fr) minmax(320px, 1.2fr);
	gap: 80px;
}

.footer-column {
	min-width: 0;
}

.footer-column--stacked {
	display: grid;
	gap: 38px;
}

.footer-heading {
	margin: 0 0 18px;
	font-size: 1rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.02em;
	color: #fff;
}

.footer-copy {
	max-width: 420px;
	font-size: 0.98rem;
	line-height: 1.45;
	color: rgba(255, 255, 255, 0.98);
}

.footer-copy p {
	margin: 0;
}

.footer-copy p + p {
	margin-top: 0.5rem;
}

.footer-copy--spaced {
	margin-top: 22px;
}

.footer-copy a {
	color: inherit;
}

.footer-social {
	display: flex;
	gap: 12px;
	align-items: center;
	margin-top: 8px;
}

.social-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	border-radius: 999px;
	color: rgba(255, 255, 255, 0.95);
	transition: transform 180ms ease, background-color 180ms ease, color 180ms ease;
}

.social-link:hover {
	transform: translateY(-1px);
	background: rgba(255, 255, 255, 0.12);
	color: #ffffff;
}

.social-link svg {
	width: 34px;
	height: 34px;
}

.footer-subline {
	padding: 18px 28px 8px;
	background: var(--footer-subline-bg);
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 20px;
	color: rgba(255, 255, 255, 0.92);
	font-size: 0.92rem;
	text-transform: uppercase;
	line-height: 1.3;
}

.footer-subline p {
	margin: 0;
}

.footer-legal-links {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: center;
}

.footer-legal-links a {
	color: inherit;
	position: relative;
	padding-right: 10px;
}

.footer-legal-links a:not(:last-child)::after {
	content: "|";
	position: absolute;
	right: -2px;
	top: 0;
	color: rgba(255, 255, 255, 0.5);
}

.cookie-settings-link {
	border: 0;
	padding: 0;
	background: transparent;
	font: inherit;
	font-size: inherit;
	line-height: inherit;
	color: inherit;
	cursor: pointer;
	text-transform: inherit;
	letter-spacing: inherit;
	opacity: 0.95;
}

.cookie-settings-link:hover {
	opacity: 1;
	text-decoration: underline;
	text-underline-offset: 0.14em;
}

.cookie-banner-open {
	overflow: hidden;
}

.cookie-consent-modal {
	position: fixed;
	inset: 0;
	z-index: 210;
	display: none;
	align-items: flex-end;
	justify-content: center;
	padding: 20px;
	background: rgba(39, 39, 42, 0.44);
	backdrop-filter: blur(2px);
}

.cookie-consent-modal.is-open {
	display: flex;
}

.cookie-consent-card {
	position: relative;
	width: min(900px, 100%);
	border: 1px solid rgba(228, 228, 231, 0.98);
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(244, 244, 245, 0.98));
	box-shadow: 0 24px 50px rgba(24, 24, 27, 0.22);
	padding: 24px;
	animation: rise-in 220ms ease both;
}

.cookie-consent-close {
	position: absolute;
	top: 10px;
	right: 10px;
	border: 0;
	background: transparent;
	color: #71717a;
	font-size: 1.6rem;
	line-height: 1;
	cursor: pointer;
}

.cookie-consent-eyebrow {
	margin: 0;
	font-size: 0.76rem;
	text-transform: uppercase;
	letter-spacing: 0.16em;
	color: #71717a;
}

.cookie-consent-title {
	margin: 8px 0 0;
	font-size: clamp(1.5rem, 2.3vw, 2rem);
	line-height: 1.05;
	font-weight: 500;
	color: #3f3f46;
	font-family: "Cormorant Garamond", serif;
}

.cookie-consent-copy {
	margin: 10px 0 0;
	font-size: 0.97rem;
	line-height: 1.6;
	color: #52525b;
}

.cookie-consent-groups {
	margin-top: 14px;
	display: grid;
	gap: 10px;
}

.cookie-consent-group {
	display: flex;
	justify-content: space-between;
	gap: 14px;
	align-items: center;
	padding: 12px;
	border: 0;
	border-radius: 10px;
	background: var(--panel);
}

.cookie-consent-group h3,
.cookie-consent-group strong {
	display: block;
	margin: 0;
	font-size: 0.88rem;
	text-transform: uppercase;
	letter-spacing: 0.09em;
	font-weight: 600;
	color: #3f3f46;
}

.cookie-consent-group p,
.cookie-consent-group small {
	display: block;
	margin: 5px 0 0;
	font-size: 0.9rem;
	line-height: 1.45;
	color: #52525b;
	font-weight: 400;
}

.cookie-consent-group input[type="checkbox"] {
	width: 18px;
	height: 18px;
	margin: 0;
	accent-color: #27272a;
	flex-shrink: 0;
}

.cookie-consent-group.is-required {
	background: #ededee;
	border-color: transparent;
}

.cookie-consent-badge {
	padding: 5px 9px;
	border-radius: 999px;
	font-size: 0.7rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.09em;
	background: rgba(39, 39, 42, 0.12);
	color: #3f3f46;
	white-space: nowrap;
}

.cookie-consent-actions {
	margin-top: 14px;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	justify-content: flex-end;
}

.cookie-btn {
	border: 1px solid transparent;
	border-radius: 10px;
	padding: 9px 14px;
	font-family: "Jost", sans-serif;
	font-size: 0.76rem;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	cursor: pointer;
	transition: opacity 180ms ease, background 180ms ease, border-color 180ms ease;
}

.cookie-btn:hover {
	opacity: 0.9;
}

.cookie-btn-primary {
	background: #3f3f46;
	color: #fff;
}

.cookie-btn-light {
	background: #fff;
	color: #3f3f46;
	border-color: rgba(161, 161, 170, 0.8);
}

.cookie-btn-muted {
	background: #e4e4e7;
	color: var(--text);
	border-color: transparent;
}

.page-section {
	width: min(900px, calc(100% - 32px));
	margin: 0 auto;
	padding-top: 32px;
	padding-bottom: 32px;
}

.separator-section {
	padding-top: 10px;
	padding-bottom: 10px;
}

.section-separator {
	display: block;
	width: min(180px, calc(100% - 64px));
	height: 1px;
	margin: 0 auto;
	background: linear-gradient(90deg, transparent, rgba(228, 228, 231, 0.95), transparent);
}

.hero-section {
	padding-top: 6px;
	text-align: center;
}

.hero-media {
	margin: 0 auto;
	width: min(640px, 100%);
	background: var(--surface-soft);
	padding: 0;
	box-shadow: 0 18px 40px rgba(24, 24, 27, 0.10);
	animation: rise-in 420ms ease both;
}

.hero-media img,
.legacy-hero img {
	width: 100%;
	height: auto;
	object-fit: cover;
}

.hero-caption {
	margin-top: 14px;
	font-size: 0.78rem;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: var(--muted);
}

.hero-copy {
	margin: 46px auto 0;
	max-width: 760px;
	animation: rise-in 540ms ease both;
}

.hero-script {
	margin: 0 auto 20px;
	max-width: 780px;
	color: #27272a;
	font-size: clamp(2.3rem, 5vw, 4.6rem);
	line-height: 0.95;
	text-align: center;
	letter-spacing: 0.01em;
}

.hero-script--handwritten {
	font-family: "Allura", cursive;
	font-size: clamp(2.3rem, 5vw, 4.6rem);
	line-height: 0.95;
}

.hero-script--elegant-serif {
	font-family: "Cormorant Garamond", serif;
	font-size: clamp(2.2rem, 4.6vw, 4.2rem);
	line-height: 1.02;
	font-weight: 500;
	letter-spacing: 0.015em;
}

.hero-script--modern-sans {
	font-family: "Jost", sans-serif;
	font-size: clamp(1.9rem, 3.8vw, 3.4rem);
	line-height: 1.08;
	font-weight: 300;
	letter-spacing: 0.02em;
	text-transform: uppercase;
}

.hero-script p {
	margin: 0;
}

.hero-script p + p {
	margin-top: 0.1em;
}

.hero-title,
.legacy-title {
	margin: 0;
	font-size: clamp(2rem, 4vw, 3.1rem);
	font-weight: 300;
	letter-spacing: 0.01em;
	text-transform: uppercase;
	line-height: 1.08;
	color: #18181b;
}

.hero-subtitle,
.legacy-subtitle {
	margin: 0.2em 0 0;
	font-size: clamp(2rem, 3.8vw, 3rem);
	font-weight: 600;
	text-transform: uppercase;
	line-height: 1.02;
	color: #27272a;
}

.hero-intro,
.section-body,
.legacy-body {
	margin: 22px auto 0;
	max-width: 720px;
	font-size: 1.05rem;
	color: #52525b;
}

.hero-intro p,
.section-body p,
.legacy-body p {
	margin: 0 0 1rem;
}

.hero-intro a,
.section-body a,
.legacy-body a,
.about-copy a {
	color: #52525b;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.14em;
	font-weight: 500;
}

.hero-intro a:hover,
.section-body a:hover,
.legacy-body a:hover,
.about-copy a:hover {
	color: #3f3f46;
}

.section-eyebrow {
	margin: 0 0 8px;
	font-size: 0.8rem;
	text-transform: uppercase;
	letter-spacing: 0.16em;
	color: var(--muted);
}

.section-heading {
	margin: 0;
	font-size: clamp(1.8rem, 3vw, 2.6rem);
	font-weight: 400;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	line-height: 1.08;
}

.split-section {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 28px;
	align-items: center;
	background: linear-gradient(180deg, rgba(244, 244, 245, 0.84), rgba(255, 255, 255, 0.98));
	padding: 28px;
	border: 1px solid rgba(228, 228, 231, 0.9);
	box-shadow: 0 12px 26px rgba(24, 24, 27, 0.06);
}

.split-section.is-right .split-media {
	order: 2;
}

.split-section.is-right .split-copy {
	order: 1;
}

.split-media img {
	width: 100%;
	min-height: 300px;
	object-fit: cover;
}

.quote-section {
	text-align: center;
	padding: 24px 18px;
}

.quote-mark {
	font-family: "Cormorant Garamond", serif;
	font-size: 4rem;
	line-height: 0.7;
	color: var(--accent-strong);
	margin-bottom: 12px;
}

.quote-text {
	margin: 0;
	font-family: "Cormorant Garamond", serif;
	font-size: clamp(2rem, 4vw, 3rem);
	line-height: 1.04;
	color: #27272a;
}

.quote-attribution {
	margin-top: 16px;
	font-size: 0.82rem;
	text-transform: uppercase;
	letter-spacing: 0.16em;
	color: var(--muted);
}

.photo-strip-heading {
	margin: 0 0 24px;
	text-align: center;
	font-size: clamp(1.5rem, 2.5vw, 2.2rem);
	font-weight: 400;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

.photo-strip-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: 18px;
}

.slideshow-section {
	padding-top: 8px;
	padding-bottom: 18px;
}

.slideshow-heading {
	margin: 0 0 18px;
	text-align: center;
	font-size: clamp(1.2rem, 2vw, 1.6rem);
	font-weight: 400;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: var(--muted);
}

.slideshow-frame {
	position: relative;
	overflow: hidden;
	background: var(--surface-soft);
	box-shadow: 0 18px 40px rgba(24, 24, 27, 0.10);
	min-height: 300px;
}

.slideshow-slide {
	display: none;
	margin: 0;
	animation: rise-in 240ms ease both;
}

.slideshow-slide.is-active {
	display: block;
}

.slideshow-slide img {
	width: 100%;
	aspect-ratio: 16 / 10;
	object-fit: cover;
}

.slideshow-arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 54px;
	height: 54px;
	border: 0;
	background: rgba(255, 255, 255, 0.58);
	color: rgba(24, 24, 27, 0.78);
	cursor: pointer;
	font-size: 3rem;
	line-height: 1;
	display: grid;
	place-items: center;
	transition: background 180ms ease, color 180ms ease, transform 180ms ease;
	backdrop-filter: blur(6px);
}

.slideshow-arrow:hover {
	background: rgba(255, 255, 255, 0.82);
	color: #18181b;
	transform: translateY(-50%) scale(1.04);
}

.slideshow-arrow-prev {
	left: 14px;
}

.slideshow-arrow-next {
	right: 14px;
}

.slideshow-dots {
	display: flex;
	justify-content: center;
	gap: 10px;
	margin-top: 18px;
}

.slideshow-dot {
	width: 10px;
	height: 10px;
	border-radius: 999px;
	border: 0;
	padding: 0;
	background: rgba(113, 113, 122, 0.3);
	cursor: pointer;
	transition: transform 180ms ease, background 180ms ease;
}

.slideshow-dot.is-active,
.slideshow-dot:hover {
	background: var(--accent-strong);
	transform: scale(1.15);
}

.photo-strip-grid img {
	width: 100%;
	aspect-ratio: 4 / 5;
	object-fit: cover;
	box-shadow: 0 12px 24px rgba(24, 24, 27, 0.08);
}

.legal-page {
	max-width: 920px;
	background: #f8fafc;
	padding: 54px clamp(24px, 5vw, 56px);
	box-shadow: 0 18px 45px rgba(24, 24, 27, 0.10);
}

.legal-page__eyebrow {
	margin: 0 0 14px;
	font-size: 0.8rem;
	text-transform: uppercase;
	letter-spacing: 0.16em;
	color: var(--muted);
}

.legal-page__title {
	margin: 0;
	font-family: "Cormorant Garamond", serif;
	font-size: clamp(2.6rem, 5vw, 4.4rem);
	line-height: 0.95;
	font-weight: 500;
	color: #27272a;
}

.legal-page__body {
	margin-top: 28px;
	font-size: 1rem;
	line-height: 1.8;
	color: #3f3f46;
}

.legal-page__body h2,
.legal-page__body h3,
.legal-page__body h4 {
	font-family: "Jost", sans-serif;
	font-weight: 500;
	line-height: 1.2;
	margin: 2rem 0 0.8rem;
	color: #27272a;
}

.legal-page__body p,
.legal-page__body ul,
.legal-page__body ol {
	margin: 0 0 1rem;
}

.legal-page__body a {
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.14em;
}

.about-intro-section {
	padding-top: 8px;
	padding-bottom: 28px;
}

.about-intro-header {
	margin-bottom: 14px;
}

.about-greeting,
.about-title {
	margin: 0;
	font-size: clamp(2.35rem, 4.2vw, 3.9rem);
	font-weight: 400;
	line-height: 1.02;
	letter-spacing: 0.01em;
	color: #27272a;
}

.about-greeting {
	font-family: "Allura", cursive !important;
	font-size: clamp(2.6rem, 4.6vw, 4.3rem);
	line-height: 1.04;
}

.about-intro-grid {
	display: grid;
	grid-template-columns: minmax(0, 1.5fr) minmax(260px, 0.85fr);
	gap: 34px;
	align-items: start;
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	padding: 0 !important;
}

.about-intro-grid.is-text-only {
	grid-template-columns: 1fr;
}

.about-portrait-frame {
	margin: 0;
	max-width: 360px;
	justify-self: end;
	background: transparent;
	box-shadow: none;
	overflow: visible;
}

.about-portrait-frame img {
	width: 100%;
	aspect-ratio: 3 / 4;
	object-fit: cover;
}

.about-copy-card {
	padding-top: 4px;
}

.about-copy {
	font-family: "Jost", sans-serif;
	font-weight: 400;
	font-size: 1.06rem;
	line-height: 1.6;
	color: oklch(0.278078 0.029596 256.848 / 0.85);
}

.about-copy p {
	font-family: "Jost", sans-serif;
	font-size: 16px;
	line-height: 24px;
	font-weight: 400;
	margin: 0 0 1.15rem;
}

.about-copy p:last-child {
	margin-bottom: 0;
}

.about-copy a {
	color: #27272a;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.14em;
}

.about-copy a:hover {
	color: #71717a;
}

.about-follow-section {
	padding-bottom: 18px;
}

.anfahrt-page {
	padding-top: 8px;
	padding-bottom: 22px;
}

.anfahrt-header {
	text-align: center;
	margin-bottom: 10px;
}

.anfahrt-title {
	margin: 0;
	font-family: "Cormorant Garamond", serif;
	font-size: clamp(2.4rem, 4.6vw, 4rem);
	line-height: 0.95;
	font-weight: 500;
	color: #27272a;
}

.anfahrt-separator {
	margin-top: 16px;
	margin-bottom: 20px;
}

.anfahrt-note {
	max-width: 940px;
	margin: 0 auto 18px;
	text-align: center;
	font-size: 1rem;
	color: #52525b;
	line-height: 1.7;
}

.anfahrt-note p {
	margin: 0;
}

.anfahrt-note p + p {
	margin-top: 0.9rem;
}

.anfahrt-map-wrap {
	width: 100%;
	margin-top: 10px;
	border: 1px solid rgba(228, 228, 231, 0.85);
	box-shadow: 0 14px 28px rgba(24, 24, 27, 0.10);
	overflow: hidden;
	background: #f6f8fa;
}

.anfahrt-map {
	display: block;
	width: 100%;
	border: 0;
}

.kontakt-page {
	padding-top: 8px;
	padding-bottom: 22px;
}

.kontakt-intro {
	margin-bottom: 30px;
}

.kontakt-title {
	margin: 0 0 18px;
	text-align: center;
	font-family: "Cormorant Garamond", serif;
	font-size: clamp(2.3rem, 4.4vw, 3.8rem);
	line-height: 0.96;
	font-weight: 500;
	color: #27272a;
}

.kontakt-intro-grid {
	display: grid;
	grid-template-columns: minmax(290px, 1fr) minmax(0, 1fr);
	gap: 26px;
	align-items: start;
}

.kontakt-intro-grid.is-text-only {
	grid-template-columns: 1fr;
}

.kontakt-intro-image {
	margin: 0;
	border: 1px solid rgba(228, 228, 231, 0.85);
	box-shadow: 0 12px 28px rgba(24, 24, 27, 0.10);
	overflow: hidden;
}

.kontakt-intro-image img {
	width: 100%;
	height: auto;
	object-fit: cover;
}

.kontakt-intro-copy {
	font-size: 1.01rem;
	line-height: 1.72;
	color: #52525b;
}

.kontakt-intro-copy p {
	margin: 0;
}

.kontakt-intro-copy p + p {
	margin-top: 1rem;
}

.kontakt-extra-body {
	margin-top: 0.8rem;
}

.kontakt-form-section {
	margin-top: 10px;
	padding-top: 24px;
	border-top: 1px solid rgba(212, 212, 216, 0.50);
}

.kontakt-form-title {
	margin: 0 0 16px;
	font-size: 0.9rem;
	text-align: center;
	text-transform: uppercase;
	letter-spacing: 0.18em;
	font-weight: 600;
	color: #71717a;
}

.kontakt-form {
	max-width: 980px;
	margin: 0 auto;
	display: grid;
	gap: 14px;
}

.kontakt-row {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px;
}

.kontakt-field {
	display: grid;
	gap: 6px;
}

.kontakt-field label {
	font-size: 0.82rem;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: #71717a;
	font-weight: 500;
}

.kontakt-field input,
.kontakt-field select,
.kontakt-field textarea {
	width: 100%;
	border: 1px solid rgba(212, 212, 216, 0.65);
	padding: 11px 12px;
	font-family: "Jost", sans-serif;
	font-size: 0.98rem;
	background: #fff;
	color: #18181b;
}

.kontakt-field textarea {
	min-height: 160px;
	resize: vertical;
}

.kontakt-consent {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	margin-top: 4px;
	font-size: 0.92rem;
	line-height: 1.45;
	color: #52525b;
}

.kontakt-consent input[type="checkbox"] {
	margin-top: 2px;
}

.kontakt-error {
	margin: 0;
	color: #8b2f2f;
	font-size: 0.9rem;
}

.kontakt-submit {
	justify-self: start;
	border: 0;
	background: #18181b;
	color: #fff;
	padding: 10px 24px;
	font-family: "Jost", sans-serif;
	font-size: 0.82rem;
	text-transform: uppercase;
	letter-spacing: 0.16em;
	cursor: pointer;
	transition: opacity 180ms ease;
}

.kontakt-submit:hover {
	opacity: 0.88;
}

.prices-page {
	padding-top: 10px;
	padding-bottom: 24px;
}

.prices-header {
	text-align: center;
	margin-bottom: 34px;
}

.prices-title {
	margin: 0;
	font-family: "Cormorant Garamond", serif;
	font-size: clamp(2.6rem, 5vw, 4.4rem);
	line-height: 0.95;
	font-weight: 500;
	color: #27272a;
}

.prices-note {
	margin: 0.8rem auto 0;
	font-size: 1rem;
	color: #71717a;
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

.prices-group + .prices-group {
	margin-top: 34px;
	padding-top: 30px;
	border-top: 1px solid rgba(212, 212, 216, 0.55);
}

.prices-group-title {
	margin: 0 0 16px;
	font-size: 0.86rem;
	text-transform: uppercase;
	letter-spacing: 0.18em;
	font-weight: 500;
	color: #71717a;
	text-align: center;
}

.prices-grid {
	display: grid;
	gap: 20px;
}

.prices-grid.two-col {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.prices-grid.one-col {
	grid-template-columns: 1fr;
}

.price-card {
	background: linear-gradient(180deg, rgba(244, 244, 245, 0.9), rgba(255, 255, 255, 0.98));
	border: 1px solid rgba(228, 228, 231, 0.95);
	box-shadow: 0 10px 24px rgba(24, 24, 27, 0.06);
	padding: 22px;
	color: #52525b;
}

.price-card h3 {
	margin: 0;
	font-size: 1.25rem;
	font-weight: 500;
	letter-spacing: 0.01em;
	color: #3f3f46;
}

.price-card ul {
	margin: 14px 0 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: 0.5rem;
}

.price-card li {
	position: relative;
	padding-left: 18px;
	font-size: 0.98rem;
	line-height: 1.5;
}

.price-card li::before {
	content: "•";
	position: absolute;
	left: 0;
	top: 0;
	color: var(--accent-strong);
	font-size: 1.05rem;
	line-height: 1.3;
}

.price-amount {
	margin: 15px 0 0;
	font-size: 1.18rem;
	font-weight: 600;
	letter-spacing: 0.01em;
	color: #27272a;
}

.price-link {
	display: inline-block;
	margin-top: 8px;
	font-size: 0.82rem;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: #52525b;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.14em;
	font-weight: 500;
}

.price-link:hover {
	color: #3f3f46;
}

.price-info-box {
	margin-top: 18px;
	padding: 24px 26px;
	background: linear-gradient(180deg, rgba(212, 212, 216, 0.48), rgba(255, 255, 255, 0.98));
	border: 1px solid rgba(161, 161, 170, 0.48);
	border-left: 6px solid #27272a;
	box-shadow: 0 14px 28px rgba(24, 24, 27, 0.12);
	color: #52525b;
	line-height: 1.7;
}

.price-info-box h3 {
	margin: 0;
	font-size: 0.9rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.18em;
	color: #52525b;
}

.price-info-box p {
	margin: 1rem 0 0;
	font-size: 0.99rem;
}

.price-info-body p {
	margin: 1rem 0 0;
	font-size: 0.99rem;
}

.price-info-body p:first-child {
	margin-top: 0.9rem;
}

.price-info-body a {
	color: #52525b;
	text-decoration: underline;
	text-underline-offset: 0.14em;
}

.packages-list {
	margin-top: 18px;
	gap: 0;
	border-top: 1px solid rgba(212, 212, 216, 0.45);
	border-bottom: 1px solid rgba(212, 212, 216, 0.45);
	padding: 0;
	list-style: none;
}

.packages-list li {
	padding: 12px 0;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	border-top: 1px solid rgba(212, 212, 216, 0.30);
	font-size: 1rem;
}

.packages-list li:first-child {
	border-top: 0;
}

.packages-list li::before {
	display: none;
}

.packages-list strong {
	font-weight: 600;
	color: #3f3f46;
}

.heart-projects-page,
.kindergarten-page,
.party-page,
.booking-page {
	padding-top: 8px;
	padding-bottom: 24px;
}

.heart-header,
.kindergarten-header,
.party-header,
.booking-header {
	text-align: center;
	margin-bottom: 18px;
}

.heart-title,
.kindergarten-title,
.party-title,
.booking-title {
	margin: 0;
	font-family: "Cormorant Garamond", serif;
	font-size: clamp(2.4rem, 4.8vw, 4rem);
	line-height: 0.95;
	font-weight: 500;
	color: #27272a;
}

.heart-subtitle,
.kindergarten-subtitle,
.party-subtitle {
	margin: 0.75rem 0 0;
	font-size: 0.9rem;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	color: #71717a;
}

.heart-intro,
.kindergarten-copy,
.party-intro,
.booking-intro {
	max-width: 980px;
	margin: 0 auto 20px;
	font-size: 1rem;
	line-height: 1.75;
	color: #52525b;
}

.heart-stories-grid,
.party-grid,
.booking-actions-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 18px;
}

.heart-story-card,
.party-card,
.booking-action-card {
	background: linear-gradient(180deg, rgba(244, 244, 245, 0.9), rgba(255, 255, 255, 0.98));
	border: 1px solid rgba(228, 228, 231, 0.95);
	box-shadow: 0 10px 24px rgba(24, 24, 27, 0.06);
	padding: 22px;
	color: #52525b;
}

.heart-story-card h2,
.party-card h2,
.booking-action-content h2 {
	margin: 0;
	font-size: 1.2rem;
	font-weight: 500;
	color: #3f3f46;
}

.heart-story-date,
.party-card-subtitle {
	margin: 10px 0 0;
	font-size: 0.82rem;
	text-transform: uppercase;
	letter-spacing: 0.11em;
	color: #71717a;
}

.heart-story-card p,
.party-card p,
.booking-action-content p {
	margin: 0.85rem 0 0;
	line-height: 1.6;
}

.heart-story-link,
.booking-link {
	display: inline-block;
	margin-top: 1rem;
	font-size: 0.82rem;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: #52525b;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.14em;
	font-weight: 500;
}

.heart-story-link:hover,
.booking-link:hover {
	color: #3f3f46;
}

.party-price {
	font-size: 1.05rem;
	font-weight: 600;
	color: #18181b;
}

.kindergarten-prices {
	margin-top: 20px;
	border: 1px solid rgba(228, 228, 231, 0.9);
	box-shadow: 0 14px 28px rgba(24, 24, 27, 0.10);
	background: #f4f6f8;
	padding: 16px;
}

.kindergarten-prices h2 {
	margin: 0 0 12px;
	font-size: 0.9rem;
	text-transform: uppercase;
	letter-spacing: 0.16em;
	color: #71717a;
	text-align: center;
}

.kindergarten-prices img {
	width: 100%;
	height: auto;
	display: block;
}

.booking-action-card {
	padding: 0;
	overflow: hidden;
	display: grid;
	grid-template-rows: auto 1fr;
}

.booking-action-card img {
	width: 100%;
	aspect-ratio: 16 / 10;
	object-fit: cover;
	display: block;
}

.booking-action-content {
	padding: 18px 20px 20px;
}

.empty-state {
	border: 1px dashed var(--line-strong);
	padding: 28px;
	text-align: center;
	color: var(--muted);
	background: rgba(244, 244, 245, 0.78);
}

.gallery-page {
	padding-top: 8px;
	padding-bottom: 22px;
}

.gallery-header {
	text-align: center;
	margin-bottom: 18px;
}

.gallery-title {
	margin: 0;
	font-family: "Cormorant Garamond", serif;
	font-size: clamp(2.4rem, 4.8vw, 4rem);
	line-height: 0.95;
	font-weight: 500;
	color: #27272a;
}

.gallery-layout {
	display: grid;
	grid-template-columns: minmax(210px, 270px) minmax(0, 1fr);
	gap: 18px;
	align-items: start;
}

.gallery-side-menu {
	background: #f4f4f5;
	border: 1px solid rgba(212, 212, 216, 0.70);
	padding: 6px 0;
}

.gallery-side-menu ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 0;
}

.gallery-side-menu a {
	display: block;
	padding: 10px 16px;
	text-transform: uppercase;
	font-size: 0.79rem;
	letter-spacing: 0.11em;
	color: #52525b;
	border-left: 2px solid transparent;
	transition: background 180ms ease, color 180ms ease, border-color 180ms ease;
}

.gallery-side-menu a:hover,
.gallery-side-menu a.is-active {
	background: rgba(212, 212, 216, 0.20);
	border-color: #71717a;
	color: #3f3f46;
}

.gallery-main {
	min-width: 0;
}

.gallery-copy {
	margin-bottom: 14px;
	font-size: 0.98rem;
	line-height: 1.65;
	color: #52525b;
}

.gallery-slideshow {
	position: relative;
	background: #f4f6f8;
	border: 1px solid rgba(228, 228, 231, 0.9);
	box-shadow: 0 16px 30px rgba(24, 24, 27, 0.10);
	overflow: hidden;
	min-height: 340px;
}

.gallery-slide {
	display: none;
	margin: 0;
}

.gallery-slide.is-active {
	display: block;
	animation: rise-in 220ms ease both;
}

.gallery-slide img {
	width: 100%;
	aspect-ratio: 16 / 10;
	object-fit: cover;
	display: block;
}

.gallery-arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 48px;
	height: 48px;
	border: 0;
	background: rgba(255, 255, 255, 0.62);
	color: rgba(24, 24, 27, 0.8);
	cursor: pointer;
	font-size: 2.5rem;
	line-height: 1;
	display: grid;
	place-items: center;
	transition: background 180ms ease, color 180ms ease;
}

.gallery-arrow:hover {
	background: rgba(255, 255, 255, 0.84);
	color: #18181b;
}

.gallery-arrow-prev {
	left: 10px;
}

.gallery-arrow-next {
	right: 10px;
}

@keyframes rise-in {
	from {
		opacity: 0;
		transform: translateY(12px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@media (max-width: 760px) {
	.site-shell {
		width: calc(100% - 18px);
		margin: 0 auto 9px;
		min-height: calc(100vh - 9px);
	}

	.site-header {
		padding-top: 18px;
	}

	.nav-toggle {
		display: flex;
	}

	.main-nav {
		display: none;
		margin-top: 12px;
		padding: 6px 12px;
	}

	.main-nav.is-open {
		display: block;
	}

	.main-nav ul {
		flex-direction: column;
		align-items: stretch;
		gap: 0;
	}

	.main-nav li.has-dropdown {
		display: grid;
		grid-template-columns: minmax(0, 1fr) auto;
		align-items: center;
	}

	.main-nav li.has-dropdown > a {
		grid-column: 1;
	}

	.main-nav li.has-dropdown > .nav-submenu-toggle {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		grid-column: 2;
		padding: 12px 4px;
	}

	.main-nav a {
		display: block;
		padding: 12px 4px;
		text-align: left;
	}

	.main-nav a::after {
		left: 4px;
		right: auto;
		width: 34px;
	}

	.main-content {
		padding-top: 18px;
	}

	.cookie-consent-modal {
		padding: 12px;
		align-items: flex-end;
	}

	.cookie-consent-card {
		padding: 18px 16px;
	}

	.cookie-consent-group {
		align-items: flex-start;
	}

	.cookie-consent-actions {
		justify-content: stretch;
	}

	.cookie-btn {
		flex: 1 1 100%;
	}

	.page-section {
		width: min(100%, calc(100% - 22px));
		padding-top: 20px;
		padding-bottom: 20px;
	}

	.footer-main {
		padding: 34px 0 28px;
	}

	.footer-grid {
		width: min(100%, calc(100% - 28px));
		grid-template-columns: 1fr;
		gap: 34px;
	}

	.footer-column--stacked {
		gap: 28px;
	}

	.footer-subline {
		padding: 16px 14px 10px;
		flex-direction: column;
		align-items: flex-start;
	}

	.legal-page {
		padding: 34px 20px;
	}

	.about-intro-grid {
		grid-template-columns: 1fr;
		gap: 22px;
	}

	.about-portrait-frame {
		justify-self: stretch;
		max-width: 100%;
	}

	.about-greeting,
	.about-title {
		font-size: clamp(2.2rem, 9vw, 3.4rem);
	}

	.prices-grid.two-col {
		grid-template-columns: 1fr;
	}

	.heart-stories-grid,
	.party-grid,
	.booking-actions-grid {
		grid-template-columns: 1fr;
	}

	.main-nav .nav-dropdown {
		position: static;
		transform: none;
		box-shadow: none;
		border-left: 0;
		border-right: 0;
		border-bottom: 0;
		margin-top: 2px;
		width: 100%;
		display: none !important;
		padding: 0 0 6px;
		background: transparent;
		grid-column: 1 / -1;
	}

	.main-nav .has-dropdown.is-submenu-open > .nav-dropdown {
		display: flex !important;
	}

	.main-nav .nav-dropdown a {
		text-align: left;
		padding: 8px 12px;
		font-size: 0.73rem;
		color: #71717a;
	}

	.gallery-layout {
		grid-template-columns: 1fr;
		gap: 12px;
	}

	.gallery-slideshow {
		min-height: 220px;
	}

	.gallery-arrow {
		width: 42px;
		height: 42px;
		font-size: 2.1rem;
	}

	.anfahrt-note {
		text-align: left;
	}

	.kontakt-intro-grid,
	.kontakt-row {
		grid-template-columns: 1fr;
	}

	.kontakt-submit {
		justify-self: stretch;
	}

	.price-card {
		padding: 18px;
	}

	.price-info-box {
		padding: 16px 16px;
	}

	.separator-section {
		padding-top: 6px;
		padding-bottom: 6px;
	}

	.hero-copy {
		margin-top: 30px;
	}

	.hero-script {
		line-height: 1;
	}

	.hero-script--handwritten {
		font-size: clamp(2rem, 9vw, 3.6rem);
	}

	.hero-script--elegant-serif {
		font-size: clamp(1.9rem, 8vw, 3.2rem);
	}

	.hero-script--modern-sans {
		font-size: clamp(1.4rem, 5.8vw, 2.4rem);
	}

	.split-section {
		grid-template-columns: 1fr;
		padding: 18px;
	}

	.split-section.is-right .split-media,
	.split-section.is-right .split-copy {
		order: initial;
	}

	.photo-strip-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.slideshow-arrow {
		width: 44px;
		height: 44px;
		font-size: 2.5rem;
	}
}
/* ---------------------------------------------------------------- *
 * Pfeil zum Seitenanfang
 * Rechts unten, erscheint nach etwas Scrollen. Sitzt oberhalb des
 * Cookie-Banners, damit sich beide nicht ueberlagern.
 * ---------------------------------------------------------------- */
.scroll-top {
	position: fixed;
	right: 20px;
	bottom: 24px;
	z-index: 40;
	width: 46px;
	height: 46px;
	display: grid;
	place-items: center;
	border: 1px solid var(--line-strong);
	border-radius: 999px;
	background: var(--surface);
	color: var(--text);
	box-shadow: 0 6px 18px rgba(24, 24, 27, 0.14);
	cursor: pointer;
	opacity: 0;
	transform: translateY(8px);
	transition: opacity 200ms ease, transform 200ms ease,
	            background 160ms ease, color 160ms ease, border-color 160ms ease;
}

.scroll-top.is-visible {
	opacity: 1;
	transform: translateY(0);
}

.scroll-top svg {
	width: 21px;
	height: 21px;
}

.scroll-top:hover {
	background: var(--surface-deep);
	border-color: var(--surface-deep);
	color: #fff;
}

.scroll-top:focus-visible {
	outline: 2px solid var(--text);
	outline-offset: 3px;
}

@media (max-width: 760px) {
	.scroll-top {
		right: 14px;
		bottom: 16px;
		width: 42px;
		height: 42px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.scroll-top {
		transition: opacity 120ms ease;
		transform: none;
	}
	.scroll-top.is-visible {
		transform: none;
	}
}

/* === Softfill: Flaechen statt Rahmen =====================================
   Karten, Formulare und Infoboxen sind weich gefuellte graue Panels auf
   weissem Grund. Sie tragen keine Rahmenlinie und keinen Schatten - die
   Gliederung entsteht allein ueber die Flaeche. Die Klasse ersetzt in den
   Templates die bisherige Kombination aus border-base-300 und bg-base-100. */
.panel-soft {
	background: var(--panel);
	border: 0;
	border-radius: var(--panel-radius);
	box-shadow: none;
}

/* Buttons sind der einzige dunkle Akzent: gefuellte Flaeche, weisse Schrift,
   leicht gerundet. Rahmen setzen die Templates dort, wo sie gewollt sind. */
.btn {
	border-radius: 10px;
}

.btn-circle {
	border-radius: 999px;
}

/* === Karte erst auf Klick ================================================
   Platzhalter auf der Anfahrtsseite. Die Karte selbst wird von
   static/js/map-consent.js nachgeladen, damit vor der Einwilligung keine
   Verbindung zum Kartenanbieter entsteht. */
.map-consent {
	display: grid;
	place-items: center;
	padding: 28px 20px;
	background: var(--panel);
	text-align: center;
}

.map-consent-inner {
	max-width: 46ch;
	display: grid;
	gap: 12px;
	justify-items: center;
}

.map-consent-title {
	margin: 0;
	font-family: "Cormorant Garamond", serif;
	font-size: 1.5rem;
	font-weight: 500;
	color: var(--text);
}

.map-consent-text {
	margin: 0;
	font-size: 0.9rem;
	line-height: 1.5;
	color: var(--muted);
}

/* Zwei Klassen, weil DaisyUIs .btn in tailwind.css steht und damit nach
   dieser Datei geladen wird - bei gleicher Spezifitaet gewaenne sonst DaisyUI. */
.map-consent .map-consent-button {
	background: var(--surface-deep);
	color: #fff;
	border: 0;
}

.map-consent .map-consent-button:hover {
	background: var(--surface-deep-hover);
	color: #fff;
}

/* === Frueher style-Attribute im Markup ==================================
   Ausgelagert, damit die CSP ohne style-src 'unsafe-inline' auskommt. */
.herz-kachel {
	height: 220px;
}

.blog-banner {
	max-width: 900px;
}

.blog-slider {
	will-change: transform;
}

/* === Fliesstext aus dem CMS =============================================
   Die Klasse .prose kommt von Tailwinds Typography-Plugin, das hier bewusst
   nicht installiert ist (mit dem Play-CDN war sie ebenfalls wirkungslos).
   Tailwinds Preflight setzt Absatzabstaende aber auf null - lange Texte aus
   dem Rich-Text-Feld liefen dadurch ohne Luft ineinander. Besonders bei
   Impressum und Datenschutz faellt das ins Gewicht: Art. 12 DSGVO verlangt
   eine leicht zugaengliche Form.

   Bewusst sparsam: nur Abstaende und Listeneinzug, keine Schriftgroessen
   oder Farben - die kommen weiterhin aus dem Seitendesign. */
.prose > p,
.prose > ul,
.prose > ol {
	margin-block: 0 0.9em;
}

.prose > p:last-child,
.prose > ul:last-child,
.prose > ol:last-child {
	margin-bottom: 0;
}

.prose > ul,
.prose > ol {
	padding-left: 1.4em;
}

.prose > ul {
	list-style: disc;
}

.prose > ol {
	list-style: decimal;
}

.prose li + li {
	margin-top: 0.3em;
}

/* Zwischenueberschriften im Rich Text: im CMS als fetter Absatz gesetzt,
   deshalb ueber den Abstand davor hervorgehoben statt ueber die Groesse. */
.prose > p > b:only-child {
	display: inline-block;
	margin-top: 0.6em;
}

/* === Fehlerseite 500 ====================================================
   Die 500-Seite kommt ohne base.html und ohne Tailwind aus: Sie erscheint
   gerade dann, wenn etwas nicht laeuft, und darf deshalb von moeglichst
   wenig abhaengen. Diese Klassen liegen in site.css, weil das Stylesheet
   rein statisch ausgeliefert wird. */
.fehlerseite {
	width: min(680px, calc(100% - 32px));
	margin: 0 auto;
	padding: 80px 0;
	text-align: center;
}

.fehlerseite-nummer {
	margin: 0;
	font-size: 0.75rem;
	text-transform: uppercase;
	letter-spacing: 0.22em;
	color: var(--muted);
}

.fehlerseite-titel {
	margin: 12px 0 0;
	font-family: "Cormorant Garamond", serif;
	font-size: 2.5rem;
	font-weight: 500;
	line-height: 1.15;
	color: var(--text);
}

.fehlerseite-text {
	max-width: 44ch;
	margin: 18px auto 0;
	color: var(--muted);
	line-height: 1.6;
}

.fehlerseite-link {
	margin-top: 28px;
}

.fehlerseite-link a {
	color: var(--text);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.fehlerseite-fuss {
	margin-top: 36px;
	font-size: 0.85rem;
	color: var(--muted);
}

.fehlerseite-fuss a {
	color: var(--text);
	text-decoration: underline;
	text-underline-offset: 3px;
}