/* ============================================================
   HOTEL MALA INTERNATIONAL — Premium Luxury Hotel
   Design System & Styles  |  Newly Opened 2026
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500;600;700;900&family=Cormorant+Garant:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,600&family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500&family=Inter:wght@300;400;500;600&display=swap');

:root {
  --bg-primary:    #120909;
  --bg-secondary:  #1E0D0D;
  --bg-card:       #1A0808;
  --bg-hover:      #280E0E;
  --bg-surface:    #200A0A;
  --crimson:       #7A0000;
  --crimson-light: #9A1010;
  --crimson-dim:   rgba(122,0,0,0.18);
  --gold:          #C8A96B;
  --gold-light:    #D4AF37;
  --gold-dark:     #A8860B;
  --gold-dim:      rgba(201,170,113,0.12);
  --gold-glow:     rgba(201,170,113,0.06);
  --gold-border:   rgba(201,170,113,0.22);
  --gold-border-h: rgba(201,170,113,0.50);
  --text-primary:  #F8F6F2;
  --text-secondary:#C8C4BC;
  --text-muted:    #9A8A8A;
  --border-subtle: rgba(255,255,255,0.05);
  --border-card:   rgba(139,0,0,0.20);
  --glass-card:    rgba(139,0,0,0.05);
  --shadow-gold:   0 8px 40px rgba(201,170,113,0.15);
  --shadow-card:   0 4px 30px rgba(0,0,0,0.7);
  --ease-luxury:   cubic-bezier(0.25,0.46,0.45,0.94);
  --ease-expo:     cubic-bezier(0.16,1,0.3,1);
  --trans-fast:    0.25s cubic-bezier(0.25,0.46,0.45,0.94);
  --trans-med:     0.45s cubic-bezier(0.25,0.46,0.45,0.94);
  --trans-slow:    0.75s cubic-bezier(0.25,0.46,0.45,0.94);
  --max-w:         1340px;
  --section-py:    120px;
  --section-py-sm: 72px;
  --fs-display:    clamp(3rem,7vw,6.5rem);
  --fs-h2:         clamp(1.9rem,4vw,3.4rem);
  --radius-sm:     8px;
  --radius-md:     16px;
  --radius-lg:     24px;
}

*,*::before,*::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; overflow-x:hidden; max-width:100%; }
body { background:var(--bg-primary); color:var(--text-primary); font-family:'Inter',sans-serif; font-size:1.0625rem; line-height:1.7; overflow-x:hidden; max-width:100%; -webkit-font-smoothing:antialiased; }
body.loading { overflow:hidden; }
img { max-width:100%; height:auto; display:block; }
a { color:inherit; text-decoration:none; transition:color var(--trans-fast); }
ul { list-style:none; }

/* LOADER */
#page-loader { position:fixed; inset:0; z-index:9999; background:var(--bg-primary); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:40px; transition:opacity 0.6s,visibility 0.6s; }
#page-loader.hidden { opacity:0; visibility:hidden; pointer-events:none; }
.loader-name { font-family:'Cormorant Garant',serif; font-size:clamp(1.6rem,4vw,2.6rem); font-weight:300; letter-spacing:0.3em; color:var(--text-primary); text-transform:uppercase; opacity:0; transform:translateY(20px); animation:loaderFadeUp 0.9s var(--ease-expo) 0.3s forwards; display:block; }
.loader-tagline { font-size:0.72rem; letter-spacing:0.28em; text-transform:uppercase; color:var(--gold); margin-top:10px; opacity:0; animation:loaderFadeUp 0.9s var(--ease-expo) 0.6s forwards; display:block; text-align:center; }
.loader-bar-track { width:180px; height:1px; background:rgba(255,255,255,0.1); position:relative; overflow:hidden; }
.loader-bar-fill { position:absolute; left:0; top:0; height:100%; width:0; background:linear-gradient(90deg,var(--gold-dark),var(--gold-light)); animation:loaderBar 1.8s var(--ease-luxury) 0.4s forwards; }
@keyframes loaderFadeUp { to { opacity:1; transform:translateY(0); } }
@keyframes loaderBar    { to { width:100%; } }

/* SCROLL PROGRESS */
#scroll-progress { position:fixed; top:0; left:0; height:2px; background:linear-gradient(90deg,var(--gold-dark),var(--gold-light)); z-index:9000; width:0%; transition:width 0.1s linear; box-shadow:0 0 10px var(--gold); }

