/* ============================================
   Dimora Homes — Luxe Page Effects
   Lightweight scroll reveals, parallax, and
   premium hover transitions. No dependencies.
   ============================================ */

/* --- Smooth Scroll --- */
html {
  scroll-behavior: smooth;
}

/* --- White Crossfade Overlay --- */
.luxe-crossfade {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: #fff;
  pointer-events: none;
  opacity: 1;
  animation: luxe-fade-in 0.35s cubic-bezier(0.22, 1, 0.36, 1) 0.05s forwards;
}

.luxe-crossfade.is-leaving {
  opacity: 0;
  animation: luxe-fade-out 0.35s cubic-bezier(0.22, 1, 0.36, 1) forwards;
  pointer-events: all;
}

@keyframes luxe-fade-in {
  from { opacity: 1; }
  to   { opacity: 0; }
}

@keyframes luxe-fade-out {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* --- Scroll Reveal: Fade Up (workhorse) --- */
.luxe-reveal {
  opacity: 0 !important;
  transform: translateY(32px) !important;
  transition: opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1),
              transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
}
.luxe-reveal.is-visible {
  opacity: 1 !important;
  transform: translateY(0) !important;
}

/* --- Scroll Reveal: Fade Only (no movement) --- */
.luxe-fade {
  opacity: 0 !important;
  transition: opacity 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}
.luxe-fade.is-visible {
  opacity: 1 !important;
}

/* --- Scroll Reveal: Slide from Left --- */
.luxe-slide-left {
  opacity: 0 !important;
  transform: translateX(-40px) !important;
  transition: opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1),
              transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
}
.luxe-slide-left.is-visible {
  opacity: 1 !important;
  transform: translateX(0) !important;
}

/* --- Scroll Reveal: Slide from Right --- */
.luxe-slide-right {
  opacity: 0 !important;
  transform: translateX(40px) !important;
  transition: opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1),
              transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
}
.luxe-slide-right.is-visible {
  opacity: 1 !important;
  transform: translateX(0) !important;
}

/* --- Headline Reveal --- */
.luxe-headline {
  opacity: 0 !important;
  transform: translateY(20px) !important;
  transition: opacity 0.8s cubic-bezier(0.22, 1, 0.36, 1),
              transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}
.luxe-headline.is-visible {
  opacity: 1 !important;
  transform: translateY(0) !important;
}

/* --- Stagger Delay Utilities (grid children) --- */
.luxe-stagger > *:nth-child(1) { transition-delay: 0ms; }
.luxe-stagger > *:nth-child(2) { transition-delay: 100ms; }
.luxe-stagger > *:nth-child(3) { transition-delay: 200ms; }
.luxe-stagger > *:nth-child(4) { transition-delay: 300ms; }
.luxe-stagger > *:nth-child(5) { transition-delay: 400ms; }
.luxe-stagger > *:nth-child(6) { transition-delay: 500ms; }

/* --- Enhanced Card Hover --- */
.luxe-card {
  transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1),
              box-shadow 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}
.luxe-card:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 24px 48px rgba(47, 65, 70, 0.10),
              0 8px 16px rgba(47, 65, 70, 0.06);
}

/* --- Decorative Line Grow --- */
.luxe-line {
  width: 0 !important;
  transition: width 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}
.luxe-line.is-visible {
  width: 80px !important;
}

/* --- Parallax GPU Hint --- */
.luxe-parallax {
  will-change: transform;
}

/* --- Respect Reduced Motion --- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  html { scroll-behavior: auto; }
  .luxe-crossfade { display: none; }
  .luxe-reveal, .luxe-fade, .luxe-slide-left, .luxe-slide-right, .luxe-headline {
    opacity: 1 !important;
    transform: none !important;
    clip-path: none !important;
  }
  .luxe-line { width: 80px !important; }
}