:root {
  --font-small: .75rem;
  --font-label: .875rem;
  --font-body: 1rem;
  --font-icon: 1.5rem;
  --font-subtitle: clamp(1.375rem, 2.3vw, 2.25rem);
  --font-h1: clamp(2rem, 4vw, 4rem);
  --font-h2: clamp(1.875rem, 3.4vw, 3.25rem);
  --font-h3: clamp(1.5rem, 2.3vw, 2rem);
  --font-nav: clamp(.875rem, 1.17vw, 1.0625rem);
  --font-logo: 1.25rem;
  --font-logo-label: var(--font-small);
}

body {
  font-size: var(--font-body);
}

h1 {
  font-size: var(--font-h1);
}

h2 {
  font-size: var(--font-h2);
}

h3 {
  font-size: var(--font-h3);
}

.fera-banner-subtitle,
.italic,
.mobile-approved-hero .mobile-sub,
.phone {
  font-size: var(--font-subtitle);
}

.btn,
figcaption,
.fera-home-return {
  font-size: var(--font-label);
}

.eyebrow,
label,
footer,
.note {
  font-size: var(--font-small);
}

.fera-logo .fera-logo-main {
  font-size: var(--font-logo);
}

.fera-logo .fera-logo-small {
  font-size: var(--font-logo-label);
}

@media (max-width: 1050px) {
  :root {
    --font-nav: .875rem;
    --font-logo: 1.0625rem;
    --font-logo-label: .625rem;
  }
}
