/* Reveal on scroll — IntersectionObserver flips data-revealed */
[data-reveal] {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity var(--duration-slow) var(--ease-out), transform var(--duration-slow) var(--ease-out);
  will-change: opacity, transform;
}
[data-reveal][data-revealed] { opacity: 1; transform: none; }
[data-reveal="left"] { transform: translateX(-24px); }
[data-reveal="right"] { transform: translateX(24px); }
[data-reveal="left"][data-revealed],
[data-reveal="right"][data-revealed] { transform: none; }

[data-reveal-delay="1"] { transition-delay: 80ms; }
[data-reveal-delay="2"] { transition-delay: 160ms; }
[data-reveal-delay="3"] { transition-delay: 240ms; }
[data-reveal-delay="4"] { transition-delay: 320ms; }
[data-reveal-delay="5"] { transition-delay: 400ms; }

/* Hero title gentle entrance — CSS-only, no JS dependency */
.hero__title, .hero__subtitle, .hero__cta {
  opacity: 0; transform: translateY(16px);
  animation: hero-fade var(--duration-slow) var(--ease-out) forwards;
}
.hero__subtitle { animation-delay: 120ms; }
.hero__cta { animation-delay: 220ms; }

@keyframes hero-fade {
  to { opacity: 1; transform: none; }
}

/* Subtle pattern drift in hero */
@keyframes drift {
  from { transform: translate3d(0, 0, 0); }
  to { transform: translate3d(-32px, 16px, 0); }
}
.hero::before { animation: drift 18s ease-in-out infinite alternate; }

/* Card hover lift handled in components.css; here we add a subtle border shimmer */
.card { position: relative; }
.card::before {
  content: ""; position: absolute; inset: -1px; border-radius: inherit;
  background: linear-gradient(120deg, transparent 30%, rgba(196,131,30,0.45) 50%, transparent 70%);
  opacity: 0; transition: opacity var(--duration-base) var(--ease-out);
  pointer-events: none; z-index: -1;
  filter: blur(8px);
}
.card:hover::before { opacity: 0.7; }

/* Nav link underline grow */
.site-nav a { position: relative; }
.site-nav a::after {
  content: ""; position: absolute; left: var(--space-4); right: var(--space-4); bottom: var(--space-2);
  height: 2px; background: var(--color-secondary);
  transform: scaleX(0); transform-origin: left;
  transition: transform var(--duration-base) var(--ease-out);
}
.site-nav a:hover::after,
.site-nav a:focus-visible::after,
.site-nav a[aria-current="page"]::after { transform: scaleX(1); }

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
  [data-reveal] { opacity: 1; transform: none; }
}