/* ============================================================
   ANIMATIONS
   Orchestrated, purposeful motion — not decoration for its own sake.
   ============================================================ */

/* ---------- Scroll reveal (driven by IntersectionObserver in JS) ---------- */
[data-reveal]{
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .9s cubic-bezier(.22,.68,.24,1),
              transform .9s cubic-bezier(.22,.68,.24,1);
  transition-delay: var(--reveal-delay, 0s);
}
[data-reveal].is-visible{
  opacity: 1;
  transform: translateY(0);
}
[data-reveal="fade"]{ transform: none; }
[data-reveal="left"]{ transform: translateX(-32px); }
[data-reveal="left"].is-visible{ transform: translateX(0); }
[data-reveal="right"]{ transform: translateX(32px); }
[data-reveal="right"].is-visible{ transform: translateX(0); }
[data-reveal="scale"]{ transform: scale(.94); }
[data-reveal="scale"].is-visible{ transform: scale(1); }

/* Stagger children of a group automatically via inline --reveal-delay set in JS */

/* ---------- Hero entrance sequence ---------- */
@keyframes riseIn{
  from{ opacity:0; transform: translateY(24px); }
  to{ opacity:1; transform: translateY(0); }
}
.hero-copy .eyebrow{ animation: riseIn .9s cubic-bezier(.22,.68,.24,1) .1s both; }
.hero h1{ animation: riseIn 1.1s cubic-bezier(.22,.68,.24,1) .25s both; }
.hero-copy p{ animation: riseIn 1s cubic-bezier(.22,.68,.24,1) .45s both; }
.hero-actions{ animation: riseIn 1s cubic-bezier(.22,.68,.24,1) .6s both; }
.hero-tags{ animation: riseIn 1s cubic-bezier(.22,.68,.24,1) .75s both; }
.hero-visual{ animation: plateIn 1.3s cubic-bezier(.22,.68,.24,1) .3s both; }

@keyframes plateIn{
  from{ opacity:0; transform: translateY(30px) scale(.97); }
  to{ opacity:1; transform: translateY(0) scale(1); }
}

/* ---------- Ambient hero glow drift ---------- */
@keyframes glowDrift{
  0%,100%{ transform: translate(0,0); }
  50%{ transform: translate(-14px, 10px); }
}
.hero::after{
  content:'';
  position:absolute; top:-10%; right:-10%;
  width:50%; height:60%;
  background: radial-gradient(circle, rgba(201,166,103,0.06), transparent 65%);
  animation: glowDrift 14s ease-in-out infinite;
  pointer-events:none;
  z-index:0;
}

/* ---------- Monogram gentle float ---------- */
@keyframes float{
  0%,100%{ transform: translateY(0); }
  50%{ transform: translateY(-8px); }
}
.plate-monogram svg{ animation: float 6s ease-in-out infinite; }

/* ---------- Scroll cue ---------- */
@keyframes scrollLine{
  0%{ transform: scaleY(0); transform-origin: top; opacity:1; }
  50%{ transform: scaleY(1); transform-origin: top; }
  51%{ transform: scaleY(1); transform-origin: bottom; }
  100%{ transform: scaleY(0); transform-origin: bottom; opacity: .4; }
}
.hero-scroll .line{ animation: scrollLine 2.2s ease-in-out infinite; }

/* ---------- Counters use JS-driven text; a subtle pulse on completion ---------- */
@keyframes countPulse{
  0%{ text-shadow: 0 0 0 rgba(201,166,103,0); }
  50%{ text-shadow: 0 0 18px rgba(201,166,103,0.5); }
  100%{ text-shadow: 0 0 0 rgba(201,166,103,0); }
}
.stat .num.is-done{ animation: countPulse 1s ease-out; }

/* ---------- Card lift ---------- */
.service-card, .project-media, .form, .about-frame{
  will-change: transform;
}

/* ---------- Nav mobile toggle ---------- */
.nav-toggle.is-open span:nth-child(1){ transform: translateY(6.5px) rotate(45deg); }
.nav-toggle.is-open span:nth-child(2){ opacity:0; }
.nav-toggle.is-open span:nth-child(3){ transform: translateY(-6.5px) rotate(-45deg); }

/* ---------- Marquee-style logo ticker isn't used; kept minimal per brief restraint ---------- */

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