/* ============================================================
   style.css — Nanda View Resort  (COMPLETE SINGLE FILE)
   ============================================================ */

/* ── 1. 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);
}

/* ── 2. 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;
}

/* ══════════════════════════════════════════════════════════════
   3. 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, 0.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;
	left: unset !important;
	width: auto !important;
	height: 90px;
	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 {
	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;
}

.nav-links a::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 {
	color: var(--gold2);
}

.nav-links a:hover::after {
	transform: scaleX(1);
}

.nav-cta {
	display: flex;
	align-items: center;
	gap: .5rem;
	background: var(--gold);
	border: none;
	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: none;
	border: 1px solid rgba(201, 168, 76, .35);
	padding: .4rem .6rem;
	border-radius: 2px;
	cursor: pointer;
	flex-shrink: 0;
}

#hamburger svg {
	display: block;
	width: 20px;
	height: 14px;
	stroke: var(--gold);
	fill: none;
	stroke-width: 2;
	stroke-linecap: round;
}

#mobileNav {
	display: none;
	background: rgba(3, 14, 10, 0.98);
	border-top: 1px solid rgba(201, 168, 76, .12);
}

#mobileNav a {
	display: block;
	padding: .9rem 1.5rem;
	font-family: 'Montserrat', sans-serif;
	font-size: .72rem;
	font-weight: 600;
	letter-spacing: .15em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .8);
	text-decoration: none;
	border-bottom: 1px solid rgba(201, 168, 76, .07);
	transition: color .2s, background .2s;
}

#mobileNav a:hover {
	color: var(--gold);
	background: rgba(201, 168, 76, .05);
}


/* ══════════════════════════════════════════════════════════════
   4. HERO SECTION
   ══════════════════════════════════════════════════════════════ */
.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.jpg'); }
.slide-2 { background-image: url('../images/caro-2.jpg'); }
.slide-3 { background-image: url('../images/caro-3.jpg'); }

.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: rgb(255, 255, 255);
	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;
	gap: 0;
	margin-top: 1.4rem;
	background: rgb(2 14 10 / 20%);
	border-radius: 6px;
	overflow: hidden;
	max-width: 480px;
	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: #ffffff;
	margin-top: .25rem;
}

/* ── 5. REVIEW MARQUEE ── */
.hero-marquee-wrap {
	margin-top: 1.4rem;
	overflow: hidden;
	position: relative;
	flex-shrink: 0;
}

.hero-marquee-track {
	display: flex;
	gap: .75rem;
	width: max-content;
	animation: marqueeScroll 36s linear infinite;
}

.hero-marquee-track:hover {
	animation-play-state: paused;
}

@keyframes marqueeScroll {
	from { transform: translateX(0); }
	to   { transform: translateX(-50%); }
}

.mrq-card {
	width: 245px;
	flex-shrink: 0;
	display: flex;
	align-items: flex-start;
	gap: .6rem;
	padding: .75rem .9rem;
	background: rgb(19 21 19 / 52%);
	border-left: 2px solid rgb(255 224 136);
	border-radius: 10px;
}

.mrq-card:hover {
	border-left-color: var(--gold);
	transform: translateY(-2px);
	box-shadow: 0 8px 28px rgba(0, 0, 0, .5);
}

.mrq-av {
	width: 30px;
	height: 30px;
	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: .72rem;
	font-weight: 700;
	color: #1a0900;
	border: 1px solid rgba(201, 168, 76, .35);
	margin-top: 1px;
}

.mrq-body {
	min-width: 0;
	flex: 1;
}

.mrq-stars {
	color: var(--gold);
	font-size: .55rem;
	margin-bottom: .28rem;
}

.mrq-text {
	font-family: 'Montserrat';
	font-size: 12px;
	font-weight: 300;
	color: #ffffff;
	line-height: 1.55;
	margin-bottom: .3rem;
}

.mrq-meta {
	display: flex;
	align-items: center;
	gap: .3rem;
	flex-wrap: wrap;
}

.mrq-name {
	font-family: 'Montserrat', sans-serif;
	font-size: .55rem;
	font-weight: 700;
	color: var(--gold2);
	text-transform: uppercase;
	letter-spacing: .07em;
}

.mrq-dot {
	color: rgba(201, 168, 76, .3);
	font-size: .52rem;
}

/* ── 6. 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: .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 rgb(232 201 122 / 0%);
	border-radius: 0px;
	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;
	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: #032a20;
}

.fi[type="date"]::-webkit-calendar-picker-indicator {
	filter: invert(70%) sepia(60%) saturate(500%) hue-rotate(5deg);
	cursor: pointer;
}

.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);
}

.swrap {
	display: none;
	text-align: center;
	padding: 1.8rem 1rem;
	align-items: center;
	justify-content: center;
	flex-direction: column;
}

.sicon {
	width: 48px;
	height: 48px;
	border-radius: 50%;
	background: rgba(201, 168, 76, .12);
	border: 1px solid var(--gold);
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto .7rem;
	font-size: 1.2rem;
}


/* ── 7. AMENITIES STRIP ── */
.am-strip {
	background: var(--mid);
	border-top: 1px solid var(--border);
	border-bottom: 1px solid var(--border);
}

.am-inner {
	max-width: 1200px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: 1fr 2fr;
}

.am-featured {
	background: linear-gradient(160deg, rgba(232, 201, 122, .13), rgba(232, 201, 122, .03));
	border-right: 1px solid rgba(232, 201, 122, .12);
	padding: 3rem 2rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	position: relative;
	overflow: hidden;
}

