/* ============================================================================
   SICODA · Kopfbereich (Block-Navigation)
   Ersetzt Abschnitt 6 des alten Divi-CSS. Keine Divi-Selektoren.
   ============================================================================ */

/* Fixierung der Kopfleiste.
   `position: sticky` klebt nur innerhalb des ELTERNELEMENTS. `.sicoda-header`
   ist das einzige Kind des Template-Part-Wrappers <header
   class="wp-block-template-part">, dessen Höhe exakt der Kopfleistenhöhe
   entspricht — der Klebebereich wäre damit null (gemessen: scrollY=800 →
   header.top=-800). Die Sticky-Eigenschaften gehören deshalb auf den Wrapper
   selbst; der ist direktes Kind von `.wp-site-blocks` und hat die volle
   Seitenhöhe als Spielraum. Nicht zurück nach innen verschieben. */
header.wp-block-template-part {
	position: sticky;
	top: 0;
	z-index: 100;
}

/* Träger: weiß, weicher Schatten, Mint-Fortschrittskante als Hintergrundebene
   ganz oben — bleibt dadurch in jedem Scrollzustand am Kopf verankert. */
.sicoda-header {
	background:
		linear-gradient(90deg, var(--navy-700) 0%, var(--mint-500) 55%, var(--mint-100) 100%) top left / 100% 3px no-repeat,
		var(--surface-card);
	box-shadow: 0 1px 0 var(--line-200), var(--shadow-card);
	padding-top: var(--space-1);
	padding-bottom: var(--space-1);
}

/* Menü-Links */
.sicoda-header .wp-block-navigation {
	font-family: var(--font-body);
	font-size: var(--size-body);
}
.sicoda-header .wp-block-navigation-item__content {
	position: relative;
	font-weight: var(--weight-body);
	color: var(--text-900);
	text-decoration: none;
	padding-bottom: 11px;
	transition: color .15s ease;
}

/* Zentriert wachsender Mint-Unterstrich */
.sicoda-header .wp-block-navigation-item__content::after {
	content: "";
	position: absolute;
	left: 50%;
	right: 50%;
	bottom: 0;
	height: 2px;
	background: var(--mint-500);
	border-radius: 2px;
	transition: left .22s ease, right .22s ease;
}
.sicoda-header .wp-block-navigation-item:hover > .wp-block-navigation-item__content::after,
.sicoda-header .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content::after {
	left: 0;
	right: 0;
}
.sicoda-header .wp-block-navigation-item:hover > .wp-block-navigation-item__content,
.sicoda-header .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content {
	color: var(--mint-700);
}
.sicoda-header .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content {
	font-weight: var(--weight-emphasis);
}

/* Untermenüs: Mint-Oberkante, weiche Karte, Hover-Tint */
.sicoda-header .wp-block-navigation__submenu-container {
	border-top: 3px solid var(--mint-500);
	box-shadow: var(--shadow-raised);
	border-radius: var(--radius-card);
	background: var(--surface-card);
	padding: var(--space-1) 0;
}
.sicoda-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	padding: 6px 20px;
	font-weight: var(--weight-body);
	transition: background .12s ease, color .12s ease;
}
/* Im Untermenü kein Unterstrich — dort wirkt der Hover-Tint. */
.sicoda-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content::after {
	display: none;
}
.sicoda-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover {
	background: var(--ice-50);
	color: var(--mint-700);
}

/* CTA-Menüpunkt: Navy-Pille. Klasse „sicoda-nav-cta" im Menüeintrag setzen. */
.sicoda-header .sicoda-nav-cta > .wp-block-navigation-item__content {
	background: var(--button-primary-bg);
	color: var(--button-primary-fg);
	border-radius: var(--radius-pill);
	padding: 10px 22px;
	margin-left: var(--space-1);
	transition: background .15s ease, transform .06s ease;
}
.sicoda-header .sicoda-nav-cta > .wp-block-navigation-item__content::after {
	display: none;
}
.sicoda-header .sicoda-nav-cta > .wp-block-navigation-item__content:hover {
	background: var(--button-primary-bg-hover);
	color: var(--button-primary-fg);
	transform: translateY(-1px);
}

/* Mobiles Overlay */
.sicoda-header .wp-block-navigation__responsive-container.is-menu-open {
	background: var(--surface-card);
	padding-top: var(--space-6);
}
.sicoda-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	color: var(--text-900);
	padding: var(--space-2) 0;
}
.sicoda-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content::after {
	display: none;
}
