/*
 * BuBerg Ballooning – Gestaltung, die theme.json nicht abdeckt.
 * Gilt im Frontend und im Editor (add_editor_style).
 * Farben, Schriftgrößen und Abstände kommen aus theme.json (CSS-Variablen --wp--preset--…).
 */

:root {
	--bubi-linie: var(--wp--preset--color--linie, #D2D6DA);
	--bubi-flaeche: var(--wp--preset--color--flaeche, #F2F4F6);
	--bubi-grau: var(--wp--preset--color--grau, #5E6670);
	--bubi-blau: var(--wp--preset--color--blau, #3559C7);
	--bubi-icon-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E");
	--bubi-icon-pfeil: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 5l7 7-7 7'/%3E%3C/svg%3E");
	--bubi-icon-plus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E");
	--bubi-korbmuster: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='112' height='16'%3E%3Crect width='112' height='16' fill='%23C3C7CC'/%3E%3Cg%3E%3Crect x='0' y='0' width='8' height='8' fill='%23F2C230'/%3E%3Crect x='16' y='0' width='8' height='8' fill='%23F08C24'/%3E%3Crect x='32' y='0' width='8' height='8' fill='%23E8542E'/%3E%3Crect x='48' y='0' width='8' height='8' fill='%233FA34D'/%3E%3Crect x='64' y='0' width='8' height='8' fill='%233559C7'/%3E%3Crect x='80' y='0' width='8' height='8' fill='%23A8DCCB'/%3E%3Crect x='96' y='0' width='8' height='8' fill='%23EEF1EE'/%3E%3Crect x='8' y='8' width='8' height='8' fill='%233FA34D'/%3E%3Crect x='24' y='8' width='8' height='8' fill='%233559C7'/%3E%3Crect x='40' y='8' width='8' height='8' fill='%23A8DCCB'/%3E%3Crect x='56' y='8' width='8' height='8' fill='%23EEF1EE'/%3E%3Crect x='72' y='8' width='8' height='8' fill='%23F2C230'/%3E%3Crect x='88' y='8' width='8' height='8' fill='%23F08C24'/%3E%3Crect x='104' y='8' width='8' height='8' fill='%23E8542E'/%3E%3C/g%3E%3C/svg%3E");
}

/* ---------- Grundlagen ---------- */

html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	.vz-anim { display: none; }
}
body { -webkit-font-smoothing: antialiased; }
::selection { background: #A8DCCB; color: #1D1D1F; }
input, select, textarea, button { font: inherit; }
:where(.wp-site-blocks) [id] { scroll-margin-top: 72px; }
@media (max-width: 860px) { :where(.wp-site-blocks) [id] { scroll-margin-top: 100px; } }
/* Menüsprung: Überschrift des Abschnitts landet direkt unter der Kopfzeile (Abschnittsabstand oben wird abgezogen) */
:where(.wp-site-blocks) section[id] { scroll-margin-top: calc(53px + 20px - var(--wp--preset--spacing--abschnitt)); }
@media (max-width: 860px) { :where(.wp-site-blocks) section[id] { scroll-margin-top: calc(100px + 12px - var(--wp--preset--spacing--abschnitt)); } }

/* Abstände zwischen Hauptbereich und Fußzeile übernimmt der Inhalt selbst */
:where(.wp-site-blocks) > * { margin-block-start: 0; }

/* Raster: ein Element über die ganze Breite; Inhalte dürfen Spalten nicht aufdrücken */
.bubi-volle-zeile { grid-column: 1 / -1; }
.wp-block-group.is-layout-grid > * { min-width: 0; }
.bubi-dunkel h3 { -webkit-hyphens: auto; hyphens: auto; hyphenate-limit-chars: 10 4 4; }

/* ---------- Kopfzeile ---------- */

header.wp-block-template-part {
	position: sticky;
	top: var(--wp-admin--admin-bar--height, 0px);
	z-index: 20;
}
.bubi-kopfzeile {
	background: rgba(251, 251, 253, 0.85);
	-webkit-backdrop-filter: saturate(180%) blur(20px);
	backdrop-filter: saturate(180%) blur(20px);
	border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}
.bubi-kopfzeile__innen { min-height: 52px; column-gap: 28px !important; row-gap: 0 !important; }
.bubi-marke { gap: 9px !important; min-height: 44px; }
.bubi-marke .wp-block-image img { width: 26px; height: 30px; display: block; }
.bubi-marke .wp-block-site-title a:hover { text-decoration: none; }
.bubi-kopfzeile .wp-block-navigation { flex: 1 1 auto; justify-content: center; min-width: 0; }
.bubi-kopfzeile .wp-block-navigation__container { gap: 0 26px !important; flex-wrap: nowrap !important; white-space: nowrap; }
.bubi-kopfzeile .wp-block-navigation-item__content { padding: 12px 0 !important; opacity: 0.8; }
.bubi-kopfzeile .wp-block-navigation-item__content:hover { opacity: 1; text-decoration: none; }
.bubi-kopfzeile .wp-block-button__link { min-height: 32px; padding: 0 16px; font-size: 13px; }
/* Sprachwahl DE/EN */
.bubi-kopfzeile p:has(> .bubi-sprachwahl) { margin: 0; }
.bubi-sprachwahl { display: inline-flex; align-items: center; justify-content: center; min-width: 36px; min-height: 32px; padding: 0 8px; border: 1px solid var(--bubi-linie); border-radius: 980px; font-size: 12px; font-weight: 600; letter-spacing: 0.02em; color: var(--wp--preset--color--dunkel); }
.bubi-sprachwahl:hover { text-decoration: none; border-color: var(--wp--preset--color--grau-mittel); }
@media (max-width: 860px) {
	.bubi-kopfzeile .wp-block-navigation {
		order: 3;
		flex-basis: 100%;
		justify-content: flex-start;
		overflow-x: auto;
		padding-bottom: 6px;
		scrollbar-width: none;
	}
	.bubi-kopfzeile .wp-block-navigation__container { overflow-x: auto; scrollbar-width: none; }
	/* Sprachwahl steht am Handy rechts neben dem Menü, damit die erste Zeile nicht umbricht */
	.bubi-kopfzeile .wp-block-navigation { flex-basis: calc(100% - 38px); }
	.bubi-kopfzeile .wp-block-navigation__container { gap: 0 14px !important; }
	.bubi-kopfzeile p:has(> .bubi-sprachwahl) { order: 4; padding-bottom: 6px; }
	.bubi-sprachwahl { min-width: 26px; min-height: 28px; padding: 0; border: 0; }
	.bubi-kopfzeile .wp-block-navigation::-webkit-scrollbar,
	.bubi-kopfzeile .wp-block-navigation__container::-webkit-scrollbar { display: none; }
}

/* ---------- Buttons und Links ---------- */

.wp-block-button__link { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; }
.wp-block-button__link:hover { filter: brightness(1.1); text-decoration: none; }
.bubi-buttons-gross .wp-block-button:not(.is-style-textlink) .wp-block-button__link { min-height: 48px; padding: 0 26px; font-size: 17px; }

.wp-block-button.is-style-textlink .wp-block-button__link {
	background: none;
	color: var(--wp--preset--color--linkblau);
	padding: 0;
	border-radius: 0;
	gap: 0.2em;
	font-weight: 400;
}
.wp-block-button.is-style-textlink .wp-block-button__link:hover { filter: none; text-decoration: underline; }
.wp-block-button.is-style-textlink .wp-block-button__link::after,
p.is-style-pfeil a::after {
	content: "";
	display: inline-block;
	width: 0.72em;
	height: 0.72em;
	background: currentColor;
	-webkit-mask: var(--bubi-icon-pfeil) center / contain no-repeat;
	mask: var(--bubi-icon-pfeil) center / contain no-repeat;
}
p.is-style-pfeil a { display: inline-flex; align-items: center; gap: 0.2em; }
.wp-block-buttons { row-gap: 8px; }

/* ---------- Karten und Kacheln ---------- */

.wp-block-group.is-style-karte { border-radius: var(--wp--custom--radius--karte); padding: 36px 32px; }
.wp-block-group.is-style-kachel { border-radius: var(--wp--custom--radius--kachel); padding: 28px 24px; }
.bubi-fahrt > .wp-block-buttons { margin-top: auto !important; padding-top: 12px; }
.bubi-schritt-kachel > p:last-child.is-style-pfeil { margin-top: auto; }

/* Preiszeile: „220 € pro Person“ */
.bubi-preis { align-items: baseline !important; gap: 6px !important; margin-top: 6px !important; }
.bubi-preis > p:first-child { font-weight: 600; letter-spacing: -0.015em; }

/* Liste mit Häkchen */
ul.is-style-haekchen {
	list-style: none;
	margin: 0;
	padding: 16px 0 0;
	border-top: 1px solid var(--bubi-linie);
	display: flex;
	flex-direction: column;
	gap: 8px;
	font-size: 15px;
}
ul.is-style-haekchen li { position: relative; padding-left: 28px; margin: 0; }
ul.is-style-haekchen li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 2px;
	width: 18px;
	height: 18px;
	background: var(--bubi-blau);
	-webkit-mask: var(--bubi-icon-check) center / contain no-repeat;
	mask: var(--bubi-icon-check) center / contain no-repeat;
}

/* Icons in Karten */
.bubi-icon img { width: 32px; height: 32px; display: block; }
.bubi-icon + * { margin-top: 8px !important; }

/* ---------- Hero ---------- */

.bubi-hero-bild { margin-top: clamp(40px, 5vw, 64px) !important; }
.bubi-hero-bild img {
	display: block;
	width: 100%;
	height: clamp(360px, 52vw, 800px) !important;
	object-fit: cover;
	object-position: 45% 30%;
}
.bubi-ticket::after {
	content: "";
	display: block;
	height: 16px;
	background: var(--bubi-korbmuster) repeat-x left top / 112px 16px;
}

.has-untertitel-font-size { max-width: 880px !important; text-wrap: balance; }
h1, h2 { text-wrap: balance; }

/* ---------- Kennzahlen ---------- */

/* Spaltenabstand als einzelner Wert im Block (WordPress rechnet mit zwei Werten ungültige Spalten),
   Zeilenabstand untereinander hier */
.wp-block-group.bubi-kennzahlen { row-gap: 48px; }

.bubi-kennzahl__wert { white-space: nowrap; margin: 2px 0 8px !important; }
.bubi-kennzahl__text { max-width: 260px; margin-left: auto !important; margin-right: auto !important; }

/* Beschriftung über dem Mengenfeld der Fahrten („Anzahl Personen“) */
.quantity:has(.bubi-menge__label) { display: flex; flex-direction: column; gap: 6px; }
.bubi-menge__label { font-size: 14px; font-weight: 600; line-height: 1.2; color: inherit; }

/* Diashow im Startbild, angelehnt an die Kartenreihe auf apple.com: breite Karten mit runden Ecken,
   die nächste Karte schaut am Rand hervor, darunter mittig eine Leiste mit Punkten (der aktive füllt sich
   über die Anzeigedauer) und Pause-Knopf. Wischen per Scroll-Snapping.
   Ohne Skript (assets/js/diashow.js) bleibt das erste Foto stehen. */
.bubi-diashow {
	--dia-rand: clamp(24px, 6.5vw, 112px);
	position: relative;
	margin-top: clamp(40px, 5vw, 64px) !important;
	margin-bottom: 0 !important;
	overflow: hidden;
}
.wp-site-blocks .bubi-diashow:not(.bubi-diashow--js) { padding-inline: var(--dia-rand); }
.wp-site-blocks .bubi-diashow:not(.bubi-diashow--js) > figure.wp-block-image:not(:first-child) { display: none; }
.bubi-diashow figure.wp-block-image {
	position: relative;
	margin: 0 !important;
	overflow: hidden;
	border-radius: clamp(20px, 2.4vw, 32px);
	background: #E4E7EB;
}
.bubi-diashow figure.wp-block-image img {
	display: block;
	width: 100% !important;
	height: clamp(320px, 44vw, 640px) !important;
	object-fit: cover;
	object-position: 45% 40%;
}
.bubi-diashow figure.wp-block-image figcaption {
	position: absolute !important;
	left: 0; right: 0; bottom: 0;
	margin: 0 !important;
	padding: 64px clamp(20px, 3vw, 40px) clamp(18px, 2.4vw, 30px) !important;
	background: linear-gradient(to top, rgba(14, 22, 34, .6), rgba(14, 22, 34, 0)) !important;
	color: #fff !important;
	font-size: clamp(15px, 1.5vw, 19px) !important;
	font-weight: 500;
	line-height: 1.3;
	text-align: left !important;
	text-shadow: 0 1px 8px rgba(0, 0, 0, .35);
}
.bubi-diashow__buehne { position: relative; }
.bubi-diashow__spur {
	display: flex;
	gap: 14px;
	padding-inline: var(--dia-rand);
	scroll-padding-inline: var(--dia-rand);
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	overscroll-behavior-x: contain;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
	outline-offset: -3px;
}
.bubi-diashow__spur::-webkit-scrollbar { display: none; }
.bubi-diashow__spur > figure.wp-block-image { flex: 0 0 100%; scroll-snap-align: start; scroll-snap-stop: always; }

/* Leiste unter den Karten */
.bubi-diashow__leiste {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 12px;
	margin-top: 20px;
}
.bubi-diashow__punkte {
	display: flex;
	align-items: center;
	gap: 2px;
	padding: 0 10px;
	height: 40px;
	border-radius: 99px;
	background: rgba(60, 66, 76, .1);
}
.bubi-diashow__punkte button {
	/* Trefferfläche 26 × 40, sichtbarer Punkt kleiner */
	width: 26px; height: 40px; padding: 0; border: 0; background: none; cursor: pointer;
	display: grid; place-items: center;
	transition: width .4s ease;
}
.bubi-diashow__punkte button::before {
	content: ""; width: 8px; height: 8px; border-radius: 99px;
	background: rgba(60, 66, 76, .45);
	transition: width .4s ease, background .4s ease;
}
.bubi-diashow__punkte button[aria-current="true"] { width: 48px; }
.bubi-diashow__punkte button[aria-current="true"]::before { width: 40px; height: 8px; background: rgba(60, 66, 76, .28); }
.bubi-diashow__punkte button[aria-current="true"]::after {
	content: ""; position: absolute; height: 8px; width: 40px; border-radius: 99px;
	background: #3C424C; transform-origin: left; transform: scaleX(0);
	animation: bubi-dia-fuellen var(--dia-dauer, 6.5s) linear forwards;
}
.bubi-diashow__punkte button { position: relative; }
.bubi-diashow--halt .bubi-diashow__punkte button[aria-current="true"]::after { animation-play-state: paused; }
.bubi-diashow--pause .bubi-diashow__punkte button[aria-current="true"]::after { animation: none; transform: scaleX(1); }
@keyframes bubi-dia-fuellen { to { transform: scaleX(1); } }
.bubi-diashow__spiel {
	width: 40px; height: 40px; padding: 0; border: 0; border-radius: 50%; cursor: pointer;
	background: rgba(60, 66, 76, .1); color: #3C424C;
	display: grid; place-items: center; transition: background .2s ease;
}
.bubi-diashow__spiel:hover { background: rgba(60, 66, 76, .18); }
.bubi-diashow__spiel svg { width: 14px; height: 14px; fill: currentColor; }
.bubi-diashow__spiel .sym-play { display: none; }
.bubi-diashow--pause .bubi-diashow__spiel .sym-play { display: block; }
.bubi-diashow--pause .bubi-diashow__spiel .sym-pause { display: none; }

/* Pfeile am Rechner (erscheinen beim Darüberfahren) */
.bubi-diashow__pfeil {
	position: absolute; top: 50%; translate: 0 -50%; z-index: 2;
	width: 48px; height: 48px; border-radius: 50%; border: 0; padding: 0; cursor: pointer;
	background: rgba(255, 255, 255, .85); color: #0E1622;
	-webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
	box-shadow: 0 2px 12px rgba(14, 22, 34, .18);
	display: grid; place-items: center;
	opacity: 0; transition: opacity .25s ease, background .2s ease;
}
.bubi-diashow__pfeil--zurueck { left: calc(var(--dia-rand) + 16px); }
.bubi-diashow__pfeil--weiter { right: calc(var(--dia-rand) + 16px); }
.bubi-diashow__pfeil svg { width: 20px; height: 20px; }
.bubi-diashow__buehne:hover .bubi-diashow__pfeil, .bubi-diashow__pfeil:focus-visible { opacity: 1; }
.bubi-diashow__pfeil:hover { background: #fff; }
.bubi-diashow__pfeil[disabled] { display: none; }
@media (hover: none) { .bubi-diashow__pfeil { display: none; } }
@media (prefers-reduced-motion: reduce) {
	.bubi-diashow__punkte button[aria-current="true"]::after { animation: none; transform: scaleX(1); }
}

/* ---------- Galerie ---------- */

.wp-block-gallery.bubi-galerie {
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px !important;
}
.wp-block-gallery.bubi-galerie > figure.wp-block-image {
	width: auto !important;
	margin: 0 !important;
	display: flex;
	flex-direction: column;
	gap: 10px;
	min-width: 0;
	align-self: start;
}
.wp-block-gallery.bubi-galerie > figure.wp-block-image::before,
.wp-block-gallery.bubi-galerie > figure.wp-block-image::after { display: none !important; content: none !important; }
.wp-block-gallery.bubi-galerie:not(.bubi-galerie--reihe) > figure.wp-block-image:first-child { grid-column: 1 / -1; }
.wp-block-gallery.bubi-galerie > figure.wp-block-image img {
	display: block;
	width: 100% !important;
	height: auto !important;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: 24px;
	background: #E4E7EB;
}
.wp-block-gallery.bubi-galerie:not(.bubi-galerie--reihe) > figure.wp-block-image:first-child img {
	aspect-ratio: 21 / 9;
	object-position: 50% 78%;
	border-radius: 28px;
}
.wp-block-gallery.bubi-galerie > figure.wp-block-image figcaption {
	position: static !important;
	background: none !important;
	color: var(--bubi-grau) !important;
	font-size: 14px !important;
	line-height: 1.4;
	padding: 0 4px !important;
	margin: 0 !important;
	max-height: none !important;
	overflow: visible !important;
	text-align: left !important;
	text-shadow: none !important;
	-webkit-backdrop-filter: none !important;
	backdrop-filter: none !important;
	mask-image: none !important;
	-webkit-mask-image: none !important;
}
@media (max-width: 760px) {
	.wp-block-gallery.bubi-galerie { grid-template-columns: minmax(0, 1fr); gap: 24px !important; }
	.wp-block-gallery.bubi-galerie:not(.bubi-galerie--reihe) > figure.wp-block-image:first-child img { aspect-ratio: 4 / 3; object-position: 50% 55%; }
	.wp-block-gallery.bubi-galerie > figure.wp-block-image img { border-radius: 20px; }
}

/* ---------- Ticket-Muster ---------- */

.bubi-ticket-buehne {
	display: flex;
	justify-content: center;
	padding: clamp(40px, 6vw, 72px) clamp(24px, 4vw, 56px) !important;
	border-radius: var(--wp--custom--radius--karte);
}
.bubi-ticket {
	width: 100%;
	max-width: 420px;
	box-sizing: border-box;
	padding: 32px !important;
	border-radius: 20px;
	background: #FFFFFF;
	transform: rotate(-3deg);
	box-shadow: 0 24px 60px rgba(0, 0, 0, 0.14);
	gap: 16px !important;
}
.bubi-ticket::after { margin-top: 4px; border-radius: 3px; }
.bubi-ticket__kopf { justify-content: space-between !important; gap: 12px !important; }
.bubi-ticket__marke { gap: 8px !important; font-size: 15px; font-weight: 600; }
.bubi-ticket__marke .wp-block-image img { width: 18px; height: 21px; display: block; }
.bubi-ticket__titel { font-size: 52px; font-weight: 700; line-height: 1; letter-spacing: -0.045em; }
.bubi-ticket__felder {
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	gap: 14px 24px !important;
	padding-top: 14px;
	border-top: 1px solid var(--bubi-linie);
	font-size: 15px;
}
.bubi-ticket__feld > p:first-child { font-size: 12px; color: var(--bubi-grau); }
.bubi-ticket__feld--linie::after { content: ""; display: block; height: 22px; border-bottom: 1px solid #6B737C; }

/* Schritte 1 · 2 · 3 */
.bubi-schritt { grid-template-columns: 44px 1fr !important; gap: 16px !important; align-items: start; }
.bubi-schritt__nr { font-size: 40px; font-weight: 700; line-height: 1; letter-spacing: -0.04em; color: #6B737C; }
.bubi-schritt h3 { font-size: 21px; font-weight: 600; letter-spacing: -0.015em; line-height: 1.2; }
.bubi-schritt p:not(.bubi-schritt__nr) { margin-top: 4px; }

/* ---------- Häufige Fragen ---------- */

.bubi-faq { border-top: 1px solid var(--bubi-linie); }
.bubi-faq > .wp-block-details { margin: 0 !important; border-bottom: 1px solid var(--bubi-linie); }
.wp-block-details > summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	min-height: 68px;
	padding: 12px 0;
	box-sizing: border-box;
	font-size: 19px;
	font-weight: 600;
	letter-spacing: -0.015em;
	list-style: none;
	cursor: pointer;
}
.wp-block-details > summary::-webkit-details-marker { display: none; }
.wp-block-details > summary::after {
	content: "";
	flex-shrink: 0;
	width: 20px;
	height: 20px;
	background: var(--bubi-grau);
	-webkit-mask: var(--bubi-icon-plus) center / contain no-repeat;
	mask: var(--bubi-icon-plus) center / contain no-repeat;
	transition: transform 0.2s;
}
.wp-block-details[open] > summary::after { transform: rotate(45deg); }
.wp-block-details > :not(summary) { margin: 0 !important; padding: 0 48px 22px 0; color: var(--bubi-grau); }

/* ---------- Region ---------- */

.wp-block-table.is-style-eigenschaften { margin: 12px 0 0; padding-top: 16px; border-top: 1px solid var(--bubi-linie); }
.wp-block-table.is-style-eigenschaften table { border-collapse: collapse; width: 100%; table-layout: auto; }
.wp-block-table.is-style-eigenschaften td,
.wp-block-table.is-style-eigenschaften th { border: 0; padding: 6px 24px 6px 0; vertical-align: top; text-align: left; }
.wp-block-table.is-style-eigenschaften td:first-child { font-weight: 600; width: 1%; white-space: nowrap; min-width: 110px; }
.wp-block-table.is-style-eigenschaften td + td { color: var(--bubi-grau); padding-right: 0; }

.bubi-platzhalter {
	min-height: 220px;
	border-radius: var(--wp--custom--radius--karte);
	background: var(--bubi-flaeche);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 16px;
	box-sizing: border-box;
	text-align: center;
	color: var(--bubi-grau);
	font-size: 14px;
}
.bubi-platzhalter::before {
	content: "";
	width: 30px;
	height: 30px;
	background: url("../icons/bild.svg") center / contain no-repeat;
}
.bubi-platzhalter.bubi-volle-zeile { min-height: 320px; }
/* Foto-Platzhalter sind nur im Editor sichtbar, auf der Seite erscheinen sie erst, wenn echte Fotos eingesetzt sind */
.wp-site-blocks .wp-block-group:has(> .bubi-platzhalter) { display: none; }
.bubi-region-raster:has(> .wp-block-group:last-child > .bubi-platzhalter) { grid-template-columns: minmax(0, 1fr); }
.bubi-region-raster:has(> .wp-block-group:last-child > .bubi-platzhalter) > :first-child { max-width: 760px; }

/* ---------- Über uns ---------- */

.wp-block-image.is-style-abgerundet img { border-radius: var(--wp--custom--radius--karte); }
.bubi-brueder img { object-position: 50% 38%; }

/* ---------- Kontakt ---------- */

/* Kontaktkachel ohne Wert (Platzhalter aus den Firmendaten) bleibt auf der Seite unsichtbar */
.bubi-kontakt-kachel:has(mark.bubi-fehlt) { display: none; }

.bubi-kontakt-kachel {
	gap: 16px !important;
	padding: 22px 24px;
	border-radius: var(--wp--custom--radius--kachel);
	background: var(--bubi-flaeche);
}
.bubi-kontakt-kachel .wp-block-image img { width: 24px; height: 24px; display: block; }
.bubi-kontakt-kachel p:first-child { font-size: 14px; color: var(--bubi-grau); }
.bubi-kontakt-kachel p + p { font-size: 19px; font-weight: 600; }
.bubi-kontakt-kachel p + p a { color: var(--wp--preset--color--dunkel); }

/* ---------- Dunkler Abschnitt (Flugspuren) ---------- */

.bubi-dunkel a { color: var(--wp--preset--color--linkblau-dunkel); }
.bubi-farbstrich {
	flex-shrink: 0;
	width: 28px !important;
	height: 4px !important;
	margin: 0 !important;
	border: 0 !important;
	border-radius: 2px;
	opacity: 1 !important;
}
.bubi-flugdaten__wert { font-size: 24px; font-weight: 700; line-height: 1.15; letter-spacing: -0.025em; margin-top: 2px !important; }

.bubi-flugspuren__scroll { overflow-x: auto; }
.bubi-flugspuren__innen { min-width: 640px; }
.bubi-flugspuren__karte { position: relative; }
.bubi-flugspuren__karte > img { display: block; width: 100%; height: auto; }
.bubi-flugspuren__karte > svg { position: absolute; inset: 0; display: block; width: 100%; height: 100%; }
.bubi-flugspuren__titel { margin: 28px 0 8px !important; font-size: 14px; font-weight: 600; color: #D2D6DA; }
.bubi-flugspuren__profil svg { display: block; width: 100%; height: auto; }
.bubi-flugspuren__hinweis { display: none; margin: 12px 0 0 !important; font-size: 14px; font-weight: 600; color: #D2D6DA; }
@media (max-width: 700px) { .bubi-flugspuren__hinweis { display: block; } }
.bubi-flugspuren__quelle { margin: 14px 0 0 !important; font-size: 12px; line-height: 1.5; color: #6B737C; }

/* ---------- Fußzeile ---------- */

/* Karoband aus dem Ballon schließt jede Seite ab (Corporate Design, siehe logo/CORPORATE-DESIGN.md) */
footer.wp-block-template-part::before {
	content: "";
	display: block;
	height: 8px;
	background: var(--bubi-korbmuster) repeat-x center top / 56px 8px;
}
.bubi-fusszeile a { color: #424245; }
.bubi-fusszeile a:hover { color: var(--wp--preset--color--dunkel); }
.bubi-fusszeile h2 { font-size: 12px; font-weight: 600; letter-spacing: 0; line-height: 1.4; margin-bottom: 2px !important; color: var(--wp--preset--color--dunkel); }
.bubi-fusszeile__hinweis { padding-bottom: 16px; border-bottom: 1px solid var(--bubi-linie); }
.bubi-fusszeile__unten { padding-top: 16px; border-top: 1px solid var(--bubi-linie); }

/* ---------- Shop (WooCommerce-Vorlagen) ---------- */

body.woocommerce-page main.wp-block-group:not(.bubi-rechtliches),
body.single-product main.wp-block-group {
	padding-top: clamp(32px, 4vw, 56px);
	padding-bottom: var(--wp--preset--spacing--abschnitt);
}
.wp-block-woocommerce-product-image-gallery img,
.wc-block-components-product-image img,
.wp-block-woocommerce-product-image img { border-radius: var(--wp--custom--radius--kachel); }
.bubi-kopfzeile .wc-block-mini-cart__button { padding: 8px; }
/* Kundenkonto spielt für Gäste keine Rolle (Gastbestellung); das Symbol spart Platz in der Kopfzeile */
.bubi-kopfzeile .wp-block-woocommerce-customer-account { display: none; }
@media (max-width: 860px) {
	.bubi-kopfzeile__innen { column-gap: 8px !important; }
	.bubi-kopfzeile .wp-block-site-title { font-size: 16px; }
}

/* Ticket-Codes wie auf dem PDF in Großbuchstaben (WooCommerce speichert sie klein) */
.wc-block-components-chip__text { text-transform: uppercase; }

/* ---------- Unterseiten (Rechtliches) ---------- */

.bubi-rechtliches h2 { font-size: 28px; letter-spacing: -0.025em; margin-top: 1.6em !important; }
.bubi-rechtliches h3 { font-size: 21px; margin-top: 1.4em !important; }
.bubi-rechtliches p, .bubi-rechtliches li { color: #424245; }

/* Phase 6: fehlende Firmendaten und Entwurfs-Hinweis auf Rechtsseiten */
mark.bubi-fehlt { background: #FFF3C4; color: inherit; padding: 0 3px; border-radius: 4px; }
.bubi-entwurf { padding: 14px 18px; border-radius: 14px; background: #F9ECE7; color: #7A2E0B !important; font-size: 15px; }
.bubi-rechtliches ul, .bubi-rechtliches ol { padding-left: 1.3em; }

/* Kacheln als Slide auf dem Handy: seitlich wischen, Karte rastet ein, nächste lugt an */
@media (max-width: 700px) {
  :is(#fahrten, #haltung, #ablauf, #ueber-uns) .wp-block-group.is-layout-grid:has(> .is-style-karte),
  :is(#fahrten, #haltung, #ablauf, #ueber-uns) .wp-block-group.is-layout-grid:has(> .is-style-kachel) {
    display: flex;
    flex-wrap: nowrap;
    gap: 14px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    margin-inline: calc(var(--wp--style--root--padding-left, 20px) * -1);
    padding-inline: var(--wp--style--root--padding-left, 20px);
    padding-bottom: 4px;
  }
  :is(#fahrten, #haltung, #ablauf, #ueber-uns) .wp-block-group.is-layout-grid:has(> .is-style-karte)::-webkit-scrollbar,
  :is(#fahrten, #haltung, #ablauf, #ueber-uns) .wp-block-group.is-layout-grid:has(> .is-style-kachel)::-webkit-scrollbar { display: none; }
  :is(#fahrten, #haltung, #ablauf, #ueber-uns) .wp-block-group.is-layout-grid > .is-style-karte,
  :is(#fahrten, #haltung, #ablauf, #ueber-uns) .wp-block-group.is-layout-grid > .is-style-kachel {
    flex: 0 0 84%;
    scroll-snap-align: center;
    box-sizing: border-box;
  }
}

/* Illustrationen in den Ablauf-Kacheln */
.bubi-ablauf-bild { margin: 0; }
.bubi-ablauf-bild + * { margin-top: 8px !important; }
.bubi-ablauf-bild img { display: block; width: 32px; height: 32px; }

/* Schritte durchnummerieren (Zähler an der Kachel, damit die Übersetzung der Überschriften unberührt bleibt) */
#ablauf { counter-reset: schritt; }
#ablauf .bubi-schritt-kachel:not([data-klon]) { counter-increment: schritt; }
#ablauf .bubi-schritt-kachel:not([data-klon]) h3::before { content: counter(schritt) ". "; color: #3559C7; }
#ablauf .bubi-schritt-kachel[data-klon] h3::before { counter-set: klon var(--nr); content: counter(klon) ". "; color: #3559C7; }

/* Flugspuren: die vier Kacheln mit den Fahrtdaten (Datum, Fahrzeit, Strecke …) sind ausgeblendet; Zeile löschen, um sie wieder zu zeigen */
#flugspuren .wp-block-group:has(> .is-style-karte.has-nacht-background-color) { display: none; }

/* ---------- Dunkle Abschnitte im Wechsel mit weißen ---------- */
.bubi-dunkel { --bubi-linie: #3A3A3C; --bubi-grau: var(--wp--preset--color--grau-dunkel); --bubi-flaeche: #1D1D1F; }
.bubi-dunkel :is(h1, h2, h3, h4) { color: var(--wp--preset--color--hell-auf-dunkel); }
.bubi-dunkel .has-grau-color { color: var(--wp--preset--color--grau-dunkel) !important; }
.bubi-dunkel .has-orange-color { color: var(--wp--preset--color--orange-hell) !important; }
.bubi-dunkel .has-dunkel-color { color: var(--wp--preset--color--hell-auf-dunkel) !important; }
.bubi-dunkel .wp-block-group.has-flaeche-background-color,
.bubi-dunkel .wp-block-group.has-weiss-background-color { background-color: var(--wp--preset--color--nacht) !important; color: var(--wp--preset--color--hell-auf-dunkel); }
.bubi-dunkel .wp-block-button.is-style-textlink .wp-block-button__link,
.bubi-dunkel p.is-style-pfeil a { color: var(--wp--preset--color--linkblau-dunkel); }
.bubi-dunkel .wp-block-details > summary { color: var(--wp--preset--color--hell-auf-dunkel); }
.bubi-dunkel ul.is-style-haekchen li::before { background-color: var(--wp--preset--color--linkblau-dunkel); }
/* Buchungskalender bleibt eine helle Fläche auf dem dunklen Abschnitt */
.bubi-dunkel .bubi-buchung { background: #FFFFFF; color: var(--wp--preset--color--dunkel); border-radius: var(--wp--custom--radius--karte, 28px); padding: clamp(16px, 3vw, 36px); --bubi-linie: #D2D6DA; --bubi-grau: #5E6670; }
.bubi-dunkel .bubi-buchung :is(h1, h2, h3, h4) { color: var(--wp--preset--color--dunkel); }
.bubi-dunkel .bubi-buchung .has-grau-color { color: #5E6670 !important; }
.bubi-dunkel .bubi-buchung a { color: var(--wp--preset--color--linkblau); }

/* Aufeinanderfolgende Abschnitte ohne Lücke (sonst blitzt der Seitenhintergrund durch) */
section.wp-block-group.alignfull { margin-block-start: 0 !important; }

/* Symbole und Zähler auf dunklem Grund heller */
.bubi-dunkel .bubi-ablauf-bild img, .bubi-dunkel .bubi-icon img { filter: brightness(1.7) saturate(0.9); }
#ablauf.bubi-dunkel .bubi-schritt-kachel h3::before { color: var(--wp--preset--color--linkblau-dunkel); }
.bubi-dunkel .bubi-kontakt-kachel { background-color: var(--wp--preset--color--nacht); color: var(--wp--preset--color--hell-auf-dunkel); }
.bubi-dunkel .bubi-kontakt-kachel p + p a { color: var(--wp--preset--color--hell-auf-dunkel); }
.bubi-dunkel .bubi-kontakt-kachel p:first-child { color: var(--wp--preset--color--grau-dunkel); }
.bubi-dunkel .bubi-platzhalter { background-color: var(--wp--preset--color--nacht); color: var(--wp--preset--color--grau-dunkel); }
/* Ticket-Vorschau bleibt eine helle Karte */
.bubi-dunkel .bubi-ticket { color: var(--wp--preset--color--dunkel); }
.bubi-dunkel .bubi-ticket :is(h1, h2, h3, h4) { color: var(--wp--preset--color--dunkel); }
.bubi-dunkel .bubi-ticket .has-grau-color { color: #5E6670 !important; }
.bubi-dunkel .bubi-ticket .has-dunkel-color { color: var(--wp--preset--color--dunkel) !important; }
.bubi-dunkel .bubi-ticket a { color: var(--wp--preset--color--linkblau); }

/* Flugspuren und „So läuft eine Fahrt ab“ bilden einen schwarzen Block: kein doppelter Abstand dazwischen */
#flugspuren { padding-bottom: clamp(16px, 2vw, 32px) !important; }