/* ============================================================
   style.css — Nanda View Resort
   ============================================================ */

/* ============================================================
  01. CSS VARIABLES
  ============================================================ */
:root {
	--primary: #043329;
	--primary2: #065240;
	--gold: #e8c97a;
	--gold2: #f5dfa0;
	--gold3: #fceec6;
	--deep: #021f17;
	--forest: #032a20;
	--mid: #054233;
	--panel: #0a5240;
	--cream: #ffffff;
	--mist: #ffffff;
	--faint: rgba(245, 237, 216, .28);
	--border: rgba(232, 201, 122, .18);
	--borderhov: rgba(232, 201, 122, .5);
}

/* ============================================================
  02. RESET & BASE
  ============================================================ */
*,
*::before,
*::after {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}

html {
	scroll-behavior: smooth;
}

body {
	font-family: 'Montserrat', sans-serif;
	color: var(--cream);
	overflow-x: hidden;
}

h1,
h2,
h3,
h4,
h5 {
	font-family: 'Ubuntu', sans-serif;
}

::-webkit-scrollbar {
	width: 5px;
}

::-webkit-scrollbar-track {
	background: var(--deep);
}

::-webkit-scrollbar-thumb {
	background: var(--gold);
	border-radius: 2px;
}

/* ============================================================
  03. NAVBAR
  ============================================================ */
nav,
nav#navbar {
	background: transparent;
	box-shadow: none;
}

#site-header {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	z-index: 200;
	background: transparent;
}

#site-header.is-fixed {
	position: fixed;
}

#navbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 80px;
	padding: 0 2.5rem;
	background: rgba(8, 18, 14, .72);
}

#navbar.scrolled {
	background: rgb(2 31 23);
	border-bottom: 1px solid rgba(201, 168, 76, .2);
	box-shadow: 0 2px 28px rgba(0, 0, 0, .55);
	height: 8vh;
}

.nav-logo {
	display: flex;
	align-items: center;
	flex-shrink: 0;
	text-decoration: none;
	position: static;
}

.nav-logo img {
	position: absolute !important;
	top: 10% !important;
	width: auto !important;
	height: 80px;
	display: block;
	object-fit: contain;
	filter: drop-shadow(0 2px 8px rgba(0, 0, 0, .5));
}

.nav-links {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	display: flex;
	align-items: center;
	gap: 2.4rem;
}

.nav-links>a,
.nav-dropdown-trigger {
	font-family: 'Montserrat', sans-serif;
	font-size: .68rem;
	font-weight: 600;
	letter-spacing: .22em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .88);
	text-decoration: none;
	position: relative;
	transition: color .25s;
	background: none;
	border: none;
	cursor: pointer;
	padding: 0;
	display: flex;
	align-items: center;
	gap: .3rem;
}

.nav-links>a::after,
.nav-dropdown-trigger::after {
	content: '';
	position: absolute;
	bottom: -4px;
	left: 0;
	right: 0;
	height: 1px;
	background: var(--gold);
	transform: scaleX(0);
	transform-origin: center;
	transition: transform .3s ease;
}

.nav-links>a:hover,
.nav-dropdown-trigger:hover {
	color: var(--gold2);
}

.nav-links>a:hover::after,
.nav-dropdown-trigger:hover::after {
	transform: scaleX(1);
}

.nav-drop-arrow {
	width: 11px;
	height: 11px;
	stroke: currentColor;
	fill: none;
	stroke-width: 2.5;
	transition: transform .3s;
}

.nav-dropdown:hover .nav-drop-arrow {
	transform: rotate(180deg);
}

.nav-cta {
	display: flex;
	align-items: center;
	gap: .5rem;
	background: var(--gold);
	color: #1a0900;
	font-family: 'Montserrat', sans-serif;
	font-size: .63rem;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	padding: .6rem 1.3rem;
	border-radius: 3px;
	text-decoration: none;
	white-space: nowrap;
	flex-shrink: 0;
	box-shadow: 0 2px 14px rgba(201, 168, 76, .4);
	transition: background .25s, transform .2s;
}

.nav-cta:hover {
	background: var(--gold2);
	transform: translateY(-1px);
}

.nav-cta svg {
	width: 12px;
	height: 12px;
	stroke: currentColor;
	fill: none;
	stroke-width: 2.5;
}

#hamburger {
	display: none;
    background: #bb8f4685;
    border: 1px solid rgb(201 168 76);
    padding: .4rem .6rem;
    border-radius: 2px;
    cursor: pointer;
    flex-shrink: 0;
    z-index: 310;
    position: relative;
}

#hamburger svg {
	display: block;
	width: 20px;
	height: 14px;
	stroke: var(--gold);
	fill: none;
	stroke-width: 2;
	stroke-linecap: round;
	transition: opacity .2s;
}

#drawerOverlay {
	display: none;
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, .55);
	z-index: 290;
	backdrop-filter: blur(2px);
	-webkit-backdrop-filter: blur(2px);
	opacity: 0;
	transition: opacity .3s ease;
}

#drawerOverlay.open {
	display: block;
	opacity: 1;
}

#mobileNav {
	position: fixed;
    top: 0;
    right: 0;
    width: 350px;
    max-width: 85vw;
    height: 100%;
    background: #0b3c2d;
    z-index: 300;
    display: flex;
    flex-direction: column;
    transform: translateX(100%);
    transition: transform .32s cubic-bezier(.4, 0, .2, 1);
    overflow-y: auto;
    overflow-x: hidden;
}

#mobileNav.open {
	transform: translateX(0);
}

.drawer-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 1.1rem 1.3rem;
	border-bottom: 1px solid rgba(201, 168, 76, .12);
	flex-shrink: 0;
}

.drawer-logo {
	font-family: 'Ubuntu', sans-serif;
	font-size: .82rem;
	font-weight: 700;
	color: var(--cream);
	letter-spacing: .04em;
}

.drawer-logo span {
	color: var(--gold);
}

#drawerClose {
	background: none;
	border: 1px solid rgba(201, 168, 76, .25);
	width: 32px;
	height: 32px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	flex-shrink: 0;
	transition: border-color .2s, background .2s, transform .2s;
}

#drawerClose:hover {
	border-color: var(--gold);
	background: rgba(201, 168, 76, .1);
	transform: rotate(90deg);
}

#drawerClose svg {
	width: 14px;
	height: 14px;
	stroke: var(--gold);
	fill: none;
	stroke-width: 2.5;
}

.drawer-links {
	display: flex;
	flex-direction: column;
	padding: 1rem 0;
	flex: 1;
}

.drawer-links>a {
	display: flex;
	align-items: center;
	gap: .75rem;
	padding: .9rem 1.4rem;
	font-family: 'Montserrat', sans-serif;
	font-size: .72rem;
	font-weight: 600;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .75);
	text-decoration: none;
	border-bottom: 1px solid rgba(201, 168, 76, .06);
	transition: color .2s, background .2s, padding-left .2s;
	position: relative;
}

.drawer-links>a::before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	width: 2px;
	background: var(--gold);
	transform: scaleY(0);
	transition: transform .25s ease;
}

.drawer-links>a:hover {
	color: var(--gold);
	background: rgba(201, 168, 76, .05);
	padding-left: 1.7rem;
}

.drawer-links>a:hover::before {
	transform: scaleY(1);
}

.drawer-cta {
	padding: 1.2rem 1.3rem;
	border-top: 1px solid rgba(201, 168, 76, .12);
	flex-shrink: 0;
}

.drawer-call {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .6rem;
	background: var(--gold);
	color: #1a0900;
	font-family: 'Montserrat', sans-serif;
	font-size: .65rem;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	padding: .85rem 1rem;
	border-radius: 3px;
	text-decoration: none;
	width: 100%;
	transition: background .22s;
}

.drawer-call:hover {
	background: var(--gold2);
}

.drawer-call svg {
	width: 13px;
	height: 13px;
	stroke: currentColor;
	fill: none;
	stroke-width: 2.5;
}

/* ============================================================
  04. NAVBAR DROPDOWN
  ============================================================ */
.nav-dropdown {
	position: relative;
}

.nav-dropdown-menu {
	position: absolute;
	top: calc(100% + 6px);
	left: 50%;
	transform: translateX(-50%) translateY(-6px);
	width: 260px;
	background: #021f17;
	border: 1px solid rgba(232, 201, 122, .2);
	border-radius: 8px;
	box-shadow: 0 20px 60px rgba(0, 0, 0, .55);
	padding: .5rem 0;
	opacity: 0;
	pointer-events: none;
	transition: opacity .25s ease, transform .25s ease;
	z-index: 500;
}

.nav-dropdown-menu::before {
	content: '';
	position: absolute;
	top: -6px;
	left: 50%;
	transform: translateX(-50%) rotate(45deg);
	width: 10px;
	height: 10px;
	background: #021f17;
	border-left: 1px solid rgba(232, 201, 122, .2);
	border-top: 1px solid rgba(232, 201, 122, .2);
}

.nav-dropdown:hover .nav-dropdown-menu {
	opacity: 1;
	pointer-events: all;
	transform: translateX(-50%) translateY(0);
}

.nav-dropdown-menu a {
	display: flex;
	align-items: center;
	gap: .75rem;
	padding: .72rem 1.2rem;
	text-decoration: none;
	transition: background .2s, padding-left .2s;
	border-bottom: 1px solid rgba(232, 201, 122, .06);
}

.nav-dropdown-menu a:last-child {
	border-bottom: none;
}

.nav-dropdown-menu a:hover {
	background: rgba(232, 201, 122, .06);
	padding-left: 1.5rem;
}

.ndm-icon {
	width: 32px;
	height: 32px;
	flex-shrink: 0;
	background: rgba(232, 201, 122, .1);
	border: 1px solid rgba(232, 201, 122, .2);
	border-radius: 6px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.ndm-icon svg {
	width: 14px;
	height: 14px;
	stroke: var(--gold);
	fill: none;
	stroke-width: 1.8;
}

.ndm-text {
	display: flex;
	flex-direction: column;
	gap: .1rem;
}

.ndm-text strong {
	font-family: 'Montserrat', sans-serif;
	font-size: .72rem;
	font-weight: 700;
	color: var(--cream);
	letter-spacing: .04em;
}

.ndm-text small {
	font-family: 'Montserrat', sans-serif;
	font-size: .58rem;
	font-weight: 500;
	color: rgba(232, 201, 122, .55);
	letter-spacing: .06em;
}

.drawer-accordion {
	border-bottom: 1px solid rgba(201, 168, 76, .06);
}

.drawer-accordion-trigger {
	width: 100%;
	background: none;
	border: none;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: .9rem 1.4rem;
	font-family: 'Montserrat', sans-serif;
	font-size: .72rem;
	font-weight: 600;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .75);
	cursor: pointer;
	transition: color .2s, background .2s;
}

.drawer-accordion-trigger:hover {
	color: var(--gold);
	background: rgba(201, 168, 76, .05);
}

