:root {
  --btn-gradient: linear-gradient(135deg, #e22658, #e85a8b);
  --btn-radius: 50px;
  --btn-padding: 15px 30px;
  --btn-color: white;
  --btn-font-size: 13px;
  --btn-font-weight: bold;
  --btn-text-transform: uppercase;
  --btn-transition: transform 0.3s ease-in-out;
  --brand-color: #4EBDC8;
  --alert-color: #EE7114;
  --main-bg: #FFE800;
  --text-color: #ffffff;
}

/* Schriftarten */
@font-face {
  font-family: 'HK Grotesk';
  src: url(https://movement-hub.org/wp-content/themes/fonts/HKGrotesk-Regular.otf);
}
@font-face {
  font-family: 'HK Grotesk';
  src: url(https://movement-hub.org/wp-content/themes/fonts/HKGrotesk-Bold.otf);
  font-weight: bold;
}
@font-face {
  font-family: 'Brandon';
  src: url(https://movement-hub.org/wp-content/themes/fonts/Brandon_Grotesque_regular.otf);
}
@font-face {
  font-family: 'Brandon-bold';
  src: url(https://movement-hub.org/wp-content/themes/fonts/Brandon_Grotesque_bold.otf);
  font-weight: bold;
}

/* Grundlayout */
body {
  font-family: 'HK Grotesk', 'Helvetica Neue', Arial, sans-serif !important;
  font-weight: 700;
  background: var(--main-bg);
  color: var(--text-color);
}

/* Typografie */
label,
input[type="radio"]+label {
  font-weight: 700;
  color: var(--text-color);
}

h1, h2, h3, h4, h5, h6 {
 font-family: 'Brandon', 'Helvetica Neue', Arial, sans-serif;
  line-height: 130%;
  letter-spacing: 0;
}

h3.entry-title {
  font-family: 'Brandon-bold';
}

.subtitle-text {
  font-weight: 700;
  text-transform: none;
}

p, ul, li {
  font-family: 'HK Grotesk', sans-serif !important;
  line-height: 160%;
  letter-spacing: 0.3px;
  font-size: clamp(16px, calc(0.875rem + ((1vw - 4.8px) * 2.1053)), 18px) !important;
}

/* Links */
a {
  color: var(--brand-color);
  text-decoration: underline;
}


label {
    font-family: 'HK Grotesk', 'Helvetica Neue', Arial, sans-serif !important;
    font-weight: 700;
    color: #000000;
    font-size: clamp(16px, calc(0.875rem + ((1vw - 4.8px) * 2.1053)), 18px) !important;
}

.column, .columns {
padding-left: 0rem;
padding-right: 0rem;
}

.row .row {
margin-left: 0rem;
margin-right: 0rem;
}


.button.button.grey, a.button.grey {
background: #31bfe9;
color: #ffffff;
}


.button.button.grey:hover {
background: #e22658;
}


form {
margin-bottom: 22px;
max-width: 1200px;
margin-left: auto;
margin-right: auto;
padding-left: 0px;
padding-right: 0px;
}


.row {
max-width: 100%;
margin-left: auto;
margin-right: auto;
}