/* Modern luxury animation utilities */

:root {
  --lux-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  --lux-shadow-1: 0 6px 16px rgba(0,0,0,0.08);
  --lux-shadow-2: 0 12px 28px rgba(0,0,0,0.12);
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  [data-animate] { opacity: 1 !important; transform: none !important; filter: none !important; }
}

/* Base state for reveal animations */
[data-animate] {
  opacity: 0;
  will-change: transform, opacity, filter;
  transition-property: transform, opacity, filter;
  transition-duration: 900ms;
  transition-timing-function: var(--lux-ease);
  transition-delay: var(--a-delay, 0ms);
}

/* Variants initial state */
[data-animate="fade"] { transform: translateY(0); filter: blur(2px); }
[data-animate="up"] { transform: translateY(24px); filter: blur(2px); }
[data-animate="down"] { transform: translateY(-24px); filter: blur(2px); }
[data-animate="left"] { transform: translateX(-24px); filter: blur(2px); }
[data-animate="right"] { transform: translateX(24px); filter: blur(2px); }
[data-animate="zoom"] { transform: scale(0.96); filter: blur(1px); }

/* Visible state */
[data-animate].is-visible {
  opacity: 1;
  transform: none;
  filter: none;
}

/* Hover micro-interactions: cards */
.card { transition: transform 300ms var(--lux-ease), box-shadow 300ms var(--lux-ease); }
.card:hover { transform: translateY(-4px); box-shadow: var(--lux-shadow-1); }
.card:active { transform: translateY(-1px); }

/* Hover micro-interactions: buttons */
.btn { transition: transform 240ms var(--lux-ease), box-shadow 240ms var(--lux-ease), background-color 240ms var(--lux-ease), color 240ms var(--lux-ease); }
.btn:hover { transform: translateY(-2px); box-shadow: var(--lux-shadow-1); }
.btn:active { transform: translateY(0); box-shadow: none; }

/* Emphasize primary theme buttons slightly more */
.btn-theme-main:hover, .btn-theme-sub:hover, .btn-secondary:hover { box-shadow: var(--lux-shadow-2); }

/* Image reveal/zoom wrappers */
.cover-banner .img-banner, .our-services-banner, .card-img-top {
  transition: transform 800ms var(--lux-ease), filter 800ms var(--lux-ease), opacity 800ms var(--lux-ease);
}
.cover-banner:hover .img-banner, a:hover .our-services-banner, a:hover .card-img-top { transform: scale(1.02); }

/* Subtle underline for nav links */
#HeaderMenu .nav-link { position: relative; }
#HeaderMenu .nav-link::after {
  content: "";
  position: absolute;
  left: 0; bottom: 6px;
  height: 2px; width: 0;
  background: currentColor; opacity: 0.35;
  transition: width 300ms var(--lux-ease);
}
#HeaderMenu .nav-link:hover::after, #HeaderMenu .nav-link.active::after { width: 100%; }

/* Optional stagger helper for common grid items */
[data-animate-stagger] > *[data-animate] { --a-delay: calc(var(--a-base-delay, 100ms) * var(--a-index, 0)); }
