/* VS Mega Menu 1.0.0 — header menu for VedicSiddhanta.in
   Colours follow the site: navy #132a6b, gold #d9a441, saffron-brown #a8611a. */

.vsmm{
	--vsmm-ink:#16224a;
	--vsmm-text:#4a5163;
	--vsmm-gold:#c08a2c;
	--vsmm-accent:#a8611a;
	--vsmm-line:#ece4d3;
	--vsmm-tint:#fff8ea;
	--vsmm-bg:#fff;
	margin-left:auto;
	position:static;
	font-family:Manrope,"Segoe UI",system-ui,sans-serif;
}
#vsShellHeader .vsmm *{box-sizing:border-box}

/* ---------- tab bar ---------- */
#vsShellHeader .vsmm-bar{display:flex;align-items:center;gap:2px;margin:0;padding:0;list-style:none}
#vsShellHeader .vsmm-tab{position:relative;display:flex;align-items:center;margin:0;padding:0;list-style:none}
#vsShellHeader .vsmm-t{
	display:inline-flex;align-items:center;height:44px;padding:0 4px 0 10px;
	font-size:.9rem !important;font-weight:600;line-height:1.2;letter-spacing:0 !important;text-transform:none !important;
	color:var(--vsmm-ink) !important;text-decoration:none !important;white-space:nowrap;position:relative;background:none !important;
	transition:color .15s;
}
#vsShellHeader .vsmm-tab:not(.has-panel) .vsmm-t{padding-right:10px}
#vsShellHeader .vsmm-t::after{
	content:"";position:absolute;left:10px;right:4px;bottom:4px;height:2px;border-radius:2px;
	background:var(--vsmm-accent);transform:scaleX(0);transform-origin:left;transition:transform .2s;
}
#vsShellHeader .vsmm-tab:not(.has-panel) .vsmm-t::after{right:10px}
#vsShellHeader .vsmm-tab.is-active>.vsmm-t,
#vsShellHeader .vsmm-tab:hover>.vsmm-t,
#vsShellHeader .vsmm-tab.is-open>.vsmm-t{color:var(--vsmm-accent) !important}
#vsShellHeader .vsmm-tab.is-active>.vsmm-t::after{transform:scaleX(1)}
#vsShellHeader .vsmm-tog{
	display:inline-grid;place-items:center;width:20px;height:44px;margin:0 6px 0 0;padding:0;
	background:none !important;border:0 !important;box-shadow:none !important;border-radius:4px;cursor:pointer;color:var(--vsmm-ink);
}
#vsShellHeader .vsmm-caret{width:10px;height:10px;transition:transform .2s;opacity:.8}
#vsShellHeader .vsmm-tab.is-open .vsmm-caret{transform:rotate(180deg);color:var(--vsmm-accent)}
#vsShellHeader .vsmm-t:focus-visible,#vsShellHeader .vsmm-tog:focus-visible,
#vsShellHeader .vsmm-panel a:focus-visible{outline:2px solid var(--vsmm-gold);outline-offset:2px;border-radius:4px}

/* ---------- panels (shared) ---------- */
#vsShellHeader .vsmm-panel{
	position:absolute;z-index:999;background:var(--vsmm-bg);
	border:1px solid var(--vsmm-line);border-radius:14px;
	box-shadow:0 24px 60px -18px rgba(19,42,107,.28),0 4px 14px rgba(19,42,107,.06);
	opacity:0;visibility:hidden;transform:translateY(8px);
	transition:opacity .18s ease,transform .18s ease,visibility 0s linear .18s;
	text-align:left;
}
#vsShellHeader .vsmm-panel.is-open{opacity:1;visibility:visible;transform:none;transition:opacity .18s ease,transform .18s ease,visibility 0s}

/* Full mega panel: centred under the whole header */
#vsShellHeader .vsmm-panel--mega{
	top:calc(100% - 6px);left:50%;
	width:min(1460px,calc(100vw - 32px));
	transform:translate(-50%,8px);
	padding:20px 8px 22px;
}
#vsShellHeader .vsmm-panel--mega.is-open{transform:translate(-50%,0)}
#vsShellHeader .vsmm-panel--mega::before{content:"";position:absolute;left:0;right:0;top:-18px;height:18px}
#vsShellHeader .vsmm-grid{display:grid;grid-template-columns:repeat(var(--vsmm-cols,8),minmax(0,1fr))}
#vsShellHeader .vsmm-panel--mega .vsmm-col{padding:2px 14px 4px 18px;border-left:1px solid var(--vsmm-line);border-radius:10px;transition:background .2s}
#vsShellHeader .vsmm-panel--mega .vsmm-col:first-child{border-left:0}
#vsShellHeader .vsmm[data-hl="1"] .vsmm-col.is-hl{background:var(--vsmm-tint)}

