/**
 * Eva Granit — Design Tokens
 * CSS custom properties for the entire theme.
 *
 * @package eva-granit
 */

:root {
    /* Colors */
    --color-bg:      #fafafa;
    --color-text:    #1a1a1a;
    --color-primary: #2c2c2c;
    --color-accent:  #8B7355;
    --color-border:  #e0e0e0;
    --color-muted:   #6b6b6b;

    /* ── Aliases used by catalog.css and home.css (Agent A & B) ── */
    --color-primary-dark:  #1a1a1a;          /* darker shade of --color-primary */
    --color-surface:       #ffffff;           /* card / panel background */
    --color-text-muted:    #6b6b6b;          /* alias of --color-muted */

    /* Border radius */
    --radius-sm:   3px;
    --radius-md:   6px;
    --radius-card: 8px;

    /* Transitions */
    --transition-base: 0.2s ease;

    /* Section spacing (home.css) */
    --space-section: 5rem;

    /* Card shadow */
    --shadow-card: 0 1px 4px rgba(0,0,0,.07);

    /* Typography */
    --font-heading: 'PT Serif', Georgia, serif;
    --font-body:    'PT Sans', Arial, sans-serif;

    --font-size-base: 16px;
    --font-size-lg:   1.25rem;
    --font-size-xl:   1.75rem;
    --font-size-2xl:  2.25rem;

    --line-height-body:    1.65;
    --line-height-heading: 1.25;

    /* Spacing */
    --spacing-xs:  0.5rem;
    --spacing-sm:  1rem;
    --spacing-md:  1.5rem;
    --spacing-lg:  2.5rem;
    --spacing-xl:  4rem;
    --spacing-2xl: 6rem;

    /* Layout */
    --max-width:      1280px;
    --max-width-text: 720px;
    --border-radius:  4px;
}

/* Tighter section spacing on mobile (80px → 48px). */
@media (max-width: 768px) {
    :root {
        --space-section: 3rem;
    }
}