/* GWEMS tokens. Compiled from the GWEMS design system tokens.json. */

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

:root,
[data-theme="light"] {
  --brand-yellow: #ffd500;
  --brand-black: #000000;
  --brand-gold: #b57f02;
  --brand-white: #ffffff;
  --backdrop-olive: #5c533b;
  --surface: #ffffff;
  --surface-raised: #f5f3ec;
  --ink: #000000;
  --ink-muted: #4a4636;
  --border: #d9d5c6;
  --border-strong: #8a8570;
  --accent: var(--brand-yellow);
  --on-accent: var(--brand-black);
  --accent-edge: #000000;
  --accent-text: #000000;
  --focus-ring: #000000;
  --glow-yellow: 0 0 32px 0 #ffd50080;
  --elevation-1: 0 1px 3px 0 #0000002e;
}

[data-theme="dark"] {
  --surface: #000000;
  --surface-raised: #16150f;
  --ink: #ffffff;
  --ink-muted: #c9c4b0;
  --border: #3a382c;
  --border-strong: #8f8a76;
  --accent: var(--brand-yellow);
  --on-accent: var(--brand-black);
  --accent-edge: #ffd500;
  --accent-text: #ffd500;
  --focus-ring: #ffd500;
}

:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --radius-sm: 2px;
  --radius-md: 4px;
  --radius-lg: 8px;
  --font-display: "Montserrat", "Arial Black", Arial, sans-serif;
  --font-sans: Arial, Helvetica, "Liberation Sans", sans-serif;
}

.display    { font-family: var(--font-display); font-size: 48px; line-height: 52px; font-weight: 800; }
.heading-1  { font-family: var(--font-display); font-size: 32px; line-height: 38px; font-weight: 800; }
.heading-2  { font-family: var(--font-display); font-size: 24px; line-height: 30px; font-weight: 800; }
.label      { font-family: var(--font-display); font-size: 13px; line-height: 18px; font-weight: 600; letter-spacing: 0.04em; }
.title      { font-family: var(--font-sans); font-size: 20px; line-height: 28px; font-weight: 700; }
.subtitle   { font-family: var(--font-sans); font-size: 18.67px; line-height: 26px; font-weight: 700; }
.body       { font-family: var(--font-sans); font-size: 16px; line-height: 24px; font-weight: 400; }
.body-strong{ font-family: var(--font-sans); font-size: 16px; line-height: 24px; font-weight: 700; }
.licence    { font-family: var(--font-sans); font-size: 16px; line-height: 24px; font-weight: 400; font-style: italic; }
.small      { font-family: var(--font-sans); font-size: 14px; line-height: 20px; font-weight: 400; }