/* =================================================================
   Daemons — Shared Design Tokens
   https://assets.daemons.agency/css/common.css

   Single source of truth for colors, typography, and heading styles
   used by both the Grav CMS theme and the React online-app.
   ================================================================= */

/* ── Bungee — heading font ── */

@font-face {
  font-family: 'Bungee';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/bungee-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Bungee';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/bungee-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
  /* ── Colors ── */

  /* Primary brand */
  --dm-primary:            #FF6600;
  --dm-primary-dark:       #e55c00;
  --dm-primary-light:      #ff8533;
  --dm-primary-fg:         #ffffff;

  /* Text */
  --dm-text:               #50596c;
  --dm-text-heading:       #3a414e;
  --dm-text-muted:         #acb3c2;

  /* Surfaces */
  --dm-bg:                 #ffffff;
  --dm-bg-muted:           #f8f9fa;

  /* Borders */
  --dm-border:             #e7e9ed;
  --dm-border-light:       #f0f1f4;

  /* Semantic */
  --dm-success:            #32b643;
  --dm-warning:            #ffb700;
  --dm-error:              #e85600;

  /* ── Typography ── */

  --dm-font-heading:       'Bungee', -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
  --dm-font-body:          -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
  --dm-font-mono:          "SF Mono", "Segoe UI Mono", "Roboto Mono", Menlo, Courier, monospace;
  --dm-font-weight-normal: 400;
  --dm-font-weight-medium: 500;
  --dm-font-weight-bold:   700;
  --dm-line-height:        1.5;

  /* ── Heading sizes (rem, based on 20px root) ── */

  --dm-h1-size:            1.8rem;
  --dm-h2-size:            1.6rem;
  --dm-h3-size:            1.4rem;
  --dm-h4-size:            1.2rem;
  --dm-h5-size:            1rem;
  --dm-h6-size:            0.8rem;
  --dm-heading-weight:     500;
  --dm-heading-line-height:1.2;
}

/* ── Base heading styles ── */

h1, h2, h3, h4, h5, h6 {
  font-family: var(--dm-font-heading);
  color: var(--dm-primary);
  font-weight: var(--dm-heading-weight);
  line-height: var(--dm-heading-line-height);
  margin-top: 0;
  margin-bottom: 0.5em;
}

h1 { font-size: var(--dm-h1-size); }
h2 { font-size: var(--dm-h2-size); }
h3 { font-size: var(--dm-h3-size); }
h4 { font-size: var(--dm-h4-size); }
h5 { font-size: var(--dm-h5-size); }
h6 { font-size: var(--dm-h6-size); }

/* ── Link defaults ── */

a {
  color: var(--dm-primary);
  text-decoration: none;
}

a:hover,
a:focus {
  color: var(--dm-primary-dark);
  text-decoration: underline;
}