/* ==========================================================================
   Site header (wvh-)  — main bar, sticky bar, mobile slide-out panel
   ========================================================================== */
:root {
	--wvh-accent: #14a79d;
	--wvh-text: #535256;
	--wvh-panel: #141417;
	--wvh-font: "Hanken Grotesk", Helvetica, Arial, sans-serif;
--wvh-font-head: "Sora", Helvetica, Arial, sans-serif;
	--wvh-container: 1320px;
}
.wvh-header .wvh-phone,
.wvf-footer h2, .wvf-footer h3,
.me-book__title, .me-book__btn,
.me-req__title, .me-req__submit,
.me-veh__title, .me-veh__btn{
      font-family: var(--wvh-font-head, "Sora", Helvetica, Arial, sans-serif);
}
.wvh-header,
.wvh-header * { box-sizing: border-box; }

.wvh-header {
	position: relative;
	z-index: 999;
	width: 100%;
	font-family: var(--wvh-font);
}
.wvh-header ul { list-style: none; margin: 0; padding: 0; }
.wvh-header a { text-decoration: none; }
.wvh-header img { display: block; height: auto; border-radius: 0; }

.wvh-container {
	width: 100%;
	max-width: var(--wvh-container);
	margin: 0 auto;
	padding: 0 0px;
}


/* ---- main bar ---------------------------------------------------------- */
.wvh-main { padding: 10px 0; background: transparent; }

.wvh-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
}

.wvh-logo { flex: 0 0 auto; max-width: 280px; padding-bottom: 16px; }
.wvh-logo img { max-height: 100px; max-width: 100%; width: auto; }
.wvh-logo .wvh-site-name { font-size: 22px; font-weight: 600; color: var(--wvh-accent); }

/* ---- desktop navigation ------------------------------------------------ */
.wvh-nav .wvh-menu { display: flex; align-items: center; }
.wvh-nav { margin-right: 30px; }

.wvh-nav .wvh-menu > li {
	position: relative;
	display: flex;
	align-items: center;
	padding: 24px 15px;
}

.wvh-nav .wvh-menu > li > a {
	display: inline-block;
	color: var(--wvh-text);
	font-size: 15px;
	font-weight: 500;
	line-height: 28px;
	letter-spacing: 0.32px;
	transition: color 0.5s ease;
}
.wvh-nav .wvh-menu > li > a:hover,
.wvh-nav .wvh-menu > li > a:focus-visible,
.wvh-nav .wvh-menu > li.current-menu-item > a,
.wvh-nav .wvh-menu > li.current-menu-ancestor > a,
.wvh-nav .wvh-menu > li.current_page_item > a {
	color: #024D78;
}

