/* ═══════════════════════════════════════════════════════
   TVH CREST — style.css
   ═══════════════════════════════════════════════════════ */

/* ── Variables ─────────────────────────────────────────── */
:root {
  --purple:      #1E88C8;
  --purple-deep: #1A5A8A;
  --magenta:     #1670B0;
  --gold:        #C8A855;
  --gold-light:  #E8D080;
  --white:       #FFFFFF;
  --off-white:   #F4F8FC;
  --text-dark:   #0A1A2E;
  --text-mid:    #2A4060;
  --text-light:  #6A90A8;
  --ease:        0.3s ease;
}

/* ── Reset ─────────────────────────────────────────────── */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html  { scroll-behavior: smooth; overflow-x: hidden; }
body  { font-family: 'Jost', sans-serif; background: var(--white); color: var(--text-dark); overflow-x: hidden; }
a     { text-decoration: none; color: inherit; }
img   { max-width: 100%; display: block; }
button { font-family: inherit; cursor: pointer; border: none; }

/* ── Scroll Reveal ─────────────────────────────────────── */
.reveal, .reveal-left, .reveal-right {
  opacity: 0;
  transition: opacity .75s ease, transform .75s ease;
}
.reveal       { transform: translateY(40px); }
.reveal-left  { transform: translateX(-50px); }
.reveal-right { transform: translateX(50px); }
.reveal.visible, .reveal-left.visible, .reveal-right.visible { opacity: 1; transform: none; }

/* ── Navbar ────────────────────────────────────────────── */
#navbar {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  display: flex; align-items: center; justify-content: space-between;
  padding: 18px 60px;
  transition: background var(--ease), box-shadow var(--ease);
}
#navbar.scrolled {
  background: rgba(26,90,138,.96);
  backdrop-filter: blur(12px);
  box-shadow: 0 4px 30px rgba(0,0,0,.3);
}
.nav-logo { display: flex; flex-direction: column; }
.logo-crest { font-family: 'Playfair Display', serif; font-weight: 900; font-size: 26px; color: var(--white); letter-spacing: -1px; }
.logo-crest span { color: var(--gold-light); }
.logo-tag   { font-size: 10px; color: rgba(255,255,255,.6); letter-spacing: 2px; text-transform: uppercase; }
.nav-links  { display: flex; align-items: center; gap: 36px; }
.nav-links a {
  color: rgba(255,255,255,.85); font-size: 13px; font-weight: 500;
  letter-spacing: 1.5px; text-transform: uppercase;
  transition: color var(--ease); position: relative;
}
.nav-links a::after {
  content: ''; position: absolute; left: 0; bottom: -3px;
  width: 0; height: 1px; background: var(--gold-light);
  transition: width var(--ease);
}
.nav-links a:hover { color: var(--gold-light); }
.nav-links a:hover::after { width: 100%; }
.nav-cta {
  background: var(--gold) !important; color: var(--text-dark) !important;
  padding: 10px 24px !important; border-radius: 2px;
  font-weight: 600 !important;
}
.nav-cta::after { display: none !important; }
.nav-cta:hover  { background: var(--gold-light) !important; transform: translateY(-1px); }

/* ── Buttons ───────────────────────────────────────────── */
.btn-primary {
  display: inline-block;
  background: var(--gold); color: var(--text-dark);
  padding: 15px 36px; border-radius: 2px; border: none;
  font-family: 'Jost', sans-serif; font-weight: 600;
  font-size: 13px; letter-spacing: 1.5px; text-transform: uppercase;
  cursor: pointer;
  transition: background var(--ease), transform .2s, box-shadow var(--ease);
  box-shadow: 0 8px 30px rgba(200,168,85,.35);
}
.btn-primary:hover { background: var(--gold-light); transform: translateY(-2px); box-shadow: 0 12px 40px rgba(200,168,85,.5); }
.btn-outline {
  display: inline-block;
  background: transparent; color: var(--white);
  padding: 14px 36px; border-radius: 2px;
  border: 1px solid rgba(255,255,255,.45);
  font-family: 'Jost', sans-serif; font-weight: 500;
  font-size: 13px; letter-spacing: 1.5px; text-transform: uppercase;
  cursor: pointer;
  transition: border-color var(--ease), background var(--ease), transform .2s;
}
.btn-outline:hover { border-color: var(--white); background: rgba(255,255,255,.1); transform: translateY(-2px); }

