/* ==========================================================================
   Vamana Riseonic — main stylesheet
   ========================================================================== */
:root{
  --green: #092519;
  --green-2: #0f3327;
  --gold: #c28315;
  --gold-light: #d9a441;
  --cream: #f8f5f0;
  --ink: #14201a;
  --muted: #5c6b63;
  --border: #e6e1d6;
  --white: #ffffff;
  --ff-head: 'Poppins', sans-serif;
  --ff-body: 'DM Sans', sans-serif;
  --container: 1240px;
}

*, *::before, *::after{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
body{
  margin:0;
  font-family: var(--ff-body);
  color: var(--ink);
  background: var(--white);
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img{ max-width:100%; display:block; }
a{ color: inherit; text-decoration: none; }
ul{ list-style: none; margin:0; padding:0; }
h1,h2,h3,h4{ font-family: var(--ff-head); color: var(--ink); margin:0; }
p{ margin: 0 0 16px; }
.vr-container{ max-width: var(--container); margin: 0 auto; padding: 0 28px; }

/* ---------- utility ---------- */
.vr-eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  font-size:12px; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color: var(--gold); margin-bottom: 16px;
}
.vr-eyebrow::before{ content:''; width:26px; height:2px; background: var(--gold); display:inline-block; }
.vr-eyebrow-light{ color: var(--gold-light); }
.vr-section{ padding: 100px 0; }
.vr-section-cream{ background: var(--cream); }
.vr-heading{
  font-size: clamp(28px, 3.4vw, 46px);
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -0.5px;
  margin-bottom: 22px;
}
.vr-heading span{ color: var(--gold); }
.vr-lede{ color: var(--muted); font-size: 17px; max-width: 620px; }

.vr-btn{
  display:inline-flex; align-items:center; gap:10px;
  font-family: var(--ff-body); font-size:13px; font-weight:700;
  letter-spacing:.08em; text-transform:uppercase;
  padding: 16px 34px; border-radius: 4px; border: none; cursor:pointer;
  transition: transform .25s ease, box-shadow .25s ease, background .25s ease;
}
.vr-btn-gold{ background: var(--gold); color:#fff; }
.vr-btn-gold:hover{ background:#a86f10; transform: translateY(-2px); box-shadow: 0 14px 30px rgba(194,131,21,.35); color:#fff; }
.vr-btn-outline{ background: transparent; color: var(--white); border: 1px solid rgba(255,255,255,.5); }
.vr-btn-outline:hover{ background: rgba(255,255,255,.1); }
.vr-btn-dark{ background: var(--green); color:#fff; }
.vr-btn-dark:hover{ background:#051912; transform: translateY(-2px); color:#fff; }

/* reveal-on-scroll */
.reveal{ opacity:0; transform: translateY(28px); transition: opacity .8s ease, transform .8s ease; }
.reveal.is-visible{ opacity:1; transform: translateY(0); }

/* ---------- top strip ---------- */
.vr-topstrip{ background: var(--ink); color: rgba(255,255,255,.65); font-size:12px; }
.vr-topstrip-inner{ display:flex; justify-content:space-between; align-items:center; padding:9px 28px; gap: 20px; flex-wrap: wrap; }
.vr-topstrip-rera strong{ color: var(--gold-light); font-weight:700; }
.vr-topstrip-address{ white-space: nowrap; overflow:hidden; text-overflow:ellipsis; }

/* ---------- header ---------- */
.vr-header{
  position: sticky; top:0; z-index: 500;
  background: var(--white);
  border-bottom: 1px solid var(--border);
  box-shadow: 0 2px 20px rgba(9,37,25,.05);
  transition: background .35s ease, border-color .35s ease, box-shadow .35s ease;
}
.vr-header.vr-header-transparent{ background: transparent; border-bottom-color: transparent; box-shadow: none; }
.vr-header-transparent .vr-nav a{ color: rgba(255,255,255,.92); }
.vr-header-transparent .vr-nav a:hover{ color:#fff; }
.vr-header-transparent .vr-nav li.active a{ color:#fff; }
.vr-header-transparent .vr-header-phone{ color:#fff; }
.vr-header-transparent .vr-nav-toggle span{ background:#fff; }
.vr-header-transparent ~ main{ margin-top: -84px; }
.vr-header-transparent.is-scrolled{ background: var(--white); border-bottom-color: var(--border); box-shadow: 0 2px 20px rgba(9,37,25,.05); }
.vr-header-transparent.is-scrolled .vr-nav a{ color: var(--ink); }
.vr-header-transparent.is-scrolled .vr-nav a:hover{ color: var(--gold); }
.vr-header-transparent.is-scrolled .vr-nav li.active a{ color: var(--gold); }
.vr-header-transparent.is-scrolled .vr-header-phone{ color: var(--ink); }
.vr-header-transparent.is-scrolled .vr-nav-toggle span{ background: var(--ink); }
.vr-header-inner{ display:flex; align-items:center; justify-content:space-between; gap: 24px; padding: 14px 28px; }
.vr-logo img{ height: 52px; width:auto; }
.vr-nav ul{ display:flex; gap: 34px; }
.vr-nav a{
  font-size: 14px; font-weight: 500; color: var(--ink);
  position:relative; padding: 6px 0; transition: color .2s;
}
.vr-nav a::after{
  content:''; position:absolute; left:0; bottom:0; height:2px; width:0;
  background: var(--gold); transition: width .25s ease;
}
.vr-nav li.active a, .vr-nav a:hover{ color: var(--gold); }
.vr-nav li.active a::after, .vr-nav a:hover::after{ width:100%; }
.vr-header-actions{ display:flex; align-items:center; gap: 22px; }
.vr-header-phone{ display:flex; align-items:center; gap:8px; color: var(--ink); font-size:14px; font-weight:600; }
.vr-header-phone svg{ color: var(--gold); flex-shrink:0; }
.vr-header-cta{ padding: 13px 26px; font-size:12px; }
.vr-nav-toggle{ display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:6px; }
.vr-nav-toggle span{ width:24px; height:2px; background: var(--ink); display:block; }

/* ---------- whatsapp fab ---------- */
.vr-whatsapp-fab{
  position: fixed; right: 24px; bottom: 24px; z-index: 400;
  width: 58px; height:58px; border-radius:50%; background:#25D366; color:#fff;
  display:flex; align-items:center; justify-content:center;
  box-shadow: 0 10px 30px rgba(0,0,0,.3);
  transition: transform .2s ease;
}
.vr-whatsapp-fab:hover{ transform: scale(1.08); color:#fff; }

/* ---------- hero ---------- */
.vr-hero{
  position:relative; min-height: 92vh; display:flex; align-items:center;
  background: var(--green); overflow:hidden;
}
.vr-hero-bg{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; z-index:0;
}
.vr-hero-overlay{
  position:absolute; inset:0; z-index:1;
  background: rgba(9,37,25,.32);
}
.vr-hero-inner{ position:relative; z-index:2; padding: 140px 0 100px; text-align:center; }
.vr-hero-inner .vr-eyebrow{ justify-content:center; }
.vr-hero h1{
  color:#fff; font-size: clamp(34px, 5.4vw, 72px); font-weight:800; line-height:1.08;
  letter-spacing:-1px; max-width:920px; margin: 0 auto 22px;
}
.vr-hero-sub{ color: rgba(255,255,255,.82); font-size: clamp(15px,1.6vw,19px); max-width: 640px; margin: 0 auto 40px; }
.vr-hero-actions{ display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }

/* ---------- text + image ---------- */
.vr-split{ display:grid; grid-template-columns: 1fr 1fr; gap: 72px; align-items:center; }
.vr-split.reverse .vr-split-img{ order:2; }
.vr-split-img img{ width:100%; border-radius: 6px; box-shadow: 0 30px 70px rgba(9,37,25,.16); object-fit:cover; aspect-ratio: 4/3; }
.vr-split-copy p{ color: var(--muted); font-size:16px; }
.vr-split-copy strong{ color: var(--ink); }

/* ---------- stats ---------- */
.vr-stats{ background: var(--cream); padding: 64px 0; }
.vr-stats-grid{ display:grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
.vr-stat{ background: var(--white); border: 1px solid var(--border); border-radius: 8px; padding: 32px 20px; text-align:center; }
.vr-stat-value{ font-family: var(--ff-head); font-size: clamp(22px,2.4vw,32px); font-weight:700; color: var(--gold); margin-bottom:8px; }
.vr-stat-label{ font-size:13px; color: var(--muted); letter-spacing:.04em; }

/* ---------- amenities grid ---------- */
.vr-amenities-grid{ display:grid; grid-template-columns: repeat(5, 1fr); gap: 20px; margin-top: 50px; }
.vr-amenity-card{
  background: var(--white); border: 1px solid var(--border); border-radius: 10px;
  overflow:hidden; text-align:center; transition: transform .3s ease, box-shadow .3s ease;
}
.vr-amenity-card:hover{ transform: translateY(-6px); box-shadow: 0 20px 40px rgba(9,37,25,.12); border-color: var(--gold-light); }
.vr-amenity-card-icon{ display:flex; align-items:center; justify-content:center; padding: 26px 20px 6px; background: var(--cream); }
.vr-amenity-card img{ width:56px; height:56px; object-fit:contain; }
.vr-amenity-card span{ display:block; padding: 16px 10px 18px; font-size: 13.5px; font-weight:600; }

/* ---------- floor plans ---------- */
.vr-plans-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap: 30px; margin-top: 54px; }
.vr-plan-card{
  position: relative; background: var(--white); border: 1px solid var(--border); border-radius: 14px; overflow:hidden;
  transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}
.vr-plan-card:hover{ transform: translateY(-8px); box-shadow: 0 26px 54px rgba(9,37,25,.14); border-color: var(--gold-light); }
.vr-plan-media{ position: relative; background: var(--cream); cursor: zoom-in; }
.vr-plan-card img{ width:100%; height: 250px; object-fit: contain; padding: 30px; transition: transform .5s ease; }
.vr-plan-card:hover img{ transform: scale(1.04); }
.vr-plan-zoom{
  position:absolute; bottom:14px; right:14px; width:36px; height:36px; border-radius:50%;
  background: rgba(255,255,255,.92); color: var(--green); display:flex; align-items:center; justify-content:center;
  font-size:14px; z-index:2; opacity:0; transform: scale(.8); transition: opacity .25s ease, transform .25s ease;
  box-shadow: 0 6px 16px rgba(9,37,25,.18);
}
.vr-plan-card:hover .vr-plan-zoom{ opacity:1; transform: scale(1); }
.vr-plan-badge{
  position:absolute; top:18px; left:18px; background: var(--green); color:#fff;
  font-family: var(--ff-head); font-size:12px; font-weight:700; letter-spacing:.04em;
  padding: 7px 16px; border-radius: 30px; z-index:2;
}
.vr-plan-index{
  position:absolute; top:16px; right:20px; font-family: var(--ff-head); font-size:34px; font-weight:700;
  color: var(--border); z-index:1; line-height:1;
}
.vr-plan-info{ padding: 26px 26px 28px; border-top: 1px solid var(--border); }
.vr-plan-info-top{ display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; }
.vr-plan-info h4{ font-size: 21px; }
.vr-plan-price{ font-family: var(--ff-head); font-size: 19px; font-weight:700; color: var(--gold); white-space:nowrap; }
.vr-plan-divider{ height:1px; background: var(--border); margin-bottom:18px; }
.vr-plan-specs{ display:flex; align-items:center; gap: 10px; color: var(--muted); font-size:13.5px; margin-bottom:22px; }
.vr-plan-specs i{ color: var(--gold); }
.vr-plan-cta{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  font-family: var(--ff-body); font-size:12.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  color: var(--ink); padding-top: 4px; transition: color .2s ease, gap .2s ease;
}
.vr-plan-cta i{ color: var(--gold); transition: transform .25s ease; }
.vr-plan-card:hover .vr-plan-cta{ color: var(--gold); gap:16px; }
.vr-plan-card:hover .vr-plan-cta i{ transform: translateX(4px); }

/* ---------- features ---------- */
.vr-features-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap: 32px; margin-top: 50px; }
.vr-feature{ display:flex; gap:18px; }
.vr-feature-icon{
  width:52px; height:52px; border-radius:50%; background: var(--cream); color: var(--gold);
  display:flex; align-items:center; justify-content:center; flex-shrink:0; font-size:20px;
}
.vr-feature h4{ font-size:17px; margin-bottom:8px; }
.vr-feature p{ color: var(--muted); font-size: 14.5px; margin:0; }
.vr-features-grid.cols-2{ grid-template-columns: repeat(2, 1fr); max-width: 820px; margin-left:auto; margin-right:auto; }

/* ---------- faq ---------- */
.vr-faq{ max-width: 820px; margin: 50px auto 0; }
.vr-faq-item{ border-bottom: 1px solid var(--border); }
.vr-faq-q{
  display:flex; align-items:center; justify-content:space-between; gap:20px;
  padding: 22px 4px; cursor:pointer; font-family: var(--ff-head); font-weight:600; font-size:16.5px;
}
.vr-faq-q .plus{ color: var(--gold); font-size:22px; flex-shrink:0; transition: transform .3s ease; }
.vr-faq-item.open .vr-faq-q .plus{ transform: rotate(45deg); }
.vr-faq-a{ max-height:0; overflow:hidden; transition: max-height .35s ease; }
.vr-faq-a p{ color: var(--muted); padding: 0 4px 22px; margin:0; font-size:15px; }

/* ---------- breadcrumb hero ---------- */
.vr-breadcrumb{ background: var(--cream); padding: 76px 0 44px; text-align:center; border-bottom: 1px solid var(--border); }
.vr-breadcrumb h1{ color: var(--ink); font-size: clamp(30px, 4vw, 50px); font-weight:800; margin-bottom:16px; }
.vr-breadcrumb p{ color: var(--muted); font-size:16px; max-width:640px; margin: 0 auto; }
.vr-breadcrumb .vr-eyebrow{ justify-content:center; }

/* ---------- map frame ---------- */
.vr-map-frame{
  background: var(--white); border: 1px solid var(--border); border-radius: 18px;
  padding: 22px; margin-top: 50px; box-shadow: 0 20px 50px rgba(9,37,25,.08);
}
.vr-map-frame img{ border-radius: 8px; }
.vr-map-embed{ position: relative; width:100%; aspect-ratio: 16/8; border-radius: 8px; overflow:hidden; }
.vr-map-embed iframe{ position:absolute; inset:0; width:100%; height:100%; }
@media (max-width: 640px){ .vr-map-frame{ padding: 12px; } .vr-map-embed{ aspect-ratio: 4/5; } }

/* ---------- location tabs ---------- */
.vr-tabs-nav{ display:flex; justify-content:center; gap:10px; flex-wrap:wrap; margin-bottom: 40px; }
.vr-tab-btn{
  padding: 12px 24px; border-radius: 30px; border: 1px solid var(--border); background: var(--white);
  font-size: 13.5px; font-weight:600; cursor:pointer; transition: all .25s;
}
.vr-tab-btn.active{ background: var(--gold); color:#fff; border-color: var(--gold); }
.vr-tab-panel{ display:none; }
.vr-tab-panel.active{ display:grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
.vr-loc-item{ display:flex; gap:16px; background: var(--white); border:1px solid var(--border); border-radius:10px; padding: 20px; align-items:flex-start; }
.vr-loc-icon{ width:44px; height:44px; border-radius:50%; background: var(--cream); color: var(--gold); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.vr-loc-item h5{ font-size:15.5px; margin:0 0 4px; font-family: var(--ff-head); font-weight:600; }
.vr-loc-item .dist{ color: var(--gold); font-weight:700; font-size:13px; }
.vr-loc-item p{ margin: 4px 0 0; font-size:13.5px; color: var(--muted); }

/* ---------- gallery ---------- */
.vr-gallery-grid{ display:grid; grid-template-columns: repeat(4, 1fr); gap: 18px; margin-top: 50px; }
.vr-gallery-item{ position:relative; border-radius:10px; overflow:hidden; cursor: pointer; aspect-ratio: 4/3; }
.vr-gallery-item img{ width:100%; height:100%; object-fit:cover; transition: transform .4s ease; }
.vr-gallery-item:hover img{ transform: scale(1.08); }
.vr-gallery-cap{
  position:absolute; inset:auto 0 0 0; padding: 14px 16px;
  background: linear-gradient(180deg, transparent, rgba(9,37,25,.85));
  color:#fff; font-size:13.5px; font-weight:600;
}
.vr-lightbox{ position:fixed; inset:0; background: rgba(9,37,25,.94); z-index: 9999; display:none; align-items:center; justify-content:center; padding: 30px; }
.vr-lightbox.is-open{ display:flex; }
.vr-lightbox img{ max-width: 90vw; max-height: 85vh; border-radius: 8px; }
.vr-lightbox-close{ position:absolute; top:26px; right:32px; color:#fff; font-size:34px; cursor:pointer; background:none; border:none; }
.vr-lightbox-cap{ position:absolute; bottom: 30px; color:#fff; font-size:14px; text-align:center; width:100%; left:0; }

/* ---------- pre-footer cta ---------- */
.vr-precta{ background: var(--white); padding: 90px 0; }
.vr-precta-inner{ display:flex; align-items:center; justify-content:space-between; gap: 40px; flex-wrap:wrap; }
.vr-precta h2{ font-size: clamp(24px, 2.6vw, 36px); font-weight:700; margin-top:6px; }
.vr-precta h2 span{ color: var(--gold); }
.vr-precta-actions{ display:flex; align-items:center; gap: 26px; flex-wrap:wrap; }
.vr-precta-phone{ display:flex; flex-direction:column; }
.vr-precta-phone small{ font-size:11px; letter-spacing:.08em; text-transform:uppercase; color: var(--muted); margin-bottom:4px; }
.vr-precta-phone strong{ font-size: 20px; }

/* ---------- footer ---------- */
.vr-footer{ background: var(--cream); color: var(--muted); border-top: 1px solid var(--border); }
.vr-footer-grid{ display:grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 40px; padding: 70px 28px 50px; }
.vr-footer-logo{ height:56px; width:auto; margin-bottom: 18px; }
.vr-footer-brand p{ font-size:14px; color: var(--muted); }
.vr-footer-col h4{ color: var(--ink); font-size:14px; letter-spacing:.06em; text-transform:uppercase; margin-bottom: 20px; }
.vr-footer-col ul li{ margin-bottom: 12px; font-size: 14px; }
.vr-footer-col a:hover{ color: var(--gold); }
.vr-footer-cta-link{ color: var(--gold); font-weight:600; }
.vr-footer-rera{ color: var(--gold); font-weight:700; font-size:16px; margin-bottom:6px; }
.vr-footer-rera-note{ font-size:13px; color: var(--muted); }
.vr-footer-bottom{ border-top: 1px solid var(--border); padding: 20px 0; }
.vr-footer-bottom-inner{ text-align:center; font-size:13px; color: var(--muted); }
.tenant-legal-disclaimer{ background: var(--cream) !important; border-top: 1px solid var(--border); }
.tenant-legal-disclaimer p{ color: var(--muted) !important; }

/* ---------- contact page ---------- */
.vr-contact-grid{ display:grid; grid-template-columns: 1fr 1.1fr; gap: 60px; margin-top: 50px; align-items:start; }
.vr-contact-info{ display:flex; flex-direction:column; gap: 24px; }
.vr-contact-info-item{ display:flex; gap:16px; align-items:flex-start; }
.vr-contact-info-item .ic{ width:48px; height:48px; border-radius:50%; background: var(--cream); color: var(--gold); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.vr-contact-info-item h5{ font-size:14px; text-transform:uppercase; letter-spacing:.06em; color: var(--muted); margin-bottom:6px; }
.vr-contact-info-item div a, .vr-contact-info-item div span{ font-size:16px; font-weight:600; }
.vr-contact-map{ margin-top:10px; border-radius:10px; overflow:hidden; box-shadow: 0 20px 50px rgba(9,37,25,.12); }
.vr-form{ background: var(--white); border: 1px solid var(--border); border-radius: 12px; padding: 40px; box-shadow: 0 24px 60px rgba(9,37,25,.08); }
.vr-form-row{ display:flex; gap:16px; }
.vr-form-row .vr-form-group{ flex:1; }
.vr-form-group{ margin-bottom: 18px; }
.vr-form-group label{ display:block; font-size:13px; font-weight:600; margin-bottom:8px; color: var(--ink); }
.vr-form-group input, .vr-form-group textarea{
  width:100%; border: 1px solid var(--border); border-radius:6px; padding: 14px 16px;
  font-family: var(--ff-body); font-size:14.5px; background: var(--cream); transition: border-color .2s;
}
.vr-form-group input:focus, .vr-form-group textarea:focus{ outline:none; border-color: var(--gold); }
.vr-form-group textarea{ min-height: 110px; resize:vertical; }
.vr-form-submit{ width:100%; background: var(--gold); color:#fff; border:none; padding:16px; border-radius:6px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; cursor:pointer; font-size:14px; transition: background .2s; }
.vr-form-submit:hover{ background:#a86f10; }
.vr-form-note{ font-size:12px; color: var(--muted); text-align:center; margin-top:14px; }

/* ---------- responsive ---------- */
@media (max-width: 1080px){
  .vr-amenities-grid{ grid-template-columns: repeat(4,1fr); }
  .vr-stats-grid{ grid-template-columns: repeat(2,1fr); }
  .vr-plans-grid{ grid-template-columns: repeat(2,1fr); }
  .vr-features-grid{ grid-template-columns: repeat(2,1fr); }
  .vr-gallery-grid{ grid-template-columns: repeat(3,1fr); }
  .vr-footer-grid{ grid-template-columns: 1fr 1fr; }
}
@media (max-width: 900px){
  .vr-nav{ position: fixed; top: 0; right: -100%; width: 78%; max-width: 320px; height: 100vh;
    background: var(--white); padding: 100px 30px 30px; transition: right .35s ease; z-index: 600; }
  .vr-nav.is-open{ right:0; box-shadow: -20px 0 50px rgba(0,0,0,.3); }
  .vr-nav ul{ flex-direction: column; gap: 22px; }
  .vr-nav-toggle{ display:flex; }
  .vr-header-phone{ display:none; }
  .vr-topstrip-inner{ font-size:11px; }
  .vr-split{ grid-template-columns: 1fr; gap: 40px; }
  .vr-split.reverse .vr-split-img{ order:0; }
  .vr-precta-inner{ flex-direction:column; align-items:flex-start; text-align:left; }
  .vr-contact-grid{ grid-template-columns: 1fr; }
}
@media (max-width: 640px){
  .vr-section{ padding: 64px 0; }
  .vr-amenities-grid{ grid-template-columns: repeat(2,1fr); }
  .vr-plans-grid{ grid-template-columns: 1fr; }
  .vr-features-grid, .vr-features-grid.cols-2{ grid-template-columns: 1fr; }
  .vr-gallery-grid{ grid-template-columns: repeat(2,1fr); }
  .vr-stats-grid{ grid-template-columns: repeat(2,1fr); }
  .vr-footer-grid{ grid-template-columns: 1fr; padding: 50px 24px 40px; }
  .vr-tab-panel.active{ grid-template-columns: 1fr; }
  .vr-form{ padding: 26px; }
  .vr-form-row{ flex-direction:column; gap:0; }
}