.am-feat-ico {
	width: 72px;
	height: 72px;
	margin: 0 auto 1.2rem;
	background: rgba(232, 201, 122, .12);
	border: 1px solid rgba(232, 201, 122, .32);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.am-feat-ico svg {
	width: 34px;
	height: 34px;
	stroke: var(--gold);
	fill: none;
	stroke-width: 1.5;
}

.am-featured h4 {
	font-family: 'Ubuntu', sans-serif;
	font-size: 1.25rem;
	font-weight: 500;
	color: var(--cream);
	margin-bottom: .5rem;
}

.am-featured p {
	font-family: 'Montserrat', sans-serif;
	font-size: .76rem;
	color: var(--mist);
	line-height: 1.7;
	max-width: 220px;
}

.am-feat-badge {
	display: inline-block;
	margin-top: 1.2rem;
	font-family: 'Montserrat', sans-serif;
	font-size: .58rem;
	font-weight: 700;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: var(--gold);
	border: 1px solid rgba(232, 201, 122, .3);
	padding: .35rem .9rem;
	border-radius: 100px;
}

.am-right {
	display: grid;
	grid-template-columns: 1fr 1fr;
}

.am {
	padding: 2rem 1.5rem;
	text-align: center;
	border-right: 1px solid rgba(232, 201, 122, .08);
	border-bottom: 1px solid rgba(232, 201, 122, .08);
	transition: background .3s;
	position: relative;
	overflow: hidden;
}

.am:nth-child(2n) {
	border-right: none;
}

.am-right .am:nth-child(3),
.am-right .am:nth-child(4) {
	border-bottom: none;
}

.am-bottom {
	grid-column: 1/-1;
	border-bottom: none !important;
	border-right: none !important;
	background: rgba(232, 201, 122, .025);
	display: flex;
	align-items: center;
	gap: 1.5rem;
	padding: 1.5rem 2rem;
	text-align: left;
}

.am-bottom .am-ico {
	width: 54px;
	height: 54px;
	flex-shrink: 0;
	background: rgba(232, 201, 122, .1);
	border: 1px solid rgba(232, 201, 122, .2);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.am-bottom .am-ico svg {
	width: 24px;
	height: 24px;
	stroke: var(--gold);
	fill: none;
	stroke-width: 1.6;
}

.am-btxt h4 {
	font-family: 'Ubuntu', sans-serif;
	font-size: 1rem;
	font-weight: 500;
	color: var(--cream);
	margin-bottom: .2rem;
}

.am-btxt p {
	font-family: 'Montserrat', sans-serif;
	font-size: .72rem;
	color: var(--faint);
	line-height: 1.5;
}

.am::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 0;
	height: 2px;
	background: var(--gold);
	transition: width .4s;
}

.am:hover::after {
	width: 80%;
}

.am:hover {
	background: rgba(232, 201, 122, .04);
}

.am .am-ico {
	width: 54px;
	height: 54px;
	margin: 0 auto .9rem;
	background: rgba(232, 201, 122, .1);
	border: 1px solid rgba(232, 201, 122, .2);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background .3s, border-color .3s;
}

.am:hover .am-ico {
	background: rgba(232, 201, 122, .18);
	border-color: var(--gold);
}

.am .am-ico svg {
	width: 24px;
	height: 24px;
	stroke: var(--gold);
	fill: none;
	stroke-width: 1.6;
}

.am h4 {
	font-family: 'Ubuntu', sans-serif;
	font-size: .95rem;
	font-weight: 500;
	color: var(--cream);
	margin-bottom: .3rem;
}

.am p {
	font-family: 'Montserrat', sans-serif;
	font-size: .7rem;
	color: var(--faint);
	line-height: 1.5;
}


/* ── 8. SHARED SECTION UTILITIES ── */
.sec {
	padding: 6rem 1.5rem;
}

.slbl {
	font-family: 'Montserrat', sans-serif;
	font-size: .6rem;
	font-weight: 700;
	letter-spacing: .3em;
	text-transform: uppercase;
	color: #cea867;
	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: var(--gold);
	transform: rotate(45deg);
	flex-shrink: 0;
}

/* ══════════════════════════════════════════════════════════
   ROOMS SECTION
   ══════════════════════════════════════════════════════════ */


.rooms-wrap {
  max-width: 1240px;
  margin: 3.5rem auto 0;
  padding: 0 1.5rem;
}

/* ── 4-column card grid ── */
.room-cards {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
  border: 1px solid rgba(232,201,122,.14);
  border-radius: 6px;
  overflow: hidden;
}

.rcard {
  display: flex;
  flex-direction: column;
  background: var(--forest);
  border-right: 1px solid rgba(232,201,122,.1);
  transition: background .3s;
  position: relative;
}

.rcard:last-child { border-right: none; }

.rcard:hover { background: #021c14; }

/* ── card image ── */
.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(.72);
  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,.85) 0%,
    rgba(2,14,10,.15) 55%,
    transparent 100%);
  pointer-events: none;
}

/* floating tag top-left */
.rcard-tag-float {
  position: absolute;
  top: .85rem;
  left: .85rem;
  font-family: 'Montserrat', sans-serif;
  font-size: .48rem;
  font-weight: 700;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--primary);
  background: var(--gold);
  padding: .22rem .65rem;
  border-radius: 100px;
  white-space: nowrap;
}

/* price badge bottom-right of image */
.rcard-price-float {
  position: absolute;
  bottom: .85rem;
  right: .85rem;
  font-family: 'Montserrat', sans-serif;
  font-size: .78rem;
  font-weight: 700;
  color: var(--gold2);
  background: rgba(2,14,10,.82);
  border: 1px solid rgba(232,201,122,.25);
  padding: .28rem .72rem;
  border-radius: 2px;
  backdrop-filter: blur(4px);
}

.rcard-price-float sub {
  font-size: .55rem;
  font-weight: 400;
  color: rgba(245,237,216,.55);
}

/* ── card body ── */
.rcard-body {
  padding: 1.4rem 1.4rem 1.5rem;
  display: flex;
  flex-direction: column;
  flex: 1;
  gap: 0;
}

.rcard-name {
  font-family: 'Ubuntu', sans-serif;
  font-size: 1.15rem;
  font-weight: 600;
  color: var(--cream);
  line-height: 1.2;
  margin-bottom: .55rem;
}

.rcard-desc {
  font-family: 'Montserrat', sans-serif;
  font-size: .7rem;
  line-height: 1.78;
  color: rgba(245,237,216,.55);
  margin-bottom: .9rem;
}

/* perk list */
.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: .5rem;
  font-family: 'Montserrat', sans-serif;
  font-size: .63rem;
  font-weight: 500;
  color: rgba(245,237,216,.68);
  line-height: 1.5;
}

.rcard-perks svg {
  width: 11px;
  height: 11px;
  stroke: var(--gold);
  fill: none;
  stroke-width: 2.5;
  flex-shrink: 0;
}

/* chip tags */
.rcard-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin-bottom: 1.1rem;
}

.rcard-chips span {
  font-family: 'Montserrat', sans-serif;
  font-size: .5rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--gold);
  background: rgba(232,201,122,.08);
  border: 1px solid rgba(232,201,122,.2);
  padding: .22rem .6rem;
  border-radius: 100px;
  transition: background .2s, border-color .2s;
}

.rcard:hover .rcard-chips span {
  background: rgba(232,201,122,.13);
  border-color: rgba(232,201,122,.35);
}

/* footer row */
.rcard-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .5rem;
  border-top: 1px solid rgba(232,201,122,.1);
  padding-top: 1rem;
  margin-top: auto;
}

.rcard-price-block { line-height: 1; }

.rcard-price {
  font-family: 'Ubuntu', sans-serif;
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--gold);
}

.rcard-per {
  font-family: 'Montserrat', sans-serif;
  font-size: .5rem;
  font-weight: 500;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--faint);
  margin-top: 3px;
}

.rcard-btn {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  background: var(--gold);
  color: var(--primary);
  font-family: 'Montserrat', sans-serif;
  font-size: .58rem;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  padding: .6rem 1.1rem;
  border-radius: 2px;
  text-decoration: none;
  white-space: nowrap;
  flex-shrink: 0;
  transition: background .22s, transform .2s, box-shadow .22s;
  box-shadow: 0 3px 14px rgba(232,201,122,.28);
}

.rcard-btn svg {
  width: 11px;
  height: 11px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2.5;
}

.rcard-btn:hover {
  background: var(--gold2);
  transform: translateY(-2px);
  box-shadow: 0 7px 22px rgba(232,201,122,.4);
}


