/* VARIABLES CSS CUSTOMIZADAS */

:root {
    /* Fonts */
    --font-primary: 'Open Sans';
    --font-secondary: 'Raleway';
    --font-accent: 'Montserrat';

    /* Colors */
    --color-primary: #848484;
    --color-secondary: #F7E0C1;
    --color-text: #333;
    --color-text-light: #777;
    --color-white: #fff;
    --color-black: #000;
    --color-grey: #DDD;
    --color-separator: #999;
    --color-border: #888;

    /* Background */
    --bg-overlay: rgba(255, 255, 255, 0.92);
    --bg-image: url('http://kingofwallpapers.com/leaves/leaves-016.jpg');

    /* Spacing */
    --spacing-xs: 5px;
    --spacing-sm: 10px;
    --spacing-md: 20px;
    --spacing-lg: 40px;
    --spacing-xl: 50px;
    --spacing-xxl: 80px;

    /* Layout */
    --page-width: 90%;
    --page-max-width: 1200px;
    --sidebar-width: 350px;
    --content-padding: 25px 40px 50px;

    /* Transitions */
    --transition-base: 0.35s ease;
    --transition-fast: 0.3s ease;

    /* Breakpoints */
    --mobile: 480px;
    --tablet: 768px;
    --desktop: 1024px;
}