/* ==========================================================
   THE ECONOMY OF WELLBEING — design tokens
   carstenlinnemann.com
   ========================================================== */
:root {
    /* Primary */
    --forest: #164A3A;
    --pine: #0D3028;
    --limestone: #EEE9DE;
    --graphite: #292B28;

    /* Secondary */
    --turquoise: #71AAA1;
    --citrus: #D9A441;
    --sage: #A8B59D;
    --mint: #DCE7DF;
    --warm-grey: #B8B5AB;
    --paper: #FAF9F5;

    /* Accent (sparingly) */
    --orange: #C96F45;

    /* Derived, contrast-safe text tones */
    --ink: #1E201D;               /* body text on light grounds   */
    --ink-soft: #4A4F48;          /* secondary text, 7.6:1 on paper */
    --forest-ink: #123D30;        /* links on light grounds        */
    --turquoise-ink: #2F6B62;     /* turquoise for text on light   */
    --citrus-ink: #8A6216;        /* citrus for text on light      */
    --orange-ink: #9A4B26;        /* orange for text on light      */
    --on-dark: #F3F1EA;           /* text on pine / forest         */
    --on-dark-soft: #C9D4CC;      /* secondary text on dark        */
    --rule: #CFC9BB;              /* thin technical rules          */
    --rule-dark: rgba(243, 241, 234, .22);

    /* Typography */
    --font-sans: "Manrope", "Inter", "Helvetica Neue", Arial, system-ui, sans-serif;
    --font-serif: "Source Serif 4", "Source Serif Pro", Georgia, "Times New Roman", serif;
    --font-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;

    --fs-xs: .75rem;
    --fs-sm: .875rem;
    --fs-base: 1.0625rem;
    --fs-md: 1.25rem;
    --fs-lg: clamp(1.4rem, 1.1rem + 1vw, 1.85rem);
    --fs-xl: clamp(1.9rem, 1.3rem + 2.2vw, 3rem);
    --fs-2xl: clamp(2.4rem, 1.4rem + 4vw, 4.75rem);
    --fs-3xl: clamp(3rem, 1.2rem + 7vw, 8rem);
    --fs-num: clamp(2.8rem, 1.6rem + 4.5vw, 6rem);

    /* Layout */
    --wrap: 1320px;
    --gutter: clamp(16px, 4vw, 48px);
    --space-1: .5rem;
    --space-2: 1rem;
    --space-3: 1.5rem;
    --space-4: 2.5rem;
    --space-5: clamp(3rem, 2rem + 4vw, 6rem);
    --space-6: clamp(4rem, 2.5rem + 6vw, 9rem);

    --strip-h: 30px;
    --nav-h: 64px;
    --header-h: calc(var(--strip-h) + var(--nav-h));

    --radius: 2px;
    --ease: cubic-bezier(.2, .7, .2, 1);
}