/* ===========================
   Pascal Wohlfarth – Reportageseite
   Benutzerdefiniertes CSS
   =========================== */

/* Allgemeine Einstellungen */
body {
  scroll-behavior: smooth;
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  margin: 0;
  padding: 0;
  background-color: #fff;
  color: #111;
}

body.dark {
  background-color: #1f2937;
  color: #fff;
}

/* Mobile Navigation */
#mobile-menu {
  transition: transform 0.3s ease, opacity 0.3s ease;
}

#mobile-menu.hidden {
  opacity: 0;
  transform: translateY(-10px);
}

/* Hero Section */
section.relative {
  position: relative;
  overflow: hidden;
}

section.relative h1,
section.relative p {
  text-shadow: 0 1px 4px rgba(0,0,0,0.7);
}

/* Galerie */
.lightbox-img {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.lightbox-img:hover {
  transform: scale(1.02);
  box-shadow: 0 10px 25px rgba(0,0,0,0.2);
}

/* Kundenstimme */
blockquote {
  quotes: "„" "“" "‚" "‘";
}

blockquote::before {
  content: open-quote;
  font-size: 2rem;
  vertical-align: top;
  line-height: 0;
  color: #999;
}

blockquote::after {
  content: close-quote;
  font-size: 2rem;
  vertical-align: bottom;
  line-height: 0;
  color: #999;
}

/* CTA Button */
a.button-cta,
a.inline-block.px-8.py-4 {
  transition: background-color 0.3s ease, transform 0.2s ease;
}

a.button-cta:hover,
a.inline-block.px-8.py-4:hover {
  background-color: #333;
  transform: translateY(-2px);
}

/* Footer */
footer a {
  color: inherit;
  transition: color 0.3s ease;
}

footer a:hover {
  color: #000;
}

body.dark footer a:hover {
  color: #fff;
}