/* =============================================================================
   NAV — Arnout Rebel Photography
   ============================================================================= */

header.wp-block-template-part,
.ar-site-header {
	position: sticky;
	top: 0;
	z-index: 100;
	background: var(--wp--preset--color--white);
	border-bottom: 1px solid var(--wp--preset--color--border);
	padding-left: 0 !important;
	padding-right: 0 !important;
}

/* Inhoud uitgelijnd op dezelfde breedte als de pagina-inhoud */
.ar-site-header__inner {
	padding: 0 max(3rem, calc(50vw - 600px));
	height: 64px;
	width: 100%;
}

/* Logo */
.ar-site-header__logo a,
.ar-site-header__logo {
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--wp--preset--color--dark);
	text-decoration: none;
	white-space: nowrap;
}

.wp-block-site-logo {
	margin-left: -20px !important;
	padding-left: 0 !important;
}

.wp-block-site-logo img {
	height: 115px !important;
	width: auto !important;
	max-width: none !important;
}

/* Navigatielinks */
.ar-nav .wp-block-navigation__container {
	display: flex;
	gap: 1.5rem;
	align-items: center;
}

.ar-nav .wp-block-navigation-item__content {
	font-size: 0.6875rem;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--wp--preset--color--muted);
	text-decoration: none;
	font-weight: 400;
	padding: 0;
	transition: color 0.2s ease;
}

.ar-nav .wp-block-navigation-item__content:hover,
.ar-nav .current-menu-item .wp-block-navigation-item__content,
.ar-nav .ar-nav__link--active .wp-block-navigation-item__content {
	color: var(--wp--preset--color--dark);
}

/* Hamburger (mobiel) */
.ar-nav .wp-block-navigation__responsive-container-open,
.ar-nav .wp-block-navigation__responsive-container-close {
	color: var(--wp--preset--color--dark);
}

/* Mobiel menu overlay */
.ar-nav .wp-block-navigation__responsive-container.is-menu-open {
	background: var(--wp--preset--color--white);
	padding: 2rem;
}

.ar-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	font-size: 1rem;
	letter-spacing: 0.12em;
	color: var(--wp--preset--color--dark);
	padding: 0.75rem 0;
	border-bottom: 1px solid var(--wp--preset--color--border);
}

/* =============================================================================
   RESPONSIVE
   ============================================================================= */

@media (max-width: 767px) {
	.ar-site-header {
		padding: 0 1.25rem;
		height: 56px;
	}
}