/*
 * Elgin Organic design tokens: the single source of colour, type, shape and depth.
 *
 * WHY THIS FILE EXISTS
 * Elgin Organic is one of the Country Corn Australia brands, alongside
 * Harvestime, Berryfields, Frozberries and CWFD. Those sites share one design
 * language: an editorial serif for headings (Fraunces), Inter for reading text,
 * warm off-white pages, three corner radii and soft tinted shadows. This file
 * gives Elgin Organic the same system in its own colours (organic leaf green
 * with kraft-paper warmth, taken from the packaging). Names mirror Harvestime's
 * --hv-* and Berryfields' --bf-* so a change can be carried across 1:1.
 *
 * Never put raw hex colours in a page stylesheet; add a token here.
 */
:root {
    /* Brand greens */
    --eo-green: #1d7a32;          /* primary: buttons, links (5.4:1 on white) */
    --eo-green-deep: #135a24;     /* hover / pressed, dark panels */
    --eo-green-bright: #2bae2b;   /* logo green: fills, icons, dots. NOT for text on white */
    --eo-sprout: #edf6e8;         /* tinted chips and panels */
    --eo-moss: #d5e8cc;           /* borders on tinted panels */

    /* Family accent: Harvestime forest + kraft paper from the Elgin bags */
    --eo-leaf: #0c4437;
    --eo-kraft: #b88b4a;          /* on dark or as fills only */
    --eo-kraft-soft: #f4ebdc;     /* warm panels */

    /* Neutrals: warm, faintly green-tinted */
    --eo-ink: #16261a;            /* headings */
    --eo-body: #3a473d;           /* paragraph text (9.9:1) */
    --eo-muted: #5f6b62;          /* secondary text (5.6:1) */
    --eo-line: #e3e8df;           /* borders */
    --eo-line-soft: #eef1ea;
    --eo-wash: #f5f6ef;           /* section backgrounds */
    --eo-cream: #fbfaf5;          /* page background */
    --eo-white: #ffffff;
    --eo-night: #0f2116;          /* footer */

    /* Type: same pairing as Harvestime and Berryfields */
    --eo-font-display: "Fraunces", Georgia, "Times New Roman", serif;
    --eo-font-body: "Inter", "Helvetica Neue", Arial, sans-serif;

    /* Shape: three radii only */
    --eo-radius-sm: 12px;         /* buttons, inputs, chips */
    --eo-radius: 20px;            /* cards */
    --eo-radius-lg: 28px;         /* large panels and heroes */

    /* Depth */
    --eo-shadow-sm: 0 1px 2px rgba(22, 38, 26, 0.05), 0 6px 16px rgba(22, 38, 26, 0.06);
    --eo-shadow: 0 1px 2px rgba(22, 38, 26, 0.04), 0 16px 38px rgba(22, 38, 26, 0.08);
    --eo-shadow-lg: 0 2px 4px rgba(22, 38, 26, 0.05), 0 28px 60px rgba(22, 38, 26, 0.13);
    --eo-shadow-green: 0 8px 20px rgba(29, 122, 50, 0.24);
    --eo-focus: 0 0 0 3px rgba(43, 174, 43, 0.45);
    --eo-scrim: rgba(15, 33, 22, 0.5);
    --eo-glass: rgba(251, 250, 245, 0.92);

    /* Type scale: identical to Harvestime so headings match across sites */
    --eo-fs-h1: clamp(36px, 4.4vw, 64px);
    --eo-fs-h2: clamp(28px, 3vw, 44px);
    --eo-fs-h3: clamp(19px, 1.5vw, 22px);
    --eo-fs-lead: clamp(17px, 1.3vw, 19px);
    --eo-fs-body: 16px;
    --eo-fs-sm: 15px;
    --eo-fs-xs: 13px;             /* the floor for readable text */
    --eo-fs-eyebrow: 12px;
    --eo-lh-heading: 1.08;
    --eo-lh-body: 1.65;

    --eo-container: 1240px;
    --eo-gutter: clamp(16px, 4vw, 32px);
    --eo-section: clamp(56px, 8vw, 112px);

    /* Legacy v1 names still used by style.css and saved page content */
    --eo-primary: var(--eo-green);
    --eo-primary-dark: var(--eo-green-deep);
    --eo-primary-light: var(--eo-green-bright);
    --eo-primary-rgb: 29, 122, 50;
    --eo-secondary: var(--eo-ink);
    --eo-secondary-light: var(--eo-body);
    --eo-text-dark: var(--eo-ink);
    --eo-text-medium: var(--eo-muted);
    --eo-bg-light: var(--eo-wash);
}

::selection {
    background: var(--eo-moss);
    color: var(--eo-ink);
}

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
    outline: none;
    box-shadow: var(--eo-focus);
    border-radius: 6px;
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}