.drawer-acc-arrow {
	width: 13px;
	height: 13px;
	stroke: currentColor;
	fill: none;
	stroke-width: 2.5;
	transition: transform .3s;
	flex-shrink: 0;
}

.drawer-accordion.open .drawer-acc-arrow {
	transform: rotate(180deg);
}

.drawer-accordion.open .drawer-accordion-trigger {
	color: var(--gold);
}

.drawer-accordion-panel {
	max-height: 0;
	overflow: hidden;
	transition: max-height .35s cubic-bezier(.4, 0, .2, 1);
	background: rgba(0, 0, 0, .2);
}

.drawer-accordion.open .drawer-accordion-panel {
	max-height: 300px;
}

.drawer-sub-link {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: .7rem 1.4rem .7rem 2rem;
	font-family: 'Montserrat', sans-serif;
	font-size: .66rem;
	font-weight: 600;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .6);
	text-decoration: none;
	border-bottom: 1px solid rgba(201, 168, 76, .04);
	transition: color .2s, background .2s;
}

.drawer-sub-link:hover {
	color: var(--gold);
	background: rgba(201, 168, 76, .05);
}

.drawer-sub-link small {
	font-size: .55rem;
	font-weight: 500;
	color: rgba(232, 201, 122, .45);
	letter-spacing: .04em;
	font-style: normal;
}

/* ============================================================
  05. HERO
  ============================================================ */
.hero {
	position: relative;
	height: 100vh;
	min-height: 620px;
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

.slides {
	position: absolute;
	inset: 0;
	z-index: 0;
}

.slide {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	opacity: 0;
	transition: opacity 1.6s cubic-bezier(.4, 0, .2, 1);
	transform: scale(1.04);
}

.slide.active {
	opacity: 1;
	animation: sliderZoom 9s ease-out forwards;
}

@keyframes sliderZoom {
	from {
		transform: scale(1.04);
	}

	to {
		transform: scale(1.00);
	}
}

.slide-1 {
	background-image: url('../images/caro-1.avif');
}

.slide-2 {
	background-image: url('../images/caro-2.avif');
}

.slide-3 {
	background-image: url('../images/caro-3.avif');
}

.slide-overlay {
	position: absolute;
	inset: 0;
	z-index: 1;
	background: #00000075;
}

.hero-body {
	position: relative;
	z-index: 10;
	flex: 1;
	display: grid;
	grid-template-columns: 1fr 385px;
	gap: 2rem;
	align-items: center;
	width: 100%;
	max-width: 1280px;
	margin: 0 auto;
	padding: 120px 2.5rem 2rem;
	box-sizing: border-box;
}

.hero-left {
	display: flex;
	flex-direction: column;
	gap: 0;
	min-width: 0;
	overflow: hidden;
}

.hero-h1 {
	font-family: 'Ubuntu', sans-serif;
	font-size: clamp(2.2rem, 3.8vw, 3.6rem);
	font-weight: 700;
	line-height: 1.06;
	letter-spacing: -.02em;
	color: #ffeec0;
	min-height: 2.2em;
}

.typed-cursor {
	display: inline-block;
	width: 3px;
	height: .8em;
	background: var(--gold);
	margin-left: 4px;
	vertical-align: middle;
	animation: blink .7s step-end infinite;
}

@keyframes blink {

	0%,
	100% {
		opacity: 1;
	}

	50% {
		opacity: 0;
	}
}

.hero-desc {
	font-family: 'Montserrat', sans-serif;
	font-size: .84rem;
	line-height: 1.8;
	color: #fff;
	margin-top: 1rem;
	max-width: 520px;
	padding-left: 1rem;
	border-left: 2px solid rgb(255 225 155);
}

.hero-rule {
	width: 44px;
	height: 1px;
	background: linear-gradient(90deg, var(--gold), transparent);
	margin-top: 1.4rem;
	flex-shrink: 0;
}

.hero-stats-row {
	display: flex;
	align-items: center;
	margin-top: 1.4rem;
	background: rgb(2 14 10 / 20%);
	border-radius: 6px;
	overflow: hidden;
	max-width: 790px;
	flex-shrink: 0;
}

.hstat {
	flex: 1;
	text-align: center;
	padding: .9rem .6rem;
	transition: background .3s;
	position: relative;
}

.hstat:hover {
	background: rgba(201, 168, 76, .07);
}

.hstat::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 2px;
	background: var(--gold);
	transform: scaleX(0);
	transition: transform .35s ease;
}

.hstat:hover::before {
	transform: scaleX(1);
}

.hstat-div {
	width: 1px;
	height: 36px;
	background: rgba(201, 168, 76, .14);
	flex-shrink: 0;
}

.hstat-num {
	font-family: 'Ubuntu', sans-serif;
	font-size: 1.35rem;
	font-weight: 700;
	color: var(--gold);
	line-height: 1;
}

.hstat-lbl {
	font-family: 'Montserrat', sans-serif;
	font-size: .48rem;
	font-weight: 600;
	letter-spacing: .15em;
	text-transform: uppercase;
	color: #fff;
	margin-top: .25rem;
}

/* ============================================================
  06. HERO REVIEW MARQUEE
  ============================================================ */
.hero-marquee-wrap {
	margin-top: 1.4rem;
	overflow: hidden;
	position: relative;
	flex-shrink: 0;
}

.hero-marquee-wrap::before,
.hero-marquee-wrap::after {
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	width: 60px;
	z-index: 2;
	pointer-events: none;
}

.hero-marquee-wrap::before {
	left: 0;
	background: linear-gradient(to right, rgba(2, 14, 10, .88), transparent);
}

.hero-marquee-wrap::after {
	right: 0;
	background: linear-gradient(to left, rgba(2, 14, 10, .88), transparent);
}

.hero-marquee-track {
	display: flex;
	gap: .85rem;
	width: max-content;
	animation: marqueeScroll 44s linear infinite;
	padding: 4px 2px;
}

.hero-marquee-track:hover {
	animation-play-state: paused;
}

@keyframes marqueeScroll {
	from {
		transform: translateX(0);
	}

	to {
		transform: translateX(-50%);
	}
}

.mrq-card {
	width: 240px;
	flex-shrink: 0;
	display: flex;
	flex-direction: column;
	padding: .7rem .85rem .65rem;
	background: rgba(4, 5, 7, .53);
	border: 1px solid rgba(232, 201, 122, .12);
	border-radius: 10px;
	position: relative;
	overflow: hidden;
	box-shadow: 0 4px 16px rgba(0, 0, 0, .25);
	transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}

.mrq-card::before {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	width: 38px;
	height: 38px;
	background: var(--gold);
	clip-path: polygon(100% 0, 0 0, 100% 100%);
	border-radius: 0 10px 0 0;
}

.mrq-card::after {
	content: '\201C';
	position: absolute;
	top: .1rem;
	left: .7rem;
	font-size: 2.4rem;
	font-family: 'Ubuntu', sans-serif;
	font-weight: 700;
	color: var(--gold);
	line-height: 1;
	opacity: .35;
}

.mrq-card:hover {
	transform: translateY(-3px);
	border-color: rgba(232, 201, 122, .32);
	box-shadow: 0 10px 30px rgba(0, 0, 0, .4);
}

.mrq-text {
	font-family: 'Montserrat', sans-serif;
	font-size: .66rem;
	font-weight: 400;
	font-style: italic;
	color: rgba(255, 255, 255, .88);
	line-height: 1.58;
	padding-left: 1.2rem;
	margin-bottom: .3rem;
}

.mrq-meta {
	display: flex;
	align-items: center;
	gap: .5rem;
	padding-top: .32rem;
	border-top: 1px solid rgba(255, 255, 255, .1);
}

.mrq-av {
	width: 24px;
	height: 24px;
	border-radius: 50%;
	flex-shrink: 0;
	background: linear-gradient(135deg, var(--gold), #8a6010);
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: 'Ubuntu', sans-serif;
	font-size: .58rem;
	font-weight: 700;
	color: #1a0900;
	border: 1.5px solid rgba(232, 201, 122, .5);
}

.mrq-name {
	font-family: 'Montserrat', sans-serif;
	font-size: .54rem;
	font-weight: 700;
	color: var(--gold2);
	text-transform: uppercase;
	letter-spacing: .06em;
	flex: 1;
}

.mrq-stars-badge {
	display: flex;
	align-items: center;
	background: rgba(232, 201, 122, .12);
	border: 1px solid rgba(232, 201, 122, .28);
	border-radius: 20px;
	padding: .18rem .5rem;
	flex-shrink: 0;
}

.mrq-stars-badge span {
	color: var(--gold);
	font-size: .48rem;
	letter-spacing: .04em;
	line-height: 1;
}

.mrq-body {
	display: contents;
}

@media (max-width: 900px) {
	.hero-marquee-wrap {
		display: none;
	}
}

/* ============================================================
  07. HERO BOOKING FORM CARD
  ============================================================ */
.hero-form-card {
	position: relative;
	z-index: 15;
	display: flex;
	flex-direction: column;
	border-radius: 10px;
	overflow: hidden;
	max-height: calc(100vh - 80px);
	overflow-y: auto;
	scrollbar-width: none;
	background: #000000ed;
}

.hero-form-card::-webkit-scrollbar {
	display: none;
}

.fcard-head {
	position: relative;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 1.9rem 1.3rem;
	background: rgba(0, 0, 0, .22);
	border-bottom: 1px solid rgba(201, 168, 76, .12);
	gap: .8rem;
}

.fcard-head h3 {
	font-family: 'Ubuntu', sans-serif;
	font-size: .98rem;
	font-weight: 600;
	color: #fff;
	line-height: 1.2;
}

.fcard-badge {
	flex-shrink: 0;
	font-family: 'Montserrat', sans-serif;
	font-size: .5rem;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: #1a0900;
	background: linear-gradient(135deg, var(--gold), var(--gold2));
	padding: .28rem .75rem;
	border-radius: 100px;
	box-shadow: 0 2px 10px rgba(201, 168, 76, .35);
	white-space: nowrap;
}

.fcard-body {
	position: relative;
	z-index: 2;
	padding: .85rem 1.3rem 1.1rem;
}

.fgrid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: .45rem;
}

.fg {
	display: flex;
	flex-direction: column;
}

.fg-full {
	grid-column: 1 / -1;
}

.fl {
	font-family: 'Montserrat', sans-serif;
	font-size: .48rem;
	font-weight: 700;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: rgb(235 207 132);
	display: flex;
	align-items: center;
	gap: .25rem;
	margin-bottom: .2rem;
}

.fl svg {
	width: 9px;
	height: 9px;
	stroke: currentColor;
	fill: none;
	stroke-width: 2;
}

