/* V. Jalba – Design D „Konzertsaal“: Basis-Stile.
   Farben/Klassen der Seiten kommen aus den V4-Variablen und -Klassen (Elementor).
   Hier nur, was V4 nicht abdeckt: Grundtypografie, Fokus, Tastenleiste. */

:root {
	--jalba-cream: #f5f1ea;
	--jalba-sand: #ebe3d4;
	--jalba-light: #fffdf8;
	--jalba-line: #d9d0c0;
	--jalba-ink: #16130f;
	--jalba-text: #4a443b;
	--jalba-accent: #7a5418;
	--jalba-gold: #c9a35a;
	--jalba-text-on-dark: #e9e1d2;
	--jalba-serif: "Source Serif", Georgia, "Times New Roman", serif;
	--jalba-ui: "Source Sans", "Helvetica Neue", Arial, sans-serif;
	--jalba-body: "Source Sans", "Helvetica Neue", Arial, sans-serif;
}

body {
	background: var(--jalba-cream);
	color: var(--jalba-text);
	font-family: var(--jalba-body);
	font-size: 17.5px;
	line-height: 1.62;
}

h1, h2, h3, h4 {
	font-family: var(--jalba-serif);
	color: var(--jalba-ink);
}

a { color: var(--jalba-ink); }
a:hover { color: var(--jalba-accent); }

/* Fokus sichtbar (WCAG 2.4.7) */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
	outline: 2px solid var(--jalba-accent);
	outline-offset: 3px;
}

/* Source Serif als variable Schrift: Überschriften und Zahlen in Stärke 650
   (V4-Klassen speichern nur 100er-Stufen, dort steht 700). */
body .elementor :is(.h-display, .h-page, .h-section, .h-item, .dark-cell-title, .info-title, .step-title, .legal-h2, .roman, .stat-number, .phone-big, .m-link) {
	font-weight: 650;
}

/* Kursive Akzente in Überschriften (V4-Klassen h-display, h-page, h-section, h-item) */
.h-display em, .h-page em, .h-section em, .h-item em {
	font-style: italic;
	font-weight: 600;
	color: var(--jalba-accent);
}
.section-ink em, .heading-on-dark em { color: var(--jalba-gold); }

/* Brotkrümel: Trenner „·“ als <span> */
.crumb span { color: var(--jalba-accent); margin: 0 .35em; }
.crumb a { color: var(--jalba-text); }

/* Leistungszeile: Pfeil füllt sich beim Hover, Text ab Tablet ausblenden */
.elementor .arrow-box { transition: background-color .25s, color .25s; }
.elementor .service-row:hover .arrow-box,
.elementor .service-row:focus-visible .arrow-box { background-color: var(--jalba-ink); }
.elementor .service-row:hover .arrow-box *,
.elementor .service-row:focus-visible .arrow-box * { color: var(--jalba-cream); }
@media (max-width: 1024px) {
	.elementor .service-row > p:not(.roman) { display: none; }
}

