/* Sayo Iso-Pro GmbH — Basiswerte, Resets, Keyframes, Media Queries.
   Der Rest der Gestaltung sitzt bewusst inline in den HTML-Dateien. */

html { scroll-behavior: smooth; }
body { margin: 0; background: #fff; color: #16181d; font-family: 'Inter', system-ui, sans-serif; font-weight: 400; font-size: 17px; line-height: 1.65; letter-spacing: -0.005em; -webkit-font-smoothing: antialiased; }
a { color: #16233f; text-decoration: none; }
a:hover { color: #d8453c; }
:focus-visible { outline: 2px solid #d8453c; outline-offset: 3px; }
::selection { background: #fde6e4; }
input, select, textarea, button { font-family: inherit; font-size: 16px; }
summary::-webkit-details-marker { display: none; }

.skip-link { position: absolute; left: -9999px; top: 0; z-index: 200; background: #16233f; color: #fff; padding: 12px 20px; }
.skip-link:focus { left: 0; }

@keyframes partnerScroll { from { transform: translate3d(-50%,0,0); } to { transform: translate3d(0,0,0); } }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  [data-partner-track] { animation: none !important; }
}

/* Header: Desktop-Nav vs. Mobile-Menü-Button */
.nav-desktop { display: none; }
.nav-mobile-toggle { display: flex; }
.mobile-menu { display: none; }
@media (min-width: 1000px) {
  .nav-desktop { display: flex; }
  .nav-mobile-toggle { display: none; }
  .mobile-menu { display: none !important; }
}
.mobile-menu.open { display: flex; }

/* Hero: eine Spalte auf Mobile, zwei Spalten ab 1000px */
.hero-grid { grid-template-columns: minmax(0,1fr); }
.hero-stat-card { left: 20px; transform: none; }
@media (min-width: 1000px) {
  .hero-grid { grid-template-columns: minmax(0,.78fr) minmax(0,1.22fr); }
  .hero-stat-card { left: 0; transform: translateX(-22%); }
}

/* Referenzen: Bildwechsel per JS gesteuert (opacity), Startzustand hier */
.album-img { opacity: 0; }
.album-img:first-child { opacity: 1; }

/* Vorher/Nachher-Regler */
.ba-range { -webkit-appearance: none; appearance: none; }
.ba-range::-webkit-slider-thumb { -webkit-appearance: none; width: 1px; height: 1px; opacity: 0; }
.ba-range::-moz-range-thumb { width: 1px; height: 1px; opacity: 0; border: none; }