/* NAVBAR */
#navbar { position:fixed; top:0; left:0; right:0; z-index:1000; padding:26px 0; transition:padding var(--trans-med),background var(--trans-med),backdrop-filter var(--trans-med),box-shadow var(--trans-med); }
#navbar.scrolled { padding:14px 0; background:rgba(12,0,0,0.95); backdrop-filter:blur(20px) saturate(1.4); -webkit-backdrop-filter:blur(20px) saturate(1.4); box-shadow:0 1px 0 rgba(139,0,0,0.3),0 8px 32px rgba(0,0,0,0.6); }
.container { max-width:var(--max-w); margin-inline:auto; padding-inline:clamp(24px,5vw,60px); }
.navbar-inner { display:flex; align-items:center; justify-content:space-between; gap:40px; }
.navbar-logo { display:flex; flex-direction:row; align-items:center; gap:14px; line-height:1; flex-shrink:0; text-decoration:none; }
.navbar-logo-img { height:76px; width:76px; object-fit:contain; flex-shrink:0; filter:drop-shadow(0 2px 12px rgba(212,175,55,0.5)); }
.navbar-logo-text { display:flex; flex-direction:column; justify-content:center; }
.logo-main { font-family:'Cinzel',serif; font-size:1.15rem; font-weight:700; letter-spacing:0.12em; text-transform:uppercase; color:var(--text-primary); transition:color var(--trans-fast); line-height:1.2; }
.logo-sub { font-size:0.58rem; font-weight:500; letter-spacing:0.40em; text-transform:uppercase; color:var(--gold); margin-top:6px; }
.navbar-logo:hover .logo-main { color:var(--gold); }
.navbar-logo:hover .navbar-logo-img { filter:drop-shadow(0 2px 14px rgba(212,175,55,0.7)); }
.navbar-nav { display:flex; align-items:center; gap:36px; }
.navbar-nav a { font-size:0.82rem; font-weight:500; letter-spacing:0.12em; text-transform:uppercase; color:var(--text-secondary); position:relative; transition:color var(--trans-fast); }
.navbar-nav a::after { content:''; position:absolute; bottom:-4px; left:0; width:0; height:1px; background:var(--gold); transition:width var(--trans-med); }
.navbar-nav a:hover,.navbar-nav a.active { color:var(--gold); }
.navbar-nav a:hover::after,.navbar-nav a.active::after { width:100%; }
.navbar-cta { font-size:0.78rem; font-weight:600; letter-spacing:0.14em; text-transform:uppercase; color:var(--bg-primary); background:var(--gold); padding:10px 24px; border-radius:2px; transition:background var(--trans-fast),transform var(--trans-fast),box-shadow var(--trans-fast); white-space:nowrap; }
.navbar-cta:hover { background:var(--gold-light); transform:translateY(-1px); box-shadow:0 6px 24px rgba(201,170,113,0.3); color:var(--bg-primary); }
.navbar-toggle { display:none; flex-direction:column; gap:5px; cursor:pointer; padding:4px; background:none; border:none; }
.navbar-toggle span { display:block; width:26px; height:1.5px; background:var(--text-primary); transition:transform var(--trans-fast),opacity var(--trans-fast),width var(--trans-fast); transform-origin:left; }
.navbar-toggle.open span:nth-child(1) { transform:rotate(45deg) translateY(-1px); }
.navbar-toggle.open span:nth-child(2) { opacity:0; width:0; }
.navbar-toggle.open span:nth-child(3) { transform:rotate(-45deg) translateY(1px); }
.navbar-mobile { display:none; position:fixed; inset:0; z-index:999; background:rgba(10,0,0,0.98); flex-direction:column; align-items:center; justify-content:center; gap:36px; opacity:0; visibility:hidden; transition:opacity var(--trans-med),visibility var(--trans-med); }
.navbar-mobile.open { opacity:1; visibility:visible; }
.navbar-mobile a { font-family:'Cormorant Garant',serif; font-size:clamp(2rem,5vw,3.2rem); font-weight:300; letter-spacing:0.06em; color:var(--text-secondary); transition:color var(--trans-fast); }
.navbar-mobile a:hover { color:var(--gold); }

/* BUTTONS */
.btn { display:inline-flex; align-items:center; gap:10px; font-size:0.8rem; font-weight:600; letter-spacing:0.16em; text-transform:uppercase; cursor:pointer; border:none; transition:all var(--trans-med); position:relative; overflow:hidden; white-space:nowrap; }
.btn-primary { background:var(--gold); color:var(--bg-primary); padding:16px 36px; border-radius:2px; }
.btn-primary:hover { background:var(--gold-light); transform:translateY(-2px); box-shadow:0 10px 40px rgba(201,170,113,0.35); color:var(--bg-primary); }
.btn-outline { background:transparent; color:var(--text-primary); padding:15px 34px; border-radius:2px; border:1px solid var(--gold-border); }
.btn-outline:hover { border-color:var(--gold); color:var(--gold); transform:translateY(-2px); box-shadow:0 10px 40px rgba(201,170,113,0.15); }
.btn-gold-ghost { background:transparent; color:var(--gold); padding:14px 32px; border-radius:2px; border:1px solid var(--gold-border-h); }
.btn-gold-ghost:hover { background:var(--gold-dim); transform:translateY(-2px); }
.btn-arrow { width:18px; height:18px; transition:transform var(--trans-fast); flex-shrink:0; }
.btn:hover .btn-arrow { transform:translateX(4px); }

