:root { --motion-ease: cubic-bezier(.165, .84, .44, 1); }

/* Finite CSS entrances also finish when JavaScript is unavailable. */
body::before, body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 100;
  background: #242426;
  pointer-events: none;
  animation: opening-sweep 720ms 90ms cubic-bezier(.76, 0, .24, 1) both;
}
body::after { background: #080809; animation-duration: 620ms; animation-delay: 0ms; }
@keyframes opening-sweep {
  from { transform: translateX(0); }
  to { transform: translateX(-100%); visibility: hidden; }
}
.site-logo, .menu-toggle, .site-navigation a { animation: header-enter 800ms 400ms var(--motion-ease) both; }
.site-navigation a:nth-child(1) { animation-delay: 480ms; }
.site-navigation a:nth-child(2) { animation-delay: 560ms; }
.site-navigation a:nth-child(3) { animation-delay: 640ms; }
@keyframes header-enter {
  from { opacity: 0; transform: translateY(-10px); }
  to { opacity: 1; transform: translateY(0); }
}
.hero { overflow: clip; }
.hero-video { animation: landscape-enter 2400ms 120ms var(--motion-ease) both; }
@keyframes landscape-enter {
  from { transform: scale(1.065); }
  to { transform: scale(1); }
}
.hero-slide.is-active .hero-copy > * { animation: hero-enter 950ms var(--motion-ease) both; }
.hero-slide.is-active .hero-copy > h1 { animation-delay: 600ms; }
.hero-slide.is-active .hero-tagline { animation-delay: 880ms; }
.hero-slide.is-active .hero-brand > img { animation-delay: 220ms; }
.hero-slide.is-active .hero-brand > p { animation-delay: 400ms; }
.hero-slide.is-active .hero-brand-link { animation-delay: 560ms; }
@keyframes hero-enter {
  from { opacity: 0; transform: translateY(32px); filter: blur(4px); }
  to { opacity: 1; transform: translateY(0); filter: blur(0); }
}

/* JS adds this class only after the scroll observer is ready. */
.reveal-pending { opacity: 0; }
.reveal-pending.is-visible { animation: content-enter 850ms var(--reveal-delay, 0ms) var(--motion-ease) both; }
.not-found .reveal-pending.is-visible { animation-delay: 400ms; }
@keyframes content-enter {
  from { opacity: 0; transform: translateY(28px); }
  to { opacity: 1; transform: translateY(0); }
}
.reveal-pending.is-visible .business-list li { animation: content-enter 650ms calc(var(--reveal-delay, 0ms) + 100ms) var(--motion-ease) both; }
.reveal-pending.is-visible .business-list li:nth-child(2) { animation-delay: calc(var(--reveal-delay, 0ms) + 170ms); }
.reveal-pending.is-visible .business-list li:nth-child(3) { animation-delay: calc(var(--reveal-delay, 0ms) + 240ms); }
.reveal-pending.is-visible .business-list li:nth-child(4) { animation-delay: calc(var(--reveal-delay, 0ms) + 310ms); }

.site-navigation a { position: relative; }
.site-navigation a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 22px; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: right; transition: transform 350ms var(--motion-ease); }
.site-navigation a:hover::after, .site-navigation a:focus-visible::after { transform: scaleX(1); transform-origin: left; }
.contact-button { position: relative; isolation: isolate; overflow: hidden; transition: border-color 350ms, color 350ms, background-color 350ms; }
.contact-button::before { content: ""; position: absolute; z-index: -1; inset: 0; background: #fff; transform: translateX(-102%); transition: transform 450ms var(--motion-ease); }
.contact-button:hover, .contact-button:focus-visible { color: #000; border-color: #fff; background: transparent; }
.contact-button:hover::before, .contact-button:focus-visible::before { transform: translateX(0); }
.site-logo:focus-visible, .menu-toggle:focus-visible, .site-navigation a:focus-visible { animation: none; }

.motion-settled body::before, .motion-settled body::after { display: none; }
.motion-settled .site-logo, .motion-settled .menu-toggle, .motion-settled .site-navigation a,
.motion-settled .hero-video, .motion-settled .hero-slide.is-active .hero-copy > * { animation: none; }

@media (max-width: 921px) {
  .site-navigation a::after { right: auto; width: 36px; bottom: 8px; }
}
@media (max-width: 921px) and (prefers-reduced-motion: no-preference) {
  .site-navigation.is-open a:not(:focus-visible) { animation: header-enter 400ms var(--motion-ease) both; }
  .site-navigation.is-open a:nth-child(2) { animation-delay: 50ms; }
  .site-navigation.is-open a:nth-child(3) { animation-delay: 100ms; }
}
@media (max-width: 767px) {
  @keyframes hero-enter {
    from { opacity: 0; transform: translateY(24px); }
    to { opacity: 1; transform: translateY(0); }
  }
}
@media (prefers-reduced-motion: reduce) {
  body::before, body::after { display: none; }
  .site-logo, .menu-toggle, .site-navigation a, .hero-video, .hero-slide.is-active .hero-copy > *,
  .reveal-pending, .reveal-pending.is-visible, .reveal-pending.is-visible .business-list li { animation: none; opacity: 1; transform: none; filter: none; }
  .contact-button::before { transition: none; }
}
