/*
 * tokens.css — the OpenWorkerAI design tokens.
 *
 * This is the ONLY file that carries brand values. bridge.css, components.css,
 * public-shell.css and home.css read these variable names and nothing else, so
 * the whole site re-skins from here.
 *
 * ---------------------------------------------------------------------------
 * COLOUR: derived from the Fleet Manager SPA (app.css:15 — indigo #4f46e5,
 * teal #06b6d4, ink #1f2937), but NOT copied from it. The Manager's hero ramp
 * cannot ship on a public site:
 *
 *     white on #06b6d4  =  2.43:1   <- FAILS WCAG AA (needs 4.5:1)
 *
 * A gradient also cannot be validated by checking its stops in isolation: which
 * stop sits under a given glyph changes with viewport width, and at 390px the
 * hero copy spans the entire ramp. So the ramp below is chosen such that EVERY
 * stop clears AA on its own, which makes the hero safe at any width.
 *
 *   white on #312e81  = 11.4:1   (hero gradient start)
 *   white on #4f46e5  =  6.3:1   (brand / hero gradient mid)
 *   white on #0e7490  =  5.4:1   (hero gradient end)
 *
 * Body text pairs, all AA or better:
 *   #1f2937 ink        on #ffffff  = 14.7:1
 *   #4b5563 muted      on #ffffff  =  7.5:1   / on #eef1f7 = 6.6:1
 *   #6b7280 muted-sub  on #ffffff  =  4.8:1
 *   #4f46e5 brand      on #ffffff  =  6.3:1   (link colour)
 *   #3730a3 brand-deep on #ffffff  =  9.9:1   (link hover, .owai-action--light)
 *
 * NOTE the source design system shipped a muted grey of #667085, which fails AA
 * on its own subtle surface (~4.4:1). That is corrected here rather than inherited.
 *
 * ---------------------------------------------------------------------------
 * TYPE: a system font stack, deliberately. There are no font files in either
 * repo, the build restores offline, and the site's performance budget forbids
 * third-party requests — so pulling Inter/Manrope from the Google Fonts CDN (as
 * the source theme does) is not available to us. Swapping in a self-hosted face
 * later is a one-line change to the three --owai-font-* tokens plus an @font-face
 * block; nothing else in the system needs to know.
 */
:root {
    /* ---- Colour: surfaces and ink ---- */
    --owai-canvas: #f5f7fb;
    --owai-surface: #ffffff;
    --owai-surface-subtle: #eef1f7;
    --owai-surface-selected: #eef2ff;
    --owai-ink: #1f2937;
    --owai-ink-strong: #111827;
    --owai-muted: #4b5563;
    --owai-muted-subtle: #6b7280;
    /* Decorative keylines. No contrast requirement — they never carry meaning alone. */
    --owai-border: #d0d5dd;
    /* Perceivable control boundaries. WCAG 1.4.11 wants >= 3:1 for UI component
       edges; #6b7280 is 4.8:1 on white. site.css binds form controls to this. */
    --owai-border-strong: #6b7280;

    /* ---- Colour: brand ---- */
    --owai-brand: #4f46e5;
    --owai-brand-deep: #3730a3;
    --owai-brand-tint: #eef2ff;
    --owai-accent-light: #818cf8;
    --owai-hero-grad-start: #312e81;
    --owai-hero-grad-mid: #4f46e5;
    --owai-hero-grad-end: #0e7490;

    /* ---- Colour: semantic (inherited unchanged — all AA on white) ---- */
    --owai-information: #175cd3;
    --owai-information-tint: #eaf2ff;
    --owai-positive: #087d62;
    --owai-positive-tint: #e7f6ef;
    --owai-warning: #a15c07;
    --owai-warning-tint: #fff4df;
    --owai-critical: #b42318;
    --owai-critical-tint: #fff0ef;

    /* ---- Typography ---- */
    --owai-font-ui: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --owai-font-body: var(--owai-font-ui);
    --owai-font-display: var(--owai-font-ui);
    --owai-text-12: 0.75rem;
    --owai-text-14: 0.875rem;
    --owai-text-16: 1rem;
    --owai-text-18: 1.125rem;
    --owai-text-20: 1.25rem;
    --owai-text-24: 1.5rem;
    --owai-text-32: 2rem;
    --owai-display: clamp(2.5rem, 5vw, 3.5rem);
    --owai-leading-tight: 1.12;
    --owai-leading-body: 1.55;
    --owai-tracking-caps: 0.08em;

    /* ---- Space ---- */
    --owai-space-1: 0.25rem;
    --owai-space-2: 0.5rem;
    --owai-space-3: 0.75rem;
    --owai-space-4: 1rem;
    --owai-space-5: 1.25rem;
    --owai-space-6: 1.5rem;
    --owai-space-7: 1.75rem;
    --owai-space-8: 2rem;
    --owai-space-9: 2.25rem;
    --owai-space-10: 2.5rem;
    --owai-space-12: 3rem;

    /* ---- Shape and elevation ----
       Soft-elevated, matching the Fleet Manager's existing feel (rounded cards,
       soft navy-tinted shadows) rather than the source theme's flat-keyline brand. */
    --owai-radius-control: 0.625rem;
    --owai-radius-panel: 1rem;
    --owai-radius-hero: 1.5rem;
    --owai-radius-pill: 999px;
    --owai-shadow-panel: 0 1px 2px rgb(20 30 80 / 0.04), 0 1px 3px rgb(20 30 80 / 0.06);
    --owai-shadow-raised: 0 12px 24px rgb(20 30 80 / 0.10), 0 3px 6px rgb(20 30 80 / 0.06);

    /* ---- Component divergence ----
       The shared sheets read these to decide card and eyebrow shape without
       forking. Soft-elevated cards, pill eyebrows, tighter display heading. */
    --owai-card-elevation: 0 1px 2px rgb(20 30 80 / 0.05), 0 12px 28px rgb(20 30 80 / 0.07);
    --owai-card-border: 1px solid var(--owai-border);
    --owai-card-radius: var(--owai-radius-panel);
    --owai-eyebrow-transform: uppercase;
    --owai-eyebrow-variant: normal;
    --owai-eyebrow-underline: none;
    --owai-h1-size: clamp(2.125rem, 4.4vw, 3rem);
    --owai-h1-tracking: -0.03em;

    /* ---- Motion, layout, interaction ---- */
    --owai-motion-fast: 140ms;
    --owai-motion-base: 200ms;
    --owai-ease-standard: cubic-bezier(0.2, 0, 0, 1);
    --owai-page-max: 80rem;
    --owai-content-max: 68rem;
    --owai-touch-target: 2.75rem;
    --owai-z-sticky: 1020;
    --owai-z-drawer: 1040;
}

@media (prefers-reduced-motion: reduce) {
    :root {
        --owai-motion-fast: 0ms;
        --owai-motion-base: 0ms;
    }
}