:root {
    /* Surfaces — warm cream tinted toward amber (hue 75) */
    --bg: oklch(0.97 0.006 75);
    --surface: oklch(0.945 0.01 75);
    --surface-raised: oklch(0.985 0.004 75);

    /* Text — warm near-black, tinted brown */
    --text: oklch(0.22 0.02 55);
    --text-secondary: oklch(0.42 0.02 55);
    --text-muted: oklch(0.56 0.015 55);

    /* Accent — earthy sage green */
    --accent: oklch(0.44 0.09 155);
    --accent-hover: oklch(0.38 0.09 155);
    --accent-subtle: oklch(0.94 0.02 155);

    /* Warm accent — terracotta */
    --warm: oklch(0.56 0.13 45);
    --warm-hover: oklch(0.50 0.13 45);
    --warm-subtle: oklch(0.94 0.03 45);

    /* Borders */
    --border: oklch(0.89 0.008 75);
    --border-strong: oklch(0.80 0.012 75);

    /* Spacing (4pt base) */
    --space-xs: 0.25rem;   /* 4px */
    --space-sm: 0.5rem;    /* 8px */
    --space-md: 1rem;      /* 16px */
    --space-lg: 1.5rem;    /* 24px */
    --space-xl: 2rem;      /* 32px */
    --space-2xl: 3rem;     /* 48px */
    --space-3xl: 4rem;     /* 64px */
    --space-4xl: 6rem;     /* 96px */

    /* Typography */
    --font-display: 'Literata', Georgia, serif;
    --font-body: 'Figtree', system-ui, sans-serif;

    /* Layout */
    --max-width: 1080px;
    --nav-height: 4.5rem;
    --radius: 6px;
}

*, *::before, *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    font-size: 100%;
    -webkit-text-size-adjust: 100%;
    font-kerning: normal;
    scroll-behavior: smooth;
}

/* Offset scroll targets for the sticky nav */
[id] {
    scroll-margin-top: calc(var(--nav-height) + var(--space-md));
}

body {
    font-family: var(--font-body);
    font-size: 1rem;
    line-height: 1.6;
    background: var(--bg);
    color: var(--text);
    min-height: 100vh;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

img { display: block; max-width: 100%; }
a { color: inherit; }