/* =========================
   Local Fonts
   ========================= */

/* OSWALD */
@font-face {
  font-family: 'Oswald';
  src: url('../fonts/oswald-400.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Oswald';
  src: url('../fonts/oswald-500.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Oswald';
  src: url('../fonts/oswald-700.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}


/* ROBOTO */
@font-face {
  font-family: 'Roboto';
  src: url('../fonts/roboto-400.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Roboto';
  src: url('../fonts/roboto-500.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Roboto';
  src: url('../fonts/roboto-700.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}


/* =========================
   Typography System
   ========================= */

:root {
  --primary-font: 'Oswald', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --secondary-font: 'Roboto', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

  --site-identity-font-size: 40px;

  --font-weight: 400;
  --line-height: 1.6;
}


/* =========================
   Base Typography
   ========================= */

body {
  font-family: var(--secondary-font);
  font-weight: var(--font-weight);
  line-height: var(--line-height);
}


/* =========================
   Headlines
   ========================= */

h1, h2, h3, h4, h5, h6,
.entry-title {
  font-family: var(--primary-font);
  font-weight: 500;
  line-height: 1.3;
}


/* =========================
   Site Title
   ========================= */

.site-title,
.site-title a {
  font-family: var(--primary-font);
  font-size: var(--site-identity-font-size);
  font-weight: 700;
  line-height: 1.2;
}


/* =========================
   Content Typography
   ========================= */

.site-description,
.entry-content,
.post-content,
.inner-article-content {
  font-family: var(--secondary-font);
}

html {
  font-synthesis: none;
}