/* One panel per tab */
#vsShellHeader .vsmm-panel--single{top:calc(100% + 4px);left:0;min-width:250px;padding:12px 8px}
#vsShellHeader .vsmm-panel--single::before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px}
#vsShellHeader .vsmm-panel--single.is-wide .vsmm-links{columns:2;column-gap:12px;min-width:460px}
#vsShellHeader .vsmm-tab:nth-last-child(-n+3) .vsmm-panel--single{left:auto;right:0}

/* Column heading */
#vsShellHeader .vsmm-ch{
	display:flex;align-items:center;gap:10px;margin:0 0 12px;padding:2px 0;
	font-family:"Cormorant Garamond","EB Garamond",Georgia,serif !important;font-size:1.12rem !important;font-weight:700;line-height:1.15;
	color:var(--vsmm-ink) !important;text-decoration:none !important;letter-spacing:0 !important;text-transform:none !important;
}
#vsShellHeader .vsmm-ch:hover{color:var(--vsmm-accent) !important}
#vsShellHeader .vsmm-ch-ic{width:28px;height:28px;flex:none;color:var(--vsmm-gold);stroke-width:1.35}

/* Links */
#vsShellHeader .vsmm-links{list-style:none;margin:0;padding:0}
#vsShellHeader .vsmm-links li{margin:0;padding:0;list-style:none;break-inside:avoid}
#vsShellHeader .vsmm-links li::before,#vsShellHeader .vsmm-links li::marker{content:none !important;display:none !important}
#vsShellHeader .vsmm-l{
	display:flex;align-items:center;gap:7px;padding:4px 6px 4px 0;margin:0 -6px 0 0;
	font-size:.84rem !important;font-weight:500;line-height:1.35;color:var(--vsmm-text) !important;
	text-decoration:none !important;letter-spacing:0 !important;text-transform:none !important;
	border-radius:6px;transition:color .15s,transform .15s;background:none !important;
}
#vsShellHeader .vsmm-l::before,#vsShellHeader .vsmm-l::after{content:none !important;display:none !important}
#vsShellHeader .vsmm-l:hover{color:var(--vsmm-accent) !important;transform:translateX(3px)}
#vsShellHeader .vsmm-l[aria-current="page"]{color:var(--vsmm-accent) !important;font-weight:700}
#vsShellHeader .vsmm-lt{display:flex;flex-direction:column;min-width:0}
#vsShellHeader .vsmm-lt small{font-size:.7rem;font-weight:500;color:#8b8f9c;line-height:1.2;margin-top:1px}
#vsShellHeader .vsmm-l-ic{width:17px;height:17px;flex:none;color:var(--vsmm-gold);stroke-width:1.7}
#vsShellHeader .vsmm-panel--single .vsmm-l{padding:7px 10px;margin:0}
#vsShellHeader .vsmm-panel--single .vsmm-l:hover{background:var(--vsmm-tint) !important;transform:none}

/* Highlighted links (with a badge) — e.g. Chat / Call with Astrologer:
   a soft card with a small LIVE tag on its top edge. */
