/* Kopfzeile mit Navigation (layouts/layout.pug) */
.rb-header {
	position: relative;
	display: flex;
	align-items: center;
	gap: 24px;
	min-height: 64px;
	padding: 0 32px;
	background: #fff;
	border-bottom: 1px solid #e5e8eb;
}

.rb-brand {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-shrink: 0;
	color: #121417;
	text-decoration: none;
	white-space: nowrap;
}

.rb-brand:hover {
	color: #121417;
}

.rb-brand-logo {
	width: 30px;
	height: 30px;
}

.rb-brand-name {
	font-size: 18px;
	font-weight: 700;
	letter-spacing: -0.27px;
}

.rb-brand-tag {
	padding: 2px 10px;
	border-radius: 999px;
	background: #fff3c4;
	color: #7a5900;
	font-size: 12px;
	font-weight: 600;
}

.rb-nav {
	align-items: center;
	gap: 2px;
	margin-left: auto;
}

.rb-nav-link {
	padding: 8px 12px;
	border-radius: 8px;
	color: #4b5563;
	font-size: 14px;
	font-weight: 500;
	text-decoration: none;
	white-space: nowrap;
}

.rb-nav-link:hover {
	background: #f3f4f6;
	color: #121417;
}

.rb-nav-link.active {
	background: #fff3c4;
	color: #121417;
}

.rb-nav-sep {
	width: 1px;
	height: 24px;
	margin: 0 8px;
	background: #e5e8eb;
}

.rb-header .navbar-toggler {
	margin-left: auto;
}

.rb-header #mobileNav {
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	z-index: 1000;
}

.rb-header #mobileNav .list-group-item.active {
	background: #fff3c4;
	border-color: transparent;
	color: #121417;
	font-weight: 600;
}

@media (max-width: 1199.98px) {
	.rb-header {
		gap: 16px;
		padding: 0 20px;
	}

	.rb-nav-link {
		padding: 8px 9px;
	}
}

@media (max-width: 575.98px) {
	.rb-header {
		padding: 0 16px;
	}
}

/* Sprachumschalter DE | EN */
.rb-lang {
	display: flex;
	align-items: center;
	gap: 2px;
	margin-right: 4px;
}

.rb-lang-link {
	padding: 4px 7px;
	border-radius: 6px;
	color: #6b7280;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.3px;
	text-decoration: none;
}

.rb-lang-link:hover {
	background: #f3f4f6;
	color: #121417;
}

.rb-lang-link.active {
	background: #121417;
	color: #fff;
}