{{-- Header demo-business-consulting — Usa componentes compartidos --}}
<header id="header" class="header-transparent header-transparent-dark-bottom-border header-effect-shrink" data-plugin-options="{'stickyEnabled': true, 'stickyEffect': 'shrink', 'stickyEnableOnBoxed': true, 'stickyEnableOnMobile': false, 'stickyChangeLogo': true, 'stickyStartAt': 30, 'stickyHeaderContainerHeight': 70}">
	<div class="header-body border-top-0 bg-dark box-shadow-none">
		<div class="header-container container">
			<div class="header-row">
				<div class="header-column">
					<div class="header-row">
						<div class="header-logo">
							<a href="{{ front_homepage_url() }}">
								<img alt="{{ config('site.assets.main_logo_alt', config('site.name')) }}" height="36" src="{{ site_asset_url('main_logo') ?: site_asset_url('main_logo') }}">
							</a>
						</div>
					</div>
				</div>
				<div class="header-column justify-content-end">
					<div class="header-row">
						<div class="header-nav header-nav-links header-nav-dropdowns-dark header-nav-light-text order-2 order-lg-1">
							<div class="header-nav-main header-nav-main-mobile-dark header-nav-main-square header-nav-main-dropdown-no-borders header-nav-main-effect-2 header-nav-main-sub-effect-1">
								<nav class="collapse">
									<ul class="nav nav-pills" id="mainNav">
										<x-header-nav :dropdowns="true" classes="dropdown-primary" />
									</ul>
								</nav>
							</div>
							<x-header-cta classes="btn-rounded btn-outline btn-secondary text-2 font-weight-bold text-uppercase px-4 btn-py-2 ms-3" />
							<button class="btn header-btn-collapse-nav" data-bs-toggle="collapse" data-bs-target=".header-nav-main nav">
								<i class="fas fa-bars"></i>
							</button>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</header>
@push('styles')
<style>
	html.demo-business-consulting #header .header-nav-main.header-nav-main-square nav > ul > li.active > a,
	html.demo-business-consulting #header .header-nav-main .nav > li.active > a.nav-link,
	html.demo-business-consulting #header .header-nav-main .nav > li.active > a.nav-link:hover,
	html.demo-business-consulting #header .header-nav-main .nav > li.active > a.nav-link:focus {
		color: var(--secondary, #07f2b0) !important;
	}
	html.demo-business-consulting #header .header-nav-main.header-nav-main-square nav > ul > li.active > a.dropdown-toggle::after {
		border-color: var(--secondary, #07f2b0) transparent transparent !important;
	}
</style>
@endpush