/* ═══════════════════════════════════════════════════
   DELISH — Letní Burger Festival 2025 & 2026
   Design System & Global Styles
   ═══════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,700;0,900;1,400&family=Oswald:wght@400;500;700&family=Inter:wght@400;500;600;700&display=swap');

/* ─── Design Tokens ─── */
:root {
    /* Colors */
    --bg-paper: #f4efe6;
    --bg-dark: #1a1612;
    --bg-section: #faf7f2;
    --bg-section-alt: #f0ebe3;
    --text-main: #1a1a1a;
    --text-muted: #5a5548;
    --text-light: #8a8478;
    --accent-red: #d32f2f;
    --accent-red-dark: #b71c1c;
    --accent-orange: #e65100;
    --accent-gold: #f9a825;
    --accent-amber: #ff8f00;
    --accent-green: #2e7d32;
    --accent-cream: #fff8e1;
    --white: #ffffff;
    --black: #000000;

    /* Typography */
    --font-serif: 'Playfair Display', Georgia, serif;
    --font-sans: 'Oswald', 'Arial Narrow', sans-serif;
    --font-body: 'Inter', -apple-system, sans-serif;

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

    /* Layout */
    --max-width: 600px;
    --border-radius: 12px;
    --border-radius-sm: 8px;
    --border-radius-lg: 20px;

    /* Shadows */
    --shadow-sm: 0 2px 8px rgba(0,0,0,0.08);
    --shadow-md: 0 4px 16px rgba(0,0,0,0.12);
    --shadow-lg: 0 8px 32px rgba(0,0,0,0.16);
    --shadow-glow-red: 0 8px 24px rgba(211,47,47,0.3);
    --shadow-glow-gold: 0 8px 24px rgba(249,168,37,0.3);

    /* Transitions */
    --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);
    --duration-fast: 200ms;
    --duration-normal: 400ms;
    --duration-slow: 800ms;
}

/* ─── Reset ─── */
*, *::before, *::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    -webkit-text-size-adjust: 100%;
}

body {
    background-color: var(--bg-dark);
    color: var(--text-main);
    font-family: var(--font-body);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    display: flex;
    justify-content: center;
    line-height: 1.6;
    overflow-x: hidden;
}

img {
    max-inline-size: 100%;
    block-size: auto;
    display: block;
}

a {
    color: inherit;
    text-decoration: none;
}

/* ─── Utility ─── */
.visually-hidden {
    position: absolute;
    inline-size: 1px;
    block-size: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
