/*
 * TIS Header — utility bar + navigation.
 * Desktop values are Figma px multiplied by --tis-u (see base.css). Burger layout below 1280px.
 */

.tis-header {
	position: relative;
	z-index: 60;
	font-family: var(--tis-font-body);
}

/* ---------------------------------------------------------------------
 * Utility bar (Figma: 1672 x 52, #172d4b)
 * ------------------------------------------------------------------ */
.tis-header__bar {
	height: calc(52 * var(--tis-u));
	background: var(--tis-navy);
	color: #fff;
	font-size: max(12px, calc(14 * var(--tis-u)));
	line-height: 1.4;
	--tis-bar-divider: var(--tis-divider);
}

.tis-header__bar-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 100%;
	max-width: var(--tis-container);
	margin: 0 auto;
	padding: 0 calc(76 * var(--tis-u));
}

.tis-header__promises,
.tis-header__bar-right,
.tis-header__socials {
	display: flex;
	align-items: center;
}

.tis-header__promise {
	position: relative;
	display: flex;
	align-items: center;
	white-space: nowrap;
}

.tis-header__promise + .tis-header__promise {
	margin-left: calc(35 * var(--tis-u));
	padding-left: calc(35 * var(--tis-u));
}

.tis-header__promise + .tis-header__promise::before {
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	width: 1px;
	height: calc(17 * var(--tis-u));
	background: var(--tis-bar-divider);
	transform: translateY(-50%);
}

.tis-header__promise-link {
	display: flex;
	align-items: center;
}

.tis-header__promise-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: none;
	width: max(18px, calc(22 * var(--tis-u)));
	height: max(18px, calc(22 * var(--tis-u)));
	margin-right: calc(13 * var(--tis-u));
	font-size: max(18px, calc(22 * var(--tis-u)));
	color: #fff;
}

.tis-header__promise-icon .tis-svg { stroke-width: 1.6; }

.tis-header__socials {
	gap: calc(12 * var(--tis-u));
	margin-right: calc(47 * var(--tis-u));
	font-size: max(10px, calc(12 * var(--tis-u)));
}

.tis-header__social {
	display: inline-flex;
	align-items: center;
	color: var(--tis-divider);
	transition: color 0.2s ease;
}

