/* =========================================================
   DVA Navbar for Elementor — frontend styles
   Works with WordPress wp_nav_menu markup:
   .dva-menu > .menu-item[.menu-item-has-children] > a + .sub-menu
   ========================================================= */

.dva-header{
	/* CSS variables — overridden by Elementor Style controls */
	--dva-accent:#1b56b0;
	--dva-menu-color:#414a58;
	--dva-menu-hover:#1b56b0;
	--dva-header-bg:#ffffff;
	--dva-topbar-bg:#ffffff;
	--dva-topbar-label:#5f6a79;
	--dva-topbar-value:#1b56b0;
	--dva-line:#e7eaef;
	--dva-topbar-h:44px;

	font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
	background:var(--dva-header-bg);
	width:100%;
	box-sizing:border-box;
}
.dva-header *,
.dva-header *::before,
.dva-header *::after{ box-sizing:border-box; }

.dva-header.dva-sticky{
	position:fixed;
	top:0;
	left:0;
	right:0;
	width:100%;
	/* Must sit ABOVE the mobile overlay (z-index:1100). The header creates its
	   own stacking context, so the drawer nested inside it can only rise above
	   the overlay if the header itself does. */
	z-index:1200;
}

/* Reserves the header's height in the flow so content doesn't jump under the
   fixed header. Height is kept in sync by JS. */
.dva-header-spacer{ width:100%; }

/* ===================== TOP BAR ===================== */
.dva-topbar{
	background:var(--dva-topbar-bg);
	border-bottom:1px solid var(--dva-line);
	overflow:hidden;
	max-height:var(--dva-topbar-h);
	transition:max-height .35s ease, opacity .3s ease, border-color .3s ease;
}
.dva-topbar-inner{
	max-width:1200px;
	margin:0 auto;
	min-height:var(--dva-topbar-h);
	padding:0 24px;
	display:flex;
	align-items:center;
	justify-content:center;
	gap:34px;
	flex-wrap:wrap;
}
.dva-topbar-item{
	display:flex;
	align-items:center;
	gap:8px;
	font-size:13.5px;
	color:var(--dva-topbar-label);
	white-space:nowrap;
}
.dva-topbar-item svg{ width:15px; height:15px; flex:none; color:var(--dva-accent); }
.dva-topbar-item strong{ color:var(--dva-topbar-value); font-weight:600; }

/* collapsed on scroll */
.dva-header.dva-scrolled .dva-topbar{
	max-height:0;
	opacity:0;
	border-color:transparent;
}

/* ===================== MAIN BAR ===================== */
.dva-mainbar{
	background:var(--dva-header-bg);
	box-shadow:0 6px 24px rgba(17,63,128,.08);
}
.dva-mainbar-inner{
	max-width:1200px;
	margin:0 auto;
	padding:0 24px;
	min-height:78px;
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:20px;
}

/* ---- Logo ---- */
.dva-logo{ display:flex; align-items:center; gap:12px; text-decoration:none; }
.dva-logo-img{ max-height:56px; width:auto; display:block; }
.dva-logo-text{ line-height:1; }
.dva-logo-text .dva-brand{
	font-size:26px; font-weight:700; letter-spacing:2px;
	color:var(--dva-accent); line-height:1;
}
.dva-logo-text .dva-sub{
	display:block; margin-top:3px;
	font-size:9px; font-weight:600; letter-spacing:4px;
	color:var(--dva-accent); opacity:.7; text-transform:uppercase;
}

/* ===================== NAV / MENU ===================== */
.dva-nav{ display:flex; align-items:center; }

.dva-menu{
	display:flex; align-items:center; gap:4px;
	list-style:none; margin:0; padding:0;
}
.dva-menu li{ position:relative; list-style:none; margin:0; }

.dva-menu a{
	display:flex; align-items:center; gap:6px;
	padding:14px 14px;
	font-size:13px; font-weight:500; letter-spacing:.6px; text-transform:uppercase;
	color:var(--dva-menu-color); text-decoration:none;
	transition:color .2s ease;
}
.dva-menu a:hover{ color:var(--dva-menu-hover); }

/* underline accent (top level only) */
.dva-menu > li > a{ position:relative; }
.dva-menu > li > a::before{
	content:""; position:absolute; left:14px; right:14px; bottom:8px;
	height:2px; background:var(--dva-menu-hover);
	transform:scaleX(0); transform-origin:left;
	transition:transform .25s ease;
}
.dva-menu > li:hover > a::before{ transform:scaleX(1); }

/* caret for parents */
.dva-menu .menu-item-has-children > a::after{
	content:""; width:9px; height:9px; flex:none;
	background:currentColor;
	-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6z'/%3E%3C/svg%3E") center/contain no-repeat;
	mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6z'/%3E%3C/svg%3E") center/contain no-repeat;
	transition:transform .25s ease;
}
.dva-menu .menu-item-has-children:hover > a::after{ transform:rotate(180deg); }