/* ══════════════════════════════════════════════════════════
   INCLUDED WITH EVERY ROOM — standalone section
   ══════════════════════════════════════════════════════════ */

.included-sec {
  background: var(--forest);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  padding: 6rem 1.5rem;
  position: relative;
  overflow: hidden;
}

/* subtle radial glow top-right */
.included-sec::before {
  content: '';
  position: absolute;
  top: -120px;
  right: -120px;
  width: 600px;
  height: 600px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(232,201,122,.055) 0%, transparent 68%);
  pointer-events: none;
}

.included-inner {
  max-width: 1240px;
  margin: 0 auto;
}

.included-head {
  text-align: center;
  margin-bottom: 4rem;
}

.included-sub {
  font-family: 'Montserrat', sans-serif;
  font-size: .84rem;
  line-height: 1.85;
  color: rgba(245,237,216,.6);
  max-width: 540px;
  margin: 1.2rem auto 0;
}

/* ── 4-col masonry-style grid, last item is CTA ── */
.inc-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: rgba(232,201,122,.08);
  border: 1px solid rgba(232,201,122,.1);
  border-radius: 6px;
  overflow: hidden;
}

.inc-card {
  background: rgba(3,26,20,.92);
  padding: 2rem 1.6rem;
  display: flex;
  flex-direction: column;
  gap: .7rem;
  position: relative;
  transition: background .3s;
  overflow: hidden;
}

.inc-card::after {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
  transform: scaleX(0);
  transition: transform .4s ease;
}

.inc-card:hover { background: rgba(4,35,26,.98); }
.inc-card:hover::after { transform: scaleX(1); }

.inc-ico {
  width: 46px;
  height: 46px;
  border-radius: 4px;
  background: rgba(232,201,122,.08);
  border: 1px solid rgba(232,201,122,.18);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: background .3s, border-color .3s;
}

.inc-card:hover .inc-ico {
  background: rgba(232,201,122,.14);
  border-color: rgba(232,201,122,.4);
}

.inc-ico svg {
  width: 20px;
  height: 20px;
  stroke: var(--gold);
  fill: none;
  stroke-width: 1.8;
}

.inc-card h4 {
  font-family: 'Ubuntu', sans-serif;
  font-size: .95rem;
  font-weight: 500;
  color: var(--cream);
  line-height: 1.25;
}

.inc-card p {
  font-family: 'Montserrat', sans-serif;
  font-size: .68rem;
  line-height: 1.8;
  color: rgba(245,237,216,.5);
}

/* ── CTA card (last) ── */
.inc-card--cta {
  background: linear-gradient(145deg, rgba(232,201,122,.14), rgba(232,201,122,.04));
  border: none;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 0;
  padding: 2.2rem 1.8rem;
}

.inc-card--cta::after { display: none; }
.inc-card--cta:hover { background: linear-gradient(145deg, rgba(232,201,122,.18), rgba(232,201,122,.07)); }

.inc-cta-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .85rem;
}

.inc-cta-star {
  font-size: 1.1rem;
  color: var(--gold);
  line-height: 1;
}

.inc-card--cta h4 {
  font-family: 'Ubuntu', sans-serif;
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--cream);
  line-height: 1.3;
  text-align: center;
}

.inc-card--cta p {
  font-size: .68rem;
  color: rgba(245,237,216,.55);
  text-align: center;
}

.inc-cta-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--gold);
  color: var(--primary);
  font-family: 'Montserrat', sans-serif;
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
  padding: .72rem 1.6rem;
  border-radius: 2px;
  text-decoration: none;
  width: 100%;
  box-shadow: 0 4px 18px rgba(232,201,122,.3);
  transition: background .22s, transform .2s;
}

.inc-cta-btn:hover {
  background: var(--gold2);
  transform: translateY(-2px);
}

.inc-cta-call {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .45rem;
  background: transparent;
  border: 1px solid rgba(232,201,122,.3);
  color: var(--gold);
  font-family: 'Montserrat', sans-serif;
  font-size: .6rem;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  padding: .65rem 1.2rem;
  border-radius: 2px;
  text-decoration: none;
  width: 100%;
  transition: background .22s, border-color .22s, color .22s;
}

.inc-cta-call svg {
  width: 12px;
  height: 12px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2.2;
}

.inc-cta-call:hover {
  background: rgba(232,201,122,.1);
  border-color: var(--gold);
  color: var(--gold2);
}


/* ══════════════════════════════════════════════════════════
   RESPONSIVE
   ══════════════════════════════════════════════════════════ */

@media (max-width: 1100px) {
  .room-cards {
    grid-template-columns: repeat(2, 1fr);
  }
  .rcard:nth-child(2) { border-right: none; }
  .rcard:nth-child(3) { border-right: 1px solid rgba(232,201,122,.1); }
  .rcard:nth-child(1),
  .rcard:nth-child(2) {
    border-bottom: 1px solid rgba(232,201,122,.1);
  }
  .rcard:nth-child(3),
  .rcard:nth-child(4) { border-right: none; }
  .rcard:nth-child(3) { border-right: 1px solid rgba(232,201,122,.1); }

  .inc-grid {
    grid-template-columns: repeat(3, 1fr);
  }
  .inc-card--cta {
    grid-column: 1 / -1;
  }
}

@media (max-width: 768px) {
  .room-cards {
    grid-template-columns: 1fr 1fr;
  }
  .rcard:nth-child(odd)  { border-right: 1px solid rgba(232,201,122,.1); }
  .rcard:nth-child(even) { border-right: none; }
  .rcard:not(:nth-last-child(-n+2)) {
    border-bottom: 1px solid rgba(232,201,122,.1);
  }

  .rcard-img { height: 170px; }

  .inc-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .inc-card--cta {
    grid-column: 1 / -1;
  }
}

@media (max-width: 520px) {
  .room-cards {
    grid-template-columns: 1fr;
  }
  .rcard { border-right: none !important; }
  .rcard:not(:last-child) {
    border-bottom: 1px solid rgba(232,201,122,.1);
  }

  .inc-grid {
    grid-template-columns: 1fr;
  }
  .inc-card--cta { grid-column: 1; }

  .rcard-chips { display: none; }
}

/* ── 10. CONTACT / LEAD FORM ── */
.lead-sec {
	background: var(--forest);
	border-top: 1px solid var(--border);
	border-bottom: 1px solid var(--border);
	position: relative;
	overflow: hidden;
}

.lead-sec::before {
	content: '';
	position: absolute;
	top: -200px;
	right: -200px;
	width: 700px;
	height: 700px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(232, 201, 122, .05) 0%, transparent 70%);
	pointer-events: none;
	z-index: 0;
}

.lead-header {
	position: relative;
	z-index: 1;
	text-align: center;
	padding: 5rem 1.5rem 3.5rem;
	border-bottom: 1px solid var(--border);
}

.lead-subtitle {
	font-family: 'Montserrat', sans-serif;
	font-size: .9rem;
	line-height: 1.8;
	color: var(--mist);
	margin-top: 1.2rem;
	max-width: 560px;
	margin-left: auto;
	margin-right: auto;
}

