.italic {
  font-style: italic;
}

.text-dark {
  color: var(--dark-blue) !important;
}

.text-black {
  color: var(--black) !important;
}

.text-light-grey {
  color: var(--light-grey) !important;
}

.body-text .button.texted,
.pretext .button.texted {
  font-size: inherit !important;
  color: inherit;
  font-weight: inherit;
  border-color: inherit;
  text-transform: none;
}

.button-text {
  font-size: var(--button-text);
  font-weight: 200;
  text-transform: uppercase;
  line-height: 125%;
}

.button-text.dark {
  font-weight: 300;
}
.headline {
  text-transform: uppercase;
  font-weight: 300;
  line-height: 110%;
}

.headline.dark {
  font-weight: 400;
}

.headline-1.dark {
  font-weight: 500;
}

.headline-1 {
  font-size: var(--headline-1);
  font-weight: 200;
}

.headline-2 {
  font-size: var(--headline-2) !important;
}

.headline-3 {
  font-size: var(--headline-3);
}

.headline-4 {
  font-size: var(--headline-4);
}

.headline-5 {
  font-size: var(--headline-5);
  line-height: initial;
}

.body-text {
  line-height: 140%;
}

.body-big {
  font-size: var(--body-big);
  font-weight: 200;
  line-height: 125%;
}

.body-big.dark {
  font-weight: 300;
}
.body-medium {
  font-size: var(--body-medium);
  font-weight: 200;
}

.body-small {
  font-size: var(--body-small);
  line-height: 140%;
  font-weight: 100;
}

.body-small.dark {
  font-weight: 200;
}

.pretext {
  font-size: var(--pretext);
  font-weight: 100;
  line-height: 125%;
}

.pretext.dark {
  font-weight: 200;
}


.menu-item {
  font-size: var(--font-18);
  font-weight: 300;
}

@media (max-width: 1023px) {
  .headline-1 {
    line-height: 120%;
  }
  .headline-2 {
    line-height: 110%;
  }
  .headline-3,
  .headline-4 {
    line-height: 112%;
  }

  .body-text {
    line-height: 140% !important;
  }
}

@media (max-width: 767px) {
  .body-medium {
    font-weight: 200;
  }
  .body-text,
  .pretext {
    line-height: 140% !important;
  }
}