:root {
  --main-font: #5B9898;
  --main-sub-text: #386060;
  --main-text: #51675C;
  --main-bg: #F5F5F5;
}

body {
  background: var(--main-bg);
}

h1, .h1 {
  color: var(--main-font);
}
h2.main-font, .h2.main-font {
  color: var(--main-font);
}

a, .subtext {
  color: var(--main-sub-text);
}

.text-justify {
  text-align: justify;
  text-justify: inter-word;
}

.line-container {
  display: flex;
  align-items: center;
  justify-content: center;
}

.line {
  flex-grow: 1; /* Linien nehmen den verfügbaren Platz ein */
  border-top: 2px solid teal;
  margin: 0 20px; /* Abstand um den Kreis */
}

.circle {
  width: 50px;
  height: 50px;
  /* border: 3px solid teal; */
  /* border-radius: 50%; */
  display: flex;
  align-items: center;
  justify-content: center;
  /* Text innerhalb des Kreises zentrieren */
}

ul.service li {
  line-height: 2rem;
}

figure {
  border-left: 1px dotted var(--main-font);
  padding-left: 2rem;
}
figure p {
  /* font-family: 'Architects Daughter'; */
  font-size: 1.2rem;
  color: var(--main-font);
}
figure p.quote-source {
  font-size: 0.875rem;
}

.image-container {
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  width: 100%;
  height: 200px; /* Feste Höhe für alle Bilder */
}
.img-col-3 {
  flex-shrink: 0;
  min-width: 100%;
  min-height: 100%;
  object-fit: cover; /* Füllt den Container ohne Verzerrungen */
}

.img-leistung {
  width: 500px
}