.fi {
	background: rgba(255, 255, 255, .07);
	border: 1px solid rgba(232, 201, 122, 0);
	border-radius: 0;
	color: #8b8b8b;
	padding: 10px .7rem;
	font-family: 'Montserrat', sans-serif;
	font-size: 10px;
	text-transform: uppercase;
	letter-spacing: 1px;
	width: 100%;
	outline: none;
	appearance: none;
	-webkit-appearance: none;
	font-weight: 600;
}

.fi::placeholder {
	color: #8b8b8b;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-size: 10px;
}

.fi:focus {
	border-color: rgba(201, 168, 76, .6);
	background: rgba(201, 168, 76, .08);
	box-shadow: 0 0 0 3px rgba(201, 168, 76, .1);
}

.fi option {
	background: #171617;
}

.fi[type="date"]::-webkit-calendar-picker-indicator {
	filter: invert(70%) sepia(60%) saturate(500%) hue-rotate(5deg);
	cursor: pointer;
}

.fi-select-wrap {
	position: relative;
	display: flex;
	align-items: center;
}

.fi-select-wrap .fi {
	padding-right: 2rem;
}

.fi-select-arrow {
	position: absolute;
	right: .55rem;
	top: 50%;
	transform: translateY(-50%);
	width: 12px;
	height: 12px;
	stroke: var(--gold);
	fill: none;
	stroke-width: 2.5;
	pointer-events: none;
	flex-shrink: 0;
}

.fcard-btn {
	width: 100%;
	margin-top: .65rem;
	padding: .8rem;
	background: linear-gradient(135deg, var(--gold), var(--gold2));
	color: var(--primary);
	font-family: 'Montserrat', sans-serif;
	font-size: .62rem;
	font-weight: 700;
	letter-spacing: .18em;
	text-transform: uppercase;
	border: none;
	border-radius: 4px;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .4rem;
	box-shadow: 0 4px 20px rgba(201, 168, 76, .4);
	transition: opacity .2s, transform .2s;
}

.fcard-btn:hover {
	opacity: .9;
	transform: translateY(-2px);
}

.hero-form-mobile {
	display: none;
	background: #000000ed;
	border-radius: 10px;
	overflow: hidden;
	margin: 0 1rem;
	position: relative;
	z-index: 5;
	margin-top: -60px;
}

/* ============================================================
  08. SHARED SECTION UTILITIES
  ============================================================ */
.sec {
	padding: 6rem 1.5rem;
}

.slbl {
	font-family: 'Montserrat', sans-serif;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: #ac6c00;
	text-align: center;
	margin-bottom: .6rem;
}

.stit {
	font-family: 'Ubuntu', sans-serif;
	font-size: clamp(2rem, 3.5vw, 3rem);
	font-weight: 700;
	text-align: center;
	color: #043329;
	line-height: 1.15;
}

.it {
	font-family: 'Ubuntu', sans-serif;
	font-size: clamp(2rem, 3.5vw, 3rem);
	font-weight: 700;
	text-align: center;
	color: var(--gold2);
	line-height: 1.15;
}

.sorn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1rem;
	margin: 1.2rem auto 0;
	max-width: 280px;
}

.sorn::before,
.sorn::after {
	content: '';
	flex: 1;
	height: 1px;
	background: linear-gradient(90deg, transparent, rgb(207 168 102), transparent);
}

.diam {
	width: 7px;
	height: 7px;
	background: #e8c97a;
	transform: rotate(45deg);
	flex-shrink: 0;
}

/* ============================================================
  09. ROOMS
  ============================================================ */
.rooms-sec {
	background: #f8f5ee;
}

.rooms-wrap {
	margin: 3.5rem auto 0;
	padding: 0 1.5rem;
}

.room-cards {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 6px;
	border: none;
	border-radius: 0;
	overflow: visible;
}

.rcard {
	display: flex;
	flex-direction: column;
	background: var(--forest);
	overflow: hidden;
	transition: transform .35s cubic-bezier(.34, 1.56, .64, 1), box-shadow .35s, border-color .35s, background .3s;
	position: relative;
}

.rcard::before {
	content: '';
	position: absolute;
	top: 0;
	left: 2rem;
	right: 2rem;
	height: 2px;
	background: linear-gradient(90deg, transparent, var(--gold), transparent);
	opacity: 0;
	transition: opacity .35s;
	z-index: 3;
}

.rcard:hover::before {
	opacity: 1;
}

.rcard:hover {
	background: #021c14;
	transform: translateY(-7px);
	box-shadow: 0 8px 24px rgba(0, 0, 0, .2), 0 24px 60px rgba(0, 0, 0, .35), 0 0 0 1px rgba(232, 201, 122, .25);
	border-color: rgba(232, 201, 122, .4);
}

.rcard-img {
	position: relative;
	height: 200px;
	overflow: hidden;
	flex-shrink: 0;
}

.rcard-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	filter: brightness(.75);
	transition: transform .8s cubic-bezier(.4, 0, .2, 1), filter .5s;
}

.rcard:hover .rcard-img img {
	transform: scale(1.07);
	filter: brightness(.55);
}

.rcard-img-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(2, 14, 10, .9) 0%, rgba(2, 14, 10, .2) 50%, transparent 100%);
	pointer-events: none;
}

.rcard-tag-float {
	position: absolute;
	top: .9rem;
	left: .9rem;
	font-family: 'Montserrat', sans-serif;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: #032a21;
	background: #ffdb7e;
	padding: .24rem .65rem;
	border-radius: 100px;
	white-space: nowrap;
	z-index: 2;
	box-shadow: 0 2px 10px rgba(201, 168, 76, .4);
}

.rcard-price-float {
	position: absolute;
	bottom: .9rem;
	right: .9rem;
	font-family: 'Montserrat', sans-serif;
	font-size: 15px;
	font-weight: 700;
	color: var(--gold2);
	background: rgba(2, 14, 10, .88);
	border: 1px solid rgba(232, 201, 122, .3);
	padding: .32rem .8rem;
	border-radius: 6px;
	backdrop-filter: blur(6px);
	z-index: 2;
	display: flex;
	align-items: center;
	gap: .45rem;
}

.rcard-price-original {
	text-decoration: line-through;
	opacity: .5;
	font-size: .62rem;
	font-weight: 400;
	color: rgba(245, 237, 216, .65);
}

.rcard-price-float sub {
	font-size: .52rem;
	font-weight: 400;
	color: rgba(245, 237, 216, .5);
}

.rcard-body {
	padding: 1.2rem 1.3rem 1.4rem;
	display: flex;
	flex-direction: column;
	flex: 1;
}

.rcard-offer-badge {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	font-family: 'Montserrat', sans-serif;
	font-size: .5rem;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: #fff;
	background: linear-gradient(135deg, #b02a1e, #e03a2a);
	padding: .28rem .8rem .28rem .6rem;
	border-radius: 100px;
	margin-bottom: .7rem;
	width: fit-content;
	box-shadow: 0 3px 12px rgba(200, 50, 40, .5);
}

.rcard-offer-badge svg {
	width: 11px;
	height: 11px;
	stroke: #fff;
	fill: none;
	stroke-width: 2.2;
	flex-shrink: 0;
}

.rcard-name {
	font-family: 'Ubuntu', sans-serif;
	font-size: 22px;
	font-weight: 700;
	color: var(--cream);
	line-height: 1.2;
	margin-bottom: 15px;
}

.rcard-desc {
	font-family: 'Montserrat', sans-serif;
	font-size: .68rem;
	line-height: 1.78;
	color: rgba(245, 237, 216, .52);
	margin-bottom: .9rem;
}

.rcard-perks {
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: .32rem;
	margin-bottom: 1rem;
	flex: 1;
}

.rcard-perks li {
	display: flex;
	align-items: center;
	gap: .55rem;
	font-family: 'Montserrat', sans-serif;
	font-size: .65rem;
	font-weight: 600;
	color: rgba(245, 237, 216, .82);
	line-height: 1.45;
	background: none;
	border: none;
	padding: 0;
}

.rcard-perks li svg {
	  width: 15px;
    height: 15px;
    stroke: var(--gold);
    fill: none;
    stroke-width: 2.5;
    flex-shrink: 0;
    background: rgba(232, 201, 122, .12);
    border: 1px solid rgba(232, 201, 122, .22);
    border-radius: 50px;
    box-sizing: content-box;
    padding: 2px;
}

.rcard-actions {
	display: flex;
	align-items: center;
	gap: .55rem;
	border-top: 1px solid rgba(232, 201, 122, .1);
	padding-top: 1rem;
	margin-top: auto;
}

.rcard-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .4rem;
	font-family: 'Montserrat', sans-serif;
	font-size: .56rem;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	padding: .62rem .8rem;
	border-radius: 6px;
	text-decoration: none;
	white-space: nowrap;
	flex: 1;
	cursor: pointer;
	transition: background .22s, transform .2s, box-shadow .22s, border-color .22s;
}

.rcard-btn svg {
	width: 10px;
	height: 10px;
	stroke: currentColor;
	fill: none;
	stroke-width: 2.5;
}

.rcard-btn--outline {
	background: transparent;
	color: var(--gold);
	border: 1px solid rgba(232, 201, 122, .3);
}

.rcard-btn--outline:hover {
	background: rgba(232, 201, 122, .08);
	border-color: var(--gold);
	transform: translateY(-2px);
}

.rcard-btn--primary {
	background: linear-gradient(135deg, var(--gold), var(--gold2));
	color: var(--primary);
	border: 1px solid transparent;
	box-shadow: 0 4px 16px rgba(232, 201, 122, .3);
	font-weight: 800;
}

.rcard-btn--primary:hover {
	background: linear-gradient(135deg, var(--gold2), #fceec6);
	transform: translateY(-2px);
	box-shadow: 0 8px 24px rgba(232, 201, 122, .42);
}

@media (max-width: 1100px) {
	.room-cards {
		grid-template-columns: repeat(2, 1fr);
		gap: 1rem;
	}

	.rcard-img {
		height: 190px;
	}
}

@media (max-width: 700px) {
	.room-cards {
		grid-template-columns: repeat(2, 1fr);
		gap: .85rem;
	}

	.rcard-img {
		height: 160px;
	}

	.rcard-body {
		padding: 1rem 1rem 1.2rem;
	}

	.rcard-name {
		font-size: 1rem;
	}

	.rcard-desc {
		display: none;
	}
}

@media (max-width: 480px) {
	.room-cards {
		grid-template-columns: 1fr;
	}

	.rcard-img {
		height: 200px;
	}

	.rcard-desc {
		display: block;
	}
}

/* ============================================================
  10. GALLERY
  ============================================================ */
.gallery-sec {
  background: #fff9e8;
  padding: 4rem 1.5rem 5rem;
  position: relative;
}

.gallery-head {
  text-align: center;
  margin-bottom: 2.5rem;
}

.gallery-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  max-width: 1280px;
  margin: 0 auto;
}

.gitem {
  position: relative;
  overflow: hidden;
  border-radius: 10px;
  cursor: pointer;
  aspect-ratio: 4 / 3;
}

