/* The original typography, palette, composition and section order stay intact. */
#grain {
  inset: -20%;
  width: 140%;
  height: 140%;
  animation: grain-fine 0.8s steps(1) infinite;
}
@keyframes grain-fine {
  0%, 100% { transform: translate(0, 0); }
  20% { transform: translate(-4%, 5%); }
  40% { transform: translate(6%, -3%); }
  60% { transform: translate(-5%, -6%); }
  80% { transform: translate(3%, 4%); }
}
html.page-hidden #grain { animation-play-state: paused; }

.reveal {
  transform: translate3d(0, 16px, 0);
  transition-duration: 1.05s, 1.2s;
  transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
}
.reveal.in-view { transform: translate3d(0, 0, 0); }
.hero-headline.reveal,
.section-headline.reveal,
.contact-headline.reveal {
  filter: blur(3px);
  transition: opacity 1.2s cubic-bezier(0.19, 1, 0.22, 1),
    transform 1.45s cubic-bezier(0.19, 1, 0.22, 1),
    filter 1.35s cubic-bezier(0.19, 1, 0.22, 1);
}
.hero-headline.reveal.in-view,
.section-headline.reveal.in-view,
.contact-headline.reveal.in-view { filter: blur(0); }
#hero .hero-brand { transition-delay: 60ms; }
#hero .hero-brand-rule { transition-delay: 150ms; }
#hero .hero-headline { transition-delay: 240ms; }
#hero .hero-sub { transition-delay: 410ms; }
#hero .hero-ctas { transition-delay: 580ms; }
#hero .hero-scroll-indicator { transition-delay: 760ms; }
#hero-canvas {
  transform: scale(1.035);
  transform-origin: center;
  transition: transform 3.4s cubic-bezier(0.19, 1, 0.22, 1);
}
#main-content.visible #hero-canvas { transform: scale(1); }
.section-divider { transition-duration: 1.8s; }
#scroll-progress {
  width: 100%;
  transform: scaleX(0);
  transform-origin: left;
  transition: none;
}
.btn-primary, .nav-cta { will-change: auto; }
.btn-primary.is-magnetic, .nav-cta.is-magnetic { will-change: translate; }
a:focus-visible, button:focus-visible, input:focus-visible {
  outline: 1px solid var(--accent);
  outline-offset: 5px;
}
#contact-privacy { margin-top: 0.75rem; }
.btn-primary:disabled { cursor: wait; }
html { scroll-padding-top: 5.5rem; }

@media (max-width: 500px) {
  #nav { gap: 12px; }
  .nav-logo { min-width: 0; }
  .nav-cta {
    flex-shrink: 0;
    white-space: nowrap;
    padding-inline: 12px;
  }
  .bd-closer-engines { max-width: 100%; gap: 0.5rem; }
  .bd-closer-engine { flex: 1; min-width: min-content; }
}

@media (max-width: 360px) {
  #nav { padding-inline: 16px; }
  .nav-cta { padding-inline: 10px; }
}

@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;
    transition-delay: 0s !important;
  }
  #intro { display: none !important; }
  #main-content { opacity: 1; }
  .reveal, .section-divider {
    opacity: 1;
    transform: none !important;
    filter: none !important;
  }
  #hero-canvas { transform: none; }
}
