/* =============================================================
   Utilities — Sichtbarkeit, Motion, Layout-Helper
   ============================================================= */

.sr-only {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* Reveal on scroll */
.reveal {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity var(--dur-4) var(--ease-out),
              transform var(--dur-4) var(--ease-out);
  will-change: opacity, transform;
}
.reveal.is-in {
  opacity: 1;
  transform: translateY(0);
}
.reveal[data-delay="1"].is-in { transition-delay: 80ms; }
.reveal[data-delay="2"].is-in { transition-delay: 160ms; }
.reveal[data-delay="3"].is-in { transition-delay: 240ms; }
.reveal[data-delay="4"].is-in { transition-delay: 320ms; }

@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; }
}

/* Flex helpers */
.stack-4 { display: grid; gap: 4px; }
.stack-8 { display: grid; gap: 8px; }
.stack-12 { display: grid; gap: 12px; }
.stack-16 { display: grid; gap: 16px; }
.stack-24 { display: grid; gap: 24px; }
.stack-32 { display: grid; gap: 32px; }
.row-8 { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.row-12 { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.row-16 { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }

.text-center { text-align: center; }
.mt-24 { margin-top: 24px; }
.mt-32 { margin-top: 32px; }
.mt-48 { margin-top: 48px; }

/* Body scroll lock (mobile menu) */
body.no-scroll {
  overflow: hidden;
  touch-action: none;
}

/* Print */
@media print {
  .preview-bar, .header, .footer, .consent, .nav-toggle { display: none !important; }
  body { padding-top: 0; background: #fff; color: #000; }
  a { text-decoration: underline; }
}