.lead-main {
	position: relative;
	z-index: 1;
	max-width: 1200px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: 1fr 1.15fr;
	min-height: 600px;
}

.lead-left-panel {
	padding: 3.5rem 3rem 3.5rem 2rem;
	border-right: 1px solid var(--border);
	display: flex;
	flex-direction: column;
	gap: 2.5rem;
}

.obox {
	background: linear-gradient(135deg, rgba(232, 201, 122, .1), rgba(232, 201, 122, .04));
	border: 1px solid rgba(232, 201, 122, .28);
	border-radius: 6px;
	padding: 1.8rem;
	text-align: center;
	position: relative;
	overflow: hidden;
}

.obox-inner {
	position: relative;
	z-index: 1;
}

.olbl {
	font-family: 'Montserrat', sans-serif;
	font-size: .6rem;
	font-weight: 700;
	letter-spacing: .28em;
	text-transform: uppercase;
	color: var(--gold);
	margin-bottom: 1.1rem;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .5rem;
}

.olbl svg {
	width: 13px;
	height: 13px;
	stroke: var(--gold);
	fill: none;
	stroke-width: 2;
}

.obox-deal {
	font-family: 'Ubuntu', sans-serif;
	font-size: 1.05rem;
	font-weight: 500;
	color: var(--cream);
	margin-bottom: 1.2rem;
	line-height: 1.5;
}

.obox-deal strong {
	color: var(--gold2);
}

.cd {
	display: flex;
	justify-content: center;
	gap: .7rem;
	margin-bottom: 1.2rem;
}

.cdb {
	background: rgba(4, 51, 41, .7);
	border: 1px solid rgba(232, 201, 122, .22);
	border-radius: 4px;
	padding: .7rem 1.1rem;
	text-align: center;
	min-width: 70px;
}

.cdn {
	font-family: 'Ubuntu', sans-serif;
	font-size: 2rem;
	font-weight: 700;
	color: var(--gold);
	line-height: 1;
}

.cdl {
	font-family: 'Montserrat', sans-serif;
	font-size: .52rem;
	font-weight: 600;
	letter-spacing: .15em;
	text-transform: uppercase;
	color: var(--faint);
	margin-top: .25rem;
}

.obox-cta {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	background: var(--gold);
	color: var(--primary);
	font-family: 'Montserrat', sans-serif;
	font-size: .65rem;
	font-weight: 700;
	letter-spacing: .18em;
	text-transform: uppercase;
	padding: .65rem 1.6rem;
	border-radius: 2px;
	border: none;
	cursor: pointer;
	transition: background .25s, transform .2s;
}

.obox-cta:hover {
	background: var(--gold2);
	transform: translateY(-1px);
}

.perks-title {
	font-family: 'Montserrat', sans-serif;
	font-size: .6rem;
	font-weight: 700;
	letter-spacing: .28em;
	text-transform: uppercase;
	color: rgba(232, 201, 122, .6);
	margin-bottom: 1.2rem;
}

.perks {
	display: flex;
	flex-direction: column;
	gap: 1.1rem;
}

.perk {
	display: flex;
	align-items: flex-start;
	gap: 1rem;
}

.pico {
	width: 42px;
	height: 42px;
	flex-shrink: 0;
	border-radius: 3px;
	background: rgba(232, 201, 122, .07);
	border: 1px solid rgba(232, 201, 122, .16);
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background .3s, border-color .3s;
}

.perk:hover .pico {
	background: rgba(232, 201, 122, .14);
	border-color: rgba(232, 201, 122, .38);
}

.pico svg {
	width: 18px;
	height: 18px;
	stroke: var(--gold);
	fill: none;
	stroke-width: 1.8;
}

.ptxt h5 {
	font-family: 'Ubuntu', sans-serif;
	font-size: .92rem;
	font-weight: 500;
	color: var(--cream);
}

.ptxt p {
	font-family: 'Montserrat', sans-serif;
	font-size: .72rem;
	color: var(--faint);
	margin-top: .12rem;
	line-height: 1.5;
}

.contact-channels {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: .75rem;
}

.cc {
	display: flex;
	align-items: center;
	gap: .75rem;
	background: rgba(232, 201, 122, .04);
	border: 1px solid var(--border);
	border-radius: 4px;
	padding: .9rem;
	text-decoration: none;
	transition: border-color .25s, background .25s;
}

.cc:hover {
	border-color: rgba(232, 201, 122, .38);
	background: rgba(232, 201, 122, .07);
}

.cc-ico {
	width: 36px;
	height: 36px;
	flex-shrink: 0;
	border-radius: 3px;
	background: rgba(232, 201, 122, .1);
	border: 1px solid rgba(232, 201, 122, .18);
	display: flex;
	align-items: center;
	justify-content: center;
}

.cc-ico svg {
	width: 16px;
	height: 16px;
	stroke: var(--gold);
	fill: none;
	stroke-width: 1.8;
}

.cc-label {
	font-family: 'Montserrat', sans-serif;
	font-size: .58rem;
	font-weight: 600;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--faint);
}

.cc-value {
	font-family: 'Ubuntu', sans-serif;
	font-size: .82rem;
	font-weight: 500;
	color: var(--cream);
	margin-top: .1rem;
}

.lead-right-panel {
	padding: 3.5rem 2rem 3.5rem 3rem;
	display: flex;
	flex-direction: column;
}

.form-header {
	margin-bottom: 1.8rem;
}

.form-header h3 {
	font-family: 'Ubuntu', sans-serif;
	font-size: 1.6rem;
	font-weight: 500;
	color: var(--cream);
	line-height: 1.2;
}

.form-header h3 em {
	font-weight: 300;
	font-style: italic;
	color: var(--gold2);
}

.form-header p {
	font-family: 'Montserrat', sans-serif;
	font-size: .76rem;
	color: var(--mist);
	margin-top: .5rem;
	line-height: 1.6;
}

.lform {
	display: flex;
	flex-direction: column;
	gap: .9rem;
}

.f2 {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: .9rem;
}

.fg2 {
	display: flex;
	flex-direction: column;
	gap: .4rem;
}

.fl2 {
	font-family: 'Montserrat', sans-serif;
	font-size: .57rem;
	font-weight: 700;
	letter-spacing: .22em;
	text-transform: uppercase;
	color: rgba(232, 201, 122, .65);
}

.fi2 {
	background: rgba(255, 255, 255, .04);
	border: 1px solid var(--border);
	border-radius: 3px;
	padding: .78rem 1rem;
	color: var(--cream);
	font-family: 'Montserrat', sans-serif;
	font-size: .85rem;
	outline: none;
	width: 100%;
	transition: border-color .25s, background .25s;
	appearance: none;
	resize: none;
}

.fi2::placeholder {
	color: rgba(245, 237, 216, .18);
}

.fi2:focus {
	border-color: var(--gold);
	background: rgba(232, 201, 122, .06);
	box-shadow: 0 0 0 3px rgba(232, 201, 122, .1);
}

.fi2 option {
	background: var(--primary);
}

