/* ========================================
   VARIABLES CSS - DEPOR PLAZA
   ======================================== */

:root {
    /* ===== COLORES PRINCIPALES ===== */
    --dp-orange: #E8A824;            /* Naranja/Dorado principal */
    --dp-orange-dark: #C48B1A;       /* Naranja oscuro */
    --dp-orange-light: #F2C14E;      /* Naranja claro */
    --dp-black: #1A1A1A;             /* Negro principal */
    --dp-black-soft: #2C2C2C;        /* Negro suave */
    --dp-white: #FFFFFF;             /* Blanco */

    /* ===== COLORES SECUNDARIOS ===== */
    --dp-dark: #1A1A1A;              /* Fondo oscuro */
    --dp-gray: #6C6C6C;             /* Gris medio */
    --dp-gray-light: #F5F5F5;       /* Gris claro fondos */
    --dp-gray-dark: #333333;        /* Gris oscuro */

    /* ===== GRADIENTES ===== */
    --dp-gradient-primary: linear-gradient(90deg, #E8A824 0%, #D4941C 100%);
    --dp-gradient-dark: linear-gradient(180deg, #1A1A1A 0%, #2C2C2C 100%);
    --dp-gradient-overlay: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.7) 100%);

    /* ===== TIPOGRAFIA ===== */
    --dp-font-primary: 'Montserrat', 'Arial', sans-serif;
    --dp-font-secondary: 'Open Sans', 'Helvetica', sans-serif;

    --dp-fs-h1: 3.5rem;
    --dp-fs-h2: 2.5rem;
    --dp-fs-h3: 2rem;
    --dp-fs-h4: 1.5rem;
    --dp-fs-h5: 1.25rem;
    --dp-fs-body-lg: 1.125rem;
    --dp-fs-body: 1rem;
    --dp-fs-body-sm: 0.875rem;

    /* ===== ESPACIADO ===== */
    --dp-spacing-xs: 8px;
    --dp-spacing-sm: 16px;
    --dp-spacing-md: 24px;
    --dp-spacing-lg: 32px;
    --dp-spacing-xl: 48px;
    --dp-spacing-2xl: 64px;

    --dp-section-padding: 60px 0;
    --dp-container-padding: 0 20px;

    /* ===== CONTENEDORES ===== */
    --dp-container-max: 1320px;

    /* ===== BORDES ===== */
    --dp-radius-sm: 6px;
    --dp-radius-md: 10px;
    --dp-radius-lg: 16px;
    --dp-radius-xl: 24px;
    --dp-radius-round: 50%;

    /* ===== SOMBRAS ===== */
    --dp-shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.1);
    --dp-shadow-md: 0 4px 16px rgba(0, 0, 0, 0.15);
    --dp-shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.2);

    /* ===== TRANSICIONES ===== */
    --dp-transition-fast: 0.2s ease;
    --dp-transition-base: 0.3s ease;
    --dp-transition-slow: 0.5s ease;

    /* ===== Z-INDEX ===== */
    --dp-z-dropdown: 1000;
    --dp-z-sticky: 1020;
    --dp-z-fixed: 1030;
    --dp-z-modal: 1050;
}