// Fonts

@font-face {
  font-family: 'Open Sans';
  src: local('Open Sans'), local('OpenSans'), url('/static/fonts/OpenSans-SemiboldItalic.woff2') format('woff2');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Open Sans Semibold';
  src: local('Open Sans Semibold'), local('OpenSansSemibold'), url('/static/fonts/OpenSans-Semibold.woff2') format('woff2');
  font-weight: normal;
  font-style: normal;
}

// Using Variables for Font Families
$font-primary: 'Open Sans', sans-serif;
$font-secondary: 'Open Sans Semibold', sans-serif;
$color-heading-h2: #046e6e; // Türkis für h2

body {
  line-height: 1.5;
  font-family: $font-primary;
  -webkit-font-smoothing: antialiased;
}

h1,
h3,
h4,
h5,
h6 {
  font-family: $font-secondary;
  font-weight: 400;
  // keine Farbe, Standardfarbe übernehmen
}

h2 {
  font-family: $font-secondary;
  font-weight: 400;
  color: $color-heading-h2; // Nur h2 in Türkis
  font-size: $h2;

  @include mobile {
    font-size: $h2-sm;
  }
}

h1 {
  font-size: $h1;

  @include tablet {
    font-size: $h1-md;
  }

  @include mobile {
    font-size: $h2;
  }

  @include mobile-xs {
    font-size: $h2-md;
  }
}

h3 {
  font-size: $h3;
}

h4 {
  font-size: $h4;
}

p {
  color: black;
  font-size: $font-size;
  font-family: $font-secondary;
}
