:root {
  --ease-smooth: cubic-bezier(0.25, 0.1, 0.25, 1);
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-apple: cubic-bezier(0.22, 1, 0.36, 1);
  --motion-duration: 0.72s;
  --motion-stagger: 0.05s;
  --reveal-scale-min: 0.86;
  --reveal-lift: 32px;
}

@media (max-width: 768px) {
  :root {
    --reveal-scale-min: 0.88;
    --reveal-lift: 22px;
    --motion-duration: 0.65s;
  }
}

html {
  scroll-padding-top: var(--scroll-anchor-offset);
}

html.lenis {
  height: auto;
}

html.lenis body {
  height: auto;
}

.lenis.lenis-smooth {
  scroll-behavior: auto !important;
}

.lenis.lenis-smooth iframe {
  pointer-events: none;
}

.lenis.lenis-smooth [data-lenis-prevent] {
  overscroll-behavior: contain;
}

.lenis.lenis-stopped {
  overflow: hidden;
}

.site-rail--comms .site-rail-node {
  transition: color 0.35s var(--ease-smooth);
}

.site-section-indicator {
  transition: opacity 0.55s var(--ease-out-expo);
}

.btn {
  transition:
    transform 0.4s var(--ease-out-expo),
    background 0.35s var(--ease-smooth),
    color 0.35s var(--ease-smooth),
    border-color 0.35s var(--ease-smooth),
    filter 0.35s var(--ease-smooth),
    box-shadow 0.4s var(--ease-out-expo);
}

.btn:hover {
  transform: translateY(-1px);
}

.btn:active {
  transform: translateY(0);
  transition-duration: 0.12s;
}


.reveal {
  opacity: 0;
  transform: translate3d(0, 24px, 0);
  transition:
    opacity var(--motion-duration) var(--ease-apple),
    transform var(--motion-duration) var(--ease-apple);
  will-change: opacity, transform;
}

.reveal.panel {
  transform-origin: 50% 12%;
  will-change: transform, opacity;
}

.reveal.panel.is-revealing {
  transition: none;
}

.reveal.panel.is-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0) scale(1);
}

.reveal.is-visible:not(.panel) {
  opacity: 1;
  transform: translate3d(0, 0, 0);
  will-change: auto;
}

.reveal--hero {
  transform: translate3d(0, 20px, 0);
}

.hero {
  will-change: transform, opacity;
}

.hero.is-booted .reveal--hero {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.hero.is-booted .reveal--hero:nth-child(1) {
  transition-delay: 0.05s;
}

.hero.is-booted .reveal--hero:nth-child(2) {
  transition-delay: 0.12s;
}

.hero.is-booted .reveal--hero:nth-child(3) {
  transition-delay: 0.2s;
}

.reveal-stagger > * {
  opacity: 0;
  transform: translate3d(0, 14px, 0);
  transition:
    opacity 0.75s var(--ease-out-expo),
    transform 0.75s var(--ease-out-expo);
}

.reveal-stagger.is-visible > * {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.reveal-stagger.is-visible > *:nth-child(1) {
  transition-delay: calc(var(--motion-stagger) * 1);
}

.reveal-stagger.is-visible > *:nth-child(2) {
  transition-delay: calc(var(--motion-stagger) * 2);
}

.reveal-stagger.is-visible > *:nth-child(3) {
  transition-delay: calc(var(--motion-stagger) * 3);
}

.reveal-stagger.is-visible > *:nth-child(4) {
  transition-delay: calc(var(--motion-stagger) * 4);
}

.reveal-stagger.is-visible > *:nth-child(5) {
  transition-delay: calc(var(--motion-stagger) * 5);
}

.contact-channel {
  transition:
    transform 0.45s var(--ease-out-expo),
    background 0.35s var(--ease-smooth),
    border-color 0.35s var(--ease-smooth),
    box-shadow 0.45s var(--ease-out-expo);
}

.contact-channel:hover {
  transform: translateY(-2px);
}

@media (prefers-reduced-motion: reduce) {
  .reveal,
  .reveal-stagger > * {
    opacity: 1;
    transform: none;
    transition: none;
    will-change: auto;
    animation: none !important;
  }

  .hero {
    transform: none !important;
    opacity: 1 !important;
  }

  .hero.is-booted .reveal--hero {
    transition: none;
  }

  .btn:hover,
  .btn:active,
  .contact-channel:hover,
  .site-rail-node:hover .site-rail-mark {
    transform: none;
  }

}