.tis-header__social:hover { color: #fff; }
.tis-header__social .tis-svg { display: block; }

.tis-header__location {
	position: relative;
	display: inline-flex;
	align-items: center;
	padding-left: calc(34 * var(--tis-u));
	white-space: nowrap;
}

.tis-header__location::before {
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	width: 1px;
	height: calc(17 * var(--tis-u));
	background: var(--tis-bar-divider);
	transform: translateY(-50%);
}

.tis-header__socials:empty + .tis-header__location { padding-left: 0; }
.tis-header__socials:empty + .tis-header__location::before { display: none; }

.tis-header__location-icon {
	display: inline-flex;
	margin-right: calc(10 * var(--tis-u));
	font-size: max(16px, calc(23 * var(--tis-u)));
}

.tis-header__location-icon .tis-svg { stroke-width: 1.6; }

.tis-header__location-chevron {
	display: inline-flex;
	margin-left: calc(6 * var(--tis-u));
	font-size: max(12px, calc(14 * var(--tis-u)));
}

/* ---------------------------------------------------------------------
 * Navigation bar (Figma: 1672 x 100, white 78% over the hero)
 * ------------------------------------------------------------------ */
.tis-header__navwrap { height: calc(100 * var(--tis-u)); }

.tis-header__nav {
	height: calc(100 * var(--tis-u));
	background: rgba(255, 255, 255, 0.78);
	-webkit-backdrop-filter: blur(14px);
	backdrop-filter: blur(14px);
	transition: box-shadow 0.25s ease, background-color 0.25s ease;
}

.tis-header__nav-inner {
	display: flex;
	align-items: flex-start;
	height: 100%;
	max-width: var(--tis-container);
	margin: 0 auto;
	padding: 0 calc(48 * var(--tis-u)) 0 calc(64 * var(--tis-u));
}

.tis-header__logo {
	display: block;
	flex: none;
	width: calc(231 * var(--tis-u));
	margin-top: calc(14 * var(--tis-u));
}

.tis-header__logo img,
.tis-header__logo-img {
	display: block;
	width: calc(209 * var(--tis-u));
	height: auto;
}

/* Menu */
.tis-header__menu {
	margin-left: calc(78 * var(--tis-u));
	margin-top: calc(49 * var(--tis-u));
}

.tis-header__menu ul { margin: 0; padding: 0; list-style: none; }

.tis-header__menu > ul,
.tis-header__menu > .tis-header__list {
	display: flex;
	align-items: flex-start;
	gap: calc(38 * var(--tis-u));
}

.tis-header__menu li { position: relative; }

.tis-header__menu a {
	position: relative;
	display: flex;
	align-items: center;
	color: var(--tis-ink);
	font-size: max(12px, calc(14 * var(--tis-u)));
	font-weight: 500;
	line-height: 1.4;
	white-space: nowrap;
	text-decoration: none;
	transition: color 0.2s ease;
}

.tis-header__menu > ul > li > a:hover,
.tis-header__menu > ul > li:focus-within > a { color: var(--tis-primary); }

/* Active underline (Figma: 41 x 1 blue rule, 9px under the label) */
.tis-header__menu > ul > li > a::before {
	content: '';
	position: absolute;
	left: 0;
	top: calc(100% + 9.4 * var(--tis-u));
	width: 100%;
	height: 1px;
	background: var(--tis-primary);
	opacity: 0;
	transform: scaleX(0.4);
	transform-origin: left center;
	transition: opacity 0.25s ease, transform 0.25s ease;
}

.tis-header__menu > ul > li.is-active > a,
.tis-header__menu > ul > li.current-menu-item > a { color: var(--tis-primary); }

.tis-header__menu > ul > li.is-active > a::before,
.tis-header__menu > ul > li.current-menu-item > a::before,
.tis-header__menu > ul > li > a:hover::before {
	opacity: 1;
	transform: none;
}

/* Dropdown chevron after any parent item */
.tis-header__menu .menu-item-has-children > a::after {
	content: '';
	flex: none;
	width: max(8px, calc(8 * var(--tis-u)));
	height: max(8px, calc(8 * var(--tis-u)));
	margin-left: calc(4 * var(--tis-u));
	background-color: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%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' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / contain no-repeat;
	transition: transform 0.25s ease;
}

.tis-header__menu .menu-item-has-children:hover > a::after,
.tis-header__menu .menu-item-has-children:focus-within > a::after { transform: rotate(180deg); }

/* Dropdown panel */
.tis-header__menu .sub-menu {
	position: absolute;
	left: calc(-16 * var(--tis-u));
	top: calc(100% + 22 * var(--tis-u));
	z-index: 20;
	min-width: 230px;
	padding: 8px;
	background: #fff;
	border: 1px solid var(--tis-line);
	border-radius: 14px;
	box-shadow: 0 18px 40px rgba(23, 45, 75, 0.14);
	opacity: 0;
	visibility: hidden;
	transform: translateY(8px);
	transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s;
}

/* Bridge the gap between the label and the panel so the hover doesn't drop. */
.tis-header__menu .menu-item-has-children::after {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	top: 100%;
	height: calc(24 * var(--tis-u));
}

.tis-header__menu .menu-item-has-children:hover > .sub-menu,
.tis-header__menu .menu-item-has-children:focus-within > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: none;
}

.tis-header__menu .sub-menu a {
	display: block;
	padding: 10px 14px;
	border-radius: 8px;
	font-size: 14px;
	font-weight: 500;
	white-space: nowrap;
}

.tis-header__menu .sub-menu a:hover { background: var(--tis-soft); color: var(--tis-primary); }

/* Actions: phone card + CTA */
.tis-header__actions {
	display: flex;
	align-items: center;
	gap: calc(20 * var(--tis-u));
	align-self: flex-start;
	margin-left: auto;
	margin-top: calc(28 * var(--tis-u));
	height: calc(60 * var(--tis-u));
}

.tis-header__phone {
	display: inline-flex;
	align-items: center;
	gap: calc(16 * var(--tis-u));
	min-width: calc(196 * var(--tis-u));
	height: calc(60 * var(--tis-u));
	padding: 0 calc(14 * var(--tis-u)) 0 calc(22 * var(--tis-u));
	background: #fff;
	border: 1px solid var(--tis-primary);
	border-radius: calc(40 * var(--tis-u));
	color: var(--tis-ink);
	transition: box-shadow 0.25s ease, transform 0.25s ease;
}

