body {
  font-family: "Playfair Display", serif;
  background-color: rgb(255,244,207); /* heller Farbton aus der Palette */
  color: rgb(106,87,21); /* dunkler Text */
  margin: 0;

  background: url("https://photos.standortsanalyse.net/hintergrund_abs.png") no-repeat center top;
  background-repeat: no-repeat;
  background-position: left top;
  background-attachment: fixed;

}


/* Hero mit Hintergrundgrafik */

.hero {
  position: relative;


  padding: 3rem 1rem; /* Abstand für Inhalt */
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.hero .hero-content {
  position: relative;
  z-index: 1;
}

.hero h1 {
  font-size: clamp(3.5rem, 8vw, 5.5rem);
  font-weight: 700;
  margin: 0;
}

.hero p.lead {
  font-size: clamp(1.8rem, 3vw, 2.2rem);
  font-style: italic;
  margin-top: 1rem;
}



/* Cards im unteren Bereich */

.card {
  border-radius: 1rem;
  box-shadow: 0 6px 18px rgba(0,0,0,0.08);
  transition: transform 0.2s ease;
}

.card:hover {
  transform: translateY(-6px);
}

.card img {
  border-top-left-radius: 1rem;
  border-top-right-radius: 1rem;
  height: 240px;
  object-fit: cover;
}

/* Analyse Card */
.analyse-card {
  background-color: rgb(255,244,207);
  color: rgb(106,87,21);
}
.analyse-btn {
  background-color: rgb(146,125,53);
  color: #fff;
}
.analyse-btn:hover {
  background-color: rgb(106,87,21);
  color: #fff;
}

/* Fotografie Card */
.foto-card {
  background-color: rgb(222,205,146);
  color: rgb(106,87,21);
}
.foto-btn {
  background-color: rgb(181,160,90);
  color: #fff;
}
.foto-btn:hover {
  background-color: rgb(146,125,53);
  color: #fff;
}