:root {
    color: var(--color);
    background: var(--background-color);
    --color: #111516;
    --background-color: rgba(250, 254, 238, 1);
    --min-h1: 1.75rem;
    --max-h1: 5rem;
    --clamped-font-size-h1: clamp(var(--min-h1), 8vw, var(--max-h1));
    --min-h2: 1.25rem;
    --max-h2: 2.5rem;
    --clamped-font-size-h2: clamp(var(--min-h2), 4vw, var(--max-h2));
    --min-h3: 1.5rem;
    --max-h3: 3rem;
    --clamped-font-size-h3: clamp(var(--min-h3), 3vw, var(--max-h3));
    --min-p: 1rem;
    --max-p: 1.25rem;
    --clamped-font-size-p: clamp(var(--min-p), 2vw, var(--max-p));
}

@font-face {
    font-family: "Fraunces";
    font-display: swap;
    font-style: normal;
    font-stretch: normal;
    src: url('fonts/fraunces.ttf') format('truetype');
}

@font-face {
    font-family: "Quicksand";
    font-display: swap;
    font-style: normal;
    font-stretch: normal;
    src: url('fonts/quicksand.ttf') format('truetype');
}

* {
    margin: 0;
    padding: 0;
  }
  
  
  h1,
  h2,
  h3 {
    font-family: "Fraunces";
    font-variation-settings: 'opsz' 9, 'wght' 650, 'SOFT' 50, 'WONK' 1;
  }
  
  p,
  a,
  li {
    font-family: "Quicksand";
    font-weight: 500;
  }
  
  a {
    color: var(--link-color);
    text-decoration: none;
    padding-bottom: .1ch;
    border-bottom: .25ch solid var(--color);
  }
  
  a:hover {
    padding-bottom: .1ch;
    border-bottom: .25ch solid #738058;
  }

/* Datenschutz & Impressum */

#datenschutz-impressum {
    max-width: 960px;
    margin: 0 auto;
    padding: 5em 22px 0.25em;
    line-height: 1.5;
}

@supports (padding: max(0px)) {
    #datenschutz-impressum {
        padding-left: max(22px, env(safe-area-inset-left));
        padding-right: max(22px, env(safe-area-inset-right));
    }
}

#datenschutz-impressum article section {
    padding-bottom: 1em;
}

#datenschutz-impressum :-webkit-any(h1, h2, h3, h4) {
    padding-bottom: 1em;
    text-align: left;
}

#datenschutz-impressum :is(h1, h2, h3, h4) {
    padding-bottom: 1em;
    text-align: left;
}

#datenschutz-impressum :-webkit-any(p, ul) {
    padding-bottom: 0.5em;
    text-align: left;
}

#datenschutz-impressum :is(p, ul) {
    padding-bottom: 0.5em;
    text-align: left;
}

#datenschutz-impressum h1 {
    font-size: 2.5rem;
    font-size: clamp(2rem, 5vw, 5rem);
    line-height: clamp(2rem, 5vw, 5rem);
}

#datenschutz-impressum h2 {
    font-size: 1.5rem;
    margin: 1rem 0;
}

#datenschutz-impressum h3 {
    font-size: 1.5rem;
    margin: 1rem 0;
}

#datenschutz-impressum h4 {
    font-size: 1.1rem;
    margin: 1rem 0;
}

#datenschutz-impressum p {
    line-height: 1.5;
    margin: 2rem 0;
}

#datenschutz-impressum ul {
    padding-left: 1.125em;
    line-height: 1.5;
    font-size: 1.25rem;
}

#datenschutz-impressum li {
    font-size: 1rem;
    padding-bottom: 0.125em;
    line-height: 1.5;
}