/* HERO */
.hero { position:relative; width:100%; height:100vh; min-height:680px; display:flex; align-items:center; overflow:hidden; max-width:100%; }
.hero-bg { position:absolute; inset:0; z-index:0; }
.hero-bg img { width:100%; height:100%; object-fit:cover; transform:scale(1.08); animation:heroZoom 16s var(--ease-luxury) forwards; }
.hero-bg--gradient {
  background:
    radial-gradient(ellipse 80% 60% at 20% 50%, rgba(100,0,0,0.55) 0%, transparent 70%),
    radial-gradient(ellipse 60% 80% at 80% 30%, rgba(60,0,0,0.40) 0%, transparent 65%),
    linear-gradient(160deg, #1A0505 0%, #0E0000 40%, #180808 70%, #0A0000 100%);
}
@keyframes heroZoom { to { transform:scale(1); } }
.hero-overlay { position:absolute; inset:0; background:transparent; z-index:1; }
.hero-overlay-bottom { position:absolute; bottom:0; left:0; right:0; height:200px; background:linear-gradient(to top,var(--bg-primary),transparent); z-index:2; }
.hero-content { position:relative; z-index:3; max-width:820px; }
.hero-label { display:inline-flex; align-items:center; gap:14px; font-size:0.72rem; font-weight:600; letter-spacing:0.3em; text-transform:uppercase; color:var(--gold); margin-bottom:28px; opacity:0; transform:translateY(20px); }
.hero-label span { display:block; width:40px; height:1px; background:var(--gold); opacity:0.7; }
.hero-title { font-family:'Cinzel',serif; font-size:var(--fs-display); font-weight:400; line-height:1.05; letter-spacing:0.02em; color:var(--text-primary); margin-bottom:12px; opacity:0; transform:translateY(30px); }
.hero-title em { font-style:italic; color:var(--gold-light); }
.hero-subtitle { font-family:'Playfair Display',serif; font-size:clamp(1.1rem,2.5vw,1.7rem); font-weight:400; font-style:italic; color:var(--text-secondary); margin-bottom:48px; opacity:0; transform:translateY(24px); }
.hero-cta { display:flex; gap:20px; flex-wrap:wrap; opacity:0; transform:translateY(20px); }
.glow-orb { position:absolute; border-radius:50%; filter:blur(90px); pointer-events:none; z-index:1; width:600px; height:600px; background:radial-gradient(circle,rgba(180,10,10,0.12) 0%,transparent 70%); max-width:100vw; overflow:hidden; }

/* LAYOUT */
.section { padding:var(--section-py) 0; position:relative; }
.section--sm { padding:var(--section-py-sm) 0; }
.section-label { display:inline-flex; align-items:center; gap:12px; font-size:0.75rem; font-weight:600; letter-spacing:0.2em; text-transform:uppercase; color:var(--gold); margin-bottom:20px; }
.section-label::before,.section-label::after { content:''; width:32px; height:1px; background:var(--gold); opacity:0.6; }
.section-title { font-family:'Cinzel',serif; font-size:var(--fs-h2); font-weight:500; color:var(--text-primary); line-height:1.15; letter-spacing:0.02em; }
.section-title em { font-style:italic; color:var(--gold); }
.section-subtitle { font-size:1.0rem; color:var(--text-secondary); line-height:1.8; margin-top:16px; }
.text-center { text-align:center; }
.bg-alt { background:var(--bg-secondary); }
.flex-between { display:flex; align-items:center; justify-content:space-between; }
.divider { width:60px; height:1px; background:linear-gradient(90deg,var(--gold),transparent); margin:24px 0; }

/* INTRO SPLIT */
.intro-section { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }
.intro-image-wrap { position:relative; }
.intro-image-main { width:100%; aspect-ratio:3/4; object-fit:cover; border-radius:var(--radius-sm); }
.intro-badge { position:absolute; top:32px; right:-20px; background:var(--gold); color:var(--bg-primary); padding:20px 24px; text-align:center; border-radius:var(--radius-sm); box-shadow:var(--shadow-gold); }
.badge-num { font-family:'Cormorant Garant',serif; font-size:2.2rem; font-weight:600; line-height:1; display:block; }
.badge-text { font-size:0.66rem; letter-spacing:0.14em; text-transform:uppercase; font-weight:600; }

/* STATS BAR */
.stats-section { background:var(--bg-secondary); border-top:1px solid var(--border-subtle); border-bottom:1px solid var(--border-subtle); }
.stats-grid { display:grid; grid-template-columns:repeat(4,1fr); }
.stat-item { text-align:center; padding:56px 24px; border-right:1px solid var(--border-subtle); position:relative; }
.stat-item:last-child { border-right:none; }
.counter-num { font-family:'Cormorant Garant',serif; font-size:clamp(2.6rem,4.5vw,4.5rem); font-weight:600; color:var(--gold); line-height:1; display:block; }
.counter-label { font-size:0.76rem; letter-spacing:0.16em; text-transform:uppercase; color:var(--text-muted); margin-top:10px; }

/* FACILITY CARDS */
.facilities-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.facility-card { background:var(--glass-card); border:1px solid var(--border-card); border-radius:var(--radius-md); padding:36px 28px; position:relative; overflow:hidden; transition:transform var(--trans-med),box-shadow var(--trans-med),border-color var(--trans-med),background var(--trans-med); }
.facility-card::before { content:''; position:absolute; inset:0; background:linear-gradient(135deg,var(--gold-glow) 0%,transparent 60%); opacity:0; transition:opacity var(--trans-med); border-radius:inherit; }
.facility-card::after { content:''; position:absolute; top:0; left:0; right:0; height:1px; background:linear-gradient(90deg,transparent,var(--gold),transparent); opacity:0; transition:opacity var(--trans-med); }
.facility-card:hover { transform:translateY(-6px); border-color:var(--gold-border); background:var(--bg-hover); box-shadow:0 20px 60px rgba(0,0,0,0.4),var(--shadow-gold); }
.facility-card:hover::before,.facility-card:hover::after { opacity:1; }
.card-icon { width:52px; height:52px; border:1px solid var(--gold-border); border-radius:var(--radius-sm); display:flex; align-items:center; justify-content:center; margin-bottom:24px; color:var(--gold); font-size:1.4rem; transition:background var(--trans-fast),border-color var(--trans-fast); }
.facility-card:hover .card-icon { background:var(--gold-dim); border-color:var(--gold); }
.card-title { font-family:'Playfair Display',serif; font-size:1.18rem; font-weight:500; color:var(--text-primary); margin-bottom:10px; }
.card-desc { font-size:0.9rem; color:var(--text-muted); line-height:1.75; }
.card-link { display:inline-flex; align-items:center; gap:8px; font-size:0.76rem; font-weight:600; letter-spacing:0.1em; text-transform:uppercase; color:var(--gold); margin-top:20px; transition:gap var(--trans-fast); }
.card-link:hover { gap:14px; color:var(--gold-light); }

/* HOME GALLERY GRID (3 items, 2-col, fixed height) */
.gallery-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  grid-auto-rows:260px;
  gap:14px;
}
.gallery-grid .gallery-item       { height:260px; }
.gallery-grid .gallery-item.tall  { height:534px; grid-row:span 2; }
.gallery-grid .gallery-item img   { width:100%; height:100%; object-fit:cover; }