.gitem img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: brightness(.84);
  transition: transform .65s cubic-bezier(.4, 0, .2, 1), filter .4s;
}

.gitem:hover img {
  transform: scale(1.06);
  filter: brightness(.5);
}

.gitem-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(2,14,10,.55) 0%, transparent 50%);
  pointer-events: none;
}

.gitem-caption {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: .6rem .8rem;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .4rem;
}

.gitem-caption-text {
  font-family: 'Montserrat', sans-serif;
  font-size: 10px;
  color: rgba(220, 220, 220, .92);
  letter-spacing: .1em;
  text-transform: uppercase;
  text-shadow: 0 1px 6px rgba(0,0,0,.6);
  line-height: 1.3;
}

.gitem-zoom {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: rgba(232, 201, 122, .15);
  border: 1px solid rgba(232, 201, 122, .35);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  opacity: 0;
  transform: scale(.7);
  transition: opacity .3s, transform .3s ease;
  backdrop-filter: blur(4px);
}

.gitem:hover .gitem-zoom {
  opacity: 1;
  transform: scale(1);
}

.gitem-zoom svg {
  width: 12px;
  height: 12px;
  stroke: var(--gold);
  fill: none;
  stroke-width: 2;
}

@media (max-width: 1024px) {
  .gallery-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 600px) {
  .gallery-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 6px;
  }
  .gitem { border-radius: 7px; }
}
/* ============================================================
  11. LIGHTBOX
  ============================================================ */
.lb-overlay {
	display: none;
	position: fixed;
	inset: 0;
	z-index: 2000;
	background: rgba(1, 8, 6, .96);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.lb-overlay.open {
	display: flex;
	animation: lbFadeIn .3s ease;
}

@keyframes lbFadeIn {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

.lb-close {
	position: absolute;
	top: 1.4rem;
	right: 1.6rem;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: rgba(232, 201, 122, .1);
	border: 1px solid rgba(232, 201, 122, .25);
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	z-index: 10;
	transition: background .25s, border-color .25s, transform .2s;
}

.lb-close:hover {
	background: rgba(232, 201, 122, .22);
	border-color: var(--gold);
	transform: rotate(90deg);
}

.lb-close svg {
	width: 16px;
	height: 16px;
	stroke: var(--gold);
	fill: none;
	stroke-width: 2.5;
}

.lb-arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background: rgba(232, 201, 122, .08);
	border: 1px solid rgba(232, 201, 122, .2);
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	z-index: 10;
	transition: background .25s, border-color .25s, transform .25s;
}

.lb-prev {
	left: 1.5rem;
}

.lb-next {
	right: 1.5rem;
}

.lb-arrow:hover {
	background: rgba(232, 201, 122, .2);
	border-color: var(--gold);
}

.lb-prev:hover {
	transform: translateY(-50%) translateX(-3px);
}

.lb-next:hover {
	transform: translateY(-50%) translateX(3px);
}

.lb-arrow svg {
	width: 20px;
	height: 20px;
	stroke: var(--gold);
	fill: none;
	stroke-width: 2;
}

.lb-stage {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	padding: 1rem 5rem;
	min-height: 0;
}

.lb-img-wrap {
	position: relative;
	max-width: 100%;
	max-height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.lb-img-wrap img {
	max-width: 100%;
	max-height: calc(100vh - 200px);
	object-fit: contain;
	display: block;
	border-radius: 3px;
	box-shadow: 0 32px 80px rgba(0, 0, 0, .7);
	animation: lbImgIn .3s cubic-bezier(.4, 0, .2, 1);
}

@keyframes lbImgIn {
	from {
		opacity: 0;
		transform: scale(.96);
	}

	to {
		opacity: 1;
		transform: scale(1);
	}
}

.lb-loader {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(2, 14, 10, .5);
	border-radius: 3px;
}

.lb-loader.hidden {
	display: none;
}

.lb-spinner {
	width: 32px;
	height: 32px;
	border: 2px solid rgba(232, 201, 122, .2);
	border-top-color: var(--gold);
	border-radius: 50%;
	animation: spin .7s linear infinite;
}

@keyframes spin {
	to {
		transform: rotate(360deg);
	}
}

.lb-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: .8rem 5rem;
	border-top: 1px solid rgba(232, 201, 122, .1);
}

.lb-caption {
	font-family: 'Ubuntu', sans-serif;
	font-size: .9rem;
	font-weight: 400;
	font-style: italic;
	color: rgba(245, 237, 216, .75);
}

.lb-counter {
	font-family: 'Montserrat', sans-serif;
	font-size: .6rem;
	font-weight: 600;
	letter-spacing: .2em;
	color: rgba(232, 201, 122, .5);
	flex-shrink: 0;
}

#lbCur {
	color: var(--gold);
	font-size: .75rem;
	font-weight: 700;
}

.lb-thumbs {
	display: flex;
	gap: 6px;
	padding: .8rem 5rem;
	overflow-x: auto;
	scrollbar-width: none;
	width: 100%;
}

.lb-thumbs::-webkit-scrollbar {
	display: none;
}

.lb-thumb {
	width: 54px;
	height: 40px;
	flex-shrink: 0;
	border-radius: 2px;
	overflow: hidden;
	cursor: pointer;
	border: 2px solid transparent;
	opacity: .45;
	transition: opacity .25s, border-color .25s, transform .2s;
}

.lb-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.lb-thumb.active {
	border-color: var(--gold);
	opacity: 1;
}

.lb-thumb:hover {
	opacity: .85;
	transform: translateY(-2px);
}

/* ============================================================
   PEOPLE EXPERIENCE — FINAL FIX
   ============================================================ */
.pexp-sec {
  background: #fff;
  padding: 5rem 2rem;
  border-top: 1px solid rgba(4, 51, 41, .08);
  box-sizing: border-box;
}

.pexp-inner {
  max-width: 980px;
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  gap: 3rem;
  align-items: center;
}

.pexp-images {
  width: 360px;
  flex-shrink: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .5rem;
  height: 440px;
  min-width: 0;
}

.pexp-content {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.pexp-col {
  display: flex;
  flex-direction: column;
  gap: .5rem;
  min-width: 0;
}

.pexp-img--lg { flex: 1.6; }
.pexp-img--sm { flex: 1; }
.pexp-img--md { flex: 1.2; }

.pexp-img {
  position: relative;
  overflow: hidden;
  border-radius: 10px;
  min-height: 0;
}

.pexp-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: brightness(.9);
  transition: transform .65s cubic-bezier(.4, 0, .2, 1), filter .4s;
}

.pexp-img:hover img {
  transform: scale(1.06);
  filter: brightness(.75);
}

.pexp-body {
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  line-height: 1.95;
  color: rgb(48, 48, 48);
  margin-bottom: .7rem;
  text-align: justify;
  font-weight: 500;
}

.pexp-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.2rem .8rem;
  border-top: 1px solid rgba(4, 51, 41, .08);
  padding-top: 1.4rem;
  margin-top: .5rem;
}

.pexp-stat {
  display: flex;
  flex-direction: column;
  gap: .3rem;
}

.pexp-stat-ico {
  width: 40px;
  height: 40px;
  background: rgba(4, 51, 41, .06);
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: .2rem;
  transition: background .25s, transform .25s cubic-bezier(.34, 1.56, .64, 1);
}

.pexp-stat:hover .pexp-stat-ico {
  background: rgba(201, 168, 76, .15);
  transform: translateY(-3px);
}

.pexp-stat-ico svg {
  width: 17px;
  height: 17px;
  stroke: var(--primary);
  fill: none;
  stroke-width: 1.8;
}

.pexp-stat-num {
  font-family: 'Ubuntu', sans-serif;
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--primary);
  line-height: 1.1;
}

.pexp-stat-lbl {
  font-family: 'Montserrat', sans-serif;
  font-size: 12px;
  line-height: 1.5;
  color: rgb(110, 110, 110);
  font-weight: 600;
}

/* ── TABLET 1024px ── */
@media (max-width: 1024px) {
  .pexp-images {
    width: 300px;
    height: auto;
  }
  .pexp-inner {
    gap: 2rem;
  }
}

/* ── STACK: 900px se neeche ── */
@media (max-width: 900px) {
  .pexp-sec {
    padding: 3.5rem 1.5rem;
  }
  .pexp-inner {
    flex-direction: column;  /* ← images upar, content neeche */
    align-items: stretch;
    gap: 2rem;
  }
  .pexp-images {
    width: 100%;             /* ← poori width lo */
    height: auto;
    gap: .4rem;
  }
  .pexp-content {
    width: 100%;
  }
}

/* ── 640px ── */
@media (max-width: 640px) {
  .pexp-sec {
    padding: 3rem 1rem;
  }
  .pexp-images {
    height: auto;
    gap: .3rem;
  }
  .pexp-img {
    border-radius: 8px;
  }
  .pexp-stats {
    grid-template-columns: repeat(3, 1fr);
    gap: .8rem .4rem;
  }
  .pexp-body {
    font-size: 13px;
  }
  .pexp-stat-num {
    font-size: 1rem;
  }
  .pexp-stat-lbl {
    font-size: 11px;
  }
}

/* ── 480px ── */
@media (max-width: 480px) {
  .pexp-sec {
    padding: 2.5rem .9rem;
  }
  .pexp-inner {
    gap: 1.5rem;
  }
  .pexp-images {
    height: auto;
    gap: .25rem;
  }
  .pexp-stats {
    grid-template-columns: repeat(3, 1fr);
    gap: .65rem .3rem;
  }
  .pexp-stat-ico {
    width: 32px;
    height: 32px;
    border-radius: 8px;
  }
  .pexp-stat-ico svg {
    width: 14px;
    height: 14px;
  }
  .pexp-stat-num {
    font-size: .88rem;
  }
  .pexp-stat-lbl {
    font-size: 10px;
  }
}

/* ── 380px ── */
@media (max-width: 380px) {
  .pexp-sec {
    padding: 2rem .8rem;
  }
  .pexp-images {
    height: auto;
    gap: .2rem;
  }
  .pexp-img {
    border-radius: 6px;
  }
  .pexp-stats {
    grid-template-columns: repeat(2, 1fr);
    gap: .7rem .4rem;
  }
  .pexp-stat-num {
    font-size: .85rem;
  }
}

.qr-code{
   display: flex;
   justify-content: center;
   align-items: center;
   text-align: center;
}

.qr-code img{
   border-radius: 10px;
   margin: 10px;
}

/* ============================================================
  13. ABOUT
  ============================================================ */
.about-sec {
	background: #fff4d8;
	padding: 5rem 2rem;
	position: relative;
	overflow: hidden;
}

.about-sec::before {
	content: '';
	position: absolute;
	bottom: -100px;
	left: -100px;
	width: 500px;
	height: 500px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(232, 201, 122, .04) 0%, transparent 70%);
	pointer-events: none;
}