.btn {
	width: 100%;
	padding: 1rem;
	background: linear-gradient(135deg, var(--gold), var(--gold2));
	color: var(--primary);
	font-family: 'Montserrat', sans-serif;
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .22em;
	text-transform: uppercase;
	border: none;
	border-radius: 3px;
	cursor: pointer;
	transition: opacity .25s, transform .2s;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .6rem;
	box-shadow: 0 4px 24px rgba(232, 201, 122, .28);
}

.btn:hover {
	opacity: .9;
	transform: translateY(-2px);
}

.btn svg {
	width: 15px;
	height: 15px;
	stroke: currentColor;
	fill: none;
	stroke-width: 2.5;
}

.form-privacy {
	text-align: center;
	font-size: .65rem;
	color: var(--faint);
	margin-top: .4rem;
	font-family: 'Montserrat', sans-serif;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .3rem;
}

.form-privacy svg {
	width: 10px;
	height: 10px;
	stroke: var(--faint);
	fill: none;
	stroke-width: 2;
}


/* ── 11. TESTIMONIALS ── */
.tgrid {
	max-width: 1100px;
	margin: 3.5rem auto 0;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
}

.tc {
	background: var(--panel);
	border: 1px solid var(--border);
	border-radius: 4px;
	padding: 2.2rem;
	transition: border-color .3s, transform .3s, box-shadow .3s;
	position: relative;
	overflow: hidden;
}

.tc::before {
	content: '"';
	position: absolute;
	top: .3rem;
	right: 1.5rem;
	font-family: 'Ubuntu', sans-serif;
	font-size: 6rem;
	font-weight: 700;
	color: rgba(232, 201, 122, .07);
	line-height: 1;
	pointer-events: none;
}

.tc:hover {
	border-color: var(--borderhov);
	transform: translateY(-5px);
	box-shadow: 0 20px 50px rgba(0, 0, 0, .4);
}

.stars {
	color: var(--gold);
	font-size: .85rem;
	letter-spacing: .1em;
	margin-bottom: 1rem;
}

.ttext {
	font-family: 'Ubuntu', sans-serif;
	font-size: 1rem;
	font-weight: 300;
	font-style: italic;
	color: rgba(245, 237, 216, .8);
	line-height: 1.75;
	margin-bottom: 1.5rem;
}

.tauth {
	display: flex;
	align-items: center;
	gap: .9rem;
}

.tav {
	width: 42px;
	height: 42px;
	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: 1rem;
	font-weight: 700;
	color: var(--primary);
}

.tname {
	font-family: 'Ubuntu', sans-serif;
	font-size: .88rem;
	font-weight: 500;
	color: var(--cream);
}

.tloc {
	font-family: 'Montserrat', sans-serif;
	font-size: .68rem;
	color: var(--faint);
	margin-top: .1rem;
}


/* ── 12. ABOUT ── */
.about-sec {
	border-top: 1px solid var(--border);
	padding: 5rem 2rem;
	position: relative;
	overflow: hidden;
}

/* subtle radial glows */
.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;
}

/* ── IMAGE STACK ── */
.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;
}

/* second floating image — bottom-right overlap */
.av-second {
	position: absolute;
	bottom: 0;
	right: -2.5rem;
	width: 52%;
	aspect-ratio: 4/3;
	border-radius: 4px;
	overflow: hidden;
	border: 3px solid var(--forest);
	box-shadow: 0 16px 48px rgba(0,0,0,.6);
	transition: transform .4s ease;
}

.av-second:hover { transform: translateY(-4px); }

.av-second img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	filter: brightness(.78);
	transition: transform .8s ease;
}

.av-second:hover img { transform: scale(1.06); }

/* floating badges */
.av-badge {
	position: absolute;
	border-radius: 4px;
	text-align: center;
	box-shadow: 0 10px 32px rgba(0,0,0,.45);
	z-index: 5;
}

.av-badge--est {
	top: 1.5rem;
	left: -1.8rem;
	background: var(--gold);
	color: var(--primary);
	padding: 1rem 1.3rem;
}

.av-badge--rate {
	top: 50%;
	right: -1.5rem;
	transform: translateY(-50%);
	background: var(--panel);
	border: 1px solid var(--border);
	color: var(--cream);
	padding: .9rem 1.2rem;
}

.av-badge-yr {
	font-family: 'Ubuntu', sans-serif;
	font-size: 2rem;
	font-weight: 700;
	line-height: 1;
}

.av-badge-star {
	font-family: 'Ubuntu', sans-serif;
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--gold);
	line-height: 1;
}

.av-badge-lbl {
	font-family: 'Montserrat', sans-serif;
	font-size: .55rem;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	margin-top: .3rem;
	opacity: .75;
}

.av-badge--est .av-badge-lbl { color: var(--primary); }
.av-badge--rate .av-badge-lbl { color: var(--faint); }

/* altitude pill */
.av-altitude {
	position: absolute;
	bottom: .5rem;
	left: 50%;
	transform: translateX(-50%);
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	font-family: 'Montserrat', sans-serif;
	font-size: .56rem;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--gold);
	background: rgba(2,14,10,.88);
	border: 1px solid rgba(232,201,122,.25);
	padding: .4rem 1rem;
	border-radius: 100px;
	white-space: nowrap;
	backdrop-filter: blur(6px);
	z-index: 5;
}

.av-altitude svg {
	width: 12px;
	height: 12px;
	stroke: var(--gold);
	fill: none;
	stroke-width: 2;
	flex-shrink: 0;
}

/* ── TEXT COLUMN ── */
.about-text {
	display: flex;
	flex-direction: column;
}

.about-text .slbl { text-align: left; }
.about-text .stit { text-align: left; }
.about-text .sorn { justify-content: flex-start; margin-left: 0; }

.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;
	letter-spacing: 0px;
}

.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;
}

/* ── 4 pillars ── */
.about-pillars {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: .85rem;
	margin-top: 1.8rem;
}

.about-pillar {
	display: flex;
	align-items: flex-start;
	gap: .8rem;
	padding: .95rem 1rem;
	background: rgba(232,201,122,.04);
	border: 1px solid rgba(232,201,122,.1);
	border-radius: 4px;
	transition: background .3s, border-color .3s;
	position: relative;
	overflow: hidden;
}

.about-pillar::before {
	content: '';
	position: absolute;
	top: 0; left: 0; right: 0;
	height: 2px;
	background: linear-gradient(90deg, transparent, var(--gold), transparent);
	transform: scaleX(0);
	transition: transform .4s ease;
}

.about-pillar:hover {
	background: rgba(232,201,122,.07);
	border-color: rgba(232,201,122,.25);
}

.about-pillar:hover::before { transform: scaleX(1); }

.ap-ico {
	width: 34px;
	height: 34px;
	flex-shrink: 0;
	border-radius: 3px;
	background: rgba(232,201,122,.1);
	border: 1px solid rgba(232,201,122,.2);
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background .3s;
	margin-top: 1px;
}

.about-pillar:hover .ap-ico { background: rgba(232,201,122,.18); }

.ap-ico svg {
	width: 15px;
	height: 15px;
	stroke: var(--gold);
	fill: none;
	stroke-width: 1.8;
}