/* ── Section Helpers ───────────────────────────────────── */
.section-tag {
  display: inline-block; font-size: 10px; letter-spacing: 3px;
  text-transform: uppercase; color: var(--purple);
  background: rgba(123,31,162,.08); border: 1px solid rgba(123,31,162,.2);
  padding: 6px 14px; border-radius: 2px; margin-bottom: 18px;
}
.section-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(30px, 4vw, 52px); font-weight: 700;
  color: var(--text-dark); line-height: 1.15; margin-bottom: 16px;
}
.section-title span { color: var(--purple); }
.section-sub  { font-size: 15px; color: var(--text-mid); line-height: 1.75; font-weight: 300; }
.divider-line { width: 60px; height: 3px; background: linear-gradient(90deg, var(--purple), var(--gold)); border-radius: 2px; margin: 20px 0; }

/* ── Hero ──────────────────────────────────────────────── */
#hero {
  width: 100%;
  line-height: 0;
  background: none;
}
.hero-grid {
  position: absolute; inset: 0; pointer-events: none;
  background-image: linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px),
                    linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px);
  background-size: 80px 80px;
  animation: gridMove 20s linear infinite;
}
@keyframes gridMove { to { transform: translateY(80px); } }
.hero-glow {
  position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(ellipse at 20% 80%, rgba(200,168,85,.12) 0%, transparent 55%),
              radial-gradient(ellipse at 80% 20%, rgba(255,255,255,.06) 0%, transparent 50%);
}
.hero-inner {
  position: relative; z-index: 2; width: 100%; max-width: 1280px;
  margin: 0 auto; padding: 130px 60px 90px;
  display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center;
}
/* -- Left -- */
.hero-badge {
  display: inline-flex; align-items: center; gap: 8px;
  background: rgba(200,168,85,.15); border: 1px solid rgba(200,168,85,.4);
  color: var(--gold-light); font-size: 11px; letter-spacing: 2.5px;
  text-transform: uppercase; padding: 7px 16px; border-radius: 2px;
  margin-bottom: 28px;
  animation: fadeDown .8s ease both;
}
.hero-badge-dot { width: 6px; height: 6px; background: var(--gold); border-radius: 50%; animation: pulse 2s infinite; }
@keyframes pulse   { 0%,100%{ opacity:1; } 50%{ opacity:.3; } }
@keyframes fadeDown{ from{ opacity:0; transform:translateY(-16px); } to{ opacity:1; transform:none; } }
.hero-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(42px,5.5vw,76px); font-weight: 700;
  color: var(--white); line-height: 1.08; margin-bottom: 24px;
  animation: fadeUp .9s .2s ease both;
}
.hero-title em { font-style: normal; color: var(--gold-light); display: block; }
.hero-sub {
  font-size: 16px; color: rgba(255,255,255,.72); line-height: 1.7;
  max-width: 430px; margin-bottom: 42px; font-weight: 300;
  animation: fadeUp .9s .4s ease both;
}
@keyframes fadeUp{ from{ opacity:0; transform:translateY(30px); } to{ opacity:1; transform:none; } }
.hero-actions { display: flex; gap: 16px; flex-wrap: wrap; animation: fadeUp .9s .55s ease both; }
.hero-stats {
  display: flex; gap: 36px;
  margin-top: 52px; padding-top: 32px;
  border-top: 1px solid rgba(255,255,255,.12);
  animation: fadeUp .9s .7s ease both;
}
.stat-val  { font-family: 'Playfair Display',serif; font-size: 32px; font-weight: 700; color: var(--gold-light); line-height:1; }
.stat-label{ font-size: 11px; color: rgba(255,255,255,.55); letter-spacing: 1.5px; text-transform: uppercase; margin-top: 5px; }
/* -- Right card -- */
.hero-card-wrap { position: relative; animation: cardIn 1s .3s ease both; }
@keyframes cardIn{ from{ opacity:0; transform:translateX(60px) rotate(2deg); } to{ opacity:1; transform:none; } }
.hero-card {
  background: rgba(255,255,255,.09); backdrop-filter: blur(16px);
  border: 1px solid rgba(255,255,255,.16); border-radius: 4px; overflow: hidden;
}
.hero-card-img {
  width: 100%; aspect-ratio: 4/3;
  background: linear-gradient(180deg, rgba(74,0,114,.3) 0%, rgba(74,0,114,.75) 100%),
    url('https://images.unsplash.com/photo-1545324418-cc1a3fa10c00?w=800&auto=format&fit=crop') center/cover;
  display: flex; align-items: flex-end; padding: 26px;
}
.card-img-tag { font-size: 10px; letter-spacing: 2px; text-transform: uppercase; color: var(--gold-light); margin-bottom: 5px; }
.card-img-title{ font-family: 'Playfair Display',serif; font-size: 22px; font-weight: 600; color: var(--white); }
.hero-card-info{ padding: 22px 26px; display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.info-chip { background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.12); border-radius: 3px; padding: 12px 14px; }
.info-chip-label{ font-size: 10px; color: rgba(255,255,255,.5); letter-spacing: 1.5px; text-transform: uppercase; margin-bottom: 4px; }
.info-chip-val  { font-size: 13px; color: var(--white); font-weight: 500; }
.hero-rera-badge{
  position: absolute; top: -18px; right: -18px;
  width: 95px; height: 95px; border-radius: 50%;
  background: var(--gold);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  box-shadow: 0 8px 30px rgba(200,168,85,.5);
  animation: sway 6s ease-in-out infinite;
}
@keyframes sway{ 0%,100%{ transform:rotate(-3deg) scale(1); } 50%{ transform:rotate(3deg) scale(1.04); } }
.rera-text{ font-family:'Playfair Display',serif; font-size: 11px; font-weight: 700; color: var(--text-dark); text-align:center; line-height:1.2; }
/* scroll hint */
.scroll-hint{
  position:absolute; bottom:30px; left:50%; transform:translateX(-50%);
  display:flex; flex-direction:column; align-items:center; gap:8px;
  color:rgba(255,255,255,.4); font-size:10px; letter-spacing:2px; text-transform:uppercase;
  cursor:pointer; animation:bounce 2.5s infinite;
}
.scroll-line{ width:1px; height:40px; background:linear-gradient(to bottom,rgba(255,255,255,.5),transparent); }
@keyframes bounce{ 0%,100%{ transform:translateX(-50%) translateY(0); } 50%{ transform:translateX(-50%) translateY(8px); } }