/* dropdowns (only if your menu has child items) */
.wvh-nav .wvh-menu .sub-menu {
	position: absolute;
	left: 0;
	top: 100%;
	width: 260px;
	padding: 5px;
	background: #fff;
	box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
	opacity: 0;
	visibility: hidden;
	transform: scaleY(0);
	transform-origin: center top;
	transition: all 0.4s ease;
	z-index: 100;
}
.wvh-nav .wvh-menu > li:hover > .sub-menu,
.wvh-nav .wvh-menu > li:focus-within > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: scaleY(1);
}
.wvh-nav .wvh-menu .sub-menu li { border-bottom: 1px solid rgba(0, 0, 0, 0.08); }
.wvh-nav .wvh-menu .sub-menu li:last-child { border-bottom: 0; }
.wvh-nav .wvh-menu .sub-menu a {
	display: block;
	padding: 10px 15px;
	color: var(--wvh-text);
	font-size: 15px;
	font-weight: 500;
	line-height: 24px;
	transition: color 0.3s ease, background-color 0.3s ease;
}
.wvh-nav .wvh-menu .sub-menu a:hover { color: #fff; background: var(--wvh-accent); }

/* ---- phone pill button ------------------------------------------------- */
.wvh-phone,
.wvh-nav .wvh-menu > li > a.wvh-phone {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 5px 25px 5px 19px;
	border-radius: 50px;
	background: #024D78;
	color: #fff !important;
	font-family: var(--wvh-font);
	font-size: 15px;
	font-weight: 500;
	line-height: 28px;
	letter-spacing: 0.32px;
	white-space: nowrap;
	transition: background-color 0.3s ease-in-out;
}
.wvh-phone:hover,
.wvh-phone:focus-visible { background: var(--wvh-accent, #14a79d); color: #fff; }
.wvh-phone svg { width: 30px; height: 20px; flex: 0 0 33px; }
.wvh-nav .wvh-menu > li > a.wvh-phone:hover,
.wvh-nav .wvh-menu > li > a.wvh-phone:focus-visible { color: #fff; background: #00a896; }

/* ---- hamburger ---------------------------------------------------------- */
.wvh-toggler {
	display: none;
	padding: 0;
	margin: 0;
	border: 0;
	background: transparent;
	cursor: pointer;
}
.wvh-toggler .wvh-bar {
	display: block;
	width: 30px;
	height: 2px;
	margin-bottom: 5px;
	background: #000;
	transition: all 0.3s ease;
}
.wvh-toggler .wvh-bar:last-child { margin-bottom: 0; }

/* Hello Elementor's reset.css gives every <button> a pink border, and a pink background on hover/focus.
   Neutralise that for the header's own buttons. */
.wvh-header .wvh-toggler,
.wvh-header .wvh-toggler:hover,
.wvh-header .wvh-toggler:focus,
.wvh-header .wvh-close,
.wvh-header .wvh-close:hover,
.wvh-header .wvh-close:focus {
	padding: 0;
	border: 0;
	border-radius: 0;
	background-color: transparent;
	box-shadow: none;
}
.wvh-header .wvh-close,
.wvh-header .wvh-close:hover,
.wvh-header .wvh-close:focus { color: #fff; }
.wvh-header .wvh-subtoggle,
.wvh-header .wvh-subtoggle:hover,
.wvh-header .wvh-subtoggle:focus {
	padding: 0;
	border: 0;
	border-radius: 2px;
	background-color: rgba(255, 255, 255, 0.1);
	color: #fff;
}
.wvh-header .wvh-toggler:focus-visible,
.wvh-header .wvh-close:focus-visible,
.wvh-header .wvh-subtoggle:focus-visible { outline: 2px solid var(--wvh-accent); outline-offset: 4px; }

/* ---- sticky bar --------------------------------------------------------- */
.wvh-sticky {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	z-index: 999;
	background: #fff;
	box-shadow: 1px 0 20px 6px rgba(0, 0, 0, 0.05);
	opacity: 0;
	visibility: hidden;
	transition: all 0.5s ease;
}
.wvh-sticky .wvh-logo { padding-bottom: 0; }
.wvh-sticky .wvh-logo img { width: auto; max-width: 220px; max-height: 65px; }
.admin-bar .wvh-sticky { top: 32px; }

.wvh-header.is-fixed .wvh-sticky {
	opacity: 1;
	visibility: visible;
	animation: wvhFadeInDown 0.3s linear 1;
}
@keyframes wvhFadeInDown {
	from { opacity: 0; transform: translate3d(0, -100%, 0); }
	to   { opacity: 1; transform: none; }
}

/* ---- mobile slide-out panel -------------------------------------------- */
.wvh-mobile {
	position: fixed;
	right: 0;
	top: 0;
	width: 300px;
	max-width: 100%;
	height: 100%;
	z-index: 999999;
	opacity: 0;
	visibility: hidden;
	transition: all 0.9s ease;
}
.wvh-backdrop {
	position: fixed;
	inset: 0;
	z-index: 1;
	background: #000;
	opacity: 0;
	transition: all 0.9s ease;
}
.wvh-panel {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	overflow-y: auto;
	z-index: 5;
	background: var(--wvh-panel);
	opacity: 0;
	visibility: hidden;
	transform: translateX(100%);
	transition: all 0.9s ease;
}
.wvh-close {
	position: absolute;
	right: 25px;
	top: 10px;
	z-index: 10;
	width: 24px;
	padding: 0;
	border: 0;
	background: transparent;
	color: #fff;
	font-size: 16px;
	line-height: 30px;
	text-align: center;
	cursor: pointer;
	transition: transform 0.9s ease;
}
.wvh-close:hover { transform: rotate(90deg); }

.wvh-menu-open { overflow: hidden; }
.wvh-menu-open .wvh-mobile { opacity: 1; visibility: visible; }
.wvh-menu-open .wvh-backdrop { opacity: 0.7; }
.wvh-menu-open .wvh-panel { opacity: 1; visibility: visible; transform: translateX(0); transition: all 0.7s ease; }
.wvh-menu-open .wvh-close { transform: rotate(360deg); }

.wvh-panel-logo { padding: 20px 25px 10px; }
.wvh-panel-logo img { max-width: 170px; max-height: 71px; width: auto; }
.wvh-panel-logo .wvh-site-name { color: #fff; font-size: 20px; font-weight: 600; }

.wvh-mobile-nav .wvh-menu { border-bottom: 1px solid rgba(255, 255, 255, 0.1); }
.wvh-mobile-nav .wvh-menu li { position: relative; border-top: 1px solid rgba(255, 255, 255, 0.1); }
.wvh-mobile-nav .wvh-menu li > a {
	position: relative;
	display: block;
	padding: 10px 20px;
	color: #fff;
	font-size: 15px;
	font-weight: 500;
	line-height: 24px;
	text-transform: uppercase;
	transition: all 0.5s ease;
}
.wvh-mobile-nav .wvh-menu li > a::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	height: 0;
	border-left: 5px solid #fff;
	transition: all 0.5s ease;
}
.wvh-mobile-nav .wvh-menu li.current-menu-item > a::before,
.wvh-mobile-nav .wvh-menu li.current_page_item > a::before { height: 100%; }
.wvh-mobile-nav .sub-menu { display: none; }
.wvh-mobile-nav .sub-menu a { margin-left: 20px; text-transform: none; }
.wvh-mobile-nav li.is-open > .sub-menu { display: block; }
.wvh-subtoggle {
	position: absolute;
	right: 6px;
	top: 6px;
	width: 32px;
	height: 32px;
	padding: 0;
	border: 0;
	border-radius: 2px;
	background: rgba(255, 255, 255, 0.1);
	color: #fff;
	cursor: pointer;
	transition: transform 0.5s ease;
}
.wvh-mobile-nav li.is-open > .wvh-subtoggle { transform: rotate(90deg); }

.wvh-mobile-nav .wvh-phone-item { border-top: 0; }
.wvh-mobile-nav .wvh-menu li.wvh-phone-item > a.wvh-phone {
	display: flex;
	justify-content: center;
	margin: 15px;
	padding: 5px 25px 5px 19px;
	text-transform: none;
}
.wvh-mobile-nav .wvh-menu li.wvh-phone-item > a.wvh-phone::before { display: none; }
.wvh-mobile-nav .wvh-phone svg { width: 40px; height: 40px; flex-basis: 40px; }

/* ---- breakpoints -------------------------------------------------------- */
@media (max-width: 991.98px) {
	.wvh-main .wvh-nav { display: none; }
	.wvh-toggler { display: block; }
	.wvh-sticky { display: none; }
	.wvh-logo img { max-height: 80px; }
}
@media (max-width: 767.98px) {
	.wvh-logo { padding-bottom: 0; max-width: 200px; }
	.wvh-logo img { max-height: 60px; }
}
@media (min-width: 992px) {
	.wvh-mobile { display: none; }
}
@media (max-width: 782px) {
	.admin-bar .wvh-sticky { top: 46px; }
}
@media (prefers-reduced-motion: reduce) {
	.wvh-header *, .wvh-header *::before { transition: none !important; animation: none !important; }
}


/* menu links centred between the logo and the phone button */
.wvh-main .wvh-nav,
.wvh-sticky .wvh-nav { flex: 1 1 auto; margin-right: 0; }
.wvh-nav .wvh-menu > li:first-child,
.wvh-nav .wvh-menu > li.wvh-phone-item { margin-left: auto; }

/* small laptops: keep logo + menu + phone on one row */
@media (min-width: 992px) and (max-width: 1199.98px) {
      .wvh-inner { gap: 12px; }
      .wvh-main .wvh-logo { max-width: 200px; }
      .wvh-nav .wvh-menu > li { padding-left: 9px; padding-right: 9px; }
      .wvh-nav .wvh-menu > li > a,
      .wvh-phone { font-size: 14px; }
      .wvh-phone { padding: 5px 16px 5px 12px; }
      .wvh-phone svg { width: 26px; height: 26px; flex-basis: 26px; }
}

.wvh-nav .wvh-menu > li.menu-item-has-children > a {
      display: inline-flex;
      align-items: center;
      gap: 8px;
}
.wvh-nav .wvh-menu > li.menu-item-has-children > a::after {
      content: "";
      width: 6px;
      height: 6px;
      border-right: 1.5px solid currentColor;
      border-bottom: 1.5px solid currentColor;
      transform: translateY(-2px) rotate(45deg);
      transition: transform 0.3s ease;
}
.wvh-nav .wvh-menu > li.menu-item-has-children:hover > a::after,
.wvh-nav .wvh-menu > li.menu-item-has-children:focus-within > a::after {
      transform: translateY(2px) rotate(225deg);
}

.rtl .wvh-nav .wvh-menu > li:first-child, .wvh-nav .wvh-menu{
    margin: 0px!important;
}
.rtl li.menu-item.wvh-phone-item {
    margin-left: 0px !important;
    margin-right: 328px;
}
.rtl .wvh-phone span {
    direction: initial;
}

@media(max-width:767px){
	.wvh-inner{
 padding:0px 20px;
	}
}
/* ---- mobile: the main bar sticks ---------------------------------------- */
/* On desktop the sticky behaviour is a SECOND bar (.wvh-sticky) that fades in
   on scroll. It is hidden below 992px for a good reason: it carries the logo
   and the desktop nav but NOT the hamburger, which lives in .wvh-main. Showing
   it on a phone would give a sticky header with no way into the menu.

   So on mobile the real header sticks instead, hamburger and all.
   position:relative -> sticky leaves the header exactly where it is at rest and
   only changes what happens on scroll, so nothing about the first view moves. */
@media (max-width: 991.98px) {
	.wvh-header {
		position: sticky;
		top: 0;
	}
	.admin-bar .wvh-header { top: 32px; }

	/* Transparent over the banner at the top, solid once scrolled, so the page
	   does not run underneath it illegibly. .is-fixed is already toggled by
	   wvh-header.js at 150px of scroll — no JavaScript change needed. */
	.wvh-header.is-fixed .wvh-main {
		background: #fff;
		box-shadow: 1px 0 20px 6px rgba(0, 0, 0, 0.05);
	}
}
@media (max-width: 782px) {
	/* the WP admin bar is taller on small screens (logged-in views only) */
	.admin-bar .wvh-header { top: 46px; }
}