.ap-text h5 {
	font-family: 'Ubuntu', sans-serif;
	font-size: .88rem;
	font-weight: 600;
	color: var(--cream);
	margin-bottom: .18rem;
}

.ap-text p {
	font-family: 'Montserrat', sans-serif;
	font-size: .62rem;
	line-height: 1.65;
	color: rgba(245,237,216,.48);
}

/* ── stats row ── */
.about-stats {
	display: flex;
    align-items: center;
    margin-top: 1.8rem;
    background: rgb(2 31 23);
    border: 1px solid rgba(232, 201, 122, .12);
    border-radius: 4px;
    overflow: hidden;
}

.astat {
	flex: 1;
	text-align: center;
	padding: 1.1rem .5rem;
	position: relative;
	transition: background .3s;
}

.astat::before {
	content: '';
	position: absolute;
	top: 0; left: 0; right: 0;
	height: 2px;
	background: var(--gold);
	transform: scaleX(0);
	transition: transform .35s;
}

.astat:hover { background: rgba(232,201,122,.07); }
.astat:hover::before { transform: scaleX(1); }

.astat-div {
	width: 1px;
	height: 36px;
	background: rgba(232,201,122,.12);
	flex-shrink: 0;
}

.astat-n {
	font-family: 'Ubuntu', sans-serif;
	font-size: 1.35rem;
	font-weight: 700;
	color: var(--gold);
	line-height: 1;
}

.astat-l {
	font-family: 'Montserrat', sans-serif;
	font-size: .46rem;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: rgba(245,237,216,.45);
	margin-top: .3rem;
}

/* ── nearby strip ── */
.about-nearby {
	margin-top: 1.4rem;
	padding: .9rem 1.1rem;
	background: rgba(232,201,122,.04);
	border: 1px solid rgba(232,201,122,.1);
	border-radius: 4px;
}

.an-label {
	font-family: 'Montserrat', sans-serif;
	font-size: .48rem;
	font-weight: 700;
	letter-spacing: .28em;
	text-transform: uppercase;
	color: rgba(232,201,122,.5);
	margin-bottom: .6rem;
}

.an-list {
	display: flex;
	flex-wrap: wrap;
	gap: .4rem .85rem;
}

.an-list span {
	display: inline-flex;
	align-items: center;
	gap: .35rem;
	font-family: 'Montserrat', sans-serif;
	font-size: .62rem;
	font-weight: 500;
	color: rgba(245,237,216,.58);
	transition: color .2s;
	cursor: default;
}

.an-list span:hover { color: var(--gold2); }

.an-list svg {
	width: 5px;
	height: 5px;
	fill: var(--gold);
	stroke: none;
	flex-shrink: 0;
}

/* ── action buttons ── */
.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 svg {
	width: 13px;
	height: 13px;
	stroke: currentColor;
	fill: none;
	stroke-width: 2.5;
}

.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: #ffffff;
    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: rgba(232,201,122,.1);
	border-color: var(--gold);
	color: var(--gold2);
}

/* ── RESPONSIVE ── */
@media (max-width: 1100px) {
	.about-inner { gap: 4rem; }
	.av-second { right: -1rem; width: 48%; }
	.av-badge--est { left: 0; }
	.av-badge--rate { right: 0; }
}

@media (max-width: 900px) {
	.about-inner {
		grid-template-columns: 1fr;
		gap: 3.5rem;
	}
	.about-visuals {
		max-width: 500px;
		margin: 0 auto;
	}
	.av-second { right: 0; }
}

@media (max-width: 600px) {
	.about-sec { padding: 5rem 1.2rem; }
	.about-pillars { grid-template-columns: 1fr; }
	.about-stats { flex-wrap: wrap; }
	.astat { min-width: 45%; }
	.astat-div { display: none; }
	.about-actions { flex-direction: column; }
	.about-btn-primary,
	.about-btn-outline { justify-content: center; }
	.av-second { display: none; }
	.av-badge--rate { display: none; }
}


/* ── 13. CTA ── */
.cta-sec {
	padding: 7rem 1.5rem;
	text-align: center;
	background: linear-gradient(135deg, rgba(4, 51, 41, .93), rgba(6, 82, 64, .86)), url('https://images.unsplash.com/photo-1571896349842-33c89424de2d?w=1400&q=80') center/cover;
	border-top: 1px solid var(--border);
}

.cta-sec h2 {
	font-family: 'Ubuntu', sans-serif;
	font-size: clamp(2rem, 5vw, 3.5rem);
	font-weight: 700;
	color: var(--cream);
	margin-bottom: .6rem;
	line-height: 1.1;
}

.cta-sec h2 em {
	font-weight: 300;
	font-style: italic;
	color: var(--gold2);
}

.cta-sec p {
	font-family: 'Montserrat', sans-serif;
	font-size: .9rem;
	color: var(--mist);
	margin-bottom: 2.5rem;
	line-height: 1.7;
}

.cbtns {
	display: flex;
	gap: 1rem;
	justify-content: center;
	flex-wrap: wrap;
}

.bp {
	display: inline-flex;
	align-items: center;
	gap: .6rem;
	background: linear-gradient(135deg, var(--gold), var(--gold2));
	color: var(--primary);
	font-family: 'Montserrat', sans-serif;
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .2em;
	text-transform: uppercase;
	padding: 1rem 2.5rem;
	border-radius: 3px;
	border: none;
	cursor: pointer;
	text-decoration: none;
	transition: opacity .25s, transform .2s;
	box-shadow: 0 4px 24px rgba(232, 201, 122, .28);
}

.bp:hover {
	opacity: .9;
	transform: translateY(-2px);
}

.bo {
	display: inline-flex;
	align-items: center;
	gap: .6rem;
	background: transparent;
	color: var(--cream);
	font-family: 'Montserrat', sans-serif;
	font-size: .72rem;
	font-weight: 600;
	letter-spacing: .2em;
	text-transform: uppercase;
	padding: 1rem 2.5rem;
	border-radius: 3px;
	border: 1px solid rgba(245, 237, 216, .25);
	text-decoration: none;
	transition: border-color .25s, color .25s;
}

.bo:hover {
	border-color: var(--gold);
	color: var(--gold);
}

.bp svg,
.bo svg {
	width: 15px;
	height: 15px;
	stroke: currentColor;
	fill: none;
	stroke-width: 2.5;
}

/* ── 14. FOOTER ── */
footer {
	position: relative;
	border-top: 1px solid var(--border);
	padding: 5rem 1.5rem 2.5rem;
	overflow: hidden;
}

footer::before {
	content: '';
	position: absolute;
	inset: 0;
	background: url('https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=1600&q=85') center 30%/cover no-repeat;
	opacity: .1;
	z-index: 0;
}

footer::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, rgba(4, 51, 41, .97) 0%, rgba(4, 51, 41, .88) 40%, rgba(4, 51, 41, .94) 100%);
	z-index: 1;
}

.footer-mtn {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 1;
	pointer-events: none;
}

.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: var(--faint);
	margin-top: .7rem;
	max-width: 260px;
}

.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;
}

