/* ═══════════════════════════════════════════════════════════════
   LUMENOID PROPERTIES — Unified Design System v1.0
   "Architecture That Lives With You."
   
   TABLE OF CONTENTS
   ─────────────────────────────────────────────────────────────
   01. Design Tokens (CSS Custom Properties)
   02. Reset & Base
   03. Typography Utilities
   04. Button System
   05. Section Headers & Labels
   06. Navbar
   07. Hero (Homepage)
   08. Bento Grid
   09. Projects Section
   10. Property Detail (Spec chips, images)
   11. Amenities Section
   12. Gallery
   13. Stats Section
   14. Testimonials
   15. Contact / Forms
   16. Footer
   17. ── Property Page Extensions ──
   18. Breadcrumb
   19. Property Hero (Two-column)
   20. Quick Info Bar
   21. Property Gallery Bento
   22. Apartment Configuration Cards
   23. Floor Plan Section + Modal
   24. Location Section
   25. Construction Timeline
   26. Final CTA Banner
   27. Sticky Mobile CTA
   28. ── About Page ──
   29. About Hero
   30. Mission / Vision Bento
   31. Team Cards
   32. Awards & Recognition
   33. ── Contact Page ──
   34. Contact Hero Strip
   35. Contact Grid Layout
   36. Office Cards
   37. PHP Form States (success / error)
   38. Keyframes
   39. Responsive Overrides
═══════════════════════════════════════════════════════════════ */