/* GALLERY PAGE MASONRY */
.gallery-masonry {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  grid-auto-rows:280px;
  gap:14px;
}
.gallery-item { overflow:hidden; border-radius:var(--radius-sm); position:relative; cursor:pointer; }
.gallery-item--tall  { grid-row:span 2; }
.gallery-item--wide  { grid-column:span 2; }
.gallery-item--normal{ grid-row:span 1; }
.gallery-item img { width:100%; height:100%; object-fit:cover; transition:transform 0.7s var(--ease-luxury),filter 0.5s; filter:brightness(0.85) saturate(0.85); display:block; }
.gallery-overlay { position:absolute; inset:0; background:linear-gradient(to top,rgba(80,0,0,0.85) 0%,rgba(20,0,0,0.20) 55%,transparent 100%); opacity:0; transition:opacity var(--trans-med); display:flex; align-items:flex-end; padding:22px; }
.gallery-overlay-icon { color:var(--gold); font-size:1.4rem; margin-bottom:6px; }
.gallery-overlay-label { font-family:'Cinzel',serif; font-size:0.78rem; letter-spacing:0.14em; text-transform:uppercase; color:var(--text-primary); margin-top:4px; }
.gallery-item:hover img { transform:scale(1.06); filter:brightness(1) saturate(1.1); }
.gallery-item:hover .gallery-overlay { opacity:1; }
/* legacy class support */
.gallery-item.tall { grid-row:span 2; }

/* TESTIMONIALS */
.testimonials-section { background:var(--bg-secondary); position:relative; overflow:hidden; }
.testimonials-section::before { content:'"'; position:absolute; top:-40px; left:50%; transform:translateX(-50%); font-family:'Cormorant Garant',serif; font-size:22rem; font-weight:700; color:rgba(201,170,113,0.04); line-height:1; pointer-events:none; }
.testimonials-slider { display:grid; grid-template-columns:repeat(2,1fr); gap:28px; max-width:900px; margin-inline:auto; }
.testimonial-card { background:var(--bg-card); border:1px solid var(--border-card); border-radius:var(--radius-md); padding:36px 32px; transition:border-color var(--trans-med),box-shadow var(--trans-med); }
.testimonial-card:hover { border-color:var(--gold-border); box-shadow:var(--shadow-gold); }
.testimonial-quote { font-family:'Cormorant Garant',serif; font-size:3rem; color:var(--gold); line-height:0.8; margin-bottom:18px; opacity:0.6; }
.testimonial-text { font-family:'Playfair Display',serif; font-size:1.0rem; font-style:italic; color:var(--text-secondary); line-height:1.85; margin-bottom:24px; }
.testimonial-stars { color:var(--gold); letter-spacing:3px; font-size:0.8rem; margin-bottom:18px; }
.testimonial-author { display:flex; align-items:center; gap:14px; padding-top:18px; border-top:1px solid var(--border-subtle); }
.testimonial-avatar { width:44px; height:44px; border-radius:50%; object-fit:cover; border:2px solid var(--gold-border); }
.testimonial-author-name { font-size:0.86rem; font-weight:600; color:var(--text-primary); }
.testimonial-author-loc { font-size:0.76rem; color:var(--text-muted); margin-top:2px; }

/* CTA */
.cta-section { position:relative; overflow:hidden; }
.cta-bg { position:absolute; inset:0; z-index:0; }
.cta-bg img { width:100%; height:100%; object-fit:cover; filter:brightness(0.18) saturate(0.5); }
.cta-gradient { position:absolute; inset:0; background:linear-gradient(135deg,rgba(10,0,0,0.94) 0%,rgba(80,0,0,0.70) 100%); z-index:1; }
.cta-content { position:relative; z-index:2; text-align:center; max-width:660px; margin-inline:auto; }
.cta-actions { display:flex; gap:20px; justify-content:center; flex-wrap:wrap; margin-top:40px; }
.cta-ambient { position:absolute; width:600px; height:600px; border-radius:50%; background:radial-gradient(circle,rgba(201,170,113,0.07) 0%,transparent 70%); top:50%; left:50%; transform:translate(-50%,-50%); z-index:1; animation:ctaPulse 4s ease-in-out infinite; }
@keyframes ctaPulse { 0%,100%{transform:translate(-50%,-50%) scale(1)} 50%{transform:translate(-50%,-50%) scale(1.1)} }

/* PAGE HERO (inner pages) */
.about-hero {
  min-height:56vh;
  padding-top:140px;
  padding-bottom:64px;
  position:relative;
  display:flex;
  align-items:flex-end;
}
.about-hero .container { width:100%; }
.page-hero-title { font-family:'Cinzel',serif; font-size:clamp(2.2rem,5vw,4rem); font-weight:500; line-height:1.1; }

