/**
 * Online-Vorsorgeberater (Inhaltstyp lx_im_unit, Plugin lx-info-management).
 * Lädt nur auf diesen Seiten (inc/assets.php). Vorlage: templates/single-lx_im_unit.html,
 * Kopf: patterns/header-kurs.php. Die Plugin-Blöcke bringen ihr eigenes CSS mit;
 * hier nur Rahmen, Abstände und Farben des Themes.
 */

/* Kopf: schmale Nachtblau-Leiste, liegt nicht über dem Inhalt. */
.himml-site-header--kurs {
	position: relative;
}

.himml-kurs-header__bar {
	gap: 16px;
}

.himml-kurs-header__brand {
	gap: 18px;
}

.himml-kurs-header .himml-logo img {
	height: 52px;
	width: auto;
}

.himml-kurs-header__label {
	margin: 0;
	padding-left: 18px;
	border-left: 1px solid rgba(255, 255, 255, 0.18);
	letter-spacing: 0.14em;
	text-transform: uppercase;
	font-weight: 700;
}

.himml-kurs-header__label a {
	color: var(--wp--preset--color--pale);
	text-decoration: none;
}

.himml-kurs-header__actions {
	gap: 10px;
}

@media (max-width: 760px) {
	.himml-kurs-header .himml-logo img {
		height: 42px;
	}

	.himml-kurs-header__label,
	.himml-kurs-header__phone .wp-block-button__link {
		font-size: 0;
	}

	.himml-kurs-header__label {
		display: none;
	}

	/* Telefon nur als Symbol. */
	.himml-kurs-header__phone .wp-block-button__link {
		padding-inline: 14px;
	}
}

/* Layout: Schritte links, Inhalt rechts; unter 1024 px untereinander.
   Der Berater nutzt die volle Fensterbreite (nur der Seitenrand bleibt), wie im alten Theme. */
.himml-kurs__layout {
	align-items: flex-start;
}

.himml-kurs > .himml-kurs__layout.alignwide {
	max-width: none !important;
}

@media (min-width: 1024px) {
	.himml-kurs__nav {
		position: sticky;
		top: 24px;
	}
}

@media (max-width: 1023px) {
	.himml-kurs__layout {
		flex-wrap: wrap !important;
	}

	.himml-kurs__layout > .wp-block-column {
		flex-basis: 100% !important;
	}
}

.himml-kurs__main > * + * {
	margin-top: var(--wp--preset--spacing--30);
}

.himml-kurs__main .wp-block-lxbdr-unit-video {
	overflow: hidden;
	border-radius: var(--wp--preset--border-radius--large);
}

.himml-kurs__titlebar {
	gap: 16px;
	padding-block: 8px 20px;
	border-bottom: 1px solid var(--wp--preset--color--line);
}

.himml-kurs__titlebar .wp-block-post-title {
	flex: 1;
	margin: 0;
	font-weight: 300;
}

.himml-kurs__content {
	padding-top: var(--wp--preset--spacing--40);
}

/* Formulare der Schritte (Gravity Forms): ruhige graue Karte wie die Schritt-Karten. */
.himml-kurs .gform_wrapper {
	max-width: 760px;
	padding: clamp(20px, 3vw, 36px);
	background: var(--wp--preset--color--sand);
	border-radius: var(--wp--preset--border-radius--large);
}

.himml-kurs .gform_wrapper .gfield_label {
	margin-bottom: 0.5rem;
	color: var(--wp--preset--color--ink);
}

.himml-kurs .gform_wrapper .gform_button,
.himml-kurs .gform_wrapper .gform_next_button,
.himml-kurs .gform_wrapper .gform_previous_button {
	border-radius: var(--wp--preset--border-radius--pill) !important;
}

/* Überschriften im Schrittinhalt: leicht wie im Theme, aber kompakt. Die H1 der
   Schritte würde sonst die Hero-Größe „display“ (bis 72 px) bekommen; der Titel
   steht ohnehin schon in der Leiste über dem Inhalt. */
.himml-kurs__content :is(h1, h2) {
	font-weight: 300 !important;
	color: var(--wp--preset--color--ink);
}

/* Viele Schritt-Titel stecken in mehrfach verschachteltem <strong> (Editor-Altlast),
   jede Ebene wäre „bolder“. Große Titel bleiben leicht. */
.himml-kurs__content :is(h1, h2) strong {
	font-weight: inherit;
}

.himml-kurs__content h1 {
	font-size: var(--wp--preset--font-size--xx-large) !important;
}

.himml-kurs__content h2 {
	font-size: var(--wp--preset--font-size--x-large) !important;
}

.himml-kurs__content h3 {
	font-size: var(--wp--preset--font-size--large) !important;
}

/* Zurück/Weiter des Plugins als Pillen-Buttons. */
.himml-kurs .lx-post-nav__link {
	border-radius: var(--wp--preset--border-radius--pill) !important;
	background: var(--wp--preset--color--blue);
	text-transform: none;
	letter-spacing: 0;
	font-weight: 500;
	transition: background-color 0.2s ease;
}

.himml-kurs .lx-post-nav__link:hover {
	background: var(--wp--preset--color--blue-bright);
}

.himml-kurs .lx-post-nav__link--prev {
	background: transparent;
	box-shadow: inset 0 0 0 1px rgba(15, 31, 63, 0.3);
}

.himml-kurs .lx-post-nav__link--prev,
.himml-kurs .lx-post-nav__link--prev * {
	color: var(--wp--preset--color--ink) !important;
	fill: currentColor;
}

.himml-kurs .lx-post-nav__link--prev:hover {
	background: var(--wp--preset--color--sand);
}

/* Handy: Titel in eigener Zeile über Zurück/Weiter. */
@media (max-width: 760px) {
	.himml-kurs__titlebar {
		flex-wrap: wrap !important;
	}

	.himml-kurs__titlebar .wp-block-post-title {
		order: -1;
		flex-basis: 100%;
	}
}

/* Ohne Kontaktband (inc/kurs.php) beginnt der Fuß direkt mit den Spalten. */
.himml-footer {
	padding-top: var(--wp--preset--spacing--60) !important;
}