.fs:hover {
	border-color: var(--gold);
	color: var(--gold);
	background: rgba(232, 201, 122, .07);
}

.fs svg {
	width: 16px;
	height: 16px;
	stroke: currentColor;
	fill: none;
	stroke-width: 1.8;
}

.fc h6 {
	font-family: 'Ubuntu', sans-serif;
	font-size: .62rem;
	font-weight: 700;
	letter-spacing: .25em;
	text-transform: uppercase;
	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: var(--faint);
	text-decoration: none;
	transition: color .25s;
	display: flex;
	align-items: center;
	gap: .5rem;
}

.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;
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 1rem;
}

.fbot p {
	font-family: 'Montserrat', sans-serif;
	font-size: .72rem;
	color: rgba(245, 237, 216, .25);
}


/* ── 15. STICKY FLOATING BUTTONS ── */
.stickys {
	position: fixed;
	bottom: 20px;
	left: 16px;
	z-index: 9999;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.fab {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	font-family: 'Montserrat', sans-serif;
	text-decoration: none;
	border: none;
	cursor: pointer;
	transition: all .28s ease;
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	box-shadow: 0 10px 30px rgba(0, 0, 0, .25), inset 0 0 0 1px rgba(255, 255, 255, .1);
}

.fab svg {
	width: 22px;
	height: 22px;
	stroke: currentColor;
	fill: none;
	stroke-width: 2.4;
}

.fab:hover {
	transform: translateY(-4px) scale(1.06);
	box-shadow: 0 16px 40px rgba(0, 0, 0, .35), inset 0 0 0 1px rgba(255, 255, 255, .15);
}

.fab:active {
	transform: scale(.96);
}

.fc1 {
	background: linear-gradient(135deg, #e8c97a, #cfa94a);
	color: #000;
	box-shadow: 0 10px 28px rgba(232, 201, 122, .35), inset 0 0 0 1px rgba(255, 255, 255, .2);
}

.fw1 {
	background: linear-gradient(135deg, #25D366, #1ebe5d);
	color: #fff;
	box-shadow: 0 10px 28px rgba(37, 211, 102, .45), inset 0 0 0 1px rgba(255, 255, 255, .2);
	animation: whatsappPulse 2.6s infinite;
}

@keyframes whatsappPulse {
	0%   { box-shadow: 0 0 0 0 rgba(37, 211, 102, .55), 0 10px 28px rgba(37, 211, 102, .45); }
	70%  { box-shadow: 0 0 0 18px rgba(37, 211, 102, 0), 0 10px 28px rgba(37, 211, 102, .45); }
	100% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0), 0 10px 28px rgba(37, 211, 102, .45); }
}

@media(max-width:600px) {
	.stickys { bottom: 16px; left: 12px; gap: 10px; }
	.fab { width: 46px; height: 46px; }
	.fab svg { width: 20px; height: 20px; }
}

@media(max-width:380px) {
	.fab { width: 42px; height: 42px; }
	.fab svg { width: 18px; height: 18px; }
}


/* ── 16. SCROLL REVEAL ── */
.reveal {
	opacity: 0;
	transform: translateY(32px);
	transition: opacity .75s ease, transform .75s ease;
}

.reveal.visible {
	opacity: 1;
	transform: translateY(0);
}


/* ══════════════════════════════════════════════════════════════
   17. RESPONSIVE
   ══════════════════════════════════════════════════════════════ */
@media (max-width: 1100px) {
	.hero-body {
		grid-template-columns: 1fr 350px;
		padding: 78px 1.8rem 1.8rem;
		gap: 1.5rem;
	}

	.rooms-grid {
		grid-template-rows: 240px 240px 200px;
	}
}

@media (max-width: 1024px) {
	.rooms-grid {
		grid-template-columns: 1fr 1fr;
		grid-template-rows: 300px 300px 300px;
	}

	.rc-big  { grid-column: 1; grid-row: 1/3; }
	.rc-tr1  { grid-column: 2; grid-row: 1; }
	.rc-tr2  { grid-column: 2; grid-row: 2; }
	.rc-rbot { grid-column: 1/-1; grid-row: 3; }

	.lead-main {
		grid-template-columns: 1fr;
	}

	.lead-left-panel {
		border-right: none;
		border-bottom: 1px solid var(--border);
		padding: 2.5rem;
	}

	.lead-right-panel {
		padding: 2.5rem;
	}

	.contact-channels {
		grid-template-columns: repeat(4, 1fr);
	}
}

@media (max-width: 900px) {
	.hero {
		height: auto;
		min-height: 100svh;
	}

	.hero-body {
		grid-template-columns: 1fr;
		padding: 80px 1.4rem 2rem;
		align-items: flex-start;
	}

	.hero-form-card {
		display: none;
	}

	.hero-marquee-wrap {
		display: none;
	}

	.hero-h1 {
		font-size: clamp(1.8rem, 7vw, 3rem);
		min-height: auto;
	}

	.hero-stats-row {
		max-width: 100%;
	}

	.am-inner {
		grid-template-columns: 1fr;
	}

	.about-inner {
		grid-template-columns: 1fr;
		gap: 3rem;
	}

	.asince { left: 0; }
	.abadge { right: 0; }

	.fg-grid {
		grid-template-columns: 1fr 1fr;
	}
}

@media (max-width: 768px) {
	.nav-links,
	.nav-cta {
		display: none;
	}

	#hamburger {
		display: flex;
	}

	#navbar {
		padding: 0 1.4rem;
	}

	.tgrid {
		grid-template-columns: 1fr;
	}

	.am-right {
		grid-template-columns: 1fr 1fr;
	}

	.f2 {
		grid-template-columns: 1fr;
	}

	.rooms-grid {
		grid-template-columns: 1fr;
		grid-template-rows: auto;
	}

	.rc-big,
	.rc-tr1,
	.rc-tr2,
	.rc-rbot {
		grid-column: 1;
		grid-row: auto;
		height: 260px;
	}

	.rc-rbot .rinfo {
		flex-direction: column;
		align-items: flex-start;
		gap: .4rem;
	}

	.rc-bot-right {
		margin-left: 0;
	}

	.contact-channels {
		grid-template-columns: 1fr 1fr;
	}
}

@media (max-width: 480px) {
	.fg-grid {
		grid-template-columns: 1fr;
	}

	.am-right {
		grid-template-columns: 1fr;
	}

	.contact-channels {
		grid-template-columns: 1fr;
	}

	.hero {
		min-height: 100svh;
	}
}

/* ══════════════════════════════════════════════════════════
   GALLERY SECTION
   ══════════════════════════════════════════════════════════ */

.gallery-sec {
    background: #fffcf5;
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    padding: 4rem 0 4rem;
    overflow: hidden;
    position: relative;
}

.gallery-head {
  text-align: center;
  padding: 0 1.5rem;
  margin-bottom: 2.5rem;
}

.gallery-sub {
  font-family: 'Montserrat', sans-serif;
  font-size: .82rem;
  line-height: 1.85;
  color: rgba(245,237,216,.5);
  max-width: 500px;
  margin: 1rem auto 0;
}

