/**
 * Martkos IT brand tokens — vendored from ~/Development/Code/martkos-it-branding/
 * (tokens/colors.css and tokens/typography.css), 2026-08-09.
 *
 * Vendored rather than imported for one reason: this page runs under
 * `default-src 'none'` with no route to any third party, so it cannot pull tokens —
 * or fonts — over the network at runtime.
 *
 * TWO DELIBERATE DEVIATIONS FROM THE SOURCE, both required here:
 *
 * 1. The `@import url('https://fonts.googleapis.com/...')` at the top of
 *    typography.css is REMOVED. Hot-linking Google Fonts sends the visitor's IP to
 *    Google on page load — on the one page whose entire pitch is that nothing about
 *    the visitor leaves their browser. It would also need `style-src` and `font-src`
 *    opened to two Google hosts and would tick the page's own request counter.
 *    The font *stacks* below are unchanged, so the page renders in the system
 *    fallback the tokens already specify. To get the real faces, self-host the
 *    woff2 files here (Inter, Space Grotesk and JetBrains Mono are all SIL OFL 1.1,
 *    so redistribution is permitted) and add `font-src 'self'` to the policy.
 *
 * 2. Colour *values* are untouched, but this page uses the dark surfaces. The
 *    brand's verified-contrast table is entirely dark-background combinations, and
 *    the guidelines name dark as the default for products. Cyan links and coral
 *    text both fail WCAG AA on white; on navy they pass comfortably.
 *
 * The white-on-coral button label this page originally had to work around was fixed
 * at source on 2026-08-09 — `--color-text-on-primary` is now part of the brand.
 *
 * Keep the variable names identical to the source so a future sync stays mechanical.
 */

:root {
  /* Primary — navy palette */
  --color-navy: #1D3557;
  --color-navy-dark: #0D1B2A;
  --color-navy-light: #2E4A6D;
  --color-navy-rgb: 29, 53, 87;
  --color-navy-dark-rgb: 13, 27, 42;
  --color-navy-light-rgb: 46, 74, 109;

  /* Accents */
  --color-coral: #FF6B6B;
  --color-coral-hover: #ff5252;
  --color-coral-rgb: 255, 107, 107;
  --color-cyan: #00D4FF;
  --color-cyan-hover: #33ddff;
  --color-cyan-rgb: 0, 212, 255;
  --color-lime: #B5FF00;
  --color-lime-rgb: 181, 255, 0;
  --color-purple: #9B5DE5;
  --color-purple-hover: #a96ef0;

  /* Neutrals */
  --color-white: #FFFFFF;
  --color-off-white: #F8F9FA;
  --color-gray-100: #E9ECEF;
  --color-gray-300: #ADB5BD;
  --color-gray-500: #6C757D;
  --color-gray-700: #495057;

  /* Semantic */
  --color-primary: var(--color-coral);
  --color-primary-hover: var(--color-coral-hover);
  --color-text-on-primary: var(--color-navy-dark);
  --color-link: var(--color-cyan);
  --color-link-hover: var(--color-cyan-hover);
  --color-success: var(--color-lime);
  --color-info: var(--color-cyan);
  --color-warning: #FFC107;
  --color-error: #DC3545;

  /* Surfaces, borders */
  --color-bg-dark: var(--color-navy-dark);
  --color-bg-card-dark: var(--color-navy);
  --color-text-on-dark: var(--color-white);
  --color-text-secondary: var(--color-gray-300);
  --color-border-dark: var(--color-navy-light);

  --gradient-hero: linear-gradient(135deg, var(--color-navy) 0%, var(--color-navy-dark) 100%);

  --shadow-dark-md: 0 4px 6px -1px rgba(0, 0, 0, 0.3), 0 2px 4px -1px rgba(0, 0, 0, 0.2);

  --focus-outline: 2px solid var(--color-cyan);
  --focus-offset: 2px;

  /* Typography — stacks as published; the webfont import is deliberately absent. */
  --font-display: 'Space Grotesk', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-body: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace;

  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.25rem;
  --text-2xl: 1.5rem;
  --text-3xl: 1.875rem;
  --text-4xl: 2.25rem;

  --font-normal: 400;
  --font-medium: 500;
  --font-semibold: 600;
  --font-bold: 700;

  --leading-tight: 1.2;
  --leading-normal: 1.4;
  --leading-relaxed: 1.5;
  --leading-loose: 1.6;

  --tracking-tight: -0.025em;
  --tracking-wider: 0.05em;
}