/* Nashe Pravo :: Kyiv Steel design tokens */

:root {
    /* Core palette */
    --midnight-command: #0D1B2A;
    --steel-deep: #141E2C;
    --steel-mid: #1B2735;
    --steel-line: #263445;
    --steel-edge: #32465C;

    --ink-primary: #E8ECF1;
    --ink-secondary: #9BA7B8;
    --ink-muted: #64748B;

    --ukrainian-gold: #D4A843;
    --ukrainian-blue: #0057B7;
    --ukrainian-yellow: #FFD700;

    --signal-red: #C8412B;
    --signal-amber: #E8953A;
    --signal-yellow: #E8C83A;
    --signal-green: #3A8C5C;

    --accent-gold: var(--ukrainian-gold);

    /* Semantic */
    --bg-page: var(--midnight-command);
    --bg-surface: var(--steel-deep);
    --bg-raised: var(--steel-mid);
    --bg-inset: var(--steel-line);
    --border-subtle: var(--steel-line);
    --border-strong: var(--steel-edge);
    --text-primary: var(--ink-primary);
    --text-secondary: var(--ink-secondary);
    --text-muted: var(--ink-muted);

    /* Type */
    --font-display: "Playfair Display", Georgia, "Times New Roman", serif;
    --font-serif: "Source Serif 4", Georgia, "Times New Roman", serif;
    --font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;
    --font-mono: "JetBrains Mono", "SF Mono", Menlo, Monaco, Consolas, monospace;

    --fs-hero: clamp(2.25rem, 3vw + 1.5rem, 4.25rem);
    --fs-h1: clamp(1.875rem, 2vw + 1rem, 3rem);
    --fs-h2: clamp(1.5rem, 1.5vw + 0.85rem, 2.25rem);
    --fs-h3: clamp(1.25rem, 1vw + 0.75rem, 1.625rem);
    --fs-body: 1.0625rem;
    --fs-small: 0.875rem;
    --fs-kicker: 0.75rem;

    --lh-tight: 1.15;
    --lh-snug: 1.35;
    --lh-normal: 1.6;
    --lh-loose: 1.75;

    /* Spacing (8pt grid) */
    --s-1: 0.25rem;
    --s-2: 0.5rem;
    --s-3: 0.75rem;
    --s-4: 1rem;
    --s-5: 1.25rem;
    --s-6: 1.5rem;
    --s-8: 2rem;
    --s-10: 2.5rem;
    --s-12: 3rem;
    --s-16: 4rem;
    --s-20: 5rem;

    /* Layout */
    --container-max: 1280px;
    --container-pad: clamp(1rem, 3vw, 2.5rem);
    --radius-sm: 2px;
    --radius-md: 4px;
    --radius-lg: 8px;

    /* Motion */
    --t-fast: 150ms ease;
    --t-base: 250ms ease;
}

[data-color-mode="light"] {
    --bg-page: #F4F6F9;
    --bg-surface: #FFFFFF;
    --bg-raised: #FFFFFF;
    --bg-inset: #E7ECF2;
    --border-subtle: #D9DFE7;
    --border-strong: #B6C0CD;
    --text-primary: #0D1B2A;
    --text-secondary: #3A4A5E;
    --text-muted: #64748B;
}
