/* Menü-Links Basisfarbe */
#maternity-site .navbar-menu a {
  color: #b0d9d0 !important;
  font-weight: 300;
}

/* H1 */
#maternity-site h1 {
  color: #b0d9d0 !important;
  text-align: center !important;
}

/* H2 */
#maternity-site h2 {
  font-family: 'Runalto', serif !important;
  font-size: 2em;
  color: #b0d9d0 !important;
}

/* H3 */
#start-maternity h3 {
  font-family: 'Runalto', serif !important;
  font-size: 2em;
  font-weight: normal;
  color: #cb903b; /* Fallback */
  background: linear-gradient(45deg, #cb903b, #c2a963);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow: 0px 1px 0 #fff;
  margin-top: 0px;
}

/* Linie in Angebot-Box */
#start-maternity .angebot-box hr {
  border: none;
  width: 50%;
  height: 4px;
  background: linear-gradient(45deg, #cb903b, #c2a963);
  margin: 20px auto 0 auto;
}

/* Logo Größe */
#maternity-site .navbar-logo img {
  max-width: 500px !important;
  height: auto;
  margin-top: 60px;
}

@media screen and (max-width: 768px) {
  #maternity-site .navbar-logo img {
    max-width: 350px !important;
    margin-top: 30px;
  }
}

/* Burger-Menü: Links Basisfarbe */
#maternity-site .navbar-menu nav.active ul li a {
  color: #fff !important;
}

/* Startbereich */
#start-maternity {
  outline: 10px solid #b0d9d0;
  outline-offset: -10px;
  margin: 20px;
  color: white;
}

/* Grid-Item */
#start-maternity .grid-item {
  background-color: #007494 !important;
}

/* Box-Text */
#start-maternity .box-text {
  margin: auto auto 0 auto;
  max-width: 950px;
  text-align: left;
}

/* =========================================
   Angebot Spalten & Boxen
   ========================================= */

#start-maternity .angebot-spalten {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));  /* Fix für gleiche Breite */
  gap: 30px;
  padding-top: 30px;
  max-width: 1140px;
  margin: 0 auto;
  text-align: left;
  font-weight: 400 !important;
}

/* Angebot Box Basisstil */
#start-maternity .angebot-box {
  padding: 20px;
  margin-top: 20px;
  color: white;
  text-align: center;
  box-shadow: none;
  border-radius: 0;
  align-self: start; /* Box nur so hoch wie nötig */
  font-size: 1em; /* Basis = Mobil */
}

/* Spalten Farben */
#start-maternity .spalte-1 { background-color: #ec766a !important; }
#start-maternity .spalte-2 { background-color: #e8b75a !important; }
#start-maternity .spalte-3 { background-color: #d76d7f !important; }

/* Tablet (bis 991px): 2 Spalten + mittige dritte Box */
@media screen and (max-width: 991px) {
  #start-maternity .angebot-spalten {
    grid-template-columns: 1fr 1fr;
  }

  #start-maternity .angebot-box:nth-child(3) {
    grid-column: 1 / -1;
    justify-self: center;
    max-width: 60%;
    margin-top: 60px;
  }
}

/* Einheitliche Höhe der Angebotsspalten ab Tablet-Größe */
@media screen and (min-width: 768px) {
  #start-maternity .angebot-spalten {
    align-items: stretch;
  }

  #start-maternity .angebot-box {
    display: flex;
    flex-direction: column;
    height: 100%;
    font-size: 0.85em; /* Tablet */
  }

  #start-maternity .angebot-box a.box-button {
    margin-top: auto;
  }
}

/* Smartphone: einspaltig */
@media screen and (max-width: 767px) {
  #start-maternity .angebot-spalten {
    grid-template-columns: 1fr;
  }

  #start-maternity .angebot-box:nth-child(3) {
    max-width: 100%;
    justify-self: stretch;
    margin-top: 20px;
  }
}

/* Desktop-Größe: Box-Schrift kleiner */
@media screen and (min-width: 992px) {
  #start-maternity .angebot-box {
    font-size: 0.7em;
  }
}

/* Angebot Kugel */
.angebot-kugel {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: linear-gradient(45deg, #cb903b, #c2a963);
  margin: 0 auto;
  position: relative;
  top: -40px;
}

.gold-separator {
  text-align: center;
  line-height: 1.6;
}

.separator-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: linear-gradient(45deg, #cb903b, #c2a963);
  margin: 5px auto;
}



/* Illustration */
#illustration {
  width: 100%;
  margin: 0 0 -40px 0;
  padding: 0;
}

/* Footer */
#maternity-site footer {
  background-color: #b0d9d0 !important;
}

/* =========================================
   Maternity: Submenüs & Hover-Farben
   ========================================= */

/* Burger-Menü: Submenü-Links (weiß als Grundfarbe) */
#maternity-site .navbar-menu nav.active ul li.has-submenu > ul.submenu li a {
  color: #fff !important;
}

/* Burger-Menü: Submenü-Links Hover */
#maternity-site .navbar-menu nav.active ul li.has-submenu > ul.submenu li a:hover {
  color: #007494 !important;
}

/* Burger-Menü: Hauptseiten-Links Hover */
#maternity-site .navbar-menu nav.active ul li a:hover {
  color: #007494 !important;
}

/* Desktop: Submenü-Links (Basis- & Hover-Farben) + Pfeil */
@media screen and (min-width: 992px) {

  /* Submenü-Links: Standardfarbe */
  #maternity-site .navbar-menu nav ul li.has-submenu > ul.submenu li a {
    color: #007494 !important;
  }

  /* Submenü-Links: Hover dunkler */
  #maternity-site .navbar-menu nav ul li.has-submenu > ul.submenu li a:hover {
    color: #005971 !important;
  }

  /* Pfeil-Farbe */
  #maternity-site .navbar-menu nav ul li.has-submenu > a::after {
    color: #b0d9d0 !important;
  }
}