/* ── Overview ──────────────────────────────────────────── */
#overview {
  padding: 100px 60px; max-width: 1280px; margin: 0 auto;
  display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center;
}
.ov-visual { position: relative; }
.ov-img {
  width: 100%; aspect-ratio: 4/5; border-radius: 4px; overflow: hidden;
  background: none;
}
.ov-img::after{ display:none; }
.ov-accent{
  position:absolute; bottom:-26px; right:-26px;
  background:var(--gold); padding:26px 30px; border-radius:3px;
  box-shadow:0 12px 40px rgba(200,168,85,.4);
}
.ov-accent-val  { font-family:'Playfair Display',serif; font-size:38px; font-weight:700; color:var(--text-dark); line-height:1; }
.ov-accent-label{ font-size:11px; color:rgba(26,10,46,.7); letter-spacing:1.5px; text-transform:uppercase; margin-top:4px; }
.ov-chip-wrap{
  position:absolute; top:28px; right:-38px;
  background:white; border-radius:3px; padding:16px 18px;
  box-shadow:0 8px 40px rgba(0,0,0,.15); min-width:145px;
}
.ov-chip-icon { font-size:22px; margin-bottom:6px; }
.ov-chip-val  { font-weight:700; font-size:15px; color:var(--text-dark); }
.ov-chip-label{ font-size:11px; color:var(--text-light); }
.feat-grid{ display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:34px; }
.feat-chip{
  display:flex; align-items:center; gap:10px;
  padding:12px 14px; background:var(--off-white);
  border-radius:3px; border-left:3px solid var(--purple);
  font-size:13px; font-weight:500; color:var(--text-mid);
  transition:background var(--ease), border-color var(--ease);
}
.feat-chip:hover{ background:rgba(123,31,162,.06); border-color:var(--gold); }
.feat-chip .icon{ font-size:16px; }
.ov-stat-bar{
  display:flex; gap:0; margin-top:40px;
  background:var(--off-white);
  border-radius:4px; overflow:hidden;
  border:1px solid rgba(123,31,162,.1);
}
.ov-stat{
  flex:1; padding:28px 24px;
  border-right:1px solid rgba(123,31,162,.1);
  position:relative;
}
.ov-stat:last-child{ border-right:none; }
.ov-stat-val{
  font-family:'Playfair Display',serif;
  font-size:36px; font-weight:700;
  color:var(--purple); line-height:1;
  margin-bottom:6px;
}
.ov-stat-label{
  font-size:11px; font-weight:600;
  letter-spacing:1.5px; text-transform:uppercase;
  color:var(--text-light);
}

