@charset "UTF-8";
:root {
  --bg-light: #e1f2f9;
  --bg-dark-lighter: #656772;
}

.grid-container {
  display: grid;
  gap: 20px; /* Der Abstand zwischen den Spalten */
  max-width: 1200px; /* Optional: Maximale Breite des Containers */
  margin: 0 auto; /* Zentriert den Container */
  padding: 10px;
  background-color: #fff;
}

.grid-item {
  background-color: var(--bg-light);
  padding: 60px 20px;
  /* --- Flexbox für die Zentrierung des Inhalts --- */
  display: flex; /* Macht das Item zu einem Flex-Container */
  flex-direction: column; /* Ordnet den Inhalt vertikal an */
  justify-content: center; /* Zentriert den Inhalt vertikal */
  align-items: center; /* Zentriert den Inhalt horizontal */
  text-align: center; /* Stellt sicher, dass auch Textzeilen zentriert sind */
}

/* Standard für mobile Ansicht (Spalten untereinander) */
.grid-container {
  grid-template-columns: 1fr; /* Eine Spalte, die den gesamten verfügbaren Platz einnimmt */
}

/* Media Query für größere Bildschirme (z.B. Tablets und Desktops) */
@media (min-width: 768px) {
  .grid-container {
    grid-template-columns: 1fr 1fr; /* Zwei gleich breite Spalten */
  }
}
.text-normalcase {
  text-transform: none;
}

.bg-dark-lighter {
  padding: 60px 0;
  background: var(--bg-dark-lighter);
  color: white;
}
.bg-dark-lighter h2 {
  margin-bottom: 30px;
}

/*# sourceMappingURL=custom.css.map */
