/* Hallmark · tokens · studied-DNA build
 * source: https://ge.globo.com/motor/formula-1/guia-da-f1-2026/
 * paper: oklch(13% 0 0) · accent: oklch(58% 0.18 145)
 */

:root {
    /* Color — studied from F1 2026 */
    --color-paper:      oklch(13% 0 0);
    --color-paper-2:    oklch(17% 0 0);
    --color-paper-3:    oklch(22% 0 0);
    --color-ink:        oklch(98% 0 0);
    --color-ink-soft:   oklch(72% 0 0);
    --color-ink-mute:   oklch(52% 0 0);
    --color-rule:       oklch(25% 0 0);
    --color-accent:     oklch(58% 0.18 145);
    --color-accent-ink: oklch(13% 0 0);
    --color-link:       oklch(60% 0.21 250);
    --color-warn:       oklch(72% 0.16 75);
    --color-focus:      oklch(85% 0.18 145);
    --color-error:      oklch(65% 0.22 25);
    --color-success:    oklch(70% 0.18 145);

    /* Typography */
    --font-display: "Bebas Neue", "Arial Narrow", sans-serif;
    --font-heading: "Rajdhani", "Inter", sans-serif;
    --font-body:    "Open Sans", system-ui, sans-serif;

    --text-display:   clamp(72px, 14vw, 224px);
    --text-display-s: clamp(48px, 8vw, 120px);
    --text-4xl:       clamp(40px, 5vw, 72px);
    --text-3xl:       clamp(28px, 3vw, 40px);
    --text-2xl:       24px;
    --text-xl:        20px;
    --text-lg:        18px;
    --text-base:      18px;
    --text-sm:        14px;
    --text-xs:        12px;

    --leading-tight:  1.05;
    --leading-snug:   1.25;
    --leading-body:   1.6;

    --tracking-display: -0.01em;
    --tracking-caps:    0.18em;

    /* Spacing — 4pt scale */
    --space-1:   4px;
    --space-2:   8px;
    --space-3:   12px;
    --space-4:   16px;
    --space-5:   24px;
    --space-6:   32px;
    --space-7:   48px;
    --space-8:   64px;
    --space-9:   96px;
    --space-10:  128px;
    --space-11:  192px;

    /* Shape */
    --radius-0: 0;
    --rule-1:   1px solid var(--color-rule);
    --rule-2:   2px solid var(--color-ink);
    --rule-accent: 2px solid var(--color-accent);

    /* Motion */
    --ease-out:    cubic-bezier(0.22, 1, 0.36, 1);
    --ease-in:     cubic-bezier(0.55, 0, 1, 0.45);
    --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
    --dur-fast:    150ms;
    --dur-base:    280ms;
    --dur-slow:    520ms;

    /* Layout */
    --measure:       72ch;
    --container:     1240px;
    --container-narrow: 880px;
}
