/*
 * Tiefel CWV — W1: CLS-Stabilisierung (Page-Header + Topbar)
 * IDEAS_AND_OPPORTUNITIES.md, Plan 2026-11-13; gehängt über
 * wp-content/mu-plugins/tiefel-cwv.php (wp_head-Prio 1).
 *
 * Prinzip: Der hefo-Device-CSS (DB-Option `hefo`) greift erst, nachdem
 * Elementor-JS das Attribut body[data-elementor-device-mode="…"] setzt.
 * Diese Datei setzt die Device-Endzustände statisch ab First-Byte,
 * sodass die JS-Änderung danach kein Layout mehr verschiebt:
 *
 *   - .page-header:   Höhe je Device-Breakpoint (Tablet 0 / Desktop 673px /
 *                     Mobile auto) — Endwerte identisch mit hefo/OceanWP.
 *   - .logosvg_mobil: mobiles Topbar-SVG-Logo sichtbar auf Mobile+Tablet
 *                     (heutiger post-JS-Zustand), ausgeblendet auf Desktop.
 *
 * WARTUNG: 673px = Customizer-Wert "Page Header Image Height"
 * (get_theme_mod('ocean_page_header_image_height')). Bei Änderung dieses
 * Customizer-Werts muss die Desktop-Regel unten mit geändert werden.
 */

/* Basis: Tablet-Endzustand (height:0, wie hefo tablet-Regel) */
.page-header {
	height: 0 !important;
}

/* Tablet (768–1024px): wie hefo tablet-Regel (overflow + padding-bottom) */
@media (min-width: 768px) and (max-width: 1024px) {
	.page-header {
		overflow: visible !important;
		padding-bottom: 60px !important;
	}
}

/* Desktop (>=1025px): Höhe wie OceanWP-Dynamic-CSS (Customizer-Wert 673) */
@media (min-width: 1025px) {
	.page-header {
		height: 673px !important;
	}
}

/* Mobile (<=767px): Endzustand wie style.css mobile-Regel (height:auto) */
@media (max-width: 767px) {
	.page-header {
		height: auto !important;
	}
}

/* Mobile-/Tablet-Topbar: SVG-Logo sichtbar (heutiger post-JS-Zustand).
 * !important nötig, weil das statische hefo-`body`-Snippet
 * (.logosvg_mobil{display:none}) später im Dokument kommt. */
.logosvg_mobil {
	display: block !important;
}

/* Desktop-Topbar: Logo ausgeblendet (wie bisher) */
@media (min-width: 1025px) {
	.logosvg_mobil {
		display: none !important;
	}
}