/* Black Kow design tokens. Colors limited to the Black Kow palette. */
@import url("https://fonts.googleapis.com/css2?family=Red+Hat+Display:ital,wght@0,300..900;1,300..900&display=swap");

:root {
  /* Primary */
  --bk-sunflower-yellow: #FFC300;
  --bk-midnight-black:   #000000;
  --bk-harvest-oat:      #F9EECF;
  /* Supporting */
  --bk-bag-black:        #121212;
  --bk-paper:            #FFFFFF;
  --bk-card-grey:        #F2F2F2;
  --bk-coffee:           #322A25;
  --bk-success-green:    #008540;

  --font-sans: "Red Hat Display", "Helvetica Neue", Arial, sans-serif;
  --font-mono: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  --h-2: 40px; --h-3: 32px; --h-4: 24px; --h-5: 20px; --h-6: 16px;
}

html { font-family: var(--font-sans); color: var(--bk-midnight-black); background: var(--bk-paper); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
h2 { font-size: var(--h-2); font-weight: 600; line-height: 1.2; margin: 0; }
h3 { font-size: var(--h-3); font-weight: 600; line-height: 1.2; margin: 0; }
h4 { font-size: var(--h-4); font-weight: 600; line-height: 1.2; margin: 0; }
h5 { font-size: var(--h-5); font-weight: 600; line-height: 1.2; margin: 0; }
h6 { font-size: var(--h-6); font-weight: 600; line-height: 1.2; margin: 0; }
@media (max-width: 720px) { h2 { font-size: 32px; } h3 { font-size: 24px; } h4 { font-size: 20px; } h5 { font-size: 16px; } h6 { font-size: 14px; } }
@media (max-width: 720px) { :root { --h-2: 32px; --h-3: 24px; --h-4: 20px; --h-5: 16px; --h-6: 14px; } }
a { color: var(--bk-midnight-black); text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: 3px; }