@font-face { font-family: "Literata"; src: url(fonts/literata-400-700.woff2) format("woff2"); font-weight: 400 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Literata"; src: url(fonts/literata-400-700-italic.woff2) format("woff2"); font-weight: 400 700; font-style: italic; font-display: swap; }
@font-face { font-family: "Public Sans"; src: url(fonts/public-sans-100-900.woff2) format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap; }

:root {
  --font-head: "Literata", "Iowan Old Style", Georgia, serif;
  --font-body: "Literata", "Iowan Old Style", Georgia, serif;
  --font-ui: "Public Sans", "Helvetica Neue", Arial, sans-serif;

  --bg: #F6F1E6;
  --bg-2: #ECE4D2;
  --card: #FFFCF4;
  --line: #CDC3AB;
  --ink: #1A1F1C;
  --ink-2: #3E4942;

  --dark: #1F3A2E;
  --dark-ink: #F6F1E6;
  --dark-ink-2: #D3D6C7;
  --dark-line: rgba(246, 241, 230, .24);
  --foot: #16291F;

  --accent: #8F3F1F;
  --accent-hover: #7A3417;
  --accent-ink: #FFFFFF;
  --accent-text: #8C3512;

  --radius: 8px;
  --shadow: 0 16px 40px -20px rgba(20, 35, 28, .45);
}

body .bar { background: var(--accent); color: #FFFFFF; }
body .bar time { background: var(--dark); color: var(--dark-ink); }
body .hero { background: var(--dark); color: var(--dark-ink); }
body .hero h1 { color: var(--dark-ink); }
body .hero .eyebrow, body .hero .hero__sub, body .hero .hero__cue, body .hero .hero__pay { color: var(--dark-ink-2); }
body .hero .hero__sub em { color: var(--dark-ink); }
body .hero .hero__link, body .hero .hero__link:visited { color: #F2C09E; }
body .hero .btn--hero { background: #B4552E; color: #FFFFFF; box-shadow: 0 0 0 2px rgba(246, 241, 230, .35), 0 14px 32px -12px rgba(0, 0, 0, .55); }
body .hero .btn--hero:hover { background: #A84A34; }
body .hero .video__frame { box-shadow: 0 24px 60px -20px rgba(0, 0, 0, .7); }
body section.math, body section.mail { background: var(--bg); }

body .video .video__play { top: 50%; transform: translate(-50%, -50%); margin-top: 0; }
@media (max-width: 640px) { body .video .video__play { top: 50%; margin-top: 0; } }