/* Grundlegende Stilansetzungen für das gesamte Projekt */

/* Reset and Base Styles */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  font-size: 16px;
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-sans);
  font-weight: var(--font-weight-regular);
  font-size: var(--font-size-md);
  line-height: var(--line-height-normal);
  color: var(--reflection-black);
  background-color: var(--medium-white);
}

a {
  color: var(--reflection-blue);
  text-decoration: none;
  transition: color var(--transition-normal);
}

a:hover {
  color: var(--dialogue-red);
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

/* Utility Classes */
.container {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--container-padding);
  width: 100%;
}

.text-center {
  text-align: center;
}

.text-right {
  text-align: right;
}

.text-left {
  text-align: left;
}

.mt-0 { margin-top: 0; }
.mb-0 { margin-bottom: 0; }
.my-0 { margin-top: 0; margin-bottom: 0; }
.mt-xs { margin-top: var(--space-xs); }
.mb-xs { margin-bottom: var(--space-xs); }
.my-xs { margin-top: var(--space-xs); margin-bottom: var(--space-xs); }
.mt-sm { margin-top: var(--space-sm); }
.mb-sm { margin-bottom: var(--space-sm); }
.my-sm { margin-top: var(--space-sm); margin-bottom: var(--space-sm); }
.mt-md { margin-top: var(--space-md); }
.mb-md { margin-bottom: var(--space-md); }
.my-md { margin-top: var(--space-md); margin-bottom: var(--space-md); }
.mt-lg { margin-top: var(--space-lg); }
.mb-lg { margin-bottom: var(--space-lg); }
.my-lg { margin-top: var(--space-lg); margin-bottom: var(--space-lg); }
.mt-xl { margin-top: var(--space-xl); }
.mb-xl { margin-bottom: var(--space-xl); }
.my-xl { margin-top: var(--space-xl); margin-bottom: var(--space-xl); }
.mt-xxl { margin-top: var(--space-xxl); }
.mb-xxl { margin-bottom: var(--space-xxl); }
.my-xxl { margin-top: var(--space-xxl); margin-bottom: var(--space-xxl); }

.pt-0 { padding-top: 0; }
.pb-0 { padding-bottom: 0; }
.py-0 { padding-top: 0; padding-bottom: 0; }
.pt-xs { padding-top: var(--space-xs); }
.pb-xs { padding-bottom: var(--space-xs); }
.py-xs { padding-top: var(--space-xs); padding-bottom: var(--space-xs); }
.pt-sm { padding-top: var(--space-sm); }
.pb-sm { padding-bottom: var(--space-sm); }
.py-sm { padding-top: var(--space-sm); padding-bottom: var(--space-sm); }
.pt-md { padding-top: var(--space-md); }
.pb-md { padding-bottom: var(--space-md); }
.py-md { padding-top: var(--space-md); padding-bottom: var(--space-md); }
.pt-lg { padding-top: var(--space-lg); }
.pb-lg { padding-bottom: var(--space-lg); }
.py-lg { padding-top: var(--space-lg); padding-bottom: var(--space-lg); }
.pt-xl { padding-top: var(--space-xl); }
.pb-xl { padding-bottom: var(--space-xl); }
.py-xl { padding-top: var(--space-xl); padding-bottom: var(--space-xl); }
.pt-xxl { padding-top: var(--space-xxl); }
.pb-xxl { padding-bottom: var(--space-xxl); }
.py-xxl { padding-top: var(--space-xxl); padding-bottom: var(--space-xxl); }