.about-sec::after {
	content: '';
	position: absolute;
	top: -80px;
	right: -80px;
	width: 420px;
	height: 420px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(232, 201, 122, .03) 0%, transparent 70%);
	pointer-events: none;
}

.about-inner {
	position: relative;
	z-index: 1;
	max-width: 1200px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 6rem;
	align-items: center;
}

.about-visuals {
	position: relative;
	padding-bottom: 3rem;
}

.av-main {
	position: relative;
	border-radius: 16px;
	overflow: hidden;
	aspect-ratio: 4 / 5;
}

.av-main img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	filter: brightness(.82);
	transition: transform .9s ease, filter .6s;
}

.about-visuals:hover .av-main img {
	transform: scale(1.03);
	filter: brightness(.92);
}

.av-main-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(2, 14, 10, .5) 0%, transparent 60%);
	pointer-events: none;
}

.about-text {
	display: flex;
	flex-direction: column;
}

.about-lead {
	font-family: 'Ubuntu';
	font-size: 16px;
	font-weight: 600;
	line-height: 1.75;
	color: #0a5240;
	margin-top: 1.4rem;
	padding-left: 1rem;
	border-left: 4px solid #0a5240;
}

.about-body {
	font-family: 'Montserrat', sans-serif;
	font-size: 15px;
	line-height: 1.95;
	color: rgb(50 49 49);
	margin-top: 1.1rem;
	text-align: justify;
	font-weight: 500;
}

.about-actions {
	display: flex;
	gap: .85rem;
	margin-top: 1.8rem;
	flex-wrap: wrap;
}

.about-btn-primary {
	display: inline-flex;
	align-items: center;
	gap: .55rem;
	background: linear-gradient(135deg, var(--gold), var(--gold2));
	color: var(--primary);
	font-family: 'Montserrat', sans-serif;
	font-size: .65rem;
	font-weight: 700;
	letter-spacing: .18em;
	text-transform: uppercase;
	padding: .85rem 1.8rem;
	border-radius: 3px;
	text-decoration: none;
	box-shadow: 0 4px 20px rgba(232, 201, 122, .3);
	transition: opacity .22s, transform .2s;
}

.about-btn-primary:hover {
	opacity: .9;
	transform: translateY(-2px);
}

.about-btn-outline {
	display: inline-flex;
	align-items: center;
	gap: .55rem;
	background: #021f17;
	border: 1px solid rgba(232, 201, 122, .3);
	color: #fff;
	font-family: 'Montserrat', sans-serif;
	font-size: .65rem;
	font-weight: 600;
	letter-spacing: .18em;
	text-transform: uppercase;
	padding: .85rem 1.8rem;
	border-radius: 3px;
	text-decoration: none;
	transition: background .22s, border-color .22s, color .22s;
}

.about-btn-outline svg {
	width: 13px;
	height: 13px;
	stroke: currentColor;
	fill: none;
	stroke-width: 2.5;
}

.about-btn-outline:hover {
	background: rgb(232 201 122);
	border-color: var(--gold);
	color: #000000;
}

/* ============================================================
  14. TESTIMONIALS
  ============================================================ */
.tsec {
  position: relative;
  background: var(--deep);
  padding: 7rem 1.5rem;
  overflow: hidden;

 
  background: linear-gradient(rgba(2, 14, 10, 0.88), rgba(2, 14, 10, 0.88)), url('../images/caro-1.avif');
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
}

.tsec-inner {
	position: relative;
	z-index: 1;
	max-width: 1160px;
	margin: 0 auto;
}

.tsec-head {
	text-align: center;
	margin-bottom: 4rem;
}

.tsec-sub {
	font-family: 'Montserrat', sans-serif;
	font-size: .82rem;
	line-height: 1.85;
	color: rgb(255 255 255);
	max-width: 440px;
	margin: 1rem auto 0;
}

.tcar-wrap {
	position: relative;
}

.tcar-viewport {
	overflow: hidden;
	border-radius: 6px;
}

.tcar-track {
	display: flex;
	transition: transform .6s cubic-bezier(.4, 0, .2, 1);
	will-change: transform;
}

.tcar-slide {
	min-width: 100%;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1.5rem;
	padding: 0 .25rem;
}

.tc2 {
	position: relative;
	background: rgba(4, 28, 22, .85);
	border: 1px solid rgba(232, 201, 122, .12);
	border-radius: 6px;
	padding: 2.4rem 2.2rem 2rem;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	backdrop-filter: blur(6px);
	transition: border-color .35s, box-shadow .35s, transform .35s;
}

.tc2:hover {
	border-color: rgba(232, 201, 122, .32);
	box-shadow: 0 24px 60px rgba(0, 0, 0, .45);
	transform: translateY(-4px);
}

.tc2-quote {
	position: absolute;
	top: .8rem;
	right: 1.6rem;
	font-family: 'Ubuntu', sans-serif;
	font-size: 7rem;
	font-weight: 700;
	line-height: 1;
	color: rgba(232, 201, 122, .06);
	pointer-events: none;
	user-select: none;
	transition: color .35s;
}

.tc2:hover .tc2-quote {
	color: rgba(232, 201, 122, .1);
}

.tc2::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 2px;
	background: linear-gradient(90deg, transparent, var(--gold), transparent);
	opacity: 0;
	transition: opacity .4s;
}

.tc2:hover::before {
	opacity: 1;
}

.tc2-stars {
	color: var(--gold);
	font-size: .78rem;
	letter-spacing: .2em;
	margin-bottom: 1.2rem;
	flex-shrink: 0;
}

.tc2-text {
	font-family: 'Ubuntu', sans-serif;
	font-size: .98rem;
	font-weight: 300;
	font-style: italic;
	color: rgba(245, 237, 216, .82);
	line-height: 1.85;
	flex: 1;
	margin-bottom: 1.6rem;
}

.tc2-rule {
	width: 36px;
	height: 1px;
	background: linear-gradient(90deg, var(--gold), transparent);
	margin-bottom: 1.4rem;
	flex-shrink: 0;
}

.tc2-auth {
	display: flex;
	align-items: center;
	gap: .9rem;
	flex-shrink: 0;
}

.tc2-av {
	width: 46px;
	height: 46px;
	border-radius: 50%;
	flex-shrink: 0;
	background: linear-gradient(135deg, var(--gold), #7a5a10);
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: 'Ubuntu', sans-serif;
	font-size: 1.05rem;
	font-weight: 700;
	color: var(--primary);
}

.tc2-info {
	flex: 1;
	min-width: 0;
}

.tc2-name {
	font-family: 'Ubuntu', sans-serif;
	font-size: .9rem;
	font-weight: 600;
	color: var(--cream);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.tc2-loc {
	display: flex;
	align-items: center;
	gap: .3rem;
	font-family: 'Montserrat', sans-serif;
	font-size: .62rem;
	color: rgba(245, 237, 216, .38);
	margin-top: .18rem;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.tc2-loc svg {
	width: 10px;
	height: 10px;
	stroke: var(--gold);
	fill: none;
	stroke-width: 2;
	flex-shrink: 0;
}

.tc2-badge {
	flex-shrink: 0;
	font-family: 'Montserrat', sans-serif;
	font-size: .48rem;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--gold);
	background: rgba(232, 201, 122, .08);
	border: 1px solid rgba(232, 201, 122, .2);
	padding: .28rem .65rem;
	border-radius: 100px;
	white-space: nowrap;
}

.tcar-arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 48px;
	height: 48px;
	border-radius: 50%;
	background: rgba(2, 14, 10, .85);
	border: 1px solid rgba(232, 201, 122, .25);
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	z-index: 10;
	backdrop-filter: blur(8px);
	transition: background .25s, border-color .25s, transform .25s, box-shadow .25s;
	box-shadow: 0 4px 20px rgba(0, 0, 0, .4);
}

.tcar-prev {
	left: -24px;
}

.tcar-next {
	right: -24px;
}

.tcar-arrow:hover {
	background: rgba(232, 201, 122, .15);
	border-color: var(--gold);
	box-shadow: 0 6px 28px rgba(232, 201, 122, .2);
}

.tcar-prev:hover {
	transform: translateY(-50%) translateX(-2px);
}

.tcar-next:hover {
	transform: translateY(-50%) translateX(2px);
}

.tcar-arrow svg {
	width: 17px;
	height: 17px;
	stroke: var(--gold);
	fill: none;
	stroke-width: 2;
}

.tcar-footer {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1.5rem;
	margin-top: 2.4rem;
}

.tcar-dots {
	display: flex;
	gap: .5rem;
	align-items: center;
}

.tdot {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: rgba(232, 201, 122, .18);
	border: none;
	cursor: pointer;
	padding: 0;
	transition: background .3s, width .3s, border-radius .3s;
}

.tdot.active {
	background: var(--gold);
	width: 26px;
	border-radius: 4px;
}

.tcar-counter {
	font-family: 'Montserrat', sans-serif;
	font-size: .6rem;
	font-weight: 600;
	letter-spacing: .2em;
	color: rgba(232, 201, 122, .35);
}

#tCur {
	font-size: .78rem;
	font-weight: 700;
	color: var(--gold);
}

.tcar-sep {
	margin: 0 .15rem;
}

/* ============================================================
  15. CTA
  ============================================================ */
.cta-sec {
	position: relative;
	padding: 7rem 2rem;
	background: #e7e7e7;
	border-top: 1px solid rgba(201, 168, 76, .3);
	overflow: hidden;
}

.cta-orb {
	position: absolute;
	border-radius: 50%;
	pointer-events: none;
	filter: blur(80px);
	opacity: .35;
}

.cta-orb--1 {
	width: 500px;
	height: 500px;
	top: -150px;
	left: -100px;
	background: radial-gradient(circle, rgba(180, 130, 20, .4), transparent 70%);
}

.cta-orb--2 {
	width: 350px;
	height: 350px;
	bottom: -80px;
	right: 10%;
	background: radial-gradient(circle, rgba(255, 255, 255, .8), transparent 70%);
	opacity: .5;
}

.cta-orb--3 {
	width: 250px;
	height: 250px;
	top: 40%;
	left: 40%;
	background: radial-gradient(circle, rgba(201, 160, 50, .35), transparent 70%);
	opacity: .2;
}

.cta-inner {
	position: relative;
	z-index: 1;
	max-width: 1240px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: 1fr 480px;
	gap: 6rem;
	align-items: center;
}

.cta-left {
	display: flex;
	flex-direction: column;
}

.cta-h2 {
	font-family: 'Ubuntu', sans-serif;
	font-size: clamp(2.4rem, 3.5vw, 4rem);
	font-weight: 700;
	color: var(--primary);
	line-height: 1.08;
	margin-bottom: 1.3rem;
	letter-spacing: -.02em;
}

