@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700&display=swap');

/* === Font Imports === */
@font-face {
  font-family: 'Switzer';
  src: url('../fonts/Switzer-Medium.woff2') format('woff2'),
       url('../fonts/Switzer-Medium.woff') format('woff');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

/* === Headings === */
.heading {
  font-family: var(--font-heading);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: var(--tracking-heading);
  line-height: 1.1;
}

.heading--xl {
  font-size: clamp(var(--text-3xl), 5vw, var(--text-5xl));
}

.heading--lg {
  font-size: clamp(var(--text-2xl), 4vw, var(--text-4xl));
}

.heading--md {
  font-size: clamp(var(--text-xl), 3vw, var(--text-2xl));
}

/* === Labels / Subtitles === */
.label {
  font-family: var(--font-body);
  font-weight: 500;
  font-size: var(--text-xs);
  text-transform: uppercase;
  letter-spacing: var(--tracking-label);
}

/* === Body Text === */
.body-text {
  font-family: var(--font-body);
  font-weight: 500;
  font-size: var(--text-sm);
  line-height: 1.8;
}

/* === Tagline === */
.tagline {
  font-family: var(--font-body);
  font-weight: 500;
  font-size: var(--text-xs);
  text-transform: uppercase;
  letter-spacing: var(--tracking-tagline);
}