/*
 * Minimaler Ersatz für Bootstrap: nur die Basis-Resets und die
 * Grid-/Utility-Klassen, die diese Seite tatsächlich verwendet.
 * Kein Framework, keine ungenutzten Komponenten (Modals, Dropdowns,
 * Carousel, ...).
 */

/* --- Reset (Auszug aus Bootstraps Reboot, exakt für die hier
   verwendeten Elemente) --- */

*, ::before, ::after {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  background-color: #fff;
  -webkit-text-size-adjust: 100%;
}

hr {
  margin: 1rem 0;
  color: inherit;
  background-color: currentColor;
  border: 0;
  opacity: .25;
}

h1, h2, h3 {
  margin-top: 0;
  margin-bottom: .5rem;
  font-weight: 500;
  line-height: 1.2;
}

h1 { font-size: calc(1.375rem + 1.5vw); }
h2 { font-size: calc(1.325rem + .9vw); }
h3 { font-size: calc(1.3rem + .6vw); }

@media (min-width: 1200px) {
  h1 { font-size: 2.5rem; }
  h2 { font-size: 2rem; }
  h3 { font-size: 1.75rem; }
}

p {
  margin-top: 0;
  margin-bottom: 1rem;
}

b, strong {
  font-weight: bolder;
}

a {
  color: #0d6efd;
  text-decoration: underline;
}

a:hover {
  color: #0a58ca;
}

img, svg {
  vertical-align: middle;
  height: auto;
}

/* --- Grid / Utilities --- */

.container {
  width: 100%;
  padding-right: .75rem;
  padding-left: .75rem;
  margin-right: auto;
  margin-left: auto;
}

@media (min-width: 576px) {
  .container { max-width: 540px; }
}

@media (min-width: 768px) {
  .container { max-width: 720px; }
}

@media (min-width: 992px) {
  .container { max-width: 960px; }
}

@media (min-width: 1200px) {
  .container { max-width: 1140px; }
}

@media (min-width: 1400px) {
  .container { max-width: 1320px; }
}

.row {
  --gutter-x: 1.5rem;
  display: flex;
  flex-wrap: wrap;
  margin-right: calc(var(--gutter-x) * -.5);
  margin-left: calc(var(--gutter-x) * -.5);
}

.row > * {
  flex-shrink: 0;
  width: 100%;
  max-width: 100%;
  padding-right: calc(var(--gutter-x) * .5);
  padding-left: calc(var(--gutter-x) * .5);
}

.col-12 { flex: 0 0 auto; width: 100%; }

@media (min-width: 768px) {
  .col-md-3 { flex: 0 0 auto; width: 25%; }
  .col-md-6 { flex: 0 0 auto; width: 50%; }
  .col-md-9 { flex: 0 0 auto; width: 75%; }
}

@media (min-width: 992px) {
  .col-lg { flex: 1 0 0%; }
  .col-lg-auto { flex: 0 0 auto; width: auto; }
  .col-lg-2 { flex: 0 0 auto; width: 16.66666667%; }
  .col-lg-4 { flex: 0 0 auto; width: 33.33333333%; }
  .order-lg-1 { order: 1; }
  .order-lg-2 { order: 2; }
}

.h-100 { height: 100%; }
.w-100 { width: 100%; }
.mt-2 { margin-top: .5rem; }
.mb-3 { margin-bottom: 1rem; }
.py-4 { padding-top: 1.5rem; padding-bottom: 1.5rem; }
.text-center { text-align: center; }
