* {
	font-family: "Google Sans Flex", sans-serif;
}

:root {
	--o: #ffcf50;
	--b: #ffcf50;
	--ink: #eaf2ff;
	--nav: #0b2033;
	--r: 16px;
	--tile-b: #e8edf3;
	--ring: #e9f1ff;
	--qx-orange: #ffcf50;
	--qx-orange2: #ffcf50;
	--ht-line: #e8edf3;
	--ht-ink: #0f2238;
	--ht-muted: #6b7b8f;
	--ht-accent: #00bfa6;
	--o: #ffffff;
	--b: #fbd04d;
	--ink: #eaf2ff;
	--nav: #0b2033;
	--r: 16px;
	--tile-b: #e8edf3;
	--ring: #e9f1ff;
	--qx-orange: #fbd04d;
	--qx-orange2: #fbd04d;
	--ht-line: #e8edf3;
	--ht-ink: #0f2238;
	--ht-muted: #6b7b8f;
	--ht-accent: #00bfa6;
  
	--ink: #eaf2ff;

	--nav: #0b2033;

	--line: #e8edf3;

	--soft: #f6f7fb;
	--accent: #ffd100;
	--nav1: #05128aff;
	--nav2: #020072ff;
	--white: #ffffff;
	--drawer-w: 86vw;
	--glass: rgba(255, 255, 255, 0.04);
}



/* topbanr */
:root {
	--topbar-bg: #61c1f5;
	--topbar-text: #ffffff;
}

.text-white {
	color: #4b4848 !important;
	font-weight: 600;
	font-size: 14px;
}

.bg-topbar {
	background: #ffea1b;
	color: var(--topbar-text);
	font-size: 14px;
}

.topbar .bi {
	font-size: 16px;
}

.lx-col h6 {
	font-family: "Roboto Condensed", sans-serif;
}

.lx-col ul li a {
	font-family: "Roboto Condensed", sans-serif;
}

.lx-col.lx-contact li {
	font-family: "Roboto Condensed", sans-serif;
}

.lx-copy {
	font-family: "Roboto Condensed", sans-serif;
}

/*  */
/*slider-css*/

/* Scope everything under the unique container */
.flexiSliderHero .premium-slide {
  height: 700px;
  background-size: cover;
  background-position: center;
  position: relative;
  display:flex;
  align-items:center;
  justify-content:center;
}

.flexiSliderHero .premium-slide::after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,.32), rgba(0,0,0,.72));
  z-index:1;
}

.flexiSliderHero .premium-content {
  position:relative;
  z-index:2;
  text-align:center;
  max-width:760px;
  padding:36px 34px;
  border-radius:18px;
  backdrop-filter: blur(8px);
  background:linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.01));
  border:1px solid rgba(255,255,255,0.06);
  box-shadow:0 10px 40px rgba(0,0,0,0.45);
}

.flexiSliderHero .premium-content h1 { font-size:3rem; color:#fff; margin-bottom:12px; }
.flexiSliderHero .premium-content p { color:#e6e6e6; font-size:1.05rem; margin-bottom:22px; }

.flexiSliderHero .premium-btn {
  display:inline-block;
  padding:12px 30px;
  border-radius:34px;
  background: #ffea1b;
  color:#000000;
  box-shadow:0 8px 30px rgba(199,123,0,0.22);
}

/* Unique arrows styling */
.flexiSliderHero .premium-arrow {
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:3;
  width:64px;
  height:44px;
  border-radius:28px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:none;
  cursor:pointer;
  background:linear-gradient(90deg, rgba(255,255,255,0.08), rgba(255,255,255,0.03));
  box-shadow:0 6px 22px rgba(0,0,0,0.45);
  backdrop-filter: blur(6px);
}
.flexiSliderHero .flexiHero-prev { left:24px; }
.flexiSliderHero .flexiHero-next { right:24px; }

/* Unique pagination */
.flexiHero-pagination {
  position:absolute;
  bottom:18px;
  left:50%;
  transform:translateX(-50%);
  z-index:4;
}
.flexiHero-pagination .swiper-pagination-bullet {
  width:11px; height:11px; background:rgba(255,255,255,0.38); opacity:1;
}
.flexiHero-pagination .swiper-pagination-bullet-active {
  background:#ff9800; box-shadow:0 0 10px rgba(255,152,0,0.18);
}

/* responsive adjustments */
@media (max-width:768px) {
  .flexiSliderHero .premium-slide { height:520px; }
  .flexiSliderHero .premium-content h1 { font-size:1.9rem; }
  .flexiSliderHero .premium-arrow { width:52px; height:38px; left:12px; right:12px; }
  .flexiSliderHero .flexiHero-prev { display: none; }
  .flexiSliderHero .flexiHero-next { display: none; }
}
/* ---------- Fix: make pagination visible and centered (conflict-free) ---------- */
/* ensure container allows absolutely positioned children to show */
.flexiSliderHero {
  position: relative !important;
  overflow: visible !important; /* make sure bullets are not clipped */
}

/* precise pagination container inside the slider */
.flexiSliderHero .flexiHero-pagination {
  position: absolute !important;
  bottom: 28px !important;        /* distance from bottom of slider */
  left: 50% !important;
  transform: translateX(-50%) !important;
  z-index: 99999 !important;      /* above overlays and arrows */
  display: flex !important;
  gap: 10px !important;
  align-items: center;
  justify-content: center;
  pointer-events: auto !important;
}

/* bullets styling, scoped to this slider only */
.flexiSliderHero .flexiHero-pagination .swiper-pagination-bullet {
  width: 12px !important;
  height: 12px !important;
  border-radius: 50% !important;
  background: rgba(255,255,255,0.38) !important;
  opacity: 1 !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.35);
  transform: translateY(0);
  transition: transform .18s ease, box-shadow .18s ease;
}

/* active bullet */
.flexiSliderHero .flexiHero-pagination .swiper-pagination-bullet-active {
  background: #ff9800 !important;
  box-shadow: 0 6px 20px rgba(255,152,0,0.22) !important;
  transform: scale(1.08);
}

/* make sure nothing else is hiding pagination (override common culprits) */
.flexiSliderHero .swiper-pagination, 
.flexiSliderHero .swiper-container .swiper-pagination {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* responsive tweak: slightly larger dots on small screens */
@media (max-width: 768px) {
  .flexiSliderHero .flexiHero-pagination {
    bottom: 18px !important;
    gap: 8px !important;
  }
  .flexiSliderHero .flexiHero-pagination .swiper-pagination-bullet {
    width: 14px !important;
    height: 14px !important;
  }
  .flexiSliderHero .premium-content {
 
  border-radius:18px;
  backdrop-filter: unset;
  background:unset;
  border:unset;
  box-shadow:unset;
}

}


/*slider-css ind*/

/* Bootstrap modal open state: right padding compensate */

body.modal-open {
	padding-right: var(--sbw) !important;
}


p.lead.text-secondary.mb-4.pa {
	width: 97%;
	max-width: 100%;
	margin: 0px auto;
}

/* aapke fixed/sticky headers/strips ko bhi same padding do */

.navbar,

.header-sticky,

.sticky-top,

.topbar,

.header-strip {
	padding-right: var(--sbw) !important;
}


/* horizontal scroll ko block karo jab modal open ho */

body.modal-open {
	overflow-x: hidden;
}

section.why-tiles.spes .pk-title {
	color: #000000;
}

section.why-tiles.spes .txt {
	color: #000000;
}

/* 3) Safety: kabhi horizontal bar na aaye */

body {
	overflow-x: hidden;
}


.pt {

	padding-top: 50px;

}

.text-secondary {
	color: #ffffff !important;
	font-weight: 400;
}

.pb {

	padding-bottom: 50px;

}


/* base + anti-scroll */

* {

	box-sizing: border-box;

	min-width: 0
}


html,

body {

	margin: 0;

	font-family: Inter, system-ui, Segoe UI, Roboto, Arial, sans-serif;

	overflow-x: hidden
}


a {

	text-decoration: none;

	color: inherit
}


img {

	max-width: 100%;

	display: block
}


/* header */

.ht {
	position: sticky;
	top: 0;
	z-index: 50;
	background: #040a5b;
	backdrop-filter: blur(10px);
	border-bottom: 1px solid rgba(255, 255, 255, .06);
	transition:  .25s;
	overflow-x: hidden;

	/* <- prevent scroll from inner children */
}


.ht.solid {

	background: linear-gradient(180deg, rgba(11, 32, 51, .95), rgba(11, 32, 51, .92))
}


.ht .wrap {
	width: 100%;
	/* max-width: 1180px; */
	margin: auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	padding: 10px 12px
}


/* brand */

.brand {

	display: flex;

	align-items: center;

	gap: 8px;

	flex: 0 1 auto
}


.brand img {
	height: 45px !important;
	height: 75px;
}


.brand span {

	font-weight: 700;

	letter-spacing: .2px;

	white-space: nowrap
}


/* desktop nav */

.nav {display: flex;align-items: center;gap: 16px;flex: 1 1 auto;justify-content: center;flex-wrap: wrap}


.nav a {
	color: #ffffff !important;
	font-weight: 600;
	opacity: .92;
	white-space: nowrap
}


.nav a:hover {

	opacity: 1
}


.theme-card .title {


	font-size: 14px !important;

}

/* buttons */

.btn {
	/* display: inline-flex; */
	align-items: center;
	gap: 8px;
	padding: 14px 12px;
	border-radius: 14px;
	background: rgb(19 170 4);
	color: #ffffff !important;
	font-weight: 200;
	white-space: nowrap;
}


.btn.g {

	border: 0;

	background: linear-gradient(135deg, var(--o), #ffb703 45%, var(--b))
}


.btn.sm {padding: 3px 6px;border-radius: 12px}


.btn.w {

	width: 100%;

	justify-content: center
}


/* mobile actions */

.m-actions {

	display: none;

	align-items: center;

	gap: 6px;

	flex: 0 0 auto
}


/* header css new */

/* ===== FIXED DROPDOWN STYLES ===== */

/* make primary dropdown sit flush so no gap when moving to inner */
.dropdown-box {
	position: absolute;
	left: 0;
	top: calc(100% - 4px);
	/* small overlap to prevent tiny gap */
	min-width: 240px;
	background: #071734;
	border-radius: 12px;
	padding: 8px;
	box-shadow: 0 16px 60px rgba(4, 8, 24, .55);
	visibility: hidden;
	opacity: 0;
	transform: translateY(-6px);
	transition: opacity .18s, transform .18s, visibility .18s;
	z-index: 1200;
	pointer-events: none;
	/* default off until visible */
}

.dropdown-menu-box.expanded>.dropdown-box,
.dropdown-menu-box:hover>.dropdown-box {
	visibility: visible;
	opacity: 1;
	transform: translateY(0);
	pointer-events: auto;
}

/* inner box positioned overlapping so cursor path is continuous */
.inner-box {
	position: absolute;
	left: calc(100% - 8px);
	/* small overlap with parent so no gap */
	top: 0;
	min-width: 200px;
	background: #071734;
	border-radius: 10px;
	padding: 8px;
	box-shadow: 0 12px 40px rgba(4, 8, 24, .5);
	visibility: hidden;
	opacity: 0;
	transform: translateY(-4px);
	transition: opacity .18s, transform .18s, visibility .18s;
	z-index: 1250;
	pointer-events: none;
	/* disable until visible */
}

/* show inner when parent has .expanded or hover */
.inner-dropdown.expanded>.inner-box,
.inner-dropdown:hover>.inner-box {
	visibility: visible;
	opacity: 1;
	transform: translateY(0);
	pointer-events: auto;
}

/* ensure caret rotation */
.inner-toggle .caret {
	transition: transform .18s;
}

.inner-dropdown.expanded .caret {
	transform: rotate(90deg);
}

/* increase hit area of toggles so mouse doesn't skip */
.dropdown-toggle,
.inner-toggle {
	padding-right: 18px;
	padding-left: 10px;
}

/* ensure high z-index so it stays above hero image */
.h-main .dropdown-box,
.h-main .inner-box {
	z-index: 1200;
}

/* small tweak for pointer-safety */
.dropdown-menu-box,
.inner-dropdown {
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.inner-toggle::after {
	content: "";
	position: absolute;
	right: 20px;
	top: 50%;
	width: 8px;
	height: 8px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: translateY(-60%) rotate(-45deg);
}

/* Main header */
.h-main {
	background: linear-gradient(180deg, var(--nav1), var(--nav2));
	color: var(--white);
	box-shadow: 0 6px 24px rgba(2, 6, 23, .35);
}

.h-main .wrap {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 12px 14px;
	margin: 0 auto;
}

.brand img {
	height: 44px;
	display: block;
}

/* Desktop nav */
.nav {
	display: flex;
	gap: 12px;
	align-items: center;
	flex: 1;
	margin-left: 18px;
}

.link {
	color: var(--white);
	font-weight: 700;
	padding: 8px 10px;
	border-radius: 8px;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
}

.link:hover {
	background: var(--glass);
}

/* caret */
.caret {
	margin-left: 8px;
	transition: transform .18s;
}

/* responsive: show hamburger on small screens */
.menu-toggle {
	display: none;
	border: 1px solid rgba(255, 255, 255, .08);
	background: transparent;
	color: var(--white);
	padding: 8px;
	border-radius: 10px;
}

.header-actions {
	display: flex;
	gap: 10px;
	align-items: center;
}

.call-pill {
	background: var(--accent);
	color: #07142a;
	font-weight: 900;
	padding: 8px 12px;
	border-radius: 18px;
	border: 2px solid rgba(0, 0, 0, .08);
	text-decoration: none;
	display: inline-block;
	box-shadow: 0 6px 18px rgba(0, 0, 0, .22);
}

@media (max-width:900px) {
	.nav {
		display: none;
	}

	.menu-toggle {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 44px;
		height: 40px;
		font-size: 18px;
	}
}

/* Desktop absolute dropdown */
.dropdown-menu-box {
	position: relative;
}

.dropdown-box {
	position: absolute;
	left: 0;
	top: calc(100% + -1px);
	min-width: 240px;
	background: #071734;
	border-radius: 12px;
	padding: 8px;
	box-shadow: 0 16px 60px rgba(4, 8, 24, .55);
	visibility: hidden;
	opacity: 0;
	transform: translateY(-8px);
	transition: opacity .18s, transform .18s, visibility .18s;
	z-index: 1200;
}

.dropdown-menu-box.expanded>.dropdown-box,
.dropdown-menu-box:hover>.dropdown-box {
	visibility: visible;
	opacity: 1;
	transform: translateY(0);
}

.dropdown-box .link {
	display: block;
	padding: 10px 12px;
	color: var(--white);
	border-radius: 8px;
	font-weight: 700;
}

/* inner dropdown (desktop) opens left */
.inner-dropdown {
	position: relative;
}

.inner-box {
	position: absolute;
	right: 100%;
	top: 0;
	min-width: 200px;
	background: #071734;
	border-radius: 10px;
	padding: 8px;
	box-shadow: 0 12px 40px rgba(4, 8, 24, .5);
	visibility: hidden;
	opacity: 0;
	transform: translateY(-6px);
	transition: opacity .18s, transform .18s, visibility .18s;
	z-index: 1250;
}

.inner-dropdown.expanded>.inner-box,
.inner-dropdown:hover>.inner-box {
	visibility: visible;
	opacity: 1;
	transform: translateY(0);
}

/* remove duplicate arrows inside absolute dropdowns */
.dropdown-box .chev,
.dropdown-box .caret {
	display: none !important;
}

/* Drawer (mobile) */
.drawer {
	position: fixed;
	left: 0;
	top: 0;
	height: 100vh;
	width: var(--drawer-w);
	max-width: 420px;
	transform: translateX(-110%);
	background: #0a0f53;
	color: var(--white);
	z-index: 1600;
	transition: transform .28s ease;
	box-shadow: 28px 0 80px rgba(24, 1, 122, 0.6);
	overflow: auto;
}

.drawer[aria-hidden="false"] {
	transform: translateX(0);
}

/* drawer head */
.drawer .d-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 14px;
	border-bottom: 1px solid rgba(255, 255, 255, .04);
}

.brand.mini img {
	height: 30px;
}

/* menu list (Chitkara-like mobile) */
.menu-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.menu-list .item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 18px 16px;
	border-bottom: 1px solid rgba(255, 255, 255, .04);
	background: transparent;
	color: var(--white);
	font-weight: 800;
	font-size: 16px;
	cursor: pointer;
}

.menu-list .item .label {
	display: flex;
	align-items: center;
	gap: 10px;
}

.menu-list .item .chev {
	font-size: 18px;
	opacity: .9;
	transform: rotate(0);
	transition: transform .18s;
}

.menu-list .item.expanded .chev {
	transform: rotate(90deg);
}

/* submenu flow */
.submenu {
	max-height: 0;
	overflow: hidden;
	transition: max-height .26s ease, padding .18s ease;
	background: #001040;
	padding: 0 6px;
}

.submenu a {
	display: block;
	padding: 12px 22px;
	color: var(--white);
	text-decoration: none;
	border-bottom: 1px solid rgba(255, 255, 255, .03);
	font-weight: 700;
}

.submenu a:hover {
	background: rgba(255, 255, 255, 0.02);
}

/* inner-sub style */
.inner-sub {
	background: #111944;
}

/* backdrop */
.backdrop {
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, .45);
	display: none;
	z-index: 1500;
}

.backdrop.show {
	display: block;
}

/* small screen tweaks */
@media (max-width:420px) {
	.menu-list .item {
		padding: 16px 14px;
		font-size: 15px;
	}

	.submenu a {
		padding: 10px 18px;
		font-size: 15px;
	}
}















































.menu {

	width: 38px;

	height: 38px;

	border-radius: 10px;

	border: 1px solid rgba(255, 255, 255, .18);

	background: transparent;

	color: #fff;

	display: grid;

	place-items: center;

	font-size: 20px
}


/* drawer (offcanvas) */



.drawer.show {

	transform: translate3d(0, 0, 0)
}


.d-head {

	display: flex;

	align-items: center;

	justify-content: space-between;

	padding: 12px 14px;

	border-bottom: 1px solid rgba(255, 255, 255, .08)
}


.brand.mini img {

	height: 28px
}


.brand.mini span {

	font-size: 15px
}


.close {

	width: 34px;

	height: 34px;

	border-radius: 10px;

	border: 1px solid rgba(255, 255, 255, .2);

	background: transparent;

	color: #fff;

	display: grid;

	place-items: center
}


.d-body {

	display: flex;

	flex-direction: column;

	gap: 8px;

	padding: 12px 14px
}


.d-body .link {

	padding: 10px;

	border-radius: 10px;

	font-weight: 600
}


.d-body .link:hover {

	background: rgb(247 132 11))
}