/* ── Units ─────────────────────────────────────────────── */
#units{
  background:linear-gradient(135deg,var(--purple-deep) 0%,var(--purple) 60%,var(--magenta) 100%);
  padding:100px 60px; overflow:hidden; position:relative;
}
#units::before{
  content:''; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(ellipse at 10% 90%,rgba(200,168,85,.14) 0%,transparent 55%),
             linear-gradient(rgba(255,255,255,.02) 1px,transparent 1px),
             linear-gradient(90deg,rgba(255,255,255,.02) 1px,transparent 1px);
  background-size:100% 100%,60px 60px,60px 60px;
}
.units-inner{ max-width:1280px; margin:0 auto; position:relative; }
.units-header{ display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:52px; flex-wrap:wrap; gap:20px; }
.units-header .section-tag  { color:var(--gold-light); background:rgba(200,168,85,.12); border-color:rgba(200,168,85,.3); }
.units-header .section-title{ color:var(--white); }
.units-header .section-title span{ color:var(--gold-light); }
.units-header .section-sub  { color:rgba(255,255,255,.65); max-width:280px; }
.units-header .divider-line { background:linear-gradient(90deg,var(--gold),rgba(200,168,85,.2)); }
.units-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-bottom:36px; }
.unit-card{
  background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.14);
  border-radius:4px; padding:30px 26px; position:relative; overflow:hidden;
  transition:background var(--ease), border-color var(--ease), transform var(--ease);
}
.unit-card::before{
  content:''; position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg,var(--gold),rgba(200,168,85,.3));
  opacity:0; transition:opacity var(--ease);
}
.unit-card:hover{ background:rgba(255,255,255,.13); border-color:rgba(200,168,85,.4); transform:translateY(-4px); }
.unit-card:hover::before{ opacity:1; }
.unit-no  { font-size:11px; letter-spacing:2px; text-transform:uppercase; color:var(--gold-light); margin-bottom:8px; }
.unit-type{ font-family:'Playfair Display',serif; font-size:26px; font-weight:700; color:var(--white); margin-bottom:6px; }
.unit-area{ font-size:13px; color:rgba(255,255,255,.55); margin-bottom:20px; }
.unit-area strong{ color:var(--gold-light); font-size:18px; }
.unit-meta{ display:flex; gap:20px; }
.meta-key { font-size:10px; color:rgba(255,255,255,.4); letter-spacing:1.5px; text-transform:uppercase; margin-bottom:3px; }
.meta-val { font-size:13px; color:rgba(255,255,255,.8); font-weight:500; }
/* table */
.units-table-wrap{ background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); border-radius:4px; overflow:auto; }
.units-table{ width:100%; border-collapse:collapse; font-size:13px; min-width:500px; }
.units-table thead th{
  background:rgba(200,168,85,.2); color:var(--gold-light);
  padding:14px 20px; text-align:left; font-weight:600; font-size:11px; letter-spacing:1.5px; text-transform:uppercase;
}
.units-table tbody tr{ border-top:1px solid rgba(255,255,255,.06); transition:background .2s; }
.units-table tbody tr:hover{ background:rgba(255,255,255,.07); }
.units-table tbody td{ padding:13px 20px; color:rgba(255,255,255,.8); }
.units-table tbody td:first-child{ color:rgba(255,255,255,.4); font-size:12px; }
.badge-2bhk{ display:inline-block; padding:3px 10px; border-radius:2px; font-size:11px; font-weight:600; letter-spacing:1px; background:#FFFFFF; color:rgba(26,90,138,.5); }
.badge-1bhk{ display:inline-block; padding:3px 10px; border-radius:2px; font-size:11px; font-weight:600; letter-spacing:1px; background:rgba(26,90,138,.5); color:#FFFFFF; }

/* ── Amenities ─────────────────────────────────────────── */
#amenities{ padding:100px 60px; }
.amenities-inner{ max-width:1280px; margin:0 auto; }
.amenities-header{ text-align:center; margin-bottom:60px; }
.amenities-header .divider-line{ margin:20px auto; }
.amenities-header .section-sub { margin:0 auto; max-width:540px; }
.amenities-grid{ display:flex; flex-wrap:wrap; justify-content:center; gap:0; border:1px solid rgba(123,31,162,.12); border-radius:4px; overflow:hidden; background:white; }
.amenity-card{
  flex:1 1 120px; max-width:160px;
  background:white; padding:28px 16px 22px;
  text-align:center; position:relative;
  border-right:1px solid rgba(123,31,162,.1);
  border-bottom:1px solid rgba(123,31,162,.1);
  transition:background var(--ease), transform var(--ease);
  cursor:default;
}
.amenity-card:last-child{ border-right:none; }
.amenity-card::after{ display:none; }
.amenity-card:hover{ background:var(--off-white); transform:translateY(-3px); box-shadow:none; border-color:rgba(123,31,162,.1); }
.amenity-icon{
  width:54px; height:54px; border-radius:50%;
  background:transparent;
  border:2px solid var(--gold);
  display:flex; align-items:center; justify-content:center;
  font-size:22px; margin:0 auto 12px;
  box-shadow:none;
  transition:transform var(--ease), border-color var(--ease);
}
.amenity-card:hover .amenity-icon{ transform:scale(1.08); border-color:var(--gold-light); }
.amenity-card:hover .amenity-icon{ transform:scale(1.08); }
.amenity-name{ font-weight:600; font-size:13px; color:var(--text-dark); margin-bottom:0; line-height:1.3; }
.amenity-desc{ display:none; }

/* ── Location ──────────────────────────────────────────── */
#location{ background:var(--off-white); padding:100px 60px; }
.location-inner{ max-width:1280px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }
.loc-grid{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:34px; }
.loc-card{
  background:white; border:1px solid rgba(123,31,162,.1); border-radius:4px;
  padding:20px 18px; display:flex; align-items:flex-start; gap:14px;
  transition:box-shadow var(--ease), transform var(--ease);
}
.loc-card:hover{ box-shadow:0 8px 30px rgba(123,31,162,.12); transform:translateY(-2px); }
.loc-icon{
  width:40px; height:40px; min-width:40px; border-radius:50%;
  background:linear-gradient(135deg,var(--purple),var(--magenta));
  display:flex; align-items:center; justify-content:center; font-size:17px;
}
.loc-name { font-weight:600; font-size:13px; color:var(--text-dark); margin-bottom:3px; }
.loc-dist { font-size:12px; color:var(--purple); font-weight:500; }
/* map card */
.map-card{ background:white; border:1px solid rgba(123,31,162,.12); border-radius:4px; overflow:hidden; box-shadow:0 15px 60px rgba(0,0,0,.09); }
.map-head{ background:linear-gradient(135deg,var(--purple-deep),var(--purple)); padding:20px 26px; }
.map-head h3{ font-family:'Playfair Display',serif; font-size:18px; color:white; margin-bottom:4px; }
.map-head p { font-size:12px; color:rgba(255,255,255,.65); }
.map-body{
  height:290px; position:relative;
  background:linear-gradient(rgba(123,31,162,.05),rgba(123,31,162,.02)),
    url('https://images.unsplash.com/photo-1569336415962-a4bd9f69cd83?w=700&auto=format&fit=crop') center/cover;
}
.map-pin{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); display:flex; flex-direction:column; align-items:center; }
.pin-dot{ width:18px; height:18px; background:var(--purple); border-radius:50%; border:3px solid white; box-shadow:0 4px 16px rgba(123,31,162,.5); }
.pin-ring{ position:absolute; width:18px; height:18px; border:2px solid var(--purple); border-radius:50%; animation:ringPulse 2s infinite; }
@keyframes ringPulse{ 0%{ transform:scale(1); opacity:.8; } 100%{ transform:scale(3.5); opacity:0; } }
.pin-label{ margin-top:12px; background:white; padding:5px 14px; border-radius:2px; font-size:12px; font-weight:600; color:var(--purple); box-shadow:0 4px 16px rgba(0,0,0,.15); white-space:nowrap; }
.map-footer{ padding:18px 26px; display:flex; gap:12px; align-items:center; border-top:1px solid rgba(123,31,162,.08); }
.map-footer-icon{ font-size:18px; color:var(--purple); }
.map-addr{ font-size:13px; color:var(--text-mid); line-height:1.5; }
.map-addr strong{ color:var(--text-dark); }

/* ── Specs ─────────────────────────────────────────────── */
#specs{
  background:linear-gradient(135deg,var(--purple-deep),var(--purple));
  padding:100px 60px; overflow:hidden; position:relative;
}
#specs::before{
  content:''; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(ellipse at 80% 20%,rgba(200,168,85,.12) 0%,transparent 60%);
}
.specs-inner{ max-width:1280px; margin:0 auto; position:relative; }
.specs-header{ text-align:center; margin-bottom:60px; }
.specs-header .section-tag  { color:var(--gold-light); background:rgba(200,168,85,.12); border-color:rgba(200,168,85,.3); }
.specs-header .section-title{ color:white; }
.specs-header .section-title span{ color:var(--gold-light); }
.specs-header .section-sub  { color:rgba(255,255,255,.65); max-width:540px; margin:0 auto; }
.specs-header .divider-line { background:linear-gradient(90deg,var(--gold),rgba(200,168,85,.2)); margin:20px auto; }
.specs-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:2px; background:rgba(255,255,255,.08); border-radius:4px; overflow:hidden; }
.spec-block{
  background:rgba(255,255,255,.05); padding:40px 28px; text-align:center;
  transition:background var(--ease);
}
.spec-block:hover{ background:rgba(255,255,255,.1); }
.spec-icon { font-size:36px; display:block; margin-bottom:16px; }
.spec-headline{ font-family:'Playfair Display',serif; font-size:20px; font-weight:700; color:var(--gold-light); margin-bottom:8px; line-height:1.2; }
.spec-detail  { font-size:13px; color:rgba(255,255,255,.6); line-height:1.65; }