/* scroll hint */
.gallery-hint {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: .45rem;
  padding: 0 2.5rem;
  font-family: 'Montserrat', sans-serif;
  font-size: .56rem;
  font-weight: 600;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: rgba(232,201,122,.45);
  margin-bottom: 1.2rem;
  animation: hintPulse 2.5s ease-in-out infinite;
}

.gallery-hint svg {
  width: 14px;
  height: 14px;
  stroke: var(--gold);
  fill: none;
  stroke-width: 2;
}

@keyframes hintPulse {
  0%, 100% { opacity: .45; transform: translateX(0); }
  50%       { opacity: .9;  transform: translateX(5px); }
}

/* ── horizontal scroll container ── */
.gallery-track-wrap {
  overflow: hidden;
  padding: 0 0 1.5rem;
  /* left/right fade edges */
  -webkit-mask-image: linear-gradient(
    to right,
    transparent 0%,
    black 6%,
    black 94%,
    transparent 100%
  );
  mask-image: linear-gradient(
    to right,
    transparent 0%,
    black 6%,
    black 94%,
    transparent 100%
  );
  cursor: grab;
  position: relative;
}

.gallery-track-wrap::-webkit-scrollbar { display: none; }
.gallery-track-wrap.dragging { cursor: grabbing; }
.gallery-track-wrap.paused .gallery-track { animation-play-state: paused; }

.gallery-track {
  display: flex;
  align-items: stretch;
  gap: 10px;
  height: 420px;
  width: max-content;
  /* auto-scroll marquee */
  animation: galleryMarquee 60s linear infinite;
  will-change: transform;
}

@keyframes galleryMarquee {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* ── individual items ── */
.gitem {
  position: relative;
  overflow: hidden;
  border-radius: 4px;
  cursor: pointer;
  flex-shrink: 0;
  background: var(--primary);
}

/* size variants */
.gitem--tall  { width: 280px; }
.gitem--wide  { width: 580px; }
.gitem--sq    { width: 360px; }

.gitem img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: brightness(.8);
  transition: transform .75s cubic-bezier(.4,0,.2,1), filter .4s;
  will-change: transform;
}

.gitem:hover img {
  transform: scale(1.06);
  filter: brightness(.55);
}

/* overlay on hover */
.gitem-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top,
    rgba(2,14,10,.85) 0%,
    rgba(2,14,10,.1)  50%,
    transparent       100%);
  opacity: 0;
  transition: opacity .35s;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .75rem;
}

.gitem:hover .gitem-overlay { opacity: 1; }

/* zoom icon */
.gitem-zoom {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: rgba(232,201,122,.15);
  border: 1px solid rgba(232,201,122,.4);
  display: flex;
  align-items: center;
  justify-content: center;
  transform: scale(.7);
  transition: transform .3s, background .3s;
  backdrop-filter: blur(4px);
}

.gitem:hover .gitem-zoom { transform: scale(1); }
.gitem-zoom:hover { background: rgba(232,201,122,.3); }

.gitem-zoom svg {
  width: 18px;
  height: 18px;
  stroke: var(--gold);
  fill: none;
  stroke-width: 2;
}

.gitem-cap {
  font-family: 'Montserrat', sans-serif;
  font-size: .58rem;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--gold2);
  text-align: center;
  padding: 0 1rem;
  transform: translateY(6px);
  transition: transform .35s;
}

.gitem:hover .gitem-cap { transform: translateY(0); }

/* ── marquee controls bar ── */
.gallery-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  margin-top: 1.8rem;
  padding: 0 2.5rem;
}

.gnav-btn {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: rgba(232,201,122,.07);
  border: 1px solid rgba(232,201,122,.22);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background .25s, border-color .25s, transform .2s;
  flex-shrink: 0;
}

.gnav-btn:hover {
  background: rgba(232,201,122,.18);
  border-color: var(--gold);
  transform: scale(1.08);
}

.gnav-btn svg {
  width: 16px;
  height: 16px;
  stroke: var(--gold);
  fill: none;
  stroke-width: 2;
}

/* pause / play toggle */
.gnav-pause {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: rgba(232,201,122,.1);
  border: 1px solid rgba(232,201,122,.3);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background .25s, border-color .25s, transform .2s;
  flex-shrink: 0;
}

.gnav-pause:hover {
  background: rgba(232,201,122,.2);
  border-color: var(--gold);
  transform: scale(1.08);
}

.gnav-pause svg {
  width: 14px;
  height: 14px;
  stroke: var(--gold);
  fill: none;
  stroke-width: 2.2;
}

/* speed label */
.gallery-speed {
  display: flex;
  align-items: center;
  gap: .6rem;
  font-family: 'Montserrat', sans-serif;
  font-size: .54rem;
  font-weight: 600;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: rgba(232,201,122,.45);
}

.gspeed-btn {
  background: none;
  border: 1px solid rgba(232,201,122,.18);
  color: rgba(232,201,122,.45);
  font-family: 'Montserrat', sans-serif;
  font-size: .52rem;
  font-weight: 700;
  letter-spacing: .1em;
  padding: .3rem .65rem;
  border-radius: 100px;
  cursor: pointer;
  transition: border-color .2s, color .2s, background .2s;
}

.gspeed-btn:hover,
.gspeed-btn.active {
  border-color: var(--gold);
  color: var(--gold);
  background: rgba(232,201,122,.08);
}

/* progress dots */
.gallery-dots {
  display: flex;
  gap: .4rem;
  align-items: center;
}

.gdot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: rgba(232,201,122,.2);
  border: none;
  cursor: pointer;
  transition: background .25s, transform .25s;
  padding: 0;
}

.gdot.active {
  background: var(--gold);
  transform: scale(1.4);
}


/* ══════════════════════════════════════════════════════════
   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; }
}

/* close button */
.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;
}

/* prev / next arrows */
.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:disabled {
  opacity: .2;
  cursor: not-allowed;
}

.lb-arrow svg {
  width: 20px;
  height: 20px;
  stroke: var(--gold);
  fill: none;
  stroke-width: 2;
}

/* image stage */
.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); }
}

/* loader */
.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); }
}

/* footer */
.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;
}

/* thumbnail strip */
.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);
}


/* ── RESPONSIVE ── */
@media (max-width: 768px) {
  .gallery-track { height: 320px; }
  .gitem--tall  { width: 200px; }
  .gitem--wide  { width: 380px; }
  .gitem--sq    { width: 260px; }

  .lb-stage { padding: 1rem 3.5rem; }
  .lb-footer { padding: .7rem 1rem; flex-direction: column; gap: .4rem; align-items: flex-start; }
  .lb-thumbs { padding: .6rem 1rem; }
  .lb-arrow  { width: 40px; height: 40px; }
  .lb-prev   { left: .6rem; }
  .lb-next   { right: .6rem; }
}

@media (max-width: 480px) {
  .gallery-track { height: 260px; }
  .gitem--tall  { width: 160px; }
  .gitem--wide  { width: 300px; }
  .gitem--sq    { width: 200px; }

  .lb-img-wrap img { max-height: calc(100vh - 240px); }
}