/*
 * LEAW Homes — Motion Language
 * Brand: Cinematic · Confident · Calm · Modern · High-End
 *
 * Pattern: Pilkington-style global CSS.
 * Layout's initLeawMotion() automatically observes and animates sections on scroll.
 * Zero component modifications needed.
 */

:root {
  scroll-behavior: auto !important;
}

/* ─── Variables & Tokens ─────────────────────────────────────────── */
.leaw-site {
  --leaw-motion-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --leaw-motion-duration: 850ms;
  --leaw-reveal-distance: 32px;
}

/* ─── Scroll Reveal (Sections) ───────────────────────────────────── */
.leaw-site.leaw-motion-ready .leaw-reveal {
  opacity: 0;
  transform: translate3d(0, var(--leaw-reveal-distance), 0);
  transition:
    opacity var(--leaw-motion-duration) var(--leaw-motion-ease),
    transform var(--leaw-motion-duration) var(--leaw-motion-ease);
  transition-delay: calc(var(--leaw-reveal-order, 0) * 50ms);
  will-change: opacity, transform;
}

.leaw-site.leaw-motion-ready .leaw-reveal.leaw-reveal-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0);
  will-change: auto;
}

/* ─── Subtle Light Sweep on Primary Buttons ─────────────────────── */
.leaw-site .n-primary {
  isolation: isolate;
  overflow: hidden;
  position: relative;
  transition: transform 400ms var(--leaw-motion-ease), background-color 300ms ease, color 300ms ease;
}

.leaw-site .n-primary::after {
  content: '';
  position: absolute;
  inset: -2px auto -2px -50%;
  z-index: 1;
  width: 35%;
  background: linear-gradient(100deg, transparent, rgba(255, 255, 255, 0.22), transparent);
  pointer-events: none;
  transform: skewX(-18deg);
  transition: left 1100ms var(--leaw-motion-ease);
}

.leaw-site .n-primary:hover::after,
.leaw-site .n-primary:focus-visible::after {
  left: 120%;
}

.leaw-site .n-secondary {
  transition: transform 400ms var(--leaw-motion-ease), border-color 300ms ease, color 300ms ease;
}

/* ─── Card Elevation & Smooth Image Zoom ────────────────────────── */
.leaw-site .card-v2,
.leaw-site .accreditation-card,
.leaw-site .property-list-item,
.leaw-site article {
  transition:
    box-shadow 500ms var(--leaw-motion-ease),
    transform 500ms var(--leaw-motion-ease),
    border-color 400ms ease;
}

.leaw-site .card-v2:hover,
.leaw-site .property-list-item:hover,
.leaw-site article:hover {
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.16);
  transform: translate3d(0, -4px, 0);
}

.leaw-site .property-list-item img,
.leaw-site article img,
.leaw-site .card-v2 img {
  transition: transform 850ms var(--leaw-motion-ease);
}

.leaw-site .property-list-item:hover img,
.leaw-site article:hover img,
.leaw-site .card-v2:hover img {
  transform: scale(1.035);
}

/* ─── Reduced Motion Support ─────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .leaw-site *,
  .leaw-site *::before,
  .leaw-site *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }

  .leaw-site.leaw-motion-ready .leaw-reveal {
    opacity: 1;
    transform: none;
  }
}

/* ─── Touch Device Fallback ──────────────────────────────────────── */
@media (hover: none) {
  .leaw-site .card-v2:hover,
  .leaw-site .property-list-item:hover,
  .leaw-site article:hover {
    box-shadow: none;
    transform: none;
  }
}