/* CONTACT */
.contact-grid { display:grid; grid-template-columns:1fr 1.4fr; gap:60px; align-items:start; }
.contact-info-card { background:var(--bg-card); border:1px solid var(--border-card); border-radius:var(--radius-md); padding:32px; display:flex; align-items:flex-start; gap:18px; margin-bottom:18px; transition:border-color var(--trans-fast); }
.contact-info-card:hover { border-color:var(--gold-border); }
.contact-icon { width:46px; height:46px; border-radius:var(--radius-sm); background:var(--gold-dim); border:1px solid var(--gold-border); display:flex; align-items:center; justify-content:center; color:var(--gold); font-size:1.1rem; flex-shrink:0; }
.contact-info-title { font-size:0.7rem; letter-spacing:0.16em; text-transform:uppercase; color:var(--text-muted); margin-bottom:5px; }
.contact-info-value { font-size:0.94rem; color:var(--text-secondary); line-height:1.6; }
.enquiry-form { background:var(--bg-card); border:1px solid var(--border-card); border-radius:var(--radius-lg); padding:48px 42px; }
.form-title { font-family:'Playfair Display',serif; font-size:1.75rem; font-weight:500; margin-bottom:6px; }
.form-subtitle { font-size:0.9rem; color:var(--text-muted); margin-bottom:32px; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.form-group { margin-bottom:18px; }
.form-group label { display:block; font-size:0.7rem; font-weight:600; letter-spacing:0.14em; text-transform:uppercase; color:var(--text-muted); margin-bottom:7px; }
.form-control { width:100%; background:var(--bg-surface); border:1px solid var(--border-subtle); border-radius:var(--radius-sm); padding:13px 16px; color:var(--text-primary); font-family:'Inter',sans-serif; font-size:0.92rem; transition:border-color var(--trans-fast),box-shadow var(--trans-fast); outline:none; -webkit-appearance:none; }
.form-control:focus { border-color:var(--gold); box-shadow:0 0 0 3px rgba(201,170,113,0.08); }
.form-control::placeholder { color:var(--text-muted); }
textarea.form-control { resize:vertical; min-height:110px; }

/* Date picker — override appearance:none so native calendar works */
input[type="date"].form-control,
input[type="date"] {
  -webkit-appearance:auto;
  appearance:auto;
  color-scheme: dark;
  color:var(--text-primary);
}
input[type="date"].form-control::-webkit-calendar-picker-indicator {
  filter: invert(0.7) sepia(1) saturate(2) hue-rotate(5deg) brightness(1.1);
  cursor:pointer;
  opacity:0.8;
  padding-left:8px;
}
input[type="date"].form-control::-webkit-calendar-picker-indicator:hover {
  opacity:1;
}
.form-submit { width:100%; padding:16px 24px; justify-content:center; margin-top:6px; font-size:0.84rem; }
.form-success { display:none; text-align:center; padding:20px; }
.form-success.show { display:block; }
.map-placeholder { width:100%; height:340px; background:var(--bg-card); border:1px solid var(--border-card); border-radius:var(--radius-md); overflow:hidden; position:relative; margin-top:20px; }
.map-placeholder iframe { position:absolute; inset:0; width:100%; height:100%; border:none; }

/* PHILOSOPHY CARDS */
.philosophy-card { background:var(--glass-card); border:1px solid var(--border-card); border-radius:var(--radius-md); padding:44px 36px; text-align:center; transition:transform var(--trans-med),border-color var(--trans-med); }
.philosophy-card:hover { transform:translateY(-4px); border-color:var(--gold-border); }
.philosophy-icon { font-size:2rem; color:var(--gold); margin-bottom:18px; }
.philosophy-title { font-family:'Playfair Display',serif; font-size:1.2rem; font-weight:500; margin-bottom:12px; }
.philosophy-text { font-size:0.9rem; color:var(--text-muted); line-height:1.8; }

/* FOOTER */
#footer { background:var(--bg-secondary); border-top:none; }
.footer-top { padding:64px 0 52px; display:grid; grid-template-columns:1.4fr 1fr 0.8fr 1.1fr; gap:48px; border-bottom:1px solid rgba(212,175,55,0.15); }

/* Brand column */
.footer-brand-col { display:flex; flex-direction:column; }
.footer-logo-link { display:inline-block; margin-bottom:14px; }
.footer-logo-img { height:110px; width:110px; object-fit:contain; filter:drop-shadow(0 0 18px rgba(212,175,55,0.45)); transition:filter var(--trans-med); }
.footer-logo-link:hover .footer-logo-img { filter:drop-shadow(0 0 26px rgba(212,175,55,0.7)); }
.footer-hotel-name { font-family:'Cinzel',serif; font-size:1.08rem; font-weight:700; letter-spacing:0.12em; text-transform:uppercase; color:var(--text-primary); margin-bottom:4px; }
.footer-hotel-tagline { font-size:0.58rem; letter-spacing:0.35em; text-transform:uppercase; color:var(--gold); }
.footer-divider { width:48px; height:1px; background:linear-gradient(90deg,var(--gold),transparent); margin:14px 0; }
.footer-tagline { font-size:0.86rem; color:var(--text-muted); line-height:1.85; max-width:280px; }
.footer-social { display:flex; gap:10px; margin-top:22px; }
.social-btn { width:38px; height:38px; border:1px solid rgba(212,175,55,0.25); border-radius:var(--radius-sm); display:flex; align-items:center; justify-content:center; color:var(--text-muted); font-size:0.88rem; transition:all var(--trans-fast); }
.social-btn:hover { color:var(--gold); border-color:var(--gold); background:var(--gold-dim); transform:translateY(-3px); box-shadow:0 6px 20px rgba(212,175,55,0.2); }

/* Columns */
.footer-col-title { font-size:0.68rem; font-weight:700; letter-spacing:0.22em; text-transform:uppercase; color:var(--gold); margin-bottom:20px; padding-bottom:10px; border-bottom:1px solid rgba(212,175,55,0.2); }
.footer-links { display:flex; flex-direction:column; gap:12px; list-style:none; }
.footer-links a { font-size:0.88rem; color:var(--text-muted); transition:color var(--trans-fast),gap var(--trans-fast); display:flex; align-items:center; gap:7px; }
.footer-links a i { font-size:0.6rem; color:var(--gold); opacity:0.7; transition:transform var(--trans-fast); }
.footer-links a:hover { color:var(--gold-light); }
.footer-links a:hover i { transform:translateX(3px); opacity:1; }

/* Contact */
.footer-contact-item { display:flex; align-items:flex-start; gap:12px; margin-bottom:16px; }
.footer-contact-icon-wrap { width:32px; height:32px; border-radius:50%; border:1px solid rgba(212,175,55,0.3); display:flex; align-items:center; justify-content:center; color:var(--gold); font-size:0.82rem; flex-shrink:0; margin-top:1px; background:rgba(212,175,55,0.06); }
.footer-contact-text { font-size:0.85rem; color:var(--text-muted); line-height:1.7; }
.footer-contact-text a { color:var(--text-muted); transition:color var(--trans-fast); }
.footer-contact-text a:hover { color:var(--gold); }

/* Bottom bar */
.footer-bottom { padding:20px 0; display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.footer-copy { font-size:0.76rem; color:var(--text-muted); }
.footer-copy a { color:var(--gold); }
.footer-legal { display:flex; gap:20px; }
.footer-legal a { font-size:0.74rem; color:var(--text-muted); transition:color var(--trans-fast); }
.footer-legal a:hover { color:var(--gold); }

/* WHATSAPP */
#whatsapp-float { position:fixed; bottom:36px; right:36px; z-index:900; width:52px; height:52px; background:#25D366; border-radius:50%; display:flex; align-items:center; justify-content:center; color:white; font-size:1.4rem; box-shadow:0 6px 30px rgba(37,211,102,0.4); transition:transform var(--trans-fast),box-shadow var(--trans-fast); }
#whatsapp-float:hover { transform:scale(1.1) translateY(-3px); box-shadow:0 12px 40px rgba(37,211,102,0.5); color:white; }
.wa-pulse { position:absolute; inset:-8px; border-radius:50%; background:rgba(37,211,102,0.2); animation:waPulse 2.5s ease-out infinite; }
@keyframes waPulse { 0%{transform:scale(0.85);opacity:1} 100%{transform:scale(1.5);opacity:0} }

/* LIGHTBOX — hidden by default, shown via .active class */
#lightbox { display:none; position:fixed; inset:0; z-index:8000; background:rgba(0,0,0,0.96); align-items:center; justify-content:center; }
#lightbox.active { display:flex; }
.lightbox-inner { display:flex; flex-direction:column; align-items:center; max-width:88vw; }
#lightbox-img { max-width:88vw; max-height:82vh; object-fit:contain; border-radius:var(--radius-sm); box-shadow:0 8px 60px rgba(0,0,0,0.8); }
.lightbox-caption { color:var(--gold); font-family:'Cinzel',serif; font-size:0.76rem; letter-spacing:0.2em; text-transform:uppercase; margin-top:14px; opacity:0.9; }
.lightbox-close { position:absolute; top:20px; right:28px; background:none; border:none; color:rgba(255,255,255,0.55); font-size:2.4rem; cursor:pointer; line-height:1; transition:color var(--trans-fast); z-index:2; padding:0; }
.lightbox-close:hover { color:var(--gold); }
.lightbox-prev,.lightbox-next { position:absolute; top:50%; transform:translateY(-50%); background:rgba(201,170,113,0.10); border:1px solid rgba(201,170,113,0.30); color:var(--gold); font-size:2rem; width:50px; height:50px; border-radius:50%; cursor:pointer; transition:background var(--trans-fast); display:flex; align-items:center; justify-content:center; z-index:2; }
.lightbox-prev { left:18px; }
.lightbox-next { right:18px; }
.lightbox-prev:hover,.lightbox-next:hover { background:rgba(201,170,113,0.25); }
.ambient-top { position:absolute; top:-200px; right:-200px; width:600px; height:600px; background:radial-gradient(circle,rgba(201,170,113,0.05) 0%,transparent 70%); pointer-events:none; overflow:hidden; }
.ambient-bottom { position:absolute; bottom:-200px; left:-200px; width:600px; height:600px; background:radial-gradient(circle,rgba(201,170,113,0.04) 0%,transparent 70%); pointer-events:none; overflow:hidden; }
.grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.grid-2 { display:grid; grid-template-columns:repeat(2,1fr); gap:40px; }

/* =============================================
   RESPONSIVE
   ============================================= */

/* Tablet — 1024px */
@media(max-width:1024px){
  /* Navbar */
  .navbar-nav,.navbar-cta{display:none}
  .navbar-toggle{display:flex}
  .navbar-mobile{display:flex}

  /* Layouts */
  .intro-section{grid-template-columns:1fr;gap:40px}
  .grid-2{grid-template-columns:1fr;gap:36px}
  .grid-3{grid-template-columns:repeat(2,1fr)}
  .facilities-grid{grid-template-columns:repeat(2,1fr)}
  .gallery-grid{grid-template-columns:repeat(2,1fr)}
  .contact-grid{grid-template-columns:1fr;gap:48px}

  /* Stats */
  .stats-grid{grid-template-columns:repeat(2,1fr)}
  .stat-item:nth-child(2){border-right:none}

  /* Hero */
  .page-hero-title{font-size:clamp(2rem,5vw,3.5rem)}
  .hero-title{font-size:clamp(2.2rem,6vw,4rem)}
  .intro-badge{top:16px;right:16px}

  /* Footer */
  .footer-top{grid-template-columns:1fr 1fr;gap:40px}

  /* Rooms */
  .room-card-inner{flex-direction:column}
  .room-card-img{width:100%;height:260px}
}

/* Large mobile — 768px */
@media(max-width:768px){
  :root{--section-py:72px;--section-py-sm:52px}
  .hero{min-height:90vh}
  .hero-title{font-size:clamp(2rem,8vw,3rem)}
  .page-hero-title{font-size:clamp(1.8rem,6vw,2.8rem)}
  .section-title{font-size:clamp(1.5rem,5vw,2.2rem)}
  .section-subtitle{font-size:0.95rem}
  .navbar-logo-img{height:60px;width:60px}
  .grid-3{grid-template-columns:1fr}
  .facilities-grid{grid-template-columns:1fr}
  .gallery-masonry{columns:2;column-gap:12px}
  .intro-section{grid-template-columns:1fr!important}
  .stats-grid{grid-template-columns:repeat(2,1fr);gap:0}
  .cta-content{padding:0 16px}
  .cta-actions{flex-direction:column;align-items:center;gap:12px}
  .cta-actions .btn{width:100%;max-width:280px;justify-content:center}
  .footer-top{grid-template-columns:1fr 1fr;gap:32px}
  .footer-brand-col{grid-column:1/-1;text-align:center}
  .footer-brand-col a{justify-content:center}
  .footer-brand-col>div:nth-child(2){margin-inline:auto}
  .footer-social{justify-content:center}
}

/* Mobile — 640px */
@media(max-width:640px){
  :root{--section-py:56px;--section-py-sm:40px}
  .hero{min-height:100svh}
  .hero-title{font-size:clamp(1.7rem,9vw,2.4rem)}
  .page-hero-title{font-size:clamp(1.5rem,7vw,2.2rem)}
  .hero-cta{flex-direction:column;gap:12px}
  .hero-cta .btn{width:100%;justify-content:center}
  .navbar-logo-img{height:52px;width:52px}
  .logo-main{font-size:0.95rem}
  .gallery-masonry{columns:1}
  .gallery-grid{grid-template-columns:1fr}
  .stats-grid{grid-template-columns:repeat(2,1fr)}
  .philosophy-card,.feature-card{padding:28px 22px}
  .form-row{grid-template-columns:1fr}
  .enquiry-form{padding:28px 18px}
  .contact-grid{gap:36px}
  .footer-top{grid-template-columns:1fr;gap:28px}
  .footer-brand-col{grid-column:auto;text-align:center;align-items:center} .footer-brand-col img{max-width:100%;height:auto;max-height:160px}
  .footer-contact-item{gap:10px}
  .footer-bottom{flex-direction:column;text-align:center;gap:8px}
  .footer-legal{justify-content:center;flex-wrap:wrap;gap:12px}
  .section-label{font-size:0.65rem}
  .btn{font-size:0.8rem;padding:13px 24px}
  .cta-actions{flex-direction:column;align-items:center;gap:12px}
  .cta-actions .btn{width:100%;max-width:280px;justify-content:center}
  .datepicker-dropdown{min-width:calc(100vw - 40px);left:50%;transform:translateX(-50%)}
  .datepicker-dropdown.open{transform:translateX(-50%) translateY(0)}
}

/* Small mobile — 400px */
@media(max-width:400px){
  .stats-grid{grid-template-columns:1fr 1fr}
  .stat-item{padding:20px 12px}
  .counter-num{font-size:2.2rem}
  .footer-social{gap:8px}
  .social-btn{width:34px;height:34px;font-size:0.82rem}
}

/* =============================================
   CONTACT — Form first on mobile
   ============================================= */
@media(max-width:1024px){
  .contact-grid { display:flex; flex-direction:column; }
  .contact-grid > div:first-child { order:2; } /* info + map — niche */
  .contact-grid > div:last-child  { order:1; } /* form — upar */
}

/* =============================================
   MOBILE OVERFLOW FIX
   ============================================= */
@media(max-width:768px){
  /* Prevent ALL horizontal scroll */
  .section, .hero, .stats-section, .testimonials-section,
  .cta-section, .dining-section, footer, header,
  .about-hero, .contact-grid, .facilities-grid,
  .gallery-masonry { overflow-x:hidden; }

  /* Clip decorative orbs/ambient on mobile */
  .glow-orb, .ambient-top, .ambient-bottom, .cta-ambient { display:none; }

  /* Loader fix for mobile */
  .loader-name { font-size:clamp(1.1rem,6vw,1.8rem); letter-spacing:0.12em; }
  .loader-tagline { font-size:0.65rem; letter-spacing:0.18em; }

  /* Testimonials big quote mark overflow */
  .testimonials-section::before { font-size:10rem; top:-20px; }

  /* Ensure container never overflows */
  .container { max-width:100%; overflow-x:hidden; }
}

/* =============================================
   CUSTOM LUXURY DATE PICKER
   ============================================= */
.datepicker-wrap{position:relative}
.datepicker-input{cursor:pointer;padding-right:44px}
.datepicker-icon{position:absolute;right:14px;top:50%;transform:translateY(-50%);color:var(--gold);pointer-events:none;opacity:0.8}
.datepicker-dropdown{display:none;position:absolute;top:calc(100% + 8px);z-index:3000;background:#160404;border:1px solid rgba(212,175,55,0.4);border-radius:8px;padding:0;min-width:296px;box-shadow:0 16px 60px rgba(0,0,0,0.7),0 0 0 1px rgba(212,175,55,0.1);overflow:hidden}
.datepicker-dropdown.open{display:block;animation:dpFadeIn 0.18s ease}
@keyframes dpFadeIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
.dp-header{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;background:#1f0707;border-bottom:1px solid rgba(212,175,55,0.2)}
.dp-month-year{font-family:'Cinzel',serif;font-size:0.88rem;letter-spacing:0.12em;color:var(--gold);font-weight:600}
.dp-nav{background:none;border:1px solid rgba(212,175,55,0.25);color:var(--gold);width:30px;height:30px;border-radius:50%;cursor:pointer;font-size:1rem;display:flex;align-items:center;justify-content:center;transition:background 0.2s,border-color 0.2s;line-height:1}
.dp-nav:hover{background:rgba(212,175,55,0.15);border-color:rgba(212,175,55,0.55)}
.dp-nav:disabled{opacity:0.25;cursor:default}
.dp-weekdays{display:grid;grid-template-columns:repeat(7,1fr);padding:10px 12px 4px;gap:2px}
.dp-weekday{text-align:center;font-family:'Cinzel',serif;font-size:0.62rem;letter-spacing:0.1em;color:rgba(212,175,55,0.55);text-transform:uppercase;padding:4px 0}
.dp-days{display:grid;grid-template-columns:repeat(7,1fr);padding:4px 12px 14px;gap:3px}
.dp-day{text-align:center;padding:7px 4px;font-size:0.83rem;color:var(--text-secondary);border-radius:4px;cursor:pointer;transition:background 0.15s,color 0.15s;line-height:1}
.dp-day:hover:not(.dp-day--disabled):not(.dp-day--selected){background:rgba(212,175,55,0.12);color:var(--gold-light)}
.dp-day--today{color:var(--gold);font-weight:600}
.dp-day--selected{background:var(--gold)!important;color:#0e0000!important;font-weight:700;border-radius:4px}
.dp-day--disabled{color:rgba(255,255,255,0.15);cursor:default}
.dp-day--empty{pointer-events:none}

/* WHATSAPP FLOAT */

/* =============================================
   FEATURE STRIP
   ============================================= */
.feature-strip { background:var(--bg-secondary); border-top:1px solid rgba(212,175,55,0.15); border-bottom:1px solid rgba(212,175,55,0.15); padding:0; }
.feature-strip-grid { display:flex; align-items:stretch; }
.feature-strip-item { flex:1; display:flex; align-items:center; gap:18px; padding:28px 32px; transition:background var(--trans-fast); cursor:default; }
.feature-strip-item:hover { background:rgba(212,175,55,0.05); }
.feature-strip-icon { width:48px; height:48px; border-radius:50%; border:1px solid rgba(212,175,55,0.35); display:flex; align-items:center; justify-content:center; color:var(--gold); font-size:1.1rem; flex-shrink:0; background:rgba(212,175,55,0.06); transition:all var(--trans-fast); }
.feature-strip-item:hover .feature-strip-icon { background:rgba(212,175,55,0.15); border-color:var(--gold); box-shadow:0 0 20px rgba(212,175,55,0.2); }
.feature-strip-text h4 { font-family:'Cinzel',serif; font-size:0.82rem; font-weight:600; letter-spacing:0.08em; color:var(--text-primary); margin-bottom:3px; }
.feature-strip-text p { font-size:0.76rem; color:var(--text-muted); letter-spacing:0.02em; }
.feature-strip-divider { width:1px; background:rgba(212,175,55,0.15); margin:20px 0; flex-shrink:0; }

@media(max-width:768px){
  .feature-strip-grid { flex-wrap:wrap; }
  .feature-strip-item { flex:1 1 48%; padding:22px 20px; }
  .feature-strip-divider { display:none; }
}
@media(max-width:480px){
  .feature-strip-item { flex:1 1 100%; padding:18px 16px; border-bottom:1px solid rgba(212,175,55,0.1); }
  .feature-strip-item:last-child { border-bottom:none; }
}

/* =============================================
   DINING SECTION
   ============================================= */
.dining-section { overflow:hidden; }
.dining-grid { display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:center; }
.dining-img-wrap { position:relative; border-radius:var(--radius-md); overflow:hidden; border:1px solid var(--gold-border); }
.dining-img-wrap img { width:100%; aspect-ratio:4/3; object-fit:cover; display:block; transition:transform var(--trans-slow); }
.dining-img-wrap:hover img { transform:scale(1.04); }
.dining-img-badge { position:absolute; bottom:20px; left:20px; background:var(--gold); color:var(--bg-primary); padding:10px 20px; border-radius:var(--radius-sm); display:flex; align-items:center; gap:8px; font-family:'Cinzel',serif; font-size:0.76rem; font-weight:700; letter-spacing:0.1em; box-shadow:var(--shadow-gold); }
.dining-features { display:flex; flex-direction:column; gap:20px; margin-top:28px; }
.dining-feat { display:flex; align-items:flex-start; gap:14px; }
.dining-feat-icon { width:38px; height:38px; border-radius:var(--radius-sm); border:1px solid rgba(212,175,55,0.3); display:flex; align-items:center; justify-content:center; color:var(--gold); font-size:0.95rem; flex-shrink:0; background:rgba(212,175,55,0.06); margin-top:2px; }
.dining-feat h5 { font-family:'Cinzel',serif; font-size:0.82rem; font-weight:600; letter-spacing:0.06em; color:var(--text-primary); margin-bottom:3px; }
.dining-feat p { font-size:0.82rem; color:var(--text-muted); line-height:1.6; }

@media(max-width:768px){
  .dining-grid { grid-template-columns:1fr; gap:40px; }
}

/* =============================================
   TESTIMONIAL CAROUSEL
   ============================================= */
.tcarousel { position:relative; overflow:hidden; }
.tcarousel-track { display:flex; transition:transform 0.4s cubic-bezier(0.4,0,0.2,1); }
.tcarousel-track .testimonial-card { flex:0 0 100%; min-width:0; }
.tcarousel-dots { display:flex; justify-content:center; gap:8px; margin-top:24px; }
.tcarousel-dot { width:8px; height:8px; border-radius:50%; background:rgba(212,175,55,0.25); border:1px solid rgba(212,175,55,0.4); cursor:pointer; padding:0; transition:background var(--trans-base), transform var(--trans-base); }
.tcarousel-dot.active { background:var(--gold); transform:scale(1.3); }
.tcarousel-dot:hover { background:rgba(212,175,55,0.6); }

/* Desktop: revert carousel to grid */
@media(min-width:769px){
  .tcarousel { overflow:visible; }
  .tcarousel-track { display:grid; grid-template-columns:repeat(2,1fr); gap:28px; transform:none !important; transition:none; }
  .tcarousel-track .testimonial-card { flex:none; }
  .tcarousel-dots { display:none; }
}