/* backdrop */

.backdrop {

	position: fixed;

	inset: 0;

	background: rgba(0, 0, 0, .35);

	opacity: 0;

	visibility: hidden;

	transition: opacity .25s;

	z-index: 55
}


.backdrop.show {

	opacity: 1;

	visibility: visible
}





/* sabhi links white */

.drawer .link {

	color: #fff !important;

	font-weight: 600;

	display: block;

	padding: 12px 14px;

}


.drawer .link:hover {

	background: rgba(255, 255, 255, .15);

	border-radius: 8px;

}


/* buttons inside drawer */

.drawer .btn {

	background: rgba(255, 255, 255, .1);

	border: 1px solid rgba(255, 255, 255, .2);

	color: #fff !important;

}


.drawer .btn.g {

	background: linear-gradient(135deg, #f97316, #0ea5e9);

	border: 0;

}


/* responsive */

@media (max-width:991.98px) {

	.nav {

		display: none
	}


	.m-actions {

		display: flex
	}

}


@media (min-width:992px) {

	/* .drawer {

		display: none !important;

		transform: translate3d(100%, 0, 0) !important
	} */


	.backdrop {

		display: none !important;

		opacity: 0 !important;

		visibility: hidden !important
	}

}


/* header must NOT clip children */

.ht {

	overflow: visible;

}


/* drawer on top of everything */

.drawer {

	z-index: 1100;

}


.backdrop {

	z-index: 1090;

}


.m-actions .menu {

	position: relative;

	z-index: 1200;

}


/* ensure visible menu colors */

/* .drawer {

	background: linear-gradient(180deg, #1f3654, #0f2032);

	color: #fff !important;

	overflow-y: auto;



} */


.drawer .link {

	color: #fff !important;

	display: block;

	padding: 12px 14px;

	font-weight: 600;

}


.drawer .link:hover {

	background: rgba(255, 255, 255, .15);

	border-radius: 8px;

}


.drawer .btn {

	color: #fff !important;

}


.drawer .btn.g {

	background: linear-gradient(135deg, #f97316, #0ea5e9);

	border: 0;

}


/* --------------------------------------------------------------------------banner */


a.btn.btn-outline-dark.btn-lg.clor {

	color: #f8850a;

}


h1.display-5.fw-bold.mb-3 {
	color: #ffffff;
	/* text-shadow: 1px -2px 1px rgb(0 0 0 / 85%); */
}


/* Light banner base */

.hero-light {
	background: linear-gradient(135deg, #fff 0%, #fdf4f0 100%);
	position: relative;
	overflow: visible;

	/* so bottom images don't clip */
	padding: 170px 0px !important;
	background-position: bottom;
	background-size: cover;
	background-repeat:
		no-repeat;
}


/* Brand gradient text + CTA */

.brand-gradient {
	background: linear-gradient(135deg, #ffffff, #090c53);
	-webkit-background-clip: text;
	background-clip: text;
	/* color: transparent; */
	/* text-shadow: none; */
}


.btn-gradient {

	color: #fff;

	border: 0;

	background: linear-gradient(135deg, var(--o), #ffb703 45%, var(--b));

	box-shadow: 0 6px 18px rgba(241, 91, 18, .25);

}


.btn-gradient:hover {
	opacity: .95;
	color: #090c53;
}


.hero-img-card img {

	object-fit: cover;

	aspect-ratio: 4/3;

}


/* ===== Left/Right bottom decorations ===== */

.decor-side {

	position: absolute;

	bottom: 0;

	width: 28vw;

	/* responsive width */

	max-width: 520px;

	opacity: 4.28;

	/* soft look like screenshot */

	pointer-events: none;

	z-index: 1;

	/* soft fade towards center so it blends nicely */

	-webkit-mask-image: linear-gradient(to var(--fade-dir, right), black 70%, transparent 100%);

	mask-image: linear-gradient(to var(--fade-dir, right), black 70%, transparent 100%);

}


.decor-left {

	left: 0;

	--fade-dir: right;

	/* fade towards center */

	transform: translateY(2px);

	/* tiny down-shift just like sample */

}


.decor-right {

	right: 0;

	--fade-dir: left;

	/* fade towards center */

	transform: scaleX(-1) translateY(2px);

	/* mirror same SVG for right */

}


/* Keep content above silhouettes */

.hero-light .container {

	position: relative;

	z-index: 2;

}


/* Mobile tweaks */

@media (max-width: 991.98px) {

	.hero-light {

		padding-bottom: 3.5rem;

	}


	.decor-side {

		width: 38vw;

		opacity: .32;

	}

}


@media (max-width: 575.98px) {

	.hero-light {

		padding-top: 2.5rem;

		padding-bottom: 3rem;

	}


	.decor-side {

		width: 45vw;

		opacity: .35;

	}

	.themes-head {

		display: block !important;

		text-align: center;


	}

	.pk-title {

		font-size: 21px;

		padding-bottom: 12px;

	}

	#pk-section .pk-title {


		font-size: 18px !important;

	}

}


@media (max-width: 768px) {

	.themes-head {

		display: block !important;

		text-align: center;


	}
  .inner-toggle::after {
    content: "";
    position: absolute;
    right: 20px;
    top: 50%;
    width: 8px;
    height: 8px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: translateY(-60%) rotate(-45deg);
    display: none !important;
}

	.pk-title {

		font-size: 21px;

		padding-bottom: 12px;

	}

	#pk-section .pk-title {


		font-size: 18px !important;

	}


	/* dynamic scrollbar width var (JS set karega) */

	:root {
		--sbw: 0px;
	}


	/* Bootstrap modal open state: right padding compensate */

	body.modal-open {
		padding-right: var(--sbw) !important;
	}


	/* aapke fixed/sticky headers/strips ko bhi same padding do */

	.navbar,

	.header-sticky,

	.sticky-top,

	.topbar,

	.header-strip {
		padding-right: var(--sbw) !important;
	}


	/* horizontal scroll ko block karo jab modal open ho */

	body.modal-open {
		overflow-x: hidden;
	}


	/* 3) Safety: kabhi horizontal bar na aaye */

	body {
		overflow-x: hidden;
	}


	.pt {

		padding-top: 50px;

	}

	.text-secondary {
		color: #ffffff !important;
		font-weight: 400;
	}

	.pb {

		padding-bottom: 50px;

	}


	/* base + anti-scroll */

	* {

		box-sizing: border-box;

		min-width: 0
	}


	html,

	body {

		margin: 0;

		font-family: Inter, system-ui, Segoe UI, Roboto, Arial, sans-serif;

		overflow-x: hidden
	}


	a {

		text-decoration: none;

		color: inherit
	}


	img {

		max-width: 100%;

		display: block
	}


	/* header */

	.ht {
		position: sticky;
		top: 0;
		z-index: 50;
		background: linear-gradient(180deg, #02184c, #0f1f33);
		backdrop-filter: blur(10px);
		border-bottom: 1px solid rgba(255, 255, 255, .06);
		transition: background .25s;
		overflow-x: hidden;

		/* <- prevent scroll from inner children */
	}


	.ht.solid {

		background: linear-gradient(180deg, rgba(11, 32, 51, .95), rgba(11, 32, 51, .92))
	}


	.ht .wrap {

		width: 100%;

		max-width: 1180px;

		margin: auto;

		display: flex;

		align-items: center;

		justify-content: space-between;

		gap: 8px;

		padding: 10px 12px
	}


	/* brand */

	.brand {

		display: flex;

		align-items: center;

		gap: 8px;

		flex: 0 1 auto
	}


	.brand img {
		height: 34px !important;
		filter: drop-shadow(0 2px 6px rgba(0, 0, 0, .4));
		/* height: 60px; */
		/* background: #fff; */

		/* white background */
		/* padding: 4px 6px; */
		/* border-radius: 8px; */
	}


	.brand span {

		font-weight: 700;

		letter-spacing: .2px;

		white-space: nowrap
	}


	/* desktop nav */

	.nav {

		display: flex;

		align-items: center;

		gap: 16px;

		flex: 1 1 auto;

		justify-content: flex-end;

		flex-wrap: wrap
	}


	.nav a {

		color: #ffffff;

		font-weight: 600;

		opacity: .92;

		white-space: nowrap
	}


	.nav a:hover {

		opacity: 1
	}


	/* buttons */

	.btn {
		/* display: inline-flex; */
		align-items: center;
		gap: 8px;
		padding: 8px 12px;
		border-radius: 12px;
		/* background: rgba(255, 255, 255, .06); */
		border: 1px solid rgb(247 132 11);
		color: #f77b0c;
		font-weight: 400;
		white-space: nowrap
	}


	.btn.g {

		border: 0;

		background: linear-gradient(135deg, var(--o), #ffb703 45%, var(--b))
	}


	.btn.sm {
		padding: 5px 10px;
		border-radius: 12px;
		font-size: 10px !important;
	}


	.btn.w {

		width: 100%;

		justify-content: center
	}


	/* mobile actions */

	.m-actions {

		display: none;

		align-items: center;

		gap: 6px;

		flex: 0 0 auto
	}


	.menu {

		width: 38px;

		height: 38px;

		border-radius: 10px;

		border: 1px solid rgba(255, 255, 255, .18);

		background: transparent;

		color: #fff;

		display: grid;

		place-items: center;

		font-size: 20px
	}


	/* drawer (offcanvas) */

	/* .drawer {position: fixed; bottom: 0;width: min(100vw, 340px);

	background: #0b2033;color: #fff;transform: translate3d(100%, 0, 0);transition: transform .3s ease;z-index: 60;display: flex;flex-direction: column;overflow-x: hidden;

} */


	.drawer.show {

		transform: translate3d(0, 0, 0)
	}


	.d-head {

		display: flex;

		align-items: center;

		justify-content: space-between;

		padding: 12px 14px;

		border-bottom: 1px solid rgba(255, 255, 255, .08)
	}


	.brand.mini img {

		height: 28px
	}


	.brand.mini span {

		font-size: 15px
	}


	.close {

		width: 34px;

		height: 34px;

		border-radius: 10px;

		border: 1px solid rgba(255, 255, 255, .2);

		background: transparent;

		color: #fff;

		display: grid;

		place-items: center
	}


	.d-body {

		display: flex;

		flex-direction: column;

		gap: 8px;

		padding: 12px 14px
	}


	.d-body .link {

		padding: 10px;

		border-radius: 10px;

		font-weight: 600
	}


	.d-body .link:hover {

		background: rgb(247 132 11)
	}


	/* backdrop */

	.backdrop {

		position: fixed;

		inset: 0;

		background: rgba(0, 0, 0, .35);

		opacity: 0;

		visibility: hidden;

		transition: opacity .25s;

		z-index: 55
	}


	.backdrop.show {

		opacity: 1;

		visibility: visible
	}


	/* offcanvas body fix */

	.drawer {

		background: linear-gradient(180deg, #1e3350, #0f1f2e);

		/* light navy */

		color: #fff !important;

		z-index: 9999;

	}


	/* sabhi links white */

	.drawer .link {

		color: #fff !important;

		font-weight: 600;

		display: block;

		padding: 12px 14px;

	}


	.drawer .link:hover {

		background: rgba(255, 255, 255, .15);

		border-radius: 8px;

	}


	/* buttons inside drawer */

	.drawer .btn {

		background: rgba(255, 255, 255, .1);

		border: 1px solid rgba(255, 255, 255, .2);

		color: #fff !important;

	}


	.drawer .btn.g {

		background: linear-gradient(135deg, #f97316, #0ea5e9);

		border: 0;

	}


	/* responsive */

	@media (max-width:991.98px) {

		.nav {

			display: none
		}


		.m-actions {

			display: flex
		}

	}


	@media (min-width:992px) {

		.drawer {

			display: none !important;

			transform: translate3d(100%, 0, 0) !important
		}


		.backdrop {

			display: none !important;

			opacity: 0 !important;

			visibility: hidden !important
		}

	}


	/* header must NOT clip children */

	.ht {

		overflow: visible;

	}


	/* drawer on top of everything */

	.drawer {

		z-index: 1100;

	}


	.backdrop {

		z-index: 1090;

	}


	.m-actions .menu {

		position: relative;

		z-index: 1200;

	}


	/* ensure visible menu colors */

	.drawer {

		background: linear-gradient(180deg, #1f3654, #0f2032);

		color: #fff !important;

		overflow-y: auto;

		/* content scrolls if long */

	}


	.drawer .link {

		color: #fff !important;

		display: block;

		padding: 12px 14px;

		font-weight: 600;

	}


	.drawer .link:hover {

		background: rgba(255, 255, 255, .15);

		border-radius: 8px;

	}


	.drawer .btn {

		color: #fff !important;

	}


	.drawer .btn.g {

		background: linear-gradient(135deg, #f97316, #0ea5e9);

		border: 0;

	}


	/* --------------------------------------------------------------------------banner */


	a.btn.btn-outline-dark.btn-lg.clor {

		color: #f8850a;

	}


	h1.display-5.fw-bold.mb-3 {
		color: #ffffff;
		font-size: 26px;
	}


	/* Light banner base */

	.hero-light {

		background: linear-gradient(135deg, #fff 0%, #fdf4f0 100%);

		position: relative;

		overflow: visible;

		/* so bottom images don't clip */

		padding: 125px 0px !important;

	}


	/* Brand gradient text + CTA */

	.brand-gradient {
		background: white;
		-webkit-background-clip: text;
		background-clip: text;
		color: transparent;
	}


	.btn-gradient {

		color: #fff;

		border: 0;

		background: linear-gradient(135deg, var(--o), #ffb703 45%, var(--b));

		box-shadow: 0 6px 18px rgba(241, 91, 18, .25);

	}


	.btn-gradient:hover {

		opacity: .95;

		color: #fff
	}


	.hero-img-card img {

		object-fit: cover;

		aspect-ratio: 4/3;

	}


	/* ===== Left/Right bottom decorations ===== */

	.decor-side {

		position: absolute;

		bottom: 0;

		width: 28vw;

		/* responsive width */

		max-width: 520px;

		opacity: 4.28;

		/* soft look like screenshot */

		pointer-events: none;

		z-index: 1;

		/* soft fade towards center so it blends nicely */

		-webkit-mask-image: linear-gradient(to var(--fade-dir, right), black 70%, transparent 100%);

		mask-image: linear-gradient(to var(--fade-dir, right), black 70%, transparent 100%);

	}


	.decor-left {

		left: 0;

		--fade-dir: right;

		/* fade towards center */

		transform: translateY(2px);

		/* tiny down-shift just like sample */

	}


	.decor-right {

		right: 0;

		--fade-dir: left;

		/* fade towards center */

		transform: scaleX(-1) translateY(2px);

		/* mirror same SVG for right */

	}


	/* Keep content above silhouettes */

	.hero-light .container {

		position: relative;

		z-index: 2;

	}


	/* Mobile tweaks */

	@media (max-width: 991.98px) {

		.hero-light {

			padding-bottom: 3.5rem;

		}


		.decor-side {

			width: 38vw;

			opacity: .32;

		}

	}


	@media (max-width: 575.98px) {

		.hero-light {

			padding-top: 2.5rem;

			padding-bottom: 3rem;

		}


		.decor-side {

			width: 45vw;

			opacity: .35;

		}

		.themes-head {

			display: block !important;

			text-align: center;


		}

		.pk-title {

			font-size: 21px;

			padding-bottom: 12px;

		}

		#pk-section .pk-title {


			font-size: 18px !important;

		}

	}


	@media (max-width: 768px) {

		.themes-head {

			display: block !important;

			text-align: center;


		}
.offring-bix {
    background-image: unset;
    background-position: top;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 62px;
    border-radius: 10px;
    box-shadow: rgba(17, 17, 26, 0.05) 0px 1px 0px, rgba(17, 17, 26, 0.1) 0px 0px 8px;
    background: antiquewhite !important;
}
		.pk-title {

			font-size: 21px;

			padding-bottom: 12px;

		}

		#pk-section .pk-title {


			font-size: 18px !important;

		}


		.offring-bix {


			padding: 15px !important;


		}

		.hero-light {
			padding: 40px 0px !important;
			background-position: left !important;
			background-size: cover !important;
			background-repeat: no-repeat;
			background-position: center;
			background-size: cover;
			background-repeat: no-repeat;

		}


	}


	/* --------------------------------------------------------------------------------- bannre end  */


	/* --------------------------------------------------------------------------------- slider pa end  */


	/* Theme variables (use your existing ones if present) */


	/* Section head */

	.themes-section {

		padding: 24px 0;

		background: #fff;

	}


	.themes-head {

		display: flex;

		align-items: center;

		justify-content: space-between;

		gap: 12px;

		margin-bottom: 14px;

		padding: 0 12px;

	}


	.container.themes-head h2 {

		font-size: 25px !important;

		font-weight: 500 !important;

	}


	.themes-cta {

		font-size: 14px;

		color: #64748b;

		white-space: nowrap;

	}


	/* Slider wrap */

	.themes-wrap {

		position: relative;

		padding: 8px 44px;

		/* space for arrows */

	}


	/* Card */

	.theme-card {

		border-radius: 14px;

		overflow: hidden;

		background: #fff;

		border: 1px solid rgba(0, 0, 0, .06);

		box-shadow: 0 6px 18px rgba(0, 0, 0, .06);

	}


	.theme-card .media {

		aspect-ratio: 4/5;

		overflow: hidden;

		background: #f5f7fb;

	}


	.theme-card .media img {

		width: 100%;

		height: 100%;

		object-fit: cover;

		transition: transform .5s ease;

	}


	.theme-card:hover .media img {

		transform: scale(1.06);

	}


	.theme-card .title {

		font-weight: 700;

		margin: 10px 10px 0;

		color: #0f172a;

	}


	.theme-card .meta {

		margin: 2px 10px 12px;

		font-size: 12px;

		color: #728099;

	}


	/* Swiper sizing */

	.theme-swiper {

		width: 100%;

	}


	.swiper-slide {

		height: auto;

	}


	/* Arrows */

	.btn-nav {

		position: absolute;

		top: 50%;

		transform: translateY(-50%);

		width: 40px;

		height: 40px;

		border-radius: 12px;

		border: 1px solid rgba(0, 0, 0, .1);

		background: #fff;

		color: #0f172a;

		display: grid;

		place-items: center;

		box-shadow: 0 8px 20px rgba(0, 0, 0, .12);

		z-index: 5;

	}


	.themes-prev {

		left: 4px;

	}


	.themes-next {

		right: 4px;

	}


	.btn-nav:hover {

		background: linear-gradient(135deg, var(--o), var(--b));

		color: #fff;

		border-color: transparent;

	}


	/* Pagination (vertical on desktop, left side) */

	.themes-pagination {

		position: absolute;

		left: 8px;

		top: 50%;

		transform: translateY(-50%);

		width: auto !important;

		height: auto;

		z-index: 4;

		display: flex;

		flex-direction: column;

		gap: 10px;

	}


	.themes-pagination .swiper-pagination-bullet {

		width: 10px;

		height: 10px;

		border-radius: 50%;

		background: #cbd5e1;

		opacity: 1;

	}


	.themes-pagination .swiper-pagination-bullet-active {

		background: linear-gradient(135deg, var(--o), var(--b));

	}


	/* Mobile tweaks: dots bottom & centered, arrows outside */

	@media (max-width: 768px) {

		.themes-wrap {

			padding: 8px 36px;

		}


		.themes-pagination {

			left: 50%;

			top: auto;

			bottom: -8px;

			transform: translateX(-50%);

			flex-direction: row;

			gap: 8px;

		}


		.btn-nav {

			top: calc(50% - 10px);

		}


		/* thoda niche to avoid thumbs */

	}


	/* Slides per view visuals (cards tight like reference) */

	@media (min-width: 1200px) {

		.themes-wrap {

			padding-right: 52px;

			padding-left: 44px
		}

	}


	/* wrapper */

	.hero-swiper {

		border-radius: 18px;

		overflow: hidden;

		position: relative;

		box-shadow: 0 12px 30px rgba(0, 0, 0, .15);

	}


	/* slide image keeps aspect nicely */

	.hero-slide {

		margin: 0;

		position: relative;

	}


	.hero-slide img {

		width: 100%;

		height: 40vh;

		min-height: 300px;

		max-height: 640px;

		object-fit: cover;

		display: block;

	}


	/* overlay text */

	.overlay {

		position: absolute;

		left: 0;

		right: 0;

		bottom: 10%;

		color: #fff;

		text-align: center;

		padding: 0 24px;

		text-shadow: 0 2px 16px rgba(0, 0, 0, .45);

	}


	.overlay .kicker {

		margin: 0 0 .25rem 0;

		font-weight: 600;

		letter-spacing: .2px;

	}


	.overlay .title {

		margin: 0;

		font-weight: 800;

		line-height: 1;

		font-size: clamp(32px, 6vw, 64px);

		/* premium text gradient */

		background: linear-gradient(135deg, #fff 20%, #ffe6d2 60%);

		-webkit-background-clip: text;

		background-clip: text;

		color: transparent;

	}


	/* arrows */

	.nav-slider {

		position: absolute;

		top: 50%;

		transform: translateY(-50%);

		width: 44px;

		height: 44px;

		border-radius: 50%;

		background: rgba(255, 255, 255, .9);

		border: 0;

		color: #0f172a;

		display: grid;

		place-items: center;

		cursor: pointer;

		box-shadow: 0 6px 18px rgba(0, 0, 0, .2);

		z-index: 5;

	}


	.nav:hover .prev {

		left: 16px
	}


	.next {

		right: 16px
	}


	/* dots */

	.swiper-pagination {

		position: absolute;

		left: 50%;

		bottom: 16px;

		transform: translateX(-50%);

	}


	.swiper-pagination-bullet {

		width: 8px;

		height: 8px;

		background: #fff;

		opacity: .6;

	}


	.swiper-pagination-bullet-active {

		width: 10px;

		height: 10px;

		opacity: 1;

		background: linear-gradient(135deg, var(--o), var(--b));

		box-shadow: 0 0 0 2px rgba(0, 0, 0, .15);

	}


	/* mobile tweaks */

	@media (max-width:576px) {

		.hero-slide img {

			height: 48vh;

			min-height: 260px
		}


		.nav {

			/* width: 38px; */

			/* height: 38px; */

		}

	}


	/* -----------Packages------------------ */

	/* ===== Scoped styles, no conflict with your CSS (all pk-*) ===== */

	#pk-section {

		background: #fff
	}


	#pk-section .pk-title {

		font-weight: 500;

		color: #333;

		font-size: 25px;

	}


	#pk-section .pk-viewall {

		color: #64748b;

		font-weight: 600;

		text-decoration: none;

		white-space: nowrap
	}


	#pk-section .pk-viewall .pk-arrow {

		margin-left: .35rem;

		color: var(--o, #f25c10)
	}


	.pk-card {

		display: flex;

		flex-direction: column;

		background: #fff;

		border: 1px solid rgba(0, 0, 0, .06);

		border-radius: 16px;

		overflow: hidden;

		box-shadow: 0 8px 20px rgba(0, 0, 0, .06);

		/* height: 581px !important; */

		min-height: 100%;

	}


	/* media area with fixed aspect for consistency */

	.pk-media {

		position: relative
	}


	.pk-card-swiper {

		position: relative;

		overflow: hidden
	}


	.pk-card-swiper .swiper-slide {

		aspect-ratio: 16/10
	}


	.pk-card-swiper .swiper-slide img {

		width: 100%;

		height: 100%;

		object-fit: cover;

		display: block
	}


	.pk-media::before,

	.pk-media::after {

		content: "";

		position: absolute;

		inset: 0;

		border-radius: 16px 16px 0 0;

		pointer-events: none
	}


	.pk-media::after {

		/* inner radius mask */

		box-shadow: inset 0 0 0 12px #0000
	}


	/* rounded top like reference */

	.pk-card {

		border-radius: 16px
	}


	.pk-media,

	.pk-card-swiper,

	.pk-card-swiper .swiper-slide img {

		border-radius: 15px;

	}


	/* centered dots over image */

	.pk-card-pagination {

		position: absolute;

		left: 50%;

		bottom: 10px;

		transform: translateX(-50%);

		z-index: 5
	}


	.pk-card-pagination .swiper-pagination-bullet {

		width: 8px;

		height: 8px;

		border-radius: 50%;

		background: #ffffffcc;

		opacity: 1
	}


	.pk-card-pagination .swiper-pagination-bullet-active {

		background: linear-gradient(135deg, var(--o, #f25c10), var(--b, #f15b12));

		box-shadow: 0 0 0 2px rgba(0, 0, 0, .18)
	}


	.pk-body {

		padding: 14px 16px 0 16px;

		display: flex;

		flex-direction: column
	}


	.pk-subtle {

		color: #6b7280;

		font-size: .95rem
	}


	.pk-rating {

		color: #22c55e;

		font-weight: 700
	}


	.pk-muted {

		color: #94a3b8;

		font-weight: 600
	}


	.pk-name {

		font-size: 1.05rem;

		line-height: 1.35;

		margin: 4px 0 8px 0;

		color: #0f172a;

		font-weight: 600;

	}


	.pk-tags {

		display: flex;

		flex-wrap: wrap;

		gap: 8px;

		margin-top: 2px
	}


	.pk-chip {

		background: #fff8f2;

		border: 1px solid #ffd8ba;

		color: #7a4a13;

		padding: 5px 8px;

		border-radius: 999px;

		font-size: .87rem;

		font-weight: 600
	}


	.pk-chip strong {

		font-weight: 800
	}


	.pk-chip.pk-more {

		background: #eef2ff;

		border-color: #dbe2ff;

		color: #3b4b9a
	}


	.pk-strike {

		text-decoration: line-through;

		color: #9aa3af;

		font-weight: 700
	}


	.pk-save {

		background: #e9f9ee;

		color: #0f8a3f;

		borde;

		border: 1px solid #c7f0d4;

		border-radius: 8px;

		font-weight: 500;

		font-size: 10px;

		padding: 4px;

	}


	.pk-price {

		font-size: 16px;

		font-weight: 500;

		color: #0f172a;

		margin-top: 4px
	}


	.pk-per {

		color: #6b7280;

		font-weight: 600
	}


	/* footer pinned at bottom for equal button alignment */

	.pk-footer {

		display: flex;

		align-items: center;

		gap: 10px;

		padding: 12px 16px 16px 16px;

		margin-top: auto;

	}


	.pk-btn {

		appearance: none;

		border: 1px solid rgba(0, 0, 0, .1);

		background: #fff;

		color: #0f172a;

		padding: 10px 12px;

		border-radius: 12px;

		font-weight: 500;

		cursor: pointer;

		display: inline-flex;

		align-items: center;

		justify-content: center;

		gap: .5rem
	}


	.pk-btn-primary {

		background: linear-gradient(202deg, #03d9ff, #10b1f1 45%, var(--b, #ffb703));

		border: 0;

		color: #fff;

		box-shadow: 0 6px 18px rgba(241, 91, 18, .25)
	}


	.pk-btn-ghost {

		width: 54px;

		flex: 0 0 54px
	}


	/* responsive text tweaks */

	@media (max-width:575.98px) {

		.pk-name {

			font-size: 1rem
		}


		.pk-chip {

			font-size: .83rem
		}


		.pk-save {

			font-size: .78rem
		}


		.pk-price {

			font-size: 1.15rem
		}

	}


	.main-a {

		text-align: center;

		margin-top: 20px;

	}


	.n {


		width: 40px;

		height: 40px;

		border-radius: 12px;

		border: 1px solid rgba(0, 0, 0, .1);

		background: #f4f4f4;

		color: #ff670f;


		place-items: center;

		box-shadow: 0 8px 20px rgba(0, 0, 0, .12);

		z-index: 5;

	}


	hr.hr {

		color: #b4b4b4;

	}


	.save {

		padding: 18px 0px;

		font-size: 25px;

		font-weight: 600;

		font-style: oblique;

	}


	h2.m-0.pk-title.offer {

		font-size: 37px !important;

		font-weight: 700 !important;

	}


	/* wrapper */

	.pk-offer-wrap {

		margin: 8px 0 12px;

		display: flex;

		align-items: center;

		flex-wrap: wrap;

		gap: 10px;

	}


	/* badge */

	.pk-offer-badge {

		height: 22px;

		background: #d32f2f;

		color: #fff;

		font-size: 13px;

		font-weight: 700;

		border-radius: 20px;

		display: inline-flex;

		align-items: center;

		gap: 4px;

		width: 142px;

		white-space: ;

		border: thick;

	}


	.pk-offer-badge strong {


		color: #d32f2f;

		font-size: 12px;

		font-weight: 700;

		border-radius: 50%;


		line-height: 1;

	}


	.pk-offer-badge img {

		width: 40px;

	}


	/* holiday  advancher */


	.ht-dot {

		width: 8px;

		height: 8px;

		border-radius: 50%;

		background: #ffc107;

		display: inline-block;

	}


	.ht-card {

		border-color: var(--ht-line) !important;

		border-radius: 6px;

		text-decoration: none;

		transition: transform .18s, box-shadow .18s, border-color .18s;

	}


	.ht-card .ht-ico {

		width: 44px;

		height: 44px;

		border-radius: 10px;

		display: grid;

		place-items: center;

		background: #f6faf9;

		border: 1px solid #e6f4f1;

	}


	.ht-card .ht-ico svg {

		display: block
	}


	.ht-card .small {

		color: var(--ht-muted) !important
	}


	.ht-card:hover {

		transform: translateY(-2px);

		border-color: #d6e1ec !important;

		box-shadow: 0 10px 28px rgba(15, 34, 56, .08);

	}


	.ht-card.is-active {

		background: #f7fbff;

		border-color: #d9e7f7 !important;

		box-shadow: inset 0 0 0 1px #e8f1fd;

	}


	.ht-card .ht-ico {

		background: linear-gradient(180deg, #ffe0c2, #e7fff7);

		border-color: #ffe9d4;

	}


	.ht-card.is-active .ht-ico svg path[fill],

	.ht-card.is-active .ht-ico svg rect[fill] {

		fill: var(--ht-accent) !important
	}


	/* holiday  advancher */


	/* scoped component styles (no :root) */

	#mk-market-safe .mk-item .mk-icon {

		width: 76px;

		height: 76px;

		border-radius: 12px;

		display: inline-grid;

		place-items: center;

		background: #f6faf9;

		border: 1px solid #e6f4f1;

		margin-bottom: .5rem;

	}


	#mk-market-safe .mk-value {

		font-size: 16px;

		color: var(--ht-ink);

	}


	#mk-market-safe .mk-label {

		font-size: 13px;

		color: var(--ht-muted);

		line-height: 1.2;

	}


	/* spacing tune on very small screens */

	@media (max-width:575.98px) {

		#mk-market-safe .mk-item .mk-icon {

			width: 68px;

			height: 68px
		}

	}


	/* only component-specific tweaks */

	#mk-6-6 .mk6-item .mk6-icon {

		width: 76px;

		height: 76px;

		border-radius: 12px;

		display: inline-grid;

		place-items: center;

		background: #f6faf9;

		border: 1px solid #e6f4f1;

		margin-bottom: .5rem;

	}


	@media (max-width:575.98px) {

		#mk-6-6 .mk6-item .mk6-icon {

			width: 68px;

			height: 68px
		}

	}


	/* ===== Luxury Footer (responsive) ===== */

	.lx-footer {

		--bg1: #0b2033;

		--bg2: #081624;

		--muted: #a8b3c7;

		background: radial-gradient(1200px 600px at 20% -10%, rgba(255, 255, 255, .06), transparent),

			linear-gradient(180deg, var(--bg1), var(--bg2));

		color: #eaf2ff;

		padding: 42px 0 0;

		position: relative;

		overflow: hidden;

	}


	/* subtle top shimmer */

	.lx-footer::before {

		content: "";

		position: absolute;

		inset: -40% -40% auto -40%;

		height: 220px;

		background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .06), transparent);

		transform: rotate(2deg);

	}


	/* Top row */

	.lx-top {

		display: grid;

		grid-template-columns: 1.2fr 1fr;

		gap: 28px;

		align-items: center;

		margin-bottom: 26px;

	}


	@media (max-width: 768px) {

		.lx-top {

			grid-template-columns: 1fr;

			gap: 18px
		}

	}


	.lx-logo {

		height: 48px;

		width: auto;

		filter: drop-shadow(0 6px 18px rgba(0, 0, 0, .25));

	}


	.lx-tag {

		margin: 10px 0 0;

		color: var(--muted);

		font-size: 14px
	}


	/* Newsletter */

	.lx-newsletter {

		display: flex;

		flex-direction: column;

		gap: 8px
	}


	.lx-nl-label {

		font-weight: 800;

		letter-spacing: .2px
	}


	.lx-nl-field {

		display: flex;

		gap: 8px;

		background: rgba(255, 255, 255, .06);

		border: 1px solid rgba(255, 255, 255, .12);

		border-radius: 14px;

		padding: 6px;

		backdrop-filter: blur(6px);

	}


	.lx-nl-field input {

		flex: 1;

		border: 0;

		outline: 0;

		background: transparent;

		color: #fff;

		padding: 10px 12px;

	}


	.lx-nl-field input::placeholder {

		color: #b9c4d6
	}


	.lx-nl-field button {

		border: 0;

		padding: 10px 14px;

		border-radius: 10px;

		color: #fff;

		font-weight: 800;

		background: linear-gradient(135deg, var(--o, #f25c10), #ffb703 45%, var(--b, #f15b12));

		box-shadow: 0 8px 18px rgba(241, 91, 18, .25);

		cursor: pointer;

	}


	.lx-nl-note {

		color: var(--muted);

		font-size: 12px
	}


	/* Link grid */

	.lx-grid {

		display: grid;

		grid-template-columns: repeat(4, minmax(0, 1fr));

		gap: 24px;

		padding: 18px 0 8px;

		border-top: 1px solid rgba(255, 255, 255, .08);

	}


	@media (max-width: 992px) {

		.lx-grid {

			grid-template-columns: repeat(2, 1fr)
		}

	}


	@media (max-width: 576px) {

		.lx-grid {

			grid-template-columns: 1fr
		}

	}


	.lx-col h6 {

		margin: 0 0 10px;

		font-weight: 900;

		font-size: 15px;

		letter-spacing: .2px
	}


	.lx-col ul {

		list-style: none;

		margin: 0;

		padding: 0
	}


	.lx-col li {

		margin: 8px 0
	}


	.lx-col a {

		color: #d7e1f3;

		text-decoration: none;

		font-weight: 600;

		opacity: .9;

	}


	.lx-col a:hover {

		opacity: 1;

		color: #fff;

		text-decoration: underline
	}


	/* contact icons + socials */

	.lx-contact ul li {

		display: flex;

		gap: 10px;

		align-items: flex-start
	}


	.lx-contact svg {

		width: 18px;

		height: 18px;

		opacity: .9;

		margin-top: 2px
	}


	.lx-social {

		display: flex;

		gap: 10px;

		margin-top: 12px
	}


	.lx-social a {

		width: 36px;

		height: 36px;

		border-radius: 999px;

		display: grid;

		place-items: center;

		background: rgba(255, 255, 255, .08);

		color: #fff;

		transition: all .25s ease;

		border: 1px solid rgba(255, 255, 255, .12);

	}


	.lx-social a:hover {

		background: linear-gradient(135deg, var(--o, #f25c10), var(--b, #f15b12));

		box-shadow: 0 8px 22px rgba(241, 91, 18, .35);

	}


	/* Bottom strip */

	.lx-bottom {

		margin-top: 22px;

		padding: 14px 0 18px;

		border-top: 1px solid rgba(255, 255, 255, .08);

		display: flex;

		gap: 16px;

		justify-content: space-between;

		align-items: center;

		flex-wrap: wrap;

		color: #c2cee2;

		font-size: 13px;

	}


	.lx-pay {

		display: flex;

		align-items: center;

		gap: 8px;

		flex-wrap: wrap
	}


	.lx-paytag {

		opacity: .9;

		margin-right: 2px
	}


	.lx-paypill {

		padding: 4px 10px;

		border-radius: 999px;

		font-weight: 800;

		font-size: 12px;

		color: #0b2033;

		background: #fff;

		border: 1px solid rgba(0, 0, 0, .06);

	}


	.lx-copy {

		opacity: .9
	}


	.lx-brand img {
		height: 40px;
		filter: drop-shadow(0 2px 6px rgba(0, 0, 0, .4));
		height: 60px;
		/* background: #fff; */
		padding: 4px 6px;
		border-radius: 8px;
	}


	/* ===== Luxury Footer (responsive) END===== */


	/* popup css */

	.bg-color {

		background: #fcedd8;

		border-radius: 15px 0px 0px 15px;

	}


	.qx-card {

		background: #fff;

		border-radius: 14px;

		box-shadow: 0 14px 42px rgba(0, 0, 0, .18);

	}


	.qx-header {

		padding: 12px 14px 10px;

		border-bottom: 1px solid #eef2f6;

	}


	.qx-thumb {

		width: 42px;

		height: 42px;

		border-radius: 8px;

		object-fit: cover;

		box-shadow: 0 2px 8px rgba(0, 0, 0, .12);

	}


	.qx-title {

		font-weight: 700;

		font-size: 14px;

		color: #0f1f2e;

		max-width: 330px;

	}


	.qx-price {

		font-weight: 800;

		color: #0f1f2e;

		font-size: 14px;

	}


	.qx-mrp {

		color: #9aa4b2;

		text-decoration: line-through;

		font-size: 12px;

	}


	.qx-save {

		font-size: 11px;

		font-weight: 800;

		color: #0a7f38;

		background: #e9f8ee;

		border: 1px solid #bfe8cc;

		border-radius: 6px;

		padding: 3px 6px;

	}


	.qx-x {

		color: #7e8896;

		font-size: 18px;

	}


	.qx-x:hover {

		color: #111;

	}


	.qx-body {

		padding: 10px 14px 14px;

	}


	/* Inputs look: light grey fill, subtle border, flat corners=8px */

	.qx-input {

		background: #f7f8fa;

		border: 1px solid #e6e9ee;

		border-radius: 8px;

		padding: 10px 12px;

		font-size: 14px;

		color: #0f2033;

	}


	.qx-input:focus {

		background: #fff;

		border-color: #b9d8ff;

		box-shadow: 0 0 0 .15rem rgba(125, 211, 252, .25);

		color: #0f2033;

	}


	.qx-textarea {

		resize: vertical;

		min-height: 88px;

	}


	/* CTA full orange bar */

	.qx-cta {

		background: linear-gradient(135deg, var(--qx-orange), #ffb703 45%, var(--qx-orange2));

		color: #fff;

		border: 0;

		border-radius: 8px;

		padding: 12px 14px;

		box-shadow: 0 8px 18px rgba(241, 91, 18, .25);

	}


	.qx-cta:hover {

		filter: brightness(.98);

		color: #fff;

	}


	/* make modal content snug on very small screens */

	@media (max-width: 380px) {

		.qx-title {

			max-width: 220px
		}

	}


	.qx-trust i {

		color: #4a5568;

		/* dark grey icons */

	}


	.qx-trust small {

		font-size: 12px;

		line-height: 1.3;

	}


	/* container fixed at bottom-right */

	.fx-stack {

		position: fixed;

		right: 18px;

		bottom: 18px;

		display: flex;

		flex-direction: column;

		gap: 14px;

		z-index: 9999;

	}


	/* circular button */

	.fx-btn {

		width: 56px;

		height: 56px;

		border-radius: 50%;

		display: grid;

		place-items: center;

		color: #fff;

		text-decoration: none;

		box-shadow: 0 10px 24px rgba(0, 0, 0, .18);

		position: relative;

		transition: transform .2s ease, box-shadow .2s ease, opacity .2s ease;

	}


	.fx-btn:hover {

		transform: translateY(-2px);

		box-shadow: 0 12px 28px rgba(0, 0, 0, .22);

	}


	.fx-wa {

		background: #25D366;

	}


	/* WhatsApp green */

	.fx-call {

		background: #0d6efd;

	}


	/* Brand blue call */


	/* tooltip label like screenshot (appears on hover, left side) */

	.fx-btn::after {

		content: attr(data-label);

		position: absolute;

		right: 70px;

		top: 50%;

		transform: translateY(-50%);

		background: #0f2238;

		color: #fff;

		font-weight: 600;

		padding: 8px 12px;

		border-radius: 10px;

		font-size: 13px;

		white-space: nowrap;

		opacity: 0;

		pointer-events: none;

		transition: opacity .2s ease;

		box-shadow: 0 8px 20px rgba(0, 0, 0, .15);

	}


	.fx-btn:hover::after {

		opacity: 1;

	}


	/* optional mid-right compare bubble like screenshot */

	.fx-compare {

		position: fixed;

		right: 20px;

		bottom: 50%;

		transform: translateY(50%);

		display: flex;

		align-items: center;

		justify-content: center;

		width: 56px;

		height: 56px;

		border-radius: 50%;

		background: #eef4ff;

		color: #2b62ff;

		font-weight: 700;

		text-decoration: none;

		box-shadow: 0 10px 24px rgba(0, 0, 0, .08);

		z-index: 9998;

	}


	/* mobile: keep buttons a bit bigger click area, hide labels to save space */

	@media (max-width: 575.98px) {

		.fx-btn {

			width: 58px;

			height: 58px;

		}


		.fx-btn::after {

			display: none;

		}


		.fx-compare {

			right: 12px;

		}


		.fx-stack {

			right: 12px;

			bottom: 12px;

			gap: 12px;

		}

	}


	/* why choches */

	.why-tiles .tile {

		display: flex;

		align-items: center;

		gap: 14px;

		background: var(--tile-bg);

		border: 1px solid var(--tile-b);

		border-radius: 16px;

		padding: 18px;

		height: 100%;

		box-shadow: 0 4px 18px rgba(15, 34, 56, .06);

		transition: transform .25s, box-shadow .25s, border-color .25s;

	}


	.why-tiles .tile:hover {

		transform: translateY(-6px);

		border-color: #dbe4ef;

		box-shadow: 0 14px 34px rgba(15, 34, 56, .12);

	}


	.why-tiles .ico {

		flex: 0 0 56px;

		height: 56px;

		display: grid;

		place-items: center;

		color: var(--b);

		background:

			radial-gradient(60% 60% at 35% 30%, rgba(30, 102, 255, .18), transparent 60%),

			#f7faff;

		border-radius: 14px;

		box-shadow: 0 6px 18px rgba(30, 102, 255, .15), 0 0 0 6px var(--ring) inset;

	}


	.why-tiles .ttl {

		margin: 0 0 4px;

		color: var(--nav);

		font-weight: 600;

	}


	.why-tiles .txt {

		margin: 0;

		color: var(--muted);

		font-size: .95rem
	}


	/* subtle column separators on large screens */

	@media (min-width: 992px) {

		.why-tiles .col-lg-3 {

			position: relative
		}


		.why-tiles .col-lg-3+.col-lg-3::before {

			content: "";

			position: absolute;

			left: -12px;

			top: 14%;

			width: 1px;

			height: 72%;

			background: linear-gradient(#eff3f8, #e7edf6);

		}

	}


	/* why choches */

	section#holiday-themes {

		padding: 40px 0px 90px !important;

	}


	.growing {

		padding: 60px 0px;

	}


	/* ==================================================  Himachal page CSS  ================================================ */


	.main_banner {

		position: relative;

		background-size: cover;

		background-position: center center;

		z-index: 1;

		color: var(--ink);

		padding: 120px 0;

		background-size: cover;

	}


	.package-text {

		max-width: 100%;

		width: 80%;

		margin: 0px auto;

	}


	/* Premium FAQ */

	.faq-pro {

		background: #fff
	}


	.faq-list {

		max-width: 960px;

		border: 1px solid #e9edf3;

		border-radius: 14px;

		overflow: hidden
	}


	.faq-row {

		border-bottom: 1px solid #e9edf3;

		background: #fff
	}


	.faq-row:last-child {

		border-bottom: none
	}


	.faq-toggle {

		width: 100%;

		display: flex;

		align-items: center;

		justify-content: space-between;

		padding: 18px 22px;

		background: #fff;

		border: 0;

		cursor: pointer;

		gap: 16px
	}


	.faq-q {

		font-weight: 600;

		font-size: 1.05rem;

		line-height: 1.4;

		color: #0f2238;

		text-align: left;

	}


	.faq-ico {

		position: relative;

		flex: 0 0 22px;

		height: 22px;

		transform: rotate(0deg);

		transition: transform .25s ease, opacity .25s ease
	}


	/* chevron */

	.faq-ico::before,

	.faq-ico::after {

		content: "";

		position: absolute;

		inset: 0;

		margin: auto;

		width: 10px;

		height: 2px;

		background: #64748b;

		transform-origin: center;

		transition: transform .25s ease
	}


	.faq-ico::before {

		transform: translateY(-1px) rotate(45deg)
	}


	.faq-ico::after {

		transform: translateY(-1px) rotate(-45deg)
	}


	/* hover row */

	.faq-row:hover {

		background: #f9fbff
	}


	/* answer */

	.faq-a {

		max-height: 0;

		overflow: hidden;

		color: #4b5563;

		padding: 0 22px;

		line-height: 1.7;

		transition: max-height .3s ease, padding .3s ease, opacity .2s ease;

		opacity: 0
	}


	.faq-row.active .faq-a {

		max-height: 220px;

		padding: 0 22px 18px;

		opacity: 1
	}


	.faq-row.active .faq-ico {

		transform: rotate(180deg)
	}


	/* optional two-column on lg */

	@media(min-width:992px) {

		.faq-list {

			display: grid;

			grid-template-columns: 1fr 1fr
		}


		.faq-row {

			border-right: 1px solid #e9edf3
		}


		.faq-row:nth-child(2n) {

			border-right: none
		}

	}


	/* =================  Packages Details Page ========================= */


	.container-narrow {

		max-width: 1100px
	}


	.shadow-soft {

		box-shadow: 0 12px 30px rgba(0, 0, 0, .08)
	}


	.section-card {

		background: #fff;

		border: 1px solid var(--line);

		border-radius: 16px;

		padding: 22px
	}


	.section-title {

		font-size: 1.2rem;

		font-weight: 700;

		margin-bottom: 14px
	}


	/* Chips row */

	.badge-gold {

		background: var(--o);

		color: #fff;

		border-radius: 999px;

		padding: .4rem .8rem;

		font-weight: 600
	}


	.chip {

		background: #fff;

		border: 1px solid var(--line);

		color: #fcfcfc;

		padding: .4rem .7rem;

		border-radius: 999px;

		font-size: .9rem
	}


	.chips {

		display: flex;

		gap: 8px;

		flex-wrap: wrap
	}


	/* Gallery */

	.gallery-strip {

		padding-top: 16px
	}


	.gallery-grid {

		display: grid;

		gap: 10px;

		grid-template-columns: 2fr 1fr 1fr;

		grid-auto-rows: 180px
	}


	.gallery-grid .item {

		position: relative;

		overflow: hidden;

		border-radius: 16px
	}


	.gallery-grid .item img {

		width: 100%;

		height: 100%;

		object-fit: cover;

		transition: transform .35s
	}


	.gallery-grid .item:hover img {

		transform: scale(1.05)
	}


	@media(max-width:992px) {

		.gallery-grid {

			grid-template-columns: 1fr 1fr;

			grid-auto-rows: 150px
		}

	}


	/* Main grid */

	.main-grid {

		display: grid;

		grid-template-columns: 1.75fr .95fr;

		gap: 28px
	}


	.key-points li {

		display: flex;

		gap: 10px;

		padding: 8px 0;

		border-bottom: 1px dashed var(--line)
	}


	.key-points li:last-child {

		border-bottom: none
	}


	.pill {

		display: inline-flex;

		align-items: center;

		gap: 8px;

		border: 1px solid var(--line);

		color: var(--nav);

		padding: .5rem .8rem;

		border-radius: 999px;

		font-weight: 600
	}


	.divider {

		height: 1px;

		background: var(--line);

		margin: 16px 0
	}


	/* Sidebar price */

	.price-card {

		position: sticky;

		top: 90px;

		border: 1px solid var(--line);

		border-radius: 18px;

		padding: 18px;

		background: #fff
	}


	.price {

		font-size: 1.8rem;

		font-weight: 800
	}


	.save {

		color: #0a6b4b;

		background: #e8fbf4;

		border-radius: 12px;

		padding: .25rem .5rem;

		font-weight: 700;

		font-size: .9rem;

		/* margin: 0px auto; */

		width: fit-content;

	}


	.cta-lg {

		background: linear-gradient(90deg, var(--o), var(--b));

		color: #fff;

		border: none;

		border-radius: 999px;

		padding: .9rem 1rem;

		width: 100%;

		font-weight: 700
	}


	.cta-lg:hover {

		opacity: .95
	}


	.trust {

		display: flex;

		gap: 12px;

		align-items: center;

		font-size: .9rem;

		color: #6b7b8f
	}


	/* Tabs (same classes) */

	.nav-line .nav-link {

		border: none;

		border-bottom: 2px solid transparent;

		color: #6b7b8f;

		font-weight: 600
	}


	.nav-line .nav-link:hover {

		color: var(--o)
	}


	.nav-line .nav-link.active {

		color: var(--nav);

		border-bottom-color: var(--o)
	}


	/* Read more */

	.h-clip {

		max-height: 190px;

		overflow: hidden;

		position: relative
	}


	.show-more {

		background: linear-gradient(180deg, rgba(255, 255, 255, 0), #fff);

		position: absolute;

		inset: auto 0 0 0;

		height: 70px
	}


	/* Visibility helpers */

	.mobile-only {

		display: none
	}


	.desktop-only {

		display: block
	}


	@media(max-width:992px) {

		.main-grid {

			grid-template-columns: 1fr
		}


		.price-card {

			position: static
		}


		.desktop-only {

			display: none
		}


		.mobile-only {

			display: block
		}

	}


	/* --- MOBILE TABS (no jump, no wrap) --- */

	@media (max-width: 992px) {


		/* make the <ul> a horizontal scroller without sticky to avoid jump */

		.tabs-mobile {

			display: flex !important;

			flex-wrap: nowrap !important;

			gap: 10px;

			overflow-x: auto;

			-webkit-overflow-scrolling: touch;

			scrollbar-width: none;

			padding: 6px 2px 8px 2px;

			/* compact and no full-bleed */

			background: #fff;

		}


		.tabs-mobile::-webkit-scrollbar {

			display: none
		}


		.tabs-mobile .nav-item {

			flex: 0 0 auto
		}


		.tabs-mobile .nav-link {

			white-space: nowrap;

			padding: .5rem .9rem;

			border: 1px solid var(--line);

			border-radius: 999px;

			font-weight: 600;

			line-height: 1.1;

		}


		/* keep underline style off on mobile for readability */

		.nav-line .nav-link {

			border-bottom: 0
		}


		.nav-line .nav-link.active {

			color: #fff !important;

			background: linear-gradient(90deg, var(--o), var(--b));

			border-color: transparent;

		}


		.tab-content {

			margin-top: 8px
		}

	}

	a.btn.sm.g i {

		color: #ffffff;

	}

	.btn-animetion:hover {

		color: var(--o);

	}

	.btn-animetion {

		border: 2px solid #ffe81e;
		/* orange border */

		border-radius: 30px;

		padding: 8px 20px;

		color: #fff;

		background: transparent;

		position: relative;

		animation: borderGlow 2s infinite;

	}


	/* Border glow effect */

	@keyframes borderGlow {

		0% {

			box-shadow: 0 0 0px #ff5b2e;

		}

		50% {

			box-shadow: 0 0 12px #ff5b2e;

		}

		100% {

			box-shadow: 0 0 0px #ff5b2e;

		}

	}


	/* ==================================  Family Tour Packages ================================ */


	/* uses your root variables */

	.category-bubbles .card-wrap {

		/* max-width: 1040px; */
		/* center like your ref */

		margin: 0 auto;

		background: #fff;

		border-radius: var(--r, 16px);

		border: 1px solid var(--tile-b, #e8edf3);

		padding: 12px 16px;
		/* tighter inner space */

		box-shadow: 0 14px 40px rgba(15, 34, 56, .08);

	}


	/* reduce gaps vs previous */

	.category-bubbles .bubbles-grid {
		--bs-gutter-x: 1rem;
	}


	/* bubble */

	.bubble-link {
		color: var(--ht-ink, #0f2238);
	}

	.bubble-img {

		width: 62px;
		/* a bit smaller for tighter look */

		box-shadow: 0 2px 10px rgba(0, 0, 0, .08);

		transition: transform .25s ease, box-shadow .25s ease;

	}

	.bubble-link:hover .bubble-img {

		transform: translateY(-2px);

		box-shadow:

			0 6px 18px rgba(0, 0, 0, .16),

			0 0 0 2px var(--qx-orange, var(--o, #f25c10)) inset;

	}


	/* two-line clamp */

	.text-truncate-2 {

		display: -webkit-box;

		-webkit-line-clamp: 2;

		-webkit-box-orient: vertical;

		overflow: hidden;

		max-width: 112px;

		color: var(--ht-ink, #0f2238);

	}


	/* mobile: keep card centered, make items scroll smoothly */

	@media (max-width: 576px) {

		.category-bubbles .card-wrap {
			padding: 10px 12px;
		}

		.category-bubbles .bubbles-grid {

			flex-wrap: nowrap;

			overflow-x: auto;

			scrollbar-width: thin;

			scroll-snap-type: x mandatory;

		}

		.category-bubbles .bubbles-grid>.col {

			flex: 0 0 auto;

			scroll-snap-align: start;

		}

		.bubble-img {
			width: 58px;
		}

		.text-truncate-2 {
			max-width: 96px;
			font-size: 13px;
		}

	}

	section.py-4.category-bubbles {

		margin-top: -75px;

		z-index: 999;

		position: relative;

	}


	/* tooltip base */

	.bubble-link {
		position: relative;
	}


	/* hidden by default */

	.bubble-link::after {

		content: attr(data-full);

		position: absolute;

		left: 50%;

		bottom: calc(100% + 12px);

		transform: translate(-50%, 6px);

		opacity: 0;

		pointer-events: none;

		background: var(--nav);

		color: var(--ink);

		border-radius: calc(var(--r) - 6px);

		padding: 8px 10px;

		max-width: 100%;

		width: 150px;

		font-size: 13px;

		line-height: 1.25;

		box-shadow: 0 10px 28px rgba(0, 0, 0, .18);

		white-space: normal;

		text-align: center;

		transition: opacity .18s ease, transform .18s ease;

		z-index: 9;

	}


	/* small arrow */

	.bubble-link::before {

		content: "";

		position: absolute;

		left: 50%;

		bottom: calc(100% + 6px);

		transform: translateX(-50%);

		border: 7px solid transparent;

		border-top-color: var(--nav);

		opacity: 0;

		transition: opacity .18s ease;

		z-index: 9;

	}


	/* show on hover or keyboard focus */

	@media (hover:hover) {

		.bubble-link:hover::after,

		.bubble-link:hover::before {

			opacity: 1;

			transform: translate(-50%, 0);

		}

	}

	.bubble-link:focus-visible::after,

	.bubble-link:focus-visible::before {

		opacity: 1;

		transform: translate(-50%, 0);

	}


	.info-spotlight .spot-shell {
		max-width: 1120px;
		position: relative
	}

	.info-spotlight .spot-card {

		position: relative;
		background: #fff;
		border: 1px solid var(--tile-b);

		border-radius: var(--r);
		padding: 20px 24px 20px 60px;
		box-shadow: 0 12px 36px rgba(15, 34, 56, .08)
	}

	.info-spotlight .spot-card::before {

		content: "";
		position: absolute;
		left: 18px;
		top: 18px;
		bottom: 18px;
		width: 8px;

		border-radius: 8px;
		background: linear-gradient(180deg, var(--qx-orange), var(--qx-orange2))
	}

	.spot-title {
		color: var(--ht-ink);
		font-weight: 700
	}

	.spot-desc {
		color: var(--ht-muted)
	}


	/* link */

	.spot-link {

		color: var(--qx-orange);
		font-weight: 600;
		text-decoration: none;
		display: inline-flex;
		align-items: center;
		gap: .4rem;

		position: relative
	}

	.spot-link::after {

		content: "";
		position: absolute;
		left: 0;
		right: 0;
		bottom: -2px;
		height: 2px;
		background: currentColor;

		transform: scaleX(.3);
		transform-origin: left;
		transition: transform .25s ease, color .25s ease;
		opacity: .85
	}

	.spot-link:hover {
		color: var(--qx-orange2)
	}

	.spot-link:hover::after {
		transform: scaleX(1)
	}


	/* chevron rotate on open */

	.spot-link .chev {
		transition: transform .25s ease
	}

	.spot-link[aria-expanded="true"] .chev {
		transform: rotate(180deg)
	}


	@media (max-width:576px) {

		.info-spotlight .spot-card {
			padding: 16px 16px 16px 52px
		}

		.info-spotlight .spot-card::before {
			left: 14px;
			top: 14px;
			bottom: 14px;
			width: 6px
		}

	}


	/*====================== contact css======================= */


	header.hero .chip {

		color: #ffffff;

		/* background: #ffffff73; */

	}

	header.hero .chip:hover {

		color: #000;

	}


	/* Hero */

	.hero {

		position: relative;
		color: #fff;
		text-align: center;
		overflow: hidden;

		background:

			radial-gradient(1200px 400px at 10% 100%, rgba(242, 92, 16, .15), transparent),

			radial-gradient(1000px 380px at 90% 0%, rgba(241, 91, 18, .18), transparent),

			linear-gradient(180deg, #0b2033 0%, #14324f 100%);

		padding: 96px 16px 72px;

	}

	.hero h1 {
		font-weight: 800;
		font-size: 44px;
		letter-spacing: .2px;
		margin: 0;
	}

	.hero p {
		opacity: .9;
		margin: 12px auto 0;
		max-width: 760px;
		font-size: 18px
	}

	.hero .badges {
		gap: 10px
	}

	.chip {

		display: inline-flex;
		align-items: center;
		gap: 8px;
		padding: 8px 12px;
		border-radius: 999px;

		background: rgba(255, 255, 255, .1);
		border: 1px solid rgba(233, 241, 255, .25);
		backdrop-filter: blur(6px);
		font-weight: 600;

	}

	.chip i {
		font-size: 18px
	}


	/* Cards + tiles */

	.card-soft {

		background: #fff;
		border: 1px solid var(--tile-b);
		border-radius: calc(var(--r) + 4px);

		box-shadow: 0 8px 24px rgba(11, 32, 51, .06);

	}

	.tile {

		border: 1px dashed var(--tile-b);
		border-radius: var(--r);
		padding: 18px;
		height: 100%;

		transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;

		background: #fff;

	}

	.tile:hover {
		transform: translateY(-4px);
		border-color: var(--qx-orange);
		box-shadow: 0 10px 24px rgba(0, 0, 0, .06)
	}

	.tile i {
		font-size: 22px;
		color: var(--qx-orange);
	}


	/* Buttons */

	.btn-gradient {

		background: linear-gradient(45deg, var(--qx-orange), var(--qx-orange2));

		color: #fff;
		border: none;
		border-radius: 12px;
		padding: 12px 22px;
		font-weight: 700;

		box-shadow: 0 10px 20px rgba(242, 92, 16, .25);

	}

	.btn-gradient:hover {
		opacity: .92
	}

	.btn-ghost {

		background: #fff;
		color: var(--nav);
		border: 1px solid var(--tile-b);
		border-radius: 12px;
		padding: 12px 22px;
		font-weight: 700;

	}


	/* Form */

	.form-control {

		border: 1px solid var(--tile-b);
		border-radius: 14px;
		padding: 12px 14px;

	}

	.form-control:focus {

		border-color: var(--qx-orange);
		box-shadow: 0 0 0 .25rem rgba(242, 92, 16, .15);

	}

	.help {
		font-size: 13px;
		color: var(--ht-muted)
	}

	.required:after {
		content: "*";
		color: var(--qx-orange);
		margin-left: 4px
	}


	/* Info cards */

	.info i {
		font-size: 28px;
		color: var(--qx-orange)
	}

	.info h6 {
		margin: 8px 0 4px
	}


	/* Section titles */

	.sect-title {
		font-weight: 800;
		letter-spacing: .2px
	}


	/* Map */

	.map iframe {
		width: 100%;
		height: 420px;
		border: 0;
		border-radius: 16px
	}


	/* Wave divider */

	.wave {
		display: block;
		height: 48px;
		background: linear-gradient(180deg, transparent 0, #fff 100%);
		margin-top: -48px
	}


	@media (max-width:575.98px) {

		.hero {
			padding: 80px 16px 64px
		}

		.hero h1 {
			font-size: 34px
		}

	}

	section.form-section.pb-5 {

		background: #f0f5f6;

	}


	/* blog css======================= */


	/* Chips */

	.chip {

		display: inline-flex;

		align-items: center;

		gap: 8px;

		padding: ;

		border: 1px solid rgb(126 129 133 / 20%);

		nd: rgba(255, 255, 255, .1);

		color: #000000;

		border: 1px solid rgb(106 109 115 / 20%);

		border-radius: 999px;

		cursor: pointer;

		transition: .2s;

	}

	.chip.active,
	.chip:hover {
		background: #fff;
		color: var(--nav);
		border-color: #fff
	}


	/* Cards */

	.card-soft {
		background: #fff;
		border: 1px solid var(--tile-b);
		border-radius: calc(var(--r) + 4px);
		box-shadow: 0 8px 24px rgba(11, 32, 51, .06)
	}

	.post-card {
		overflow: hidden;
		transition: transform .25s, box-shadow .25s
	}

	.post-card:hover {
		transform: translateY(-4px);
		box-shadow: 0 12px 28px rgba(11, 32, 51, .10)
	}

	.post-thumb {
		aspect-ratio: 16/9;
		object-fit: cover;
		width: 100%
	}

	.meta {
		font-size: 13px;
		color: var(--ht-muted)
	}

	.tag-badge {
		font-size: 12px;
		padding: 4px 10px;
		background: #fff;
		border: 1px solid var(--tile-b);
		border-radius: 999px
	}


	/* Buttons */

	.btn-gradient {
		background: linear-gradient(45deg, var(--qx-orange), var(--qx-orange2));
		color: #fff;
		border: none;
		border-radius: 12px;
		padding: 10px 18px;
		font-weight: 700;
		font-size: 12px;
		box-shadow: 0 10px 20px rgba(242, 92, 16, .25)
	}

	.btn-ghost {
		background: #fff;
		color: var(--nav);
		border: 1px solid var(--tile-b);
		border-radius: 12px;
		padding: 10px 18px;
		font-weight: 700;
		font-size: 12px;
	}


	/* Sidebar */

	.mini-thumb {
		width: 72px;
		height: 56px;
		object-fit: cover;
		border-radius: 12px;
		border: 1px solid var(--tile-b)
	}


	/* Pagination */

	.pagination .page-link {
		border-radius: 12px;
		border: 1px solid var(--tile-b);
		color: var(--nav)
	}

	.pagination .active .page-link {
		background: linear-gradient(45deg, var(--qx-orange), var(--qx-orange2));
		border-color: transparent;
		color: #fff
	}


	@media (max-width:575.98px) {
		.hero {
			padding: 72px 16px 56px
		}
	}


	/* Make swiper slides behave like flex items so cards can stretch */

	.pk-row-swiper .swiper-wrapper {

		display: flex !important;

		align-items: stretch;

	}


	/* ensure each slide takes full column height and is a flex column */

	.pk-row-swiper .swiper-slide {

		display: flex !important;

		align-items: stretch;

		height: auto !important;


	}


	/* Card layout: column with footer pinned to bottom */

	.pk-card {

		display: flex;

		flex-direction: column;

		width: 100%;

		height: 100%;


		box-sizing: border-box;

	}


	/* Media area: keep aspect ratio and do not stretch body */

	.pk-media {

		flex: 0 0 auto;

		width: 100%;

		overflow: hidden;

		border-top-left-radius: .6rem;

		border-top-right-radius: .6rem;

	}


	/* Force images to cover and uniform height */

	.pk-media img {

		display: block;

		width: 100%;

		height: 180px;
		/* tweak height as needed */

		object-fit: cover;

		object-position: center;

	}


	/* Body will expand to fill remaining space */

	.pk-body {

		flex: 1 1 auto;

		display: flex;

		flex-direction: column;


		box-sizing: border-box;

	}


	/* Small responsive tweaks */

	@media (max-width: 991px) {

		.pk-media img {
			height: 160px;
		}

	}

	@media (max-width: 576px) {

		.pk-media img {
			height: 140px;
		}

	}


	padding: 15px !important;


}


/* --------------------------------------------------------------------------------- bannre end  */


/* --------------------------------------------------------------------------------- slider pa end  */


/* Theme variables (use your existing ones if present) */


/* Section head */

.themes-section {
	/* padding: 24px 0; */
	background: #fff;
}


.themes-head {
	/* display: flex; */
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 14px;
	padding: 0 12px;
}


.container.themes-head h2 {

	font-size: 25px !important;

	font-weight: 500 !important;

}


.themes-cta {

	font-size: 14px;

	color: #64748b;

	white-space: nowrap;

}


/* Slider wrap */

.themes-wrap {

	position: relative;

	padding: 8px 44px;

	/* space for arrows */

}


/* Card */

.theme-card {
	border-radius: 14px;
	overflow: hidden;
	background: #fff;
	border: 1px solid #ffc107;
	box-shadow: 0 6px 18px rgba(0, 0, 0, .06);
}


.theme-card .media {

	aspect-ratio: 4/5;

	overflow: hidden;

	background: #f5f7fb;

}


.theme-card .media img {

	width: 100%;

	height: 100%;

	object-fit: cover;

	transition: transform .5s ease;

}


.theme-card:hover .media img {

	transform: scale(1.06);

}


.theme-card .title {

	font-weight: 700;

	margin: 10px 10px 0;

	color: #0f172a;

}


.theme-card .meta {

	margin: 2px 10px 12px;

	font-size: 12px;

	color: #728099;

}


/* Swiper sizing */

.theme-swiper {

	width: 100%;

}


.swiper-slide {

	height: auto;

}


/* Arrows */

.btn-nav {

	position: absolute;

	top: 50%;

	transform: translateY(-50%);

	width: 40px;

	height: 40px;

	border-radius: 12px;

	border: 1px solid rgba(0, 0, 0, .1);

	background: #fff;

	color: #0f172a;

	display: grid;

	place-items: center;

	box-shadow: 0 8px 20px rgba(0, 0, 0, .12);

	z-index: 5;

}


.themes-prev {

	left: 4px;

}


.themes-next {

	right: 4px;

}


.btn-nav:hover {

	background: linear-gradient(135deg, var(--o), var(--b));

	color: #fff;

	border-color: transparent;

}


/* Pagination (vertical on desktop, left side) */

.themes-pagination {

	position: absolute;

	left: 8px;

	top: 50%;

	transform: translateY(-50%);

	width: auto !important;

	height: auto;

	z-index: 4;

	display: flex;

	flex-direction: column;

	gap: 10px;

}


.themes-pagination .swiper-pagination-bullet {

	width: 10px;

	height: 10px;

	border-radius: 50%;

	background: #cbd5e1;

	opacity: 1;

}


.themes-pagination .swiper-pagination-bullet-active {

	background: linear-gradient(135deg, var(--o), var(--b));

}


/* Mobile tweaks: dots bottom & centered, arrows outside */

@media (max-width: 768px) {

	.themes-wrap {

		padding: 8px 36px;

	}


	.themes-pagination {

		left: 50%;

		top: auto;

		bottom: -8px;

		transform: translateX(-50%);

		flex-direction: row;

		gap: 8px;

	}


	.btn-nav {

		top: calc(50% - 10px);

	}


	/* thoda niche to avoid thumbs */

}


/* Slides per view visuals (cards tight like reference) */

@media (min-width: 1200px) {

	.themes-wrap {

		padding-right: 52px;

		padding-left: 44px
	}

}


/* wrapper */

.hero-swiper {

	border-radius: 18px;

	overflow: hidden;

	position: relative;

	box-shadow: 0 12px 30px rgba(0, 0, 0, .15);

}


/* slide image keeps aspect nicely */

.hero-slide {

	margin: 0;

	position: relative;

}


.hero-slide img {

	width: 100%;

	height: 40vh;

	min-height: 300px;

	max-height: 640px;

	object-fit: cover;

	display: block;

}


/* overlay text */

.overlay {

	position: absolute;

	left: 0;

	right: 0;

	bottom: 10%;

	color: #fff;

	text-align: center;

	padding: 0 24px;

	text-shadow: 0 2px 16px rgba(0, 0, 0, .45);

}


.overlay .kicker {

	margin: 0 0 .25rem 0;

	font-weight: 600;

	letter-spacing: .2px;

}


.overlay .title {

	margin: 0;

	font-weight: 800;

	line-height: 1;

	font-size: clamp(32px, 6vw, 64px);

	/* premium text gradient */

	background: linear-gradient(135deg, #fff 20%, #ffe6d2 60%);

	-webkit-background-clip: text;

	background-clip: text;

	color: transparent;

}


/* arrows */

.nav-slider {

	position: absolute;

	top: 50%;

	transform: translateY(-50%);

	width: 44px;

	height: 44px;

	border-radius: 50%;

	background: rgba(255, 255, 255, .9);

	border: 0;

	color: #0f172a;

	display: grid;

	place-items: center;

	cursor: pointer;

	box-shadow: 0 6px 18px rgba(0, 0, 0, .2);

	z-index: 5;

}


.nav:hover .prev {

	left: 16px
}


.next {

	right: 16px
}


/* dots */

.swiper-pagination {

	position: absolute;

	left: 50%;

	bottom: 16px;

	transform: translateX(-50%);

}


.swiper-pagination-bullet {

	width: 8px;

	height: 8px;

	background: #fff;

	opacity: .6;

}


.swiper-pagination-bullet-active {

	width: 10px;

	height: 10px;

	opacity: 1;

	background: linear-gradient(135deg, var(--o), var(--b));

	box-shadow: 0 0 0 2px rgba(0, 0, 0, .15);

}


/* mobile tweaks */

@media (max-width:576px) {

	.hero-slide img {

		height: 48vh;

		min-height: 260px
	}


}

/* -----------Packages------------------ */

/* ===== Scoped styles, no conflict with your CSS (all pk-*) ===== */

#pk-section {

	background: #fff
}


#pk-section .pk-title {

	font-weight: 500;

	color: #333;

	font-size: 25px;

}


#pk-section .pk-viewall {

	color: #64748b;

	font-weight: 600;

	text-decoration: none;

	white-space: nowrap
}


#pk-section .pk-viewall .pk-arrow {

	margin-left: .35rem;

	color: var(--o, #f25c10)
}


.pk-card {

	display: flex;

	flex-direction: column;

	background: #fff;

	border: 1px solid rgba(0, 0, 0, .06);

	border-radius: 16px;

	overflow: hidden;

	box-shadow: 0 8px 20px rgba(0, 0, 0, .06);

	/* height: 581px !important; */

	min-height: 100%;

}


/* media area with fixed aspect for consistency */

.pk-media {

	position: relative
}


.pk-card-swiper {

	position: relative;

	overflow: hidden
}


.pk-card-swiper .swiper-slide {

	aspect-ratio: 16/10
}


.pk-card-swiper .swiper-slide img {

	width: 100%;

	height: 100%;

	object-fit: cover;

	display: block
}


.pk-media::before,

.pk-media::after {

	content: "";

	position: absolute;

	inset: 0;

	border-radius: 16px 16px 0 0;

	pointer-events: none
}


.pk-media::after {

	/* inner radius mask */

	box-shadow: inset 0 0 0 12px #0000
}


/* rounded top like reference */

.pk-card {

	border-radius: 16px
}


.pk-media,

.pk-card-swiper,

.pk-card-swiper .swiper-slide img {

	border-radius: 15px;

}


/* centered dots over image */

.pk-card-pagination {

	position: absolute;

	left: 50%;

	bottom: 10px;

	transform: translateX(-50%);

	z-index: 5
}


.pk-card-pagination .swiper-pagination-bullet {

	width: 8px;

	height: 8px;

	border-radius: 50%;

	background: #ffffffcc;

	opacity: 1
}


.pk-card-pagination .swiper-pagination-bullet-active {

	background: linear-gradient(135deg, var(--o, #f25c10), var(--b, #f15b12));

	box-shadow: 0 0 0 2px rgba(0, 0, 0, .18)
}


.pk-body {

	padding: 14px 16px 0 16px;

	display: flex;

	flex-direction: column
}


.pk-subtle {

	color: #6b7280;

	font-size: .95rem
}


.pk-rating {

	color: #22c55e;

	font-weight: 700
}


.pk-muted {

	color: #94a3b8;

	font-weight: 600
}


.pk-name {

	font-size: 1.05rem;

	line-height: 1.35;

	margin: 4px 0 8px 0;

	color: #0f172a;

	font-weight: 600;

}


.pk-tags {

	display: flex;

	flex-wrap: wrap;

	gap: 8px;

	margin-top: 2px
}


.pk-chip {
	background: #fff8f2;
	border: 1px solid #ffd8ba;
	color: #000000b0;
	padding: 5px 8px;
	border-radius: 999px;
	font-size: .87rem;
	font-weight: 600
}


.pk-chip strong {

	font-weight: 800
}


.pk-chip.pk-more {

	background: #eef2ff;

	border-color: #dbe2ff;

	color: #3b4b9a
}


.pk-strike {

	text-decoration: line-through;

	color: #9aa3af;

	font-weight: 700
}


.pk-save {

	background: #e9f9ee;

	color: #0f8a3f;

	borde;

	border: 1px solid #c7f0d4;

	border-radius: 8px;

	font-weight: 500;

	font-size: 10px;

	padding: 4px;

}


.pk-price {

	font-size: 16px;

	font-weight: 500;

	color: #0f172a;

	margin-top: 4px
}


.pk-per {

	color: #6b7280;

	font-weight: 600
}


/* footer pinned at bottom for equal button alignment */

.pk-footer {

	display: flex;

	align-items: center;

	gap: 10px;

	padding: 12px 16px 16px 16px;

	margin-top: auto;

}


.pk-btn {
	appearance: none;
	border: 1px solid rgba(0, 0, 0, .1);
	background: #fff;
	color: #000000 !important;
	padding: 10px 12px;
	border-radius: 12px;
	font-weight: 500;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .5rem
}


.pk-btn-primary {
	background: #ffea1b;
	border: 1px solid #e2e4e8;
	color: #100f0f;
	box-shadow: 0 6px 18px rgb(179 179 179 / 25%);
}


.pk-btn-ghost {

	width: 54px;

	flex: 0 0 54px
}


/* responsive text tweaks */

@media (max-width:575.98px) {

	.pk-name {

		font-size: 1rem
	}


	.pk-chip {

		font-size: .83rem
	}


	.pk-save {

		font-size: .78rem
	}


	.pk-price {

		font-size: 1.15rem
	}

}


.main-a {

	text-align: center;

	margin-top: 20px;

}


.n {


	width: 40px;

	height: 40px;

	border-radius: 12px;

	border: 1px solid rgba(0, 0, 0, .1);

	background: #f4f4f4;

	color: #ff670f;


	place-items: center;

	box-shadow: 0 8px 20px rgba(0, 0, 0, .12);

	z-index: 5;

}


hr.hr {

	color: #b4b4b4;

}


.offring-bix {

	background-image: url(../img/room/offer-s.jpg);

	background-position: top;

	background-repeat: no-repeat;

	background-size: cover;

	padding: 62px;

	border-radius: 10px;

	box-shadow: rgba(17, 17, 26, 0.05) 0px 1px 0px, rgba(17, 17, 26, 0.1) 0px 0px 8px;

}


.save {

	padding: 18px 0px;

	font-size: 25px;

	font-weight: 600;

	font-style: oblique;

}


h2.m-0.pk-title.offer {

	font-size: 37px !important;

	font-weight: 700 !important;

}


/* wrapper */

.pk-offer-wrap {

	margin: 8px 0 12px;

	display: flex;

	align-items: center;

	flex-wrap: wrap;

	gap: 10px;

}


/* badge */

.pk-offer-badge {

	height: 22px;

	background: #d32f2f;

	color: #fff;

	font-size: 13px;

	font-weight: 700;

	border-radius: 20px;

	display: inline-flex;

	align-items: center;

	gap: 4px;

	width: 142px;

	white-space: ;

	border: thick;

}


.pk-offer-badge strong {


	color: #d32f2f;

	font-size: 12px;

	font-weight: 700;

	border-radius: 50%;


	line-height: 1;

}


.pk-offer-badge img {

	width: 40px;

}


/* holiday  advancher */


.ht-dot {

	width: 8px;

	height: 8px;

	border-radius: 50%;

	background: #ffc107;

	display: inline-block;

}


.ht-card {

	border-color: var(--ht-line) !important;

	border-radius: 6px;

	text-decoration: none;

	transition: transform .18s, box-shadow .18s, border-color .18s;

}


.ht-card .ht-ico {

	width: 44px;

	height: 44px;

	border-radius: 10px;

	display: grid;

	place-items: center;

	background: #f6faf9;

	border: 1px solid #e6f4f1;

}


.ht-card .ht-ico svg {

	display: block
}


.ht-card .small {

	color: var(--ht-muted) !important
}


.ht-card:hover {

	transform: translateY(-2px);

	border-color: #d6e1ec !important;

	box-shadow: 0 10px 28px rgba(15, 34, 56, .08);

}


.ht-card.is-active {

	background: #f7fbff;

	border-color: #d9e7f7 !important;

	box-shadow: inset 0 0 0 1px #e8f1fd;

}


.ht-card .ht-ico {

	background: linear-gradient(180deg, #ffe0c2, #e7fff7);

	border-color: #ffe9d4;

}


.ht-card.is-active .ht-ico svg path[fill],

.ht-card.is-active .ht-ico svg rect[fill] {

	fill: var(--ht-accent) !important
}


/* holiday  advancher */


/* scoped component styles (no :root) */

#mk-market-safe .mk-item .mk-icon {

	width: 76px;

	height: 76px;

	border-radius: 12px;

	display: inline-grid;

	place-items: center;

	background: #f6faf9;

	border: 1px solid #e6f4f1;

	margin-bottom: .5rem;

}


#mk-market-safe .mk-value {

	font-size: 16px;

	color: var(--ht-ink);

}


#mk-market-safe .mk-label {

	font-size: 13px;

	color: var(--ht-muted);

	line-height: 1.2;

}


/* spacing tune on very small screens */

@media (max-width:575.98px) {

	#mk-market-safe .mk-item .mk-icon {

		width: 68px;

		height: 68px
	}

}


/* only component-specific tweaks */

#mk-6-6 .mk6-item .mk6-icon {
	width: 76px;
	height: 76px;
	border-radius: 12px;
	display: inline-grid;
	place-items: center;
	background: #fff7a7;
	border: 1px solid #ffffff;
	margin-bottom: .5rem;
}


@media (max-width:575.98px) {

	#mk-6-6 .mk6-item .mk6-icon {

		width: 68px;

		height: 68px
	}

}


/* ===== Luxury Footer (responsive) ===== */

.lx-footer {
	--bg1: #090c53;
	--bg2: #000000;
	/* --muted: #a8b3c7; */
	background: radial-gradient(1200px 600px at 20% -10%, rgba(255, 255, 255, .06), transparent),

		linear-gradient(180deg, var(--bg1), var(--bg2));
	color: #eaf2ff;
	padding: 42px 0 0;
	position: relative;
	overflow: hidden;
}


/* subtle top shimmer */

.lx-footer::before {

	content: "";

	position: absolute;

	inset: -40% -40% auto -40%;

	height: 220px;

	background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .06), transparent);

	transform: rotate(2deg);

}


/* Top row */

.lx-top {

	display: grid;

	grid-template-columns: 1.2fr 1fr;

	gap: 28px;

	align-items: center;

	margin-bottom: 26px;

}


@media (max-width: 768px) {

	.lx-top {

		grid-template-columns: 1fr;

		gap: 18px
	}

}


.lx-logo {

	height: 48px;

	width: auto;

	filter: drop-shadow(0 6px 18px rgba(0, 0, 0, .25));

}


.lx-tag {

	margin: 10px 0 0;

	color: var(--muted);

	font-size: 14px
}


/* Newsletter */

.lx-newsletter {

	display: flex;

	flex-direction: column;

	gap: 8px
}


.lx-nl-label {

	font-weight: 500;

	letter-spacing: .2px
}


.lx-nl-field {

	display: flex;

	gap: 8px;

	background: rgba(255, 255, 255, .06);

	border: 1px solid rgba(255, 255, 255, .12);

	border-radius: 14px;

	padding: 6px;

	backdrop-filter: blur(6px);

}


.lx-nl-field input {

	flex: 1;

	border: 0;

	outline: 0;

	background: transparent;

	color: #fff;

	padding: 10px 12px;

}


.lx-nl-field input::placeholder {

	color: #b9c4d6
}


.lx-nl-field button {

	border: 0;

	padding: 10px 14px;

	border-radius: 10px;

	color: #fff;

	font-weight: 800;

	background: linear-gradient(135deg, var(--o, #f25c10), #ffb703 45%, var(--b, #f15b12));

	box-shadow: 0 8px 18px rgba(241, 91, 18, .25);

	cursor: pointer;

}


.lx-nl-note {

	color: var(--muted);

	font-size: 12px
}


/* Link grid */

.lx-grid {

	display: grid;

	grid-template-columns: repeat(4, minmax(0, 1fr));

	gap: 24px;

	padding: 18px 0 8px;

	border-top: 1px solid rgba(255, 255, 255, .08);

}


@media (max-width: 992px) {

	.lx-grid {

		grid-template-columns: repeat(2, 1fr)
	}

}


@media (max-width: 576px) {

	.lx-grid {

		grid-template-columns: 1fr
	}

}


.lx-col h6 {

	margin: 0 0 10px;

	font-weight: 500;

	font-size: 20px;

	letter-spacing: .2px
}


.lx-col ul {

	list-style: none;

	margin: 0;

	padding: 0
}


.lx-col li {

	margin: 8px 0
}


.lx-col a {
	color: #ffffff;
	text-decoration: none;
	font-weight: 400;
	opacity: .9;
}


.lx-col a:hover {
	opacity: 1;
	color: #ffea1b;
	text-decoration: underline
}


/* contact icons + socials */

.lx-contact ul li {

	display: flex;

	gap: 10px;

	align-items: flex-start
}


.lx-contact svg {

	width: 18px;

	height: 18px;

	opacity: .9;

	margin-top: 2px
}


.lx-social {

	display: flex;

	gap: 10px;

	margin-top: 12px
}


.lx-social a {

	width: 36px;

	height: 36px;

	border-radius: 999px;

	display: grid;

	place-items: center;

	background: rgba(255, 255, 255, .08);

	color: #fff;

	transition: all .25s ease;

	border: 1px solid rgba(255, 255, 255, .12);

}


.lx-social a:hover {
	background: linear-gradient(135deg, #ffca00, var(--b, #f15b12));
	box-shadow: 0 8px 22px rgba(241, 91, 18, .35);
}


/* Bottom strip */

.lx-bottom {

	margin-top: 22px;

	padding: 14px 0 18px;

	border-top: 1px solid rgba(255, 255, 255, .08);

	display: flex;

	gap: 16px;

	justify-content: space-between;

	align-items: center;

	flex-wrap: wrap;

	color: #c2cee2;

	font-size: 13px;

}


.lx-pay {

	display: flex;

	align-items: center;

	gap: 8px;

	flex-wrap: wrap
}


.lx-paytag {
	opacity: .9;
	margin-right: 2px;
	font-family: "Roboto Condensed", sans-serif;
}


.lx-paypill {

	padding: 4px 10px;

	border-radius: 999px;

	font-weight: 800;

	font-size: 12px;

	color: #0b2033;

	background: #fff;

	border: 1px solid rgba(0, 0, 0, .06);

}


.lx-copy {

	opacity: .9
}


.lx-brand img {
	height: 40px;
	/* filter: drop-shadow(0 2px 6px rgba(0, 0, 0, .4)); */
	height: 60px;
	/* background: #fff; */
	padding: 4px 6px;
	border-radius: 8px;
}


/* ===== Luxury Footer (responsive) END===== */


/* popup css */

.bg-color {

	background: #fcedd8;

	border-radius: 15px 0px 0px 15px;

}


.qx-card {

	background: #fff;

	border-radius: 14px;

	box-shadow: 0 14px 42px rgba(0, 0, 0, .18);

}


.qx-header {

	padding: 12px 14px 10px;

	border-bottom: 1px solid #eef2f6;

}


.qx-thumb {

	width: 42px;

	height: 42px;

	border-radius: 8px;

	object-fit: cover;

	box-shadow: 0 2px 8px rgba(0, 0, 0, .12);

}


.qx-title {

	font-weight: 700;

	font-size: 14px;

	color: #0f1f2e;

	max-width: 330px;

}


.qx-price {

	font-weight: 800;

	color: #0f1f2e;

	font-size: 14px;

}


.qx-mrp {

	color: #9aa4b2;

	text-decoration: line-through;

	font-size: 12px;

}


.qx-save {

	font-size: 11px;

	font-weight: 800;

	color: #0a7f38;

	background: #e9f8ee;

	border: 1px solid #bfe8cc;

	border-radius: 6px;

	padding: 3px 6px;

}


.qx-x {

	color: #7e8896;

	font-size: 18px;

}


.qx-x:hover {

	color: #111;

}


.qx-body {

	padding: 10px 14px 14px;

}


/* Inputs look: light grey fill, subtle border, flat corners=8px */

.qx-input {

	background: #f7f8fa;

	border: 1px solid #e6e9ee;

	border-radius: 8px;

	padding: 10px 12px;

	font-size: 14px;

	color: #0f2033;

}


.qx-input:focus {

	background: #fff;

	border-color: #b9d8ff;

	box-shadow: 0 0 0 .15rem rgba(125, 211, 252, .25);

	color: #0f2033;

}


.qx-textarea {

	resize: vertical;

	min-height: 88px;

}


/* CTA full orange bar */

.qx-cta {

	background: linear-gradient(135deg, var(--qx-orange), #ffb703 45%, var(--qx-orange2));

	color: #fff;

	border: 0;

	border-radius: 8px;

	padding: 12px 14px;

	box-shadow: 0 8px 18px rgba(241, 91, 18, .25);

}


.qx-cta:hover {

	filter: brightness(.98);

	color: #fff;

}


/* make modal content snug on very small screens */

@media (max-width: 380px) {

	.qx-title {

		max-width: 220px
	}

}


.qx-trust i {

	color: #4a5568;

	/* dark grey icons */

}


.qx-trust small {

	font-size: 12px;

	line-height: 1.3;

}


/* container fixed at bottom-right */

.fx-stack {

	position: fixed;

	right: 18px;

	bottom: 18px;

	display: flex;

	flex-direction: column;

	gap: 14px;

	z-index: 9999;

}


/* circular button */

.fx-btn {

	width: 56px;

	height: 56px;

	border-radius: 50%;

	display: grid;

	place-items: center;

	color: #fff;

	text-decoration: none;

	box-shadow: 0 10px 24px rgba(0, 0, 0, .18);

	position: relative;

	transition: transform .2s ease, box-shadow .2s ease, opacity .2s ease;

}


.fx-btn:hover {

	transform: translateY(-2px);

	box-shadow: 0 12px 28px rgba(0, 0, 0, .22);

}


.fx-wa {

	background: #25D366;

}


/* WhatsApp green */

.fx-call {

	background: #0d6efd;

}


/* Brand blue call */


/* tooltip label like screenshot (appears on hover, left side) */

.fx-btn::after {

	content: attr(data-label);

	position: absolute;

	right: 70px;

	top: 50%;

	transform: translateY(-50%);

	background: #0f2238;

	color: #fff;

	font-weight: 600;

	padding: 8px 12px;

	border-radius: 10px;

	font-size: 13px;

	white-space: nowrap;

	opacity: 0;

	pointer-events: none;

	transition: opacity .2s ease;

	box-shadow: 0 8px 20px rgba(0, 0, 0, .15);

}


.fx-btn:hover::after {

	opacity: 1;

}


/* optional mid-right compare bubble like screenshot */

.fx-compare {

	position: fixed;

	right: 20px;

	bottom: 50%;

	transform: translateY(50%);

	display: flex;

	align-items: center;

	justify-content: center;

	width: 56px;

	height: 56px;

	border-radius: 50%;

	background: #eef4ff;

	color: #2b62ff;

	font-weight: 700;

	text-decoration: none;

	box-shadow: 0 10px 24px rgba(0, 0, 0, .08);

	z-index: 9998;

}


/* mobile: keep buttons a bit bigger click area, hide labels to save space */

@media (max-width: 575.98px) {

	.fx-btn {

		width: 58px;

		height: 58px;

	}


	.fx-btn::after {

		display: none;

	}


	.fx-compare {

		right: 12px;

	}


	.fx-stack {

		right: 12px;

		bottom: 12px;

		gap: 12px;

	}

}


/* why choches */

.why-tiles .tile {
	display: flex;
	align-items: center;
	background: white;
	gap: 14px;
	border: 1px solid var(--tile-b);
	border-radius: 16px;
	padding: 18px;
	height: 100%;
	box-shadow: 0 4px 18px rgba(15, 34, 56, .06);
	transition: transform .25s, box-shadow .25s, border-color .25s;
}


.why-tiles .tile:hover {

	transform: translateY(-6px);

	border-color: #dbe4ef;

	box-shadow: 0 14px 34px rgba(15, 34, 56, .12);

}


.why-tiles .ico {
	flex: 0 0 56px;
	height: 56px;
	display: grid;
	place-items: center;
	color: #000000;
	background: radial-gradient(60% 60% at 35% 30%, rgb(255 234 27), transparent 60%), #dbdbdb00;
	border-radius: 14px;
	box-shadow: 0 6px 18px rgba(30, 102, 255, .15), 0 0 0 6px #ffffff inset;
}


.why-tiles .ttl {

	margin: 0 0 4px;

	color: var(--nav);

	font-weight: 600;

}


.why-tiles .txt {

	margin: 0;

	color: var(--muted);

	font-size: .95rem
}


/* subtle column separators on large screens */

@media (min-width: 992px) {

	.why-tiles .col-lg-3 {

		position: relative
	}


	.why-tiles .col-lg-3+.col-lg-3::before {

		content: "";

		position: absolute;

		left: -12px;

		top: 14%;

		width: 1px;

		height: 72%;

		background: linear-gradient(#eff3f8, #e7edf6);

	}

}


/* why choches */

section#holiday-themes {

	padding: 40px 0px 90px !important;

}


.growing {

	padding: 60px 0px;

}


/* ==================================================  Himachal page CSS  ================================================ */


.main_banner {

	position: relative;

	background-size: cover;

	background-position: center center;

	z-index: 1;

	color: var(--ink);

	padding: 120px 0;

	background-size: cover;

}


.package-text {
	max-width: 100%;
	width: 90%;
	margin: 0px auto;
}


/* Premium FAQ */

.faq-pro {

	background: #fff
}


.faq-list {

	max-width: 960px;

	border: 1px solid #e9edf3;

	border-radius: 14px;

	overflow: hidden
}


.faq-row {

	border-bottom: 1px solid #e9edf3;

	background: #fff
}


.faq-row:last-child {

	border-bottom: none
}


.faq-toggle {

	width: 100%;

	display: flex;

	align-items: center;

	justify-content: space-between;

	padding: 18px 22px;

	background: #fff;

	border: 0;

	cursor: pointer;

	gap: 16px
}


.faq-q {

	font-weight: 600;

	font-size: 1.05rem;

	line-height: 1.4;

	color: #0f2238;

	text-align: left;

}


.faq-ico {

	position: relative;

	flex: 0 0 22px;

	height: 22px;

	transform: rotate(0deg);

	transition: transform .25s ease, opacity .25s ease
}


/* chevron */

.faq-ico::before,

.faq-ico::after {

	content: "";

	position: absolute;

	inset: 0;

	margin: auto;

	width: 10px;

	height: 2px;

	background: #64748b;

	transform-origin: center;

	transition: transform .25s ease
}


.faq-ico::before {

	transform: translateY(-1px) rotate(45deg)
}


.faq-ico::after {

	transform: translateY(-1px) rotate(-45deg)
}


/* hover row */

.faq-row:hover {

	background: #f9fbff
}


/* answer */

.faq-a {

	max-height: 0;

	overflow: hidden;

	color: #4b5563;

	padding: 0 22px;

	line-height: 1.7;

	transition: max-height .3s ease, padding .3s ease, opacity .2s ease;

	opacity: 0
}


.faq-row.active .faq-a {

	max-height: 220px;

	padding: 0 22px 18px;

	opacity: 1
}


.faq-row.active .faq-ico {

	transform: rotate(180deg)
}


/* optional two-column on lg */

@media(min-width:992px) {

	.faq-list {

		display: grid;

		grid-template-columns: 1fr 1fr
	}


	.faq-row {

		border-right: 1px solid #e9edf3
	}


	.faq-row:nth-child(2n) {

		border-right: none
	}

}


/* =================  Packages Details Page ========================= */


.container-narrow {

	max-width: 1100px
}


.shadow-soft {

	box-shadow: 0 12px 30px rgba(0, 0, 0, .08)
}


.section-card {

	background: #fff;

	border: 1px solid var(--line);

	border-radius: 16px;

	padding: 22px
}


.section-title {

	font-size: 1.2rem;

	font-weight: 700;

	margin-bottom: 14px
}


/* Chips row */

.badge-gold {

	background: var(--o);

	color: #fff;

	border-radius: 999px;

	padding: .4rem .8rem;

	font-weight: 600
}


.chip {

	background: #fff;

	border: 1px solid var(--line);

	color: #fcfcfc;

	padding: .4rem .7rem;

	border-radius: 999px;

	font-size: .9rem
}


.chips {

	display: flex;

	gap: 8px;

	flex-wrap: wrap
}


/* Gallery */

.gallery-strip {

	padding-top: 16px
}


.gallery-grid {

	display: grid;

	gap: 10px;

	grid-template-columns: 2fr 1fr 1fr;

	grid-auto-rows: 180px
}


.gallery-grid .item {

	position: relative;

	overflow: hidden;

	border-radius: 16px
}


.gallery-grid .item img {

	width: 100%;

	height: 100%;

	object-fit: cover;

	transition: transform .35s
}


.gallery-grid .item:hover img {

	transform: scale(1.05)
}


@media(max-width:992px) {

	.gallery-grid {

		grid-template-columns: 1fr 1fr;

		grid-auto-rows: 150px
	}

}


/* Main grid */

.main-grid {

	display: grid;

	grid-template-columns: 1.75fr .95fr;

	gap: 28px
}


.key-points li {

	display: flex;

	gap: 10px;

	padding: 8px 0;

	border-bottom: 1px dashed var(--line)
}


.key-points li:last-child {

	border-bottom: none
}


.pill {

	display: inline-flex;

	align-items: center;

	gap: 8px;

	border: 1px solid var(--line);

	color: var(--nav);

	padding: .5rem .8rem;

	border-radius: 999px;

	font-weight: 600
}


.divider {

	height: 1px;

	background: var(--line);

	margin: 16px 0
}


/* Sidebar price */

.price-card {

	position: sticky;

	top: 90px;

	border: 1px solid var(--line);

	border-radius: 18px;

	padding: 18px;

	background: #fff
}


.price {

	font-size: 1.8rem;

	font-weight: 800
}


.save {

	color: #0a6b4b;

	background: #e8fbf4;

	border-radius: 12px;

	padding: .25rem .5rem;

	font-weight: 700;

	font-size: .9rem;

	/* margin: 0px auto; */

	width: fit-content;

}


.cta-lg {
	background: #ffea1b;
	color: #000000;
	border: none;
	border-radius: 999px;
	padding: .9rem 1rem;
	width: 100%;
	font-weight: 700
}


.cta-lg:hover {

	opacity: .95
}


.trust {

	display: flex;

	gap: 12px;

	align-items: center;

	font-size: .9rem;

	color: #6b7b8f
}


/* Tabs (same classes) */

.nav-line .nav-link {

	border: none;

	border-bottom: 2px solid transparent;

	color: #6b7b8f;

	font-weight: 600
}


.nav-line .nav-link:hover {

	color: var(--o)
}


.nav-line .nav-link.active {

	color: var(--nav);

	border-bottom-color: var(--o)
}


/* Read more */

.h-clip {

	max-height: 190px;

	overflow: hidden;

	position: relative
}


.show-more {

	background: linear-gradient(180deg, rgba(255, 255, 255, 0), #fff);

	position: absolute;

	inset: auto 0 0 0;

	height: 70px
}


/* Visibility helpers */

.mobile-only {

	display: none
}


.desktop-only {

	display: block
}


@media(max-width:992px) {

	.main-grid {

		grid-template-columns: 1fr
	}


	.price-card {

		position: static
	}


	.desktop-only {

		display: none
	}


	.mobile-only {

		display: block
	}

}


/* --- MOBILE TABS (no jump, no wrap) --- */

@media (max-width: 992px) {


	/* make the <ul> a horizontal scroller without sticky to avoid jump */

	.tabs-mobile {

		display: flex !important;

		flex-wrap: nowrap !important;

		gap: 10px;

		overflow-x: auto;

		-webkit-overflow-scrolling: touch;

		scrollbar-width: none;

		padding: 6px 2px 8px 2px;

		/* compact and no full-bleed */

		background: #fff;

	}


	.tabs-mobile::-webkit-scrollbar {

		display: none
	}


	.tabs-mobile .nav-item {

		flex: 0 0 auto
	}


	.tabs-mobile .nav-link {

		white-space: nowrap;

		padding: .5rem .9rem;

		border: 1px solid var(--line);

		border-radius: 999px;

		font-weight: 600;

		line-height: 1.1;

	}


	/* keep underline style off on mobile for readability */

	.nav-line .nav-link {

		border-bottom: 0
	}


	.nav-line .nav-link.active {

		color: #fff !important;

		background: linear-gradient(90deg, var(--o), var(--b));

		border-color: transparent;

	}


	.tab-content {

		margin-top: 8px
	}

}

a.btn.sm.g i {

	color: #ffffff;

}

.btn-animetion:hover {

	color: var(--o);

}

.btn-animetion {
	border: 2px solid #f6d34a;
	/* orange border */
	border-radius: 30px;
	padding: 8px 20px;
	color: #fff;
	background: transparent;
	position: relative;
	animation: borderGlow 2s infinite;
}


/* Border glow effect */

@keyframes borderGlow {

	0% {
		box-shadow: 0 0 0px #fad049;
	}

	50% {
		box-shadow: 0 0 12px #deb126;
	}

	100% {

		box-shadow: 0 0 0px #ff5b2e;

	}

}


/* ==================================  Family Tour Packages ================================ */


/* uses your root variables */

.category-bubbles .card-wrap {

	/* max-width: 1040px; */
	/* center like your ref */

	margin: 0 auto;

	background: #fff;

	border-radius: var(--r, 16px);

	border: 1px solid var(--tile-b, #e8edf3);

	padding: 12px 16px;
	/* tighter inner space */

	box-shadow: 0 14px 40px rgba(15, 34, 56, .08);

}


/* reduce gaps vs previous */

.category-bubbles .bubbles-grid {
	--bs-gutter-x: 1rem;
}


/* bubble */

.bubble-link {
	color: var(--ht-ink, #0f2238);
}

.bubble-img {

	width: 62px;
	/* a bit smaller for tighter look */

	box-shadow: 0 2px 10px rgba(0, 0, 0, .08);

	transition: transform .25s ease, box-shadow .25s ease;

}

.bubble-link:hover .bubble-img {

	transform: translateY(-2px);

	box-shadow:

		0 6px 18px rgba(0, 0, 0, .16),

		0 0 0 2px var(--qx-orange, var(--o, #f25c10)) inset;

}


/* two-line clamp */

.text-truncate-2 {

	display: -webkit-box;

	-webkit-line-clamp: 2;

	-webkit-box-orient: vertical;

	overflow: hidden;

	max-width: 112px;

	color: var(--ht-ink, #0f2238);

}


/* mobile: keep card centered, make items scroll smoothly */

@media (max-width: 576px) {

	.category-bubbles .card-wrap {
		padding: 10px 12px;
	}

	.category-bubbles .bubbles-grid {

		flex-wrap: nowrap;

		overflow-x: auto;

		scrollbar-width: thin;

		scroll-snap-type: x mandatory;

	}

	.category-bubbles .bubbles-grid>.col {

		flex: 0 0 auto;

		scroll-snap-align: start;

	}

	.bubble-img {
		width: 58px;
	}

	.text-truncate-2 {
		max-width: 96px;
		font-size: 13px;
	}

}

section.py-4.category-bubbles {

	margin-top: -75px;

	z-index: 999;

	position: relative;

}


/* tooltip base */

.bubble-link {
	position: relative;
}


/* hidden by default */

.bubble-link::after {

	content: attr(data-full);

	position: absolute;

	left: 50%;

	bottom: calc(100% + 12px);

	transform: translate(-50%, 6px);

	opacity: 0;

	pointer-events: none;

	background: var(--nav);

	color: var(--ink);

	border-radius: calc(var(--r) - 6px);

	padding: 8px 10px;

	max-width: 100%;

	width: 150px;

	font-size: 13px;

	line-height: 1.25;

	box-shadow: 0 10px 28px rgba(0, 0, 0, .18);

	white-space: normal;

	text-align: center;

	transition: opacity .18s ease, transform .18s ease;

	z-index: 9;

}


/* small arrow */

.bubble-link::before {

	content: "";

	position: absolute;

	left: 50%;

	bottom: calc(100% + 6px);

	transform: translateX(-50%);

	border: 7px solid transparent;

	border-top-color: var(--nav);

	opacity: 0;

	transition: opacity .18s ease;

	z-index: 9;

}


/* show on hover or keyboard focus */

@media (hover:hover) {

	.bubble-link:hover::after,

	.bubble-link:hover::before {

		opacity: 1;

		transform: translate(-50%, 0);

	}

}

.bubble-link:focus-visible::after,

.bubble-link:focus-visible::before {

	opacity: 1;

	transform: translate(-50%, 0);

}


.info-spotlight .spot-shell {
	max-width: 1120px;
	position: relative
}

.info-spotlight .spot-card {

	position: relative;
	background: #fff;
	border: 1px solid var(--tile-b);

	border-radius: var(--r);
	padding: 20px 24px 20px 60px;
	box-shadow: 0 12px 36px rgba(15, 34, 56, .08)
}

.info-spotlight .spot-card::before {

	content: "";
	position: absolute;
	left: 18px;
	top: 18px;
	bottom: 18px;
	width: 8px;

	border-radius: 8px;
	background: linear-gradient(180deg, var(--qx-orange), var(--qx-orange2))
}

.spot-title {
	color: var(--ht-ink);
	font-weight: 700
}

.spot-desc {
	color: var(--ht-muted);
	text-align: justify;
}


/* link */

.spot-link {

	color: var(--qx-orange);
	font-weight: 600;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: .4rem;

	position: relative
}

.spot-link::after {

	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: -2px;
	height: 2px;
	background: currentColor;

	transform: scaleX(.3);
	transform-origin: left;
	transition: transform .25s ease, color .25s ease;
	opacity: .85
}

.spot-link:hover {
	color: var(--qx-orange2)
}

.spot-link:hover::after {
	transform: scaleX(1)
}


/* chevron rotate on open */

.spot-link .chev {
	transition: transform .25s ease
}

.spot-link[aria-expanded="true"] .chev {
	transform: rotate(180deg)
}


@media (max-width:576px) {

	.info-spotlight .spot-card {
		padding: 16px 16px 16px 52px
	}

	.info-spotlight .spot-card::before {
		left: 14px;
		top: 14px;
		bottom: 14px;
		width: 6px
	}

}


/*====================== contact css======================= */


header.hero .chip {

	color: #ffffff;

	/* background: #ffffff73; */

}

header.hero .chip:hover {

	color: #000;

}


/* Hero */

.hero {

	position: relative;
	color: #fff;
	text-align: center;
	overflow: hidden;

	background:

		radial-gradient(1200px 400px at 10% 100%, rgba(242, 92, 16, .15), transparent),

		radial-gradient(1000px 380px at 90% 0%, rgba(241, 91, 18, .18), transparent),

		linear-gradient(180deg, #0b2033 0%, #14324f 100%);

	padding: 96px 16px 72px;

}

.hero h1 {
	/* font-weight:800; */
	font-size: 44px;
	letter-spacing: .2px;
	margin: 0;
}

.hero p {
	opacity: .9;
	/* margin: 12px auto 0; */
	/* max-width: 996px; */
	/* font-size: 18px; */
}

.hero .badges {
	gap: 10px
}

.chip {

	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 12px;
	border-radius: 999px;

	background: rgba(255, 255, 255, .1);
	border: 1px solid rgba(233, 241, 255, .25);
	backdrop-filter: blur(6px);
	font-weight: 600;

}

.chip i {
	font-size: 18px
}


/* Cards + tiles */

.card-soft {

	background: #fff;
	border: 1px solid var(--tile-b);
	border-radius: calc(var(--r) + 4px);

	box-shadow: 0 8px 24px rgba(11, 32, 51, .06);

}

.tile {

	border: 1px dashed var(--tile-b);
	border-radius: var(--r);
	padding: 18px;
	height: 100%;

	transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;

	background: #fff;

}

.tile:hover {
	transform: translateY(-4px);
	border-color: var(--qx-orange);
	box-shadow: 0 10px 24px rgba(0, 0, 0, .06)
}

.tile i {
	font-size: 22px;
	color: var(--qx-orange);
}

.dsb.sa {
	width: 86%;
	height: 75px;
	flex-shrink: 0;
	background-color: rgb(255 255 255);
	position: absolute;
	z-index: 1;
	border-radius: 147%;
	transform: scale(1.1);
	top: 62px;
}

.vido-text {
	z-index: 6;
	position: relative;
}

/* Buttons */

.btn-gradient {

	background: linear-gradient(45deg, var(--qx-orange), var(--qx-orange2));

	color: #fff;
	border: none;
	border-radius: 12px;
	padding: 12px 22px;
	font-weight: 700;

	box-shadow: 0 10px 20px rgba(242, 92, 16, .25);

}

.btn-gradient:hover {
	/* opacity: .92; */
}

.btn-ghost {

	background: #fff;
	color: var(--nav);
	border: 1px solid var(--tile-b);
	border-radius: 12px;
	padding: 12px 22px;
	font-weight: 700;

}


/* Form */

.form-control {

	border: 1px solid var(--tile-b);
	border-radius: 14px;
	padding: 12px 14px;

}

.form-control:focus {

	border-color: var(--qx-orange);
	box-shadow: 0 0 0 .25rem rgba(242, 92, 16, .15);

}

.help {
	font-size: 13px;
	color: var(--ht-muted)
}

.required:after {
	content: "*";
	color: var(--qx-orange);
	margin-left: 4px
}


/* Info cards */

.info i {
	font-size: 28px;
	color: #252121;
}

.info h6 {
	margin: 8px 0 4px
}


/* Section titles */

.sect-title {
	/* font-weight:800; */
	letter-spacing: .2px
}


/* Map */

.map iframe {
	width: 100%;
	height: 420px;
	border: 0;
	border-radius: 16px
}


/* Wave divider */

.wave {
	display: block;
	height: 48px;
	background: linear-gradient(180deg, transparent 0, #fff 100%);
	margin-top: -48px
}


@media (max-width:575.98px) {

	.hero {
		padding: 80px 16px 64px
	}

	.hero h1 {
		font-size: 34px
	}

}


/* blog css======================= */


/* Chips */

.chip {

	display: inline-flex;

	align-items: center;

	gap: 8px;

	padding: ;

	border: 1px solid rgb(126 129 133 / 20%);

	nd: rgba(255, 255, 255, .1);

	color: #000000;

	border: 1px solid rgb(106 109 115 / 20%);

	border-radius: 999px;

	cursor: pointer;

	transition: .2s;

}

.chip.active,
.chip:hover {
	background: #fff;
	color: var(--nav);
	border-color: #fff
}


/* Cards */

.card-soft {
	background: #fff;
	border: 1px solid var(--tile-b);
	border-radius: calc(var(--r) + 4px);
	box-shadow: 0 8px 24px rgba(11, 32, 51, .06)
}

.post-card {
	overflow: hidden;
	transition: transform .25s, box-shadow .25s
}

.post-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 28px rgba(11, 32, 51, .10)
}

.post-thumb {
	aspect-ratio: 16/9;
	object-fit: cover;
	width: 100%
}

.meta {
	font-size: 13px;
	color: var(--ht-muted)
}

.tag-badge {
	font-size: 12px;
	padding: 4px 10px;
	background: #fff;
	border: 1px solid var(--tile-b);
	border-radius: 999px
}


/* Buttons */

.btn-gradient {
	background: #ffea1b;
	color: #000000 !important;
	border: none;
	border-radius: 12px;
	padding: 10px 18px;
	font-weight: 500;
	/* box-shadow: 0 10px 20px rgba(242, 92, 16, .25); */
}

.btn-ghost {
	background: #03a109;
	color: var(--nav);
	border: 1px solid var(--tile-b);
	border-radius: 12px;
	padding: 10px 18px;
	font-weight: 700
}


/* Sidebar */

.mini-thumb {
	width: 72px;
	height: 56px;
	object-fit: cover;
	border-radius: 12px;
	border: 1px solid var(--tile-b)
}


/* Pagination */

.pagination .page-link {
	border-radius: 12px;
	border: 1px solid var(--tile-b);
	color: var(--nav)
}

.pagination .active .page-link {
	background: linear-gradient(45deg, var(--qx-orange), var(--qx-orange2));
	border-color: transparent;
	color: #fff
}


@media (max-width:575.98px) {
	.hero {
		padding: 72px 16px 56px
	}
}


/* Make swiper slides behave like flex items so cards can stretch */

.pk-row-swiper .swiper-wrapper {

	display: flex !important;

	align-items: stretch;

}


/* ensure each slide takes full column height and is a flex column */

.pk-row-swiper .swiper-slide {

	display: flex !important;

	align-items: stretch;

	height: auto !important;


}


/* Card layout: column with footer pinned to bottom */

.pk-card {
	display: flex;
	flex-direction: column;
	width: 100%;
	height: 100%;
	border: 1px solid #040a5b;
	box-sizing: border-box;
}


/* Media area: keep aspect ratio and do not stretch body */

.pk-media {

	flex: 0 0 auto;

	width: 100%;

	overflow: hidden;

	border-top-left-radius: .6rem;

	border-top-right-radius: .6rem;

}


/* Force images to cover and uniform height */

.pk-media img {

	display: block;

	width: 100%;

	height: 180px;
	/* tweak height as needed */

	object-fit: cover;

	object-position: center;

}


/* Body will expand to fill remaining space */

.pk-body {

	flex: 1 1 auto;

	display: flex;

	flex-direction: column;


	box-sizing: border-box;

}


/* Small responsive tweaks */

@media (max-width: 991px) {

	.pk-media img {
		height: 160px;
	}

}

@media (max-width: 576px) {

	.pk-media img {
		height: 140px;
	}

}


.features-section {

	padding: 80px 0;

}


.features-heading {

	font-weight: 700;

	font-size: 28px;

	color: var(--nav);

	margin-bottom: 50px;

	text-align: center;

}


.feature-card {

	background: rgba(255, 255, 255, 0.75);

	backdrop-filter: blur(12px);

	border-radius: 20px;

	padding: 24px 18px;

	text-align: center;

	transition: all 0.35s ease;

	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);

}


.feature-card:hover {

	transform: translateY(-8px);

	box-shadow: 0 14px 28px rgba(0, 0, 0, 0.12);

}


.feature-icon-wrap {
	width: 70px;
	height: 70px;
	margin: 0 auto 16px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(135deg, #040a5b, #040a5b);
	color: #fff;
	font-size: 28px;
	box-shadow: 0 6px 16px rgba(242, 92, 16, 0.4);
}


.feature-title {

	font-size: 16px;

	font-weight: 700;

	color: var(--nav);

	margin-bottom: 8px;

}


.feature-desc {

	font-size: 14px;

	color: var(--ht-muted);

	line-height: 1.5;

}


/* ---------- BLOG CONTENT ---------- */
.blog-wrapper {
	max-width: 1100px;
	background: #fff;
	margin: -80px auto 60px;
	border-radius: 16px;
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08);
	border: 1px solid var(--ht-line);
	padding: 40px 30px;
}

.blog-wrapper h2 {
	font-family: "Merriweather", serif;
	font-size: 22px;
	font-weight: 700;
	margin-top: 28px;
	color: var(--ht-ink);
}

.blog-wrapper p {
	color: var(--ht-muted);
	line-height: 1.8;
	margin-bottom: 14px;
	font-size: 16px;
}

.blog-meta {
	font-size: 14px;
	color: var(--ht-muted);
	margin-bottom: 20px;
}

.tag-list {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 24px;
}

.tag-list .btn.sm {
	padding: 6px 10px;
	font-size: 13px;
	border-radius: 10px;
}

/* ---------- CTA ---------- */


.main_banner {
	z-index: -3 !important;

}

section.why-tiles.py-5 {
	background: #040a5b;
}

.m

/* ---------- RESPONSIVE ---------- */
@media (max-width: 768px) {
	.blog-wrapper {
		margin: -60px 16px 40px;
		padding: 24px 20px;
	}


	.cta {
		flex-direction: column;
		align-items: stretch;
	}

	.cta input {
		width: 100%;
	}

	.hero-section {
		min-height: 400px;
	}

	.hero-content h1 {
		font-size: 28px;
	}

	
}

span.mk6-icon img {
	width: 54px;
	filter: brightness(0.5);
}

.spes {
	padding: 60px 0px 0px;
}

section.why-tiles.spes {
	background: #ebebea;
	padding-bottom: 69px;
}


.spas-b {
	padding-bottom: 80px;
}


.review-section {
	background: #fff;
	color: #222;
}

.section-head h3 {
	font-family: Arapey, serif;
	font-size: 24px;
}

.review-card {
	background: #f9f9fb;
	border-radius: 12px;
	padding: 18px;
	min-height: 150px;
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.06);
}

.r-avatar {
	width: 56px;
	height: 56px;
	border-radius: 50%;
	object-fit: cover;
	border: 2px solid #fff;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.06);
}

.r-text {
	margin-top: 12px;
	color: #444;
	line-height: 1.6;
}

.stars {
	color: #f5b301;
	font-weight: 700;
	letter-spacing: 1px;
}

.reviews-wrap {
	position: relative;
}

.btn-nav {
	position: absolute;
	top: 65%;
	transform: translateY(-50%);
	z-index: 10;
	width: 44px;
	height: 44px;
	border-radius: 8px;
	background: #fff;
	border: 1px solid #eee;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 6px 16px rgba(0, 0, 0, 0.06);
}

.review-prev {
	left: -12px;
}

.review-next {
	right: -12px;
}

@media (max-width: 768px) {

	.review-prev,
	.review-next {
		display: none;
	}

	p.r-text {
		text-align: justify !important;
	}

}


/* video section css */


.reel-main {
	position: relative;
	max-width: 1280px;
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 15px;
	padding: 40px 0;
}

.dsb {
	width: 100%;
	height: 100px;
	flex-shrink: 0;
	background-color: rgb(255, 255, 255);
	position: absolute;
	z-index: 1;
	border-radius: 100% / 109%;
	/* transform: scale(1.1); */
	top: 454px;
}

.reel-container {
	width: 90%;
	overflow: hidden;
}

.reel-track {
	display: flex;
	gap: 24px;
	transition: transform 0.45s ease;
}

.reel-card {
	min-width: 260px;
	max-width: 260px;
	height: 430px;
	border-radius: 26px;
	overflow: hidden;
	background: #000;
	box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
}

.reel-card video {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: bottom center;
	cursor: pointer;
}

.nav-btn {
	width: 44px;
	height: 44px;
	border: none;
	border-radius: 50%;
	background: #ffffff;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
	cursor: pointer;
	font-size: 22px;
}

.nav-btn:hover {
	transform: scale(1.08);
}

/* Modal styling */
.reel-modal {
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, 0.85);
	display: none;
	align-items: center;
	justify-content: center;
	z-index: 9999;
}

.reel-modal-inner {
	position: relative;
	width: 90%;
	max-width: 450px;
}

.reel-modal-inner video {
	width: 100%;
	border-radius: 12px;
}

.reel-close {
	position: absolute;
	top: -35px;
	right: 0;
	background: transparent;
	border: none;
	font-size: 34px;
	color: #fff;
	cursor: pointer;
}


/* video section css end */


.white {
	color: white;
}

button.pk-btn.pk-btn-ghost.btn.btn-outline-dark i {
	color: #105d09;
}

.btn-outline-dark:hover {
	color: #fff;
	background-color: #fbd04d !important;
	border-color: #212529;
}

button.pk-btn.pk-btn-ghost:hover {
	background: #fbd04d;
}

button.pk-btn.pk-btn-ghost svg {
	color: #0faa00;
}

.g-m img {
	width: 80px;
}

.r-head {
	/* justify-content: space-between; */
}


/* Scoped dropdown fixes: removes duplicate arrow, prevents hover gap/shift */
.dropdown-menu-box {
	position: relative;
	display: inline-block;
}

/* Remove browser arrows */
.dropdown-toggle {
	position: relative;
	padding-right: 14px;
	/* space for arrow */
}

/* Perfect chevron arrow like screenshot */
.dropdown-toggle::after {
	content: "";
	position: absolute;
	right: -8px;
	top: 68%;
	width: 11px;
	height: 13px;
	/* border-right: 2px solid currentColor; */
	/* border-bottom: 2px solid currentColor; */
	transform: translateY(-60%) rotate(358deg);
	/* display: inline-block; */
	pointer-events: none;
}

/* dropdown panel: absolute so it never affects header height */
.dropdown-box {
	position: absolute;
	top: calc(100% - 4px);
	left: 0;
	min-width: 220px;
	padding: 6px 0;
	border-radius: 10px;
	background: linear-gradient(#040a5b, #040a5b);
	box-shadow: 0 8px 26px rgba(0, 0, 0, 0.22);
	z-index: 9999;
	visibility: hidden;
	opacity: 0;
	transform: translateY(-6px) scale(0.98);
	transition: opacity 160ms ease, transform 160ms ease, visibility 0ms linear 160ms;
	pointer-events: none;
}

/* items */
.dropdown-box a {
	display: block;
	padding: 10px 14px;
	color: inherit;
	text-decoration: none;
	font-weight: 600;
}

.dropdown-box a:hover {
	background: rgb(255 234 27);
	border-radius: 6px;
	color: #000000 !important;
}

/* show on hover / keyboard focus (desktop) */
@media (hover: hover) and (pointer: fine) {

	.dropdown-menu-box:hover .dropdown-box,
	.dropdown-menu-box:focus-within .dropdown-box {
		visibility: visible;
		opacity: 1;
		transform: translateY(0) scale(1);
		pointer-events: auto;
		transition-delay: 0ms;
	}
}

/* JS-open fallback class */
.dropdown-menu-box.open .dropdown-box {
	visibility: visible;
	opacity: 1;
	transform: translateY(0) scale(1);
	pointer-events: auto;
}


/* second-level box */
.inner-box {
	position: absolute;
	top: 0;
	left: 100%;
	min-width: 180px;
	background: #040a5b;
	border-radius: 8px;
	padding: 6px 0;
	box-shadow: 0 8px 22px rgba(0, 0, 0, 0.2);
	visibility: hidden;
	opacity: 0;
	transform: translateX(-10px);
	transition: 0.18s ease;
	pointer-events: none;
	z-index: 999999;
}


/* inner-box link style */
.inner-box a {
	display: block;
	padding: 10px 14px;
	text-decoration: none;
	color: #000;
	font-weight: 500;
}


/* room page  */
span.pk-chip-room {
	display: flex;
	gap: 8px;
}

.inner-box a {
	color: white;
}

span.pk-chip-room {
	background: #fffaca;
	padding: 1px 10px 2px 10px;
	border-radius: 10px;
}

ul.room-list li i {
	color: #ffc31b;
	font-size: 29px;
	margin-right: 11px;
}

button.pk-btn.w {
	background: #47e306;
	color: white !important;
}

p.reviw {
    padding: 0;
    margin: 0;
    font-size: 11px;
    font-style: oblique;
}