/* ===== CSS VARIABLES ===== */
:root {
    /* ===== CULORI PRINCIPALE ===== */
    --primary-color: #d32f2f;
    --primary-dark: #b71c1c;
    --primary-light: #ff6659;
    --color-whatsapp: #25d366;
    --color-green: #4caf50;
    --color-blue: #1976d2;

    /* ===== CULORI NEUTRE ===== */
    --text-primary: #2c3e50;
    --text-secondary: #555;
    --text-light: #bbb;
    --bg-light: #f8f9fa;
    --bg-white: #ffffff;
    --border-color: rgba(0, 0, 0, 0.1);

    /* ===== DIMENSIUNI LAYOUT ===== */
    --header-height: 100px;
    --header-height-mobile: 80px;
    --max-container-width: 1400px;
    --section-padding: 5rem;
    --section-padding-mobile: 3rem;

    /* ===== BREAKPOINTS ===== */
    --mobile: 480px;
    --tablet: 768px;
    --desktop: 1200px;
    --desktop-xl: 1600px;

    /* ===== EFECTE VISUALE ===== */
    --shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.1);
    --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.15);
    --shadow-lg: 0 8px 25px rgba(0, 0, 0, 0.2);
    --shadow-primary: 0 4px 15px rgba(211, 47, 47, 0.3);
    --border-radius-sm: 4px;
    --border-radius-md: 8px;
    --border-radius-lg: 16px;
    --border-radius-xl: 24px;



    /* ===== STRATIFICARE (z-index) ===== */
    --z-base: 1;
    --z-low: 10;
    --z-mid: 100;
    --z-high: 1000;
    --z-header: var(--z-high);             /* 1000 */
    --z-hero-video: calc(var(--z-high) - 5); /* 995 */
    --z-hero-overlay: var(--z-high);       /* 1000 */
    --z-hero-content: calc(var(--z-high) + 1); /* 1001 */
    --z-overlay: 1010;
    --z-modal: 1020;
    --z-tooltip: 1030;
    --z-notification: 1040;

    /* ===== VALORI RGB PENTRU EFECTE ===== */
    --primary-color-rgb: 211, 47, 47;
    --black-rgb: 0, 0, 0;
    --white-rgb: 255, 255, 255;



/* ===== MEDIA QUERIES PENTRU VARIABILE ===== */
@media (max-width: 768px) {
    :root {
        --header-height: var(--header-height-mobile);
        --section-padding: var(--section-padding-mobile);
    }
  }
}