/* Zahlenband: Zellen auf dem Handy oben statt links trennen */
@media (max-width: 767px) {
	.elementor .stat-cell { border-left: 0; border-top: 1px solid #3a342b; padding: 24px 0; }
}

/* Trennlinie „Ornament“ zwischen großen Blöcken (Variante A, 01.11.2026):
   Linie mit Raute in der Mitte. V4-Klasse „keys“ (aria-hidden) – Name historisch. */
.keys, .elementor .keys {
	position: relative;
	height: 46px;
	background: var(--jalba-light);
	border-top: 1px solid var(--jalba-line);
	border-bottom: 1px solid var(--jalba-line);
}
/* .e-con::before (Elementor-Overlay) setzt Höhe, Position und Rahmen – hier vollständig überschreiben */
.keys::before, .elementor .keys.e-con::before {
	content: "";
	display: block;
	position: absolute;
	left: 24px;
	right: 24px;
	top: 50%;
	width: auto;
	height: 0;
	margin: 0;
	padding: 0;
	opacity: 1;
	mix-blend-mode: normal;
	background: none;
	border: 0;
	border-radius: 0;
	border-top: 1px solid var(--jalba-ink);
}
.keys::after, .elementor .keys.e-con::after {
	content: "";
	box-sizing: content-box; /* Elementor setzt border-box – Raute sonst 1px über der Linie */
	position: absolute;
	left: 50%;
	top: 50%;
	width: 11px;
	height: 11px;
	margin: -6px 0 0 -6px;
	transform: rotate(45deg);
	background: var(--jalba-light);
	border: 1px solid var(--jalba-accent);
	box-shadow: 0 0 0 7px var(--jalba-light), -22px 22px 0 -3px var(--jalba-accent), 22px -22px 0 -3px var(--jalba-accent);
}

/* ===== V4: Absatz mit Link =====
   e-paragraph mit Link rendert <p class="…"><a class="e-paragraph-link-base">.
   Der Link erbt Farbe und Schrift vom <p> (Hover-Farben stehen in den V4-Klassen). */
.elementor :is(.nav-link, .nav-sub-link, .m-link, .m-sub, .ftr-link) > a,
.elementor :is(.nav-link, .nav-sub-link, .m-link, .m-sub, .ftr-link) > a:is(:hover, :focus-visible) {
	color: inherit;
	font: inherit;
	text-decoration: none;
}
.elementor .nav-sub-link > a { display: flex; align-items: baseline; gap: 14px; padding: 12px 24px; }
.elementor .m-link > a { display: flex; align-items: center; width: 100%; min-height: 64px; }
.elementor .m-sub > a { display: flex; align-items: center; gap: 14px; width: 100%; min-height: 48px; }
.elementor .nav-link > a { display: inline-block; padding: 10px 0; }
/* Große Telefonnummer auf dunklem Grund (Kontakt, „Lieber anrufen?“): Gold vom <p>, Hover Creme */
.elementor .phone-big > a { color: inherit; font: inherit; text-decoration: none; }
.elementor .phone-big > a:is(:hover, :focus-visible) { color: var(--jalba-cream); }

/* Bildfilter (V4 speichert filter nicht) */
.elementor .sepia { filter: sepia(.25); }

/* ===== Kopfzeile ===== */
.elementor .hdr-top a { color: var(--jalba-gold); text-decoration: none; }
.elementor .hdr-top a:hover { color: var(--jalba-cream); }

/* Untermenü: Hover, Tastatur (focus-within) und per Skript (.is-open) */
.elementor .nav-dd:hover > .nav-sub,
.elementor .nav-dd:focus-within > .nav-sub,
.elementor .nav-dd.is-open > .nav-sub { display: flex; }
.nav-sub-link span {
	min-width: 28px;
	font-family: var(--jalba-serif);
	color: var(--jalba-accent);
}
.elementor .nav-link a[aria-current="page"] { color: var(--jalba-accent); }

/* Burger: drei Linien, Text nur für Screenreader */
.elementor .burger { position: relative; align-items: center; justify-content: center; }
.elementor .burger::before {
	content: "";
	width: 22px;
	height: 2px;
	background: currentColor;
	box-shadow: 0 -7px 0 currentColor, 0 7px 0 currentColor;
}
.elementor .m-close { position: relative; align-items: center; justify-content: center; }
.elementor .m-close::before,
.elementor .m-close::after {
	content: "";
	position: absolute;
	width: 22px;
	height: 2px;
	background: currentColor;
	transform: rotate(45deg);
}
.elementor .m-close::after { transform: rotate(-45deg); }
.burger span, .m-close span {
	position: absolute !important;
	width: 1px; height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

/* Mobilmenü (Panel) */
.elementor .m-panel.is-open { display: flex; }
.jalba-menu-open, .jalba-menu-open body { overflow: hidden; }
.m-sub span {
	min-width: 30px;
	font-family: var(--jalba-serif);
	color: var(--jalba-gold);
}
.elementor .m-link a[aria-current="page"] { color: var(--jalba-gold); }
.m-panel .btn { width: 100%; }

/* Fokus auf dunklem Grund: Gold statt Braun (Kontrast) */
.m-panel a:focus-visible, .m-panel button:focus-visible,
.ftr a:focus-visible, .hdr-top a:focus-visible, .section-ink a:focus-visible {
	outline-color: var(--jalba-gold);
}

/* ===== Fußzeile ===== */
.ftr a { text-decoration: none; }
.elementor .ftr a.ftr-small, .elementor .ftr-bottom a { font-size: 15.5px; }

/* Gewichtstafel (Tresor): Einheit kleiner */
.weight-number span { font-size: .45em; }

/* Galerie: aktiver Filter (V4-Tabs) */
.elementor .chip[aria-selected="true"],
.elementor .chip.e--selected,
.elementor .chip[aria-selected="true"]:hover { background-color: var(--jalba-ink); color: var(--jalba-cream); }
.elementor .chip-label { color: inherit; }

/* ===== Häufige Fragen (V4-Akkordeon: <details>/<summary>) ===== */
.faq summary {
	list-style: none;
	display: flex; justify-content: space-between; align-items: center; gap: 20px;
	padding: 26px 0;
	cursor: pointer;
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after {
	content: "+";
	flex: 0 0 auto;
	font-family: var(--jalba-ui); font-size: 26px; line-height: 1;
	color: var(--jalba-accent);
	transition: transform .25s;
}
.faq details[open] > summary::after { transform: rotate(45deg); }
.faq .faq-q { cursor: pointer; }

/* Links in Fließtext auf dunklem Grund */
.elementor .section-ink .body-text a,
.elementor .on-dark a { color: var(--jalba-gold); }
.elementor .section-ink .body-text a:hover,
.elementor .on-dark a:hover { color: var(--jalba-cream); }
/* Links in Fließtext auf hellem Grund: unterstrichen */
.elementor .body-text a, .elementor .faq-a a { text-decoration: underline; text-underline-offset: 3px; }

/* ===== Rechtstexte (Datenschutz: Text-Editor-Widget in .legal-col) ===== */
.legal-col .elementor-widget-text-editor { width: 100%; color: var(--jalba-text); font-size: 17.5px; line-height: 1.62; }
.legal-col .elementor-widget-text-editor h2 {
	margin: 48px 0 12px; font-family: var(--jalba-serif); font-weight: 650; font-size: 29px; line-height: 1.25; color: var(--jalba-ink);
}
.legal-col .elementor-widget-text-editor h2:first-child { margin-top: 0; }
.legal-col .elementor-widget-text-editor h3 {
	margin: 26px 0 8px; font-family: var(--jalba-ui); font-weight: 600; font-size: 18.5px; line-height: 1.4; color: var(--jalba-ink);
}
.legal-col .elementor-widget-text-editor p { margin: 0 0 14px; }
.legal-col .elementor-widget-text-editor ul { margin: 0 0 14px; padding-left: 1.2em; }
.legal-col .elementor-widget-text-editor li { margin: 0 0 6px; }
.legal-col a { color: var(--jalba-ink); text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
.legal-col a:hover { color: var(--jalba-accent); }
.legal-box {
	background: var(--jalba-cream); border: 1px solid var(--jalba-line); border-top: 2px solid var(--jalba-ink);
	padding: 20px 24px; color: var(--jalba-ink);
}
.legal-stand { margin-top: 44px !important; font-size: 15.5px; }
.legal-col [id] { scroll-margin-top: 24px; }
.toc-link span { display: inline-block; min-width: 34px; font-family: var(--jalba-serif); color: var(--jalba-accent); }
.elementor .toc-link > a, .elementor .toc-link > a:is(:hover, :focus-visible) { color: inherit; text-decoration: none; display: block; }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }

/* ===== Anfrageformular (Contact Form 7) ===== */
.jf-form { --jf-error: #a3261b; font-family: var(--jalba-body); color: var(--jalba-text); }
.jf-note { margin: 0 0 30px; font-size: 15.5px; }
.jf-fieldset { border: 0; margin: 0 0 34px; padding: 0; min-width: 0; }
.jf-fieldset legend {
	display: flex; gap: 12px; align-items: baseline;
	padding: 0 0 18px;
	font-family: var(--jalba-serif); font-weight: 600; font-size: 25px; line-height: 1.3;
	color: var(--jalba-ink);
}
.jf-fieldset legend span { color: var(--jalba-accent); }
.jf-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 18px 22px; }
.jf-row > .wpcf7-form-control-wrap, .jf-row [data-class="wpcf7cf_group"] { display: contents; }
.jf-field--wide { grid-column: 1 / -1; }
.jf-field label {
	display: block; margin-bottom: 6px;
	font-family: var(--jalba-ui); font-weight: 500; font-size: 15.5px; color: var(--jalba-ink);
}
.jf-form input[type="text"], .jf-form input[type="email"], .jf-form input[type="tel"],
.jf-form input[type="number"], .jf-form input[type="date"], .jf-form select, .jf-form textarea {
	width: 100%; box-sizing: border-box; min-height: 52px; padding: 12px 14px;
	border: 1.5px solid #8a7a5c; border-radius: 0; background: #fff;
	font: 17.5px/1.4 var(--jalba-body); color: var(--jalba-ink);
}
.jf-form textarea { min-height: 140px; resize: vertical; }
.jf-form input:focus, .jf-form select:focus, .jf-form textarea:focus {
	outline: 2px solid var(--jalba-accent); outline-offset: 1px; border-color: var(--jalba-ink);
}
.jf-message { margin: 0 0 26px; }
.jf-hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.jf-consent { margin: 0 0 30px; font-size: 15.5px; line-height: 1.6; }
.jf-consent .wpcf7-list-item { margin: 0; }
.jf-consent label { display: flex; gap: 14px; align-items: flex-start; }
.jf-consent input[type="checkbox"] { flex: 0 0 24px; width: 24px; height: 24px; margin: 0; accent-color: var(--jalba-ink); }
/* „Wann?“: Auswahl als Kacheln, Datum nur bei „Bestimmtes Datum“ (Conditional Fields) */
.jf-termin .wpcf7-radio { display: flex; flex-wrap: wrap; gap: 10px; }
.jf-termin .wpcf7-list-item { margin: 0; }
.jf-termin .wpcf7-list-item label {
	display: inline-flex; align-items: center; gap: 10px;
	min-height: 48px; padding: 0 18px; box-sizing: border-box; cursor: pointer;
	background: #fff; border: 1.5px solid var(--jalba-line); color: var(--jalba-ink);
	font-family: var(--jalba-ui); font-weight: 500; font-size: 16.5px;
	transition: border-color .2s, background-color .2s;
}
.jf-termin .wpcf7-list-item label:hover { border-color: var(--jalba-ink); }
.jf-termin .wpcf7-list-item label:has(input:checked) { background: var(--jalba-sand); border-color: var(--jalba-ink); box-shadow: inset 0 0 0 1px var(--jalba-ink); }
.jf-termin .wpcf7-list-item label:has(input:focus-visible) { outline: 2px solid var(--jalba-accent); outline-offset: 2px; }
.jf-termin input[type="radio"] { width: 18px; height: 18px; margin: 0; accent-color: var(--jalba-ink); }
.jf-termin .jf-datum { margin-top: 18px; }
@media (max-width: 479px) {
	.jf-termin .wpcf7-list-item, .jf-termin .wpcf7-list-item label { width: 100%; }
}
/* Bestätigung nach erfolgreichem Versand (assets/js/form-success.js) */
.jf-success {
	scroll-margin-top: calc(var(--jalba-hdr-h, 0px) + 24px);
	background: var(--jalba-light);
	border: 1px solid var(--jalba-line);
	border-top: 3px solid var(--jalba-ink);
	padding: 48px 40px 44px;
	text-align: center;
}
.jf-success-icon { display: block; margin: 0 auto 18px; color: var(--jalba-accent); }
.jf-success-kicker {
	margin: 0 0 10px;
	font-family: var(--jalba-ui); font-weight: 600; font-size: 14.5px; letter-spacing: .14em; text-transform: uppercase;
	color: var(--jalba-accent);
}
.jf-success-title {
	margin: 0 0 20px; outline: none;
	font-family: var(--jalba-serif); font-weight: 650; font-size: clamp(31px, 4.2vw, 44px); line-height: 1.15;
	color: var(--jalba-ink); text-wrap: balance;
}
.jf-success-text { max-width: 560px; margin: 0 auto 14px; font-size: 18.5px; line-height: 1.62; }
.jf-success-text a { color: var(--jalba-ink); font-weight: 600; text-decoration: none; white-space: nowrap; }
.jf-success-text a:hover { color: var(--jalba-accent); }
.jf-success-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; margin-top: 30px; }
.jf-success-actions .jf-submit { text-decoration: none; }
.jf-success-again {
	display: inline-flex; align-items: center; justify-content: center;
	min-height: 56px; padding: 0 32px; border: 1.5px solid var(--jalba-ink); border-radius: 0;
	background: transparent; color: var(--jalba-ink); cursor: pointer;
	font-family: var(--jalba-ui); font-weight: 600; font-size: 16.5px; letter-spacing: .02em;
	transition: background-color .25s, color .25s;
}
.jf-success-again:hover, .jf-success-again:focus-visible { background: var(--jalba-ink); color: var(--jalba-cream); }
@media (max-width: 479px) {
	.jf-success { padding: 36px 20px 32px; }
	.jf-success-actions > * { width: 100%; }
}

/* „Gleicher Ansprechpartner wie Auftraggeber“ */
.jf-same .wpcf7-list-item { margin: 0; }
.jf-same label { display: inline-flex; align-items: center; gap: 12px; cursor: pointer; font-family: var(--jalba-ui); font-weight: 500; font-size: 16.5px; color: var(--jalba-ink); }
.jf-same input[type="checkbox"] { width: 22px; height: 22px; margin: 0; accent-color: var(--jalba-ink); }
.jf-form input.is-copied { background: var(--jalba-light); border-color: var(--jalba-line); color: var(--jalba-text); }
.jf-submit {
	display: inline-flex; align-items: center; justify-content: center;
	min-height: 56px; padding: 0 32px; border: 1.5px solid var(--jalba-ink); border-radius: 0;
	background: var(--jalba-ink); color: var(--jalba-cream);
	font-family: var(--jalba-ui); font-weight: 600; font-size: 16.5px; letter-spacing: .02em;
	cursor: pointer; transition: background-color .25s, border-color .25s;
}
.jf-submit:hover, .jf-submit:focus-visible { background: var(--jalba-accent); border-color: var(--jalba-accent); color: #fff; }
.jf-actions { display: flex; align-items: center; gap: 16px; }
.jf-form .wpcf7-not-valid { border-color: var(--jf-error); }
.jf-form .wpcf7-not-valid-tip { margin-top: 6px; font-size: 15.5px; color: var(--jf-error); }
.wpcf7 form .wpcf7-response-output { margin: 24px 0 0; padding: 16px 18px; border: 1.5px solid var(--jalba-ink); font-size: 16.5px; }
.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output, .wpcf7 form.spam .wpcf7-response-output { border-color: var(--jf-error); color: var(--jf-error); }
.wpcf7 form.sent .wpcf7-response-output { border-color: #2f6b3a; color: #2f6b3a; }

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}

/* Lange deutsche Wörter (z. B. „Datenschutzerklärung“) auf dem Handy trennen statt überlaufen */
@media (max-width: 767px) {
	.elementor :is(h1, h2, h3) { hyphens: auto; -webkit-hyphens: auto; overflow-wrap: break-word; }
}

/* Galerie: Sprungziel der Kategorie-Anker */
.elementor .chip-menu { scroll-margin-top: 24px; }

/* ===== Angebots-Assistent im Hero (Variante K, Shortcode [jalba_anfrage_start]) ===== */
.hf {
	background: var(--jalba-light);
	border: 1px solid var(--jalba-line);
	border-top: 3px solid var(--jalba-ink);
	padding: 32px 34px 26px;
	box-sizing: border-box;
}
.hf .screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px,1px,1px,1px); white-space: nowrap; }
.hf-progress { display: flex; gap: 6px; margin-bottom: 12px; }
.hf-progress span { flex: 1; height: 4px; background: var(--jalba-line); transition: background-color .25s; }
.hf-progress span.is-on { background: var(--jalba-ink); }
.hf-status {
	margin: 0 0 16px;
	font-family: var(--jalba-ui); font-weight: 600; font-size: 13.5px; letter-spacing: .12em; text-transform: uppercase;
	color: var(--jalba-accent);
}
.hf-title {
	margin: 0 0 18px; outline: none;
	font-family: var(--jalba-serif); font-weight: 650; font-size: 28px; line-height: 1.2; color: var(--jalba-ink);
}
.hf-tiles { border: 0; margin: 0 0 18px; padding: 0; min-width: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.hf-tile {
	position: relative; display: flex; flex-direction: column; align-items: center; gap: 6px;
	padding: 16px 6px 14px; min-height: 44px; text-align: center; cursor: pointer;
	background: #fff; border: 1.5px solid var(--jalba-line); color: var(--jalba-ink);
	transition: border-color .2s, background-color .2s;
}
.hf-tile input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.hf-tile svg { color: var(--jalba-ink); }
.hf-tile-name { font-family: var(--jalba-ui); font-weight: 600; font-size: 15.5px; line-height: 1.25; }
.hf-tile small { font-family: var(--jalba-body); font-size: 13.2px; line-height: 1.3; color: var(--jalba-text); }
.hf-tile:hover { border-color: var(--jalba-ink); }
.hf-tile:has(input:checked) { background: var(--jalba-sand); border-color: var(--jalba-ink); box-shadow: inset 0 0 0 1px var(--jalba-ink); }
.hf-tile:has(input:focus-visible) { outline: 2px solid var(--jalba-accent); outline-offset: 2px; }
.hf-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 20px; }
.hf .jf-field label { font-size: 14.3px; }
.hf .jf-submit { width: 100%; gap: 10px; }
.hf-error { margin: -6px 0 14px; font-size: 15.5px; color: #a3261b; }
.hf-place { border: 0; margin: 0 0 6px; padding: 0; min-width: 0; }
.hf-place legend {
	padding: 0 0 10px; font-family: var(--jalba-ui); font-weight: 600; font-size: 15.5px; color: var(--jalba-ink);
	letter-spacing: .02em;
}
.hf-place + .hf-place { padding-top: 14px; border-top: 1px solid var(--jalba-line); }
.hf-actions { display: flex; align-items: center; gap: 16px; }
.hf-actions .jf-submit { flex: 1; }
.hf-back {
	background: none; border: 0; padding: 0 4px; min-height: 44px; cursor: pointer;
	font-family: var(--jalba-ui); font-weight: 600; font-size: 16.5px; color: var(--jalba-ink);
	text-decoration: underline; text-underline-offset: 4px;
}
.hf-back:hover, .hf-back:focus-visible { color: var(--jalba-accent); }
.hf-note { margin: 14px 0 0; font-size: 14.2px; line-height: 1.5; text-align: center; color: var(--jalba-text); }
@media (max-width: 479px) {
	.hf { padding: 24px 18px 20px; }
	.hf-tiles { grid-template-columns: repeat(2, 1fr); }
	.hf-row { grid-template-columns: 1fr; }
	.hf-title { font-size: 24px; }
}

/* ===== Klebende Kopfzeile (01.11.2026) =====
   header.js setzt .jalba-hdr-wrap auf den Vorlagen-Wrapper (Elternelement von .hdr) und berechnet:
   --jalba-hdr-offset = Adminleiste − Höhe der schwarzen Zeile (die schwarze Zeile scrollt weg),
   --jalba-hdr-h      = sichtbare Höhe beim Kleben (für Anker-Sprünge). */
.jalba-hdr-wrap {
	position: sticky;
	top: var(--jalba-hdr-offset, 0px);
	z-index: 100;
}
.elementor .jalba-hdr-wrap.is-stuck .hdr-bar,
.jalba-hdr-wrap.is-stuck .hdr-bar {
	box-shadow: 0 8px 20px -12px rgba(22, 19, 15, .35);
}
html { scroll-padding-top: var(--jalba-hdr-h, 0px); }

/* ===== Hero-Foto der Leistungsseiten: Passepartout (01.11.2026, Variante 2) =====
   Bild = V4-Klasse „photo-arch“ (Name historisch), Rahmen am Eltern-Container:
   helles Feld, Linie in --jalba-line, oben 2px ink (wie die Karten der Seite). */
.elementor .e-con:has(> .photo-arch) {
	background-color: var(--jalba-light);
	padding: 12px;
	border: 1px solid var(--jalba-line);
	border-top: 2px solid var(--jalba-ink);
}
@media (max-width: 767px) {
	.elementor .e-con:has(> .photo-arch) { padding: 8px; }
}

/* ===== Galerie: [jalba_galerie] – Raster, Seitenzahlen, Vergrößerung ===== */
.jg-grid { display: grid; gap: 24px; grid-template-columns: repeat(3, 1fr); }
.jg-item { display: block; cursor: zoom-in; }
.jg-item[hidden] { display: none; }
.jg-item:focus-visible { outline: 2px solid var(--jalba-accent); outline-offset: 3px; }
.jg-photo { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
.jg-leer { margin: 0; color: var(--jalba-text); }
@media (max-width: 1024px) { .jg-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 767px) { .jg-grid { grid-template-columns: 1fr; } }

.jg-pager { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 40px; }
.jg-pager .jg-page {
	min-width: 46px; height: 46px; padding: 0 12px;
	font-family: var(--jalba-ui); font-weight: 500; font-size: 15px; line-height: 1;
	color: var(--jalba-ink); background: transparent;
	border: 1.5px solid var(--jalba-ink); border-radius: 0; cursor: pointer;
}
.jg-pager .jg-page:hover, .jg-pager .jg-page:focus { color: var(--jalba-ink); background: var(--jalba-sand); }
.jg-pager .jg-page[aria-current="page"], .jg-pager .jg-page[aria-current="page"]:hover { color: var(--jalba-cream); background: var(--jalba-ink); }
.jg-pager .jg-page:disabled, .jg-pager .jg-page:disabled:hover { color: var(--jalba-ink); background: transparent; opacity: .3; cursor: default; }
.jg-status { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

html.jg-lb-open { overflow: hidden; }
.jg-lb[open] {
	position: fixed; inset: 0; box-sizing: border-box;
	width: 100vw; height: 100vh; height: 100dvh; max-width: none; max-height: none;
	margin: 0; padding: 0; border: 0;
	display: flex; align-items: center; justify-content: center;
	background: rgba(22, 19, 15, .95); color: var(--jalba-cream);
}
.jg-lb::backdrop { background: transparent; }
.jg-lb-fig { flex: 1 1 auto; min-width: 0; height: 100%; margin: 0; box-sizing: border-box; padding: 24px 0 16px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; }
.jg-lb-img { display: block; min-height: 0; max-width: 100%; max-height: calc(100% - 56px); object-fit: contain; }
.jg-lb-cap { font-family: var(--jalba-ui); font-size: 15px; line-height: 1.4; text-align: center; }
.jg-lb-count { margin-left: 10px; color: var(--jalba-gold); font-variant-numeric: tabular-nums; white-space: nowrap; }
.jg-lb .jg-lb-btn {
	flex: 0 0 auto; width: 56px; height: 56px; margin: 0 12px; padding: 0;
	font-family: var(--jalba-ui); font-size: 24px; line-height: 1;
	color: var(--jalba-cream); background: transparent;
	border: 1.5px solid var(--jalba-gold); border-radius: 0; cursor: pointer;
}
.jg-lb .jg-lb-btn:hover, .jg-lb .jg-lb-btn:focus { color: var(--jalba-ink); background: var(--jalba-gold); }
.jg-lb .jg-lb-btn:focus-visible { outline: 2px solid var(--jalba-cream); outline-offset: 2px; }
.jg-lb .jg-lb-btn[hidden] { display: none; }
.jg-lb .jg-lb-close { position: absolute; top: 12px; right: 0; z-index: 1; font-size: 30px; }
@media (max-width: 767px) {
	.jg-lb-fig { padding: 76px 12px 84px; }
	.jg-lb .jg-lb-prev, .jg-lb .jg-lb-next { position: absolute; bottom: 14px; width: 52px; height: 52px; }
	.jg-lb .jg-lb-prev { left: calc(50% - 64px); margin: 0; }
	.jg-lb .jg-lb-next { right: calc(50% - 64px); margin: 0; }
}