@import url("variables.css");

body {
  font-family: var(--font-family);
  font-size: var(--font-size);
  background: var(--white);
  color: var(--black-200);
}

h1 {
  font-family: var(--font-family);
  font-size: var(--fs-h1);
  line-height: var(--lh-h1);
  font-weight: 500;
  letter-spacing: 0;
  color: var(--black);
}

h2 {
  font-size: var(--fs-h2);
  line-height: var(--lh-h2);
  font-weight: 500;
  letter-spacing: 0;
  color: var(--black-100);
}

h3 {
  font-size: var(--fs-h3);
  line-height: var(--lh-h3);
  font-weight: 500;
  letter-spacing: 0;
  color: var(--black-100);
}

h4 {
  font-size: var(--fs-h4);
  line-height: var(--lh-h4);
  font-weight: 500;
  letter-spacing: 0;
  color: var(--black-100);
}

.large,
caption {
  font-size: var(--fs-large);
  line-height: var(--lh-large);
  font-weight: 500;
  letter-spacing: 0;
  color: var(--black-100);
}

.regularBold {
  font-size: var(--fs-regular);
  line-height: var(--lh-regular);
  font-weight: 500;
  letter-spacing: 0.025rem;
  color: var(--black-200);
}

.regular {
  font-size: var(--fs-regular);
  line-height: var(--lh-regular);
  font-weight: 400;
  letter-spacing: 0.025rem;
  color: var(--black-300);
}

.smallBold {
  font-size: var(--fs-small);
  line-height: var(--lh-small);
  font-weight: 500;
  letter-spacing: 0.05rem;
  color: var(--black-300);
}

.small {
  font-size: var(--fs-small);
  line-height: var(--lh-small);
  font-weight: 400;
  letter-spacing: 0.05rem;
  color: var(--black-400);
}

b {
  font-weight: 500;
  color: var(--black-200);
}
