/* ==========================================================================
   Drukulotek.com - CSS Custom Properties
   Polish Flyer Printing Company
   ========================================================================== */

:root {
    /* ---- Brand Colors ---- */
    --color-primary: #606C38;
    --color-primary-dark: #4a5429;
    --color-primary-light: #7a8a4e;
    --color-primary-rgb: 96, 108, 56;

    --color-secondary: #283618;
    --color-secondary-light: #3d4f28;
    --color-secondary-rgb: 40, 54, 24;

    --color-cream: #FEFAE0;
    --color-cream-dark: #f5f0c8;
    --color-cream-rgb: 254, 250, 224;

    --color-accent: #DDA15E;
    --color-accent-dark: #c78a45;
    --color-accent-light: #e8bc85;
    --color-accent-rgb: 221, 161, 94;

    --color-highlight: #BC6C25;
    --color-highlight-dark: #a05b1e;
    --color-highlight-light: #d48a47;
    --color-highlight-rgb: 188, 108, 37;

    /* ---- Neutrals ---- */
    --color-white: #FFFFFF;
    --color-gray-50: #FAFAF5;
    --color-gray-100: #F3F1E8;
    --color-gray-200: #E8E4D4;
    --color-gray-300: #D1CCBA;
    --color-gray-400: #A8A28F;
    --color-gray-500: #7F7A69;
    --color-gray-600: #5C5847;
    --color-gray-700: #3D3A2D;
    --color-gray-800: #2A2820;
    --color-gray-900: #1A1810;

    /* ---- Gradients ---- */
    --gradient-hero: linear-gradient(135deg, #FEFAE0 0%, #FFFFFF 50%, #f5f0c8 100%);
    --gradient-cta: linear-gradient(135deg, #BC6C25 0%, #DDA15E 100%);
    --gradient-footer: linear-gradient(180deg, #283618 0%, #1a2410 100%);

    /* ---- Typography ---- */
    --font-display: 'Outfit', sans-serif;
    --font-body: 'DM Sans', sans-serif;

    /* ---- Layout ---- */
    --container-max: 1280px;
    --section-padding: 5rem;

    /* ---- Spacing Scale ---- */
    --spacing-xs: 0.25rem;
    --spacing-sm: 0.5rem;
    --spacing-md: 1rem;
    --spacing-lg: 1.5rem;
    --spacing-xl: 2rem;
    --spacing-2xl: 3rem;

    /* ---- Border Radius ---- */
    --radius-sm: 0.375rem;
    --radius-md: 0.5rem;
    --radius-lg: 0.75rem;
    --radius-xl: 1rem;
    --radius-pill: 50px;

    /* ---- Shadows ---- */
    --shadow-sm: 0 1px 3px rgba(40, 54, 24, 0.08);
    --shadow-md: 0 4px 12px rgba(40, 54, 24, 0.1);
    --shadow-lg: 0 8px 30px rgba(40, 54, 24, 0.12);
    --shadow-card: 0 2px 8px rgba(40, 54, 24, 0.06);
    --shadow-card-hover: 0 8px 25px rgba(40, 54, 24, 0.15);

    /* ---- Transitions ---- */
    --transition-fast: 150ms ease;
    --transition-base: 300ms ease;
    --transition-slow: 500ms ease;

    /* ---- Z-Index Scale ---- */
    --z-dropdown: 100;
    --z-sticky: 200;
    --z-overlay: 300;
    --z-modal: 9999;
}