:root {
    /* Core palette */
    --color-bg:             hsl(38, 30%, 95%);
    --color-fg:             hsl(30, 10%, 15%);
    --color-primary:        hsl(33, 45%, 42%);
    --color-primary-fg:     hsl(40, 33%, 98%);
    --color-card:           hsl(38, 25%, 93%);
    --color-cream:          hsl(38, 25%, 91%);
    --color-muted:          hsl(40, 15%, 94%);
    --color-muted-fg:       hsl(30, 8%, 50%);
    --color-border:         hsl(35, 15%, 88%);
    --color-sea:            hsl(197, 45%, 42%);
    --color-gold:           hsl(40, 60%, 50%);
    --color-sand:           hsl(38, 35%, 85%);
    --color-warm-white:     hsl(40, 33%, 98%);

    /* Typography */
    --font-serif:           'Playfair Display', Georgia, serif;
    --font-sans:            'DM Sans', system-ui, sans-serif;

    /* Spacing */
    --section-px:           clamp(1.5rem, 5vw, 8rem);
    --section-py:           clamp(5rem, 8vw, 8rem);

    /* Shape */
    --radius:               0.375rem;

    /* Motion */
    --transition-base:      all 0.3s ease;
    --transition-image:     transform 0.7s ease;

    /* Overlays */
    --hero-overlay:         linear-gradient(180deg, hsla(30, 10%, 10%, 0.3) 0%, hsla(30, 10%, 10%, 0.5) 100%);
    --dining-overlay:       linear-gradient(to top, hsla(30, 10%, 10%, 0.88) 0%, hsla(30, 10%, 10%, 0.3) 50%, transparent 75%);
}