.tis-header__phone:hover { box-shadow: var(--tis-shadow-btn); transform: translateY(-1px); }

.tis-header__phone-icon {
	display: inline-flex;
	flex: none;
	width: max(22px, calc(28 * var(--tis-u)));
	height: max(22px, calc(28 * var(--tis-u)));
	font-size: max(22px, calc(28 * var(--tis-u)));
	color: var(--tis-primary);
}

.tis-header__phone-text { display: flex; flex-direction: column; }

.tis-header__phone-num {
	font-size: max(13px, calc(16 * var(--tis-u)));
	font-weight: 700;
	line-height: 1.4;
	color: var(--tis-ink);
}

.tis-header__phone-cap {
	font-size: max(11px, calc(12 * var(--tis-u)));
	font-weight: 400;
	line-height: 1.4;
	color: var(--tis-muted);
}

.tis-header__cta {
	min-width: calc(178 * var(--tis-u));
	min-height: calc(56 * var(--tis-u));
	padding: 0 calc(24 * var(--tis-u));
	font-size: max(14px, calc(17 * var(--tis-u)));
}

.tis-header__cta .tis-btn__icon { width: calc(22 * var(--tis-u)); height: calc(22 * var(--tis-u)); font-size: max(16px, calc(22 * var(--tis-u))); }

/* Burger (hidden on desktop) */
.tis-header__burger {
	display: none;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin-left: 16px;
	padding: 0;
	border: 1px solid var(--tis-line);
	border-radius: 12px;
	background: #fff;
	color: var(--tis-ink);
	font-size: 24px;
	cursor: pointer;
}

.tis-header__burger-close { display: none; }
.tis-header__burger[aria-expanded='true'] .tis-header__burger-open { display: none; }
.tis-header__burger[aria-expanded='true'] .tis-header__burger-close { display: inline-flex; }

.tis-header__panel { display: none; }

/* ---------------------------------------------------------------------
 * Sticky navigation bar
 * ------------------------------------------------------------------ */
.tis-header[data-sticky='yes'].is-stuck .tis-header__nav {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 999;
	background: rgba(255, 255, 255, 0.94);
	box-shadow: 0 10px 30px rgba(23, 45, 75, 0.1);
}

.admin-bar .tis-header[data-sticky='yes'].is-stuck .tis-header__nav { top: 32px; }

@media (max-width: 782px) {
	.admin-bar .tis-header[data-sticky='yes'].is-stuck .tis-header__nav { top: 46px; }
}

/* ---------------------------------------------------------------------
 * Compact layout (burger menu): everything below 1280px
 * ------------------------------------------------------------------ */
