/*
 * Davidson Horizon brand tokens, from the brand guidelines
 * (brand/davidson-horizon-brand-guidelines.pdf): primary #263b46 and white,
 * complementary #463826, Muli for text (published today as Mulish) and
 * Raleway Italic as the secondary face.
 *
 * The variable names are the ones products/cinema-tools/shared/brand uses,
 * so the shared site foot (site-foot.css) styles itself from these without
 * a second copy. Fonts are served from this domain, never from Google's CDN
 * (GDPR: LG München, 2022). Both are SIL OFL 1.1; licences in ./fonts/.
 */

@font-face { font-family: 'Mulish'; font-style: normal; font-weight: 200 1000; font-display: swap;
  src: url('/fonts/mulish.woff2') format('woff2'); }
@font-face { font-family: 'Mulish'; font-style: italic; font-weight: 200 1000; font-display: swap;
  src: url('/fonts/mulish-italic.woff2') format('woff2'); }
@font-face { font-family: 'Raleway'; font-style: italic; font-weight: 100 900; font-display: swap;
  src: url('/fonts/raleway-italic.woff2') format('woff2'); }

:root {
  --ct-color-primary: #263b46;
  --ct-color-primary-contrast: #ffffff;
  --ct-color-secondary: #463826;

  /* Ink jobs: link text and focus outlines. The primary on white is 12:1. */
  --ct-color-accent: #263b46;

  --ct-color-bg: #ffffff;
  --ct-color-fg: #1a1a1a;
  --ct-color-muted: #5f6b72;
  --ct-color-border: #d8dcdf;
  --ct-color-surface: #f5f7f8;

  --ct-font-display: 'Mulish', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --ct-font-body: 'Mulish', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --ct-font-secondary: 'Raleway', 'Mulish', system-ui, sans-serif;

  --ct-space-1: 0.25rem;
  --ct-space-2: 0.5rem;
  --ct-space-3: 0.75rem;
  --ct-space-4: 1rem;
  --ct-space-6: 1.5rem;
  --ct-space-8: 2rem;

  --ct-page: 1100px;

  color-scheme: light;
}

/* Follows the operating system, as the product sites do. The header band
   keeps the brand slate with white on it on either ground; only the page
   palette and the link ink move. */
@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;
    --ct-color-accent: #c9d6dd;
    --ct-color-bg: #14181b;
    --ct-color-fg: #e6e6e6;
    --ct-color-muted: #a0a8ae;
    --ct-color-border: #2f3a42;
    --ct-color-surface: #1b2126;
  }
}
