:root {
  --color-teal: #006D71;
  --color-redorange: #EF5244;

  
  --on-teal: #FFFFFF;
  --on-redorange: #000000;
}

/* Textfarben */
.text-teal { color: var(--color-teal); }
.text-redorange { color: var(--color-redorange); }

/* Hintergründe */
.bg-teal { background-color: var(--color-teal); color: var(--on-teal); }
.bg-redorange { background-color: var(--color-redorange); color: var(--on-redorange); }

/* Buttons */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  padding: .6rem 1rem;
  border: 0;
  border-radius: .6rem;
  font-weight: 600;
  cursor: pointer;
}
.btn-teal { background: var(--color-teal); color: var(--on-teal); }
.btn-redorange { background: var(--color-redorange); color: var(--on-redorange); }
.btn:hover { filter: brightness(0.92); }

/* Für SVG-Logoteile (optional) */
.fill-teal { fill: var(--color-teal); }
.fill-redorange { fill: var(--color-redorange); }


#logo {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
}

#logo img {
  max-width: 100vw;
  max-height: 100vh;
  width: auto;
  height: auto;
}