/* RAV Homes — modern design layer on top of Tailwind utilities */

html { scroll-behavior: smooth; }

::selection { background: #D2601F; color: #FBF8F3; }

/* ---- Floating glass header ---- */
#header-shell {
  background: rgba(255, 255, 255, 0.72);
  backdrop-filter: blur(16px) saturate(160%);
  -webkit-backdrop-filter: blur(16px) saturate(160%);
  box-shadow: 0 8px 30px rgba(22, 19, 16, 0.06);
}
#site-header.is-scrolled #header-shell {
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 12px 34px rgba(22, 19, 16, 0.12);
}
#brand-name, #header-phone, #menu-btn-icon { color: #161310; }
.nav-link { color: rgba(22, 19, 16, 0.65); }
.nav-link:hover { color: #D2601F; background: rgba(210, 96, 31, 0.08); }
.nav-link.is-active { color: #D2601F; background: rgba(210, 96, 31, 0.1); }

/* ---- Hero video / photo treatment ---- */
.hero-media { position: absolute; inset: 0; width: 100%; height: 100%; overflow: hidden; }
.hero-media video,
.hero-media img.hero-fallback { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero-media img.hero-fallback { z-index: 1; }
.hero-media video { z-index: 2; }
@media (prefers-reduced-motion: reduce) {
  .hero-media video { display: none; }
}
.hero-scrim {
  position: absolute; inset: 0; z-index: 3;
  background: linear-gradient(180deg, rgba(15,12,9,0.55) 0%, rgba(15,12,9,0.25) 32%, rgba(15,12,9,0.78) 100%);
}
.hero-scrim-tall {
  background: linear-gradient(180deg, rgba(15,12,9,0.35) 0%, rgba(15,12,9,0.12) 30%, rgba(15,12,9,0.85) 100%);
}
.hero-badge {
  display: inline-flex; align-items: center; gap: 0.5rem;
  background: rgba(255,255,255,0.14);
  border: 1px solid rgba(255,255,255,0.25);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

/* ---- Modern card + hover-lift ---- */
.card-lift { transition: transform 0.35s ease, box-shadow 0.35s ease; }
.card-lift:hover { transform: translateY(-6px); box-shadow: 0 24px 48px -12px rgba(22,19,16,0.22); }

.img-zoom { overflow: hidden; }
.img-zoom img, .img-zoom video { transition: transform 0.8s cubic-bezier(.2,.7,.3,1); }
.img-zoom:hover img, .img-zoom:hover video { transform: scale(1.06); }

/* ---- Pill CTA glow on hover ---- */
.btn-glow { transition: transform 0.25s ease, box-shadow 0.25s ease, background-color 0.25s ease; }
.btn-glow:hover { transform: translateY(-2px); }

/* ---- Section reveal: a single, restrained load-in per section ---- */
.reveal {
  opacity: 0;
  transform: translateY(22px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}
.reveal.is-visible { opacity: 1; transform: translateY(0); }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .reveal { opacity: 1; transform: none; transition: none; }
  .card-lift:hover { transform: none; }
  .img-zoom:hover img, .img-zoom:hover video { transform: none; }
}

/* ---- Soft dotted accent used behind numbered steps / stat panels ---- */
.dot-grid {
  background-image: radial-gradient(rgba(255,255,255,0.14) 1px, transparent 1px);
  background-size: 18px 18px;
}

/* Keyboard focus visibility */
a:focus-visible, button:focus-visible {
  outline: 2px solid #D2601F;
  outline-offset: 3px;
}

/* Simple fade/slide for the mobile menu */
#mobile-menu { transition: opacity 0.25s ease; }

/* Gallery filter buttons */
.filter-btn.is-active {
  background-color: #161310;
  color: #FBF8F3;
  border-color: #161310;
}

/* Rounded gradient wash used behind section eyebrow labels */
.eyebrow {
  display: inline-flex; align-items: center; gap: 0.5rem;
  font-weight: 700; font-size: 0.75rem; letter-spacing: 0.14em;
  padding: 0.4rem 0.9rem; border-radius: 999px;
}

/* A single hairline rule used as a deliberate divider, not decoration */
.hr-brass { height: 1px; background: linear-gradient(90deg, #C79A4B, transparent); }

/* Number badge used in process / stage sequences */
.step-num {
  display: inline-flex; align-items: center; justify-content: center;
  font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800;
}