@font-face {
    font-family: "Graphic School";
    src: url("/fonts/GraphicSchool-Regular.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "ETNA";
    src:
        url("/fonts/ETNA-Regular.otf") format("opentype"),
        local("ETNA"),
        local("Etna"),
        local("ETNA Regular"),
        local("Etna Regular");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

:root {
    --color-background: #f7f5ef;
    --color-surface: #fffdf8;
    --color-surface-strong: #f1ede3;
    --color-surface-accent: #eef3eb;
    --color-primary: #9caf88;
    --color-primary-deep: #526a50;
    --color-primary-ink: #304032;
    --color-text: #253129;
    --color-text-muted: #607063;
    --color-border: rgba(82, 106, 80, 0.14);
    --color-border-strong: rgba(82, 106, 80, 0.26);
    --color-shadow: rgba(39, 56, 40, 0.08);
    --radius-sm: 0.9rem;
    --radius-md: 1.35rem;
    --radius-lg: 1.9rem;
    --radius-pill: 999px;
    --space-1: 0.5rem;
    --space-2: 0.75rem;
    --space-3: 1rem;
    --space-4: 1.5rem;
    --space-5: 2rem;
    --space-6: 3rem;
    --space-7: 4.5rem;
    --container-max: 1180px;
    --shadow-sm: 0 12px 30px var(--color-shadow);
    --shadow-md: 0 20px 44px rgba(39, 56, 40, 0.1);
    --font-graphic: "Graphic School", "Cooper Black", "Arial Rounded MT Bold", system-ui, sans-serif;
    --font-secondary: "ETNA", "Nunito", "Aptos Rounded", "Segoe UI Rounded", "Trebuchet MS", "Arial Rounded MT Bold", system-ui, sans-serif;
    --font-rounded: var(--font-secondary);
    --font-sans: var(--font-secondary);
    --font-display: var(--font-graphic);
}