/* ---- Dropdown submenu (desktop) ---- */
.dva-menu .sub-menu{
	position:absolute; top:100%; left:0;
	min-width:230px;
	background:#fff;
	border-radius:8px;
	box-shadow:0 12px 34px rgba(17,63,128,.14);
	border-top:3px solid var(--dva-accent);
	padding:8px 0; margin:0; list-style:none;
	opacity:0; visibility:hidden; transform:translateY(10px);
	transition:opacity .22s ease, transform .22s ease, visibility .22s;
	z-index:20;
}
.dva-menu .menu-item-has-children:hover > .sub-menu{
	opacity:1; visibility:visible; transform:translateY(0);
}
.dva-menu .sub-menu a{
	display:block; padding:11px 20px;
	font-size:13.5px; font-weight:500; letter-spacing:0; text-transform:none;
	color:var(--dva-menu-color);
	transition:background .18s ease, color .18s ease, padding .18s ease;
}
.dva-menu .sub-menu a::before{ display:none; }
.dva-menu .sub-menu a:hover{ background:#f4f7fc; color:var(--dva-menu-hover); padding-left:24px; }

/* ---- Hamburger ---- */
.dva-burger{
	display:none;
	width:44px; height:44px; padding:0;
	border:none; background:transparent; cursor:pointer;
	flex-direction:column; justify-content:center; align-items:center; gap:5px;
}
.dva-burger span{
	width:26px; height:2.5px; border-radius:3px;
	background:var(--dva-accent);
	transition:transform .3s ease, opacity .25s ease;
}
.dva-header.dva-open .dva-burger span:nth-child(1){ transform:translateY(7.5px) rotate(45deg); }
.dva-header.dva-open .dva-burger span:nth-child(2){ opacity:0; }
.dva-header.dva-open .dva-burger span:nth-child(3){ transform:translateY(-7.5px) rotate(-45deg); }

/* ---- Mobile overlay ---- */
.dva-overlay{
	position:fixed; inset:0;
	background:rgba(18,63,128,.4);
	opacity:0; visibility:hidden;
	transition:opacity .3s ease, visibility .3s ease;
	z-index:1100;
}
body.dva-menu-open .dva-overlay{ opacity:1; visibility:visible; }
body.dva-menu-open{ overflow:hidden; }

/* ===================== RESPONSIVE ===================== */
@media (max-width:992px){
	.dva-topbar-inner{ gap:20px; }
	.dva-burger{ display:flex; }

	/* nav becomes a right-side drawer */
	.dva-nav{
		position:fixed; top:0; right:0;
		width:min(340px,86vw); height:100vh;
		background:#fff;
		box-shadow:-8px 0 40px rgba(17,63,128,.16);
		transform:translateX(105%);
		transition:transform .32s cubic-bezier(.4,0,.2,1);
		z-index:1200; overflow-y:auto;
		padding:88px 0 40px;
		display:block;
	}
	.dva-header.dva-open .dva-nav{ transform:translateX(0); }

	.dva-menu{ flex-direction:column; align-items:stretch; gap:0; }
	.dva-menu > li{ border-bottom:1px solid var(--dva-line); }
	.dva-menu a{ justify-content:space-between; padding:16px 26px; font-size:14px; letter-spacing:.5px; }
	.dva-menu > li > a::before{ display:none; }
	.dva-menu .menu-item-has-children > a::after{ width:12px; height:12px; }

	/* submenu = accordion */
	.dva-menu .sub-menu{
		position:static; opacity:1; visibility:visible; transform:none;
		box-shadow:none; border-top:none; border-radius:0; min-width:0;
		background:#f6f8fc;
		padding:0;
		max-height:0; overflow:hidden;
		transition:max-height .3s ease;
	}
	.dva-menu .menu-item.dva-sub-open > .sub-menu{ max-height:800px; }
	.dva-menu .menu-item.dva-sub-open > a::after{ transform:rotate(180deg); }
	.dva-menu .sub-menu a{ padding:13px 40px; }
	.dva-menu .sub-menu a:hover{ padding-left:44px; }
}

@media (max-width:520px){
	.dva-header{ --dva-topbar-h:92px; }
	.dva-topbar-inner{
		flex-direction:column; gap:2px;
		padding:8px 16px; min-height:0;
	}
	.dva-mainbar-inner{ min-height:64px; padding:0 16px; }
	.dva-logo-img{ max-height:44px; }
	.dva-logo-text .dva-brand{ font-size:22px; }
}

/* respect reduced motion */
@media (prefers-reduced-motion:reduce){
	.dva-header *{ transition:none !important; }
}
