/*
 * Header, Hauptnavigation und Footer.
 *
 * Maße und Umbrüche entsprechen exakt dem bisherigen Elementor-/ElementsKit-Aufbau
 * (Header 2544/2467, Footer 2459). Breakpoints wie bisher: Tablet ≤ 1024 px, Handy ≤ 767 px.
 */

@font-face {
	font-family: "alborn-icons";
	src: url("../fonts/alborn-icons.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

/* Weiches Scrollen zu Ankern (wie bisher Elementor, frontend.css) */
@media (prefers-reduced-motion: no-preference) {
	html {
		scroll-behavior: smooth;
	}
}

/* ---------- Header ---------- */

.alborn-header {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: stretch;
	padding: 10px 50px;
	background-color: var(--wp--preset--color--anthrazit);
}

.alborn-header__logo,
.alborn-header__nav {
	display: flex;
	flex-direction: column;
	gap: 20px;
	padding: 10px;
}

.alborn-header__logo {
	width: 10%;
}

.alborn-header__nav {
	width: 60%;
	justify-content: center;
}

/* Header bleibt auf dem Desktop beim Scrollen oben stehen. */
@media (min-width: 1025px) {
	.alborn-header:not(.alborn-header--home) {
		position: sticky;
		top: 0;
		z-index: 99;
	}
}

@media (max-width: 1024px) {
	.alborn-header {
		padding: 20px;
	}

	.alborn-header__logo {
		width: 20%;
	}

	.alborn-header__nav {
		width: 70%;
	}
}

@media (max-width: 767px) {
	.alborn-header {
		padding: 10px;
	}

	.alborn-header__logo {
		width: 30%;
	}

	.alborn-header__nav {
		align-items: flex-end;
	}
}

/* Startseite: transparenter Header über dem Video. */
.alborn-header--home {
	margin-top: 1em;
	padding: 0 2%;
	background: none;
}

.alborn-header--home .alborn-header__nav {
	width: 40%;
}

/* Menü auf dem Desktop immer einzeilig: nimmt den ganzen Platz neben dem Logo (bisher feste Breite,
   „Deutsch“ rutschte bis etwa 1900px in eine zweite Zeile). */
@media (min-width: 1025px) {
	.alborn-header .alborn-header__nav {
		flex-grow: 1;
		width: auto;
	}
}

@media (max-width: 1024px) {
	.alborn-header--home {
		padding: 0;
	}

	.alborn-header--home .alborn-header__nav {
		width: 79%;
	}
}

@media (max-width: 767px) {
	.alborn-header--home {
		margin-top: 0;
	}

	.alborn-header--home .alborn-header__logo,
	.alborn-header--home .alborn-header__nav {
		width: 50%;
	}
}

/* ---------- Hauptnavigation ---------- */

.alborn-nav {
	--nav-color: #fff;
	--nav-hover: #fff;
	--nav-arrow: #fff;
	position: relative;
}

.alborn-nav.is-style-startseite {
	--nav-hover: var(--wp--preset--color--gruen);
}

.alborn-nav button {
	cursor: pointer;
}

.alborn-nav__toggle,
.alborn-nav__head,
.alborn-nav__overlay {
	display: none;
}

.alborn-nav__panel {
	position: relative;
	z-index: 1000;
	height: 30px;
}

.alborn-nav__list {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	height: 100%;
	margin: 0;
	padding: 0;
	list-style: none;
}

.alborn-nav__item,
.alborn-nav__subitem {
	position: relative;
}

.alborn-nav .alborn-nav__list .alborn-nav__link {
	display: flex;
	align-items: center;
	height: 100%;
	padding: 0 10px;
	font-family: var(--wp--preset--font-family--roboto);
	font-size: 18px;
	font-weight: 500;
	color: var(--nav-color);
	text-decoration: none;
	transition: all 0.4s ease;
}

/* Selektoren mit .alborn-nav__list: stärker als das Hello-Reset für Links ohne href
   („a:not([href]):not([tabindex])“), z. B. „About us“ / „Über uns“. */

/* Platz für den Pfeil: bisher lag er im Link (Abstand 6 px + 11 px Symbol + 6 px). */
.alborn-nav .has-children > .alborn-nav__link {
	padding-right: 33px;
}

.alborn-nav .alborn-nav__list .alborn-nav__item:hover > .alborn-nav__link,
.alborn-nav .alborn-nav__list .alborn-nav__link:hover,
.alborn-nav .alborn-nav__list .alborn-nav__link:focus,
.alborn-nav .alborn-nav__list .alborn-nav__link:active {
	color: var(--nav-hover);
}

.alborn-nav .alborn-nav__list .alborn-nav__item.current-menu-item > .alborn-nav__link,
.alborn-nav .alborn-nav__list .alborn-nav__item.current-menu-ancestor > .alborn-nav__link {
	color: #fff;
}

/* Pfeil zum Aufklappen der Untermenüs */
.alborn-nav .alborn-nav__subtoggle {
	position: absolute;
	top: calc(50% - 8.25px); /* senkrecht mittig wie bisher im Link (16,5 px Zeilenhöhe), auch bei umbrochenem Menü */
	right: 16px;
	display: block;
	width: auto;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: none;
	color: var(--nav-arrow);
	transition: none;
}

/* Eigenes Element im Button: Buttons berechnen ihre Zeilenhöhe anders als normale Blöcke. */
.alborn-nav__arrow {
	display: block;
	font-family: var(--wp--preset--font-family--roboto);
	font-size: 11px;
	font-style: normal;
	font-weight: 900;
	line-height: 1.5;
	text-align: start;
}

.alborn-nav__arrow::before {
	content: "\e994";
	font-family: "alborn-icons";
	font-style: normal;
	font-weight: 400;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.alborn-nav .alborn-nav__list .alborn-nav__item:hover > .alborn-nav__subtoggle {
	color: var(--nav-hover);
}

.alborn-nav .alborn-nav__list .alborn-nav__item.current-menu-ancestor > .alborn-nav__subtoggle {
	color: #fff;
}

/* Untermenüs */
.alborn-nav__sub {
	margin: 0;
	padding: 10px 0;
	list-style: none;
	min-width: 220px;
	border: 1px solid #dadada;
	background-color: #f4f4f4;
	opacity: 0;
	visibility: hidden;
	transition: transform 0.4s ease;
}

/* Sprachwahl (inc/language-switcher.php): Das bisherige WPML-CSS verschmälerte nur das Untermenü
   der deutschen Sprache (#menu-item-wpml-ls-3-de); auf englischen Seiten bleibt es 220 px breit. */
.alborn-nav .alborn-lang--de > .alborn-nav__sub {
	min-width: 150px;
}

.alborn-nav .alborn-nav__list .alborn-nav__sublink {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 5px 10px;
	font-family: var(--wp--preset--font-family--roboto);
	font-size: 14px;
	font-weight: 400;
	color: #000;
	text-decoration: none;
	transition: all 0.3s;
}

.alborn-nav .alborn-nav__list .alborn-nav__subitem:hover > .alborn-nav__sublink,
.alborn-nav .alborn-nav__list .alborn-nav__sublink:hover,
.alborn-nav .alborn-nav__list .alborn-nav__sublink:focus,
.alborn-nav .alborn-nav__list .alborn-nav__sublink:active {
	color: #707070;
	background-color: rgba(255, 255, 255, 0.5);
}

.alborn-nav .alborn-nav__list .alborn-nav__subitem.current-menu-item > .alborn-nav__sublink {
	color: #707070;
}

/* Sprachwahl: Flagge und Sprachname */
.alborn-nav .alborn-lang__flag {
	display: block;
	margin-right: 5px;
}

.alborn-nav .alborn-lang__flag + span {
	margin-left: 0.3em;
}

@media (min-width: 1025px) {
	.alborn-nav__sub {
		position: absolute;
		top: 100%;
		left: 0;
		z-index: 999;
		box-shadow: 0 10px 30px 0 rgba(45, 45, 45, 0.2);
		transform: translateY(-10px);
		pointer-events: none;
	}

	.alborn-nav__item:hover > .alborn-nav__sub,
	.alborn-nav__item:focus-within > .alborn-nav__sub,
	.alborn-nav__item.is-open > .alborn-nav__sub {
		opacity: 1;
		visibility: visible;
		transform: translateY(0);
		pointer-events: auto;
	}
}

/* Tablet und Handy: Seitenmenü von links */
@media (max-width: 1024px) {
	.alborn-nav {
		--nav-color: #000;
	}

	/* Hintergrund bei Hover/Fokus (#c36) kommt wie bisher aus dem Hello-Reset in base.css. */
	.alborn-nav .alborn-nav__toggle {
		position: relative;
		z-index: 10;
		display: block;
		float: right;
		width: 50px;
		padding: 10px;
		border: 4px solid var(--wp--preset--color--rot);
		border-radius: 0;
		color: #000;
	}

	.alborn-nav__bar {
		display: block;
		width: 100%;
		height: 1px;
		margin-bottom: 4px;
		background-color: var(--wp--preset--color--rot);
	}

	.alborn-nav__bar:last-child {
		margin-bottom: 0;
	}

	.alborn-nav .alborn-nav__toggle:hover .alborn-nav__bar {
		background-color: rgba(0, 0, 0, 0.5);
	}

	.alborn-nav__panel {
		position: fixed;
		top: 0;
		left: -100vw;
		z-index: 1000;
		display: flex;
		flex-direction: column;
		width: 100%;
		max-width: 379px;
		height: 100%;
		padding-bottom: 10px;
		overflow-x: hidden;
		overflow-y: auto;
		background-color: #f7f7f7;
		transition: left 0.6s cubic-bezier(0.6, 0.1, 0.68, 0.53);
	}

	.alborn-nav.is-open .alborn-nav__panel {
		left: 0;
	}

	.alborn-nav__overlay {
		position: fixed;
		top: 0;
		left: -100%;
		z-index: 14;
		display: block;
		width: 100%;
		height: 100%;
		background-color: rgba(51, 51, 51, 0.5);
		transition: all 0.6s cubic-bezier(0.6, 0.1, 0.68, 0.53) 0.4s;
	}

	.alborn-nav.is-open .alborn-nav__overlay {
		left: 0;
		transition: all 0.6s cubic-bezier(0.22, 0.61, 0.24, 1) 0s;
	}

	.alborn-nav__head {
		position: relative;
		z-index: 5;
		display: block;
		width: 100%;
		padding: 15px;
	}

	.alborn-nav .alborn-nav__close {
		position: relative;
		z-index: 10;
		float: right;
		width: 50px;
		margin: 8px;
		padding: 10px;
		border: 0;
		border-radius: 0;
		font-size: 30px;
		color: #3b3b3b;
	}

	.alborn-nav .alborn-nav__close:hover {
		color: rgba(0, 0, 0, 0.5);
	}

	.alborn-nav__list {
		display: block;
		overflow-y: auto;
	}

	.alborn-nav .alborn-nav__list .alborn-nav__link {
		padding: 10px 15px;
	}

	.alborn-nav .has-children > .alborn-nav__link {
		padding-right: 15px;
	}

	.alborn-nav .alborn-nav__subtoggle {
		top: 10.25px; /* (47 px Zeilenhöhe − 26,5 px Pfeil) / 2 */
		right: 21px;
		padding: 4px 15px;
		border: 1px solid;
		border-radius: 30px;
	}

	.alborn-nav__sub {
		position: relative;
		display: none;
		border: 0;
	}

	.alborn-nav__item.is-open > .alborn-nav__sub {
		display: block;
		opacity: 1;
		visibility: visible;
	}

	.alborn-nav .alborn-nav__list .alborn-nav__sublink {
		padding: 15px;
		font-size: 12px;
	}
}

@media (max-width: 767px) {
	.alborn-nav.is-style-startseite .alborn-nav__toggle {
		border-width: 2px;
	}
}

/* ---------- Footer ---------- */

.alborn-footer {
	display: flex;
	padding: 20px 0;
	background-color: var(--wp--preset--color--anthrazit);
}

.alborn-footer__inner {
	display: flex;
	align-items: stretch;
	gap: 10px;
	width: 100%;
	max-width: 1140px;
	margin: 0 auto;
}

.alborn-footer__col {
	display: flex;
	flex-direction: column;
	gap: 20px;
	width: 100%;
	padding: 10px;
}

.alborn-footer__contact {
	padding: 20px;
	background-color: var(--wp--preset--color--gruen);
	color: #fff;
}

@media (max-width: 1024px) {
	.alborn-footer__inner {
		padding: 0 4%;
	}
}

@media (max-width: 767px) {
	.alborn-footer__inner {
		flex-wrap: wrap;
	}
}

.alborn-menu-list__list {
	margin: 0;
	padding: 0;
	list-style: none;
	line-height: normal;
}

.alborn-menu-list .menu-item a {
	display: flex;
	align-items: center;
	padding: 10px 0;
	font-family: var(--wp--preset--font-family--roboto);
	font-weight: 600;
	line-height: 20px;
	color: #fff;
	text-decoration: none;
}

.alborn-footer__contact p {
	margin: 0;
}

.alborn-footer__contact a,
.alborn-footer__contact a:hover {
	color: #fff;
}

.alborn-footer .wp-block-social-links.alborn-social {
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
	margin: 0;
	padding: 0;
	font-size: 20px;
	line-height: 0;
}

.alborn-footer .wp-block-social-links.alborn-social .wp-social-link {
	margin: 0;
	border-radius: 50%;
	background-color: #000;
	color: #fff;
}

.alborn-footer .wp-block-social-links.alborn-social .wp-block-social-link-anchor {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	padding: 0;
}

.alborn-footer .wp-block-social-links.alborn-social .alborn-social-icon {
	display: block;
	width: 20px;
	height: 20px;
	fill: #fff;
}

/* ---------- Startseite: Kopfbereich mit Video (bisher Elementor-Vorlage 2467/3305) ---------- */
/* Zeilenhöhen in em wie bei Elementor: rundet auf Subpixel anders als ein reiner Faktor. */

.alborn-hero {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 10px;
	min-height: 734px;
	padding: 10px;
}

/* Alle Inhalte über dem Video (wie die Elementor-Container: position relative). */
.alborn-hero > * {
	position: relative;
	flex-shrink: 0;
	width: 100%; /* wie Elementor-Container; nötig für den umbrechenden Aufbau auf dem Handy */
	margin: 0;
}

.alborn-hero > .alborn-header--home {
	margin-top: 1em;
}

@media (max-width: 767px) {
	.alborn-hero > .alborn-header--home {
		margin-top: 0;
	}
}

.alborn-hero > .alborn-hero__video {
	position: absolute;
	inset: 0;
	z-index: 0;
	overflow: hidden;
}

/* Mit .alborn-hero: der Videoblock bringt „.wp-block-video video { height: auto }“ mit und wird danach
   geladen – sonst nur 16:9 hoch, darunter weiße Fläche. */
.alborn-hero .alborn-hero__video video {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Grüne Fläche unten rechts über dem Video */
.alborn-hero__video::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	background: url("../img/hero-overlay.png") no-repeat 100% 100% / 65% auto;
}

/* Textbox „Innovative Lösungen …“ */
.alborn-hero > .alborn-hero__claim {
	display: flex;
	flex-direction: column;
	gap: 20px;
	width: 35%;
	margin: 5% 0 15% 10%;
	padding: 20px;
	background-color: rgba(0, 79, 56, 0.82);
}

/* Einzug und Schrift wachsen mit der Breite (volle Größe ab ca. 1450px) – mit festen 80px/35px ragte
   „Familientradition“ unter ca. 1400px rechts aus dem Kasten (auch schon bisher). */
.alborn-hero .alborn-hero__title {
	margin: 0;
	padding-left: clamp(30px, 5.5vw, 80px);
	font-family: var(--wp--preset--font-family--montserrat);
	font-size: clamp(24px, 2.42vw, 35px);
	font-style: italic;
	font-weight: 900;
	line-height: 1.3em;
	color: #fff;
}

/* Bisher mit der nicht vorhandenen Schrift „Roboto Lokal“ gesetzt – der Browser nimmt die
   Systemschrift. Auf dem Desktop bewusst so übernommen, damit die Darstellung gleich bleibt. */
.alborn-hero .alborn-hero__lead {
	padding-left: clamp(30px, 5.5vw, 80px); /* bündig mit der Überschrift (bisher 68px) */
	font-family: "Roboto Lokal", sans-serif;
	font-size: 17px;
	font-weight: 300;
	line-height: 1.2em;
	color: #fff;
}

/* Abstand unter dem Text wie bisher (0,9rem). Stärker als WordPress' „letztes Kind ohne Abstand“. */
.alborn-hero .alborn-hero__claim .alborn-hero__lead {
	margin: 0 0 0.9rem;
}

/* Kontaktbox */
.alborn-hero > .alborn-hero__contact {
	display: flex;
	flex-direction: column;
	align-self: flex-end;
	gap: 20px;
	width: 33.618%;
	padding: 10px;
}

.alborn-hero .alborn-hero__contact-title {
	margin: 0;
	font-family: var(--wp--preset--font-family--montserrat);
	font-size: 25px;
	font-style: italic;
	font-weight: 900;
	line-height: 1.3em;
	color: #fff;
}

.alborn-hero .alborn-hero__divider {
	width: 70px;
	height: 0;
	margin: 3px 0;
	border: 0;
	border-top: 4px solid var(--wp--preset--color--rot);
	opacity: 1;
}

.alborn-hero__contact-text > p {
	margin: 0;
}

.alborn-hero .alborn-hero__text {
	font-family: var(--wp--preset--font-family--roboto);
	font-size: 17px;
	line-height: normal;
	color: #fff;
}

.alborn-hero .alborn-hero__text--mail {
	line-height: 1.2em;
}

.alborn-hero .alborn-hero__text a,
.alborn-hero .alborn-hero__text a:hover {
	color: #fff;
	text-decoration: none;
}

.alborn-hero .alborn-hero__actions {
	display: block;
}

.alborn-hero .alborn-hero__film {
	display: block;
}

.alborn-hero .alborn-hero__film .wp-block-button__link {
	display: inline-block;
	padding: 15px;
	border-radius: 0;
	background-color: var(--wp--preset--color--rot);
	font-family: var(--wp--preset--font-family--montserrat);
	font-size: 18px;
	font-style: italic;
	font-weight: 900;
	line-height: 1;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	color: #fff;
	transition: transform 0.3s;
}

.alborn-hero .alborn-hero__film .wp-block-button__link:hover,
.alborn-hero .alborn-hero__film .wp-block-button__link:focus {
	transform: scale(1.1);
}

/* Pfeil nach unten */
.alborn-hero > .alborn-hero__more {
	text-align: center;
}

.alborn-hero__more a {
	position: relative;
	display: inline-block;
	width: 50px;
	height: 50px;
	font-size: 50px;
	line-height: 50px;
	color: #fff;
	text-decoration: none;
	transition: transform 0.3s;
}

.alborn-hero__more a::before {
	content: "\e874";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	font-family: "alborn-icons";
	font-style: normal;
	font-weight: 400;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.alborn-hero__more a:hover {
	color: var(--wp--preset--color--rot);
	transform: scale(0.9);
}

@media (max-width: 1024px) {
	.alborn-hero__video::after {
		background-size: 900px auto;
	}

	.alborn-hero > .alborn-hero__claim {
		align-items: center;
		justify-content: center;
		width: 50%;
		margin: 5% 0 15%;
		padding: 10px;
		background-color: rgba(0, 79, 56, 0.83);
	}

	.alborn-hero .alborn-hero__title {
		padding-left: 0;
		font-size: 18px;
	}

	.alborn-hero .alborn-hero__lead {
		padding-left: 0;
		font-family: var(--wp--preset--font-family--roboto);
		text-align: center;
	}

	.alborn-hero > .alborn-hero__contact {
		width: 33%;
	}

	.alborn-hero .alborn-hero__actions {
		margin-top: 20px;
	}
}

@media (max-width: 767px) {
	.alborn-hero {
		flex-wrap: wrap;
		justify-content: space-between;
	}

	.alborn-hero__video::after {
		background-size: 745px auto;
	}

	.alborn-hero > .alborn-hero__claim {
		width: 100%;
		margin: 0;
		padding: 20px;
	}

	.alborn-hero .alborn-hero__title,
	.alborn-hero .alborn-hero__contact-title {
		font-size: 23px;
	}

	.alborn-hero > .alborn-hero__contact {
		width: 100%;
	}

	.alborn-hero__more a {
		width: 25px;
		height: 25px;
		font-size: 25px;
		line-height: 25px;
	}
}

/* ---------- Video-Dialog (Imagefilm; bisher Elementor-Pro-Popup 3518) ---------- */

.alborn-dialog {
	position: fixed;
	inset: 0;
	z-index: 9999;
	display: none;
	align-items: center;
	justify-content: center;
	background-color: rgba(0, 0, 0, 0.8);
}

.alborn-dialog.is-open {
	display: flex;
}

.alborn-dialog__video {
	position: relative;
	width: 1300px;
	max-width: 100%;
	margin: 0;
	background-color: #fff;
	box-shadow: 2px 8px 23px 3px rgba(0, 0, 0, 0.2);
}

.alborn-dialog__video video {
	display: flex;
	width: 100%;
	aspect-ratio: 16 / 9; /* wie bisher: Größe steht schon vor dem Laden des Videos fest */
	background-color: #000;
	object-fit: cover;
}

.alborn-dialog__close {
	position: absolute;
	top: 20px;
	right: 20px;
	z-index: 9999;
	display: flex;
	padding: 0;
	border: 0;
	background: none;
	font-size: 15px;
	line-height: 1;
	cursor: pointer;
}

.alborn-dialog .alborn-dialog__close:hover,
.alborn-dialog .alborn-dialog__close:focus {
	background: none;
}

.alborn-dialog__close svg {
	width: 1em;
	height: 1em;
	fill: #1f2124;
}

body.alborn-dialog-open {
	overflow: hidden;
}

/* ---------- Seiteninhalte (Gutenberg) ----------
 * Bausteine, in die migration/lib/elementor-to-blocks.php die Elementor-Seiten übersetzt.
 * Maße wie die bisherigen Elementor-Container: Inhaltsbreite 1140 px, Abschnittsabstand 50 px,
 * Abstand zwischen Elementen 20 px. Präfix :is(.page-content, .is-root-container) = Seiteninhalt im Frontend bzw. im
 * Block-Editor; macht die Regeln zugleich stärker als WordPress' Flow-Layout
 * („letztes Kind ohne Abstand“, Spezifität 0,2,0).
 */

:is(.page-content, .is-root-container) .alborn-stack {
	display: flex;
	flex-direction: column;
	gap: 50px;
}

/* Abschnitt mit zentrierter Inhaltsbreite (bisher „boxed“-Container mit 10 px Innenabstand) */
:is(.page-content, .is-root-container) .alborn-section {
	display: flex;
	flex-direction: column;
	gap: 20px;
	padding: 10px max(10px, calc((100% - 1140px) / 2));
}

/* Allgemeiner Bereich (umgestellte Elementor-Container); Werte je Seite im Seiten-CSS */
:is(.page-content, .is-root-container) .alborn-con {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 20px;
	width: 100%;
	min-width: 0;
	padding: 10px;
}

/* Auf dem Handy brechen Zeilen um, sofern der Bereich nichts anderes festlegt (wie bei Elementor) */
@media (max-width: 767px) {
	:is(.page-content, .is-root-container) .alborn-con {
		flex-wrap: wrap;
	}
}

/* Elemente in Bereichen: dürfen schrumpfen, nie breiter als der Bereich (wie bei Elementor) */
:is(.page-content, .is-root-container) .alborn-con > .alborn-w {
	min-width: 0;
	max-width: 100%;
}

/* Breiter Abschnitt (Inhaltsbreite 1500 px) */
:is(.page-content, .is-root-container) .alborn-section--wide {
	padding-inline: max(10px, calc((100% - 1500px) / 2));
}

/* Abschnitt mit nebeneinanderliegenden Spalten (z. B. Bild | Text) */
:is(.page-content, .is-root-container) .alborn-section--row {
	flex-direction: row;
}

:is(.page-content, .is-root-container) .alborn-column,
:is(.page-content, .is-root-container) .alborn-box {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

:is(.page-content, .is-root-container) .alborn-column {
	width: 100%;
}

/* Container in voller Breite mit Standard-Innenabstand */
:is(.page-content, .is-root-container) .alborn-box {
	padding: 10px;
}

:is(.page-content, .is-root-container) .alborn-column--padded {
	padding: 10px;
}

/* 100 px Abstand oben/unten. Doppelte Klasse: stärker als WordPress' „erstes/letztes Kind
   ohne Abstand“ (0,2,0). */
:is(.page-content, .is-root-container) .alborn-section.alborn-mt-100 {
	margin-top: 100px;
}

:is(.page-content, .is-root-container) .alborn-section.alborn-mb-100 {
	margin-bottom: 100px;
}

/* Abschnitt ohne Innenabstand (Inhalt weiterhin auf 1140 px begrenzt) */
:is(.page-content, .is-root-container) .alborn-section.alborn-section--flush {
	padding: 0 max(0px, calc((100% - 1140px) / 2));
}

:is(.page-content, .is-root-container) .alborn-gap-10 {
	gap: 10px;
}

/* Volle Breite ohne Innenabstand */
:is(.page-content, .is-root-container) .alborn-full {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

/* Video in voller Breite, Format 16:9 */
:is(.page-content, .is-root-container) .alborn-video {
	margin: 0;
}

:is(.page-content, .is-root-container) .alborn-video video {
	display: flex;
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	background-color: #000;
}

/* Titelband: dunkler Hintergrund */
:is(.page-content, .is-root-container) .alborn-section--band {
	background-color: var(--wp--preset--color--anthrazit);
}

/* Abschnitt mit 20 px Innenabstand (z. B. Titelband der Leistungsseiten) */
:is(.page-content, .is-root-container) .alborn-section.alborn-section--pad-20 {
	padding: 20px max(20px, calc((100% - 1140px) / 2));
}

/* Überschrift mit eigener Gestaltung (Schrift, Größe, Farbe am Block) */
:is(.page-content, .is-root-container) .alborn-h {
	margin: 0;
	line-height: 1;
}

/* Link in einer Überschrift erbt die Farbe (wie Elementor) */
:is(.page-content, .is-root-container) .alborn-h a {
	color: inherit;
}

:is(.page-content, .is-root-container) .alborn-space-before {
	margin-top: 50px;
}

:is(.page-content, .is-root-container) .alborn-space-after {
	margin-bottom: 50px;
}

/* Text: mehrere Teile eines bisherigen Elementor-Textelements stehen ohne Elementabstand
   zusammen; Absätze und Zwischenüberschriften behalten die Abstände aus dem Grundstil. */
:is(.page-content, .is-root-container) .alborn-textblock {
	display: block;
}

:is(.page-content, .is-root-container) :is(p.alborn-copy, p.alborn-copy-legal, p.alborn-copy-light, p.alborn-copy-custom),
:is(.page-content, .is-root-container) .alborn-textblock p {
	margin: 0 0 0.9rem;
}

:is(.page-content, .is-root-container) .alborn-textblock :is(h1, h2, h3, h4, h5, h6) {
	margin: 0.5rem 0 1rem;
}

:is(.page-content, .is-root-container) :is(ul, ol).alborn-copy,
:is(.page-content, .is-root-container) .alborn-textblock :is(ul, ol) {
	margin: 0;
}

/* Textgestaltungen (bisher je Elementor-Textelement eingestellt) */
:is(.page-content, .is-root-container) .alborn-copy-light {
	font-family: var(--wp--preset--font-family--roboto);
	font-size: 18px;
	font-weight: 300;
	color: #000;
}

:is(.page-content, .is-root-container) .alborn-copy {
	font-size: 1.125rem;
	color: #000;
}

:is(.page-content, .is-root-container) .alborn-copy-legal {
	font-family: var(--wp--preset--font-family--roboto);
	font-size: 17px;
	font-weight: 300;
	color: var(--wp--preset--color--anthrazit);
}

/* Links in Textfarbe, unterstrichen (bisher eigenes CSS am Abschnitt) */
:is(.page-content, .is-root-container) .alborn-links-inherit a {
	color: inherit;
	text-decoration: underline;
}

/* Überschriften wie Elementors Standard: Größe der Ebene aus dem Grundstil, Gewicht 600,
   Zeilenhöhe 1; Farbe und abweichende Größe stehen am Block. */
:is(.page-content, .is-root-container) .alborn-heading {
	margin: 0;
	font-weight: 600;
	line-height: 1;
}

/* Karten mit Icon */
:is(.page-content, .is-root-container) .alborn-cards {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 50px;
}

:is(.page-content, .is-root-container) .alborn-card {
	display: flex;
	flex-direction: column;
	gap: 20px;
	padding: 50px;
	border-radius: 20px;
	box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.5);
}

:is(.page-content, .is-root-container) .alborn-card--stretch {
	align-self: stretch;
}

:is(.page-content, .is-root-container) .alborn-card__body {
	display: flex;
	flex-direction: column;
	gap: 20px;
	min-height: 230px;
}

/* Icon: wie bisher in einer Textzeile, daher 7 px Unterlänge unter dem Bild */
:is(.page-content, .is-root-container) .alborn-icon {
	margin: 0;
	text-align: center;
}

:is(.page-content, .is-root-container) .alborn-icon img {
	display: inline;
	vertical-align: baseline; /* Größe (100/150 px) steht am Bild */
	max-width: none; /* Elementor-Icons schrumpfen nicht mit dem Container */
}

/* Icon-Box: Icon links, Titel und Text rechts (Handy: untereinander) */
:is(.page-content, .is-root-container) .alborn-iconbox {
	display: flex;
	align-items: center;
	gap: 80px;
}

:is(.page-content, .is-root-container) .alborn-iconbox__icon {
	flex-shrink: 0;
	margin: 0;
	line-height: 0;
}

:is(.page-content, .is-root-container) .alborn-iconbox__icon img {
	display: block;
}

:is(.page-content, .is-root-container) .alborn-iconbox__content {
	flex-grow: 1;
}

:is(.page-content, .is-root-container) .alborn-iconbox .alborn-iconbox__title {
	margin: 0.5rem 0 1rem;
	font-weight: 600;
	line-height: 1.2;
}

:is(.page-content, .is-root-container) .alborn-iconbox__title a {
	color: inherit;
	text-decoration: none;
}

:is(.page-content, .is-root-container) .alborn-iconbox .alborn-iconbox__text {
	margin: 0;
}

/* Titel als einfacher Text (ohne Überschriften-Abstände) */
:is(.page-content, .is-root-container) .alborn-iconbox .alborn-iconbox__title--plain {
	margin: 0;
	line-height: 1.5;
}

/* Kompakte Icon-Box (z. B. Download mit PDF-Symbol): oben ausgerichtet, enger Abstand */
:is(.page-content, .is-root-container) .alborn-iconbox--compact {
	align-items: flex-start;
	gap: 14px;
}

:is(.page-content, .is-root-container) .alborn-iconbox--compact .alborn-iconbox__title {
	margin-bottom: 0;
}

/* Trennlinie: kurzer roter Balken (schrumpft wie bei Elementor in schmalen Spalten) */
:is(.page-content, .is-root-container) hr.alborn-divider {
	width: 70px;
	max-width: 100%;
	height: 0;
	margin: 3px 0;
	border: 0;
	border-top: 4px solid var(--wp--preset--color--rot);
	opacity: 1;
}

/* Weiß auf rotem Grund – nach der Grundregel, sonst gewinnt deren Rot (gleiche Spezifität) */
:is(.page-content, .is-root-container) hr.alborn-divider--weiss {
	border-top-color: var(--wp--preset--color--weiss);
}

/* Bildergalerie (WordPress-Galerie, Gestaltung wie bisher von Elementor) */
:is(.page-content, .is-root-container) .alborn-gallery {
	--gallery-gap: 25px;
	width: 100%;
}

:is(.page-content, .is-root-container) .alborn-gallery--gap-50 {
	--gallery-gap: 50px;
}

:is(.page-content, .is-root-container) .alborn-gallery .gallery {
	margin: 0 calc(-1 * var(--gallery-gap)) calc(-1 * var(--gallery-gap)) 0;
}

:is(.page-content, .is-root-container) .alborn-gallery .gallery-item {
	display: inline-block;
	width: 100%;
	max-width: 100%;
	margin: 0 auto;
	padding: 0 var(--gallery-gap) var(--gallery-gap) 0;
	text-align: center;
	vertical-align: top;
}

:is(.page-content, .is-root-container) .alborn-gallery .gallery-icon {
	padding: 0;
}

:is(.page-content, .is-root-container) .alborn-gallery .gallery-item img {
	display: block;
	margin: 0 auto;
}

:is(.page-content, .is-root-container) .alborn-gallery .gallery-caption {
	display: none;
}

@media (min-width: 768px) {
	:is(.page-content, .is-root-container) .alborn-gallery .gallery-columns-2 .gallery-item { max-width: 50%; }
	:is(.page-content, .is-root-container) .alborn-gallery .gallery-columns-3 .gallery-item { max-width: 33.33%; }
	:is(.page-content, .is-root-container) .alborn-gallery .gallery-columns-4 .gallery-item { max-width: 25%; }
}

@media (min-width: 480px) and (max-width: 767px) {
	:is(.page-content, .is-root-container) .alborn-gallery .gallery .gallery-item { max-width: 50%; }
}

/* Abschnitt mit senkrecht zentriertem Inhalt (z. B. Titelbild) */
:is(.page-content, .is-root-container) .alborn-section--center {
	justify-content: center;
}

/* Bild in voller Breite der Spalte */
:is(.page-content, .is-root-container) .alborn-image {
	margin: 0;
	text-align: center;
}

:is(.page-content, .is-root-container) .alborn-image--left {
	text-align: left;
}

:is(.page-content, .is-root-container) .alborn-image--right {
	text-align: right;
}

:is(.page-content, .is-root-container) .alborn-image img {
	display: inline-block;
	max-width: 100%;
	height: auto;
	vertical-align: middle;
}

/* Abschnitt mit verblasstem Hintergrundbild (bisher Elementor-Überlagerung, 50 % Deckkraft) */
:is(.page-content, .is-root-container) .alborn-section--faded {
	position: relative;
}

:is(.page-content, .is-root-container) .alborn-section--faded::before {
	content: "";
	position: absolute;
	inset: 0;
	background-color: rgba(255, 255, 255, 0.5);
}

:is(.page-content, .is-root-container) .alborn-section--faded > * {
	position: relative;
}

/* 3 % Innenabstand oben/unten, seitlich nur Begrenzung auf 1140 px */
:is(.page-content, .is-root-container) .alborn-section.alborn-section--pad-y-3pct {
	padding: 3% max(0px, calc((100% - 1140px) / 2));
}

/* Links in Textfarbe (bisher eigenes CSS am Abschnitt) */
:is(.page-content, .is-root-container) .alborn-links-color a {
	color: inherit;
}

/* Flip-Box (bisher Essential Addons): dreht sich beim Überfahren, Rückseite mit Kontaktdaten */
:is(.page-content, .is-root-container) .alborn-flipbox {
	position: relative;
	width: 100%;
	height: 250px;
	overflow: hidden;
	perspective: 1000px;
}

:is(.page-content, .is-root-container) .alborn-flipbox__card {
	width: 100%;
	height: 100%;
	transform-style: preserve-3d;
	transition: all 500ms ease;
}

:is(.page-content, .is-root-container) .alborn-flipbox:hover .alborn-flipbox__card,
:is(.page-content, .is-root-container) .alborn-flipbox:focus-within .alborn-flipbox__card {
	transform: rotateY(180deg);
}

:is(.page-content, .is-root-container) .alborn-flipbox__front,
:is(.page-content, .is-root-container) .alborn-flipbox__back {
	position: absolute;
	top: 0;
	left: 0;
	display: flex;
	align-items: center;
	width: 100%;
	height: 100%;
	border-radius: 5px;
	text-align: center;
	backface-visibility: hidden;
	transition: all 500ms ease;
}

:is(.page-content, .is-root-container) .alborn-flipbox__front {
	z-index: 2;
	transform: rotateY(0deg);
}

:is(.page-content, .is-root-container) .alborn-flipbox__back {
	transform: rotateY(180deg);
}

/* 24 px oben: bisher eine leere Icon-Zeile über dem Titel */
:is(.page-content, .is-root-container) .alborn-flipbox__inner {
	width: 100%;
	padding: 24px 30px 5px;
}

:is(.page-content, .is-root-container) .alborn-flipbox .alborn-flipbox__title {
	margin: 0.5rem 0 1rem;
	font-size: 2rem;
	font-weight: 500;
	line-height: 1.2;
}

:is(.page-content, .is-root-container) .alborn-flipbox .alborn-flipbox__text {
	margin: 0 0 0.9rem;
}

:is(.page-content, .is-root-container) .alborn-flipbox .alborn-flipbox__text--plain {
	margin: 0;
}

:is(.page-content, .is-root-container) .alborn-flipbox__text a {
	color: inherit;
}

/* Aufklappbare Einträge (bisher Elementor-Akkordeon) */
:is(.page-content, .is-root-container) .alborn-details-list {
	display: block;
}

:is(.page-content, .is-root-container) .alborn-details {
	display: flex;
	flex-direction: column;
	margin: 0;
}

:is(.page-content, .is-root-container) .alborn-details > summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0 10px;
	padding: 20px;
	border-bottom: 1px solid #d5d8dc;
	background-color: var(--wp--preset--color--rot);
	font-size: 1.5rem;
	font-weight: 700;
	line-height: 1.2;
	color: #fff;
	list-style: none;
	cursor: pointer;
}

:is(.page-content, .is-root-container) .alborn-details > summary::-webkit-details-marker {
	display: none;
}

:is(.page-content, .is-root-container) .alborn-details > summary::after {
	content: "";
	flex-shrink: 0;
	width: 12.5px;
	height: 25px;
	background: url("../icons/angle-right-white.svg") no-repeat center / contain;
}

:is(.page-content, .is-root-container) .alborn-details__content {
	display: flex;
	flex-direction: column;
	gap: 20px;
	padding: 10px;
	border: 1px solid #d5d8dc;
}

/* Bildleiste (bisher Bild-Akkordeon): Bild unter der Maus wird breiter (bis 800 px untereinander, dann höher) */
:is(.page-content, .is-root-container) .alborn-accordion {
	display: flex;
	overflow: hidden;
	border-radius: 4px;
}

:is(.page-content, .is-root-container) .alborn-accordion__item {
	position: relative;
	flex: 1;
	overflow: hidden;
	cursor: pointer;
	transition: flex 0.4s;
}

:is(.page-content, .is-root-container) .alborn-accordion__item::before {
	content: "";
	position: absolute;
	inset: 0;
	background-color: rgba(0, 0, 0, 0.3);
	transition: all 0.3s ease-in-out;
}

:is(.page-content, .is-root-container) .alborn-accordion__item:hover {
	flex: 3;
}

:is(.page-content, .is-root-container) .alborn-accordion__item:hover::before {
	background-color: rgba(0, 0, 0, 0.5);
}

/* Variante mit Texten: Titel und Text erscheinen, wenn die Maus über dem Bild ist */
:is(.page-content, .is-root-container) .alborn-accordion--text .alborn-accordion__item {
	color: #fff;
	text-align: center;
}

:is(.page-content, .is-root-container) .alborn-accordion__overlay {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 10px;
}

:is(.page-content, .is-root-container) .alborn-accordion__inner {
	z-index: 1;
}

:is(.page-content, .is-root-container) .alborn-accordion__inner > * {
	visibility: hidden;
	opacity: 0;
	transform-style: preserve-3d;
}

:is(.page-content, .is-root-container) .alborn-accordion__title.alborn-accordion__title {
	margin: 0.5rem 0 1rem;
	transform: translate3d(0, -60px, 0);
}

:is(.page-content, .is-root-container) .alborn-accordion__text.alborn-accordion__text {
	margin: 0;
	transform: translate3d(0, 60px, 0);
}

:is(.page-content, .is-root-container) .alborn-accordion__item:hover .alborn-accordion__inner > * {
	visibility: visible;
	opacity: 1;
	transform: none;
	transition: all 0.3s 0.3s;
}

@media screen and (max-width: 800px) {
	:is(.page-content, .is-root-container) .alborn-accordion {
		flex-direction: column;
	}
}

/* Trennbild mit feststehendem Hintergrund (Bild am Block gepflegt) */
:is(.page-content, .is-root-container) .alborn-parallax {
	min-height: 500px;
}

/* Button */
:is(.page-content, .is-root-container) .alborn-buttons {
	display: block;
}

:is(.page-content, .is-root-container) .alborn-buttons--center {
	text-align: center;
}

:is(.page-content, .is-root-container) .alborn-button {
	display: block;
}

:is(.page-content, .is-root-container) .alborn-button .wp-block-button__link {
	display: inline-block;
	padding: 12px 24px;
	border-radius: 3px;
	font-family: var(--wp--preset--font-family--roboto);
	font-size: 15px;
	font-weight: 500;
	line-height: 1;
	color: #fff;
	text-decoration: none;
}

:is(.page-content, .is-root-container) .alborn-button--p15 .wp-block-button__link {
	padding: 15px 20px;
}

/* Button mit eigener Gestaltung (Werte am Block); Wörter nicht mittendrin trennen (wie Elementor) */
:is(.page-content, .is-root-container) :is(.alborn-button, .alborn-btn) .wp-block-button__link {
	word-break: normal;
}

@media (max-width: 1024px) {
	:is(.page-content, .is-root-container) .alborn-heading.alborn-size-tablet-2 {
		font-size: 2rem !important; /* überschreibt die Größe am Block */
	}

	:is(.page-content, .is-root-container) .alborn-card {
		padding: 25px;
	}

	:is(.page-content, .is-root-container) .alborn-card__body {
		min-height: 330px;
	}

	/* Wie bisher bei Elementor: feststehend nur auf dem Desktop. „!important“ überschreibt die
	   Werte, die WordPress aus den Block-Einstellungen inline setzt. */
	/* Icon-Box: auf dem Tablet Icon oben, alles zentriert */
	:is(.page-content, .is-root-container) .alborn-iconbox--stack-tablet {
		flex-direction: column;
		align-items: stretch;
		text-align: center;
	}

	:is(.page-content, .is-root-container) .alborn-iconbox--stack-tablet .alborn-iconbox__icon img {
		margin: 0 auto;
	}

	:is(.page-content, .is-root-container) .alborn-parallax {
		min-height: 250px;
		background-position: 0 -150px !important;
		background-attachment: scroll !important;
	}
}

@media (max-width: 767px) {
	:is(.page-content, .is-root-container) .alborn-heading.alborn-size-mobile-1-5 {
		font-size: 1.5rem !important;
	}

	:is(.page-content, .is-root-container) .alborn-center-mobile {
		text-align: center;
	}

	:is(.page-content, .is-root-container) .alborn-section--gap-50-mobile {
		gap: 50px;
	}

	/* Abstand vor/nach dem Abschnitt auf dem Handy weglassen */
	:is(.page-content, .is-root-container) .alborn-collapse-mobile {
		margin-top: 0;
		margin-bottom: 0;
	}

	:is(.page-content, .is-root-container) .alborn-cards {
		grid-template-columns: 1fr;
	}

	:is(.page-content, .is-root-container) .alborn-section--row {
		flex-wrap: wrap;
	}

	:is(.page-content, .is-root-container) .alborn-iconbox {
		flex-direction: column;
		align-items: stretch;
	}

	:is(.page-content, .is-root-container) .alborn-iconbox--tight-mobile {
		gap: 0;
	}

	:is(.page-content, .is-root-container) .alborn-inset-mobile {
		padding: 0 2% 0 5%;
	}

	/* Kartenreihe: auf dem Handy volle Breite (überschreibt die Breite am Block) */
	:is(.page-content, .is-root-container) .alborn-card-row > .alborn-card {
		flex-basis: 100%;
	}

	:is(.page-content, .is-root-container) .alborn-parallax.alborn-parallax--tall-mobile {
		min-height: 250px;
		background-position: 0 0 !important;
	}

	:is(.page-content, .is-root-container) .alborn-parallax {
		min-height: 150px;
		background-position: 50% 50% !important;
	}
}

/* Startseite, Abschnitt „Karriere“ (de/en): Foto mit eingebrannter grüner Schräge (mxg.png), „cover“ von
   links oben. Unter 1536px ist der Abschnitt im Verhältnis höher, das Foto wird rechts beschnitten und
   Überschrift samt Strich ragten links aus dem Grün. Foto nach links schieben und etwas größer, unten
   ausgerichtet – Überschrift bleibt auf dem Grün, vom LKW mindestens die Hälfte sichtbar.
   body: stärker als die Regeln aus dem Inhalt (alborn-theme-inline-css, danach geladen). */
@media (min-width: 1025px) and (max-width: 1535px) {
	:root body .alborn-e-23d3794.alborn-con {
		background-position: 40% 100%;
		background-size: auto 120%;
	}
}

/* ---------- Formulare (Contact Form 7; bisher Elementor-Pro-Formulare) ----------
   Markup aus migration/03-formulare.php, Maße wie das Elementor-Formular (Beschriftung oben,
   Feldabstand 10 px, Größe „sm“). Innenabstand der Eingabefelder kommt wie dort aus base.css
   (input[type=…] schlägt die Feldregel), bei Textfeldern gilt 5px 14px. */
.alborn-form .alborn-form__fields {
	display: flex;
	flex-wrap: wrap;
	margin: 0 -5px -10px;
}

.alborn-form .alborn-form__group {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	width: 100%;
	min-height: 1px;
	padding: 0 5px;
	margin-bottom: 10px;
}

.alborn-form .alborn-form__label {
	cursor: pointer;
	font-size: 16px;
	font-weight: 400;
}

.alborn-form .wpcf7-form-control-wrap {
	display: block;
	flex-basis: 100%;
	max-width: 100%;
}

:where(.alborn-form) .alborn-form__field {
	border-radius: 3px;
	font-size: 15px;
	line-height: 1.4;
	min-height: 40px;
	padding: 5px 14px;
}

.alborn-form .alborn-form__field {
	display: block;
	background-color: transparent;
	border: 1px solid #69727d;
	color: #1f2124;
	flex-grow: 1;
	max-width: 100%;
	vertical-align: middle;
	width: 100%;
	font-weight: 400;
}

.alborn-form .alborn-form__field:focus {
	box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .1);
	outline: 0;
}

.alborn-form .alborn-form__field::placeholder {
	color: inherit;
	font-family: inherit;
	opacity: .6;
}

.alborn-form .alborn-form__files {
	display: block;
	width: 100%;
	max-width: 100%;
}

/* Datenschutz-Zustimmung: Kästchen + Text in einer Zeile (24 px) */
.alborn-form .wpcf7-acceptance {
	display: block;
}

.alborn-form .wpcf7-list-item {
	display: block;
	margin: 0;
}

/* Wie bei Elementor: Kästchen in der 24-px-Zeile, nur der Text als Label (Zeilenhöhe 1, mittig) */
.alborn-form .wpcf7-list-item label {
	display: contents;
}

.alborn-form .wpcf7-list-item input {
	display: inline-block;
	vertical-align: baseline;
	cursor: pointer;
}

.alborn-form .wpcf7-list-item-label {
	line-height: 1;
	vertical-align: middle;
	cursor: pointer;
}

.alborn-form .alborn-form__group--submit {
	align-items: flex-end;
}

.alborn-form .alborn-form__button {
	display: block;
	flex-basis: 100%;
	min-height: 40px;
	padding: 0 24px;
	border: none;
	border-radius: 3px;
	color: #fff;
	font-size: 15px;
	font-weight: 500;
	line-height: 1;
	text-align: center;
	white-space: normal;
	cursor: pointer;
	transition: all .3s;
}

.alborn-form .alborn-form__button:hover,
.alborn-form .alborn-form__button:focus {
	color: #fff;
}

/* Kontakt (2692/3299) */
.alborn-form--kontakt .alborn-form__label,
.alborn-form--kontakt .wpcf7-list-item-label {
	color: var(--wp--preset--color--mittelgrau);
}

.alborn-form--kontakt .alborn-form__field {
	background-color: #fff;
	color: var(--wp--preset--color--mittelgrau);
}

.alborn-form--kontakt .alborn-form__button {
	background-color: var(--wp--preset--color--rot);
}

/* Bewerbung (globale Widgets 2664/3296): Felder grün getönt, Button 20 % breit */
.alborn-form--bewerbung .alborn-form__label,
.alborn-form--bewerbung .wpcf7-list-item-label,
.alborn-form--bewerbung .alborn-form__field,
.alborn-form--bewerbung .alborn-form__files {
	color: #000;
}

.alborn-form--bewerbung .alborn-form__field,
.alborn-form--bewerbung .alborn-form__files {
	background-color: rgba(0, 79, 56, .13);
	border-color: rgba(2, 1, 1, .18);
}

.alborn-form--bewerbung .wpcf7-list-item input {
	background-color: rgba(0, 79, 56, .13);
}

.alborn-form--bewerbung .alborn-form__button {
	background-color: #23a455;
}

@media (min-width: 768px) {
	.alborn-form--bewerbung .alborn-form__group--submit {
		width: 20%;
	}
}

/* Meldungen von Contact Form 7 */
.alborn-form .wpcf7-not-valid-tip {
	font-size: 14px;
}

.alborn-form .wpcf7-response-output {
	margin: 20px 0 0;
}

/* Google-Karte (bisher Elementor-Widget „google_maps“) */
.alborn-map {
	overflow: hidden;
	line-height: 0;
}

.alborn-map iframe {
	display: inline;
	width: 100%;
	max-width: 100%;
	height: 300px;
	margin: 0;
	border: none;
	line-height: 1;
}

/* ---------- Großansicht (bisher Elementor-Lightbox; assets/js/lightbox.js) ----------
   Maße und Farben wie Elementor: Hintergrund 80 % Schwarz, Bedienelemente rgba(237,237,237,.9),
   Bild mit 70 px Rand (Handy: nur oben/unten), Pfeile über 15 % (Handy 20 %) der Breite. */
.alborn-lightbox-open {
	overflow: hidden;
}

.alborn-lightbox {
	--alborn-lb-ui: rgba(237, 237, 237, 0.9);
	--alborn-lb-ui-hover: #fff;
	position: fixed;
	inset: 0;
	z-index: 9999;
	display: none;
	overflow: hidden;
	background-color: rgba(0, 0, 0, 0.8);
	font-family: var(--wp--preset--font-family--roboto);
	user-select: none;
	-webkit-tap-highlight-color: transparent;
}

.alborn-lightbox.is-open {
	display: block;
}

.alborn-lightbox:focus {
	outline: none;
}

.alborn-lightbox.is-opening .alborn-lightbox__track {
	animation: alborn-lb-zoom-in 0.3s;
}

@keyframes alborn-lb-zoom-in {
	from {
		opacity: 0;
		transform: scale3d(0.3, 0.3, 0.3);
	}

	50% {
		opacity: 1;
	}
}

.alborn-lightbox button {
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: none;
	color: var(--alborn-lb-ui);
	font: inherit;
	line-height: 1;
	cursor: pointer;
}

.alborn-lightbox button:hover,
.alborn-lightbox button:focus {
	background: none;
}

.alborn-lightbox__icon {
	display: block;
	width: 1em;
	height: 1em;
	fill: currentColor;
}

/* Bilder nebeneinander, 100 px Abstand wie bei Elementor (Swiper) */
.alborn-lightbox__track {
	display: flex;
	height: 100%;
	cursor: grab;
}

.alborn-lightbox__track.is-animated {
	transition: transform 0.3s ease-out;
}

.alborn-lightbox__slide {
	position: relative;
	display: flex;
	flex: 0 0 100vw;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	height: 100%;
	margin-right: 100px;
	padding: 70px;
	overflow: hidden;
}

.alborn-lightbox__image {
	display: block;
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
	border-radius: 2px;
	box-shadow: 0 0 30px rgba(0, 0, 0, 0.3), 0 0 8px -5px rgba(0, 0, 0, 0.3);
	transition: transform 0.3s;
}

.alborn-lightbox.is-zoomed .alborn-lightbox__image {
	transition: none;
	cursor: move;
}

/* Kopfzeile: Zähler links, Werkzeuge rechts */
.alborn-lightbox__header {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10;
	display: flex;
	flex-direction: row-reverse;
	align-items: center;
	box-sizing: border-box;
	width: 100%;
	padding: 15px 52px 15px 20px;
	color: var(--alborn-lb-ui);
	font-size: 20px;
	line-height: 30px;
	transition: 0.3s;
}

.alborn-lightbox__counter {
	margin-right: auto;
	font-size: 0.75em;
	line-height: 1.5;
	width: max-content;
}

.alborn-lightbox__header .alborn-lightbox__tool {
	margin: 0 0.35em;
	padding: 0.25em;
}

.alborn-lightbox .alborn-lightbox__tool:hover,
.alborn-lightbox .alborn-lightbox__close:hover,
.alborn-lightbox .alborn-lightbox__nav:hover {
	color: var(--alborn-lb-ui-hover);
}

.alborn-lightbox__tool .is-on,
.alborn-lightbox__tool[aria-checked="true"] .is-off {
	display: none;
}

.alborn-lightbox__tool[aria-checked="true"] .is-on {
	display: block;
}

.alborn-lightbox .alborn-lightbox__close {
	position: absolute;
	top: 13px;
	right: 15px;
	z-index: 11; /* wie bei Elementor auch über dem abgedunkelten Teilen-Hintergrund */
	display: flex;
	padding: 5px !important;
	font-size: 20px;
	transition: 0.3s;
}

.alborn-lightbox .alborn-lightbox__nav {
	position: absolute;
	top: 0;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 15%;
	height: 100%;
	font-size: 25px;
	transition: 0.3s;
}

.alborn-lightbox__nav--prev {
	left: 0;
}

.alborn-lightbox__nav--next {
	right: 0;
}

.alborn-lightbox__nav[hidden] {
	display: none;
}

/* Bedienelemente ausblenden (Klick aufs Bild) und Zoom-Modus */
.alborn-lightbox.is-ui-hidden .alborn-lightbox__header,
.alborn-lightbox.is-ui-hidden .alborn-lightbox__nav {
	opacity: 0;
	pointer-events: none;
}

.alborn-lightbox.is-zoomed .alborn-lightbox__header {
	background-color: rgba(0, 0, 0, 0.5);
}

.alborn-lightbox.is-zoomed .alborn-lightbox__nav {
	opacity: 0;
	pointer-events: none;
}

/* Teilen */
.alborn-lightbox__share {
	position: absolute;
	width: 0;
	height: 0;
	overflow: hidden;
	background-color: transparent;
	transition: background-color 0.4s;
}

.alborn-lightbox.is-sharing .alborn-lightbox__share {
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	background-color: rgba(0, 0, 0, 0.5);
	cursor: default;
}

.alborn-lightbox__share-links {
	position: absolute;
	top: 3em;
	right: 2.8em;
	min-width: 200px;
	padding: 14px 20px;
	border-radius: 3px;
	background-color: #fff;
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
	opacity: 0;
	transform: scale(0);
	transform-origin: 90% 10%;
	transition: all 0.25s 0.1s;
}

.alborn-lightbox__share-links::before {
	content: "";
	position: absolute;
	top: 1px;
	right: 0.5em;
	display: block;
	border: 0.45em solid transparent;
	border-bottom-color: #fff;
	transform: translateY(-100%) scaleX(0.7);
}

.alborn-lightbox.is-sharing .alborn-lightbox__share-links {
	opacity: 1;
	transform: scale(1);
}

.alborn-lightbox__share-links a {
	display: block;
	color: #0c0d0e;
	font-size: 12px;
	line-height: 2.5;
	text-align: left;
	text-decoration: none;
}

.alborn-lightbox__share-links a:hover {
	color: #000;
}

.alborn-lightbox__share-links .alborn-lightbox__icon {
	display: inline;
	width: 1.25em;
	height: 1.25em;
	margin-right: 0.75em;
}

.alborn-lightbox__share-links [data-share="facebook"] .alborn-lightbox__icon {
	fill: #3b5998;
}

.alborn-lightbox__share-links [data-share="x"] .alborn-lightbox__icon {
	fill: #000;
}

.alborn-lightbox__share-links [data-share="pinterest"] .alborn-lightbox__icon {
	fill: #bd081c;
}

.alborn-lightbox__share-links [data-share="download"] .alborn-lightbox__icon {
	fill: #9da5ae;
}

@media (max-width: 767px) {
	.alborn-lightbox__slide {
		padding: 70px 0;
	}

	.alborn-lightbox .alborn-lightbox__nav {
		width: 20%;
	}

	.alborn-lightbox .alborn-lightbox__nav--prev {
		justify-content: flex-start;
	}

	.alborn-lightbox .alborn-lightbox__nav--next {
		justify-content: flex-end;
	}
}

/* ---------- Einblenden (bisher Elementor-Animationen; assets/js/animate.js) ----------
   Wie Elementor: unsichtbar, bis das Element in den sichtbaren Bereich kommt, dann 1,25 s
   Animation. Ohne JavaScript sichtbar (noscript in functions.php), im Editor siehe editor.css. */
.alborn-animate:not(.is-animated) {
	visibility: hidden;
}

.alborn-animate.is-animated {
	animation-duration: 1.25s;
}

.alborn-animate--fadeInUp.is-animated {
	animation-name: alborn-fadeInUp;
}

@keyframes alborn-fadeInUp {
	from {
		opacity: 0;
		transform: translate3d(0, 100%, 0);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.alborn-animate.is-animated {
		animation: none;
	}
}
