/* ============================================================
   Winspec typography presets
   Mirrors WinspecWeb theme.typography for plain HTML/PHP views.
   ============================================================ */

[class^="typo-"],
[class*=" typo-"] {
  font-family: var(--theme-font-family);
}

.typo-headline-1-bold {
  font-size: var(--theme-font-size-h1);
  font-weight: var(--theme-font-weight-bold);
  line-height: var(--theme-line-height-h1);
  letter-spacing: var(--theme-letter-spacing-h1);
}

.typo-headline-2-bold {
  font-size: var(--theme-font-size-h2);
  font-weight: var(--theme-font-weight-bold);
  line-height: var(--theme-line-height-h2);
  letter-spacing: var(--theme-letter-spacing-h2);
}

.typo-headline-3-bold {
  font-size: var(--theme-font-size-h3);
  font-weight: var(--theme-font-weight-bold);
  line-height: var(--theme-line-height-h3);
  letter-spacing: var(--theme-letter-spacing-h3);
}

.typo-headline-4-bold {
  font-size: var(--theme-font-size-h4);
  font-weight: var(--theme-font-weight-bold);
  line-height: var(--theme-line-height-h4);
  letter-spacing: var(--theme-letter-spacing-h4);
}

.typo-headline-5-bold {
  font-size: var(--theme-font-size-h5);
  font-weight: var(--theme-font-weight-bold);
  line-height: var(--theme-line-height-h5);
  letter-spacing: var(--theme-letter-spacing-h5);
}

.typo-body-1-bold,
.typo-body-1-medium,
.typo-body-1-regular {
  font-size: var(--theme-font-size-b1);
  line-height: var(--theme-line-height-b1);
  letter-spacing: var(--theme-letter-spacing-b1);
}

.typo-body-2-bold,
.typo-body-2-medium,
.typo-body-2-regular {
  font-size: var(--theme-font-size-b2);
  line-height: var(--theme-line-height-b2);
  letter-spacing: var(--theme-letter-spacing-b2);
}

.typo-body-3-bold,
.typo-body-3-medium,
.typo-body-3-regular {
  font-size: var(--theme-font-size-b3);
  line-height: var(--theme-line-height-b3);
  letter-spacing: var(--theme-letter-spacing-b3);
}

.typo-body-4-bold,
.typo-body-4-medium,
.typo-body-4-regular {
  font-size: var(--theme-font-size-b4);
  line-height: var(--theme-line-height-b4);
  letter-spacing: var(--theme-letter-spacing-b4);
}

.typo-body-5-bold,
.typo-body-5-medium,
.typo-body-5-regular {
  font-size: var(--theme-font-size-b5);
  line-height: var(--theme-line-height-b5);
  letter-spacing: var(--theme-letter-spacing-b5);
}

.typo-body-6-bold,
.typo-body-6-regular {
  font-size: var(--theme-font-size-b6);
  line-height: var(--theme-line-height-b6);
  letter-spacing: var(--theme-letter-spacing-b6);
}

.typo-label-6-medium {
  font-size: var(--theme-font-size-b6);
  font-weight: var(--theme-font-weight-medium);
  line-height: var(--theme-line-height-b6);
  letter-spacing: var(--theme-letter-spacing-label);
}

.typo-label-7-bold {
  font-size: var(--theme-font-size-b7);
  font-weight: var(--theme-font-weight-bold);
  line-height: var(--theme-line-height-b7);
  letter-spacing: var(--theme-letter-spacing-label);
}

.typo-label-8-medium,
.typo-label-8-bold {
  font-size: var(--theme-font-size-b8);
  line-height: var(--theme-line-height-b8);
  letter-spacing: var(--theme-letter-spacing-none);
}

.typo-body-1-bold,
.typo-body-2-bold,
.typo-body-3-bold,
.typo-body-4-bold,
.typo-body-5-bold,
.typo-body-6-bold,
.typo-label-8-bold {
  font-weight: var(--theme-font-weight-bold);
}

.typo-body-1-medium,
.typo-body-2-medium,
.typo-body-3-medium,
.typo-body-4-medium,
.typo-body-5-medium,
.typo-label-8-medium {
  font-weight: var(--theme-font-weight-medium);
}

.typo-body-1-regular,
.typo-body-2-regular,
.typo-body-3-regular,
.typo-body-4-regular,
.typo-body-5-regular,
.typo-body-6-regular {
  font-weight: var(--theme-font-weight-regular);
}
