/* Typography Base Styles */
:root {
  --font-family-base: 'TWKLausanne', sans-serif;
  --font-family-heading: 'TWKLausanne', sans-serif;
  --font-size-base: 16px;
  --line-height-base: 1.2;
  --color-text: #000;
  --color-heading: #000;
}

body {
  font-family: var(--font-family-base);
  font-size: var(--font-size-base);
  font-weight: 300;
  line-height: 1.5;
  color: var(--color-text);
  margin: 0;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-family-heading);
  color: var(--color-heading);
  line-height: 1.25;
  font-weight: 300;
  letter-spacing: 0;
}

h1, .h1 { font-size: 4rem; }
h2, .h2 { font-size: 1.5rem; }
h3, .h3 { font-size: 1.25rem; }
h4, .h4 { font-size: 1rem; }

a:hover,
a:focus {
  color: var(--color-link-hover);
  text-decoration: none;
}

@media only screen and (min-width: 1440px) {
  h1, .h1 { font-size: 5.625rem; }
  h2, .h2 { font-size: 1.875rem; }
  h3, .h3 { font-size: 1.75rem; }
  h4, .h4 { font-size: 1.25rem; }
  p, body {
    font-size: var(--font-size-base);
  }
}