p {
  font-weight: $font-weight-light;
  .dark & {
    color: $white;
  }
}

strong, .strong {
  font-weight: $font-weight-bold;
}

h1, .h1 {
  font-size: $h1-font-size;
  font-weight: $font-weight-bolder;
  text-transform: uppercase;
  letter-spacing: 0.09375rem;
  .dark & {
    color: $light;
  }
}
h2, .h2 {
  font-size: $h2-font-size;
  font-weight: $font-weight-black;
  color: $dark;
  text-transform: uppercase;
  letter-spacing: 0.045rem;
  .dark & {
    color: $light;
  }
}
h3, .h3 {
  font-size: $h3-font-size;
  font-weight: $font-weight-bold;
  color: $secondary;
  text-transform: uppercase;
  letter-spacing: 0.0225rem;
  .dark & {
    color: $secondary;
  }
}
h4, .h4 {
  font-size: $h4-font-size;
  color: $black;
  text-transform: uppercase;
  letter-spacing: 0.02rem;
  .dark & {
    color: $white;
  }
}
h5, .h5 {
  font-size: $h5-font-size;
  letter-spacing: 0.02rem;
  .dark & {
    color: $light;
  }
}
h6, .h6 {
  font-size: $h6-font-size;
  .dark & {
    color: $light;
  }
}
.title {
  font-size: 8.125rem;
  font-weight: $font-weight-bold;
  color: $black;
  text-transform: uppercase;
  line-height: 1.2;
  letter-spacing: 0.24375rem;
  .dark & {
    color: $white;
  }
  &.light {
    color: $light;
  }
}
.headline {
  font-size: 4.375rem;
  font-weight: $font-weight-black;
  color: $black;
  text-transform: uppercase;
  line-height: 1.2;
  letter-spacing: 0.13125rem;
  .dark & {
    color: $white;
  }
}
.subline {
  font-size: 1.875rem;
  font-weight: $font-weight-light;
  color: $black;
  letter-spacing: 0.0375rem;
  .dark & {
    color: $white;
  }
}
.producthead {
  font-size: 4.375rem;
  font-weight: $font-weight-bold;
  color: $accent;
  letter-spacing: 0.13125rem;
}
.footerline {
  font-size: 0.875rem;
  letter-spacing: 0.0175rem;
  .dark & {
    color: $white;
  }
}

.font-light {
  font-weight: $font-weight-light;
}
.font-regular {
  font-weight: $font-weight-normal;
}
.font-medium {
  font-weight: $font-weight-medium;
}
.font-semibold {
  font-weight: $font-weight-semibold;
}
.font-bold{
  font-weight: $font-weight-bold;
}
.font-extrabold {
  font-weight: $font-weight-bolder;
}
.font-black {
  font-weight: $font-weight-black;
}
.font-normal {
  font-style: normal;
}
.font-italic {
  font-style: italic;
}

.upper {
  text-transform: uppercase;
}

.desc {
  font-weight: $font-weight-semibold;
  color: $gray-500;
  &-line {
    text-transform: uppercase;
    border-bottom: 2px solid $gray-500;
    margin-bottom: 1em;
    padding-bottom: .5em;
  }
  .dark & {
    color: $gray-300;
    &-line {
      border-color: $gray-300
    }
  }
}