/* ==========================================================================
   animations.css  |  keyframes, reveals, kinetic type, reduced motion
   ========================================================================== */

@keyframes breathe {
  0%   { transform: scale(1)    translate3d(0, 0, 0);      opacity: 0.54; filter: blur(44px) hue-rotate(0deg); }
  33%  { transform: scale(1.08) translate3d(2%, -1.4%, 0); opacity: 0.66; filter: blur(50px) hue-rotate(8deg); }
  66%  { transform: scale(1.04) translate3d(-2%, 1.4%, 0); opacity: 0.58; filter: blur(46px) hue-rotate(-6deg); }
  100% { transform: scale(1)    translate3d(0, 0, 0);      opacity: 0.54; filter: blur(44px) hue-rotate(0deg); }
}

@keyframes grain-shift {
  0%   { transform: translate(0, 0); }
  20%  { transform: translate(-9px, 6px); }
  40%  { transform: translate(7px, -10px); }
  60%  { transform: translate(-6px, -7px); }
  80%  { transform: translate(10px, 5px); }
  100% { transform: translate(0, 0); }
}

/* The aura behind every cutout, breathing */
@keyframes aura {
  0%, 100% { transform: translate(-50%, -50%) scale(1)    rotate(0deg);   opacity: 0.72; }
  33%      { transform: translate(-50%, -50%) scale(1.11) rotate(4deg);   opacity: 1;    }
  66%      { transform: translate(-50%, -50%) scale(1.05) rotate(-3deg);  opacity: 0.85; }
}

/* Same cycle for layers that carry no centring transform of their own */
@keyframes aura-still {
  0%, 100% { transform: scale(1);    opacity: 0.70; }
  33%      { transform: scale(1.10); opacity: 1;    }
  66%      { transform: scale(1.04); opacity: 0.84; }
}

/* Same cycle for layers that are not centre-translated */
@keyframes aura-floor {
  0%, 100% { transform: translateX(-50%) scaleX(1)    scaleY(1);    opacity: 0.7; }
  33%      { transform: translateX(-50%) scaleX(1.12) scaleY(1.18); opacity: 1;   }
  66%      { transform: translateX(-50%) scaleX(1.05) scaleY(1.08); opacity: 0.82;}
}

@keyframes cue-pulse {
  0%, 100% { transform: scaleY(0.3); opacity: 0.22; transform-origin: top; }
  50%      { transform: scaleY(1);   opacity: 1;    transform-origin: top; }
}

@keyframes wave {
  0%, 100% { height: 26%; }
  50%      { height: 100%; }
}

@keyframes sweep {
  0%, 100% { background-position: 130% 0; }
  50%      { background-position: -30% 0; }
}

/* --------------------------------------------------------------------------
   Reveals
   -------------------------------------------------------------------------- */

[data-reveal] {
  opacity: 0;
  transform: translate3d(0, 26px, 0);
  transition:
    opacity var(--t-3) var(--ease-soft),
    transform var(--t-3) var(--ease-out);
  transition-delay: var(--d, 0ms);
}
[data-reveal].is-visible { opacity: 1; transform: none; }

/* The rule draws itself, so the row must not also slide */
.honor[data-reveal] { opacity: 1; transform: none; }
.honor[data-reveal] > *:not(.honor__rule) {
  opacity: 0;
  transform: translate3d(0, 20px, 0);
  transition:
    opacity var(--t-3) var(--ease-soft),
    transform var(--t-3) var(--ease-out);
}
.honor[data-reveal].is-visible > *:not(.honor__rule) { opacity: 1; transform: none; }
.honor[data-reveal] > *:nth-child(2) { transition-delay: 120ms; }
.honor[data-reveal] > *:nth-child(3) { transition-delay: 200ms; }
.honor[data-reveal] > *:nth-child(4) { transition-delay: 300ms; }

/* Kinetic headings drive their own units */
[data-kinetic] { opacity: 1; transform: none; }

/* --------------------------------------------------------------------------
   Kinetic type
   -------------------------------------------------------------------------- */

.k-word {
  display: inline-block;
  white-space: nowrap;
}

.k-mask {
  display: inline-block;
  overflow: hidden;
  vertical-align: bottom;
  padding-bottom: 0.1em;
  margin-bottom: -0.1em;
}

.k-unit {
  display: inline-block;
  transform: translate3d(0, 110%, 0) rotate(2.5deg);
  opacity: 0;
  will-change: transform, opacity;
  transition:
    transform 1250ms var(--ease-out),
    opacity 1000ms var(--ease-soft);
  transition-delay: calc(var(--i, 0) * var(--step, 46ms));
}
[data-kinetic].is-visible .k-unit {
  transform: translate3d(0, 0, 0) rotate(0deg);
  opacity: 1;
}

.hero__name    { --step: 66ms; }
.hero__role    { --step: 30ms; }
.craft__title,
.honors__title,
.contact__title { --step: 52ms; }
.creed__quote p { --step: 78ms; }

/* --------------------------------------------------------------------------
   Scroll-linked parallax where the browser can do it natively
   -------------------------------------------------------------------------- */

@supports (animation-timeline: view()) {
  @keyframes drift {
    from { transform: translate3d(0, 3.2%, 0); }
    to   { transform: translate3d(0, -3.2%, 0); }
  }

  [data-parallax] > img,
  [data-parallax] img {
    animation: drift linear both;
    animation-timeline: view();
    animation-range: entry 0% exit 100%;
  }
}

/* --------------------------------------------------------------------------
   Reduced motion
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }

  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    transition-delay: 0ms !important;
  }

  .ambient__wash { animation: none; opacity: 0.5; }
  .ambient__gl { display: none; }
  .grain { animation: none; opacity: 0.16; }

  /* Auras stay, they just stop breathing */
  .cut__aura, .creed__aura { animation: none; opacity: 0.85; }
  .cut__floor, .film__glow { animation: none; opacity: 0.8; }
  .plate__wipe { transform: scaleY(0) !important; }
  .strip.is-pinned .plate { opacity: 1 !important; transform: none !important; }
  .cursor { display: none !important; }
  body:has(.cursor) { cursor: auto; }

  .loader, .curtain { display: none !important; }

  [data-reveal],
  .honor[data-reveal] > * { opacity: 1 !important; transform: none !important; }
  .honor__rule { transform: scaleX(1) !important; }
  .k-unit { transform: none !important; opacity: 1 !important; }
  .k-mask { overflow: visible; }

  .cue { opacity: 1 !important; }
  .cue__rule { animation: none; opacity: 0.45; }
  .sound__wave i { animation: none; height: 50%; }

  .creed__quote::after { animation: none; opacity: 0; }

  /* No pinning, no scroll-driven transforms */
  .hero__stage { transform: none !important; opacity: 1 !important; }
  .film { height: auto !important; }
  .film__pin { position: static; height: auto; min-height: 100svh; }
  .film__frame { transform: none !important; clip-path: none !important; }
  .strip { height: auto !important; }
  .strip__pin { position: static; height: auto; }
  .strip__viewport { overflow-x: auto; }
  .strip__track { transform: none !important; }

  @supports (animation-timeline: view()) {
    [data-parallax] img { animation: none; }
  }
}