/* ─────────────────────────────────────────────────────────────
   01. DESIGN TOKENS
───────────────────────────────────────────────────────────── */
:root {
  /* ── Core Surfaces ── */
  --color-deep:          #0B0F1A;
  --color-surface:       #111827;
  --color-surface-2:     #1a2235;
  --color-surface-3:     #1f2b3e;
  --color-border:        rgba(255,255,255,0.07);
  --color-border-hover:  rgba(255,255,255,0.15);

  /* ── Brand Accents ── */
  --violet:              #7C3AED;
  --violet-light:        #9F67FF;
  --violet-glow:         rgba(124,58,237,0.35);
  --cyan:                #22D3EE;
  --cyan-light:          #67E8F9;
  --cyan-glow:           rgba(34,211,238,0.30);
  --rose:                #FB7185;
  --rose-glow:           rgba(251,113,133,0.30);
  --emerald:             #10B981;
  --emerald-glow:        rgba(16,185,129,0.30);
  --amber:               #F59E0B;
  --indigo:              #4F46E5;
  --teal:                #14B8A6;
  --purple:              #A855F7;

  /* ── Text Scale ── */
  --text-primary:        #F8FAFC;
  --text-secondary:      rgba(248,250,252,0.70);
  --text-muted:          rgba(248,250,252,0.45);

  /* ── Gradient Library ── */
  --grad-violet-cyan:    linear-gradient(135deg, #7C3AED, #22D3EE);
  --grad-rose-violet:    linear-gradient(135deg, #FB7185, #7C3AED);
  --grad-cyan-emerald:   linear-gradient(135deg, #22D3EE, #10B981);
  --grad-text:           linear-gradient(135deg, #7C3AED 0%, #22D3EE 50%, #FB7185 100%);

  /* ── Glass System ── */
  --glass-bg:            rgba(255,255,255,0.04);
  --glass-border:        rgba(255,255,255,0.08);
  --glass-blur:          blur(24px);

  /* ── Shadow Scale ── */
  --shadow-sm:           0 2px 8px rgba(0,0,0,0.4);
  --shadow-md:           0 8px 32px rgba(0,0,0,0.5), 0 2px 8px rgba(0,0,0,0.3);
  --shadow-lg:           0 24px 64px rgba(0,0,0,0.6), 0 8px 24px rgba(0,0,0,0.4);
  --shadow-violet:       0 8px 32px var(--violet-glow), 0 2px 8px rgba(0,0,0,0.5);
  --shadow-cyan:         0 8px 32px var(--cyan-glow), 0 2px 8px rgba(0,0,0,0.5);

  /* ── Radius Scale ── */
  --r-sm:   8px;
  --r-md:   16px;
  --r-lg:   24px;
  --r-xl:   32px;
  --r-full: 9999px;

  /* ── Spacing ── */
  --section-pad: clamp(80px, 10vw, 140px);

  /* ── Motion ── */
  --ease-smooth:  cubic-bezier(0.4, 0, 0.2, 1);
  --ease-spring:  cubic-bezier(0.175, 0.885, 0.32, 1.275);
  --t-fast:  200ms;
  --t-base:  300ms;
  --t-slow:  450ms;
}

/* ─────────────────────────────────────────────────────────────
   02. RESET & BASE
───────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html {
  scroll-behavior: smooth;
  scroll-padding-top: 80px;
}

body {
  font-family: 'Inter', sans-serif;
  font-weight: 400;
  background: var(--color-deep);
  color: var(--text-primary);
  line-height: 1.6;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5 {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: -0.02em;
}

a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
ul { list-style: none; }

.container {
  width: min(1280px, 100% - 48px);
  margin-inline: auto;
}

.br-desk { display: none; }
@media (min-width: 768px) { .br-desk { display: block; } }

/* ─────────────────────────────────────────────────────────────
   03. TYPOGRAPHY UTILITIES
───────────────────────────────────────────────────────────── */
.gradient-text {
  background: var(--grad-text);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* ─────────────────────────────────────────────────────────────
   04. BUTTON SYSTEM
───────────────────────────────────────────────────────────── */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 24px;
  border-radius: var(--r-full);
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 700;
  font-size: 0.875rem;
  letter-spacing: 0.01em;
  cursor: pointer;
  border: none;
  transition: all var(--t-base) var(--ease-smooth);
  position: relative;
  overflow: hidden;
  white-space: nowrap;
}
.btn::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(255,255,255,0.12);
  opacity: 0;
  transition: opacity var(--t-fast);
}
.btn:hover::before { opacity: 1; }
.btn__icon { width: 16px; height: 16px; flex-shrink: 0; }

.btn--primary {
  background: var(--grad-violet-cyan);
  color: white;
  box-shadow: var(--shadow-violet);
}
.btn--primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 40px var(--violet-glow), 0 4px 16px rgba(0,0,0,0.5);
}

.btn--ghost {
  background: var(--glass-bg);
  border: 1px solid var(--glass-border);
  color: var(--text-primary);
  backdrop-filter: var(--glass-blur);
}
.btn--ghost:hover {
  background: rgba(255,255,255,0.08);
  border-color: var(--color-border-hover);
  transform: translateY(-2px);
}

.btn--glow {
  background: rgba(124,58,237,0.20);
  border: 1px solid rgba(124,58,237,0.45);
  color: var(--violet-light);
  box-shadow: 0 0 20px rgba(124,58,237,0.20);
}
.btn--glow:hover {
  background: rgba(124,58,237,0.35);
  box-shadow: 0 0 32px rgba(124,58,237,0.40);
  transform: translateY(-1px);
}

.btn--sm  { padding: 9px 18px; font-size: 0.8rem; }
.btn--lg  { padding: 16px 32px; font-size: 1rem; }
.btn--full { width: 100%; justify-content: center; }

/* ─────────────────────────────────────────────────────────────
   05. SECTION HEADERS & LABELS
───────────────────────────────────────────────────────────── */
.section-tag {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  border-radius: var(--r-full);
  background: rgba(124,58,237,0.12);
  border: 1px solid rgba(124,58,237,0.25);
  color: var(--violet-light);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-bottom: 20px;
}
.tag__icon { width: 14px; height: 14px; }

.section-header { margin-bottom: clamp(48px, 6vw, 72px); }

.section-title {
  font-size: clamp(2.2rem, 4.5vw, 3.8rem);
  line-height: 1.05;
  margin-bottom: 16px;
}

.section-sub {
  font-size: 1.05rem;
  color: var(--text-secondary);
  max-width: 520px;
  line-height: 1.7;
}

/* ─────────────────────────────────────────────────────────────
   06. NAVBAR
───────────────────────────────────────────────────────────── */
.navbar {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 100;
  padding: 16px 0;
  transition: all var(--t-base) var(--ease-smooth);
}
.navbar.scrolled {
  background: rgba(11,15,26,0.82);
  backdrop-filter: blur(28px) saturate(180%);
  border-bottom: 1px solid var(--color-border);
  padding: 12px 0;
}
.navbar__inner {
  display: flex;
  align-items: center;
  gap: 24px;
  width: min(1280px, 100% - 48px);
  margin-inline: auto;
}
.navbar__logo {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}
.logo__mark {
  width: 36px; height: 36px;
  background: var(--grad-violet-cyan);
  border-radius: 10px;
  display: grid;
  place-items: center;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 800;
  font-size: 1.1rem;
  color: white;
  box-shadow: var(--shadow-violet);
  flex-shrink: 0;
}
.logo__text {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 700;
  font-size: 1rem;
  color: var(--text-primary);
}
.logo__text em {
  font-style: normal;
  background: var(--grad-violet-cyan);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.navbar__menu {
  display: flex;
  gap: 4px;
  margin-left: auto;
}
.nav__link {
  padding: 8px 14px;
  border-radius: var(--r-full);
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--text-secondary);
  transition: all var(--t-fast);
}
.nav__link:hover,
.nav__link--active {
  color: var(--text-primary);
  background: var(--glass-bg);
}
.nav__link--active {
  background: rgba(124,58,237,0.12);
  color: var(--violet-light);
}
.navbar__cta { margin-left: 16px; }
.navbar__burger {
  display: none;
  flex-direction: column;
  gap: 5px;
  background: none;
  border: none;
  cursor: pointer;
  padding: 8px;
  margin-left: auto;
}
.navbar__burger span {
  display: block;
  width: 24px; height: 2px;
  background: var(--text-primary);
  border-radius: 2px;
  transition: all var(--t-base) var(--ease-smooth);
}

/* ─────────────────────────────────────────────────────────────
   07. HERO (Homepage)
───────────────────────────────────────────────────────────── */
.hero {
  position: relative;
  min-height: 100svh;
  display: flex;
  align-items: center;
  padding: 120px 0 80px;
  overflow: hidden;
}
.hero__atmosphere { position: absolute; inset: 0; pointer-events: none; }

.atm-blob {
  position: absolute;
  border-radius: 50%;
  filter: blur(80px);
  animation: blobFloat 8s ease-in-out infinite alternate;
}
.atm-blob--violet {
  width: 600px; height: 600px;
  background: radial-gradient(circle, rgba(124,58,237,0.28) 0%, transparent 70%);
  top: -100px; left: -100px;
  animation-delay: 0s;
}
.atm-blob--cyan {
  width: 500px; height: 500px;
  background: radial-gradient(circle, rgba(34,211,238,0.20) 0%, transparent 70%);
  top: 200px; right: -50px;
  animation-delay: 2s;
}
.atm-blob--rose {
  width: 400px; height: 400px;
  background: radial-gradient(circle, rgba(251,113,133,0.15) 0%, transparent 70%);
  bottom: 0; left: 30%;
  animation-delay: 4s;
}
.atm-blob--deep {
  width: 800px; height: 800px;
  background: radial-gradient(circle, rgba(79,70,229,0.10) 0%, transparent 60%);
  top: 50%; left: 50%;
  transform: translate(-50%,-50%);
}
.hero__shapes { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.shape--ring {
  position: absolute;
  width: 400px; height: 400px;
  border: 1px solid rgba(124,58,237,0.15);
  border-radius: 50%;
  top: 10%; right: 5%;
  animation: shapeSpin 30s linear infinite;
}
.shape--ring::before {
  content: '';
  position: absolute;
  width: 6px; height: 6px;
  background: var(--violet-light);
  border-radius: 50%;
  top: 0; left: 50%;
  transform: translateX(-50%);
  box-shadow: 0 0 12px var(--violet-light);
}
.shape--arc {
  position: absolute;
  width: 200px; height: 200px;
  border: 1px solid rgba(34,211,238,0.12);
  border-radius: 50%;
  bottom: 20%; right: 10%;
  animation: shapeSpin 20s linear infinite reverse;
}
.shape--dot-grid {
  position: absolute;
  top: 20%; left: 5%;
  width: 120px; height: 120px;
  background-image: radial-gradient(circle, rgba(255,255,255,0.10) 1px, transparent 1px);
  background-size: 16px 16px;
  opacity: 0.6;
}
.hero__content { position: relative; z-index: 2; max-width: 820px; }
.hero__badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 18px;
  border-radius: var(--r-full);
  background: rgba(124,58,237,0.12);
  border: 1px solid rgba(124,58,237,0.30);
  color: var(--violet-light);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  margin-bottom: 28px;
  animation: fadeSlideUp 0.8s var(--ease-smooth) 0.1s both;
}
.badge__icon { width: 13px; height: 13px; }
.hero__headline {
  font-size: clamp(3.2rem, 8vw, 7.5rem);
  font-weight: 800;
  line-height: 0.95;
  letter-spacing: -0.04em;
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-bottom: 28px;
}
.headline--line { display: block; animation: fadeSlideUp 0.9s var(--ease-smooth) both; }
.headline--line:nth-child(1) { animation-delay: 0.2s; }
.headline--line:nth-child(2) { animation-delay: 0.35s; }
.headline--line:nth-child(3) { animation-delay: 0.5s; }
.headline--gradient {
  background: var(--grad-text);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.hero__sub {
  font-size: clamp(1rem, 1.5vw, 1.2rem);
  color: var(--text-secondary);
  line-height: 1.75;
  margin-bottom: 36px;
  max-width: 600px;
  animation: fadeSlideUp 0.9s var(--ease-smooth) 0.6s both;
}
.hero__ctas {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 56px;
  animation: fadeSlideUp 0.9s var(--ease-smooth) 0.75s both;
}
.hero__stats {
  display: flex;
  align-items: center;
  padding: 20px 28px;
  background: var(--glass-bg);
  backdrop-filter: var(--glass-blur);
  border: 1px solid var(--glass-border);
  border-radius: var(--r-xl);
  width: fit-content;
  flex-wrap: wrap;
  gap: 4px;
  animation: fadeSlideUp 0.9s var(--ease-smooth) 0.9s both;
}
.stat-pill { display: flex; flex-direction: column; align-items: center; padding: 0 24px; }
.stat__num {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 1.6rem; font-weight: 800;
  color: var(--text-primary); line-height: 1;
}
.stat__plus {
  font-size: 1.1rem;
  background: var(--grad-violet-cyan);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.stat__label { font-size: 0.72rem; color: var(--text-muted); font-weight: 500; letter-spacing: 0.03em; margin-top: 3px; white-space: nowrap; }
.stat-divider { width: 1px; height: 36px; background: var(--color-border); flex-shrink: 0; }

.hero__float-card {
  position: absolute;
  right: clamp(20px,5%,80px);
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
  width: 260px;
  background: rgba(26,34,53,0.85);
  backdrop-filter: blur(32px);
  border: 1px solid var(--glass-border);
  border-radius: var(--r-lg);
  overflow: hidden;
  box-shadow: var(--shadow-lg), 0 0 40px rgba(124,58,237,0.15);
  animation: fadeSlideLeft 1s var(--ease-smooth) 1s both;
}
.float-card__img { height: 140px; background: var(--color-surface-3); overflow: hidden; }
.float-card__img-placeholder {
  width: 100%; height: 100%;
  display: grid; place-items: center;
  background: linear-gradient(135deg, rgba(124,58,237,0.3), rgba(34,211,238,0.2));
}
.fcp__icon { width: 40px; height: 40px; color: rgba(255,255,255,0.4); }
.float-card__body { padding: 16px; }
.float-card__tag {
  display: inline-block; padding: 3px 10px;
  border-radius: var(--r-full);
  background: linear-gradient(135deg, var(--violet), var(--cyan));
  font-size: 0.65rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; margin-bottom: 8px;
}
.float-card__name { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 700; font-size: 0.95rem; margin-bottom: 4px; }
.float-card__price { font-size: 0.85rem; color: var(--cyan-light); font-weight: 600; margin-bottom: 8px; }
.float-card__meta { display: flex; align-items: center; gap: 5px; font-size: 0.72rem; color: var(--text-muted); }
.float-card__meta i { width: 12px; height: 12px; }

.hero__scroll-hint {
  position: absolute; bottom: 32px; left: 50%; transform: translateX(-50%);
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  opacity: 0.45; animation: fadeSlideUp 1s var(--ease-smooth) 1.2s both;
}
.scroll-line {
  width: 1px; height: 48px;
  background: linear-gradient(to bottom, transparent, rgba(255,255,255,0.5), transparent);
  animation: scrollPulse 2s ease-in-out infinite;
}
.hero__scroll-hint span { font-size: 0.7rem; letter-spacing: 0.1em; text-transform: uppercase; }

/* ─────────────────────────────────────────────────────────────
   08. BENTO GRID
───────────────────────────────────────────────────────────── */
.bento-section { padding: var(--section-pad) 0; }
.bento-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 16px; }
.bento-card {
  position: relative; padding: 28px;
  border-radius: var(--r-xl);
  border: 1px solid var(--glass-border);
  overflow: hidden;
  transition: transform var(--t-base) var(--ease-smooth), box-shadow var(--t-base) var(--ease-smooth);
  cursor: default;
}
.bento-card:hover { transform: translateY(-4px); border-color: var(--color-border-hover); }
.bento-card[data-bento="a"] { grid-column: span 5; grid-row: span 2; min-height: 340px; }
.bento-card[data-bento="b"] { grid-column: span 4; }
.bento-card[data-bento="c"] { grid-column: span 3; }
.bento-card[data-bento="d"] { grid-column: span 3; }
.bento-card[data-bento="e"] { grid-column: span 4; }
.bento-card[data-bento="f"] { grid-column: span 5; }
.bento-card__glow { position: absolute; inset: 0; border-radius: inherit; opacity: 0; transition: opacity var(--t-slow); pointer-events: none; }
.bento-card:hover .bento-card__glow { opacity: 1; }
.bento-card--violet { background: linear-gradient(135deg, rgba(124,58,237,0.20) 0%, rgba(79,70,229,0.12) 100%); }
.bento-card--violet .bento-card__glow { background: radial-gradient(circle at 30% 30%, rgba(124,58,237,0.25), transparent 70%); }
.bento-card--violet:hover { box-shadow: 0 20px 60px rgba(124,58,237,0.25); }
.bento-card--cyan  { background: linear-gradient(135deg, rgba(34,211,238,0.15) 0%, rgba(20,184,166,0.10) 100%); }
.bento-card--cyan:hover  { box-shadow: 0 20px 60px rgba(34,211,238,0.20); }
.bento-card--emerald { background: linear-gradient(135deg, rgba(16,185,129,0.15) 0%, rgba(20,184,166,0.10) 100%); }
.bento-card--emerald:hover { box-shadow: 0 20px 60px rgba(16,185,129,0.20); }
.bento-card--rose   { background: linear-gradient(135deg, rgba(251,113,133,0.15) 0%, rgba(244,63,94,0.10) 100%); }
.bento-card--rose:hover   { box-shadow: 0 20px 60px rgba(251,113,133,0.20); }
.bento-card--indigo { background: linear-gradient(135deg, rgba(79,70,229,0.18) 0%, rgba(124,58,237,0.10) 100%); }
.bento-card--dark   { background: rgba(255,255,255,0.03); }
.bento-card__icon-wrap {
  width: 44px; height: 44px; border-radius: 12px;
  background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.10);
  display: grid; place-items: center; margin-bottom: 16px; color: var(--text-primary);
}
.bento-card__icon-wrap i { width: 22px; height: 22px; }
.bento-card--violet  .bento-card__icon-wrap { background: rgba(124,58,237,0.25); border-color: rgba(124,58,237,0.35); color: var(--violet-light); }
.bento-card--cyan    .bento-card__icon-wrap { background: rgba(34,211,238,0.20); border-color: rgba(34,211,238,0.30); color: var(--cyan-light); }
.bento-card--emerald .bento-card__icon-wrap { background: rgba(16,185,129,0.20); border-color: rgba(16,185,129,0.30); color: #6EE7B7; }
.bento-card--rose    .bento-card__icon-wrap { background: rgba(251,113,133,0.20); border-color: rgba(251,113,133,0.30); color: #FCA5A5; }
.bento-card__title { font-size: clamp(1.1rem, 1.8vw, 1.4rem); font-weight: 800; margin-bottom: 10px; }
.bento-card__text  { font-size: 0.88rem; color: var(--text-secondary); line-height: 1.65; }
.bento-card__metric { display: flex; flex-direction: column; margin-top: 20px; }
.metric__num {
  font-family: 'Plus Jakarta Sans', sans-serif; font-size: 2.4rem; font-weight: 800; line-height: 1;
  background: var(--grad-text); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.metric__label { font-size: 0.75rem; color: var(--text-muted); font-weight: 500; letter-spacing: 0.03em; margin-top: 4px; }
.bento-card__link { display: inline-flex; align-items: center; gap: 6px; margin-top: 20px; font-size: 0.82rem; font-weight: 700; color: var(--violet-light); transition: gap var(--t-fast), opacity var(--t-fast); }
.bento-card__link i { width: 14px; height: 14px; }
.bento-card__link:hover { gap: 10px; }
.bento-progress { margin-top: 16px; }
.progress-bar { height: 5px; background: rgba(255,255,255,0.10); border-radius: 99px; overflow: hidden; margin-bottom: 6px; }
.progress-bar__fill { height: 100%; width: var(--fill); background: var(--grad-cyan-emerald); border-radius: 99px; animation: progressFill 1.5s var(--ease-smooth) 0.5s both; }
.bento-progress span { font-size: 0.72rem; color: var(--text-muted); font-weight: 500; }
.satisfaction-ring { position: relative; width: 80px; height: 80px; margin-top: 16px; }
.ring-svg { width: 80px; height: 80px; transform: rotate(-90deg); }
.ring-bg  { fill: none; stroke: rgba(255,255,255,0.08); stroke-width: 6; }
.ring-fill { fill: none; stroke: url(#ringGrad); stroke-width: 6; stroke-linecap: round; stroke-dasharray: 201; stroke-dashoffset: calc(201 - (201 * var(--pct) / 100)); animation: ringDraw 1.5s var(--ease-smooth) 0.3s both; }
.ring-label { position: absolute; inset: 0; display: grid; place-items: center; font-family: 'Plus Jakarta Sans', sans-serif; font-size: 1.1rem; font-weight: 800; background: var(--grad-text); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.bento-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.tag-chip { padding: 5px 12px; border-radius: var(--r-full); background: rgba(255,255,255,0.06); border: 1px solid var(--glass-border); font-size: 0.72rem; font-weight: 600; color: var(--text-secondary); letter-spacing: 0.02em; }

/* ─────────────────────────────────────────────────────────────
   09. PROJECTS SECTION
───────────────────────────────────────────────────────────── */
.projects-section { padding: var(--section-pad) 0; background: linear-gradient(180deg, transparent, rgba(124,58,237,0.04), transparent); }
.filter-bar { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 48px; }
.filter-btn { padding: 9px 20px; border-radius: var(--r-full); background: var(--glass-bg); border: 1px solid var(--glass-border); color: var(--text-secondary); font-family: 'Plus Jakarta Sans', sans-serif; font-size: 0.82rem; font-weight: 600; cursor: pointer; transition: all var(--t-fast) var(--ease-smooth); }
.filter-btn:hover, .filter-btn--active { background: rgba(124,58,237,0.20); border-color: rgba(124,58,237,0.40); color: var(--violet-light); }
.projects-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 24px; }
.project-card { background: var(--color-surface); border-radius: var(--r-xl); border: 1px solid var(--color-border); overflow: hidden; transition: transform var(--t-base) var(--ease-smooth), box-shadow var(--t-base) var(--ease-smooth), border-color var(--t-base); }
.project-card:hover { transform: translateY(-8px); box-shadow: var(--shadow-lg), 0 0 40px rgba(124,58,237,0.15); border-color: rgba(124,58,237,0.30); }
.project-card__media { position: relative; }
.project-card__img { height: 220px; position: relative; overflow: hidden; display: flex; align-items: flex-end; justify-content: space-between; padding: 14px; transition: transform var(--t-slow) var(--ease-smooth); }
.project-card:hover .project-card__img { transform: scale(1.02); }
.project-card__img--1 { background: linear-gradient(160deg, #1a1040 0%, #2d1b6b 40%, #0f4a6e 100%); }
.project-card__img--2 { background: linear-gradient(160deg, #0f2027 0%, #203a43 40%, #2c5364 100%); }
.project-card__img--3 { background: linear-gradient(160deg, #1a0a2e 0%, #2d1b5a 40%, #1a3a5e 100%); }
.project-card__img--4 { background: linear-gradient(160deg, #0a1a2e 0%, #153450 40%, #1e5040 100%); }
.project-card__img-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,0.65) 0%, transparent 60%); }
.project-card__badge { position: relative; z-index: 2; padding: 4px 11px; border-radius: var(--r-full); font-size: 0.65rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; }
.badge--new    { background: var(--grad-violet-cyan); color: white; }
.badge--hot    { background: linear-gradient(135deg, var(--rose), var(--amber)); color: white; }
.badge--rera   { background: rgba(255,255,255,0.12); border: 1px solid rgba(255,255,255,0.20); color: rgba(255,255,255,0.8); font-size: 0.55rem; }
.badge--coming { background: rgba(245,158,11,0.25); border: 1px solid rgba(245,158,11,0.4); color: var(--amber); }
.project-card__body { padding: 20px 22px 22px; }
.project-card__meta { display: flex; align-items: center; gap: 5px; font-size: 0.75rem; color: var(--text-muted); margin-bottom: 8px; }
.meta-icon { width: 12px; height: 12px; color: var(--violet-light); }
.project-card__name { font-size: clamp(1.1rem, 1.5vw, 1.3rem); font-weight: 800; margin-bottom: 12px; }
.project-card__chips { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 16px; }
.chip { display: inline-flex; align-items: center; gap: 5px; padding: 4px 10px; border-radius: var(--r-full); background: var(--glass-bg); border: 1px solid var(--glass-border); font-size: 0.72rem; font-weight: 500; color: var(--text-secondary); }
.chip i { width: 11px; height: 11px; }
.project-card__price-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; padding-top: 16px; border-top: 1px solid var(--color-border); }
.price-label { display: block; font-size: 0.7rem; color: var(--text-muted); font-weight: 500; margin-bottom: 3px; }
.price-value { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 1.2rem; font-weight: 800; color: var(--cyan-light); }

/* ─────────────────────────────────────────────────────────────
   10. PROPERTY DETAIL SPEC SECTION
───────────────────────────────────────────────────────────── */
.detail-section { padding: var(--section-pad) 0; background: linear-gradient(135deg, rgba(124,58,237,0.05), rgba(34,211,238,0.03)); border-top: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); }
.detail-wrapper { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(40px,6vw,80px); align-items: center; }
.detail-desc { font-size: 1rem; color: var(--text-secondary); line-height: 1.75; margin-bottom: 32px; max-width: 480px; }
.spec-chips-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 36px; }
.spec-chip { display: flex; align-items: center; gap: 12px; padding: 14px 16px; background: var(--glass-bg); border: 1px solid var(--glass-border); border-radius: var(--r-md); transition: all var(--t-fast); }
.spec-chip:hover { background: rgba(124,58,237,0.10); border-color: rgba(124,58,237,0.25); }
.spec-chip--accent { background: linear-gradient(135deg, rgba(124,58,237,0.15), rgba(34,211,238,0.10)); border-color: rgba(124,58,237,0.30); }
.spec-chip__icon { width: 36px; height: 36px; border-radius: 9px; background: rgba(255,255,255,0.06); display: grid; place-items: center; flex-shrink: 0; color: var(--violet-light); }
.spec-chip__icon i { width: 16px; height: 16px; }
.spec-chip__label { display: block; font-size: 0.68rem; color: var(--text-muted); font-weight: 500; letter-spacing: 0.03em; text-transform: uppercase; }
.spec-chip__val   { display: block; font-family: 'Plus Jakarta Sans', sans-serif; font-size: 0.88rem; font-weight: 700; }
.detail-img-wrap  { position: relative; height: 500px; }
.detail-img { position: absolute; border-radius: var(--r-xl); display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 8px; overflow: hidden; border: 1px solid var(--glass-border); transition: transform var(--t-base) var(--ease-smooth); }
.detail-img:hover { transform: scale(1.02); }
.detail-img--main { top: 0; left: 0; right: 0; bottom: 80px; background: linear-gradient(160deg, #1a1040 0%, #2d1b6b 40%, #0f4a6e 100%); }
.detail-img--thumb { width: 46%; bottom: 0; height: 100px; background: linear-gradient(135deg, rgba(34,211,238,0.15), rgba(124,58,237,0.15)); }
.detail-img--thumb-1 { left: 0; }
.detail-img--thumb-2 { right: 0; }
.detail-img__icon  { width: 32px; height: 32px; color: rgba(255,255,255,0.30); }
.detail-img__label { font-size: 0.72rem; color: rgba(255,255,255,0.40); letter-spacing: 0.05em; }
.detail-price-float { position: absolute; bottom: 90px; right: -16px; background: rgba(17,24,39,0.90); backdrop-filter: blur(20px); border: 1px solid rgba(124,58,237,0.35); border-radius: var(--r-md); padding: 14px 18px; box-shadow: 0 12px 40px rgba(124,58,237,0.25); z-index: 4; display: flex; flex-direction: column; }
.dpf__label { font-size: 0.65rem; color: var(--text-muted); font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; }
.dpf__price { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 1.4rem; font-weight: 800; background: var(--grad-violet-cyan); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; line-height: 1.1; margin: 3px 0; }
.dpf__info  { font-size: 0.65rem; color: var(--text-muted); }

/* ─────────────────────────────────────────────────────────────
   11. AMENITIES
───────────────────────────────────────────────────────────── */
.amenities-section { padding: var(--section-pad) 0; }
.amenities-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 16px; }
.amenity-card { position: relative; padding: 24px; border-radius: var(--r-xl); border: 1px solid var(--glass-border); overflow: hidden; cursor: default; transition: transform var(--t-base) var(--ease-smooth), box-shadow var(--t-base) var(--ease-smooth); grid-column: span 3; }
.amenity-card--lg { grid-column: span 4; }
.amenity-card:hover { transform: translateY(-5px); }
.amenity-card__bg-icon { position: absolute; right: -10px; bottom: -10px; opacity: 0.06; transform: scale(3.5); color: white; }
.amenity-card__bg-icon i { width: 48px; height: 48px; }
.amenity-card__icon { width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; margin-bottom: 16px; position: relative; z-index: 1; }
.amenity-card__icon i { width: 22px; height: 22px; }
.amenity-card h4 { font-size: 1rem; font-weight: 800; margin-bottom: 8px; position: relative; z-index: 1; }
.amenity-card p  { font-size: 0.82rem; color: var(--text-secondary); line-height: 1.6; position: relative; z-index: 1; }
.amenity-card--violet  { background: linear-gradient(135deg, rgba(124,58,237,0.18), rgba(79,70,229,0.10)); }
.amenity-card--violet  .amenity-card__icon { background: rgba(124,58,237,0.25); color: var(--violet-light); }
.amenity-card--violet:hover  { box-shadow: 0 16px 48px rgba(124,58,237,0.25); }
.amenity-card--cyan    { background: linear-gradient(135deg, rgba(34,211,238,0.15), rgba(20,184,166,0.08)); }
.amenity-card--cyan    .amenity-card__icon { background: rgba(34,211,238,0.20); color: var(--cyan-light); }
.amenity-card--cyan:hover    { box-shadow: 0 16px 48px rgba(34,211,238,0.18); }
.amenity-card--rose    { background: linear-gradient(135deg, rgba(251,113,133,0.15), rgba(244,63,94,0.08)); }
.amenity-card--rose    .amenity-card__icon { background: rgba(251,113,133,0.20); color: #FCA5A5; }
.amenity-card--rose:hover    { box-shadow: 0 16px 48px rgba(251,113,133,0.18); }
.amenity-card--emerald { background: linear-gradient(135deg, rgba(16,185,129,0.15), rgba(20,184,166,0.08)); }
.amenity-card--emerald .amenity-card__icon { background: rgba(16,185,129,0.20); color: #6EE7B7; }
.amenity-card--emerald:hover { box-shadow: 0 16px 48px rgba(16,185,129,0.18); }
.amenity-card--amber   { background: linear-gradient(135deg, rgba(245,158,11,0.15), rgba(251,191,36,0.08)); }
.amenity-card--amber   .amenity-card__icon { background: rgba(245,158,11,0.20); color: #FCD34D; }
.amenity-card--amber:hover   { box-shadow: 0 16px 48px rgba(245,158,11,0.18); }
.amenity-card--indigo  { background: linear-gradient(135deg, rgba(79,70,229,0.18), rgba(124,58,237,0.10)); }
.amenity-card--indigo  .amenity-card__icon { background: rgba(79,70,229,0.25); color: #A5B4FC; }
.amenity-card--indigo:hover  { box-shadow: 0 16px 48px rgba(79,70,229,0.22); }
.amenity-card--teal    { background: linear-gradient(135deg, rgba(20,184,166,0.15), rgba(6,182,212,0.08)); }
.amenity-card--teal    .amenity-card__icon { background: rgba(20,184,166,0.20); color: #5EEAD4; }
.amenity-card--purple  { background: linear-gradient(135deg, rgba(168,85,247,0.15), rgba(124,58,237,0.08)); }
.amenity-card--purple  .amenity-card__icon { background: rgba(168,85,247,0.20); color: #D8B4FE; }

/* ─────────────────────────────────────────────────────────────
   12. GALLERY
───────────────────────────────────────────────────────────── */
.gallery-section { padding: var(--section-pad) 0; }
.gallery-masonry { display: grid; grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(3, 180px); gap: 14px; }
.gallery-item { border-radius: var(--r-lg); overflow: hidden; position: relative; cursor: pointer; }
.gallery-item--1 { grid-column: span 1; grid-row: span 2; background: linear-gradient(160deg, #1a1040, #2d1b6b, #0f4a6e); }
.gallery-item--2 { grid-column: span 1; background: linear-gradient(160deg, #0f2027, #203a43, #2c5364); }
.gallery-item--3 { grid-column: span 1; background: linear-gradient(160deg, #1a0a2e, #2d1b5a, #1a3a5e); }
.gallery-item--4 { grid-column: span 2; background: linear-gradient(160deg, #0a1a2e, #153450, #1e5040); }
.gallery-item--5 { grid-column: span 1; background: linear-gradient(160deg, #12001f, #2b0d5e, #1a3a6e); }
.gallery-item--6 { grid-column: span 1; grid-row: span 2; background: linear-gradient(160deg, #001229, #003060, #0a1a40); }
.gallery-item--7 { grid-column: span 2; background: linear-gradient(160deg, #0f1a0f, #1a3520, #1a4a3a); }
.gallery-item--tall { grid-row: span 2; }
.gallery-item--wide { grid-column: span 2; }
.gallery-item__overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,0.75) 0%, transparent 60%); opacity: 0; transition: opacity var(--t-base) var(--ease-smooth); display: flex; align-items: flex-end; justify-content: space-between; padding: 16px; }
.gallery-item:hover .gallery-item__overlay { opacity: 1; }
.gallery-item:hover { transform: scale(0.99); }
.gallery-item__label { font-size: 0.8rem; font-weight: 600; color: rgba(255,255,255,0.9); }
.gallery-item__overlay i { width: 18px; height: 18px; color: rgba(255,255,255,0.7); }

/* ─────────────────────────────────────────────────────────────
   13. STATS
───────────────────────────────────────────────────────────── */
.stats-section { padding: var(--section-pad) 0; position: relative; overflow: hidden; }
.stats-section__bg { position: absolute; inset: 0; pointer-events: none; }
.stats-glow { position: absolute; width: 400px; height: 400px; border-radius: 50%; filter: blur(80px); }
.stats-glow--l { background: radial-gradient(circle, rgba(124,58,237,0.20), transparent 70%); left: -100px; top: 50%; transform: translateY(-50%); }
.stats-glow--r { background: radial-gradient(circle, rgba(34,211,238,0.15), transparent 70%); right: -100px; top: 50%; transform: translateY(-50%); }
.stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2px; background: var(--color-border); border-radius: var(--r-xl); overflow: hidden; border: 1px solid var(--color-border); position: relative; z-index: 1; }
.stat-block { background: var(--color-surface); padding: 52px 36px; display: flex; flex-direction: column; align-items: center; text-align: center; position: relative; transition: background var(--t-base); }
.stat-block:hover { background: var(--color-surface-2); }
.stat-block__accent-line { position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 60px; height: 2px; background: var(--grad-violet-cyan); border-radius: 0 0 4px 4px; }
.stat-block__num { font-family: 'Plus Jakarta Sans', sans-serif; font-size: clamp(2.8rem,4.5vw,4.5rem); font-weight: 800; line-height: 1; background: var(--grad-text); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; display: inline-block; }
.stat-block__suffix { font-family: 'Plus Jakarta Sans', sans-serif; font-size: clamp(1.4rem,2vw,2rem); font-weight: 700; display: inline-block; margin-left: 4px; vertical-align: super; background: var(--grad-violet-cyan); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.stat-block__label { font-size: 0.85rem; color: var(--text-muted); font-weight: 500; letter-spacing: 0.03em; margin-top: 10px; }

/* ─────────────────────────────────────────────────────────────
   14. TESTIMONIALS
───────────────────────────────────────────────────────────── */
.testimonials-section { padding: var(--section-pad) 0; }
.testimonials-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.testi-card { position: relative; padding: 28px; border-radius: var(--r-xl); background: var(--color-surface); border: 1px solid var(--color-border); overflow: hidden; transition: transform var(--t-base) var(--ease-smooth), box-shadow var(--t-base) var(--ease-smooth); }
.testi-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-md); }
.testi-card--featured { background: linear-gradient(135deg, rgba(124,58,237,0.12), rgba(34,211,238,0.06)); border-color: rgba(124,58,237,0.25); }
.testi-card__glow { position: absolute; top: -60px; right: -60px; width: 200px; height: 200px; background: radial-gradient(circle, rgba(124,58,237,0.20), transparent 70%); pointer-events: none; }
.testi-card--featured .testi-card__glow { background: radial-gradient(circle, rgba(34,211,238,0.15), transparent 70%); }
.testi-card__top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; }
.testi-quote-icon { width: 36px; height: 36px; border-radius: 10px; background: rgba(124,58,237,0.15); border: 1px solid rgba(124,58,237,0.25); display: grid; place-items: center; color: var(--violet-light); }
.testi-quote-icon i { width: 16px; height: 16px; }
.testi-stars { display: flex; gap: 3px; }
.testi-stars i { width: 14px; height: 14px; color: var(--amber); fill: var(--amber); }
.testi-card__text { font-size: 0.92rem; color: var(--text-secondary); line-height: 1.75; margin-bottom: 24px; font-style: italic; }
.testi-card__author { display: flex; align-items: center; gap: 12px; }
.testi-avatar { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; font-family: 'Plus Jakarta Sans', sans-serif; font-size: 0.85rem; font-weight: 800; flex-shrink: 0; }
.testi-avatar--a { background: linear-gradient(135deg, var(--violet), var(--cyan)); }
.testi-avatar--b { background: linear-gradient(135deg, var(--cyan), var(--emerald)); }
.testi-avatar--c { background: linear-gradient(135deg, var(--rose), var(--violet)); }
.testi-name { display: block; font-family: 'Plus Jakarta Sans', sans-serif; font-size: 0.92rem; font-weight: 700; }
.testi-role { display: block; font-size: 0.72rem; color: var(--text-muted); }

/* ─────────────────────────────────────────────────────────────
   15. CONTACT / FORMS
───────────────────────────────────────────────────────────── */
.contact-section { padding: var(--section-pad) 0 calc(var(--section-pad) * 1.2); position: relative; overflow: hidden; }
.contact-section__bg { position: absolute; inset: 0; pointer-events: none; }
.contact-blob { position: absolute; border-radius: 50%; filter: blur(100px); }
.contact-blob--1 { width: 600px; height: 600px; background: radial-gradient(circle, rgba(124,58,237,0.18), transparent 70%); left: -200px; top: 0; }
.contact-blob--2 { width: 500px; height: 500px; background: radial-gradient(circle, rgba(34,211,238,0.12), transparent 70%); right: -100px; bottom: 0; }
.contact-wrapper { display: grid; grid-template-columns: 1fr 1.2fr; gap: clamp(48px,6vw,80px); align-items: start; position: relative; z-index: 1; }
.contact-info__sub { font-size: 1rem; color: var(--text-secondary); line-height: 1.75; margin-bottom: 36px; max-width: 440px; }
.contact-channels { display: flex; flex-direction: column; gap: 14px; }
.contact-channel { display: flex; align-items: center; gap: 16px; padding: 16px 18px; border-radius: var(--r-lg); background: var(--glass-bg); border: 1px solid var(--glass-border); transition: all var(--t-fast); }
.contact-channel:hover { background: rgba(255,255,255,0.06); border-color: var(--color-border-hover); transform: translateX(4px); }
.contact-channel--whatsapp:hover { border-color: rgba(37,211,102,0.35); }
.channel-icon { width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; flex-shrink: 0; }
.channel-icon i { width: 18px; height: 18px; }
.channel-icon--violet { background: rgba(124,58,237,0.20); color: var(--violet-light); }
.channel-icon--cyan   { background: rgba(34,211,238,0.20); color: var(--cyan-light); }
.channel-icon--green  { background: rgba(37,211,102,0.20); color: #4ADE80; }
.channel-label { display: block; font-size: 0.7rem; color: var(--text-muted); font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; }
.channel-val   { display: block; font-family: 'Plus Jakarta Sans', sans-serif; font-size: 0.92rem; font-weight: 700; }
.contact-form-card { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--r-xl); padding: 36px 32px; box-shadow: var(--shadow-lg); }
.form-card__title { font-size: clamp(1.2rem, 2vw, 1.5rem); font-weight: 800; margin-bottom: 6px; }
.form-card__sub   { font-size: 0.85rem; color: var(--text-secondary); margin-bottom: 28px; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 20px; }
.form-group { display: flex; flex-direction: column; gap: 7px; }
.form-group--full { grid-column: span 2; }
.form-label { font-size: 0.78rem; font-weight: 600; color: var(--text-secondary); letter-spacing: 0.03em; }
.form-input-wrap { position: relative; display: flex; align-items: center; }
.form-input__icon { position: absolute; left: 14px; width: 15px; height: 15px; color: var(--text-muted); pointer-events: none; }
.form-input { width: 100%; padding: 12px 14px 12px 40px; background: var(--color-surface-2); border: 1px solid var(--color-border); border-radius: var(--r-md); color: var(--text-primary); font-family: 'Inter', sans-serif; font-size: 0.88rem; transition: border-color var(--t-fast), background var(--t-fast); outline: none; }
.form-input::placeholder { color: var(--text-muted); }
.form-input:focus { border-color: rgba(124,58,237,0.50); background: rgba(124,58,237,0.05); box-shadow: 0 0 0 3px rgba(124,58,237,0.12); }
.form-input.is-error { border-color: rgba(251,113,133,0.55); background: rgba(251,113,133,0.04); }
.form-input.is-error:focus { box-shadow: 0 0 0 3px rgba(251,113,133,0.15); }
.form-select { cursor: pointer; }
.form-textarea { padding: 12px 14px 12px 40px; min-height: 110px; resize: vertical; line-height: 1.6; align-self: flex-start; }
.form-note { display: flex; align-items: center; gap: 6px; font-size: 0.72rem; color: var(--text-muted); margin-top: 14px; justify-content: center; }
.form-note i { width: 12px; height: 12px; }

/* PHP form states */
.form-alert { display: flex; align-items: flex-start; gap: 12px; padding: 14px 18px; border-radius: var(--r-md); font-size: 0.85rem; line-height: 1.6; margin-bottom: 20px; }
.form-alert--success { background: rgba(16,185,129,0.12); border: 1px solid rgba(16,185,129,0.30); color: #6EE7B7; }
.form-alert--error   { background: rgba(251,113,133,0.10); border: 1px solid rgba(251,113,133,0.30); color: #FCA5A5; }
.form-alert i { width: 18px; height: 18px; flex-shrink: 0; margin-top: 1px; }
.field-error { display: block; font-size: 0.72rem; color: #FCA5A5; margin-top: 5px; font-weight: 500; }

/* ─────────────────────────────────────────────────────────────
   16. FOOTER
───────────────────────────────────────────────────────────── */
.footer { border-top: 1px solid var(--color-border); background: var(--color-deep); }
.footer__top { padding: 80px 0 60px; }
.footer__top-inner { display: grid; grid-template-columns: 2fr 1fr 1fr 1.4fr; gap: 48px; }
.footer-logo { margin-bottom: 12px; display: flex; }
.footer-brand__tagline { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 0.85rem; color: var(--violet-light); font-weight: 600; margin-bottom: 10px; font-style: italic; }
.footer-brand__desc { font-size: 0.84rem; color: var(--text-muted); line-height: 1.7; max-width: 320px; margin-bottom: 24px; }
.footer-social { display: flex; gap: 10px; }
.social-btn { width: 38px; height: 38px; border-radius: 10px; background: var(--glass-bg); border: 1px solid var(--glass-border); display: grid; place-items: center; color: var(--text-muted); transition: all var(--t-fast); }
.social-btn i { width: 16px; height: 16px; }
.social-btn:hover { background: rgba(124,58,237,0.20); border-color: rgba(124,58,237,0.35); color: var(--violet-light); transform: translateY(-2px); }
.footer-links__title { font-size: 0.78rem; font-weight: 700; color: var(--text-secondary); letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 18px; }
.footer-links ul { display: flex; flex-direction: column; gap: 12px; }
.footer-links li a { font-size: 0.85rem; color: var(--text-muted); transition: color var(--t-fast); }
.footer-links li a:hover { color: var(--text-primary); }
.footer-contact-list { display: flex; flex-direction: column; gap: 16px; }
.footer-contact-list li { display: flex; align-items: flex-start; gap: 10px; font-size: 0.82rem; color: var(--text-muted); line-height: 1.6; }
.footer-contact-list i { width: 14px; height: 14px; flex-shrink: 0; margin-top: 3px; color: var(--violet-light); }
.footer__bottom { border-top: 1px solid var(--color-border); padding: 22px 0; }
.footer__bottom-inner { display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; }
.footer__bottom p { font-size: 0.78rem; color: var(--text-muted); }
.footer-legal { display: flex; gap: 20px; }
.footer-legal a { font-size: 0.78rem; color: var(--text-muted); transition: color var(--t-fast); }
.footer-legal a:hover { color: var(--text-primary); }

/* ─────────────────────────────────────────────────────────────
   17-27. PROPERTY PAGE EXTENSIONS
───────────────────────────────────────────────────────────── */
/* Breadcrumb */
.prop-breadcrumb { position: sticky; top: 64px; z-index: 90; background: rgba(11,15,26,0.80); backdrop-filter: blur(20px); border-bottom: 1px solid var(--color-border); padding: 10px 0; }
.prop-breadcrumb__inner { display: flex; align-items: center; gap: 8px; }
.crumb { display: flex; align-items: center; gap: 5px; font-size: 0.78rem; font-weight: 500; color: var(--text-muted); transition: color var(--t-fast); }
.crumb i { width: 12px; height: 12px; }
.crumb:hover { color: var(--text-primary); }
.crumb--active { color: var(--violet-light); font-weight: 600; }
.crumb-sep { width: 12px; height: 12px; color: var(--text-muted); flex-shrink: 0; }

/* Property Hero */
.prop-hero { position: relative; padding: 108px 0 60px; min-height: 100svh; display: flex; align-items: center; overflow: hidden; }
.prop-hero__inner { display: grid; grid-template-columns: 1fr 1.05fr; gap: clamp(40px,5vw,72px); align-items: center; position: relative; z-index: 2; }
.prop-hero__badges { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 24px; animation: fadeSlideUp 0.8s var(--ease-smooth) 0.1s both; }
.prop-status-badge { display: inline-flex; align-items: center; gap: 7px; padding: 7px 14px; border-radius: var(--r-full); background: rgba(16,185,129,0.12); border: 1px solid rgba(16,185,129,0.30); color: #6EE7B7; font-size: 0.75rem; font-weight: 700; letter-spacing: 0.04em; }
.prop-status__dot { width: 6px; height: 6px; border-radius: 50%; background: var(--emerald); box-shadow: 0 0 8px rgba(16,185,129,0.8); animation: dotPulse 2s ease-in-out infinite; }
.prop-hero__name { font-size: clamp(3rem,6vw,6rem); font-weight: 800; line-height: 0.92; letter-spacing: -0.04em; margin-bottom: 20px; animation: fadeSlideUp 0.9s var(--ease-smooth) 0.25s both; }
.prop-hero__tagline { font-size: clamp(0.95rem,1.3vw,1.1rem); color: var(--text-secondary); line-height: 1.75; margin-bottom: 22px; max-width: 520px; animation: fadeSlideUp 0.9s var(--ease-smooth) 0.4s both; }
.prop-hero__location { display: inline-flex; align-items: center; gap: 7px; padding: 8px 16px; border-radius: var(--r-full); background: var(--glass-bg); border: 1px solid var(--glass-border); font-size: 0.82rem; color: var(--text-secondary); margin-bottom: 24px; animation: fadeSlideUp 0.9s var(--ease-smooth) 0.5s both; }
.prop-hero__location i { width: 13px; height: 13px; color: var(--rose); }
.prop-hero__price-row { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; margin-bottom: 28px; animation: fadeSlideUp 0.9s var(--ease-smooth) 0.55s both; }
.prop-hero__price-block { display: flex; flex-direction: column; }
.prop-hero__price { font-family: 'Plus Jakarta Sans', sans-serif; font-size: clamp(1.6rem,3vw,2.4rem); font-weight: 800; background: var(--grad-cyan-emerald); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; line-height: 1.1; }
.prop-rera-chip { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: var(--r-full); background: rgba(16,185,129,0.10); border: 1px solid rgba(16,185,129,0.25); font-size: 0.72rem; font-weight: 600; color: #6EE7B7; letter-spacing: 0.03em; }
.prop-rera-chip i { width: 13px; height: 13px; }
.prop-hero__ctas { display: flex; gap: 14px; flex-wrap: wrap; margin-bottom: 28px; animation: fadeSlideUp 0.9s var(--ease-smooth) 0.65s both; }
.prop-hero__trust { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; animation: fadeSlideUp 0.9s var(--ease-smooth) 0.75s both; }
.trust-item { display: flex; align-items: center; gap: 6px; font-size: 0.78rem; color: var(--text-muted); font-weight: 500; }
.trust-item i { width: 13px; height: 13px; color: var(--violet-light); }
.prop-hero__gallery { position: relative; z-index: 2; animation: fadeSlideLeft 1s var(--ease-smooth) 0.4s both; }
.prop-slider { position: relative; border-radius: var(--r-xl); overflow: hidden; height: 460px; box-shadow: var(--shadow-lg), 0 0 60px rgba(124,58,237,0.18); border: 1px solid var(--glass-border); }
.prop-slide { position: absolute; inset: 0; opacity: 0; transition: opacity var(--t-slow) var(--ease-smooth), transform var(--t-slow) var(--ease-smooth); transform: scale(1.03); display: flex; align-items: flex-end; padding: 20px; }
.prop-slide--active { opacity: 1; transform: scale(1); }
.prop-slide--1 { background: linear-gradient(160deg, #0d1529 0%, #1e2d5a 40%, #2a3f7a 100%); }
.prop-slide--2 { background: linear-gradient(160deg, #0f1e2a 0%, #1a3346 50%, #1e4560 100%); }
.prop-slide--3 { background: linear-gradient(160deg, #1a1040 0%, #2d1b6b 40%, #1a3a5e 100%); }
.prop-slide--4 { background: linear-gradient(160deg, #0a1829 0%, #133a5a 50%, #1e5040 100%); }
.prop-slide__overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,0.65) 0%, transparent 55%); }
.prop-slide__label { position: relative; z-index: 2; display: flex; align-items: center; gap: 7px; padding: 8px 14px; border-radius: var(--r-full); background: rgba(0,0,0,0.45); backdrop-filter: blur(12px); border: 1px solid rgba(255,255,255,0.12); font-size: 0.78rem; font-weight: 600; color: rgba(255,255,255,0.9); }
.prop-slide__label i { width: 13px; height: 13px; }
.prop-slider__btn { position: absolute; top: 50%; transform: translateY(-50%); width: 40px; height: 40px; border-radius: 50%; background: rgba(0,0,0,0.50); backdrop-filter: blur(12px); border: 1px solid rgba(255,255,255,0.12); color: white; display: grid; place-items: center; cursor: pointer; z-index: 10; transition: all var(--t-fast); }
.prop-slider__btn:hover { background: rgba(124,58,237,0.50); border-color: rgba(124,58,237,0.50); }
.prop-slider__btn i { width: 18px; height: 18px; }
.prop-slider__btn--prev { left: 14px; }
.prop-slider__btn--next { right: 14px; }
.prop-slider__dots { position: absolute; bottom: 16px; left: 50%; transform: translateX(-50%); display: flex; gap: 6px; z-index: 10; }
.slider-dot { width: 7px; height: 7px; border-radius: 50%; background: rgba(255,255,255,0.30); border: none; cursor: pointer; transition: all var(--t-fast); padding: 0; }
.slider-dot--active { background: white; width: 20px; border-radius: 4px; }
.prop-slider__expand { position: absolute; top: 14px; right: 14px; width: 36px; height: 36px; border-radius: var(--r-sm); background: rgba(0,0,0,0.45); backdrop-filter: blur(12px); border: 1px solid rgba(255,255,255,0.10); color: white; display: grid; place-items: center; cursor: pointer; z-index: 10; transition: all var(--t-fast); }
.prop-slider__expand:hover { background: rgba(124,58,237,0.50); }
.prop-slider__expand i { width: 15px; height: 15px; }
.prop-thumbs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-top: 10px; }
.prop-thumb { height: 70px; border-radius: var(--r-md); border: 2px solid transparent; cursor: pointer; transition: all var(--t-fast); overflow: hidden; }
.prop-thumb--1 { background: linear-gradient(135deg, #0d1529, #2a3f7a); }
.prop-thumb--2 { background: linear-gradient(135deg, #0f1e2a, #1e4560); }
.prop-thumb--3 { background: linear-gradient(135deg, #1a1040, #1a3a5e); }
.prop-thumb--4 { background: linear-gradient(135deg, #0a1829, #1e5040); }
.prop-thumb--active { border-color: var(--violet-light); box-shadow: 0 0 0 1px var(--violet); }
.prop-thumb:hover { opacity: 0.85; }

/* Quick info bar */
.prop-infobar { background: var(--color-surface); border-top: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); overflow: hidden; }
.prop-infobar__track { display: flex; align-items: center; overflow-x: auto; scrollbar-width: none; padding: 0 4px; }
.prop-infobar__track::-webkit-scrollbar { display: none; }
.prop-info-chip { display: flex; align-items: center; gap: 12px; padding: 18px 24px; flex-shrink: 0; transition: background var(--t-fast); }
.prop-info-chip:hover { background: rgba(255,255,255,0.03); }
.prop-info-chip__icon { width: 36px; height: 36px; border-radius: 10px; background: rgba(124,58,237,0.15); border: 1px solid rgba(124,58,237,0.20); display: grid; place-items: center; color: var(--violet-light); flex-shrink: 0; }
.prop-info-chip__icon i { width: 15px; height: 15px; }
.prop-info-chip__icon--cyan    { background: rgba(34,211,238,0.15); border-color: rgba(34,211,238,0.20); color: var(--cyan-light); }
.prop-info-chip__icon--rose    { background: rgba(251,113,133,0.15); border-color: rgba(251,113,133,0.20); color: #FCA5A5; }
.prop-info-chip__icon--emerald { background: rgba(16,185,129,0.15); border-color: rgba(16,185,129,0.20); color: #6EE7B7; }
.prop-info-chip__icon--amber   { background: rgba(245,158,11,0.15); border-color: rgba(245,158,11,0.20); color: #FCD34D; }
.prop-info-chip__icon--purple  { background: rgba(168,85,247,0.15); border-color: rgba(168,85,247,0.20); color: #D8B4FE; }
.prop-info-chip__label { font-size: 0.67rem; color: var(--text-muted); font-weight: 600; letter-spacing: 0.05em; text-transform: uppercase; white-space: nowrap; }
.prop-info-chip__val   { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 0.95rem; font-weight: 700; white-space: nowrap; }
.prop-info-chip__body  { display: flex; flex-direction: column; }
.prop-info-divider { width: 1px; height: 40px; background: var(--color-border); flex-shrink: 0; }

/* Property gallery bento */
.prop-gallery-section { padding: var(--section-pad) 0; }
.prop-gallery-bento { display: grid; grid-template-columns: repeat(4, 1fr); grid-template-rows: 300px 200px; gap: 12px; }
.prop-gal-hero   { grid-column: span 2; grid-row: span 2; background: linear-gradient(160deg, #0d1529 0%, #1e2d5a 40%, #2a3f7a 100%); }
.prop-gal-stack-a { grid-column: span 1; background: linear-gradient(160deg, #0f1e2a, #1a3346, #1e4560); }
.prop-gal-stack-b { grid-column: span 1; background: linear-gradient(160deg, #1a1040, #2d1b6b, #1a3a5e); }
.prop-gal-b1 { background: linear-gradient(160deg, #0a1829, #133a5a, #1e5040); }
.prop-gal-b2 { background: linear-gradient(160deg, #12001f, #2b0d5e, #1a3a6e); }
.prop-gal-b3 { background: linear-gradient(160deg, #1a0a2e, #2d1b5a, #1a3a5e); }
.prop-gal-more { background: rgba(124,58,237,0.10); border: 1px dashed rgba(124,58,237,0.30); border-radius: var(--r-lg); display: flex; align-items: center; justify-content: center; cursor: pointer; transition: all var(--t-base) var(--ease-smooth); }
.prop-gal-more:hover { background: rgba(124,58,237,0.18); border-color: rgba(124,58,237,0.50); transform: scale(0.98); }
.prop-gal-more__inner { display: flex; flex-direction: column; align-items: center; gap: 6px; color: var(--violet-light); }
.prop-gal-more__inner i { width: 28px; height: 28px; }
.prop-gal-more__inner span { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 1.4rem; font-weight: 800; }
.prop-gal-more__inner p { font-size: 0.72rem; color: var(--text-muted); }

/* Apartment cards */
.apt-config-section { padding: var(--section-pad) 0; background: linear-gradient(180deg, transparent, rgba(124,58,237,0.04), transparent); }
.apt-config-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 20px; }
.apartment-card { position: relative; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--r-xl); padding: 28px; overflow: hidden; transition: transform var(--t-base) var(--ease-smooth), box-shadow var(--t-base) var(--ease-smooth), border-color var(--t-base); display: flex; flex-direction: column; }
.apartment-card:hover { transform: translateY(-6px); border-color: var(--color-border-hover); }
.apartment-card--featured { border-color: rgba(34,211,238,0.25); }
.apartment-card__glow { position: absolute; inset: 0; opacity: 0; transition: opacity var(--t-slow); pointer-events: none; border-radius: inherit; }
.apartment-card:hover .apartment-card__glow { opacity: 1; }
.apartment-card--violet .apartment-card__glow { background: radial-gradient(circle at 30% 0%, rgba(124,58,237,0.15), transparent 65%); }
.apartment-card--violet:hover { box-shadow: 0 20px 60px rgba(124,58,237,0.18); border-color: rgba(124,58,237,0.30); }
.apartment-card--cyan .apartment-card__glow { background: radial-gradient(circle at 50% 0%, rgba(34,211,238,0.15), transparent 65%); }
.apartment-card--cyan:hover { box-shadow: 0 20px 60px rgba(34,211,238,0.18); border-color: rgba(34,211,238,0.30); }
.apartment-card--rose .apartment-card__glow { background: radial-gradient(circle at 30% 0%, rgba(251,113,133,0.15), transparent 65%); }
.apartment-card--rose:hover { box-shadow: 0 20px 60px rgba(251,113,133,0.18); border-color: rgba(251,113,133,0.30); }
.apartment-card--emerald .apartment-card__glow { background: radial-gradient(circle at 30% 0%, rgba(16,185,129,0.15), transparent 65%); }
.apartment-card--emerald:hover { box-shadow: 0 20px 60px rgba(16,185,129,0.18); border-color: rgba(16,185,129,0.30); }
.apartment-card__popular-tag { position: absolute; top: 0; right: 24px; padding: 5px 14px; background: var(--grad-violet-cyan); border-radius: 0 0 var(--r-sm) var(--r-sm); font-size: 0.68rem; font-weight: 700; display: flex; align-items: center; gap: 5px; color: white; }
.apartment-card__popular-tag i { width: 11px; height: 11px; }
.apartment-card__header { display: flex; align-items: baseline; gap: 10px; margin-bottom: 20px; }
.apartment-card__type-badge { display: inline-flex; align-items: center; padding: 5px 14px; border-radius: var(--r-full); font-family: 'Plus Jakarta Sans', sans-serif; font-size: 0.8rem; font-weight: 800; background: rgba(124,58,237,0.20); border: 1px solid rgba(124,58,237,0.35); color: var(--violet-light); letter-spacing: 0.04em; }
.apartment-card__type-badge--cyan    { background: rgba(34,211,238,0.15); border-color: rgba(34,211,238,0.30); color: var(--cyan-light); }
.apartment-card__type-badge--rose    { background: rgba(251,113,133,0.15); border-color: rgba(251,113,133,0.30); color: #FCA5A5; }
.apartment-card__type-badge--emerald { background: rgba(16,185,129,0.15); border-color: rgba(16,185,129,0.30); color: #6EE7B7; }
.apartment-card__subtype { font-size: 0.82rem; color: var(--text-muted); font-weight: 500; }
.apartment-card__specs { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; flex: 1; margin-bottom: 22px; }
.apt-spec { display: flex; align-items: flex-start; gap: 9px; padding: 10px 11px; border-radius: var(--r-sm); background: rgba(255,255,255,0.03); border: 1px solid var(--color-border); transition: background var(--t-fast); }
.apt-spec:hover { background: rgba(255,255,255,0.05); }
.apt-spec i { width: 14px; height: 14px; color: var(--violet-light); flex-shrink: 0; margin-top: 2px; }
.apartment-card--cyan    .apt-spec i { color: var(--cyan-light); }
.apartment-card--rose    .apt-spec i { color: #FCA5A5; }
.apartment-card--emerald .apt-spec i { color: #6EE7B7; }
.apt-spec__label { display: block; font-size: 0.62rem; color: var(--text-muted); font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; margin-bottom: 3px; }
.apt-spec__val   { display: block; font-family: 'Plus Jakarta Sans', sans-serif; font-size: 0.82rem; font-weight: 700; }
.apartment-card__footer { padding-top: 18px; border-top: 1px solid var(--color-border); }
.apartment-card__price  { display: flex; flex-direction: column; margin-bottom: 14px; }
.apt-price-val { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 1.2rem; font-weight: 800; background: var(--grad-violet-cyan); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.apartment-card--cyan    .apt-price-val { background: var(--grad-cyan-emerald); -webkit-background-clip: text; background-clip: text; }
.apartment-card--rose    .apt-price-val { background: var(--grad-rose-violet); -webkit-background-clip: text; background-clip: text; }
.apartment-card__actions { display: flex; gap: 8px; }

/* Floor plans */
.floor-plan-section { padding: var(--section-pad) 0; border-top: 1px solid var(--color-border); }
.floor-plan-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 20px; }
.floor-plan-card { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--r-xl); overflow: hidden; transition: transform var(--t-base) var(--ease-smooth), box-shadow var(--t-base) var(--ease-smooth); }
.floor-plan-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-md), 0 0 30px rgba(124,58,237,0.10); border-color: rgba(124,58,237,0.20); }
.floor-plan-card__visual { position: relative; height: 220px; background: var(--color-surface-2); overflow: hidden; border-bottom: 1px solid var(--color-border); }
.floor-plan-card__blueprint { position: absolute; inset: 12px; border: 1.5px solid rgba(124,58,237,0.30); border-radius: var(--r-sm); display: grid; gap: 2px; padding: 2px; background: rgba(124,58,237,0.04); }
.floor-plan-card__blueprint--a { grid-template-columns: 1.2fr 1fr; grid-template-rows: 1.4fr 1fr 0.6fr; }
.floor-plan-card__blueprint--b { grid-template-columns: 1fr 1fr 0.6fr; grid-template-rows: 1.3fr 1fr 0.6fr; }
.floor-plan-card__blueprint--c { grid-template-columns: 1fr 1fr 1fr; grid-template-rows: 1.4fr 1fr; }
.floor-plan-card__blueprint--d { grid-template-columns: 1fr 1fr 0.8fr; grid-template-rows: 1.3fr 1fr 0.5fr; }
.blueprint-room { border: 1px solid rgba(124,58,237,0.25); border-radius: 3px; background: rgba(124,58,237,0.05); display: flex; align-items: center; justify-content: center; font-size: 0.55rem; font-weight: 600; color: rgba(124,58,237,0.70); letter-spacing: 0.04em; text-transform: uppercase; transition: background var(--t-fast); }
.blueprint-room:hover { background: rgba(124,58,237,0.12); }
.blueprint-room--living  { grid-column: span 2; background: rgba(124,58,237,0.08); color: rgba(124,58,237,0.85); font-size: 0.62rem; }
.blueprint-room--bed1    { background: rgba(34,211,238,0.06);  border-color: rgba(34,211,238,0.22);  color: rgba(34,211,238,0.70); }
.blueprint-room--bed2    { background: rgba(34,211,238,0.04);  border-color: rgba(34,211,238,0.18);  color: rgba(34,211,238,0.60); }
.blueprint-room--bed3    { background: rgba(34,211,238,0.04);  border-color: rgba(34,211,238,0.18);  color: rgba(34,211,238,0.60); }
.blueprint-room--kitchen { background: rgba(245,158,11,0.06);  border-color: rgba(245,158,11,0.22);  color: rgba(245,158,11,0.70); }
.blueprint-room--balcony { background: rgba(16,185,129,0.06);  border-color: rgba(16,185,129,0.22);  color: rgba(16,185,129,0.70); }
.blueprint-room--study   { background: rgba(168,85,247,0.06);  border-color: rgba(168,85,247,0.22);  color: rgba(168,85,247,0.70); }
.blueprint-room--dining  { background: rgba(251,113,133,0.06); border-color: rgba(251,113,133,0.22); color: rgba(251,113,133,0.70); }
.blueprint-room--puja    { background: rgba(245,158,11,0.08);  border-color: rgba(245,158,11,0.25);  color: rgba(245,158,11,0.80); }
.floor-plan-card__expand-btn { position: absolute; top: 12px; right: 12px; width: 32px; height: 32px; border-radius: var(--r-sm); background: rgba(0,0,0,0.50); backdrop-filter: blur(10px); border: 1px solid rgba(255,255,255,0.10); display: grid; place-items: center; cursor: pointer; opacity: 0; transition: opacity var(--t-fast), background var(--t-fast); color: white; }
.floor-plan-card__expand-btn i { width: 14px; height: 14px; }
.floor-plan-card__visual:hover .floor-plan-card__expand-btn { opacity: 1; }
.floor-plan-card__expand-btn:hover { background: rgba(124,58,237,0.50); }
.floor-plan-card__body { padding: 18px 20px; display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.floor-plan-card__tag  { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.floor-plan-card__sub  { font-size: 0.78rem; color: var(--text-muted); }
.floor-plan-card__actions { display: flex; gap: 8px; }

/* Floor plan modal */
.fp-modal { position: fixed; inset: 0; z-index: 500; display: flex; align-items: center; justify-content: center; pointer-events: none; opacity: 0; transition: opacity var(--t-base) var(--ease-smooth); }
.fp-modal.open { opacity: 1; pointer-events: all; }
.fp-modal__backdrop { position: absolute; inset: 0; background: rgba(7,10,20,0.85); backdrop-filter: blur(12px); cursor: pointer; }
.fp-modal__card { position: relative; z-index: 2; background: var(--color-surface); border: 1px solid var(--glass-border); border-radius: var(--r-xl); padding: 32px; width: min(700px, calc(100% - 48px)); max-height: 85vh; overflow-y: auto; box-shadow: var(--shadow-lg); transform: scale(0.95) translateY(20px); transition: transform var(--t-base) var(--ease-spring); }
.fp-modal.open .fp-modal__card { transform: scale(1) translateY(0); }
.fp-modal__close { position: absolute; top: 16px; right: 16px; width: 36px; height: 36px; border-radius: var(--r-sm); background: var(--glass-bg); border: 1px solid var(--glass-border); display: grid; place-items: center; cursor: pointer; color: var(--text-secondary); transition: all var(--t-fast); }
.fp-modal__close:hover { background: rgba(251,113,133,0.15); color: var(--rose); }
.fp-modal__close i { width: 16px; height: 16px; }
.fp-modal__title-row { display: flex; align-items: center; justify-content: space-between; margin-bottom: 24px; padding-right: 44px; }
.fp-modal__title { font-size: 1.4rem; font-weight: 800; }
.fp-modal__blueprint-lg { min-height: 380px; border: 1.5px solid rgba(124,58,237,0.30); border-radius: var(--r-lg); background: rgba(124,58,237,0.04); display: grid; gap: 3px; padding: 3px; }

/* Location */
.location-section { padding: var(--section-pad) 0; background: linear-gradient(180deg, transparent, rgba(34,211,238,0.03), transparent); }
.location-wrapper { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(36px,5vw,64px); align-items: start; }
.location-map-wrap { position: sticky; top: 120px; }
.location-map { border-radius: var(--r-xl); overflow: hidden; border: 1px solid var(--glass-border); background: var(--color-surface-2); box-shadow: var(--shadow-md); position: relative; }
.location-map__inner { height: 420px; position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; overflow: hidden; }
.map-grid-lines { position: absolute; inset: 0; background-image: linear-gradient(rgba(124,58,237,0.08) 1px, transparent 1px), linear-gradient(90deg, rgba(124,58,237,0.08) 1px, transparent 1px); background-size: 40px 40px; }
.map-pin-pulse { position: relative; width: 60px; height: 60px; display: flex; align-items: center; justify-content: center; margin-bottom: 14px; z-index: 2; }
.map-pin-pulse__ring { position: absolute; border-radius: 50%; border: 1.5px solid var(--violet); animation: pinRipple 2.5s ease-out infinite; }
.map-pin-pulse__ring--1 { width: 60px; height: 60px; animation-delay: 0s; }
.map-pin-pulse__ring--2 { width: 90px; height: 90px; animation-delay: 0.5s; }
.map-pin-pulse__ring--3 { width: 120px; height: 120px; animation-delay: 1s; }
.map-pin-pulse__center { width: 44px; height: 44px; border-radius: 50%; background: var(--grad-violet-cyan); display: grid; place-items: center; box-shadow: 0 0 24px var(--violet-glow); z-index: 3; }
.map-pin-pulse__center i { width: 20px; height: 20px; color: white; }
.map-label    { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 0.95rem; font-weight: 700; z-index: 2; }
.map-sublabel { font-size: 0.75rem; color: var(--text-muted); z-index: 2; margin-top: 4px; }
.location-map__cta { position: absolute; bottom: 16px; right: 16px; z-index: 10; }
.location-advantages { display: flex; flex-direction: column; gap: 20px; }
.loc-category__head { display: flex; align-items: center; gap: 8px; font-family: 'Plus Jakarta Sans', sans-serif; font-size: 0.78rem; font-weight: 700; color: var(--text-muted); letter-spacing: 0.06em; text-transform: uppercase; margin-bottom: 10px; padding-bottom: 8px; border-bottom: 1px solid var(--color-border); }
.loc-category__head i { width: 14px; height: 14px; color: var(--violet-light); }
.loc-cards { display: flex; flex-direction: column; gap: 8px; }
.loc-card { display: flex; align-items: center; justify-content: space-between; padding: 11px 16px; border-radius: var(--r-md); background: var(--glass-bg); border: 1px solid var(--glass-border); transition: all var(--t-fast); }
.loc-card:hover { background: rgba(124,58,237,0.08); border-color: rgba(124,58,237,0.20); transform: translateX(3px); }
.loc-card__name { font-size: 0.85rem; font-weight: 600; }
.loc-card__dist { font-size: 0.72rem; color: var(--cyan-light); font-weight: 600; white-space: nowrap; }

/* Timeline */
.timeline-section { padding: var(--section-pad) 0; border-top: 1px solid var(--color-border); }
.construction-overview { display: flex; align-items: center; gap: 28px; padding: 28px 32px; background: linear-gradient(135deg, rgba(124,58,237,0.12), rgba(34,211,238,0.07)); border: 1px solid rgba(124,58,237,0.20); border-radius: var(--r-xl); margin-bottom: clamp(48px,6vw,72px); flex-wrap: wrap; }
.construction-overview__percent { display: flex; align-items: baseline; gap: 2px; flex-shrink: 0; }
.constr-pct { font-family: 'Plus Jakarta Sans', sans-serif; font-size: clamp(3rem,6vw,5rem); font-weight: 800; background: var(--grad-text); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; line-height: 1; }
.constr-pct-symbol { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 2rem; font-weight: 700; background: var(--grad-violet-cyan); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.construction-overview__right { flex: 1; min-width: 200px; }
.constr-overview__label   { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 0.85rem; font-weight: 700; color: var(--text-secondary); margin-bottom: 10px; letter-spacing: 0.04em; text-transform: uppercase; }
.constr-overview__bar     { height: 8px; background: rgba(255,255,255,0.08); border-radius: 99px; overflow: hidden; margin-bottom: 8px; }
.constr-overview__fill    { height: 100%; width: var(--fill); background: var(--grad-violet-cyan); border-radius: 99px; animation: progressFill 2s var(--ease-smooth) 0.3s both; }
.constr-overview__updated { font-size: 0.72rem; color: var(--text-muted); }
.construction-timeline    { position: relative; display: flex; flex-direction: column; }
.timeline-step { display: grid; grid-template-columns: 28px 40px 1fr; gap: 0 20px; align-items: start; padding-bottom: 36px; }
.timeline-step:last-child { padding-bottom: 0; }
.timeline-step__connector { grid-column: 2; grid-row: 1 / 3; position: relative; display: flex; justify-content: center; padding-top: 40px; }
.timeline-step__connector::after { content: ''; display: block; width: 2px; height: 100%; border-radius: 2px; }
.timeline-step__connector--done::after    { background: var(--grad-violet-cyan); }
.timeline-step__connector--active::after  { background: linear-gradient(to bottom, var(--cyan), rgba(34,211,238,0.20)); }
.timeline-step__connector--upcoming::after{ background: rgba(255,255,255,0.08); }
.timeline-step__node { grid-column: 2; grid-row: 1; width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; flex-shrink: 0; border: 2px solid; z-index: 2; }
.timeline-step__node i { width: 16px; height: 16px; }
.timeline-step--done .timeline-step__node { background: var(--grad-violet-cyan); border-color: transparent; color: white; box-shadow: 0 0 16px var(--violet-glow); }
.timeline-step__node--active     { background: rgba(34,211,238,0.15); border-color: var(--cyan) !important; color: var(--cyan-light) !important; box-shadow: 0 0 20px var(--cyan-glow); }
.timeline-step__node--upcoming   { background: var(--color-surface-2); border-color: rgba(255,255,255,0.12) !important; color: var(--text-muted) !important; }
.timeline-step__node--possession { background: linear-gradient(135deg, rgba(16,185,129,0.20), rgba(34,211,238,0.20)); border-color: var(--emerald) !important; color: #6EE7B7 !important; box-shadow: 0 0 20px var(--emerald-glow); }
.spin-icon { animation: iconSpin 1.5s linear infinite; }
.timeline-step__body     { grid-column: 3; grid-row: 1; }
.timeline-step__header   { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; padding-top: 8px; }
.timeline-step__title    { font-size: 1rem; font-weight: 700; }
.timeline-step__badge    { display: inline-flex; align-items: center; padding: 3px 10px; border-radius: var(--r-full); font-size: 0.68rem; font-weight: 700; letter-spacing: 0.05em; }
.timeline-step__badge--done       { background: rgba(124,58,237,0.15); border: 1px solid rgba(124,58,237,0.30); color: var(--violet-light); }
.timeline-step__badge--active     { background: rgba(34,211,238,0.15); border: 1px solid rgba(34,211,238,0.30); color: var(--cyan-light); }
.timeline-step__badge--upcoming   { background: rgba(255,255,255,0.06); border: 1px solid var(--color-border); color: var(--text-muted); }
.timeline-step__badge--possession { background: rgba(16,185,129,0.15); border: 1px solid rgba(16,185,129,0.30); color: #6EE7B7; }
.timeline-step__desc  { font-size: 0.85rem; color: var(--text-secondary); line-height: 1.7; margin-bottom: 12px; max-width: 560px; }
.timeline-step__meta  { display: flex; align-items: center; gap: 6px; font-size: 0.75rem; color: var(--text-muted); margin-bottom: 10px; }
.timeline-step__meta i { width: 13px; height: 13px; }
.timeline-step__progress-mini { display: flex; align-items: center; gap: 10px; max-width: 280px; }
.timeline-step__progress-mini .progress-bar { flex: 1; }
.timeline-step__progress-mini span { font-size: 0.72rem; font-weight: 600; color: var(--text-muted); white-space: nowrap; }

/* Inquiry & Final CTA */
.prop-inquiry-section { padding: var(--section-pad) 0; position: relative; overflow: hidden; }
.prop-inquiry-wrapper { display: grid; grid-template-columns: 1fr 1.2fr; gap: clamp(48px,6vw,80px); align-items: start; position: relative; z-index: 1; }
.prop-inquiry-highlights { margin-top: 28px; }
.prop-final-cta { position: relative; padding: clamp(64px,9vw,120px) 0; overflow: hidden; border-top: 1px solid var(--color-border); }
.prop-final-cta__bg { position: absolute; inset: 0; pointer-events: none; }
.prop-final-cta__blob-l { position: absolute; width: 700px; height: 700px; border-radius: 50%; filter: blur(100px); background: radial-gradient(circle, rgba(124,58,237,0.20), transparent 70%); left: -200px; top: -100px; }
.prop-final-cta__blob-r { position: absolute; width: 500px; height: 500px; border-radius: 50%; filter: blur(100px); background: radial-gradient(circle, rgba(34,211,238,0.14), transparent 70%); right: -100px; bottom: -50px; }
.prop-final-cta__inner  { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr auto; gap: clamp(40px,5vw,80px); align-items: center; }
.prop-final-cta__tag  { margin-bottom: 20px; }
.prop-final-cta__headline { font-size: clamp(2.4rem,5vw,4.5rem); font-weight: 800; letter-spacing: -0.03em; line-height: 1.05; margin-bottom: 16px; }
.prop-final-cta__sub  { font-size: 1rem; color: var(--text-secondary); line-height: 1.7; max-width: 480px; margin-bottom: 28px; }
.prop-final-cta__urgency { display: flex; align-items: center; padding: 16px 24px; background: var(--glass-bg); backdrop-filter: var(--glass-blur); border: 1px solid var(--glass-border); border-radius: var(--r-xl); width: fit-content; flex-wrap: wrap; gap: 4px; }
.urgency-item   { display: flex; flex-direction: column; align-items: center; padding: 0 20px; }
.urgency-num    { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 1.5rem; font-weight: 800; background: var(--grad-text); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.urgency-label  { font-size: 0.68rem; color: var(--text-muted); font-weight: 500; letter-spacing: 0.03em; text-align: center; margin-top: 2px; }
.prop-final-cta__actions { display: flex; flex-direction: column; gap: 12px; flex-shrink: 0; }
.prop-whatsapp-btn { background: rgba(37,211,102,0.15); border: 1px solid rgba(37,211,102,0.35); color: #4ADE80; }
.prop-whatsapp-btn:hover { background: rgba(37,211,102,0.25); box-shadow: 0 8px 24px rgba(37,211,102,0.20); }

/* Sticky mobile CTA */
.sticky-mobile-cta { display: none; position: fixed; bottom: 0; left: 0; right: 0; z-index: 200; padding: 12px 16px; background: rgba(11,15,26,0.95); backdrop-filter: blur(20px); border-top: 1px solid var(--color-border); gap: 8px; align-items: center; transform: translateY(100%); transition: transform var(--t-base) var(--ease-smooth); }
.sticky-mobile-cta.visible { transform: translateY(0); }

/* ─────────────────────────────────────────────────────────────
   28–30. ABOUT PAGE
───────────────────────────────────────────────────────────── */
/* About Hero Strip — compact, not full-screen */
.about-hero {
  padding: 160px 0 80px;
  position: relative;
  overflow: hidden;
}
.about-hero__atmosphere { position: absolute; inset: 0; pointer-events: none; }
.about-hero__content    { position: relative; z-index: 2; max-width: 780px; }
.about-hero__eyebrow    { font-size: 0.78rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--violet-light); margin-bottom: 16px; display: flex; align-items: center; gap: 10px; }
.about-hero__eyebrow::after { content: ''; flex: 1; max-width: 80px; height: 1px; background: var(--grad-violet-cyan); }
.about-hero__title { font-size: clamp(2.8rem, 6vw, 5.5rem); font-weight: 800; line-height: 1.0; letter-spacing: -0.03em; margin-bottom: 24px; animation: fadeSlideUp 0.9s var(--ease-smooth) 0.2s both; }
.about-hero__body  { font-size: clamp(1rem, 1.4vw, 1.15rem); color: var(--text-secondary); line-height: 1.8; max-width: 640px; animation: fadeSlideUp 0.9s var(--ease-smooth) 0.4s both; }

/* Mission/Vision bento (reuses .bento-card) */
.about-bento { display: grid; grid-template-columns: repeat(12, 1fr); gap: 16px; margin-top: 60px; }
.about-bento .bento-card[data-about="mission"]  { grid-column: span 5; }
.about-bento .bento-card[data-about="vision"]   { grid-column: span 4; }
.about-bento .bento-card[data-about="values"]   { grid-column: span 3; }
.about-bento .bento-card[data-about="legacy"]   { grid-column: span 4; }
.about-bento .bento-card[data-about="approach"] { grid-column: span 8; }

/* Founder / Team section */
.team-section { padding: var(--section-pad) 0; }
.team-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 20px; }
.team-card { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--r-xl); overflow: hidden; transition: transform var(--t-base) var(--ease-smooth), box-shadow var(--t-base) var(--ease-smooth); }
.team-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-md), 0 0 30px rgba(124,58,237,0.12); border-color: rgba(124,58,237,0.20); }
.team-card__avatar { height: 200px; display: flex; align-items: center; justify-content: center; position: relative; }
.team-card__avatar--a { background: linear-gradient(135deg, rgba(124,58,237,0.30), rgba(34,211,238,0.20)); }
.team-card__avatar--b { background: linear-gradient(135deg, rgba(34,211,238,0.25), rgba(16,185,129,0.20)); }
.team-card__avatar--c { background: linear-gradient(135deg, rgba(251,113,133,0.25), rgba(124,58,237,0.20)); }
.team-card__avatar--d { background: linear-gradient(135deg, rgba(245,158,11,0.25), rgba(251,113,133,0.15)); }
.team-card__initials { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 3rem; font-weight: 800; color: rgba(255,255,255,0.35); letter-spacing: -0.04em; }
.team-card__body { padding: 22px; }
.team-card__name { font-size: 1.05rem; font-weight: 800; margin-bottom: 4px; }
.team-card__role { font-size: 0.78rem; color: var(--violet-light); font-weight: 600; margin-bottom: 10px; }
.team-card__bio  { font-size: 0.82rem; color: var(--text-secondary); line-height: 1.65; }
.team-card__links { display: flex; gap: 8px; margin-top: 14px; }
.team-link { width: 30px; height: 30px; border-radius: var(--r-sm); background: var(--glass-bg); border: 1px solid var(--glass-border); display: grid; place-items: center; color: var(--text-muted); transition: all var(--t-fast); }
.team-link i { width: 13px; height: 13px; }
.team-link:hover { background: rgba(124,58,237,0.20); color: var(--violet-light); }

/* Awards */
.awards-section { padding: var(--section-pad) 0; border-top: 1px solid var(--color-border); }
.awards-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 16px; }
.award-card { padding: 24px 20px; border-radius: var(--r-xl); background: var(--glass-bg); border: 1px solid var(--glass-border); text-align: center; transition: all var(--t-base); }
.award-card:hover { background: rgba(124,58,237,0.10); border-color: rgba(124,58,237,0.25); transform: translateY(-4px); }
.award-card__icon { width: 48px; height: 48px; border-radius: 14px; background: rgba(124,58,237,0.15); border: 1px solid rgba(124,58,237,0.25); display: grid; place-items: center; margin: 0 auto 14px; color: var(--violet-light); }
.award-card__icon i { width: 22px; height: 22px; }
.award-card__title { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 0.92rem; font-weight: 700; margin-bottom: 4px; }
.award-card__year  { font-size: 0.72rem; color: var(--cyan-light); font-weight: 600; }
.award-card__org   { font-size: 0.72rem; color: var(--text-muted); margin-top: 3px; }

/* ─────────────────────────────────────────────────────────────
   31–37. CONTACT PAGE
───────────────────────────────────────────────────────────── */
/* Contact hero strip */
.contact-page-hero { padding: 160px 0 60px; position: relative; overflow: hidden; }
.contact-page-hero__atmosphere { position: absolute; inset: 0; pointer-events: none; }
.contact-page-hero__content { position: relative; z-index: 2; }
.contact-page-hero__title { font-size: clamp(2.8rem, 6vw, 5rem); font-weight: 800; line-height: 1.0; letter-spacing: -0.03em; margin-bottom: 16px; animation: fadeSlideUp 0.9s var(--ease-smooth) 0.2s both; }
.contact-page-hero__sub { font-size: 1.05rem; color: var(--text-secondary); line-height: 1.75; max-width: 560px; animation: fadeSlideUp 0.9s var(--ease-smooth) 0.35s both; }

/* Contact page layout */
.contact-page-section { padding: 0 0 var(--section-pad); }
.contact-page-grid { display: grid; grid-template-columns: 1fr 1.3fr; gap: clamp(48px,6vw,80px); align-items: start; }

/* Office cards */
.office-cards { display: flex; flex-direction: column; gap: 16px; margin-bottom: 28px; }
.office-card { padding: 20px 22px; border-radius: var(--r-xl); background: var(--color-surface); border: 1px solid var(--color-border); transition: all var(--t-fast); }
.office-card:hover { border-color: rgba(124,58,237,0.25); background: var(--color-surface-2); }
.office-card__head { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.office-card__icon { width: 38px; height: 38px; border-radius: 10px; display: grid; place-items: center; flex-shrink: 0; }
.office-card__icon i { width: 16px; height: 16px; }
.office-card__icon--hq  { background: rgba(124,58,237,0.20); color: var(--violet-light); }
.office-card__icon--ghy { background: rgba(34,211,238,0.18); color: var(--cyan-light); }
.office-card__city { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 0.95rem; font-weight: 700; }
.office-card__type { font-size: 0.68rem; color: var(--text-muted); font-weight: 600; letter-spacing: 0.05em; text-transform: uppercase; }
.office-card__details { display: flex; flex-direction: column; gap: 6px; }
.office-card__row { display: flex; align-items: flex-start; gap: 8px; font-size: 0.82rem; color: var(--text-secondary); }
.office-card__row i { width: 13px; height: 13px; flex-shrink: 0; margin-top: 3px; color: var(--violet-light); }

/* Large contact form card overrides (same classes, slight tweaks for contact page) */
.contact-page-form-card { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--r-xl); padding: 40px 36px; box-shadow: var(--shadow-lg), 0 0 60px rgba(124,58,237,0.08); }

/* ─────────────────────────────────────────────────────────────
   38. KEYFRAMES
───────────────────────────────────────────────────────────── */
@keyframes fadeSlideUp    { from { opacity: 0; transform: translateY(32px); } to { opacity: 1; transform: translateY(0); } }
@keyframes fadeSlideLeft  { from { opacity: 0; transform: translateY(-50%) translateX(40px); } to { opacity: 1; transform: translateY(-50%) translateX(0); } }
@keyframes blobFloat      { 0% { transform: translate(0,0) scale(1); } 100% { transform: translate(30px,20px) scale(1.05); } }
@keyframes shapeSpin      { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
@keyframes scrollPulse    { 0%,100% { opacity: 0.3; transform: scaleY(1); } 50% { opacity: 0.8; transform: scaleY(1.2); } }
@keyframes progressFill   { from { width: 0; } to { width: var(--fill); } }
@keyframes ringDraw       { from { stroke-dashoffset: 201; } }
@keyframes dotPulse       { 0%,100% { opacity: 1; transform: scale(1); } 50% { opacity: 0.6; transform: scale(0.75); } }
@keyframes pinRipple      { 0% { opacity: 0.8; transform: scale(0.5); } 100% { opacity: 0; transform: scale(1.5); } }
@keyframes iconSpin       { to { transform: rotate(360deg); } }

/* ─────────────────────────────────────────────────────────────
   39. RESPONSIVE OVERRIDES
───────────────────────────────────────────────────────────── */
@media (max-width: 1100px) {
  /* Bento */
  .bento-card[data-bento="a"] { grid-column: span 6; }
  .bento-card[data-bento="b"] { grid-column: span 6; }
  .bento-card[data-bento="c"] { grid-column: span 4; }
  .bento-card[data-bento="d"] { grid-column: span 4; }
  .bento-card[data-bento="e"] { grid-column: span 4; }
  .bento-card[data-bento="f"] { grid-column: span 12; }
  /* About bento */
  .about-bento .bento-card[data-about="mission"]  { grid-column: span 7; }
  .about-bento .bento-card[data-about="vision"]   { grid-column: span 5; }
  .about-bento .bento-card[data-about="values"]   { grid-column: span 4; }
  .about-bento .bento-card[data-about="legacy"]   { grid-column: span 4; }
  .about-bento .bento-card[data-about="approach"] { grid-column: span 12; }
  /* Details */
  .detail-wrapper   { grid-template-columns: 1fr; gap: 48px; }
  .detail-img-wrap  { height: 380px; }
  .detail-price-float { right: 16px; }
  /* Testi */
  .testimonials-grid { grid-template-columns: 1fr 1fr; }
  .testi-card:last-child { display: none; }
  /* Contact */
  .contact-wrapper { grid-template-columns: 1fr; }
  /* Footer */
  .footer__top-inner { grid-template-columns: 1fr 1fr; }
  /* Amenities */
  .amenity-card { grid-column: span 4; }
  .amenity-card--lg { grid-column: span 6; }
  /* Gallery */
  .gallery-masonry { grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(4, 160px); }
  .gallery-item--7 { grid-column: span 1; }
  /* Property */
  .prop-final-cta__inner { grid-template-columns: 1fr; }
  .prop-final-cta__actions { flex-direction: row; flex-wrap: wrap; }
  .location-wrapper { grid-template-columns: 1fr; }
  .location-map-wrap { position: static; }
  .location-map__inner { height: 300px; }
  /* Contact page */
  .contact-page-grid { grid-template-columns: 1fr; }
}

@media (max-width: 900px) {
  /* Navbar */
  .navbar__menu, .navbar__cta { display: none; }
  .navbar__burger { display: flex; }
  .navbar__menu.open { display: flex; flex-direction: column; position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(11,15,26,0.97); backdrop-filter: blur(24px); align-items: center; justify-content: center; gap: 24px; z-index: 99; }
  .navbar__menu.open .nav__link { font-size: 1.5rem; font-weight: 700; padding: 8px 20px; }
  /* Hero */
  .hero__float-card { display: none; }
  .stat-pill { padding: 0 12px; }
  /* Stats */
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  /* Bento all 12 */
  .bento-card[data-bento="a"], .bento-card[data-bento="b"], .bento-card[data-bento="c"],
  .bento-card[data-bento="d"], .bento-card[data-bento="e"], .bento-card[data-bento="f"] { grid-column: span 12; }
  .about-bento .bento-card[data-about] { grid-column: span 12; }
  /* Amenities */
  .amenity-card, .amenity-card--lg { grid-column: span 6; }
  /* Gallery */
  .gallery-masonry { grid-template-columns: repeat(2,1fr); grid-template-rows: auto; }
  .gallery-item { min-height: 180px; }
  .gallery-item--tall, .gallery-item--wide { grid-column: span 1; grid-row: span 1; }
  /* Testi */
  .testimonials-grid { grid-template-columns: 1fr; }
  .testi-card:last-child { display: block; }
  /* Spec chips */
  .spec-chips-grid { grid-template-columns: 1fr; }
  /* Property */
  .prop-hero__inner { grid-template-columns: 1fr; }
  .prop-hero { min-height: auto; padding-bottom: 40px; }
  .prop-hero__gallery { order: -1; }
  .prop-slider { height: 340px; }
  .prop-gallery-bento { grid-template-columns: 1fr 1fr; grid-template-rows: 220px 220px 160px; }
  .prop-gal-hero { grid-column: span 2; grid-row: span 1; }
  .prop-gal-stack-a, .prop-gal-stack-b, .prop-gal-b1, .prop-gal-b2, .prop-gal-b3, .prop-gal-more { grid-column: span 1; }
  .timeline-step { grid-template-columns: 40px 1fr; gap: 0 16px; }
  .timeline-step__connector { display: none; }
  .construction-overview { flex-direction: column; align-items: flex-start; }
  .prop-inquiry-wrapper { grid-template-columns: 1fr; }
}

@media (max-width: 600px) {
  :root { --section-pad: 64px; }
  .hero { padding: 100px 0 64px; min-height: auto; }
  .hero__headline { font-size: clamp(2.4rem, 11vw, 3.8rem); }
  .hero__stats { padding: 16px; width: 100%; justify-content: space-around; }
  .stat-pill { padding: 0 8px; }
  .stat__num { font-size: 1.2rem; }
  .stat-divider { display: none; }
  .hero__ctas { flex-direction: column; }
  .btn--lg { width: 100%; justify-content: center; }
  .projects-grid { grid-template-columns: 1fr; }
  .amenity-card, .amenity-card--lg { grid-column: span 12; }
  .stats-grid { grid-template-columns: repeat(2,1fr); gap: 1px; }
  .contact-form-card { padding: 24px 18px; }
  .form-grid { grid-template-columns: 1fr; }
  .form-group--full { grid-column: span 1; }
  .footer__top-inner { grid-template-columns: 1fr; gap: 36px; }
  .footer__bottom-inner { flex-direction: column; align-items: flex-start; gap: 12px; }
  /* Property */
  .apt-config-grid { grid-template-columns: 1fr; }
  .floor-plan-grid { grid-template-columns: 1fr; }
  .apartment-card__specs { grid-template-columns: 1fr; }
  .apartment-card__actions { flex-direction: column; }
  .prop-hero__name { font-size: clamp(2.4rem, 11vw, 3.5rem); }
  .prop-gallery-bento { grid-template-columns: 1fr; grid-template-rows: auto; }
  .prop-gal-hero, .prop-gal-stack-a, .prop-gal-stack-b, .prop-gal-b1, .prop-gal-b2, .prop-gal-b3, .prop-gal-more { grid-column: span 1; min-height: 180px; }
  .sticky-mobile-cta { display: flex; }
  body.property-page { padding-bottom: 80px; }
  .prop-final-cta__urgency { padding: 12px 16px; }
  .urgency-item { padding: 0 12px; }
  .fp-modal__card { padding: 20px 16px; }
  .fp-modal__blueprint-lg { min-height: 260px; }
  /* About */
  .about-hero { padding: 130px 0 60px; }
  .team-grid { grid-template-columns: 1fr 1fr; }
  .awards-grid { grid-template-columns: 1fr 1fr; }
  /* Contact */
  .contact-page-hero { padding: 130px 0 40px; }
}

/* ─────────────────────────────────────────────────────────────
   40. CENTAURI — STOCK IMAGES & HERO BG
───────────────────────────────────────────────────────────── */

/* Hero section background image */
.hero {
  position: relative;
}
.hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url('https://images.unsplash.com/photo-1486325212027-8081e485255e?w=1920&q=80');
  background-size: cover;
  background-position: center 30%;
  opacity: 0.12;
  z-index: 0;
  pointer-events: none;
}

/* Hero float card — Centauri upgrade */
.hero__float-card--centauri {
  min-width: 240px;
  padding: 0;
  overflow: hidden;
}
.float-card__img--centauri {
  width: 100%;
  height: 110px;
  background-image: url('https://images.unsplash.com/photo-1545324418-cc1a3fa10c00?w=600&q=80');
  background-size: cover;
  background-position: center;
  flex-shrink: 0;
}
.float-card__tag--flagship {
  background: linear-gradient(135deg, var(--violet), var(--cyan));
  color: white;
  font-weight: 700;
}
.float-card__sub {
  font-size: 0.72rem;
  color: var(--text-muted);
  margin-top: 2px;
  margin-bottom: 4px;
}
.float-card__chips-mini {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: 8px;
}
.float-card__chips-mini span {
  font-size: 0.65rem;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: var(--r-full);
  background: rgba(124,58,237,0.18);
  border: 1px solid rgba(124,58,237,0.3);
  color: var(--violet-light);
  letter-spacing: 0.02em;
}

/* Project card stock images */
.project-card__img--centauri {
  background-image: url('https://images.unsplash.com/photo-1545324418-cc1a3fa10c00?w=900&q=80');
  background-size: cover;
  background-position: center;
}
.project-card__img--1 {
  background-image: url('https://images.unsplash.com/photo-1560448204-e02f11c3d0e2?w=800&q=80');
  background-size: cover;
  background-position: center;
}
.project-card__img--2 {
  background-image: url('https://images.unsplash.com/photo-1611892440504-42a792e24d32?w=800&q=80');
  background-size: cover;
  background-position: center;
}
.project-card__img--3 {
  background-image: url('https://images.unsplash.com/photo-1497366811353-6870744d04b2?w=800&q=80');
  background-size: cover;
  background-position: center;
}
.project-card__img--4 {
  background-image: url('https://images.unsplash.com/photo-1568605114967-8130f3a36994?w=800&q=80');
  background-size: cover;
  background-position: center;
}

/* Centauri hero project card */
.project-card--centauri-hero {
  grid-column: span 2;
}
.project-card--centauri-hero .project-card__img--centauri {
  height: 320px;
}
.project-card__tagline-text {
  font-style: italic;
  color: var(--cyan-light);
  font-size: 0.82rem;
  margin-bottom: 8px;
  opacity: 0.85;
}

/* Bento Centauri bg */
.bento-card--centauri {
  position: relative;
  overflow: hidden;
}
.bento-card--centauri .bento-card__bg-img {
  position: absolute;
  inset: 0;
  background-image: url('https://images.unsplash.com/photo-1545324418-cc1a3fa10c00?w=700&q=80');
  background-size: cover;
  background-position: center;
  opacity: 0.08;
  z-index: 0;
  pointer-events: none;
}
.bento-card--centauri > *:not(.bento-card__bg-img):not(.bento-card__glow) {
  position: relative;
  z-index: 1;
}
.bento-card__launch-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.65rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: var(--r-full);
  background: linear-gradient(135deg, var(--violet), var(--cyan));
  color: white;
  margin-bottom: 8px;
  width: fit-content;
}

/* ─────────────────────────────────────────────────────────────
   41. CENTAURI SPOTLIGHT SECTION
───────────────────────────────────────────────────────────── */
.centauri-spotlight {
  position: relative;
  padding: var(--section-pad) 0;
  overflow: hidden;
}
.centauri-spotlight__bg {
  position: absolute;
  inset: 0;
  background-image: url('https://images.unsplash.com/photo-1486325212027-8081e485255e?w=1920&q=80');
  background-size: cover;
  background-position: center 40%;
  z-index: 0;
}
.centauri-spotlight__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    135deg,
    rgba(11,15,26,0.94) 0%,
    rgba(11,15,26,0.88) 50%,
    rgba(11,15,26,0.82) 100%
  );
  z-index: 1;
}
.centauri-spotlight .container {
  position: relative;
  z-index: 2;
}
.centauri-spotlight__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: start;
}
.cs-tag {
  margin-bottom: 20px;
}
.centauri-spotlight__title {
  font-size: clamp(2.8rem, 5vw, 5rem);
  font-weight: 900;
  line-height: 1;
  margin-bottom: 14px;
}
.centauri-spotlight__tagline {
  font-style: italic;
  color: var(--cyan-light);
  font-size: 1.1rem;
  margin-bottom: 16px;
  opacity: 0.85;
}
.centauri-spotlight__loc {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--text-secondary);
  font-size: 0.9rem;
  margin-bottom: 36px;
}
.centauri-spotlight__loc svg { width: 16px; height: 16px; color: var(--violet-light); flex-shrink: 0; }

/* Quick stats */
.cs-quick-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-bottom: 28px;
}
.cs-stat {
  background: var(--glass-bg);
  border: 1px solid var(--glass-border);
  border-radius: var(--r-md);
  padding: 14px 10px;
  text-align: center;
  backdrop-filter: var(--glass-blur);
}
.cs-stat__num {
  display: block;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 900;
  font-size: 1.5rem;
  background: var(--grad-violet-cyan);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
  margin-bottom: 4px;
}
.cs-stat__label {
  font-size: 0.65rem;
  color: var(--text-muted);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

/* Amenity chips */
.cs-amenity-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 24px;
}
.cs-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: var(--r-full);
  font-size: 0.75rem;
  font-weight: 600;
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.1);
  color: var(--text-secondary);
  transition: all var(--t-fast);
}
.cs-chip:hover {
  background: rgba(124,58,237,0.15);
  border-color: rgba(124,58,237,0.4);
  color: var(--text-primary);
}
.cs-chip svg { width: 13px; height: 13px; color: var(--violet-light); flex-shrink: 0; }

/* Construction info */
.cs-construction-info {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 32px;
}
.cs-ci-item {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--text-secondary);
  font-size: 0.82rem;
}
.cs-ci-item svg { width: 14px; height: 14px; color: var(--cyan); flex-shrink: 0; }

.cs-ctas {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
}

/* RIGHT side */
.centauri-spotlight__right {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* Unit table */
.cs-unit-table {
  background: var(--glass-bg);
  border: 1px solid var(--glass-border);
  border-radius: var(--r-lg);
  overflow: hidden;
  backdrop-filter: var(--glass-blur);
}
.cs-unit-table__header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 16px 20px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 800;
  font-size: 0.9rem;
  letter-spacing: -0.01em;
  background: rgba(124,58,237,0.12);
  border-bottom: 1px solid var(--glass-border);
}
.cs-unit-table__header svg { width: 16px; height: 16px; color: var(--violet-light); }
.cs-unit-group {
  padding: 12px 20px;
  border-bottom: 1px solid rgba(255,255,255,0.04);
}
.cs-unit-group:last-child { border-bottom: none; }
.cs-unit-group__label {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--cyan-light);
  margin-bottom: 8px;
  padding-bottom: 6px;
  border-bottom: 1px solid rgba(34,211,238,0.12);
}
.cs-unit-row {
  display: grid;
  grid-template-columns: 1fr 1.3fr 1.3fr 1.3fr;
  gap: 8px;
  padding: 6px 0;
  font-size: 0.78rem;
  border-bottom: 1px solid rgba(255,255,255,0.03);
}
.cs-unit-row:last-child { border-bottom: none; }
.cs-unit-row--head {
  color: var(--text-muted);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
.cs-unit-row:not(.cs-unit-row--head) { color: var(--text-secondary); }
.cs-unit-row span:first-child { color: var(--text-primary); font-weight: 600; }

/* Connectivity */
.cs-connectivity {
  background: var(--glass-bg);
  border: 1px solid var(--glass-border);
  border-radius: var(--r-lg);
  overflow: hidden;
  backdrop-filter: var(--glass-blur);
}
.cs-connectivity__header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 16px 20px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 800;
  font-size: 0.9rem;
  background: rgba(34,211,238,0.08);
  border-bottom: 1px solid var(--glass-border);
}
.cs-connectivity__header svg { width: 16px; height: 16px; color: var(--cyan); }
.cs-connectivity__list { padding: 8px 0; }
.cs-conn-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 20px;
  font-size: 0.8rem;
  border-bottom: 1px solid rgba(255,255,255,0.03);
  transition: background var(--t-fast);
}
.cs-conn-item:last-child { border-bottom: none; }
.cs-conn-item:hover { background: rgba(255,255,255,0.02); }
.cs-conn-place { color: var(--text-secondary); }
.cs-conn-dist {
  font-weight: 700;
  font-size: 0.75rem;
  padding: 3px 10px;
  border-radius: var(--r-full);
  background: rgba(34,211,238,0.1);
  border: 1px solid rgba(34,211,238,0.2);
  color: var(--cyan-light);
}

/* Responsive */
@media (max-width: 900px) {
  .centauri-spotlight__inner {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .cs-quick-stats {
    grid-template-columns: repeat(2, 1fr);
  }
  .project-card--centauri-hero {
    grid-column: span 1;
  }
}

/* ─────────────────────────────────────────────────────────────
   42. GALLERY STOCK IMAGES — CENTAURI
───────────────────────────────────────────────────────────── */
.gallery-item--1 {
  background-image: url('https://images.unsplash.com/photo-1545324418-cc1a3fa10c00?w=900&q=80');
  background-size: cover; background-position: center;
}
.gallery-item--2 {
  background-image: url('https://images.unsplash.com/photo-1522708323590-d24dbb6b0267?w=700&q=80');
  background-size: cover; background-position: center;
}
.gallery-item--3 {
  background-image: url('https://images.unsplash.com/photo-1575429198097-0414ec08e8cd?w=700&q=80');
  background-size: cover; background-position: center;
}
/* stale gallery items 4-7 removed — see section 49 */

/* Amenity card bg images */
.amenity-card--violet {
  background-image: url('https://images.unsplash.com/photo-1575429198097-0414ec08e8cd?w=600&q=70');
  background-size: cover; background-position: center; background-blend-mode: overlay;
}
.amenity-card--cyan {
  background-image: url('https://images.unsplash.com/photo-1534438327276-14e5300c3a48?w=600&q=70');
  background-size: cover; background-position: center; background-blend-mode: overlay;
}
.amenity-card--emerald {
  background-image: url('https://images.unsplash.com/photo-1489599849927-2ee91cede3ba?w=600&q=70');
  background-size: cover; background-position: center; background-blend-mode: overlay;
}

/* ─────────────────────────────────────────────────────────────
   43. AXOMPROP — LOGO & NAVBAR OVERRIDES
───────────────────────────────────────────────────────────── */
.navbar__logo--axom {
  display: flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
}
.navbar__logo-img {
  width: 44px;
  height: 44px;
  object-fit: contain;
  border-radius: 8px;
}
.navbar__logo-text-wrap {
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.navbar__logo-name {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 900;
  font-size: 1.1rem;
  letter-spacing: 0.12em;
  color: #D4AF7A;
  line-height: 1;
}
.navbar__logo-sub {
  font-size: 0.58rem;
  letter-spacing: 0.1em;
  color: var(--text-muted);
  text-transform: uppercase;
  font-weight: 500;
}
.navbar__actions {
  display: flex;
  align-items: center;
  gap: 10px;
}
.btn--call {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 9px 16px;
  border-radius: var(--r-full);
  background: rgba(16,185,129,0.12);
  border: 1px solid rgba(16,185,129,0.3);
  color: #10B981;
  font-weight: 700;
  font-size: 0.8rem;
  transition: all var(--t-fast);
  text-decoration: none;
  white-space: nowrap;
}
.btn--call:hover {
  background: rgba(16,185,129,0.22);
  border-color: rgba(16,185,129,0.6);
  color: #34D399;
}
.btn--call svg { width: 14px; height: 14px; flex-shrink: 0; }
.navbar__call-num { display: none; }
@media (min-width: 1024px) { .navbar__call-num { display: inline; } }

/* WhatsApp CTA button */
.btn--whatsapp {
  background: linear-gradient(135deg, #25D366, #128C7E);
  color: white;
  box-shadow: 0 8px 24px rgba(37,211,102,0.3);
}

/* ─────────────────────────────────────────────────────────────
   44. HERO — KEN BURNS
───────────────────────────────────────────────────────────── */
.hero__kenburns {
  position: absolute;
  inset: 0;
  overflow: hidden;
  z-index: 0;
}
.hero__kenburns-img {
  position: absolute;
  inset: -8%;
  background-image: url('../img/centauri-night.jpg');
  background-size: cover;
  background-position: center;
  animation: kenburns 22s ease-in-out infinite alternate;
  transform-origin: center center;
}
@keyframes kenburns {
  0%   { transform: scale(1.0) translate(0, 0); }
  50%  { transform: scale(1.08) translate(-1%, -1%); }
  100% { transform: scale(1.14) translate(1.5%, 0.5%); }
}
.hero__dim {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(11,15,26,0.62) 0%,
    rgba(11,15,26,0.45) 40%,
    rgba(11,15,26,0.72) 100%
  );
  z-index: 1;
}
.hero__atmosphere,
.hero__shapes,
.hero__content,
.hero__float-card,
.hero__scroll-hint {
  position: relative;
  z-index: 2;
}
/* Remove old hero::before (Unsplash bg) */
.hero::before { display: none; }

/* ─────────────────────────────────────────────────────────────
   45. CENTAURI INTRO SECTION
───────────────────────────────────────────────────────────── */
.centauri-intro {
  position: relative;
  padding: var(--section-pad) 0;
  overflow: hidden;
}
.centauri-intro__bg {
  position: absolute;
  inset: 0;
  background: var(--color-surface);
  z-index: 0;
}
.centauri-intro__overlay { display: none; }
.centauri-intro .container { position: relative; z-index: 1; }
.centauri-intro__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: center;
}
.centauri-intro__tagline {
  font-style: italic;
  color: var(--cyan-light);
  font-size: 1.1rem;
  margin: 8px 0 14px;
  opacity: 0.85;
}
.centauri-intro__loc {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--text-secondary);
  font-size: 0.88rem;
  margin-bottom: 12px;
}
.centauri-intro__loc svg { width: 14px; height: 14px; color: var(--violet-light); flex-shrink: 0; }
.centauri-intro__structure {
  font-size: 0.78rem;
  color: var(--text-muted);
  line-height: 1.7;
  margin-bottom: 28px;
  padding: 12px 16px;
  border-left: 2px solid var(--violet);
  background: rgba(124,58,237,0.05);
  border-radius: 0 var(--r-sm) var(--r-sm) 0;
}
.ci-quick-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin-bottom: 28px;
}
.ci-stat {
  background: var(--glass-bg);
  border: 1px solid var(--glass-border);
  border-radius: var(--r-md);
  padding: 14px 8px;
  text-align: center;
}
.ci-stat__num {
  display: block;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 900;
  font-size: 1.4rem;
  background: var(--grad-violet-cyan);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
  margin-bottom: 4px;
}
.ci-stat__label {
  font-size: 0.62rem;
  color: var(--text-muted);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.ci-ctas { display: flex; gap: 12px; flex-wrap: wrap; }

/* Right — image */
.centauri-intro__img-wrap {
  position: relative;
  border-radius: var(--r-xl);
  overflow: hidden;
  box-shadow: var(--shadow-lg), 0 0 60px rgba(124,58,237,0.2);
}
.centauri-intro__img {
  width: 100%;
  display: block;
  border-radius: var(--r-xl);
  transition: transform 0.8s var(--ease-smooth);
}
.centauri-intro__img-wrap:hover .centauri-intro__img { transform: scale(1.03); }
.centauri-intro__img-badge {
  position: absolute;
  bottom: 16px;
  left: 16px;
  display: flex;
  align-items: center;
  gap: 7px;
  background: rgba(11,15,26,0.85);
  backdrop-filter: blur(12px);
  border: 1px solid var(--glass-border);
  border-radius: var(--r-full);
  padding: 8px 16px;
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--text-primary);
}
.centauri-intro__img-badge svg { width: 14px; height: 14px; color: var(--violet-light); }

@media (max-width: 900px) {
  .centauri-intro__inner { grid-template-columns: 1fr; gap: 36px; }
  .ci-quick-stats { grid-template-columns: repeat(2, 1fr); }
}

/* ─────────────────────────────────────────────────────────────
   46. FLAT CONFIG CARDS — project card stock images
───────────────────────────────────────────────────────────── */
.pci--2bhk {
  background-image: url('https://images.unsplash.com/photo-1560448204-e02f11c3d0e2?w=800&q=80');
  background-size: cover; background-position: center;
  min-height: 220px;
}
.pci--3bhk {
  background-image: url('../img/centauri-day.jpg');
  background-size: cover; background-position: center top;
  min-height: 220px;
}
.pci--4bhk {
  background-image: url('https://images.unsplash.com/photo-1617806118233-18e1de247200?w=800&q=80');
  background-size: cover; background-position: center;
  min-height: 220px;
}
.pci--commercial {
  background-image: url('../img/centauri-night.jpg');
  background-size: cover; background-position: center;
  min-height: 220px;
}

/* ─────────────────────────────────────────────────────────────
   47. SPECS SECTION
───────────────────────────────────────────────────────────── */
.specs-section {
  padding: var(--section-pad) 0;
  background: var(--color-surface);
}
.specs-image-wrap {
  position: relative;
  border-radius: var(--r-xl);
  overflow: hidden;
  box-shadow: var(--shadow-lg);
  margin-top: 40px;
}
.specs-full-img {
  width: 100%;
  display: block;
  border-radius: var(--r-xl);
}
.specs-cta-overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 40px;
  background: linear-gradient(to top, rgba(11,15,26,0.9) 0%, transparent 100%);
  display: flex;
  justify-content: center;
  align-items: flex-end;
}

/* ─────────────────────────────────────────────────────────────
   48. FLOOR PLANS GALLERY
───────────────────────────────────────────────────────────── */
.floorplan-section {
  padding: var(--section-pad) 0;
  background: var(--color-deep);
}
.fp-gallery-grid {
  display: grid;
  grid-template-columns: 2fr 1fr;
  grid-template-rows: auto auto;
  gap: 16px;
  margin-top: 40px;
}
.fp-gallery-item {
  position: relative;
  border-radius: var(--r-lg);
  overflow: hidden;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  transition: transform var(--t-base) var(--ease-smooth), box-shadow var(--t-base);
}
.fp-gallery-item:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-lg);
}
.fp-gallery-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  min-height: 280px;
}
.fp-gallery-item--wide {
  grid-column: 1 / -1;
}
.fp-gallery-label {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 12px 16px;
  background: linear-gradient(to top, rgba(11,15,26,0.9), transparent);
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--text-secondary);
  letter-spacing: 0.02em;
}
@media (max-width: 768px) {
  .fp-gallery-grid { grid-template-columns: 1fr; }
  .fp-gallery-item--wide { grid-column: 1; }
}

/* ─────────────────────────────────────────────────────────────
   49. GALLERY STOCK — project images from Centauri renders
───────────────────────────────────────────────────────────── */
/* 1 — Centauri night render (full complex) */
.gallery-item--1 {
  background-image: url('../img/centauri-night.jpg');
  background-size: cover; background-position: center;
  filter: brightness(1.15);
}
/* 2 — Centauri day render */
.gallery-item--2 {
  background-image: url('../img/centauri-day.jpg');
  background-size: cover; background-position: center top;
}
/* 3 — Rooftop infinity pool */
.gallery-item--3 {
  background-image: url('https://images.unsplash.com/photo-1571003123894-1f0594d2b5d9?w=700&q=80');
  background-size: cover; background-position: center;
}
/* 4 — Centauri day aerial (wide slot) */
.gallery-item--4 {
  background-image: url('../img/centauri-day.jpg');
  background-size: cover; background-position: center 30%;
  filter: brightness(1.1);
}
/* 5 — Modern apartment living room interior */
.gallery-item--5 {
  background-image: url('https://images.unsplash.com/photo-1586023492125-27b2c045efd7?w=700&q=80');
  background-size: cover; background-position: center;
}
/* 6 — Centauri night (tall slot, different crop) */
.gallery-item--6 {
  background-image: url('../img/centauri-night.jpg');
  background-size: cover; background-position: center top;
  filter: brightness(1.2);
}
/* 7 — Landscaped residential garden */
.gallery-item--7 {
  background-image: url('https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=700&q=80');
  background-size: cover; background-position: center;
}

/* ─────────────────────────────────────────────────────────────
   50. FLOATING WHATSAPP BUTTON
───────────────────────────────────────────────────────────── */
.whatsapp-float {
  position: fixed;
  bottom: 28px;
  right: 28px;
  z-index: 9999;
  display: flex;
  align-items: center;
  gap: 10px;
  background: linear-gradient(135deg, #25D366, #128C7E);
  color: white;
  border-radius: var(--r-full);
  padding: 14px 20px;
  text-decoration: none;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 700;
  font-size: 0.85rem;
  box-shadow: 0 8px 32px rgba(37,211,102,0.5), 0 4px 12px rgba(0,0,0,0.4);
  transition: all var(--t-base) var(--ease-spring);
  animation: wa-pulse 3s ease-in-out infinite;
}
.whatsapp-float:hover {
  transform: translateY(-3px) scale(1.04);
  box-shadow: 0 14px 40px rgba(37,211,102,0.65), 0 6px 16px rgba(0,0,0,0.5);
}
.whatsapp-float__icon {
  width: 22px;
  height: 22px;
  flex-shrink: 0;
}
.whatsapp-float__label {
  white-space: nowrap;
}
@keyframes wa-pulse {
  0%, 100% { box-shadow: 0 8px 32px rgba(37,211,102,0.5), 0 4px 12px rgba(0,0,0,0.4); }
  50%       { box-shadow: 0 8px 48px rgba(37,211,102,0.75), 0 4px 12px rgba(0,0,0,0.4); }
}
@media (max-width: 480px) {
  .whatsapp-float { padding: 12px 14px; }
  .whatsapp-float__label { display: none; }
}

/* ─────────────────────────────────────────────────────────────
   51. FOOTER LOGO
───────────────────────────────────────────────────────────── */
.footer-logo-wrap {
  display: flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  margin-bottom: 16px;
}
.footer-logo-img {
  width: 52px;
  height: 52px;
  object-fit: contain;
  border-radius: 10px;
}
.footer-logo-name {
  display: block;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 900;
  font-size: 1.2rem;
  letter-spacing: 0.12em;
  color: #D4AF7A;
  line-height: 1;
}
.footer-logo-sub {
  display: block;
  font-size: 0.6rem;
  letter-spacing: 0.08em;
  color: var(--text-muted);
  text-transform: uppercase;
  margin-top: 3px;
}
.social-btn--insta:hover { color: #E1306C; border-color: #E1306C; }
.social-btn--wa:hover { color: #25D366; border-color: #25D366; }

/* ─────────────────────────────────────────────────────────────
   52. MOBILE UX FIXES — Responsive Overrides
───────────────────────────────────────────────────────────── */

/* ── FIX 1: navbar__actions not hidden on mobile ── */
@media (max-width: 900px) {
  .navbar__actions { display: none; }

  /* Show call link inside mobile fullscreen menu */
  .navbar__menu.open::after {
    content: '';
  }
  /* Mobile menu gets call + WA links via JS-injected items,
     but we add a fallback CTA strip below the links */
  .navbar__menu.open {
    padding-bottom: 100px;
  }
  .navbar__menu.open .nav__mobile-actions {
    display: flex !important;
  }
}
/* Mobile call + WA strip injected via JS */
.nav__mobile-actions {
  display: none;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  max-width: 280px;
  margin-top: 16px;
}
.nav__mobile-actions a {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 13px 20px;
  border-radius: var(--r-full);
  font-weight: 700;
  font-size: 0.9rem;
  text-decoration: none;
  transition: all var(--t-fast);
}
.nav__mobile-call {
  background: rgba(16,185,129,0.15);
  border: 1px solid rgba(16,185,129,0.35);
  color: #10B981;
}
.nav__mobile-wa {
  background: linear-gradient(135deg, rgba(37,211,102,0.2), rgba(18,140,126,0.2));
  border: 1px solid rgba(37,211,102,0.35);
  color: #25D366;
}
.nav__mobile-actions svg { width: 16px; height: 16px; flex-shrink: 0; }

/* ── FIX 2: Unit table — 3-col on mobile (drop Balcony column if present) ── */
@media (max-width: 540px) {
  .cs-unit-row {
    grid-template-columns: 1.2fr 1.4fr 1.4fr;
  }
  /* cs-unit-row only has 3 cols (Type, Carpet, SBUA) — already good */
}

/* ── FIX 3: Gallery items need real min-height with local images ── */
.gallery-item {
  min-height: 200px;
  background-color: var(--color-surface); /* fallback while loading */
}
.gallery-item--tall { min-height: 300px; }
@media (max-width: 900px) {
  .gallery-item, .gallery-item--tall { min-height: 160px; }
}
@media (max-width: 600px) {
  .gallery-masonry { grid-template-columns: 1fr !important; }
  .gallery-item, .gallery-item--tall, .gallery-item--wide { min-height: 200px; }
}

/* ── FIX 4: Hero float card — ensure body has padding on very small screens ── */
@media (max-width: 600px) {
  .hero__float-card { display: none; } /* already hidden at 900, extra safety */
  .hero__stats { flex-wrap: wrap; gap: 8px; }
}

/* ── FIX 5: Contact form grid single-col on mobile ── */
@media (max-width: 600px) {
  .contact-page-grid { grid-template-columns: 1fr !important; }
  .contact-page-form-card { padding: 24px 16px; }
  .form-grid { grid-template-columns: 1fr !important; }
  .form-group--full { grid-column: 1 !important; }
}

/* ── FIX 6: Centauri intro image stack on mobile ── */
@media (max-width: 768px) {
  .centauri-intro__inner { grid-template-columns: 1fr; gap: 32px; }
  .centauri-intro__img-wrap { order: -1; }
  .ci-quick-stats { grid-template-columns: repeat(2, 1fr); }
}

/* ── FIX 7: cs-connectivity on small screens ── */
@media (max-width: 480px) {
  .cs-conn-item { flex-wrap: wrap; gap: 4px; }
  .centauri-spotlight__inner { grid-template-columns: 1fr; gap: 28px; }
  .cs-quick-stats { grid-template-columns: repeat(2,1fr); }
}

/* ── FIX 8: fp-gallery responsive ── */
@media (max-width: 600px) {
  .fp-gallery-grid { grid-template-columns: 1fr; }
  .fp-gallery-item img { min-height: 220px; }
}

/* ── FIX 9: Flat config cards — full width on mobile ── */
@media (max-width: 600px) {
  .projects-grid { grid-template-columns: 1fr !important; }
  .project-card--centauri-hero { grid-column: 1 !important; }
  .project-card--centauri-hero .project-card__img--centauri { height: 220px; }
}

/* ── FIX 10: Specs image — readable on mobile ── */
@media (max-width: 600px) {
  .specs-cta-overlay { padding: 20px 16px; }
  .specs-full-img { border-radius: var(--r-md); }
}

/* ── FIX 11: Navbar logo sub-text — hide on tight screens ── */
@media (max-width: 360px) {
  .navbar__logo-sub { display: none; }
  .navbar__logo-img { width: 36px; height: 36px; }
}

/* ── FIX 12: btn--full helper ── */
.btn--full { width: 100%; justify-content: center; }

/* ── FIX 13: form-textarea height ── */
.form-textarea {
  min-height: 110px;
  resize: vertical;
}

/* ── FIX 14: Amenities grid — prevent overflow on mid screens ── */
@media (max-width: 600px) {
  .amenity-card { min-height: 140px; }
}

/* ─────────────────────────────────────────────────────────────
   53. MAIN.JS MOBILE MENU — inject call+WA actions
───────────────────────────────────────────────────────────── */
/* Note: JS injection handled in main.js patch below */

/* ── 4-column unit row variant ── */
.cs-unit-row--4 {
  grid-template-columns: 1.4fr 1.2fr 1.1fr 1.2fr;
}
@media (max-width: 420px) {
  .cs-unit-row--4 {
    grid-template-columns: 1.2fr 1fr 1fr 1fr;
    font-size: 0.7rem;
  }
}

/* ── 3-column unit row (Type · Balcony · SBUA) ── */
.cs-unit-row--3 {
  grid-template-columns: 1.6fr 1.1fr 1.3fr;
}
@media (max-width: 420px) {
  .cs-unit-row--3 { font-size: 0.72rem; }
}