/* Reset & Basis */
* { margin: 0; padding: 0; box-sizing: border-box; }
body, html { font-family: Arial, sans-serif; color: #333; }
a { text-decoration: none; }

/* Buttons */
.btn {
  display: inline-block;
  padding: 0.75em 1.5em;
  background: #f39c12;
  color: #fff;
  border-radius: 4px;
  transition: background 0.3s;
}
.btn:hover { background: #d35400; }

/* Hero */
.hero { position: relative; height: 100vh; overflow: hidden; }
.hero-bg {
  width: 100%; height: 100%;
  object-fit: cover;
  filter: brightness(0.6);
}
.hero-content {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  color: white;
}
.hero-content .logo { width: 120px; margin-bottom: 1rem; }

/* Sektion Überschriften */
h2 { text-align: center; margin: 2rem 0; font-size: 2rem; }

/* Leistungen */
.services { padding: 2rem 1rem; background: #fafafa; }
.service-cards {
  display: flex; flex-wrap: wrap;
  justify-content: center; gap: 1.5rem;
}
.card {
  background: #fff; border-radius: 8px; overflow: hidden;
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
  max-width: 300px; text-align: center;
}
.card img { width: 100%; }
.card h3 { margin: 1rem 0; }
.card p { padding: 0 1rem 1rem; }

/* Kontakt */
.contact { padding: 2rem 1rem; }
.contact-wrapper {
  display: flex; flex-wrap: wrap;
  gap: 2rem; justify-content: center;
}
.contact-form, .map {
  flex: 1 1 300px; max-width: 500px;
}
.contact-form form input,
.contact-form form textarea {
  width: 100%; padding: 0.75rem; margin-bottom: 1rem;
  border: 1px solid #ccc; border-radius: 4px;
}