/* ── Contact ───────────────────────────────────────────── */
#contact{ padding:100px 60px; }
.contact-inner{ max-width:1280px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }
.contact-title{ font-family:'Playfair Display',serif; font-size:clamp(28px,3.5vw,44px); font-weight:700; color:var(--text-dark); line-height:1.15; margin-bottom:18px; }
.contact-title span{ color:var(--purple); }
.contact-sub  { font-size:15px; color:var(--text-mid); line-height:1.75; margin-bottom:38px; font-weight:300; }
.contact-detail{ display:flex; align-items:center; gap:16px; margin-bottom:20px; }
.detail-icon{
  width:46px; height:46px; border-radius:50%; flex-shrink:0;
  background:linear-gradient(135deg,var(--purple),var(--magenta));
  display:flex; align-items:center; justify-content:center; font-size:19px;
  box-shadow:0 6px 20px rgba(123,31,162,.3);
}
.detail-label{ font-size:11px; color:var(--text-light); letter-spacing:1px; text-transform:uppercase; }
.detail-value{ font-size:16px; font-weight:600; color:var(--text-dark); }
.tvh-brand{ margin-top:36px; padding-top:32px; border-top:1px solid rgba(123,31,162,.1); display:flex; align-items:center; gap:16px; }
.tvh-logo { font-family:'Playfair Display',serif; font-size:32px; font-weight:900; color:var(--purple-deep); letter-spacing:-1px; }
.tvh-tag  { font-size:11px; color:var(--text-light); letter-spacing:2px; text-transform:uppercase; }
.tvh-sub  { font-size:12px; color:var(--text-light); margin-top:2px; }
/* form */
.contact-form{ background:var(--off-white); border:1px solid rgba(123,31,162,.1); border-radius:4px; padding:48px 44px; }
.form-head   { margin-bottom:28px; }
.form-head h3{ font-family:'Playfair Display',serif; font-size:22px; color:var(--text-dark); margin-bottom:5px; }
.form-head p { font-size:13px; color:var(--text-light); }
.form-row    { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.form-group  { margin-bottom:20px; }
.form-group label{
  display:block; font-size:11px; font-weight:600; letter-spacing:1.5px;
  text-transform:uppercase; color:var(--text-mid); margin-bottom:7px;
}
.form-group input,
.form-group select,
.form-group textarea{
  width:100%; padding:12px 15px;
  background:white; border:1px solid rgba(123,31,162,.18); border-radius:2px;
  font-family:'Jost',sans-serif; font-size:14px; color:var(--text-dark); outline:none;
  transition:border-color var(--ease), box-shadow var(--ease);
  appearance:none;
}
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus{ border-color:var(--purple); box-shadow:0 0 0 3px rgba(123,31,162,.08); }
.form-group textarea{ height:90px; resize:none; }
/* honeypot hidden */
.hp-field{ display:none; }
/* submit btn full width */
.btn-submit{ width:100%; padding:16px; border-radius:2px; }
/* status messages */
.form-msg{
  display:none; margin-top:18px; padding:14px 18px;
  border-radius:3px; font-size:14px; line-height:1.5; text-align:center;
}
.form-msg.success{ display:block; background:#f0fdf4; border:1px solid #86efac; color:#166534; }
.form-msg.error  { display:block; background:#fef2f2; border:1px solid #fca5a5; color:#991b1b; }
.form-msg.loading{ display:block; background:rgba(123,31,162,.06); border:1px solid rgba(123,31,162,.2); color:var(--purple); }

/* ── Sticky CTA ────────────────────────────────────────── */
.sticky-cta{
  position:fixed; bottom:30px; right:30px; z-index:90;
  opacity:0; pointer-events:none;
  transform:translateY(10px);
  transition:opacity .4s, transform .4s;
}
.sticky-cta.show{ opacity:1; pointer-events:all; transform:none; }
.float-brochure{
    padding:11px 18px;
    border-radius:50px;
    font-size:12px;
  }
  .float-brochure .brochure-text{ display:inline; }
.sticky-cta a{
  display:flex; align-items:center; gap:10px;
  background:var(--purple); color:white;
  padding:13px 22px; border-radius:50px; font-weight:600; font-size:13px;
  box-shadow:0 8px 30px rgba(123,31,162,.45);
  transition:background var(--ease), transform .2s, box-shadow var(--ease);
  cursor:pointer;
}
.sticky-cta a:hover{ background:var(--purple-deep); transform:translateY(-2px); box-shadow:0 12px 40px rgba(123,31,162,.6); }

/* ── Floating Brochure ─── */
.float-brochure{
  position:fixed; bottom:30px; left:30px; z-index:90;
  transition:background var(--ease), transform .2s, box-shadow var(--ease), opacity .4s;
  display:flex; align-items:center; gap:8px;
  background:var(--gold); color:var(--text-dark);
  padding:13px 22px; border-radius:50px;
  font-weight:600; font-size:13px;
  box-shadow:0 8px 30px rgba(200,168,85,.5);
  cursor:pointer;
  transition:background var(--ease), transform .2s, box-shadow var(--ease);
}

.float-brochure.hide-above-footer{ opacity:0 !important; pointer-events:none !important; }
.float-brochure:hover{ background:var(--gold-light); transform:translateY(-2px); box-shadow:0 12px 40px rgba(200,168,85,.6); }

/* ── Popup Overlay ─────── */
.popup-overlay{
  position:fixed; inset:0; z-index:200;
  background:rgba(26,10,46,.75);
  backdrop-filter:blur(6px);
  display:flex; align-items:center; justify-content:center;
  opacity:0; pointer-events:none;
  transition:opacity .4s ease;
}
.popup-overlay.active{ opacity:1; pointer-events:all; }

.popup-modal{
  background:white; border-radius:6px; overflow:hidden;
  display:grid; grid-template-columns:1fr 1fr;
  width:100%; max-width:780px; max-height:90vh;
  overflow-y:auto;
  transform:translateY(30px) scale(.97);
  transition:transform .4s ease;
  position:relative;
}
.popup-overlay.active .popup-modal{ transform:none; }

.popup-modal--slim{
  grid-template-columns:1fr;
  max-width:440px;
}

.popup-left{
  min-height:300px;
  overflow:hidden;
}

.popup-right{ padding:40px 36px; }
.popup-title{
  font-family:'Playfair Display',serif;
  font-size:26px; font-weight:700;
  color:var(--text-dark); line-height:1.2;
  margin:12px 0 8px;
}
.popup-title span{ color:var(--purple); }
.popup-sub{ font-size:13px; color:var(--text-light); margin-bottom:24px; line-height:1.6; }

.popup-close{
  position:absolute; top:14px; right:16px;
  background:rgba(0,0,0,.08); border:none;
  width:32px; height:32px; border-radius:50%;
  font-size:18px; line-height:1; cursor:pointer;
  color:var(--text-dark); z-index:10;
  transition:background var(--ease);
}
.popup-close:hover{ background:rgba(0,0,0,.18); }

@media(max-width:640px){
  .popup-modal{ grid-template-columns:1fr; }
  .popup-left{ display:none; }
  .popup-right{ padding:32px 24px; }

  .float-brochure{
    width:50px; height:50px;
    border-radius:50%;
    padding:0;
    display:flex; align-items:center; justify-content:center;
    font-size:20px;
    overflow:hidden;
  }
  .float-brochure .brochure-text{ display:none; }

  .sticky-cta a{
    padding:11px 18px;
    border-radius:50px;
    font-size:12px;
  }
  .sticky-cta .call-text{ display:inline; }

  /* Fix horizontal overflow */
  #units{ padding:60px 16px; }
  .units-grid{ grid-template-columns:1fr; }
  .units-table-wrap{ overflow-x:auto; max-width:100%; }
  .units-table{ min-width:380px; font-size:12px; }
  .units-table thead th{ padding:12px 12px; }
  .units-table tbody td{ padding:11px 12px; }
}

/* ── Footer ────────────────────────────────────────────── */
footer{ background:var(--purple-deep); padding:34px 60px; }
.footer-inner{ max-width:1280px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px; }
.footer-logo{ font-family:'Playfair Display',serif; font-size:20px; font-weight:900; color:rgba(255,255,255,.5); letter-spacing:-0.5px; }
.footer-logo span{ color:var(--gold-light); }
.footer-copy { font-size:12px; color:rgba(255,255,255,.4); }
.footer-links{ display:flex; gap:24px; }
.footer-links a{ font-size:12px; color:rgba(255,255,255,.5); transition:color var(--ease); }
.footer-links a:hover{ color:var(--gold-light); }

/* ── Responsive ────────────────────────────────────────── */
@media(max-width:1024px){
  .hero-inner, #overview, .location-inner, .contact-inner{ grid-template-columns:1fr; gap:50px; }
  #navbar{ padding:14px 20px; }
  #hero .hero-inner{ padding:120px 40px 80px; }
  .hero-card-wrap{ max-width:480px; }
  .amenities-grid, .specs-grid{ grid-template-columns:repeat(2,1fr); }
  .units-grid{ grid-template-columns:1fr 1fr; }
  #units,#amenities,#location,#specs,#contact,#overview{ padding:70px 40px; }
}
@media(max-width:640px){
  .hero-banner-img{ height:auto; width:100%; object-fit:cover; }
  .hamburger{
  display:none; flex-direction:column; gap:5px;
  background:none; border:none; cursor:pointer; padding:4px; z-index:101;
}
.hamburger span{
  display:block; width:24px; height:2px;
  background:white; border-radius:2px;
  transition:transform .3s, opacity .3s;
}
.hamburger.open span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.hamburger.open span:nth-child(2){ opacity:0; }
.hamburger.open span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

@media(max-width:640px){
  .hamburger{ display:flex; }
  .nav-links{
    display:none;
    position:fixed; top:0; left:0; right:0;
    background:rgba(26,90,138,.98);
    backdrop-filter:blur(12px);
    flex-direction:column; align-items:center; justify-content:center;
    gap:32px; height:100vh; z-index:100;
  }
  .nav-links.open{ display:flex; }
  .nav-links a{ font-size:18px; }
  .hero-stats{ gap:22px; }
  .amenities-grid, .specs-grid, .units-grid{ grid-template-columns:1fr; }
  .loc-grid, .form-row, .feat-grid{ grid-template-columns:1fr; }
  .footer-inner{ flex-direction:column; text-align:center; }
  #units,#amenities,#location,#specs,#contact,#overview{ padding:60px 24px; }
  #navbar{ padding:14px 20px; }
  .contact-form{ padding:32px 24px; }
}}