@media (max-width: 1280px) {
	.tis-header__bar { height: 44px; font-size: 13px; }
	.tis-header__bar-inner { padding: 0 var(--tis-gutter); }
	.tis-header__promise + .tis-header__promise { margin-left: 28px; padding-left: 28px; }
	.tis-header__promise-icon { width: 18px; height: 18px; margin-right: 10px; font-size: 18px; }
	.tis-header__socials { gap: 12px; margin-right: 28px; font-size: 12px; }
	.tis-header__location { padding-left: 28px; }
	.tis-header__location-icon { margin-right: 8px; font-size: 18px; }
	.tis-header__promise + .tis-header__promise::before,
	.tis-header__location::before { height: 16px; }

	.tis-header__navwrap,
	.tis-header__nav { height: 84px; }
	.tis-header__nav-inner { align-items: center; padding: 0 var(--tis-gutter); }
	.tis-header__logo { width: 176px; margin-top: 0; }
	.tis-header__logo img,
	.tis-header__logo-img { width: 160px; }

	.tis-header__menu { display: none; }
	.tis-header__actions { align-self: center; height: auto; margin-top: 0; gap: 14px; }
	.tis-header__phone { min-width: 0; height: 52px; gap: 12px; padding: 0 18px 0 16px; border-radius: 40px; }
	.tis-header__phone-icon { width: 24px; height: 24px; font-size: 24px; }
	.tis-header__phone-num { font-size: 15px; }
	.tis-header__phone-cap { font-size: 11px; }
	.tis-header__cta { min-width: 0; min-height: 50px; padding: 0 22px; font-size: 15px; gap: 10px; }
	.tis-header__cta .tis-btn__icon { width: 18px; height: 18px; font-size: 18px; }
	.tis-header__burger { display: inline-flex; flex: none; }

	.tis-header__panel {
		display: block;
		max-height: 0;
		overflow: hidden;
		background: #fff;
		border-top: 1px solid var(--tis-line);
		box-shadow: 0 24px 40px rgba(23, 45, 75, 0.12);
		transition: max-height 0.35s ease;
	}

	.tis-header__panel[hidden] { display: block; visibility: hidden; }
	.tis-header.is-open .tis-header__panel { max-height: calc(100vh - 128px); overflow-y: auto; visibility: visible; }

	.tis-header__panel-menu { padding: 8px var(--tis-gutter) 0; }
	.tis-header__panel-menu ul { margin: 0; padding: 0; list-style: none; }
	.tis-header__panel-menu li { border-bottom: 1px solid var(--tis-line); }
	.tis-header__panel-menu a {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 16px 0;
		color: var(--tis-ink);
		font-size: 16px;
		font-weight: 500;
		text-decoration: none;
	}
	.tis-header__panel-menu li.is-active > a,
	.tis-header__panel-menu li.current-menu-item > a { color: var(--tis-primary); }
	.tis-header__panel-menu .menu-item-has-children > a::after {
		content: '';
		width: 16px;
		height: 16px;
		background-color: currentColor;
		-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%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' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / contain no-repeat;
		transition: transform 0.25s ease;
	}
	.tis-header__panel-menu .menu-item-has-children.is-expanded > a::after { transform: rotate(180deg); }
	.tis-header__panel-menu .sub-menu { display: none; padding: 0 0 10px 14px; }
	.tis-header__panel-menu .is-expanded > .sub-menu { display: block; }
	.tis-header__panel-menu .sub-menu li { border: 0; }
	.tis-header__panel-menu .sub-menu a { padding: 11px 0; color: var(--tis-muted); font-size: 15px; font-weight: 500; }

	.tis-header__panel-actions {
		display: none;
		flex-wrap: wrap;
		gap: 14px;
		padding: 20px var(--tis-gutter) 26px;
	}

	.tis-header__panel-actions .tis-header__cta { flex: 1 1 200px; }

	/* Hide the in-bar actions that move into the panel on small screens (see below). */
}

/* Tablet: 3rd/4th promises and the social icons make way for space */
@media (max-width: 1024px) {
	.tis-header__promise:nth-child(n + 3) { display: none; }
	.tis-header__socials { display: none; }
	.tis-header__location { padding-left: 0; }
	.tis-header__location::before { display: none; }
}

/* Mobile */
@media (max-width: 767px) {
	.tis-header__bar { height: 40px; font-size: 12px; }
	.tis-header__promise:nth-child(n + 2) { display: none; }
	.tis-header__promise-icon { width: 16px; height: 16px; margin-right: 8px; font-size: 16px; }
	.tis-header__location-icon { font-size: 16px; }
	.tis-header__navwrap,
	.tis-header__nav { height: 72px; }
	.tis-header__logo { width: 140px; }
	.tis-header__logo img,
	.tis-header__logo-img { width: 126px; }
	.tis-header__actions { display: none; }
	.tis-header__panel-actions { display: flex; flex-direction: column; align-items: stretch; }
	.tis-header__panel-actions .tis-header__phone { justify-content: flex-start; }
	.tis-header__panel-actions .tis-header__cta { flex: none; width: 100%; }
	.tis-header__burger { margin-left: auto; }
	.tis-header.is-open .tis-header__panel { max-height: calc(100vh - 112px); }
}

@media (prefers-reduced-motion: reduce) {
	.tis-header__panel,
	.tis-header__nav,
	.tis-header__menu .sub-menu,
	.tis-header__menu > ul > li > a::before { transition: none; }
}

@media (min-width: 1025px) {

  /* Logo, menu aur buttons ko vertically center karo */
  .tis-header .tis-header__nav-inner {
    align-items: center;
  }

  /* Menu ke upar wala extra margin/padding hatao */
  .tis-header .tis-header__menu {
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 0;
    align-self: center;
  }

  /* Menu ko logo aur buttons ke beech horizontally center karo */
  .tis-header .tis-header__menu {
    margin-left: auto;
    margin-right: auto;
  }
}
