/* Custom Typography Utilities */
/* Times Variants */
.text-times-xs,
.text-times-xs h1,
.text-times-xs h2,
.text-times-xs h3,
.text-times-xs h4,
.text-times-xs h5,
.text-times-xs h6 {
  font-family: var(--font-times_xs--family);
  font-style: var(--font-times_xs--style);
  font-weight: var(--font-times_xs--weight);
  font-size: var(--font-times_xs-mobile--size);

  @media screen and (min-width: 1000px) {
    font-size: var(--font-times_xs-desktop--size);
  }

  line-height: var(--font-times_xs--line-height);
  letter-spacing: var(--font-times_xs--letter-spacing);
  text-transform: var(--font-times_xs--case);
}

.text-times-sm,
.text-times-sm h1,
.text-times-sm h2,
.text-times-sm h3,
.text-times-sm h4,
.text-times-sm h5,
.text-times-sm h6 {
  font-family: var(--font-times_sm--family);
  font-style: var(--font-times_sm--style);
  font-weight: var(--font-times_sm--weight);
  font-size: var(--font-times_sm-mobile--size);

  @media screen and (min-width: 1000px) {
    font-size: var(--font-times_sm-desktop--size);
  }

  line-height: var(--font-times_sm--line-height);
  letter-spacing: var(--font-times_sm--letter-spacing);
  text-transform: var(--font-times_sm--case);
}

.text-times-base,
.text-times-base h1,
.text-times-base h2,
.text-times-base h3,
.text-times-base h4,
.text-times-base h5,
.text-times-base h6 {
  font-family: var(--font-times_base--family);
  font-style: var(--font-times_base--style);
  font-weight: var(--font-times_base--weight);
  font-size: var(--font-times_base-mobile--size);

  @media screen and (min-width: 1000px) {
    font-size: var(--font-times_base-desktop--size);
  }

  line-height: var(--font-times_base--line-height);
  letter-spacing: var(--font-times_base--letter-spacing);
  text-transform: var(--font-times_base--case);
}

.text-times-lg,
.text-times-lg h1,
.text-times-lg h2,
.text-times-lg h3,
.text-times-lg h4,
.text-times-lg h5,
.text-times-lg h6 {
  font-family: var(--font-times_lg--family);
  font-style: var(--font-times_lg--style);
  font-weight: var(--font-times_lg--weight);
  font-size: var(--font-times_lg-mobile--size);

  @media screen and (min-width: 1000px) {
    font-size: var(--font-times_lg-desktop--size);
  }

  line-height: var(--font-times_lg--line-height);
  letter-spacing: var(--font-times_lg--letter-spacing);
  text-transform: var(--font-times_lg--case);
}

/* Arial Variants */
.text-arial-xs,
.text-arial-xs h1,
.text-arial-xs h2,
.text-arial-xs h3,
.text-arial-xs h4,
.text-arial-xs h5,
.text-arial-xs h6 {
  font-family: var(--font-arial_xs--family);
  font-style: var(--font-arial_xs--style);
  font-weight: var(--font-arial_xs--weight);
  font-size: var(--font-arial_xs-mobile--size);

  @media screen and (min-width: 1000px) {
    font-size: var(--font-arial_xs-desktop--size);
  }

  line-height: var(--font-arial_xs--line-height);
  letter-spacing: var(--font-arial_xs--letter-spacing);
  text-transform: var(--font-arial_xs--case);
}

.text-arial-sm,
.text-arial-sm h1,
.text-arial-sm h2,
.text-arial-sm h3,
.text-arial-sm h4,
.text-arial-sm h5,
.text-arial-sm h6 {
  font-family: var(--font-arial_sm--family);
  font-style: var(--font-arial_sm--style);
  font-weight: var(--font-arial_sm--weight);
  font-size: var(--font-arial_sm-mobile--size);

  @media screen and (min-width: 1000px) {
    font-size: var(--font-arial_sm-desktop--size);
  }

  line-height: var(--font-arial_sm--line-height);
  letter-spacing: var(--font-arial_sm--letter-spacing);
  text-transform: var(--font-arial_sm--case);
}

.text-arial-base,
.text-arial-base h1,
.text-arial-base h2,
.text-arial-base h3,
.text-arial-base h4,
.text-arial-base h5,
.text-arial-base h6 {
  font-family: var(--font-arial_base--family);
  font-style: var(--font-arial_base--style);
  font-weight: var(--font-arial_base--weight);
  font-size: var(--font-arial_base-mobile--size);

  @media screen and (min-width: 1000px) {
    font-size: var(--font-arial_base-desktop--size);
  }

  line-height: var(--font-arial_base--line-height);
  letter-spacing: var(--font-arial_base--letter-spacing);
  text-transform: var(--font-arial_base--case);
}

.mix-blend-difference {
  mix-blend-mode: difference;
  color: var(--color-foreground, var(--color-white, #fff));
}