@font-face {
    font-family: "Inter";
    font-style: normal;
    font-weight: 400 700;
    font-display: swap;
    src: url("../fonts/inter-latin.woff2") format("woff2");
}

@font-face {
    font-family: "Inter Tight";
    font-style: normal;
    font-weight: 600 700;
    font-display: swap;
    src: url("../fonts/inter-tight-latin.woff2") format("woff2");
}

:root {
    --color-black: #111111;
    --color-orange: #ff6500;
    --color-warm-white: #faf8f5;
    --color-white: #ffffff;
    --color-bg: var(--color-warm-white);
    --color-bg-alt: #f0ede8;
    --color-surface: #ffffff;
    --color-surface-dark: #191919;
    --color-surface-dark-raised: #202020;
    --color-text: #111111;
    --color-text-inverse: #faf8f5;
    --color-text-secondary: #4e4b48;
    --color-text-muted: #6a655d;
    --color-accent: var(--color-orange);
    --color-accent-hover: #dd5700;
    --color-accent-on-light: #b24a00; /* AA-safe orange for small text on light grounds */
    --color-border: #d8d3cc;
    --color-border-dark: #353535;
    --color-card: #ffffff;
    --color-text-on-dark: #b9b5af;
    --color-text-muted-dark: #a7a39d;
    --color-focus: #1473e6;
    --color-success: #167347;
    --color-error: #b42318;

    /* Editorial callouts. Each is AA-safe as small text on --color-bg-alt
       (#f0ede8), the ground every callout sits on: tip 4.70:1, watch-out
       5.08:1, mistake 5.67:1, note 5.92:1. Meaning is carried by an icon and a
       written label as well as by the colour, never by the colour alone. */
    --color-tip: #b24a00;
    --color-warning: #8a5a00;
    --color-mistake: #b42318;
    --color-info: #1f5f8b;

    --font-sans: "Inter Tight", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --font-body: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

    --text-display: clamp(3.5rem, 10vw, 9rem);
    --text-h1: clamp(3rem, 7vw, 7rem);
    --text-h2: clamp(2.4rem, 4vw, 4.25rem);
    --text-h3: clamp(1.5rem, 2.4vw, 2.25rem);
    --text-h4: 1.25rem;
    --text-body-lg: clamp(1.125rem, 1.5vw, 1.375rem);
    --text-body: 1rem;
    --text-small: .875rem;

    --space-1: .25rem;
    --space-2: .5rem;
    --space-3: .75rem;
    --space-4: 1rem;
    --space-5: 1.5rem;
    --space-6: 2rem;
    --space-7: 3rem;
    --space-8: 4rem;
    --space-9: 6rem;
    --space-10: 8rem;
    --section-compact: clamp(3.5rem, 7vw, 6rem);
    --section-standard: clamp(5rem, 10vw, 9rem);
    --section-large: clamp(7rem, 14vw, 13rem);

    --container-max: 90rem;
    --container-narrow: 58rem;
    --gutter: clamp(1.25rem, 4vw, 4rem);
    --radius-sm: .25rem;
    --radius-md: .5rem;
    --radius-lg: 1rem;
    --shadow-card: 0 1.25rem 3.5rem rgba(0, 0, 0, .12);
    --shadow-deep: 0 3.5rem 8rem rgba(0, 0, 0, .62);

    --duration-fast: 140ms;
    --duration-standard: 240ms;
    --duration-slow: 420ms;
    --ease-standard: cubic-bezier(.2, .7, .2, 1);
    --header-height: 5.5rem;
}