.cta-desc {
	font-family: 'Montserrat', sans-serif;
    font-size: .88rem;
    color: rgb(2 31 23);
    line-height: 1.9;
    max-width: 440px;
    margin-bottom: 1.8rem;
    font-weight: 500;
}

.cta-rule {
	width: 50px;
	height: 2px;
	background: linear-gradient(90deg, var(--primary), transparent);
	margin-bottom: 1.8rem;
}

.cta-trust {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1rem 1.5rem;
	margin-bottom: 2.2rem;
}

.cta-trust-item {
	display: flex;
	align-items: flex-start;
	gap: .75rem;
}

.cta-trust-ico {
	width: 34px;
	height: 34px;
	flex-shrink: 0;
	border-radius: 4px;
	background: rgba(3, 42, 32, .08);
	border: 1px solid rgba(3, 42, 32, .18);
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 1px;
}

.cta-trust-ico svg {
	width: 14px;
	height: 14px;
	stroke: var(--primary);
	fill: none;
	stroke-width: 2;
}

.cta-trust-txt {
	display: flex;
	flex-direction: column;
	gap: .1rem;
}

.cta-trust-txt strong {
	font-family: 'Ubuntu', sans-serif;
	font-size: .82rem;
	font-weight: 600;
	color: var(--primary);
	line-height: 1.2;
}

.cta-trust-txt span {
	font-family: 'Montserrat', sans-serif;
    font-size: .62rem;
    color: rgb(131 131 131);
    line-height: 1.4;
    font-weight: 600;
}

.cta-actions {
	display: flex;
	gap: .85rem;
	flex-wrap: wrap;
	margin-bottom: 1.8rem;
}

.bp {
	display: inline-flex;
	align-items: center;
	gap: .6rem;
	background: var(--primary);
	color: #ffe6a5;
	font-family: 'Montserrat', sans-serif;
	font-size: .68rem;
	font-weight: 700;
	letter-spacing: .18em;
	text-transform: uppercase;
	padding: .9rem 2rem;
	border-radius: 3px;
	border: none;
	cursor: pointer;
	text-decoration: none;
	transition: opacity .25s, transform .2s, box-shadow .25s;
	box-shadow: 0 4px 24px rgba(3, 42, 32, .25);
}

.bp:hover {
	opacity: .88;
	transform: translateY(-2px);
	box-shadow: 0 8px 32px rgba(3, 42, 32, .35);
}

.bo {
	display: inline-flex;
	align-items: center;
	gap: .6rem;
	background: rgba(3, 42, 32, .07);
	color: var(--primary);
	font-family: 'Montserrat', sans-serif;
	font-size: .68rem;
	font-weight: 600;
	letter-spacing: .18em;
	text-transform: uppercase;
	padding: .9rem 2rem;
	border-radius: 3px;
	border: 1px solid rgba(3, 42, 32, .28);
	text-decoration: none;
	transition: border-color .25s, background .25s;
}

.bo:hover {
	background: rgba(3, 42, 32, .14);
	border-color: var(--primary);
}

.bp svg,
.bo svg {
	width: 14px;
	height: 14px;
	stroke: currentColor;
	fill: none;
	stroke-width: 2.5;
}

.cta-glass-card {
	position: relative;
	background: rgba(3, 42, 32, .82);
	backdrop-filter: blur(24px);
	-webkit-backdrop-filter: blur(24px);
	border: 1px solid rgba(255, 230, 165, .2);
	border-radius: 12px;
	overflow: hidden;
	box-shadow: 0 32px 80px rgba(3, 42, 32, .3), inset 0 1px 0 rgba(255, 255, 255, .06);
}

.cta-card-accent {
	height: 2px;
	background: linear-gradient(90deg, transparent, #ffe6a5, var(--gold2), transparent);
}

.cta-card-head {
	display: flex;
	align-items: center;
	gap: .85rem;
	padding: 1.2rem 1.6rem;
	border-bottom: 1px solid rgba(255, 230, 165, .1);
	background: rgba(0, 0, 0, .18);
}

.cta-card-head-icon {
	width: 38px;
	height: 38px;
	flex-shrink: 0;
	border-radius: 6px;
	background: rgba(255, 230, 165, .12);
	border: 1px solid rgba(255, 230, 165, .25);
	display: flex;
	align-items: center;
	justify-content: center;
}

.cta-card-head-icon svg {
	width: 16px;
	height: 16px;
	stroke: #ffe6a5;
	fill: none;
	stroke-width: 1.8;
}

.cta-card-head h3 {
	font-family: 'Ubuntu', sans-serif;
	font-size: 1rem;
	font-weight: 600;
	color: #ffe6a5;
	line-height: 1.15;
}

.cta-card-head p {
	font-family: 'Montserrat', sans-serif;
	font-size: .6rem;
	color: rgba(255, 230, 165, .45);
	margin-top: .1rem;
	font-weight: 500;
	letter-spacing: .05em;
}

.cta-card-badge {
	margin-left: auto;
	flex-shrink: 0;
	font-family: 'Montserrat', sans-serif;
	font-size: .5rem;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--primary);
	background: linear-gradient(135deg, #ffe6a5, var(--gold2));
	padding: .28rem .75rem;
	border-radius: 100px;
	white-space: nowrap;
}

.cta-glass-form {
	padding: 1.4rem 1.6rem 1.6rem;
	border-radius: 10px;
}

.cta-fg {
	display: flex;
	flex-direction: column;
	gap: .3rem;
}

.cta-fg--full {
	margin-bottom: .75rem;
}

.cta-label {
	display: flex;
	align-items: center;
	gap: .28rem;
	font-family: 'Montserrat', sans-serif;
	font-size: .48rem;
	font-weight: 700;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: rgba(255, 230, 165, .7);
}

.cta-label svg {
	width: 9px;
	height: 9px;
	stroke: currentColor;
	fill: none;
	stroke-width: 2;
	flex-shrink: 0;
}

.cta-input {
	background: rgba(255, 255, 255, .06);
	border: 1px solid rgba(255, 230, 165, .14);
	border-radius: 4px;
	padding: .7rem .9rem;
	color: #ffe6a5;
	font-family: 'Montserrat', sans-serif;
	font-size: .75rem;
	font-weight: 400;
	width: 100%;
	outline: none;
	appearance: none;
	transition: border-color .25s, background .25s, box-shadow .25s;
	backdrop-filter: blur(4px);
}

.cta-input::placeholder {
	color: rgba(255, 230, 165, .22);
	font-size: .72rem;
}

.cta-input:focus {
	border-color: rgba(255, 230, 165, .55);
	background: rgba(255, 230, 165, .07);
	box-shadow: 0 0 0 3px rgba(255, 230, 165, .08);
}

.cta-input option {
	background: #032a20;
	color: #ffe6a5;
}

.cta-textarea {
	resize: none;
	line-height: 1.6;
}

.cta-submit-btn {
	width: 100%;
	margin-top: .4rem;
	padding: .95rem 1rem;
	background: linear-gradient(135deg, #ffe6a5 0%, var(--gold2) 60%, #fceec6 100%);
	color: var(--primary);
	font-family: 'Montserrat', sans-serif;
	font-size: .68rem;
	font-weight: 700;
	letter-spacing: .2em;
	text-transform: uppercase;
	border: none;
	border-radius: 5px;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .55rem;
	box-shadow: 0 6px 28px rgba(255, 230, 165, .25);
	transition: opacity .2s, transform .2s, box-shadow .2s;
	position: relative;
	overflow: hidden;
}

.cta-submit-btn::after {
	content: '';
	position: absolute;
	top: 0;
	left: -100%;
	width: 60%;
	height: 100%;
	background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .3), transparent);
	transition: left .5s ease;
}

.cta-submit-btn:hover::after {
	left: 150%;
}

.cta-submit-btn:hover {
	opacity: .95;
	transform: translateY(-2px);
	box-shadow: 0 10px 36px rgba(255, 230, 165, .4);
}

.cta-submit-btn svg {
	width: 14px;
	height: 14px;
	stroke: currentColor;
	fill: none;
	stroke-width: 2.2;
}

.cta-glass-success {
	display: none;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: 3.5rem 2rem;
	gap: .75rem;
}

.cta-success-icon {
	width: 60px;
	height: 60px;
	border-radius: 50%;
	background: rgba(255, 230, 165, .12);
	border: 1px solid #ffe6a5;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.5rem;
	color: #ffe6a5;
	margin-bottom: .5rem;
}

.cta-glass-success h3 {
	font-family: 'Ubuntu', sans-serif;
	font-size: 1.4rem;
	font-weight: 500;
	color: #ffe6a5;
}

.cta-glass-success p {
	font-family: 'Montserrat', sans-serif;
	font-size: .78rem;
	color: rgba(255, 230, 165, .55);
	line-height: 1.75;
}

.cta-glass-success p strong {
	color: var(--gold2);
}

/* ============================================================
  16. FOOTER
  ============================================================ */
footer {
	position: relative;
	border-top: 1px solid var(--border);
	padding: 5rem 1.5rem 1.5rem;
	overflow: hidden;
}

footer::before {
	content: '';
	position: absolute;
	inset: 0;
	background: url('../images/caro-1.avif') center 25% / cover no-repeat;
	z-index: 0;
}

footer::after {
	content: '';
	position: absolute;
	inset: 0;
	background: #021f17e3;
	z-index: 1;
}

.fg-grid {
	position: relative;
	z-index: 2;
	max-width: 1100px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: 2fr 1fr 1fr 1fr;
	gap: 3rem;
	margin-bottom: 3.5rem;
}

.nav-brand {
	font-family: 'Ubuntu', sans-serif;
	font-weight: 700;
	color: var(--cream);
}

.nav-brand span {
	color: var(--gold);
}

.fb-tag {
	font-family: 'Montserrat', sans-serif;
	font-size: .8rem;
	line-height: 1.8;
	color: rgb(255 255 255);
	margin-top: .7rem;
	max-width: 320px;
	text-align: justify;
}

.fsoc {
	display: flex;
	gap: .6rem;
	margin-top: 1.5rem;
}

.fs {
	width: 38px;
	height: 38px;
	border: 1px solid var(--border);
	border-radius: 3px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--faint);
	text-decoration: none;
	transition: border-color .25s, color .25s, background .25s;
	border-radius: 50px;
}

.fs:hover {
	border-color: var(--gold);
	color: var(--gold);
	background: rgba(232, 201, 122, .07);
}

.fs svg {
  width: 18px;  /* ADD THIS */
  height: 18px; /* ADD THIS */
  stroke: currentColor;
  fill: none;
  flex-shrink: 0;
}
.fc h6 {
	font-family: 'Ubuntu', sans-serif;
	font-size: 18px;
	color: var(--gold);
	margin-bottom: 1.1rem;
}

.fc ul {
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: .65rem;
}

