/* Altstadtfest Rheda – Gestaltung. Farben kommen aus theme.json (var(--wp--preset--color--…)). */
:root {
	--buehne: var(--wp--preset--color--buehne, #2347B5);
	--tuerkis: var(--wp--preset--color--tuerkis, #6ED3DE);
	--gasse: var(--wp--preset--color--gasse, #F2994A);
	--sonne: var(--wp--preset--color--sonne, #F7D35E);
	--lounge: var(--wp--preset--color--lounge, #6E4FE0);
	--familie: var(--wp--preset--color--familie, #7ACC2E);
	--ink: var(--wp--preset--color--ink, #1E1B2E);
	--ink-leise: var(--wp--preset--color--ink-leise, #5C5868);
	--grund: var(--wp--preset--color--grund, #FBF7EE);
	--grund-tief: var(--wp--preset--color--grund-tief, #F1EBDD);
	--linie: var(--wp--preset--color--linie, #DDD6C8);
	--papier: #FFFDF8;
	--ecke: 12px;
	--pille: 999px;
	--titel: var(--wp--preset--font-family--bricolage, "Bricolage Grotesque", sans-serif);
	--text: var(--wp--preset--font-family--manrope, Manrope, sans-serif);
}
html { scroll-behavior: smooth; scroll-padding-top: 90px; }
body { overflow-x: hidden; }
.wp-site-blocks { padding: 0; }
.wp-site-blocks > * { margin-block: 0; }
.wp-block-post-content > .alignfull, .wp-block-post-content > .laufband { margin-block: 0 !important; }
h1, h2, h3, h4 { margin-block: 0; text-wrap: balance; }
p { text-wrap: pretty; }

/* ---------- Absatz-Stile ---------- */
.is-style-ueberzeile, .ueberzeile {
	font: 700 14px/1.3 var(--text) !important; text-transform: uppercase; letter-spacing: 0.2em;
	color: var(--ink-leise); margin-block: 0 14px !important;
}
.has-ink-background-color .is-style-ueberzeile, .has-buehne-background-color .is-style-ueberzeile,
.has-lounge-background-color .is-style-ueberzeile { color: #B9B4C8; }
.is-style-stoerer {
	display: inline-flex !important; align-items: center; gap: 10px; width: auto !important;
	background: var(--sonne); color: var(--ink); font: 800 clamp(18px, 2.2vw, 22px)/1 var(--titel) !important;
	padding: 14px 24px; border-radius: var(--pille); transform: rotate(-4deg); box-shadow: 0 4px 0 var(--ink);
	animation: wackeln 5s 2s infinite;
}
.is-style-stoerer::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--ink); animation: pulsieren 1.6s infinite; flex: none; }
@keyframes wackeln { 0%, 86%, 100% { transform: rotate(-4deg); } 89% { transform: rotate(3deg) scale(1.06); } 92% { transform: rotate(-7deg); } 95% { transform: rotate(-2deg); } }
@keyframes pulsieren { 50% { transform: scale(.55); } }

/* ---------- Buttons ---------- */
.wp-element-button, .wp-block-button__link { transition: transform .2s, box-shadow .2s, background .2s, color .2s; border: 2px solid transparent; }
.wp-block-button__link:hover { transform: translateY(-2px); box-shadow: 0 6px 0 var(--ink); }
.wp-block-button__link:active { transform: translateY(1px); box-shadow: 0 1px 0 var(--ink); }
.wp-block-button.is-style-outline > .wp-block-button__link { border: 2px solid currentColor; background: transparent; color: inherit; padding: 13px 24px; }
.wp-block-button.is-style-outline > .wp-block-button__link:hover { background: var(--ink); color: var(--grund); border-color: var(--ink); }
.wp-block-button.knopf-sonne > .wp-block-button__link, .has-buehne-background-color .wp-block-button:not(.is-style-outline) > .wp-block-button__link,
.has-ink-background-color .wp-block-button:not(.is-style-outline) > .wp-block-button__link { background: var(--sonne); color: var(--ink); }

/* ---------- Kopfzeile ---------- */
.kopf { position: sticky; top: 0; z-index: 50; background: var(--grund); transition: box-shadow .3s; }
.admin-bar .kopf { top: var(--wp-admin--admin-bar--height, 0); }
.kopf.gescrollt { box-shadow: 0 1px 0 var(--linie); }
.kopf-innen { max-width: 1240px; margin: 0 auto; padding: 0 20px; min-height: 80px; gap: 24px; transition: min-height .3s; }
.kopf.gescrollt .kopf-innen { min-height: 66px; }
.marke { gap: 10px; }
.marke .wp-block-site-title { margin: 0; line-height: 1; white-space: nowrap; }
.marke .wp-block-site-title a { text-decoration: none; display: inline-flex; align-items: center; gap: 10px; }
.marke .wp-block-site-title a::before {
	content: ""; width: 26px; height: 30px; flex: none;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 30'%3E%3Cpath d='M13 0L26 11V30H0V11Z' fill='%231E1B2E'/%3E%3Crect x='3' y='13' width='9' height='7' fill='%232347B5'/%3E%3Crect x='14' y='13' width='9' height='7' fill='%23F2994A'/%3E%3Crect x='3' y='21' width='9' height='7' fill='%237ACC2E'/%3E%3Crect x='14' y='21' width='9' height='7' fill='%23F7D35E'/%3E%3C/svg%3E") center/contain no-repeat;
}
.marke .wp-block-site-logo + .wp-block-site-title a::before { display: none; }
.kopf nav.wp-block-navigation { gap: 28px; margin-left: auto; }
.kopf .wp-block-navigation .wp-block-navigation-item__content { position: relative; padding: 6px 0; text-decoration: none; }
.kopf .wp-block-navigation .wp-block-navigation-item__content::after {
	content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; border-radius: 3px; background: var(--sonne);
	transform: scaleX(0); transform-origin: left; transition: transform .25s;
}
.kopf .wp-block-navigation-item__content:hover::after, .kopf .wp-block-navigation-item__content.aktiv::after { transform: scaleX(1); }
.kopf .wp-block-navigation__responsive-container-open {
	width: 48px; height: 48px; border-radius: var(--pille); background: var(--ink); color: var(--grund); align-items: center; justify-content: center;
}
.kopf .wp-block-navigation__responsive-container.is-menu-open { background: var(--buehne) !important; color: #fff !important; padding: 28px 24px; }
.kopf .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { font: 800 38px/1.25 var(--titel); }
.kopf .wp-block-navigation__responsive-container-close { width: 48px; height: 48px; border-radius: 50%; background: var(--sonne); color: var(--ink); display: grid; place-items: center; }
.kopf .is-menu-open .wp-block-navigation__responsive-container-content { padding-top: 70px !important; align-items: flex-start !important; }
.kopf .is-menu-open .wp-block-navigation__container { gap: 4px !important; align-items: flex-start !important; margin: 0 !important; }
.kopf .is-menu-open .wp-block-navigation-item { align-items: flex-start !important; }
@media (max-width: 1000px) {
	.kopf-knopf { display: none !important; }
	.kopf .wp-block-navigation__responsive-container:not(.is-menu-open) { display: none !important; }
	.kopf .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex !important; }
}
@media (max-width: 640px) { .kopf-innen { min-height: 68px; } .marke .wp-block-site-title { font-size: 22px !important; } }

/* ---------- Lichterkette ---------- */
.lichterkette { display: block; height: 56px; pointer-events: none; width: 100vw; max-width: none !important; margin: 0 0 0 calc(50% - 50vw) !important; }
.lichterkette .draht { fill: none; stroke: var(--ink); stroke-width: 1.5; }
.lichterkette .birne { animation: funkeln 2.4s infinite; }
@keyframes funkeln { 0%, 45%, 55%, 100% { opacity: 1; } 50% { opacity: .35; } }

/* ---------- Abschnitte ---------- */
.abschnitt { padding-block: clamp(72px, 10vw, 128px) !important; position: relative; }
.abschnitt-kopf { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: 12px 24px; margin-bottom: 44px !important; }
.abschnitt-kopf > * { margin: 0 !important; }
.abschnitt-kopf > .is-style-ueberzeile { flex-basis: 100%; margin-bottom: -6px !important; }

/* ---------- Hero ---------- */
.hero { padding-block: 24px 72px !important; }
.hero-spalten { gap: 48px !important; align-items: center !important; }
.hero h1 { margin-block: 0 !important; }
.hero h1 .wort { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .08em; margin-bottom: -.08em; }
.hero h1 .wort > span { display: inline-block; transform: translateY(105%); animation: hoch .8s cubic-bezier(.2,.8,.2,1) forwards; }
@keyframes hoch { to { transform: none; } }
.hero h1 mark { background: none !important; color: inherit !important; position: relative; z-index: 0; }
.hero h1 mark::before, .hero h1 .wort mark::before {
	content: ""; position: absolute; z-index: -1; left: -.06em; right: -.06em; bottom: .06em; height: .42em;
	background: var(--sonne); border-radius: 4px; transform: scaleX(0); transform-origin: left; animation: wischen .6s 1.1s cubic-bezier(.6,0,.2,1) forwards;
}
@keyframes wischen { to { transform: scaleX(1); } }
.hero .is-style-stoerer { margin-block: 26px 24px !important; }
.hero-text { font-size: 19px !important; max-width: 34em; }
.hero .wp-block-buttons { margin-top: 28px !important; }

/* Fachwerk-Grafik */
.fachwerk { position: relative; max-width: 480px; margin: 0 auto; width: 100%; }
.fachwerk svg { width: 100%; height: auto; overflow: visible; display: block; }
.fachwerk .feld { cursor: pointer; transform-box: fill-box; transform-origin: center; }
.fachwerk .feld.dreht { animation: drehen .7s cubic-bezier(.5,0,.3,1); }
@keyframes drehen { 50% { transform: scaleX(0); } }
.fachwerk .schild {
	position: absolute; background: var(--ink); color: var(--grund); font: 700 14px var(--text); padding: 8px 14px; border-radius: var(--pille);
	pointer-events: none; opacity: 0; transform: translate(-50%, -120%) scale(.9); transition: opacity .2s, transform .2s; white-space: nowrap;
}
.fachwerk .schild.sichtbar { opacity: 1; transform: translate(-50%, -140%) scale(1); }
.fachwerk-hinweis { text-align: center; font-size: 14px; color: var(--ink-leise); margin: 10px 0 0; }

/* Countdown */
.countdown { display: flex; gap: 10px; margin-top: 40px; flex-wrap: wrap; }
.countdown div { background: var(--ink); color: var(--grund); border-radius: var(--ecke); padding: 12px 16px 10px; min-width: 82px; text-align: center; }
.countdown b { display: block; font: 800 34px/1 var(--titel); font-variant-numeric: tabular-nums; }
.countdown small { font: 700 12px var(--text); text-transform: uppercase; letter-spacing: .15em; color: #A9A4B8; }
.countdown.vorbei { font: 800 24px var(--titel); background: var(--sonne); padding: 14px 22px; border-radius: var(--pille); display: inline-flex; }

/* ---------- Laufband (volle Breite) ---------- */
.laufband {
	background: var(--buehne); color: #fff; overflow: hidden; transform: rotate(-1.5deg); position: relative; z-index: 2;
	width: calc(100vw + 40px); max-width: none !important; margin-left: calc(50% - 50vw - 20px) !important;
	border-block: 3px solid var(--ink);
}
.laufband-spur { display: flex; width: max-content; animation: laufen 32s linear infinite; }
.laufband:hover .laufband-spur { animation-play-state: paused; }
.laufband span { font: 800 28px/1 var(--titel); padding: 18px 0; white-space: nowrap; display: flex; align-items: center; }
.laufband i { display: inline-block; width: 18px; height: 18px; margin: 0 28px; border-radius: 4px; transform: rotate(45deg); }
@keyframes laufen { to { transform: translateX(-50%); } }

/* ---------- Was bleibt – was neu ist ---------- */
.zwei { gap: 24px !important; }
.liste-karte { border-radius: var(--ecke); padding: 36px !important; border: 2px solid var(--ink); }
.liste-karte:not(.has-background) { background: var(--grund); }
.liste-karte > * { margin-block: 0 !important; }
.liste-karte h3 { margin: 10px 0 20px !important; }
.marker { display: inline-block; font: 800 14px var(--text) !important; text-transform: uppercase; letter-spacing: .15em; padding: 6px 12px; border-radius: var(--pille); background: var(--tuerkis); color: var(--ink); }
.liste-karte.has-ink-background-color .marker { background: var(--sonne); }
.liste-karte ul { list-style: none; margin: 0; padding: 0; }
.liste-karte li { display: flex; gap: 14px; padding: 14px 0; border-top: 1px solid var(--linie); font-weight: 600; }
.liste-karte.has-ink-background-color li { border-color: #3A3650; }
.liste-karte li::before {
	content: ""; flex: none; width: 22px; height: 22px; margin-top: 2px; background: var(--familie);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M1 7.5l4 4L13 3' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M1 7.5l4 4L13 3' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat;
}
.liste-karte.has-ink-background-color li::before { -webkit-mask: none; mask: none; background: var(--sonne); border-radius: 50%; transform: scale(.6); }

/* ---------- Meldungen (Startseite und Archiv) ---------- */
.meldungen { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin: 0 !important; padding: 0; list-style: none; }
.meldung {
	background: var(--papier); border: 1px solid var(--linie); border-radius: var(--ecke); overflow: hidden; text-decoration: none; color: inherit;
	display: flex; flex-direction: column; transition: transform .3s, box-shadow .3s; position: relative;
}
.meldung:hover { transform: translateY(-6px) rotate(-.6deg); box-shadow: 0 10px 0 var(--ink); }
.meldung::before { content: ""; display: block; height: 10px; background: var(--bar, var(--buehne)); transition: height .3s; flex: none; }
.meldung:hover::before { height: 18px; }
.meldungen > :nth-child(3n+1), .meldungsliste li:nth-child(3n+1) .meldung { --bar: var(--sonne); }
.meldungen > :nth-child(3n+2), .meldungsliste li:nth-child(3n+2) .meldung { --bar: var(--gasse); }
.meldungen > :nth-child(3n+3), .meldungsliste li:nth-child(3n+3) .meldung { --bar: var(--buehne); }
.meldung .inhalt, .meldungsliste .meldung { padding: 0; }
.meldung .inhalt { padding: 26px; display: flex; flex-direction: column; flex: 1; }
.meldung time, .meldung .wp-block-post-date { font: 700 13px var(--text); text-transform: uppercase; letter-spacing: .15em; color: var(--ink-leise); }
.meldung h3, .meldung .wp-block-post-title { font-size: 26px !important; margin: 12px 0 !important; }
.meldung p, .meldung .wp-block-post-excerpt { color: var(--ink-leise); margin: 0 0 1em; }
.meldung .weiter { margin-top: auto; font-weight: 700; }
.meldungsliste .meldung > * { margin-inline: 26px !important; }
.meldungsliste .meldung > .wp-block-post-date { margin-top: 26px !important; }
.meldungsliste .meldung > :last-child { margin-bottom: 26px !important; }
.meldungsliste .wp-block-post-title a { text-decoration: none; }
.meldungsliste .wp-block-post-title a::after { content: ""; position: absolute; inset: 0; }
.meldungen-leer { grid-column: 1 / -1; color: var(--ink-leise); }
.textlink { font-weight: 700; text-decoration: none !important; border-bottom: 3px solid var(--sonne); padding-bottom: 2px; }
.textlink:hover { background: var(--sonne); color: var(--ink) !important; }

/* ---------- Das Fest ---------- */
.bereiche { display: grid !important; grid-template-columns: repeat(4, 1fr); gap: 18px; perspective: 900px; }
.bereiche > * { margin: 0 !important; }
.bereich {
	border-radius: var(--ecke); padding: 28px 24px !important; min-height: 320px; display: flex; flex-direction: column;
	position: relative; overflow: hidden; transition: transform .15s ease-out; color: var(--ink);
}
.bereich > * { margin: 0 !important; position: relative; }
.bereich .nr { font: 800 15px var(--text); letter-spacing: .1em; opacity: .8; }
.bereich h3 { font-size: 30px !important; margin-top: auto !important; }
.bereich h3 + p { margin-top: 10px !important; font-weight: 600; }
.bereich::after { content: ""; position: absolute; right: -30px; top: -30px; width: 140px; height: 140px; opacity: .22; background: currentColor; transition: transform .6s; }
.bereich:nth-child(1)::after { border-radius: 50%; }
.bereich:nth-child(2)::after { border-radius: 14px; }
.bereich:nth-child(3)::after { clip-path: polygon(50% 0, 100% 100%, 0 100%); }
.bereich:nth-child(4)::after { clip-path: polygon(50% 0, 61% 39%, 100% 50%, 61% 61%, 50% 100%, 39% 61%, 0 50%, 39% 39%); }
.bereich:hover::after { transform: rotate(90deg) scale(1.15); }
.fest-zusatz { margin-top: 40px !important; font-size: 20px !important; padding-right: max(0px, calc(100% - 46em)); }
.fest-zusatz strong { color: var(--sonne); }

/* ---------- Programm ---------- */
.tage { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.tag { border: 2px solid var(--ink); border-radius: var(--ecke); overflow: hidden; background: var(--papier); }
.tag-kopf { padding: 24px 26px; display: flex; justify-content: space-between; align-items: end; gap: 10px; }
.tag:nth-child(1) .tag-kopf { background: var(--buehne); color: #fff; }
.tag:nth-child(2) .tag-kopf { background: var(--gasse); }
.tag:nth-child(3) .tag-kopf { background: var(--lounge); color: #fff; }
.tag-kopf .kuerzel { font: 800 74px/.8 var(--titel); letter-spacing: -0.04em; }
.tag-kopf .datum { text-align: right; font-weight: 700; }
.tag-kopf .datum span { display: block; font-size: 14px; letter-spacing: .1em; text-transform: uppercase; }
.tag-slots { padding: 8px 26px 26px; }
.slot { display: flex; align-items: center; gap: 14px; padding: 14px 0; border-top: 1px dashed var(--linie); }
.slot:first-child { border-top: 0; }
.slot .zeit { font: 700 15px var(--text); font-variant-numeric: tabular-nums; width: 50px; flex: none; color: var(--ink-leise); }
.slot .act { flex: 1; min-width: 0; }
.slot .act b { display: block; font: 800 21px/1.15 var(--titel); }
.slot .act small { color: var(--ink-leise); font-size: 14px; font-weight: 600; }
.slot .act a { text-decoration: none; }
.slot .platzhalter { flex: 1; height: 14px; border-radius: var(--pille); background: var(--grund-tief); position: relative; overflow: hidden; }
.slot .platzhalter::after { content: ""; position: absolute; inset: 0; width: 30%; background: var(--linie); border-radius: var(--pille); animation: suchen 2.2s ease-in-out infinite alternate; }
@keyframes suchen { to { transform: translateX(233%); } }
.folgen { display: flex; align-items: center; gap: 10px; font-weight: 700; margin: 16px 0 0; }
.folgen::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--gasse); animation: pulsieren 1.4s infinite; }

/* ---------- Sponsoring ---------- */
.pakete { display: grid !important; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.pakete > * { margin: 0 !important; }
.paket {
	background: var(--papier); border: 2px solid var(--ink); border-radius: var(--ecke); padding: 28px !important;
	transition: transform .25s, box-shadow .25s;
}
.paket > * { margin-block: 0 !important; }
.paket:hover { transform: translate(-4px, -4px); box-shadow: 6px 6px 0 var(--ink); }
.paket:not(.haupt)::before { content: ""; display: block; width: 44px; height: 44px; border-radius: 10px; margin-bottom: 22px; background: var(--farbe, var(--sonne)); }
.paket:nth-child(2) { --farbe: var(--sonne); } .paket:nth-child(3) { --farbe: var(--gasse); } .paket:nth-child(4) { --farbe: var(--lounge); }
.paket:nth-child(5) { --farbe: var(--tuerkis); } .paket:nth-child(6) { --farbe: var(--familie); }
.paket h3 { font-size: 26px !important; margin-bottom: 10px !important; }
.paket p { color: var(--ink-leise); }
.paket.haupt { grid-column: span 2; grid-row: span 2; display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; gap: 18px; padding: 40px !important; }
.paket.haupt p { color: #DCE3FA; }
.paket.haupt h3 { font-size: clamp(32px, 4vw, 44px) !important; }
.paket.haupt .wp-block-buttons { margin-top: auto !important; }
.krone { font: 800 14px var(--text) !important; letter-spacing: .15em; text-transform: uppercase; background: var(--sonne); color: var(--ink) !important; padding: 8px 14px; border-radius: var(--pille); display: inline-block; }
.logowand { margin-top: 64px !important; }
.logowand h3 { margin-bottom: 22px !important; }
.logos { display: grid; grid-template-columns: repeat(6, 1fr); gap: 14px; }
.logo {
	aspect-ratio: 3 / 2; border: 2px dashed var(--linie); border-radius: var(--ecke); display: grid; place-items: center;
	font-weight: 700; font-size: 14px; color: var(--ink-leise); text-align: center; padding: 14px; text-decoration: none; transition: border-color .2s, background .2s, transform .25s;
}
.logo.belegt { border: 1px solid var(--linie); background: var(--papier); color: var(--ink); font: 800 18px/1.15 var(--titel); }
.logo.belegt:hover { transform: translateY(-4px); }
.logo img { max-width: 100%; max-height: 100%; object-fit: contain; }
.logo.frei:hover { border-color: var(--buehne); background: var(--grund); color: var(--buehne); }

.formular-bereich {
	margin-top: 64px !important; display: grid !important; grid-template-columns: .8fr 1.2fr; gap: 40px;
	border-radius: var(--ecke); padding: clamp(28px, 5vw, 56px) !important;
}
.formular-bereich > * { margin: 0 !important; }
.formular-bereich h2 { font-size: clamp(30px, 4vw, 42px) !important; margin: 0 0 16px !important; }
.formular-hinweis { background: var(--grund); color: var(--ink); border-radius: var(--ecke); padding: 22px; }
/* Forminator an die CI anpassen */
.formular-bereich form.forminator-ui { display: flex; flex-direction: column; gap: 16px; }
.formular-bereich .forminator-row { display: flex; flex-wrap: wrap; gap: 16px; margin: 0; }
.formular-bereich .forminator-col { flex: 1 1 220px; min-width: 0; }
.formular-bereich .forminator-col-12 { flex-basis: 100%; }
.formular-bereich .forminator-field { display: flex; flex-direction: column; gap: 6px; }
.formular-bereich .forminator-field > div { display: flex; flex-direction: column-reverse; gap: 4px; }
.formular-bereich .forminator-input, .formular-bereich .forminator-textarea, .formular-bereich .forminator-field select { width: 100%; box-sizing: border-box; padding: 12px 14px; outline: none; }
.formular-bereich .forminator-textarea { min-height: 130px !important; resize: vertical; }
.formular-bereich .forminator-field-consent { margin-top: 4px; }
.formular-bereich .forminator-description { font-size: 13px; color: #A9A4B8 !important; text-align: right; }
.formular-bereich .forminator-required { color: var(--sonne); margin-left: 2px; }
.formular-bereich .forminator-field-consent .forminator-label { display: none; }
.formular-bereich .forminator-checkbox__wrapper { display: flex; gap: 12px; align-items: flex-start; }
.formular-bereich .forminator-checkbox input { width: 22px; height: 22px; margin: 2px 0 0; accent-color: var(--sonne); }
.formular-bereich .forminator-checkbox-box { display: none; }
.formular-bereich .forminator-hidden { position: absolute !important; left: -9999px; }
.formular-bereich .forminator-error-message { color: var(--gasse) !important; font-size: 14px; font-weight: 600; }
.formular-bereich .forminator-response-message:not(:empty) { background: var(--sonne); color: var(--ink); border-radius: 10px; padding: 14px 18px; }
.formular-bereich .forminator-response-message:empty, .formular-bereich .forminator-response-message[aria-hidden="true"] { display: none; }
.formular-bereich .forminator-response-message * { color: var(--ink) !important; margin: 0; }
.formular-bereich .forminator-ui.forminator-custom-form { margin: 0 !important; }
.formular-bereich .forminator-label { color: var(--grund) !important; font: 600 15px var(--text) !important; }
.formular-bereich .forminator-input, .formular-bereich .forminator-textarea, .formular-bereich select, .formular-bereich .select2-selection {
	font: 400 17px var(--text) !important; min-height: 50px; border-radius: 10px !important; border: 2px solid transparent !important;
	background: var(--grund) !important; color: var(--ink) !important;
}
.formular-bereich .forminator-input:focus, .formular-bereich .forminator-textarea:focus { border-color: var(--sonne) !important; }
.formular-bereich .forminator-button-submit {
	background: var(--sonne) !important; color: var(--ink) !important; border-radius: var(--pille) !important; font: 700 16px var(--text) !important;
	min-height: 48px; padding: 0 26px !important; box-shadow: none !important;
}
.formular-bereich .forminator-checkbox-label, .formular-bereich .forminator-checkbox__label, .formular-bereich .forminator-description { color: var(--grund) !important; }
.formular-bereich a { color: var(--sonne); }

/* ---------- Mitmachen ---------- */
.kacheln { display: grid !important; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.kacheln > * { margin: 0 !important; }
.kachel { border-radius: var(--ecke); padding: 32px 28px !important; min-height: 280px; display: flex; flex-direction: column; position: relative; overflow: hidden; transition: transform .3s; }
.kachel > * { margin: 0 !important; }
.kachel:hover { transform: translateY(-6px); }
.kachel h3 { font-size: 32px !important; margin: auto 0 10px !important; }
.kachel h3 a { text-decoration: none; color: inherit; }
.kachel h3 a::after { content: ""; position: absolute; inset: 0; }
.kachel p { font-weight: 600; max-width: 22em; }
.kachel::after {
	content: "→"; position: absolute; right: 24px; top: 24px; width: 56px; height: 56px; border-radius: 50%; background: var(--ink); color: var(--grund);
	display: grid; place-items: center; font-size: 24px; transition: transform .4s cubic-bezier(.5,0,.2,1.4); pointer-events: none;
}
.kachel:hover::after { transform: rotate(-45deg) scale(1.1); }

/* ---------- Presse ---------- */
.presse { gap: 40px !important; }
.kontaktkarte { border-radius: var(--ecke); padding: 32px !important; }
.kontaktkarte > * { margin-block: 0 0 1em !important; }
.kontaktkarte a { font-weight: 700; }
.pdfliste { list-style: none; margin: 0; padding: 0; border-top: 2px solid var(--ink); }
.pdfliste li a { display: grid; grid-template-columns: auto 1fr auto; gap: 18px; align-items: center; padding: 20px 4px; border-bottom: 1px solid var(--linie); text-decoration: none; color: inherit; transition: background .2s, padding .2s; }
.pdfliste li a:hover { background: var(--grund-tief); padding-left: 14px; }
.pdfliste .pdf { width: 46px; height: 54px; border-radius: 6px; background: var(--buehne); color: #fff; font: 800 12px var(--text); display: grid; place-items: end center; padding-bottom: 8px; clip-path: polygon(0 0, 70% 0, 100% 22%, 100% 100%, 0 100%); }
.pdfliste li:nth-child(3n+2) .pdf { background: var(--gasse); color: var(--ink); }
.pdfliste li:nth-child(3n+3) .pdf { background: var(--lounge); }
.pdfliste b { display: block; font-size: 18px; }
.pdfliste small { color: var(--ink-leise); font-size: 14px; }
.pdfliste .laden { font-weight: 700; font-size: 15px; white-space: nowrap; }
.pdfliste-leer { color: var(--ink-leise); border-top: 2px solid var(--ink); padding-top: 20px; }

/* ---------- Fußzeile ---------- */
.fuss { position: relative; overflow: hidden; padding-block: 80px 32px !important; }
.fuss .gross { font: 800 clamp(48px, 10vw, 140px)/.9 var(--titel) !important; letter-spacing: -0.04em; margin: 0 0 48px !important; }
.fuss .gross mark { background: none !important; color: var(--sonne) !important; }
.fuss-spalten { border-top: 2px solid rgba(255,255,255,.35); padding-top: 32px !important; gap: 32px !important; }
.fuss-spalten p { margin: 0; }
.fuss .fuss-titel { font: 700 14px var(--text) !important; text-transform: uppercase; letter-spacing: .2em; margin: 0 0 10px !important; color: var(--tuerkis); }
.fuss a { text-decoration: none; border-bottom: 1px solid rgba(255,255,255,.5); }
.fuss a:hover { border-color: var(--sonne); color: var(--sonne); }
.fuss-unten { margin-top: 48px !important; font-size: 15px; }
.fuss-unten p { margin: 0; }
.fuss-unten .fuss-links a { margin-left: 22px; }
.fuss::after {
	content: ""; position: absolute; right: 20px; top: 40px; width: 114px; height: 74px; opacity: .9;
	background:
		linear-gradient(var(--sonne), var(--sonne)) 0 0 / 34px 34px no-repeat,
		linear-gradient(var(--gasse), var(--gasse)) 40px 0 / 34px 34px no-repeat,
		linear-gradient(var(--tuerkis), var(--tuerkis)) 80px 0 / 34px 34px no-repeat,
		linear-gradient(var(--familie), var(--familie)) 0 40px / 34px 34px no-repeat,
		linear-gradient(var(--lounge), var(--lounge)) 40px 40px / 34px 34px no-repeat,
		linear-gradient(var(--grund), var(--grund)) 80px 40px / 34px 34px no-repeat;
}

/* ---------- Unterseiten ---------- */
.seite { padding-block: 56px 96px !important; }
.seite .wp-block-post-title { margin-bottom: 32px !important; }
.seite:not(.beitrag) > .wp-block-post-content { max-width: 780px; margin-left: 0 !important; }
.seite .wp-block-post-content h2 { font-size: 30px; margin-top: 1.6em; margin-bottom: .5em; }
.seite .wp-block-post-content h3 { font-size: 22px; margin-top: 1.4em; margin-bottom: .4em; }
.beitrag .wp-block-post-featured-image img { border-radius: var(--ecke); }
.beitrag .wp-block-post-content { font-size: 18px; }
.zurueck { margin-top: 48px !important; }

/* ---------- Einblenden beim Scrollen (nur mit JS aktiv) ---------- */
.js-bewegung .einblenden { opacity: 0; transform: translateY(36px); transition: opacity .7s, transform .7s cubic-bezier(.2,.8,.2,1); transition-delay: var(--v, 0s); }
.js-bewegung .einblenden.da { opacity: 1; transform: none; }

/* ---------- Tablet und Handy ---------- */
@media (max-width: 1000px) {
	.hero-spalten { flex-wrap: wrap !important; }
	.hero-spalten > .wp-block-column { flex-basis: 100% !important; }
	.fachwerk { max-width: 420px; }
	.meldungen, .tage, .kacheln { grid-template-columns: 1fr; }
	.bereiche, .pakete { grid-template-columns: 1fr 1fr; }
	.paket.haupt { grid-row: auto; }
	.paket:last-child { grid-column: span 2; }
	.logos { grid-template-columns: repeat(3, 1fr); }
	.formular-bereich { grid-template-columns: 1fr; }
	.fuss::after { display: none; }
}
@media (max-width: 781px) {
	.zwei, .presse { gap: 24px !important; }
}
@media (max-width: 640px) {
	.hero { padding-top: 8px !important; }
	.bereiche, .pakete { grid-template-columns: 1fr; }
	.bereich { min-height: 220px; }
	.paket.haupt, .paket:last-child { grid-column: auto; padding: 28px !important; }
	.tage { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; margin: 0 -20px; padding: 0 20px 10px; }
	.tag { flex: 0 0 86%; scroll-snap-align: center; }
	.liste-karte { padding: 26px 22px !important; }
	.countdown div { min-width: 0; flex: 1; padding: 10px 6px 8px; }
	.countdown b { font-size: 28px; }
	.pdfliste .laden { display: none; }
	.laufband span { font-size: 22px; }
	.fuss-unten .fuss-links a { margin: 0 22px 0 0; }
}
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation: none !important; transition: none !important; }
	.hero h1 .wort > span, .hero h1 mark::before { transform: none !important; }
	.js-bewegung .einblenden { opacity: 1; transform: none; }
}

/* Im Editor: alles sofort sichtbar, keine Startanimation */
.editor-styles-wrapper .einblenden { opacity: 1 !important; transform: none !important; }
.editor-styles-wrapper .hero h1 mark::before { transform: none; animation: none; }