/* TAKE TECH brand layer — navy + gold from the original charte, mapped onto the Modernist tokens. Link AFTER the DS stylesheet. */
:root {
  --color-bg: #f5f6f9;
  --color-surface: #e9ecf3;
  --color-text: #0e1e3d;
  --color-accent: #f5b301;
  --color-accent-2: #24407a;
  --color-divider: color-mix(in srgb, #0e1e3d 32%, transparent);

  --color-neutral-100: #f6f7fa; --color-neutral-200: #e7eaf0; --color-neutral-300: #d2d7e1;
  --color-neutral-400: #b3bac8; --color-neutral-500: #939bad; --color-neutral-600: #757e92;
  --color-neutral-700: #586176; --color-neutral-800: #3d455a; --color-neutral-900: #262d40;

  /* gold */
  --color-accent-100: #fff8e1; --color-accent-200: #ffecb3; --color-accent-300: #ffdd73;
  --color-accent-400: #ffcc33; --color-accent-500: #f5b301; --color-accent-600: #d99a00;
  --color-accent-700: #8f6200; --color-accent-800: #6b4a00; --color-accent-900: #3d2a00;

  /* navy */
  --color-accent-2-100: #eef2fa; --color-accent-2-200: #d6dff0; --color-accent-2-300: #aebfe0;
  --color-accent-2-400: #7690c4; --color-accent-2-500: #3d5a99; --color-accent-2-600: #24407a;
  --color-accent-2-700: #172e5c; --color-accent-2-800: #0e1e3d; --color-accent-2-900: #08132a;

  --shadow-sm: 0 1px 2px color-mix(in srgb, #0e1e3d 14%, transparent);
  --shadow-md: 0 3px 10px color-mix(in srgb, #0e1e3d 16%, transparent);
  --shadow-lg: 0 12px 32px color-mix(in srgb, #0e1e3d 24%, transparent);
}
/* gold fills carry navy type; gold isn't readable as text on the light ground */
.btn-primary { color: var(--color-text); }
.btn-primary:hover { color: var(--color-text); }
a { color: var(--color-accent-2-600); }
a:hover { color: var(--color-accent-700); }
:focus-visible { outline-color: var(--color-accent-2-500); }
::selection { background: var(--color-accent-300); color: var(--color-text); }
.seg-opt:has(input:checked) { color: var(--color-text); }