@font-face {
  font-family: 'Manrope';
  font-weight: 400 800;
  font-style: normal;
  font-display: swap;
  src: url('../fonts/manrope-variable.woff2') format('woff2-variations'),
       url('../fonts/manrope-variable.woff2') format('woff2');
}

.header-scrolled {
  backdrop-filter: blur(14px);
  background-color: rgba(7, 11, 24, 0.78);
  border-bottom-color: rgba(255, 255, 255, 0.08);
}

@keyframes scroll-nudge {
  0%, 100% { transform: translateY(0); opacity: 0.55; }
  50%      { transform: translateY(6px); opacity: 1; }
}

.scroll-indicator {
  animation: scroll-nudge 2s ease-in-out infinite;
}

@keyframes grid-drift {
  from { background-position: 0 0; }
  to   { background-position: 80px 80px; }
}

.grid-bg {
  background-image:
    linear-gradient(to right, rgba(148, 163, 184, 0.06) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(148, 163, 184, 0.06) 1px, transparent 1px);
  background-size: 80px 80px;
  animation: grid-drift 30s linear infinite;
}

.hp-field {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

@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;
  }
  .reveal { opacity: 1; transform: none; }
  .hero-word { opacity: 1; transform: none; }
  .scroll-indicator { animation: none; }
  .grid-bg { animation: none; }
  .prozess-line { transform: scaleX(1); }
  .sticky-cta, .back-to-top { transition: opacity 0.01ms; }
}