/* ============================================
   DESIGN TOKENS - rarescojocariu.ro
   Stil: Dark Theme - inspirat de Salient
   ============================================ */

:root {
    /* === PALETA PRINCIPALA === */
    --color-primary:        #3452ff;   /* Albastru vibrant - accent principal (ca pe site) */
    --color-secondary:      #ffffff;   /* Alb - pentru titluri pe fundal dark */
    --color-accent:         #3452ff;   /* Albastru - hover, highlight-uri */
    --color-accent-alt:     #5b73ff;   /* Albastru deschis - accente secundare */

    /* === NEUTRE (DARK THEME) === */
    --color-bg-light:       #0a0a0a;   /* Negru principal - fundal body */
    --color-bg-dark:        #000000;   /* Negru pur - footer, sectiuni adanci */
    --color-bg-card:        #141414;   /* Gri foarte inchis - carduri, formulare */
    --color-bg-elevated:    #1a1a1a;   /* Gri inchis - elemente ridicate */
    --color-bg-section:     #111111;   /* Fundal sectiuni alternante */
    --color-text-primary:   #ffffff;   /* Alb - text principal */
    --color-text-secondary: #999999;   /* Gri deschis - text secundar */
    --color-text-light:     #ffffff;   /* Alb - text pe accente */
    --color-text-muted:     #666666;   /* Gri mediu - text dezactivat */
    --color-border:         #2a2a2a;   /* Borduri subtile pe dark */

    /* === GRADIENTE === */
    --gradient-hero:        linear-gradient(135deg, #0a0a0a 0%, #111111 50%, #0a0a0a 100%);
    --gradient-card:        linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.85) 100%);
    --gradient-accent:      linear-gradient(90deg, #3452ff 0%, #5b73ff 100%);
    --gradient-dark:        linear-gradient(135deg, #000000 0%, #0a0a0a 100%);

    /* === TIPOGRAFIE === */
    --font-heading:         'Playfair Display', 'Georgia', serif;
    --font-body:            'Inter', 'Helvetica Neue', sans-serif;
    --font-accent:          'Space Grotesk', 'Arial', sans-serif;

    /* === DIMENSIUNI FONT (fluid cu clamp) === */
    --fs-hero:              clamp(2.8rem, 6vw, 5.5rem);
    --fs-h1:                clamp(2rem, 4vw, 3.5rem);
    --fs-h2:                clamp(1.6rem, 3vw, 2.5rem);
    --fs-h3:                clamp(1.2rem, 2vw, 1.75rem);
    --fs-body:              clamp(1rem, 1.2vw, 1.125rem);
    --fs-small:             clamp(0.8rem, 1vw, 0.875rem);
    --fs-caption:           0.75rem;

    /* === SPATIERE === */
    --space-xs:             0.5rem;
    --space-sm:             1rem;
    --space-md:             2rem;
    --space-lg:             4rem;
    --space-xl:             6rem;
    --space-section:        clamp(4rem, 8vw, 8rem);

    /* === LAYOUT === */
    --max-width:            1200px;
    --max-width-narrow:     800px;
    --border-radius:        8px;
    --border-radius-lg:     16px;

    /* === UMBRE (mai intense pe dark) === */
    --shadow-sm:            0 2px 8px rgba(0, 0, 0, 0.3);
    --shadow-md:            0 4px 20px rgba(0, 0, 0, 0.4);
    --shadow-lg:            0 8px 40px rgba(0, 0, 0, 0.5);
    --shadow-color:         0 4px 20px rgba(52, 82, 255, 0.3);

    /* === TRANZITII === */
    --transition-fast:      150ms ease;
    --transition-base:      300ms ease;
    --transition-slow:      500ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
}