.fc ul li a {
	font-family: 'Montserrat', sans-serif;
	font-size: .8rem;
	color: rgb(255 255 255);
	text-decoration: none;
	transition: color .25s;
	display: flex;
	align-items: center;
	gap: 0.5rem;
	line-height: 22px;
}

.fc ul li a:hover {
	color: var(--gold2);
}

.fc ul li a svg {
	width: 11px;
	height: 11px;
	stroke: currentColor;
	fill: none;
	stroke-width: 2;
}

.fbot {
	position: relative;
	z-index: 2;
	max-width: 1100px;
	margin: 0 auto;
	border-top: 1px solid rgba(232, 201, 122, .08);
	padding-top: 1.5rem;
	text-align: center;
}

.fbot p {
	font-family: 'Montserrat', sans-serif;
	font-size: .72rem;
	color: rgb(232 201 122);
	letter-spacing: 0.5px;
}

/* ============================================================
  17. ROOM BOOKING POPUP
  ============================================================ */
.rbp-overlay {
	display: none;
	position: fixed;
	inset: 0;
	z-index: 3000;
	background: rgba(1, 10, 7, .88);
	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
	align-items: center;
	justify-content: center;
	padding: 1rem;
}

.rbp-overlay.open {
	display: flex;
	animation: rbpFadeIn .3s ease;
}

@keyframes rbpFadeIn {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

.rbp-card {
	position: relative;
	width: 100%;
	max-width: 520px;
	max-height: 90vh;
	overflow-y: auto;
	scrollbar-width: none;
	background: #000000f0;
	border: 1px solid rgba(232, 201, 122, .2);
	border-radius: 12px;
	animation: rbpSlideUp .35s cubic-bezier(.34, 1.56, .64, 1);
}

.rbp-card::-webkit-scrollbar {
	display: none;
}

@keyframes rbpSlideUp {
	from {
		opacity: 0;
		transform: translateY(32px) scale(.97);
	}

	to {
		opacity: 1;
		transform: translateY(0) scale(1);
	}
}

.rbp-card::before {
	content: '';
	position: absolute;
	top: 0;
	left: 2rem;
	right: 2rem;
	height: 2px;
	background: linear-gradient(90deg, transparent, var(--gold), transparent);
	border-radius: 0 0 2px 2px;
}

.rbp-close {
	position: absolute;
	top: .9rem;
	right: .9rem;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: rgba(232, 201, 122, .1);
	border: 1px solid rgba(232, 201, 122, .2);
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	z-index: 10;
	transition: background .22s, border-color .22s, transform .22s;
}

.rbp-close:hover {
	background: rgba(232, 201, 122, .2);
	border-color: var(--gold);
	transform: rotate(90deg);
}

.rbp-close svg {
	width: 13px;
	height: 13px;
	stroke: var(--gold);
	fill: none;
	stroke-width: 2.5;
}

.rbp-head {
	display: flex;
	align-items: center;
	gap: .85rem;
	padding: 1.3rem 1.5rem 1rem;
	border-bottom: 1px solid rgba(232, 201, 122, .1);
}

.rbp-head-icon {
	width: 38px;
	height: 38px;
	flex-shrink: 0;
	border-radius: 7px;
	background: rgba(232, 201, 122, .12);
	border: 1px solid rgba(232, 201, 122, .22);
	display: flex;
	align-items: center;
	justify-content: center;
}

.rbp-head-icon svg {
	width: 16px;
	height: 16px;
	stroke: var(--gold);
	fill: none;
	stroke-width: 1.8;
}

.rbp-head h3 {
	font-family: 'Ubuntu', sans-serif;
	font-size: 1.05rem;
	font-weight: 700;
	color: #fff;
	line-height: 1.15;
}

.rbp-head p {
	font-family: 'Montserrat', sans-serif;
	font-size: .58rem;
	color: rgba(232, 201, 122, .55);
	font-weight: 500;
	letter-spacing: .06em;
	margin-top: .1rem;
}

.rbp-badge {
	margin-left: auto;
	flex-shrink: 0;
	font-family: 'Montserrat', sans-serif;
	font-size: .48rem;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: #1a0900;
	background: linear-gradient(135deg, var(--gold), var(--gold2));
	padding: .26rem .72rem;
	border-radius: 100px;
	white-space: nowrap;
}

.rbp-form {
	padding: 1.2rem 1.5rem 1.4rem;
}

.rbp-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: .55rem;
	margin-bottom: .75rem;
}

.rbp-fg {
	display: flex;
	flex-direction: column;
	gap: .22rem;
}

.rbp-fg--full {
	grid-column: 1 / -1;
}

.rbp-label {
	font-family: 'Montserrat', sans-serif;
	font-size: .48rem;
	font-weight: 700;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: rgba(232, 201, 122, .7);
	display: flex;
	align-items: center;
	gap: .25rem;
}

.rbp-label svg {
	width: 9px;
	height: 9px;
	stroke: currentColor;
	fill: none;
	stroke-width: 2;
}

.rbp-input {
	background: rgba(255, 255, 255, .07);
	border: 1px solid rgba(232, 201, 122, .12);
	border-radius: 0;
	color: #ccc;
	padding: .65rem .75rem;
	font-family: 'Montserrat', sans-serif;
	font-size: .7rem;
	width: 100%;
	outline: none;
	appearance: none;
	-webkit-appearance: none;
	font-weight: 500;
	transition: border-color .22s, background .22s, box-shadow .22s;
}

.rbp-input::placeholder {
	color: rgba(255, 255, 255, .22);
	font-size: .68rem;
}

.rbp-input:focus {
	border-color: rgba(232, 201, 122, .5);
	background: rgba(232, 201, 122, .06);
	box-shadow: 0 0 0 3px rgba(232, 201, 122, .08);
}

.rbp-input option {
	background: #032a20;
}

.rbp-input[type="date"]::-webkit-calendar-picker-indicator {
	filter: invert(70%) sepia(60%) saturate(500%) hue-rotate(5deg);
	cursor: pointer;
}

textarea.rbp-input {
	resize: none;
	line-height: 1.55;
}

.rbp-form .fi-select-wrap .rbp-input {
	padding-right: 2rem;
}

.rbp-btn {
	width: 100%;
	margin-top: .6rem;
	padding: .88rem 1rem;
	background: linear-gradient(135deg, var(--gold), var(--gold2));
	color: var(--primary);
	font-family: 'Montserrat', sans-serif;
	font-size: .68rem;
	font-weight: 700;
	letter-spacing: .18em;
	text-transform: uppercase;
	border: none;
	border-radius: 4px;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .5rem;
	box-shadow: 0 6px 24px rgba(232, 201, 122, .38);
	transition: opacity .2s, transform .2s;
}

.rbp-btn:hover {
	opacity: .9;
	transform: translateY(-2px);
}

.rbp-btn svg {
	width: 14px;
	height: 14px;
	stroke: currentColor;
	fill: none;
	stroke-width: 2.5;
}

.rbp-trust {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1.4rem;
	padding: .85rem 1.5rem 1.2rem;
	border-top: 1px solid rgba(232, 201, 122, .08);
	flex-wrap: wrap;
}

.rbp-trust span {
	display: flex;
	align-items: center;
	gap: .35rem;
	font-family: 'Montserrat', sans-serif;
	font-size: .54rem;
	font-weight: 600;
	color: rgba(232, 201, 122, .5);
	letter-spacing: .06em;
	text-transform: uppercase;
}

.rbp-trust svg {
	width: 11px;
	height: 11px;
	stroke: var(--gold);
	fill: none;
	stroke-width: 2;
}

/* ============================================================
  18. SCROLL REVEAL ANIMATION
  ============================================================ */
.reveal {
	opacity: 0;
	transform: translateY(32px);
	transition: opacity .75s ease, transform .75s ease;
}

.reveal.visible,
.reveal.revealed {
	opacity: 1;
	transform: translateY(0);
}

/* ============================================================
  19. RESPONSIVE BREAKPOINTS
  ============================================================ */
@media (max-width: 1100px) {
	.hero-body {
		grid-template-columns: 1fr 350px;
		padding: 78px 1.8rem 1.8rem;
		gap: 1.5rem;
	}

	.inc-grid {
		grid-template-columns: repeat(3, 1fr);
	}

	.inc-card--cta {
		grid-column: 1 / -1;
	}

	.about-inner {
		gap: 4rem;
	}

	.cta-inner {
		grid-template-columns: 1fr 440px;
		gap: 4rem;
	}
}

@media (max-width: 900px) {
	.hero {
		height: 65vh;
		min-height: 480px;
	}

	.hero-body {
		grid-template-columns: 1fr;
		padding: 90px 1.4rem 2rem;
		align-items: flex-start;
	}

	.hero-form-card {
		display: none;
	}

	.hero-marquee-wrap {
		display: none;
	}

	.hero-stats-row {
		display: none;
	}

	.hero-h1 {
		font-size: clamp(1.9rem, 6vw, 2.8rem);
		min-height: auto;
	}

	.hero-desc {
		font-size: .82rem;
	}

	.hero-form-mobile {
		display: block;
	}

	.rooms-sec {
		padding-top: 8rem;
	}

	.about-inner {
		grid-template-columns: 1fr;
		gap: 3rem;
	}

	.fg-grid {
		grid-template-columns: 1fr 1fr;
	}

	.cta-inner {
		grid-template-columns: 1fr;
		gap: 3.5rem;
		max-width: 600px;
	}

	.cta-sec {
		padding: 5rem 1.5rem;
	}

	.cta-h2 {
		font-size: clamp(2rem, 8vw, 3rem);
	}

	.cta-desc {
		max-width: 100%;
	}

	.cta-trust {
		grid-template-columns: 1fr 1fr;
	}

	.nav-dropdown-menu {
		display: none !important;
	}
}

@media (max-width: 768px) {

	.nav-links,
	.nav-cta {
		display: none;
	}

	#hamburger {
		display: flex;
	}

	#navbar {
		padding: 0 1.2rem;
		height: 68px;
	}

	.nav-logo img {
		height: 60px;
		top: 8% !important;
	}

	.hero {
		height: 60vh;
		min-height: 420px;
	}

	.hero-body {
		padding: 78px 1.2rem 1.5rem;
	}

	.hero-h1 {
		font-size: clamp(1.7rem, 7.5vw, 2.4rem);
	}

	.hero-desc {
		font-size: .78rem;
		line-height: 1.75;
	}

	.hero-form-mobile {
		display: block;
		margin: -50px 1rem 0;
	}

	.rooms-sec {
		padding-top: 7rem;
	}

	.inc-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.inc-card--cta {
		grid-column: 1 / -1;
	}

	.lb-stage {
		padding: 1rem 3.2rem;
	}

	.lb-footer {
		padding: .7rem 1rem;
		flex-direction: column;
		gap: .4rem;
		align-items: flex-start;
	}

	.lb-thumbs {
		padding: .6rem 1rem;
	}

	.lb-arrow {
		width: 38px;
		height: 38px;
	}

	.lb-prev {
		left: .5rem;
	}

	.lb-next {
		right: .5rem;
	}

	.tcar-slide {
		grid-template-columns: 1fr;
		gap: 1rem;
	}

	.tcar-prev {
		left: -10px;
	}

	.tcar-next {
		right: -10px;
	}

	.tcar-arrow {
		width: 36px;
		height: 36px;
	}

	.about-sec {
		padding: 4rem 1.2rem;
	}

	.cta-trust {
		grid-template-columns: 1fr 1fr;
	}

	.rbp-grid {
		grid-template-columns: 1fr;
	}

	.rbp-card {
		max-width: 100%;
	}
}

