/* ===========================================================
   THE CURRENT — animations.css
   Long easing. Generous delays. Nothing bounces. Nothing snaps.
   =========================================================== */

/* ===================== LOADER ===================== */
.loader {
  position: fixed; inset: 0; z-index: 990;
  background: #14171a;
  display: grid; place-items: center;
  transition: opacity 900ms var(--ease), visibility 900ms;
}
.loader.is-done { opacity: 0; visibility: hidden; }
.loader__inner { text-align: center; padding: 0 var(--gut); }
.loader__word {
  font-family: var(--display);
  font-size: clamp(2.2rem, 7vw, 5rem);
  font-variation-settings: 'opsz' 120, 'SOFT' 30, 'WONK' 1;
  letter-spacing: -.04em; line-height: 1;
  color: transparent;
  -webkit-text-stroke: .5px color-mix(in srgb, #d8ccb8 34%, transparent);
  background-image: linear-gradient(to top, #b87333 0%, #d8ccb8 100%);
  background-repeat: no-repeat;
  background-position: 0 100%;
  background-size: 100% 0%;
  -webkit-background-clip: text; background-clip: text;
  animation: rise 1900ms var(--ease) forwards;
}
.loader__rule {
  width: min(360px, 60vw); height: 1px; margin: 1.6rem auto 1.2rem;
  background: #b87333; transform: scaleX(0); transform-origin: left;
  animation: ruleIn 1900ms var(--ease) 200ms forwards;
}
.loader__meta {
  font-family: var(--mono); font-size: var(--fs-mono);
  letter-spacing: .28em; text-transform: uppercase;
  color: #6b7d89; opacity: 0;
  animation: fadeIn 1200ms var(--ease) 700ms forwards;
}
@keyframes rise   { from { background-size: 100% 0%; } to { background-size: 100% 104%; } }
@keyframes ruleIn { to { transform: scaleX(1); } }
@keyframes fadeIn { to { opacity: 1; } }

/* ===================== HERO ENTRANCE ===================== */
.hero__eyebrow, .hero__wordmark, .hero__horizon, .hero__tagline, .hero__ctas, .hero__scroll {
  opacity: 0;
}
body.is-ready .hero__eyebrow  { animation: up 1500ms var(--ease-out) 120ms forwards; }
body.is-ready .hero__wordmark { animation: up 2000ms var(--ease-out) 260ms forwards; }
body.is-ready .hero__horizon  { animation: lineIn 2200ms var(--ease-out) 420ms forwards; }
body.is-ready .hero__tagline  { animation: up 1600ms var(--ease-out) 900ms forwards; }
body.is-ready .hero__ctas     { animation: up 1600ms var(--ease-out) 1120ms forwards; }
body.is-ready .hero__scroll   { animation: up 1600ms var(--ease-out) 1500ms forwards; }

@keyframes up     { from { opacity: 0; transform: translateY(26px); } to { opacity: 1; transform: none; } }
@keyframes lineIn { from { opacity: 0; transform: scaleX(.3); } to { opacity: 1; transform: scaleX(1); } }
@keyframes pulse  { 0%,100% { opacity: .25; } 50% { opacity: .9; } }
@keyframes grainshift {
  0%   { transform: translate(0,0); }
  20%  { transform: translate(-3%, 2%); }
  40%  { transform: translate(2%, -3%); }
  60%  { transform: translate(-2%, -2%); }
  80%  { transform: translate(3%, 1%); }
  100% { transform: translate(0,0); }
}

/* ===================== SCROLL REVEALS ===================== */
.reveal, [data-reveal] {
  opacity: 0; transform: translateY(30px);
  transition:
    opacity 1500ms var(--ease-out) var(--rd, 0ms),
    transform 1500ms var(--ease-out) var(--rd, 0ms);
  will-change: opacity, transform;
}
.reveal.is-in, [data-reveal].is-in { opacity: 1; transform: none; }

/* per-item stagger applied by animations.js via --rd */
.pillar, .room, .venue, .prox, .spec, .amen, .season, .still__lines li {
  opacity: 0; transform: translateY(24px);
  transition:
    opacity 1200ms var(--ease-out) var(--rd, 0ms),
    transform 1200ms var(--ease-out) var(--rd, 0ms),
    background-color var(--t-med) var(--ease);
}
.is-in .pillar, .is-in .room, .is-in .venue, .is-in .prox,
.is-in .spec, .is-in .amen, .is-in .season, .is-in .still__lines li,
.pillar.is-in, .room.is-in, .venue.is-in, .prox.is-in,
.spec.is-in, .amen.is-in, .season.is-in {
  opacity: 1; transform: none;
}

/* ===================== FLOAT DRAWING ===================== */
/* Paths draw themselves in on scroll. Progress is written by float.js. */
.fd-draw { stroke-dasharray: var(--len); stroke-dashoffset: var(--len); }
.fd-fade { opacity: 0; transition: opacity 1200ms var(--ease); }
.fd-fade.is-in { opacity: 1; }

/* ===================== REDUCED MOTION ===================== */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-delay: 0ms !important;
    transition-duration: .001ms !important;
    transition-delay: 0ms !important;
  }
  .reveal, [data-reveal],
  .pillar, .room, .venue, .prox, .spec, .amen, .season, .still__lines li,
  .hero__eyebrow, .hero__wordmark, .hero__horizon, .hero__tagline, .hero__ctas, .hero__scroll {
    opacity: 1 !important; transform: none !important;
  }
  .grain { animation: none; }
  /* Water freezes to a still gradient; the SVG resolves instantly.
     The structure toggle stays live — it is content, not decoration. */
  .fd-draw { stroke-dashoffset: 0 !important; }
  .fd-fade { opacity: 1 !important; }
  .loader { display: none; }
}