#vsShellHeader .vsmm-li.has-badge{margin:9px 0 6px !important}
#vsShellHeader .vsmm-li.has-badge+.vsmm-li.has-badge{margin-top:12px !important}
#vsShellHeader .vsmm-li.has-badge .vsmm-l{
	position:relative;margin:0;padding:7px 9px;gap:8px;
	color:var(--vsmm-ink) !important;font-weight:700;
	background:linear-gradient(180deg,#fffdf7,#fbf3e1) !important;border:1px solid #ecdcb4;border-radius:9px;
	box-shadow:0 1px 0 rgba(255,255,255,.8) inset;
}
#vsShellHeader .vsmm-li.has-badge .vsmm-l:hover{color:var(--vsmm-accent) !important;border-color:var(--vsmm-gold);transform:none;box-shadow:0 6px 14px -8px rgba(168,97,26,.45)}
#vsShellHeader .vsmm-li.has-badge .vsmm-l-ic{width:19px;height:19px;color:var(--vsmm-accent)}
#vsShellHeader .vsmm-li.has-badge .vsmm-badge{position:absolute;top:-8px;right:8px;margin:0;box-shadow:0 0 0 2px #fff}
.vsmm-badge{
	display:inline-flex;align-items:center;gap:4px;flex:none;margin-left:auto;padding:1px 7px 1px 6px;
	font-style:normal;font-size:.58rem !important;font-weight:800;letter-spacing:.06em;text-transform:uppercase;line-height:1.5;
	color:#1f7a45 !important;background:#e3f5e9;border-radius:99px;
}
.vsmm-badge::before{content:"";width:6px;height:6px;border-radius:50%;background:#22a05a;animation:vsmmPulse 1.6s ease-in-out infinite}
@keyframes vsmmPulse{0%,100%{box-shadow:0 0 0 0 rgba(34,160,90,.5)}50%{box-shadow:0 0 0 4px rgba(34,160,90,0)}}

#vsShellHeader .vsmm-badge--tab{margin-left:5px;padding:0 5px;font-size:.52rem !important;transform:translateY(-6px)}
#vsShellHeader .vsmm-badge--tab::before{width:5px;height:5px}

/* Group heading inside a column */
#vsShellHeader .vsmm-gh{margin:12px 0 4px !important;padding-top:10px !important;border-top:1px dashed var(--vsmm-line)}
#vsShellHeader .vsmm-gh:first-child{margin-top:0 !important;padding-top:0 !important;border-top:0}
#vsShellHeader .vsmm-gh a,#vsShellHeader .vsmm-gh span{font-size:.66rem !important;font-weight:800;letter-spacing:.14em !important;text-transform:uppercase !important;color:#c2410c !important;text-decoration:none !important}

/* ---------- laptop sizes ---------- */
@media (max-width:1679px){
	#vsShellHeader .vsmm-t{font-size:.84rem !important;padding-left:8px}
	#vsShellHeader .vsmm-t::after{left:8px}
	#vsShellHeader .vsmm-tog{margin-right:3px;width:16px}
	#vsShellHeader .vsmm-panel--mega .vsmm-col{padding:2px 10px 4px 12px}
	#vsShellHeader .vsmm-ch{font-size:1.02rem !important;gap:8px}
	#vsShellHeader .vsmm-ch-ic{width:24px;height:24px}
	#vsShellHeader .vsmm-l{font-size:.8rem !important}
}
@media (max-width:1359px){
	#vsShellHeader .vsmm-t{font-size:.8rem !important;padding-left:6px}
	#vsShellHeader .vsmm-t::after{left:6px}
	#vsShellHeader .vsmm-tog{width:14px;margin-right:2px}
	#vsShellHeader .vsmm-panel--mega{padding:18px 4px 18px}
	#vsShellHeader .vsmm-panel--mega .vsmm-col{padding:2px 8px 4px 10px}
	#vsShellHeader .vsmm-ch{font-size:.96rem !important;gap:6px}
	#vsShellHeader .vsmm-ch-ic{width:21px;height:21px}
	#vsShellHeader .vsmm-l{font-size:.77rem !important}
	#vsShellHeader .vsmm-li.has-badge .vsmm-l{padding:6px 7px;gap:6px}
}
@media (max-width:1239px){
	#vsShellHeader .vsmm-grid{grid-template-columns:repeat(4,minmax(0,1fr));row-gap:18px}
	#vsShellHeader .vsmm-panel--mega .vsmm-col:nth-child(4n+1){border-left:0}
	#vsShellHeader .vsmm-panel--mega{max-height:calc(100vh - 140px);overflow:auto}
}

/* ---------- phone drawer extras (site styles do the rest) ---------- */
#vsShellHeader .vs-mob-sub .vsmm-mob-hl{font-weight:700;color:#132a6b !important}
#vsShellHeader .vs-mob-sub .vsmm-mob-ic{width:16px;height:16px;vertical-align:-3px;margin-right:6px;color:#c08a2c}
#vsShellHeader .vs-mob-sub .vsmm-badge{margin-left:6px;vertical-align:1px}
#vsShellHeader .vsmm-mob.is-active>summary .vs-mob-item,#vsShellHeader a.vsmm-mob.is-active{color:#a8611a !important}

/* ---------- top bar ---------- */
#vsShellHeader .vsmm-top-ic{width:14px;height:14px;vertical-align:-2px;margin-right:5px}

/* ---------- Talk to an Astrologer page: highlight chat or call buttons ---------- */
.vsmm-want-chat .vsa-astro-act [data-mode="chat"],
.vsmm-want-call .vsa-astro-act [data-mode="voice"],
.vsmm-want-call .vsa-astro-act [data-mode="video"]{animation:vsmmRing 1.4s ease-out 3}
@keyframes vsmmRing{0%{box-shadow:0 0 0 0 rgba(217,164,65,.75)}100%{box-shadow:0 0 0 10px rgba(217,164,65,0)}}

@media (prefers-reduced-motion:reduce){
	#vsShellHeader .vsmm-panel,#vsShellHeader .vsmm-l,#vsShellHeader .vsmm-caret{transition:none}
	.vsmm-badge::before{animation:none}
}

/* Show the button text ("Book Consultation") on wide laptops too, as in the design */
@media (min-width:1440px){
	#vsShellHeader .vs-mhead-cta .vs-mbtn span{display:inline !important}
	#vsShellHeader .vs-mhead-cta .vs-mbtn{padding:11px 18px !important}
}