@media (max-width: 520px) {
	.hero {
		height: 55vh;
		min-height: 380px;
	}

	.hero-rule {
		display: none;
	}

	.hero-form-mobile {
		margin: -45px .8rem 0;
	}

	.rooms-sec {
		padding-top: 6rem;
	}

	.inc-grid {
		grid-template-columns: 1fr;
	}

	.inc-card--cta {
		grid-column: 1;
	}

	.cta-trust {
		grid-template-columns: 1fr;
	}

	.cta-actions {
		flex-direction: column;
	}

	.bp,
	.bo {
		justify-content: center;
	}

	.cta-glass-card {
		border-radius: 8px;
	}
}

@media (max-width: 480px) {
	.fg-grid {
		grid-template-columns: 1fr;
		gap: 2rem;
	}

	.nav-logo img {
		height: 52px;
	}

	.lb-img-wrap img {
		max-height: calc(100vh - 220px);
	}

	.tsec {
		padding: 4rem 1rem;
	}

	.tc2 {
		padding: 1.6rem 1.2rem 1.4rem;
	}

	.tcar-prev,
	.tcar-next {
		display: none;
	}

	.about-actions {
		flex-direction: column;
	}

	.about-btn-primary,
	.about-btn-outline {
		justify-content: center;
	}

	.sec {
		padding: 4rem 1rem;
	}

	.included-sec {
		padding: 4rem 1rem;
	}
}

@media (max-width: 360px) {
	.hero-h1 {
		font-size: 1.55rem;
	}

	.hero-desc {
		font-size: .72rem;
	}

	.hero-form-mobile {
		margin-left: .5rem;
		margin-right: .5rem;
	}

	#navbar {
		height: 60px;
	}

	.nav-logo img {
		height: 46px;
	}
}


/* Google Reviews CTA — add inside Section 14 */
.tsec-google-cta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2rem;
  margin-top: 3rem;
  padding: 1.6rem 2rem;
  background: rgba(255, 255, 255, .04);
  border: 1px solid rgba(232, 201, 122, .14);
  border-radius: 10px;
  flex-wrap: wrap;
}

.tsec-rating-summary {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.tsec-rating-num {
  font-family: 'Ubuntu', sans-serif;
  font-size: 3rem;
  font-weight: 700;
  color: var(--gold);
  line-height: 1;
}

.tsec-rating-right {
  display: flex;
  flex-direction: column;
  gap: .25rem;
}

.tsec-rating-stars {
  color: var(--gold);
  font-size: 1rem;
  letter-spacing: .15em;
}

.tsec-star-half {
  opacity: .4;
}

.tsec-rating-label {
  font-family: 'Montserrat', sans-serif;
  font-size: .6rem;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(245, 237, 216, .4);
}

.tsec-google-btn {
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  background: #fff;
  color: #3c3c3c;
  font-family: 'Montserrat', sans-serif;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  padding: .85rem 1.8rem;
  border-radius: 5px;
  text-decoration: none;
  box-shadow: 0 4px 20px rgba(0,0,0,.25);
  transition: transform .2s, box-shadow .2s, background .2s;
  white-space: nowrap;
}

.tsec-google-btn:hover {
  background: #f8f8f8;
  transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(0,0,0,.35);
}

.tsec-google-btn svg:last-child {
  stroke: #3c3c3c;
  fill: none;
  stroke-width: 2.5;
}

@media (max-width: 600px) {
  .tsec-google-cta {
    flex-direction: column;
    gap: 1.2rem;
    text-align: center;
  }
  .tsec-rating-summary {
    justify-content: center;
  }
  .tsec-google-btn {
    width: 100%;
    justify-content: center;
  }
}

/* ── About page image rows ── */
.ab-img-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin: 2.5rem 0;
}

.ab-img-item {
  border-radius: 10px;
  overflow: hidden;
  aspect-ratio: 4 / 3;
}

.ab-img-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .6s ease;
}

.ab-img-item:hover img {
  transform: scale(1.05);
}

@media (max-width: 600px) {
  .ab-img-row {
    grid-template-columns: repeat(2, 1fr);
    gap: 6px;
  }
  .ab-img-row .ab-img-item:last-child {
    grid-column: 1 / -1;
  }
}

/* ============================================================
   ABOUT PAGE
   ============================================================ */

/* Hero */
.ab-hero {
  position: relative;
  height: 55vh;
  min-height: 380px;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
}

.ab-hero-bg {
  position: absolute;
  inset: 0;
  background: url('../images/caro-2.avif') center / cover no-repeat;
  z-index: 0;
}

.ab-hero-overlay {
  position: absolute;
  inset: 0;
  background: #000000c4;
  z-index: 1;
}


.ab-hero-body {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 860px;
  margin: 0 auto;
  padding: 0 2rem 3rem;
}

.emptyError {
    background-color: rgb(255 147 19) !important;
    border: 2px solid transparent !important;
}

.emptyError::placeholder {
    color: #ffffff!important;
    opacity: 1; 
	text-transform: capitalize;
	font-size: 11px!important;
}


/* Container */
#toast {
  position: fixed;
  top: 20px;
  right: 20px;
  z-index: 9999;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* Toast Card */
.toast-msg {
  position: relative;
  min-width: 280px;
  max-width: 360px;
  padding: 14px 16px 14px 50px;
  color: #fff;
  font-size: 14px;
  font-family: 'ubuntu', sans-serif;
  backdrop-filter: blur(10px);
  background: rgba(0,0,0,0.75);
  box-shadow: 0 8px 25px rgba(0,0,0,0.2);
  opacity: 0;
  transform: translateX(120%);
  animation: toastIn 0.4s ease forwards, toastOut 0.4s ease forwards 3.5s;
}

/* Left Accent Bar */
.toast-msg::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 6px;
}

/* Icons */
.toast-msg::after {
  position: absolute;
  left: 16px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 18px;
}

/* Success */
.toast-success {
  background: linear-gradient(135deg, #438c07, #69a00b);
}

.toast-success::before {
  background: #6ac700;
}

.toast-success::after {
  content: "✔";
}

/* Error */
.toast-error {
  background: linear-gradient(135deg, #dc3545, #b02a37);
}

.toast-error::before {
  background: #ff0d0d;
}

.toast-error::after {
  content: "✖";
}

/* Info */
.toast-info {
  background: linear-gradient(135deg, #007bff, #0056b3);
}

.toast-info::before {
  background: #66b3ff;
}

.toast-info::after {
  content: "ℹ";
}

/* Warning */
.toast-warning {
  background: linear-gradient(135deg, #ffc107, #e0a800);
  color: #000;
}
.toast-warning::before {
  background: #ffdd57;
}
.toast-warning::after {
  content: "⚠";
}

/* Animations */
@keyframes toastIn {
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes toastOut {
  to {
    opacity: 0;
    transform: translateX(120%);
  }
}

/* 📱 Mobile Responsive */
@media (max-width: 600px) {
  #toast {
    top: auto;
    bottom: 20px;
    right: 10px;
    left: 10px;
    align-items: center;
  }

  .toast-msg {
    width: 100%;
    max-width: 100%;
    font-size: 13px;
    padding: 12px 14px 12px 45px;
  }
}

.ab-bc {
  display: flex;
  align-items: center;
  gap: .45rem;
  font-family: 'Montserrat', sans-serif;
  font-size: .6rem;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .45);
  margin-bottom: .9rem;
}

.ab-bc a {
  color: rgba(255, 255, 255, .45);
  text-decoration: none;
  transition: color .2s;
}

.ab-bc a:hover { color: var(--gold); }
.ab-bc span:last-child { color: var(--gold2); }

.reqStar{
	font-size: 12px;
}

.ab-hero-title {
  font-family: 'Ubuntu', sans-serif;
  font-size: clamp(1.9rem, 5vw, 3.2rem);
  font-weight: 700;
  color: #ffeec0;
  line-height: 1.1;
  margin: 0;
}

/* Page wrapper */
.ab-page {
  background: #f8f5ee;
  padding: 5rem 1.5rem 6rem;
}

.ab-page-inner {
  max-width: 860px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 3.5rem;
}

/* Heading block */
.ab-head {
  text-align: center;
}

.ab-slbl {
  font-family: 'Montserrat', sans-serif;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #ac6c00;
  margin-bottom: .5rem;
}

.ab-sh2 {
  font-family: 'Ubuntu', sans-serif;
  font-size: clamp(1.7rem, 3vw, 2.4rem);
  font-weight: 700;
  color: var(--primary);
  line-height: 1.15;
}

.ab-orn {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin: 1rem auto 0;
  max-width: 240px;
}

.ab-orn span {
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, transparent, #cfa866, transparent);
  display: block;
}

.ab-orn-d {
  width: 7px;
  height: 7px;
  background: #ad6e00;
  transform: rotate(45deg);
  flex-shrink: 0;
}

/* Text block */
.ab-text p {
  font-family: 'Montserrat', sans-serif;
  font-size: 15px;
  line-height: 2;
  color: #323232;
  font-weight: 500;
  text-align: justify;
  margin-bottom: 1.2rem;
}

.ab-text p:last-child {
  margin-bottom: 0;
}

/* Images — 3 single full-width rows */
.ab-imgs {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.ab-img-single {
  width: 100%;
  border-radius: 10px;
  overflow: hidden;
  aspect-ratio: 16 / 7;
}

.ab-img-single img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .7s ease;
}

.ab-img-single:hover img {
  transform: scale(1.03);
}

/* Responsive */
@media (max-width: 768px) {
  .ab-hero {
    height: 45vh;
    min-height: 300px;
  }
  .ab-hero-body {
    padding: 0 1.2rem 2.5rem;
  }
  .ab-page {
    padding: 3.5rem 1rem 4rem;
  }
  .ab-page-inner {
    gap: 2.5rem;
  }
  .ab-img-single {
    aspect-ratio: 16 / 9;
  }
}

@media (max-width: 480px) {
  .ab-page {
    padding: 2.5rem .8rem 3rem;
  }
  .ab-img-single {
    aspect-ratio: 4 / 3;
    border-radius: 8px;
  }
}

.formHead h3{
  color: #021f17;
  margin-bottom: 25px;
}

.home-enq-form{
	background-color: #fff;
}

.bg-white{
	background-color: #fff;
}

