/**

 * Header & Drawer

 */



.site-header {

	position: fixed;

	top: 0;

	left: 0;

	right: 0;

	z-index: 1000;

	height: var(--header-height);

	background: rgba(255, 255, 255, 0.96);

	backdrop-filter: blur(8px);

	border-bottom: 1px solid var(--color-gray-200);

	padding-top: var(--safe-top);

}



.site-header__inner {

	display: flex;

	align-items: center;

	justify-content: space-between;

	gap: 12px;

	max-width: var(--container-max);

	height: 100%;

	margin-inline: auto;

	padding-inline: var(--container-padding);

}



.site-logo {

	display: flex;

	align-items: center;

	gap: 10px;

	flex-shrink: 1;

	min-width: 0;

}



.site-logo__mark {

	flex-shrink: 0;

	width: clamp(40px, 2.5vw + 34px, 60px);

	height: clamp(40px, 2.5vw + 34px, 60px);

}



.site-logo__mark img,

.site-logo__mark .custom-logo,

.site-logo__image {

	display: block;

	width: 100%;

	height: 100%;

	object-fit: contain;

}



.site-logo__text {

	font-size: clamp(13px, 0.35vw + 12px, 15px);

	font-weight: 600;

	color: var(--color-navy);

	white-space: nowrap;

	overflow: hidden;

	text-overflow: ellipsis;

	min-width: 0;

}



.site-header__actions {

	display: flex;

	align-items: center;

	gap: 10px;

	flex-shrink: 0;

}



.header-contact-button {

	display: inline-flex;

	align-items: center;

	gap: 8px;

	padding: 10px 20px;

	background: var(--color-navy);

	color: var(--color-white);

	font-size: 14px;

	font-weight: 500;

	border-radius: var(--radius-full);

	transition: background var(--transition);

	white-space: nowrap;

}



.header-contact-button:hover,

.header-contact-button:focus-visible {

	background: var(--color-navy-light);

}



.header-menu-button {

	display: flex;

	flex-direction: column;

	justify-content: center;

	align-items: center;

	gap: 5px;

	width: 44px;

	height: 44px;

	flex-shrink: 0;

	color: var(--color-navy);

	border-radius: var(--radius-sm);

}



.header-menu-button__bar {

	display: block;

	width: 22px;

	height: 2px;

	background: currentColor;

	border-radius: 1px;

	transition: transform var(--transition), opacity var(--transition);

}



.header-menu-button[aria-expanded="true"] .header-menu-button__bar:nth-child(1) {

	transform: translateY(7px) rotate(45deg);

}



.header-menu-button[aria-expanded="true"] .header-menu-button__bar:nth-child(2) {

	opacity: 0;

}



.header-menu-button[aria-expanded="true"] .header-menu-button__bar:nth-child(3) {

	transform: translateY(-7px) rotate(-45deg);

}



/* Drawer */

.site-drawer {

	position: fixed;

	inset: 0;

	z-index: 1100;

	pointer-events: none;

	visibility: hidden;

}



.site-drawer.is-open {

	pointer-events: auto;

	visibility: visible;

}



.site-drawer__overlay {

	position: absolute;

	inset: 0;

	background: rgba(27, 42, 74, 0.5);

	opacity: 0;

	transition: opacity var(--transition);

}



.site-drawer.is-open .site-drawer__overlay {

	opacity: 1;

}



.site-drawer__panel {

	position: absolute;

	top: 0;

	right: 0;

	bottom: 0;

	width: min(320px, 85vw);

	background: var(--color-white);

	box-shadow: var(--shadow-lg);

	transform: translateX(100%);

	transition: transform 0.3s ease;

	display: flex;

	flex-direction: column;

	padding-top: var(--safe-top);

	padding-bottom: var(--safe-bottom);

}



.site-drawer.is-open .site-drawer__panel {

	transform: translateX(0);

}



.site-drawer__header {

	display: flex;

	align-items: center;

	justify-content: space-between;

	padding: 16px 20px;

	border-bottom: 1px solid var(--color-gray-200);

}



.site-drawer__title {

	font-size: 14px;

	font-weight: 600;

	color: var(--color-navy);

}



.site-drawer__close {

	display: flex;

	align-items: center;

	justify-content: center;

	width: 44px;

	height: 44px;

	color: var(--color-navy);

	border-radius: var(--radius-sm);

}



.site-drawer__body {

	flex: 1;

	overflow-y: auto;

	padding: 24px 20px;

}



.site-nav--drawer .site-nav__list {

	display: flex;

	flex-direction: column;

	align-items: stretch;

	gap: 0;

}



.site-nav--drawer .site-nav__link {

	display: block;

	padding: 14px 0;

	font-size: 15px;

	font-weight: 500;

	color: var(--color-navy);

	border-bottom: 1px solid var(--color-gray-100);

	transition: color var(--transition);

}



.site-nav--drawer .site-nav__link:hover,

.site-nav--drawer .site-nav__link:focus-visible {

	color: var(--color-green);

}



.site-nav--drawer .site-nav__sublist {

	list-style: none;

	margin: 0;

	padding: 0 0 8px 12px;

	border-bottom: 1px solid var(--color-gray-100);

}



.site-nav--drawer .site-nav__sublink {

	display: block;

	padding: 10px 0 10px 8px;

	font-size: 14px;

	font-weight: 400;

	color: var(--color-text-muted);

	border-left: 2px solid var(--color-gray-200);

	padding-left: 14px;

	transition: color var(--transition), border-color var(--transition);

}



.site-nav--drawer .site-nav__sublink:hover,

.site-nav--drawer .site-nav__sublink:focus-visible {

	color: var(--color-green);

	border-left-color: var(--color-green);

}



.site-drawer__contact {

	margin-top: 24px;

}



.drawer-phone-button {

	display: flex;

	align-items: center;

	justify-content: center;

	padding: 12px;

	border: 1px solid var(--color-green);

	color: var(--color-green);

	border-radius: var(--radius-full);

	font-weight: 500;

}



body.is-drawer-open {

	overflow: hidden;

}



@media (max-width: 360px) {

	.site-logo {

		gap: 6px;

	}

	.header-contact-button {

		padding: 10px;

	}



	.header-contact-button__label {

		display: none;

	}



	.header-contact-button__icon {

		margin: 0;

	}

}


