@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Playfair+Display:wght@500;600;700&display=swap");

:root {
  --oak-ink: #0f1723;
  --oak-ink-soft: rgba(15, 23, 35, 0.78);
  --oak-panel: rgba(255, 251, 245, 0.84);
  --oak-panel-strong: rgba(255, 255, 255, 0.94);
  --oak-panel-dark: rgba(18, 23, 29, 0.82);
  --oak-line: rgba(15, 23, 35, 0.1);
  --oak-line-strong: rgba(15, 23, 35, 0.16);
  --oak-muted: rgba(15, 23, 35, 0.62);
  --oak-sand: #efe3d0;
  --oak-ivory: #faf6ef;
  --oak-bronze: #b98b4f;
  --oak-bronze-deep: #936631;
  --oak-bronze-soft: rgba(185, 139, 79, 0.16);
  --oak-white: #ffffff;
  --oak-danger: #c65f5f;
  --oak-shadow: 0 24px 60px rgba(15, 23, 35, 0.1);
  --oak-shadow-soft: 0 16px 40px rgba(15, 23, 35, 0.07);
  --oak-radius-xl: 32px;
  --oak-radius-lg: 24px;
  --oak-radius-md: 18px;
  --oak-radius-sm: 14px;
  --font-heading: "Cormorant Garamond", serif;
  --font-body: "Manrope", sans-serif;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  background:
    radial-gradient(circle at 8% 0%, rgba(185, 139, 79, 0.22), transparent 28rem),
    radial-gradient(circle at 92% 8%, rgba(15, 23, 35, 0.08), transparent 30rem),
    linear-gradient(180deg, #fbf8f2 0%, #f4ede1 50%, #eee3d5 100%);
  color: var(--oak-ink);
  font-family: var(--font-body);
  line-height: 1.6;
  overflow-x: hidden;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

body.nav-open {
  overflow: hidden;
}

a {
  color: inherit;
  text-decoration: none;
}

button,
input,
select,
textarea {
  font: inherit;
}

button,
.btn {
  cursor: pointer;
}

img {
  display: block;
  max-width: 100%;
}

.skip-link {
  position: fixed;
  top: 12px;
  left: 12px;
  z-index: 2000;
  padding: 0.75rem 1rem;
  background: #fff;
  color: #111;
  transform: translateY(-160%);
}

.skip-link:focus { transform: translateY(0); }

.shell {
  width: min(1200px, calc(100% - 32px));
  margin: 0 auto;
}

.topbar {
  position: sticky;
  top: 0;
  z-index: 50;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(10, 12, 16, 0.7);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.nav {
  min-height: 78px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.brand {
  display: inline-flex;
  align-items: center;
}

.brand img {
  width: 138px;
  max-height: 56px;
  object-fit: contain;
}

.nav-links,
.nav-actions {
  display: none;
}

.mobile-menu-button {
  display: inline-flex;
  min-width: 46px;
  min-height: 46px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
  color: var(--oak-white);
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.mobile-menu {
  position: fixed;
  inset: 78px 0 auto;
  z-index: 45;
  display: none;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(12, 15, 20, 0.96);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.mobile-menu.is-open {
  display: block;
}

.mobile-menu a {
  display: block;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  padding: 1rem 1.25rem;
  color: rgba(255, 255, 255, 0.86);
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.btn {
  min-height: 52px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  padding: 0 1.35rem;
  border: 1px solid transparent;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  transition: transform 180ms ease, background 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.btn:hover,
.btn:focus-visible {
  transform: translateY(-1px);
  outline: none;
}

.btn-primary {
  border-color: rgba(185, 139, 79, 0.62);
  background: linear-gradient(135deg, #c79a5f, #a6773e);
  color: #fffefb;
  box-shadow: 0 16px 34px rgba(166, 119, 62, 0.28);
}

.btn-primary:hover,
.btn-primary:focus-visible {
  background: linear-gradient(135deg, #d4ab74, #b17d42);
}

.btn-ghost {
  border-color: rgba(255, 255, 255, 0.44);
  background: rgba(255, 255, 255, 0.08);
  color: var(--oak-white);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.btn-ghost:hover,
.btn-ghost:focus-visible {
  background: rgba(255, 255, 255, 0.16);
}

.nav-phone {
  color: rgba(255, 255, 255, 0.82);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.hero {
  position: relative;
  min-height: min(860px, calc(100svh - 18px));
  display: flex;
  align-items: flex-end;
  overflow: hidden;
}

.hero-bg,
.hero-slider,
.hero-shade {
  position: absolute;
  inset: 0;
}

.hero-bg {
  background-position: center;
  background-size: cover;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.88;
}

.hero-slider .hero-bg {
  opacity: 0;
}

.hero-slide {
  transform: scale(1.04);
  transition: opacity 900ms ease, transform 6200ms ease;
  will-change: opacity, transform;
}

.hero-slide.is-active {
  opacity: 0.88;
  transform: scale(1);
}

.hero-shade {
  background:
    linear-gradient(115deg, rgba(7, 10, 14, 0.82), rgba(7, 10, 14, 0.42) 48%, rgba(255, 255, 255, 0.08)),
    linear-gradient(to top, rgba(16, 21, 28, 0.62), rgba(16, 21, 28, 0.12) 36%, transparent 70%);
}

.hero-content {
  position: relative;
  z-index: 2;
  max-width: 780px;
  padding: 7rem 0 4.2rem;
}

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.8rem;
  margin-bottom: 1.1rem;
  color: #f5d5a0;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.24em;
  text-transform: uppercase;
}

.eyebrow::before {
  content: "";
  width: 2.2rem;
  height: 1px;
  background: currentColor;
}

h1,
h2,
h3 {
  margin: 0;
  font-family: var(--font-heading);
  font-weight: 600;
  line-height: 0.98;
}

h1 {
  max-width: 860px;
  color: var(--oak-white);
  font-size: clamp(3.2rem, 9vw, 7.2rem);
}

.hero p {
  max-width: 640px;
  margin: 1.4rem 0 0;
  color: rgba(255, 255, 255, 0.82);
  font-size: 1rem;
  line-height: 1.8;
}

.cta-row {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  margin-top: 1.8rem;
}

.hero-fact-grid {
  display: grid;
  gap: 0.85rem;
  margin-top: 2rem;
}

.hero-fact {
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.08);
  padding: 1rem 1.1rem;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

.hero-fact span,
.highlight-card span,
.detail-card span,
.payment-card span,
.amenity-index {
  display: block;
  color: rgba(255, 255, 255, 0.72);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.hero-fact strong {
  display: block;
  margin-top: 0.55rem;
  color: var(--oak-white);
  font-family: var(--font-heading);
  font-size: 1.6rem;
  line-height: 1.05;
}

.details {
  position: relative;
  z-index: 3;
  margin-top: -2.4rem;
}

.details-shell {
  border-radius: var(--oak-radius-xl);
  border: 1px solid rgba(255, 255, 255, 0.42);
  background: rgba(255, 251, 245, 0.9);
  box-shadow: var(--oak-shadow);
  padding: 1rem;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}

.details-grid,
.highlight-grid,
.insight-grid,
.payment-grid,
.amenity-grid,
.trust-grid,
.faq-grid {
  display: grid;
  gap: 1rem;
}

.detail-card,
.highlight-card,
.insight-card,
.payment-card,
.amenity-card,
.trust-card,
.faq-card,
.about-panel,
.location-panel,
.form-panel,
.form-intro,
.thank-you-panel,
.footer-panel,
.gallery {
  border: 1px solid var(--oak-line);
  background: var(--oak-panel);
  box-shadow: var(--oak-shadow-soft);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

.detail-card,
.highlight-card,
.insight-card,
.payment-card,
.amenity-card,
.trust-card,
.faq-card {
  border-radius: var(--oak-radius-lg);
  padding: 1.25rem;
}

.detail-card span,
.highlight-card span,
.amenity-index {
  color: rgba(15, 23, 35, 0.52);
}

.detail-card p,
.insight-card p,
.payment-card p,
.amenity-card p,
.trust-card p,
.faq-card p,
.section-copy,
.footer-panel p,
.thank-you-panel p {
  margin: 0.8rem 0 0;
  color: var(--oak-muted);
  line-height: 1.8;
}

.detail-card p,
.payment-card strong,
.amenity-card strong,
.insight-card strong,
.trust-card strong,
.faq-card strong {
  color: var(--oak-ink);
}

.section {
  padding: 3.5rem 0;
}

.section-kicker {
  max-width: 760px;
  margin-bottom: 1.5rem;
}

.section-title {
  max-width: 760px;
  font-size: clamp(2.4rem, 6vw, 5.4rem);
}

.section-copy {
  max-width: 720px;
  font-size: 1rem;
}

.quick-highlights,
.amenities-section,
.trust-section {
  background: rgba(255, 255, 255, 0.16);
}

.payment-section,
.gallery-section {
  background: linear-gradient(180deg, rgba(15, 23, 35, 0.04), rgba(15, 23, 35, 0.01));
}

.highlight-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.highlight-card {
  min-height: 124px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background:
    linear-gradient(145deg, rgba(185, 139, 79, 0.14), transparent),
    rgba(255, 255, 255, 0.92);
}

.highlight-card strong {
  display: block;
  margin-top: 1rem;
  color: var(--oak-ink);
  font-family: var(--font-heading);
  font-size: clamp(1.42rem, 3vw, 2.1rem);
  line-height: 1.04;
}

.about-panel {
  border-radius: var(--oak-radius-xl);
  padding: 1.5rem;
  background:
    linear-gradient(135deg, rgba(185, 139, 79, 0.12), rgba(255, 255, 255, 0.5)),
    rgba(255, 255, 255, 0.82);
}

.about-copy .section-copy {
  margin-bottom: 0;
}

.insight-card {
  background: rgba(255, 255, 255, 0.9);
}

.insight-card strong,
.trust-card strong,
.faq-card strong,
.amenity-card strong,
.payment-card strong {
  display: block;
  font-family: var(--font-heading);
  font-size: 1.6rem;
  line-height: 1.14;
}

.payment-grid {
  align-items: stretch;
}

.payment-card {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(244, 235, 221, 0.92)),
    rgba(255, 255, 255, 0.9);
}

.payment-card::after {
  content: "";
  position: absolute;
  inset: auto 1.25rem 0.95rem;
  height: 1px;
  background: linear-gradient(90deg, rgba(185, 139, 79, 0.45), transparent);
}

.payment-value {
  color: var(--oak-bronze-deep);
}

.payment-card strong {
  margin-top: 0.8rem;
}

.amenity-card {
  background:
    radial-gradient(circle at top right, rgba(185, 139, 79, 0.1), transparent 7rem),
    rgba(255, 255, 255, 0.9);
}

.amenity-index {
  color: var(--oak-bronze-deep);
}

.glass-card {
  overflow: hidden;
  border-radius: var(--oak-radius-xl);
}

.gallery {
  overflow: hidden;
  border-radius: var(--oak-radius-xl);
  touch-action: pan-y;
}

.gallery-track {
  display: flex;
  width: 100%;
  transition: transform 480ms ease;
  will-change: transform;
}

.gallery-slide {
  flex: 0 0 100%;
  min-width: 0;
}

.gallery-image {
  position: relative;
  min-height: 420px;
  background-position: center;
  background-size: cover;
}

.gallery-image::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(8, 12, 16, 0.76), rgba(8, 12, 16, 0.08) 58%);
}

.gallery-caption {
  position: absolute;
  inset: auto 1.4rem 1.4rem;
  z-index: 2;
}

.gallery-caption span {
  display: block;
  color: #f3d4a1;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

.gallery-caption strong {
  display: block;
  margin-top: 0.6rem;
  color: var(--oak-white);
  font-family: var(--font-heading);
  font-size: 2.1rem;
  line-height: 1.08;
}

.gallery-controls {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-top: 1rem;
}

.gallery-dots,
.gallery-arrows {
  display: flex;
  gap: 0.6rem;
}

.gallery-dot,
.gallery-arrow {
  border: 1px solid var(--oak-line-strong);
  background: rgba(255, 255, 255, 0.6);
  color: var(--oak-ink);
}

.gallery-dot {
  width: 0.7rem;
  height: 0.7rem;
  border-radius: 999px;
  padding: 0;
}

.gallery-dot.is-active {
  background: var(--oak-bronze);
}

.gallery-arrow {
  width: 44px;
  height: 44px;
  border-radius: 999px;
}

.location-panel {
  border-radius: var(--oak-radius-xl);
  padding: 1.45rem;
  display: grid;
  gap: 1.2rem;
  background:
    linear-gradient(145deg, rgba(15, 23, 35, 0.02), rgba(255, 255, 255, 0.52)),
    rgba(255, 255, 255, 0.82);
}

.location-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 0.8rem;
}

.location-list li {
  position: relative;
  border: 1px solid rgba(15, 23, 35, 0.08);
  border-radius: var(--oak-radius-md);
  background: rgba(255, 255, 255, 0.7);
  color: var(--oak-ink-soft);
  padding: 0.9rem 1rem 0.9rem 2.2rem;
}

.location-list li::before {
  content: "";
  position: absolute;
  left: 1rem;
  top: 1.45rem;
  width: 0.42rem;
  height: 0.42rem;
  border-radius: 999px;
  background: var(--oak-bronze);
}

.contact-layout {
  display: grid;
  gap: 1rem;
}

.form-intro,
.form-panel,
.thank-you-panel {
  border-radius: var(--oak-radius-xl);
  padding: 1.25rem;
}

.form-intro {
  background:
    linear-gradient(145deg, rgba(185, 139, 79, 0.14), rgba(255, 255, 255, 0.55)),
    rgba(255, 255, 255, 0.82);
}

.intro-points {
  display: grid;
  gap: 0.7rem;
  margin-top: 1.2rem;
}

.intro-points span {
  border: 1px solid rgba(15, 23, 35, 0.08);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.66);
  padding: 0.72rem 0.95rem;
  color: var(--oak-ink-soft);
  font-size: 0.78rem;
  font-weight: 700;
}

.field-grid {
  display: grid;
  gap: 0.85rem;
}

.field {
  margin-bottom: 0.75rem;
}

.field-full {
  grid-column: 1 / -1;
}

#nameField,
#phoneField {
  grid-column: 1 / -1;
}

.field label {
  display: block;
  margin-bottom: 0.55rem;
  color: rgba(15, 23, 35, 0.62);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.field input,
.field select,
.field textarea {
  width: 100%;
  min-height: 50px;
  border: 1px solid rgba(15, 23, 35, 0.14);
  border-radius: var(--oak-radius-sm);
  background: rgba(255, 255, 255, 0.82);
  color: rgba(15, 23, 35, 0.9);
  padding: 0.85rem 0.95rem;
  outline: none;
  transition: border-color 180ms ease, box-shadow 180ms ease, background 180ms ease;
}

.field textarea {
  min-height: 130px;
  resize: vertical;
}

.field input::placeholder,
.field textarea::placeholder {
  color: rgba(15, 23, 35, 0.42);
}

.field input:focus,
.field select:focus,
.field textarea:focus {
  border-color: rgba(185, 139, 79, 0.66);
  box-shadow: 0 0 0 3px rgba(185, 139, 79, 0.14);
  background: var(--oak-panel-strong);
}

.phone-input-row {
  display: grid;
  gap: 0.65rem;
  align-items: start;
  grid-template-columns: minmax(170px, 0.62fr) minmax(0, 1fr);
}

.country-picker {
  position: relative;
}

.country-picker-trigger {
  width: 100%;
  min-height: 50px;
  border: 1px solid rgba(15, 23, 35, 0.14);
  border-radius: var(--oak-radius-sm);
  background: rgba(255, 255, 255, 0.82);
  color: rgba(15, 23, 35, 0.9);
  padding: 0.85rem 0.95rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
  text-align: left;
  transition: border-color 180ms ease, box-shadow 180ms ease;
}

.country-picker-current {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 0.42rem;
}

.country-picker-flag,
.country-picker-code,
.country-picker-chevron {
  flex: 0 0 auto;
}

.country-picker-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.country-picker-code,
.country-picker-chevron {
  color: rgba(15, 23, 35, 0.54);
}

.country-picker.is-open .country-picker-trigger,
.country-picker-trigger:focus-visible {
  border-color: rgba(185, 139, 79, 0.66);
  box-shadow: 0 0 0 3px rgba(185, 139, 79, 0.14);
  outline: none;
}

.country-picker-panel {
  position: absolute;
  top: calc(100% + 0.42rem);
  left: 0;
  z-index: 20;
  width: min(380px, 92vw);
  border: 1px solid rgba(15, 23, 35, 0.12);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 22px 48px rgba(15, 23, 35, 0.14);
  padding: 0.75rem;
}

.country-picker-search {
  width: 100%;
  min-height: 48px;
  border: 1px solid rgba(15, 23, 35, 0.12);
  border-radius: 14px;
  background: rgba(247, 243, 236, 0.88);
  color: rgba(15, 23, 35, 0.92);
  padding: 0.78rem 0.9rem;
  margin-bottom: 0.65rem;
}

.country-picker-search::placeholder {
  color: rgba(15, 23, 35, 0.45);
}

.country-picker-search:focus {
  border-color: rgba(185, 139, 79, 0.66);
  box-shadow: 0 0 0 3px rgba(185, 139, 79, 0.14);
  outline: none;
}

.country-picker-list {
  display: grid;
  gap: 0.28rem;
  max-height: 260px;
  overflow: auto;
}

.country-picker-option {
  width: 100%;
  border: 1px solid transparent;
  border-radius: 14px;
  background: transparent;
  color: rgba(15, 23, 35, 0.88);
  padding: 0.7rem 0.75rem;
  display: grid;
  align-items: center;
  gap: 0.5rem;
  grid-template-columns: auto minmax(0, 1fr) auto;
  text-align: left;
}

.country-picker-option:hover,
.country-picker-option:focus-visible,
.country-picker-option.is-selected {
  border-color: rgba(185, 139, 79, 0.22);
  background: rgba(185, 139, 79, 0.1);
  outline: none;
}

.country-picker-option-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.country-picker-option-code,
.country-picker-empty {
  color: rgba(15, 23, 35, 0.58);
}

.country-picker-empty {
  margin: 0.55rem 0 0;
  font-size: 0.9rem;
}

.field.has-error input,
.field.has-error select,
.field.has-error textarea,
.field.has-error .country-picker-trigger {
  border-color: rgba(198, 95, 95, 0.76);
  box-shadow: 0 0 0 3px rgba(198, 95, 95, 0.12);
}

.field-error {
  display: none;
  margin-top: 0.45rem;
  color: var(--oak-danger);
  font-size: 0.82rem;
}

.field.has-error .field-error {
  display: block;
}

.disclaimer {
  margin: 0.7rem 0 0;
  color: rgba(15, 23, 35, 0.56);
  font-size: 0.78rem;
  line-height: 1.7;
}

.form-panel .btn {
  width: 100%;
  margin-top: 0.95rem;
}

.form-error,
.form-success {
  display: none;
  margin-top: 1rem;
  border-radius: var(--oak-radius-md);
  padding: 1rem;
}

.form-error {
  border: 1px solid rgba(198, 95, 95, 0.22);
  background: rgba(198, 95, 95, 0.08);
  color: #8e4242;
}

.form-error.is-visible {
  display: block;
}

.form-success {
  border: 1px solid rgba(185, 139, 79, 0.24);
  background: rgba(185, 139, 79, 0.12);
}

.form-success.is-visible {
  display: block;
}

.form-success h3 {
  font-size: 2rem;
}

.hidden-field {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.trust-card,
.faq-card {
  background: rgba(255, 255, 255, 0.9);
}

.permit-note {
  margin: 1rem 0 0;
  color: rgba(15, 23, 35, 0.52);
  font-size: 0.8rem;
  line-height: 1.6;
}

.footer {
  padding: 0 0 5rem;
}

.footer-panel {
  border-radius: var(--oak-radius-xl);
  padding: 1.4rem;
}

.footer-grid {
  display: grid;
  gap: 1.2rem;
}

.footer-grid strong {
  display: block;
  font-family: var(--font-heading);
  font-size: 1.65rem;
}

.footer-links {
  display: grid;
  gap: 0.5rem;
  margin-top: 0.8rem;
}

.footer-links a {
  color: var(--oak-ink-soft);
}

.footer-note {
  margin-top: 1.2rem;
  padding-top: 1rem;
  border-top: 1px solid var(--oak-line);
}

.mobile-contact-bar {
  position: fixed;
  inset: auto 0 0;
  z-index: 44;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
  padding: 0.9rem 1rem calc(0.9rem + env(safe-area-inset-bottom, 0px));
  background: rgba(12, 16, 22, 0.9);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.mobile-contact-bar a {
  min-height: 50px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.8rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.mobile-contact-bar a:first-child {
  border: 1px solid rgba(255, 255, 255, 0.26);
  color: var(--oak-white);
  background: rgba(255, 255, 255, 0.08);
}

.btn-whatsapp {
  border: 1px solid rgba(185, 139, 79, 0.58);
  background: linear-gradient(135deg, #c79a5f, #a6773e);
  color: #fffefb;
}

.thank-you-shell {
  padding-top: 2rem;
}

.thank-you-panel {
  max-width: 760px;
  margin: 0 auto;
  text-align: center;
  background:
    linear-gradient(135deg, rgba(185, 139, 79, 0.14), rgba(255, 255, 255, 0.5)),
    rgba(255, 255, 255, 0.9);
}

.thank-you-panel .eyebrow {
  justify-content: center;
}

.thank-you-panel h1 {
  color: var(--oak-ink);
  font-size: clamp(2.6rem, 8vw, 5.6rem);
}

.thank-you-panel .cta-row {
  align-items: center;
}

@media (min-width: 700px) {
  .hero-fact-grid,
  .details-grid,
  .payment-grid,
  .footer-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .insight-grid,
  .amenity-grid,
  .trust-grid,
  .faq-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .field-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .contact-layout {
    grid-template-columns: 0.95fr 1.05fr;
  }
}

@media (min-width: 1024px) {
  .shell {
    width: min(1220px, calc(100% - 48px));
  }

  .topbar {
    border-bottom-color: rgba(255, 255, 255, 0.1);
  }

  .nav-links {
    display: flex;
    align-items: center;
    gap: 1.2rem;
  }

  .nav-links a {
    color: rgba(255, 255, 255, 0.74);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    transition: color 180ms ease;
  }

  .nav-links a:hover,
  .nav-links a:focus-visible {
    color: var(--oak-white);
    outline: none;
  }

  .nav-actions {
    display: flex;
    align-items: center;
    gap: 0.8rem;
  }

  .mobile-menu-button,
  .mobile-menu,
  .mobile-contact-bar {
    display: none;
  }

  .hero-content {
    padding: 8rem 0 5rem;
  }

  .cta-row {
    flex-direction: row;
    align-items: center;
  }

  .hero-fact-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .details {
    margin-top: -4rem;
  }

  .details-shell {
    padding: 1.25rem;
  }

  .highlight-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .highlight-card {
    min-height: 146px;
  }

  .about-panel {
    padding: 2rem;
  }

  .insight-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .payment-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .amenity-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .gallery-image {
    min-height: 560px;
  }

  .location-panel {
    grid-template-columns: 0.8fr 1.2fr;
    align-items: start;
    padding: 1.8rem;
  }

  .form-intro,
  .form-panel,
  .thank-you-panel,
  .footer-panel {
    padding: 1.7rem;
  }
}

@media (min-width: 1280px) {
  .section {
    padding: 4.5rem 0;
  }

  .hero p {
    font-size: 1.06rem;
  }

  .footer-grid {
    grid-template-columns: 1.2fr 1fr 0.9fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation: none !important;
    transition-duration: 0.01ms !important;
    transition-delay: 0ms !important;
    scroll-behavior: auto !important;
  }
}

/* Stitch high-conversion template standard
   Source reference: stitch_high_conversion_ad_landing_page.zip.
   Keep this block last so new Oaklyn project builds inherit the conversion-focused style. */
:root {
  --stitch-bg: #080808;
  --stitch-ink: #f7f0df;
  --stitch-muted: rgba(247, 240, 223, 0.72);
  --stitch-glass: rgba(255, 255, 255, 0.06);
  --stitch-gold: #c9a84c;
  --stitch-gold-bright: #f0d97a;
  --stitch-line: rgba(201, 168, 76, 0.24);
  --stitch-shadow: 0 32px 90px -48px rgba(201, 168, 76, 0.42);
}

html {
  background: var(--stitch-bg);
}

body {
  background:
    radial-gradient(circle at 18% 12%, rgba(201, 168, 76, 0.16), transparent 34rem),
    radial-gradient(circle at 82% 32%, rgba(201, 168, 76, 0.1), transparent 30rem),
    var(--stitch-bg);
  color: var(--stitch-ink);
}

.site-header,
.header {
  background: rgba(8, 8, 8, 0.74) !important;
  border-bottom: 1px solid var(--stitch-line);
  backdrop-filter: blur(22px);
}

.nav-links a,
.nav-phone,
.brand span {
  color: rgba(247, 240, 223, 0.78) !important;
}

.btn,
button.btn {
  border-radius: 999px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.btn-primary,
.form-panel .btn-primary,
#landingSubmitBtn {
  background: linear-gradient(135deg, var(--stitch-gold), var(--stitch-gold-bright), var(--stitch-gold)) !important;
  border: 1px solid rgba(255, 255, 255, 0.18);
  box-shadow: 0 18px 44px -24px rgba(240, 217, 122, 0.85);
  color: #1a0e00 !important;
}

.btn-ghost {
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  color: var(--stitch-ink) !important;
}

.btn-whatsapp,
.mobile-contact-bar .btn-whatsapp {
  background: #25d366 !important;
  color: #ffffff !important;
}

.hero {
  min-height: 100svh;
  background: #080808;
}

.hero-shade {
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.32), rgba(0, 0, 0, 0.52) 52%, rgba(0, 0, 0, 0.82)) !important;
}

.hero-content {
  max-width: min(1120px, calc(100% - 40px));
  padding-block: clamp(7rem, 14vh, 11rem) clamp(4rem, 9vh, 7rem);
}

.hero h1 {
  color: #ffffff;
  font-size: clamp(4rem, 10vw, 8.7rem);
  line-height: 0.84;
  text-shadow: 0 28px 80px rgba(0, 0, 0, 0.55);
}

.hero p {
  max-width: 760px;
  color: rgba(247, 240, 223, 0.78);
  font-size: clamp(1rem, 2.1vw, 1.35rem);
}

.hero-fact,
.stat-card,
.fact-card,
.detail-card,
.why-card,
.trust-card,
.glass-card,
.form-panel,
.form-intro,
.footer-panel,
.thank-you-panel {
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.035)) !important;
  border: 1px solid var(--stitch-line) !important;
  box-shadow: var(--stitch-shadow);
  backdrop-filter: blur(22px);
}

.section {
  background: transparent;
}

.section-title {
  color: var(--stitch-ink);
  font-size: clamp(2.8rem, 8vw, 7rem);
  line-height: 0.9;
}

.section-copy,
.card p,
.form-panel p,
.footer-panel p,
.thank-you-panel p {
  color: var(--stitch-muted);
}

.gallery {
  overflow: hidden;
  background: rgba(255, 255, 255, 0.04) !important;
  border-color: var(--stitch-line) !important;
}

.gallery-image {
  min-height: min(76vh, 760px);
  background-position: center !important;
  background-size: cover !important;
}

.gallery-photo {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-height: min(76vh, 760px);
  object-fit: cover !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.gallery-caption {
  background: linear-gradient(to top, rgba(0, 0, 0, 0.72), transparent);
}

.gallery-dot.is-active {
  background: var(--stitch-gold) !important;
}

.gallery-arrow {
  background: rgba(8, 8, 8, 0.7) !important;
  border-color: var(--stitch-line) !important;
  color: var(--stitch-ink) !important;
}

.form-panel input,
.form-panel select,
.form-panel textarea {
  background: rgba(255, 255, 255, 0.07) !important;
  border: 1px solid rgba(201, 168, 76, 0.28) !important;
  border-radius: 18px;
  color: var(--stitch-ink) !important;
}

.form-panel input::placeholder,
.form-panel textarea::placeholder {
  color: rgba(247, 240, 223, 0.46);
}

.footer,
footer.section {
  background: #050505 !important;
}

.mobile-contact-bar {
  background: rgba(8, 8, 8, 0.78) !important;
  border: 1px solid var(--stitch-line) !important;
  backdrop-filter: blur(22px);
}

.mobile-contact-bar a {
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: var(--stitch-line) !important;
  color: var(--stitch-ink) !important;
}

.thank-you-shell {
  min-height: 100svh;
  background: radial-gradient(circle at 50% 20%, rgba(201, 168, 76, 0.14), transparent 32rem), #080808;
}

.thank-you-panel {
  color: var(--stitch-ink);
}

.thank-you-panel h1 {
  color: #ffffff;
  font-size: clamp(3.8rem, 10vw, 8rem);
}

@media (max-width: 760px) {
  .hero-content {
    padding-top: 7rem;
    padding-inline: 20px;
  }

  .hero h1 {
    font-size: clamp(3.5rem, 17vw, 5.4rem);
  }

  .hero .cta-row,
  .cta-row {
    flex-direction: column;
    align-items: stretch;
  }

  .hero .btn,
  .cta-row .btn {
    width: 100%;
    justify-content: center;
  }

  .section {
    padding-block: 4.5rem;
  }

  .section-title {
    font-size: clamp(2.6rem, 13vw, 4rem);
  }

  .gallery-image,
  .gallery-photo {
    min-height: min(62vh, 500px);
  }

  .form-panel,
  .form-intro,
  .footer-panel,
  .thank-you-panel {
    border-radius: 22px;
  }
}

.is-rtl .hero-content,
.is-rtl .section-title,
.is-rtl .section-copy,
.is-rtl .form-intro,
.is-rtl .form-panel {
  text-align: right;
}

/* DAMAC-style short paid-traffic layout */
body { background: #faf9f6; color: #1b1c1a; font-family: "Manrope", "Inter", system-ui, sans-serif; }
.hero { min-height: 100svh; }
.hero h1, .section-title, .offer-card h3, .project-card h3, .offer-modal-card h2 { font-family: "Fraunces", "Playfair Display", Georgia, serif; }
.offer-section { background: #1a1c1e; color: #fff; }
.offer-section .section-copy, .offer-section .eyebrow { color: rgba(255,255,255,.68); }
.offer-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1px; margin-top: 38px; border: 1px solid rgba(255,255,255,.14); background: rgba(255,255,255,.14); }
.offer-card { min-height: 320px; padding: 34px; display: flex; flex-direction: column; background: #1a1c1e; }
.offer-card>span { color: #d4af37; font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.offer-card h3 { margin: 24px 0 16px; color: #fff; font-size: clamp(28px,3vw,42px); line-height: 1.02; }
.offer-card p { color: rgba(255,255,255,.68); line-height: 1.7; }
.offer-link, .project-card-link { margin-top: auto; padding: 20px 0 0; border: 0; background: transparent; color: inherit; font: inherit; font-weight: 800; text-align: left; cursor: pointer; }
.offer-link { color: #fff; }
.project-card-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 22px; margin-top: 38px; }
.project-card:first-child { grid-column: 1/-1; }
.project-card-image { position: relative; min-height: 360px; overflow: hidden; border-radius: 18px; background-position: center; background-size: cover; }
.project-card:first-child .project-card-image { min-height: 560px; }
.project-card-image::after { content: ""; position: absolute; inset: 28% 0 0; background: linear-gradient(180deg,transparent,rgba(0,0,0,.82)); }
.project-card-copy { position: absolute; z-index: 1; right: 0; bottom: 0; left: 0; padding: 32px; color: #fff; }
.project-card-copy>span { font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.project-card h3 { margin: 9px 0 12px; font-size: clamp(25px,3vw,40px); }
.project-card-link { color: #fff; }
.contact-section { background: #eeeae3; }
.contact-layout { align-items: center; }
.form-panel { border: 1px solid #e6e3dd; background: rgba(255,255,255,.94); box-shadow: 0 36px 70px rgba(31,29,25,.18),0 8px 20px rgba(31,29,25,.08); transform: perspective(1200px) rotateY(-1deg) translateY(-8px); }
.form-panel .btn-primary, .offer-modal-card .btn-primary { width: 100%; background: #000; color: #fff; }
.offer-modal { position: fixed; z-index: 1200; inset: 0; display: none; place-items: center; padding: 20px; }
.offer-modal.is-open { display: grid; }
.offer-modal-backdrop { position: absolute; inset: 0; background: rgba(11,12,12,.72); backdrop-filter: blur(8px); }
.offer-modal-card { position: relative; z-index: 1; width: min(620px,100%); max-height: calc(100svh - 40px); overflow: auto; padding: 34px; border: 1px solid #e6e3dd; border-radius: 18px; background: #fff; box-shadow: 0 40px 90px rgba(0,0,0,.35); }
.offer-modal-close { position: absolute; top: 16px; right: 16px; width: 40px; height: 40px; border: 1px solid #e6e3dd; border-radius: 50%; background: #fff; font-size: 24px; cursor: pointer; }
.offer-modal-card h2 { margin: 10px 0; font-size: 38px; }
.modal-field { margin-top: 17px; }
.modal-field label { display: block; margin-bottom: 7px; color: #60656a; font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.modal-field input, .modal-field select, .modal-field textarea { width: 100%; padding: 12px 2px; border: 0; border-bottom: 1px solid #cfcac1; border-radius: 0; background: transparent; color: #1b1c1a; font: inherit; }
.modal-phone-grid { display: grid; grid-template-columns: minmax(180px,.8fr) 1.2fr; gap: 16px; }
body.has-open-modal { overflow: hidden; }
body.modal-open { overflow: hidden; }
.highlights-section { background: #faf9f6; }
.geo-summary-section { background:#fff; border-bottom:1px solid #e3ded5; }
.geo-summary-grid { display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(40px,8vw,110px); align-items:start; }
.geo-fact-list { margin:0; border-top:1px solid #d8d2c8; }
.geo-fact-list div { display:grid; grid-template-columns:minmax(120px,.7fr) 1.3fr; gap:24px; padding:18px 0; border-bottom:1px solid #d8d2c8; }
.geo-fact-list dt { color:#777168; font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.geo-fact-list dd { margin:0; font-weight:700; }
.highlights-section .stat-grid { margin-top: 40px; }
.highlights-section .detail-grid { margin-top: 24px; }
.story-section { background: #e9e4da; }
.story-layout,.amenities-layout,.location-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(36px,7vw,96px); align-items:center; }
.story-image,.amenities-image,.location-image { min-height:680px; border-radius:24px; background-position:center; background-size:cover; box-shadow:0 34px 70px rgba(31,29,25,.16); }
.story-copy .why-grid { grid-template-columns:repeat(2,minmax(0,1fr)); margin:28px 0; }
.payment-section { position:relative; overflow:hidden; background:#111315; color:#fff; }
.payment-section::before { content:"20/80"; position:absolute; right:-2vw; bottom:-5vw; color:rgba(255,255,255,.025); font:800 clamp(9rem,28vw,30rem)/.8 Georgia,serif; pointer-events:none; }
.payment-section .section-title { color:#fff; }
.payment-section .section-copy,.payment-section .section-note { color:rgba(255,255,255,.65); }
.payment-section .payment-grid { position:relative; margin-top:44px; }
.payment-cta { position:relative; margin-top:30px; background:#d4af37; color:#111315; }
.payment-section .payment-step { background:rgba(255,255,255,.055); border-color:rgba(212,175,55,.28); }
.amenities-section { background:#f5f2ec; }
.amenities-layout { grid-template-columns:1.1fr .9fr; }
.amenities-image { min-height:760px; }
.amenity-grid { margin-top:36px; }
.location-section { background:#fff; }
.location-image { min-height:620px; }
.location-list { margin:34px 0; }
.trust-section { background:#e9e4da; }
.trust-section .trust-grid { margin-top:38px; }
.faq-card summary { cursor:pointer; color:var(--stax-dark-text); font-family:var(--font-heading); font-size:1.35rem; font-weight:600; list-style-position:outside; }
.faq-card[open] summary { color:#775a19; }
@media(max-width:760px){.offer-grid,.project-card-grid,.modal-phone-grid,.story-layout,.amenities-layout,.location-layout,.geo-summary-grid{grid-template-columns:1fr}.project-card:first-child{grid-column:auto}.project-card:first-child .project-card-image,.project-card-image{min-height:390px}.offer-card{min-height:270px;padding:26px}.form-panel{transform:none}.story-image,.amenities-image,.location-image{min-height:460px}.story-copy .why-grid{grid-template-columns:1fr}.amenities-image{order:-1}.geo-fact-list div{grid-template-columns:1fr;gap:6px}}

/* Stitch Oaklyn Lux design system — source of truth for final visual polish */
:root {
  --stax-onyx:#121414;
  --stax-onyx-raised:#1a1c1c;
  --stax-ivory:#f8f5f0;
  --stax-gold:#c5a059;
  --stax-gold-bright:#e9c176;
  --stax-dark-text:#24231f;
  --stax-light-text:#e8e2d8;
  --stax-dark-muted:#6e6a62;
  --stax-light-muted:#d1c5b4;
  --oak-radius-xl:12px;
  --oak-radius-lg:8px;
  --oak-radius-md:6px;
  --oak-radius-sm:4px;
  --font-heading:"Playfair Display",Georgia,serif;
  --font-body:"Inter",Arial,sans-serif;
}
body { background:var(--stax-onyx); color:var(--stax-dark-text); font-family:var(--font-body); }
.shell { width:min(1440px,calc(100% - clamp(48px,10vw,160px))); }
.section { padding-block:clamp(80px,10vw,128px); }
.topbar { background:rgba(18,20,20,.82); border-bottom:1px solid rgba(255,255,255,.1); backdrop-filter:blur(24px); }
.nav { min-height:80px; }
.nav-links a,.nav-phone { color:rgba(255,255,255,.72); font-size:12px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }
.nav-links a:hover,.nav-links a:focus-visible { color:var(--stax-gold-bright); }
.btn { min-height:52px; border-radius:4px; letter-spacing:.07em; }
.btn-primary,.form-panel .btn-primary,.offer-modal-card .btn-primary { border-color:var(--stax-gold); background:var(--stax-gold) !important; color:#1a1812 !important; box-shadow:none; }
.btn-primary:hover,.btn-primary:focus-visible { border-color:var(--stax-gold-bright); background:var(--stax-gold-bright) !important; box-shadow:0 14px 35px rgba(197,160,89,.2); }
.hero h1,.section-title,.offer-card h3,.project-card h3,.offer-modal-card h2 { font-family:var(--font-heading); letter-spacing:-.025em; }
.hero h1 { max-width:1000px; font-size:clamp(3.4rem,7vw,7.2rem); line-height:.96; }
.hero-shade { background:linear-gradient(90deg,rgba(9,10,10,.88) 0%,rgba(9,10,10,.48) 50%,rgba(9,10,10,.18) 100%),linear-gradient(0deg,rgba(9,10,10,.72),transparent 58%); }
.hero-fact { border-radius:4px !important; background:rgba(18,20,20,.58) !important; border-color:rgba(255,255,255,.12) !important; backdrop-filter:blur(24px); }
.hero-fact strong,.payment-value { color:var(--stax-gold-bright); }
.offer-section,.story-section,.amenities-section,.location-section,.contact-section { background:var(--stax-onyx); color:var(--stax-light-text); }
.geo-summary-section,.highlights-section,.payment-section,.gallery-section,.trust-section,.faq-section { background:var(--stax-ivory); color:var(--stax-dark-text); }
.geo-summary-section .section-title,.highlights-section .section-title,.payment-section .section-title,.gallery-section .section-title,.trust-section .section-title,.faq-section .section-title { color:var(--stax-dark-text); }
.geo-summary-section .section-copy,.highlights-section .section-copy,.payment-section .section-copy,.gallery-section .section-copy,.trust-section .section-copy,.faq-section .section-copy { color:var(--stax-dark-muted); }
.offer-section .section-title,.story-section .section-title,.amenities-section .section-title,.location-section .section-title,.contact-section .section-title { color:var(--stax-light-text); }
.offer-section .section-copy,.story-section .section-copy,.amenities-section .section-copy,.location-section .section-copy,.contact-section .section-copy { color:var(--stax-light-muted); }
.payment-section .section-title { color:var(--stax-dark-text); }
.payment-section .section-copy,.payment-section .section-note { color:var(--stax-dark-muted); }
.offer-grid { gap:24px; border:0; background:transparent; }
.offer-card { border:1px solid rgba(255,255,255,.1); border-radius:8px; background:rgba(255,255,255,.03); }
.offer-card>span,.eyebrow { color:var(--stax-gold); }
.offer-link { color:var(--stax-gold-bright); }
.detail-card,.highlight-card,.insight-card,.payment-card,.amenity-card,.trust-card,.faq-card { border-radius:8px; box-shadow:none; }
.highlight-card,.detail-card,.payment-card,.trust-card,.faq-card { border-color:rgba(36,35,31,.12) !important; background:rgba(255,255,255,.52) !important; }
.story-section .insight-card,.amenities-section .amenity-card { border-color:rgba(255,255,255,.1) !important; background:rgba(255,255,255,.03) !important; }
.story-section .insight-card strong,.amenities-section .amenity-card strong { color:var(--stax-light-text); }
.story-section .insight-card p,.amenities-section .amenity-card p { color:var(--stax-light-muted); }
.payment-section::before { color:rgba(36,35,31,.035); }
.payment-card::after { background:linear-gradient(90deg,var(--stax-gold),transparent); }
.project-card-image,.story-image,.amenities-image,.location-image { border-radius:8px; }
.project-card-image { border:1px solid rgba(36,35,31,.12); }
.contact-layout { align-items:start; }
.form-intro,.form-panel { border-radius:8px !important; border:1px solid rgba(255,255,255,.1) !important; background:rgba(255,255,255,.035) !important; box-shadow:none !important; transform:none; backdrop-filter:blur(24px); }
.form-panel input,.form-panel select,.form-panel textarea { border:0 !important; border-bottom:1px solid rgba(255,255,255,.22) !important; border-radius:0 !important; background:transparent !important; color:var(--stax-light-text) !important; }
.form-panel input:focus,.form-panel select:focus,.form-panel textarea:focus { border-bottom-color:var(--stax-gold) !important; outline:none; }
.form-panel label,.form-intro .intro-points,.form-panel .disclaimer { color:var(--stax-light-muted); }
.offer-modal-card { border-radius:8px; background:var(--stax-ivory); }
.mobile-contact-bar { border-radius:8px; }
@media(max-width:760px){.shell{width:min(100% - 48px,1440px)}.section{padding-block:64px}.hero h1{font-size:clamp(2.8rem,13vw,4.2rem)}.offer-grid{gap:12px}.topbar{background:rgba(18,20,20,.94)}}

/* DAMAC editorial paid-traffic system */
:root {
  --damac-page:#faf9f6;
  --damac-surface:#ffffff;
  --damac-ink:#1b1c1a;
  --damac-muted:#60656a;
  --damac-dark:#1a1c1e;
  --damac-gold:#d4af37;
  --damac-line:#e6e3dd;
  --font-heading:"Playfair Display",Georgia,serif;
  --font-body:"Manrope",Arial,sans-serif;
}
body { background:var(--damac-page); color:var(--damac-ink); font-family:var(--font-body); }
.shell { width:min(1240px,calc(100% - 48px)); }
.section { padding-block:96px; }
.topbar { background:rgba(255,255,255,.12); border-bottom:1px solid rgba(255,255,255,.22); backdrop-filter:blur(20px); }
.nav-links a,.nav-phone { color:rgba(255,255,255,.9); }
.btn { border-radius:8px; }
.btn-primary,.form-panel .btn-primary,.offer-modal-card .btn-primary { border-color:#000; background:#000 !important; color:#fff !important; box-shadow:none; }
.btn-primary:hover,.btn-primary:focus-visible { border-color:#242424; background:#242424 !important; box-shadow:0 12px 30px rgba(0,0,0,.16); }
.hero h1 { max-width:900px; font-size:72px; line-height:1; }
.hero p { font-size:18px; }
.hero-shade { background:linear-gradient(90deg,rgba(0,0,0,.76),rgba(0,0,0,.18) 72%),linear-gradient(0deg,rgba(0,0,0,.55),transparent 55%); }
.hero-fact { border-radius:12px !important; background:rgba(255,255,255,.1) !important; border-color:rgba(255,255,255,.2) !important; }
.hero-fact strong { color:#fff; }
.geo-summary-section,.gallery-section,.faq-section { background:var(--damac-page); color:var(--damac-ink); }
.geo-summary-section .section-title,.gallery-section .section-title,.faq-section .section-title { color:var(--damac-ink); font-size:44px; }
.geo-summary-section .section-copy,.gallery-section .section-copy,.faq-section .section-copy { color:var(--damac-muted); }
.offer-section { background:var(--damac-dark); color:#fff; }
.offer-section .section-title { color:#fff; font-size:44px; }
.offer-grid { gap:1px; border:1px solid rgba(255,255,255,.14); background:rgba(255,255,255,.14); }
.offer-card { min-height:300px; border:0; border-radius:0; background:var(--damac-dark); }
.offer-card>span { color:var(--damac-gold); }
.offer-link { color:#fff; }
.project-card-image { border:0; border-radius:18px; }
.project-card h3 { font-size:32px; }
.contact-section { background:#eeeae3; color:var(--damac-ink); }
.contact-section .section-title { color:var(--damac-ink); font-size:44px; }
.contact-section .section-copy { color:var(--damac-muted); }
.form-intro { border:0 !important; background:transparent !important; color:var(--damac-ink); backdrop-filter:none; }
.form-panel { border:1px solid var(--damac-line) !important; border-radius:18px !important; background:rgba(255,255,255,.96) !important; box-shadow:0 36px 70px rgba(31,29,25,.18),0 8px 20px rgba(31,29,25,.08) !important; transform:perspective(1200px) rotateY(-1deg) translateY(-8px); }
.form-panel input,.form-panel select,.form-panel textarea { border:0 !important; border-bottom:1px solid #cfcac1 !important; background:transparent !important; color:var(--damac-ink) !important; }
.form-panel input:focus,.form-panel select:focus,.form-panel textarea:focus { border-bottom-color:#000 !important; }
.form-panel label,.form-intro .intro-points,.form-panel .disclaimer { color:var(--damac-muted); }
.faq-card { border-color:var(--damac-line) !important; border-radius:12px; background:#fff !important; }
.offer-modal-card { border-radius:18px; background:#fff; }
@media(max-width:760px){.shell{width:calc(100% - 32px)}.section{padding-block:64px}.hero h1{font-size:44px;line-height:1.04}.hero p{font-size:16px}.section-title,.offer-section .section-title,.geo-summary-section .section-title,.gallery-section .section-title,.faq-section .section-title,.contact-section .section-title{font-size:36px}.project-card h3{font-size:26px}.form-panel{transform:none}.offer-card{min-height:250px}.topbar{background:rgba(10,10,10,.5)}}

/* Similar-project carousel and detail modal */
.project-carousel { position:relative; margin-top:38px; }
.project-carousel-controls { display:flex; justify-content:flex-end; gap:10px; margin-bottom:18px; }
.project-carousel-controls button { width:48px; height:48px; border:1px solid var(--damac-line); border-radius:50%; background:#fff; color:var(--damac-ink); font-size:20px; cursor:pointer; transition:background .2s,color .2s,border-color .2s; }
.project-carousel-controls button:hover,.project-carousel-controls button:focus-visible { border-color:#000; background:#000; color:#fff; outline:none; }
.project-carousel-viewport { overflow-x:auto; scrollbar-width:none; scroll-snap-type:x mandatory; overscroll-behavior-inline:contain; }
.project-carousel-viewport::-webkit-scrollbar { display:none; }
.project-carousel-track { display:grid; grid-auto-flow:column; grid-auto-columns:calc((100% - 40px)/3); gap:20px; }
.project-carousel .project-card { min-width:0; padding:0; border:0; background:transparent; color:inherit; text-align:left; scroll-snap-align:start; }
.project-carousel .project-card:first-child { grid-column:auto; }
.project-carousel .project-card-image,.project-carousel .project-card:first-child .project-card-image { min-height:430px; }
.project-carousel .project-card:focus-visible { outline:2px solid #000; outline-offset:5px; border-radius:18px; }
.project-detail-modal { position:fixed; z-index:1190; inset:0; display:none; place-items:center; padding:20px; }
.project-detail-modal.is-open { display:grid; }
.project-detail-backdrop { position:absolute; inset:0; background:rgba(11,12,12,.76); backdrop-filter:blur(8px); }
.project-detail-card { position:relative; z-index:1; display:grid; grid-template-columns:1.05fr .95fr; width:min(980px,100%); max-height:calc(100svh - 40px); overflow:auto; border:1px solid var(--damac-line); border-radius:18px; background:#fff; box-shadow:0 40px 90px rgba(0,0,0,.35); }
.project-detail-card>img { width:100%; height:100%; min-height:620px; object-fit:cover; }
.project-detail-copy { display:flex; flex-direction:column; justify-content:center; padding:clamp(32px,5vw,64px); }
.project-detail-copy h2 { margin:10px 0 28px; color:var(--damac-ink); font:600 44px/1.05 var(--font-heading); }
.project-detail-copy>p { color:var(--damac-muted); line-height:1.7; }
.project-detail-facts { border-top:1px solid var(--damac-line); }
.project-detail-facts>div { display:grid; grid-template-columns:1fr 1.2fr; gap:18px; padding:15px 0; border-bottom:1px solid var(--damac-line); }
.project-detail-facts span { color:var(--damac-muted); font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.project-detail-facts strong { color:var(--damac-ink); }
.project-availability-panel { margin-top:24px; padding:20px; border:1px solid #d8d2c8; border-radius:12px; background:#faf9f6; }
.project-availability-heading { display:flex; justify-content:space-between; gap:20px; align-items:flex-start; margin-bottom:14px; }
.project-availability-heading span { display:block; color:var(--damac-muted); font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.project-availability-heading strong { display:block; margin-top:4px; color:#1b6b45; font-size:20px; }
.project-availability-heading small { max-width:190px; color:var(--damac-muted); text-align:right; }
[data-project-detail-units]>div,[data-project-detail-facts-list]>div { padding:10px 0; border-top:1px solid var(--damac-line); color:var(--damac-ink); font-size:13px; line-height:1.45; }
.project-more-details { margin-top:18px; border-top:1px solid var(--damac-line); border-bottom:1px solid var(--damac-line); padding:16px 0; }
.project-more-details summary { cursor:pointer; color:var(--damac-ink); font-weight:800; }
.project-more-details h3 { margin:20px 0 10px; font:600 22px/1.2 var(--font-heading); }
.project-amenity-chips { display:flex; flex-wrap:wrap; gap:8px; }
.project-amenity-chips>div { padding:7px 10px; border:1px solid var(--damac-line); border-radius:999px; color:var(--damac-muted); font-size:12px; }
.project-detail-copy .btn { width:100%; margin-top:20px; }
.project-detail-close { position:absolute; z-index:2; top:16px; right:16px; width:42px; height:42px; border:1px solid var(--damac-line); border-radius:50%; background:#fff; color:#000; font-size:24px; cursor:pointer; }
@media(max-width:900px){.project-carousel-track{grid-auto-columns:calc((100% - 20px)/2)}.project-detail-card{grid-template-columns:1fr}.project-detail-card>img{min-height:300px;max-height:38vh}.project-detail-copy h2{font-size:36px}}
@media(max-width:600px){.project-carousel-track{grid-auto-columns:88%}.project-carousel .project-card-image,.project-carousel .project-card:first-child .project-card-image{min-height:390px}.project-detail-card>img{min-height:230px}.project-detail-copy{padding:28px 22px}.project-detail-copy h2{font-size:32px;margin-bottom:20px}.project-detail-facts>div{grid-template-columns:1fr}.project-carousel-controls button{width:44px;height:44px}.project-availability-heading{display:block}.project-availability-heading small{display:block;margin-top:8px;text-align:left}}

/* STAX architectural editorial redesign */
:root {
  --stax-paper:#f1eee7;
  --stax-paper-bright:#fbfaf7;
  --stax-ink:#121311;
  --stax-graphite:#282a27;
  --stax-stone:#a68d72;
  --stax-rule:#d6d0c5;
  --stax-muted:#686a65;
}
body { background:var(--stax-paper); color:var(--stax-ink); }
.shell { width:min(1320px,calc(100% - 80px)); }
.section { padding-block:120px; }
.topbar { position:fixed; width:100%; background:linear-gradient(180deg,rgba(8,9,8,.66),transparent); border:0; backdrop-filter:none; }
.nav { min-height:96px; border-bottom:1px solid rgba(255,255,255,.24); }
.brand img { width:152px; }
.nav-links { gap:30px; }
.nav-links a,.nav-phone { letter-spacing:.16em; }
.nav-actions .btn { min-height:46px; }
.hero { min-height:100svh; align-items:flex-end; background:#111; }
.hero-bg { filter:saturate(.78) contrast(1.04); transform:scale(1.01); }
.hero-shade { background:linear-gradient(90deg,rgba(7,8,7,.76) 0%,rgba(7,8,7,.22) 64%,rgba(7,8,7,.08)),linear-gradient(0deg,rgba(7,8,7,.78) 0%,transparent 64%); }
.hero-content { position:relative; padding:190px 0 72px; }
.hero-content::after { content:"STAX"; position:absolute; z-index:-1; right:-24px; bottom:-44px; color:rgba(255,255,255,.055); font:600 220px/.8 var(--font-heading); letter-spacing:-.07em; pointer-events:none; }
.hero-status { display:flex; flex-wrap:wrap; gap:0; width:max-content; margin-bottom:28px; border:1px solid rgba(255,255,255,.32); }
.hero-status span { padding:9px 14px; border-right:1px solid rgba(255,255,255,.24); color:#fff; font-size:10px; font-weight:800; letter-spacing:.15em; text-transform:uppercase; }
.hero-status span:last-child { border-right:0; }
.hero .eyebrow { color:#dfd3c5; }
.hero h1 { max-width:820px; margin-top:16px; font-size:88px; font-weight:500; letter-spacing:-.045em; }
.hero p { max-width:620px; margin-top:24px; color:rgba(255,255,255,.76); }
.hero .cta-row { margin-top:34px; }
.hero .btn { min-width:220px; }
.hero-fact-grid { grid-template-columns:repeat(3,minmax(0,1fr)); width:min(820px,100%); margin-top:54px; gap:0; border-top:1px solid rgba(255,255,255,.3); border-bottom:1px solid rgba(255,255,255,.3); }
.hero-fact { min-height:110px; border:0 !important; border-right:1px solid rgba(255,255,255,.22) !important; border-radius:0 !important; background:transparent !important; padding:22px 24px; backdrop-filter:none; }
.hero-fact:last-child { border-right:0 !important; }
.hero-fact strong { font-size:24px; font-weight:500; }
.offer-section { position:relative; background:var(--stax-ink); }
.offer-section::before { content:"01"; position:absolute; top:112px; right:5vw; color:rgba(255,255,255,.1); font:500 72px/1 var(--font-heading); }
.section-kicker { max-width:680px; margin-bottom:50px; }
.section-title,.offer-section .section-title,.geo-summary-section .section-title,.gallery-section .section-title,.faq-section .section-title,.contact-section .section-title { max-width:800px; font-size:54px; font-weight:500; line-height:1.05; letter-spacing:-.035em; }
.offer-grid { grid-template-columns:repeat(4,minmax(0,1fr)); margin-top:0; }
.offer-card { min-height:360px; padding:42px 36px; }
.offer-card h3 { margin-top:auto; font-size:34px; font-weight:500; }
.offer-card p { min-height:54px; }
.offer-link { margin-top:26px; border-top:1px solid rgba(255,255,255,.2); padding-top:22px; }
.geo-summary-section { background:var(--stax-paper-bright); }
.geo-summary-grid { grid-template-columns:.72fr 1.28fr; }
.geo-fact-list { border-color:var(--stax-rule); }
.geo-fact-list div { padding:22px 0; border-color:var(--stax-rule); }
.geo-fact-list dd { font:500 21px/1.35 var(--font-heading); }
.gallery-section { overflow:hidden; background:var(--stax-paper); }
.project-carousel { margin-top:0; }
.project-carousel-controls { position:absolute; z-index:3; right:0; top:-92px; }
.project-carousel-controls button { border-radius:0; background:transparent; }
.project-carousel-track { grid-auto-columns:calc((100% - 28px)/2.15); gap:28px; }
.project-carousel .project-card-image,.project-carousel .project-card:first-child .project-card-image { min-height:520px; border-radius:2px; filter:saturate(.8); transition:filter .3s ease,transform .35s ease; }
.project-card-media { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.project-carousel .project-card:hover .project-card-image { filter:saturate(1); transform:translateY(-4px); }
.project-card-copy { padding:36px; }
.project-card-copy h3 { font-size:38px; font-weight:500; }
.carousel-progress { width:calc(100% - 120px); height:2px; margin:0 0 24px; background:var(--stax-rule); transform-origin:left; }
.carousel-progress span { display:block; width:100%; height:100%; background:var(--stax-ink); transform:scaleX(.12); transform-origin:left; transition:transform .18s ease-out; }
.stax-photo-strip-heading { display:flex; align-items:end; justify-content:space-between; gap:24px; margin:58px 0 18px; padding-top:24px; border-top:1px solid var(--stax-rule); }
.stax-photo-strip-heading span { font:500 22px/1.2 var(--font-heading); }
.stax-photo-strip-heading small { color:var(--stax-muted); font-size:12px; letter-spacing:.04em; }
.stax-photo-strip { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; margin-top:58px; padding-top:24px; border-top:1px solid var(--stax-rule); }
.stax-photo-thumb:nth-child(1),.stax-photo-thumb:nth-child(4),.stax-photo-thumb:nth-child(9) { grid-column:span 2; }
.stax-photo-thumb { position:relative; min-width:0; padding:0; overflow:hidden; border:0; background:#161715; color:#fff; cursor:pointer; text-align:left; }
.stax-photo-thumb img { display:block; width:100%; aspect-ratio:1.35; object-fit:cover; opacity:.82; filter:saturate(.78); transition:transform .55s cubic-bezier(.2,.72,.2,1),filter .35s ease,opacity .35s ease; }
.stax-photo-thumb span { position:absolute; inset:auto 12px 12px; display:flex; align-items:center; gap:8px; font-size:11px; font-weight:800; letter-spacing:.09em; text-transform:uppercase; }
.stax-photo-thumb small { color:#d9c4ad; font-size:9px; }
.stax-photo-thumb:hover img,.stax-photo-thumb:focus-visible img { opacity:1; filter:saturate(1); transform:scale(1.055); }
.stax-photo-thumb:focus-visible { outline:2px solid var(--stax-stone); outline-offset:3px; }
.stax-map-panel { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(280px,.5fr); margin-top:58px; padding-top:24px; border-top:1px solid var(--stax-rule); }
.stax-map-frame { min-height:420px; background:var(--aura-surface-high,#e9e8e5); }
.stax-map-frame iframe { display:block; width:100%; height:100%; min-height:420px; border:0; background:#e9e8e5; }
.stax-map-copy { display:flex; flex-direction:column; align-items:flex-start; justify-content:center; padding:44px; border:1px solid var(--stax-rule); border-left:0; background:#fff; }
.stax-map-copy h3 { margin:12px 0 16px; font:600 32px/40px var(--font-heading); }
.stax-map-copy p { margin:0 0 28px; color:var(--stax-muted); font-size:15px; line-height:24px; }
.stax-map-copy .btn { width:100%; }
.contact-section { position:relative; background:#ded8ce; }
.contact-section::before { content:"ENQUIRE"; position:absolute; right:2vw; top:24px; color:rgba(18,19,17,.045); font:600 150px/1 var(--font-heading); letter-spacing:-.04em; }
.contact-layout { grid-template-columns:.82fr 1.18fr; gap:90px; }
.form-intro { position:sticky; top:130px; padding:0 !important; }
.form-panel { padding:54px !important; border-radius:2px !important; box-shadow:18px 24px 0 rgba(18,19,17,.08) !important; transform:none; }
.field-grid { gap:28px 24px; }
.form-panel input,.form-panel select,.form-panel textarea { padding:14px 0 !important; }
.form-panel .btn-primary { min-height:58px; margin-top:10px; }
.faq-section { background:var(--stax-paper-bright); }
.faq-grid { grid-template-columns:1fr 1fr; gap:16px; }
.faq-card { border-radius:2px; padding:28px; }
.footer { background:var(--stax-ink) !important; }
.footer-panel { border-radius:0 !important; border:0 !important; box-shadow:none !important; background:transparent !important; }
.project-detail-card,.offer-modal-card { border-radius:2px; }
.project-detail-copy h2 { font-weight:500; }
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}.hero-bg{transform:none}.project-carousel .project-card:hover .project-card-image{transform:none}}
@media(max-width:980px){.shell{width:calc(100% - 48px)}.section{padding-block:88px}.topbar{background:rgba(8,9,8,.76);backdrop-filter:blur(16px)}.nav{min-height:76px}.hero-content{padding-top:150px}.hero h1{font-size:68px}.hero-content::after{font-size:150px}.offer-grid{grid-template-columns:1fr}.offer-card{min-height:250px}.project-carousel-track{grid-auto-columns:72%}.stax-photo-strip{grid-template-columns:repeat(3,minmax(0,1fr))}.stax-photo-thumb:nth-child(1),.stax-photo-thumb:nth-child(4),.stax-photo-thumb:nth-child(9){grid-column:span 1}.contact-layout{grid-template-columns:1fr;gap:54px}.form-intro{position:static}.faq-grid{grid-template-columns:1fr}}
@media(max-width:600px){.shell{width:calc(100% - 32px)}.section{padding-block:72px}.hero-content{padding:128px 0 40px}.hero-status{margin-bottom:20px}.hero h1{font-size:52px}.hero-content::after{right:-10px;bottom:-18px;font-size:100px}.hero-fact-grid{grid-template-columns:1fr;margin-top:34px}.hero-fact{min-height:auto;border-right:0!important;border-bottom:1px solid rgba(255,255,255,.2)!important;padding:14px 0}.hero-fact:last-child{border-bottom:0!important}.section-title,.offer-section .section-title,.geo-summary-section .section-title,.gallery-section .section-title,.faq-section .section-title,.contact-section .section-title{font-size:40px}.offer-section::before{top:66px}.geo-summary-grid{grid-template-columns:1fr}.project-carousel-controls{position:static;margin-bottom:16px}.carousel-progress{width:100%}.project-carousel-track{grid-auto-columns:90%;gap:16px}.project-carousel .project-card-image,.project-carousel .project-card:first-child .project-card-image{min-height:440px}.stax-photo-strip-heading{align-items:flex-start;flex-direction:column;gap:5px;margin-top:42px}.stax-photo-strip{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px}.stax-photo-thumb{flex:0 0 58%;scroll-snap-align:start}.stax-photo-thumb img{aspect-ratio:1.25}.form-panel{padding:28px 22px!important;box-shadow:10px 12px 0 rgba(18,19,17,.08)!important}.contact-section::before{font-size:74px}.faq-card{padding:22px}}

/* Viewport-triggered architectural motion */
@keyframes heroImageArrival { from { transform:scale(1.08); } to { transform:scale(1.01); } }
@keyframes heroTextArrival { from { opacity:0; transform:translateY(26px); } to { opacity:1; transform:translateY(0); } }
@keyframes heroRuleArrival { from { opacity:0; transform:scaleX(.4); } to { opacity:1; transform:scaleX(1); } }
@keyframes modalArrival { from { opacity:0; transform:translateY(22px) scale(.985); } to { opacity:1; transform:translateY(0) scale(1); } }
.motion-ready .hero-bg.is-active { animation:heroImageArrival 1.6s cubic-bezier(.2,.72,.2,1) both; }
.motion-ready .hero-status { animation:heroTextArrival .65s .12s cubic-bezier(.2,.72,.2,1) both; }
.motion-ready .hero>.hero-content>.eyebrow { animation:heroTextArrival .7s .2s cubic-bezier(.2,.72,.2,1) both; }
.motion-ready .hero h1 { animation:heroTextArrival .85s .28s cubic-bezier(.2,.72,.2,1) both; }
.motion-ready .hero-content>p { animation:heroTextArrival .75s .4s cubic-bezier(.2,.72,.2,1) both; }
.motion-ready .hero .cta-row { animation:heroTextArrival .7s .5s cubic-bezier(.2,.72,.2,1) both; }
.motion-ready .hero-fact-grid { transform-origin:left; animation:heroRuleArrival .85s .58s cubic-bezier(.2,.72,.2,1) both; }
.motion-ready .section-motion { position:relative; overflow:clip; }
.motion-ready .section-motion::after { content:""; position:absolute; z-index:4; top:0; left:0; width:100%; height:3px; background:var(--stax-stone); pointer-events:none; transform:scaleX(0); transform-origin:left; transition:transform 1.05s .12s cubic-bezier(.2,.72,.2,1); }
.motion-ready .section-motion > .shell { opacity:0; transition:opacity .85s cubic-bezier(.2,.72,.2,1),transform 1s cubic-bezier(.2,.72,.2,1); will-change:opacity,transform; }
.motion-ready .section-motion-left > .shell { transform:translate3d(-44px,52px,0) scale(.985); }
.motion-ready .section-motion-right > .shell { transform:translate3d(44px,52px,0) scale(.985); }
.motion-ready .section-motion.section-visible > .shell { opacity:1; transform:translate3d(0,0,0) scale(1); }
.motion-ready .section-motion.section-visible::after { transform:scaleX(1); }
.motion-ready .motion-reveal { opacity:0; transform:translateY(30px); transition:opacity .72s cubic-bezier(.2,.72,.2,1) var(--reveal-delay,0ms),transform .72s cubic-bezier(.2,.72,.2,1) var(--reveal-delay,0ms); }
.motion-ready .motion-reveal.is-revealed { opacity:1; transform:translateY(0); }
.motion-ready .offer-card.motion-reveal { transform:translateY(24px) scale(.985); }
.motion-ready .offer-card.motion-reveal.is-revealed { transform:translateY(0) scale(1); }
.motion-ready .project-detail-modal.is-open .project-detail-card,.motion-ready .offer-modal.is-open .offer-modal-card { animation:modalArrival .42s cubic-bezier(.2,.72,.2,1) both; }
.motion-ready .project-detail-modal.is-open .project-detail-backdrop,.motion-ready .offer-modal.is-open .offer-modal-backdrop { animation:heroTextArrival .3s ease-out both; }
.motion-ready .project-card-image { transition:filter .35s ease,transform .5s cubic-bezier(.2,.72,.2,1); }
.motion-ready .btn,.motion-ready .offer-link,.motion-ready .project-carousel-controls button { transition:transform .22s ease,background-color .22s ease,color .22s ease,border-color .22s ease,box-shadow .22s ease; }
.motion-ready .btn:active,.motion-ready .project-carousel-controls button:active { transform:translateY(1px) scale(.985); }
@media(max-width:600px){.motion-ready .section-motion-left > .shell,.motion-ready .section-motion-right > .shell{transform:translate3d(0,38px,0) scale(.99)}}
@media(prefers-reduced-motion:reduce){.motion-ready .section-motion > .shell,.motion-ready .section-motion.section-visible > .shell{opacity:1;transform:none;transition:none}.motion-ready .section-motion::after{display:none}.motion-ready .motion-reveal,.motion-ready .motion-reveal.is-revealed{opacity:1;transform:none;transition:none}.motion-ready .hero-bg.is-active,.motion-ready .hero-status,.motion-ready .hero>.hero-content>.eyebrow,.motion-ready .hero h1,.motion-ready .hero-content>p,.motion-ready .hero .cta-row,.motion-ready .hero-fact-grid,.motion-ready .project-detail-modal.is-open .project-detail-card,.motion-ready .offer-modal.is-open .offer-modal-card{animation:none}}

/* Aura of Opulence design system */
:root {
  --aura-surface:#faf9f6;
  --aura-surface-low:#f4f3f1;
  --aura-surface-high:#e9e8e5;
  --aura-ink:#1b1c1a;
  --aura-muted:#60656a;
  --aura-outline:#c6c7c1;
  --aura-gold:#d4af37;
  --stax-paper:var(--aura-surface);
  --stax-paper-bright:#fff;
  --stax-ink:var(--aura-ink);
  --stax-graphite:#2f312f;
  --stax-stone:var(--aura-gold);
  --stax-rule:var(--aura-outline);
  --stax-muted:var(--aura-muted);
  --damac-page:var(--aura-surface);
  --damac-paper:#fff;
  --damac-ink:var(--aura-ink);
  --damac-muted:var(--aura-muted);
  --damac-line:var(--aura-outline);
  --font-heading:"Playfair Display",Georgia,serif;
  --font-body:"Manrope",Arial,sans-serif;
}
body { background:var(--aura-surface); color:var(--aura-ink); font-family:var(--font-body); }
.shell { width:min(1440px,calc(100% - 160px)); }
.section { padding-block:120px; }
.topbar { background:linear-gradient(180deg,rgba(0,0,0,.58),transparent); border-bottom:1px solid transparent; transition:background-color .28s ease,border-color .28s ease,backdrop-filter .28s ease; }
.topbar.is-scrolled { background:rgba(27,28,26,.96); border-bottom-color:rgba(255,255,255,.14); backdrop-filter:blur(18px); }
.nav { min-height:88px; }
.nav-links a { position:relative; }
.nav-links a::after { content:""; position:absolute; right:0; bottom:-9px; left:0; height:1px; background:var(--aura-gold); transform:scaleX(0); transform-origin:right; transition:transform .25s ease; }
.nav-links a:hover::after,.nav-links a:focus-visible::after { transform:scaleX(1); transform-origin:left; }
.mobile-menu-button,.btn,.nav-actions .btn,.project-carousel-controls button,.project-card-image,.offer-card,.form-panel,.faq-card,.project-detail-card,.offer-modal-card,.project-detail-close,.project-availability-panel,.project-amenity-chips>div { border-radius:0 !important; }
.btn { min-height:52px; border-radius:0; }
.btn-primary,.form-panel .btn-primary,.offer-modal-card .btn-primary { border-color:var(--aura-ink); background:var(--aura-ink) !important; color:#fff !important; box-shadow:none !important; }
.btn-primary:hover,.btn-primary:focus-visible { border-color:#000; background:#000 !important; box-shadow:0 10px 40px rgba(0,0,0,.08) !important; }
.btn-ghost { border-color:rgba(255,255,255,.72); background:transparent; }
.eyebrow { color:var(--aura-gold); font:700 12px/16px var(--font-body); letter-spacing:.1em; }
.hero h1 { max-width:900px; font-size:clamp(40px,5vw,64px); font-weight:700; line-height:1.125; letter-spacing:-.02em; }
.hero p { max-width:680px; font-size:18px; line-height:28px; }
.hero-status { border-color:rgba(255,255,255,.52); }
.hero-status span { font:700 12px/16px var(--font-body); letter-spacing:.1em; }
.hero-fact strong { font-family:var(--font-heading); font-size:26px; font-weight:600; }
.section-title,.offer-section .section-title,.geo-summary-section .section-title,.gallery-section .section-title,.faq-section .section-title,.contact-section .section-title { max-width:880px; font-size:clamp(38px,4vw,48px); font-weight:600; line-height:1.16; letter-spacing:-.02em; }
.section-copy { color:var(--aura-muted); font-size:16px; line-height:24px; }
.offer-section { background:var(--aura-ink); }
.offer-card { min-height:330px; border-color:rgba(255,255,255,.18); background:rgba(255,255,255,.035); }
.offer-card h3 { font-size:32px; font-weight:600; line-height:40px; }
.offer-card:hover { border-color:var(--aura-gold); box-shadow:0 10px 40px rgba(0,0,0,.04); }
.geo-summary-section,.faq-section { background:#fff; }
.gallery-section { background:var(--aura-surface); }
.project-carousel .project-card-image,.project-carousel .project-card:first-child .project-card-image { border-radius:0; }
.project-card-copy h3 { font-size:32px; font-weight:600; line-height:40px; }
.project-card-copy>span { font-size:12px; letter-spacing:.1em; }
.stax-photo-thumb { border:1px solid transparent; }
.stax-photo-thumb:hover,.stax-photo-thumb:focus-visible { border-color:var(--aura-gold); }
.stax-photo-strip-heading { border-color:var(--aura-outline); }
.stax-photo-strip-heading span { font-size:24px; line-height:36px; }
.contact-section { background:var(--aura-surface-high); }
.form-panel { border:1px solid var(--aura-outline) !important; background:#fff !important; box-shadow:0 10px 40px rgba(0,0,0,.04) !important; }
.form-panel input,.form-panel select,.form-panel textarea { border-bottom-color:var(--aura-muted) !important; }
.form-panel input:focus,.form-panel select:focus,.form-panel textarea:focus { border-bottom-color:var(--aura-gold) !important; box-shadow:none !important; }
.field label { color:var(--aura-ink); font-size:12px; line-height:16px; letter-spacing:.1em; }
.faq-card { border-color:var(--aura-outline) !important; box-shadow:none; }
.faq-card:hover { border-color:var(--aura-gold) !important; }
.project-detail-card,.offer-modal-card { border-color:var(--aura-outline); box-shadow:0 10px 40px rgba(0,0,0,.12); }
.offer-modal-card { width:min(540px,100%); padding:34px 36px; }
.offer-modal-card h2 { font-size:34px; line-height:42px; }
.offer-modal-card>p { margin:8px 0 20px; color:var(--aura-muted); font-size:14px; line-height:22px; }
.project-availability-panel { background:var(--aura-surface-low); }
.footer {
  background:var(--aura-ink) !important;
  color:#f7f5f1;
}
.footer-grid strong { color:#fff; }
.footer-grid p,
.footer-note { color:rgba(255,255,255,.7); }
.footer-links a,
.footer-grid a { color:#f7f5f1; }
.footer-links a:hover,
.footer-links a:focus-visible,
.footer-grid a:hover,
.footer-grid a:focus-visible { color:var(--aura-gold); }
.footer-note { border-top-color:rgba(255,255,255,.18); }
.motion-ready .section-motion::after { height:1px; background:var(--aura-gold); }
@media(max-width:980px){.shell{width:calc(100% - 48px)}.section{padding-block:96px}.hero h1{font-size:clamp(40px,8vw,56px)}}
@media(max-width:600px){.shell{width:calc(100% - 40px)}.section{padding-block:76px}.nav{min-height:76px}.hero h1{font-size:40px;line-height:48px}.hero p{font-size:16px;line-height:24px}.section-title,.offer-section .section-title,.geo-summary-section .section-title,.gallery-section .section-title,.faq-section .section-title,.contact-section .section-title{font-size:34px;line-height:42px}.form-panel{padding:28px 20px!important}}
@media(max-width:600px){.offer-modal-card{padding:28px 22px}.offer-modal-card h2{font-size:30px;line-height:38px}}
@media(max-width:980px){.mobile-menu-button,.mobile-menu{display:none!important}}
@media(max-width:760px){.stax-map-panel{grid-template-columns:1fr;margin-top:42px}.stax-map-frame,.stax-map-frame iframe{min-height:340px}.stax-map-copy{padding:28px 22px;border-left:1px solid var(--stax-rule);border-top:0}.stax-map-copy h3{font-size:28px;line-height:36px}}

/* Cinematic hero motion */
@keyframes heroCinematic {
  from { transform:scale(1.1) translate3d(-1.2%,.6%,0); filter:saturate(.62) contrast(1.08); }
  to { transform:scale(1.015) translate3d(0,0,0); filter:saturate(.86) contrast(1.03); }
}
@keyframes heroLightSweep {
  0%,100% { opacity:.18; transform:translate3d(-14%,0,0) rotate(-8deg); }
  50% { opacity:.42; transform:translate3d(22%,0,0) rotate(-8deg); }
}
@keyframes heroWordFloat {
  0%,100% { opacity:.55; transform:translate3d(0,0,0); }
  50% { opacity:1; transform:translate3d(-14px,-7px,0); }
}
.motion-ready .hero-bg.is-active { animation:heroCinematic 5.4s cubic-bezier(.18,.7,.2,1) both; }
.hero-shade { overflow:hidden; }
.hero-shade::after { content:""; position:absolute; inset:-25%; background:linear-gradient(100deg,transparent 36%,rgba(212,175,55,.12) 49%,rgba(255,255,255,.08) 52%,transparent 65%); mix-blend-mode:screen; pointer-events:none; }
.motion-ready .hero-shade::after { animation:heroLightSweep 9s ease-in-out infinite; }
.motion-ready .hero-content::after { animation:heroWordFloat 7s ease-in-out infinite; }
.motion-ready .hero-fact { transition:background-color .3s ease,border-color .3s ease,transform .3s ease; }
.motion-ready .hero-fact:hover { border-color:rgba(212,175,55,.7)!important; background:rgba(255,255,255,.045)!important; transform:translateY(-4px); }
@media(prefers-reduced-motion:reduce){.motion-ready .hero-shade::after,.motion-ready .hero-content::after,.motion-ready .hero-bg.is-active{animation:none}.motion-ready .hero-fact:hover{transform:none}}
