/* ============================================================
   RELL S.R.L. — variables.css
   Design system: token CSS custom properties
   ============================================================ */

:root {
    /* --------------------------------------------------------
       COLORI — Palette industriale premium
    -------------------------------------------------------- */

    /* Background */
    --color-bg:          #0A0C0F;
    --color-surface:     #12151A;
    --color-surface-2:   #1C2028;
    --color-surface-3:   #252B35;

    /* Accento principale: Rame Laser */
    --color-accent:      #C8581A;
    --color-accent-light:#E06B25;
    --color-accent-dark: #A84510;
    --color-accent-glow: rgba(200, 88, 26, 0.15);

    /* Testo */
    --color-text:        #F0F2F5;
    --color-text-muted:  #8A9BB0;
    --color-text-dim:    #5A6A80;

    /* Bordi */
    --color-border:      #2A3040;
    --color-border-light:#3A4555;

    /* Feedback */
    --color-success:     #22C55E;
    --color-error:       #EF4444;
    --color-warning:     #F59E0B;

    /* Metallic */
    --color-silver:      #C0C8D5;
    --color-steel:       #8090A5;

    /* --------------------------------------------------------
       TIPOGRAFIA
    -------------------------------------------------------- */
    --font-display: 'Barlow', sans-serif;
    --font-body:    'Inter', sans-serif;

    /* Scala tipografica */
    --text-xs:   0.75rem;    /* 12px */
    --text-sm:   0.875rem;   /* 14px */
    --text-base: 1rem;       /* 16px */
    --text-lg:   1.125rem;   /* 18px */
    --text-xl:   1.25rem;    /* 20px */
    --text-2xl:  1.5rem;     /* 24px */
    --text-3xl:  2rem;       /* 32px */
    --text-4xl:  2.5rem;     /* 40px */
    --text-5xl:  3.5rem;     /* 56px */
    --text-6xl:  4.5rem;     /* 72px */

    /* Pesi */
    --weight-light:     300;
    --weight-normal:    400;
    --weight-medium:    500;
    --weight-semibold:  600;
    --weight-bold:      700;
    --weight-black:     900;

    /* Interlinea */
    --leading-tight:    1.1;
    --leading-snug:     1.3;
    --leading-normal:   1.5;
    --leading-relaxed:  1.7;

    /* Letterspaziatura */
    --tracking-tight:   -0.02em;
    --tracking-normal:  0em;
    --tracking-wide:    0.05em;
    --tracking-wider:   0.1em;
    --tracking-widest:  0.2em;

    /* --------------------------------------------------------
       SPAZIATURA — Scala 8pt
    -------------------------------------------------------- */
    --space-1:   0.25rem;   /* 4px */
    --space-2:   0.5rem;    /* 8px */
    --space-3:   0.75rem;   /* 12px */
    --space-4:   1rem;      /* 16px */
    --space-5:   1.25rem;   /* 20px */
    --space-6:   1.5rem;    /* 24px */
    --space-8:   2rem;      /* 32px */
    --space-10:  2.5rem;    /* 40px */
    --space-12:  3rem;      /* 48px */
    --space-16:  4rem;      /* 64px */
    --space-20:  5rem;      /* 80px */
    --space-24:  6rem;      /* 96px */
    --space-32:  8rem;      /* 128px */

    /* --------------------------------------------------------
       LAYOUT
    -------------------------------------------------------- */
    --container-sm:   640px;
    --container-md:   768px;
    --container-lg:   1024px;
    --container-xl:   1280px;
    --container-2xl:  1440px;

    --header-height:  90px;
    --header-height-sm: 68px;

    /* --------------------------------------------------------
       BORDI E RAGGI
    -------------------------------------------------------- */
    --radius-sm:   4px;
    --radius-md:   8px;
    --radius-lg:   12px;
    --radius-xl:   16px;
    --radius-full: 9999px;

    /* --------------------------------------------------------
       OMBRE
    -------------------------------------------------------- */
    --shadow-sm:  0 1px 3px rgba(0,0,0,0.4);
    --shadow-md:  0 4px 16px rgba(0,0,0,0.5);
    --shadow-lg:  0 8px 32px rgba(0,0,0,0.6);
    --shadow-xl:  0 16px 64px rgba(0,0,0,0.7);
    --shadow-accent: 0 0 24px rgba(200, 88, 26, 0.25);
    --shadow-accent-sm: 0 0 12px rgba(200, 88, 26, 0.15);

    /* --------------------------------------------------------
       TRANSIZIONI
    -------------------------------------------------------- */
    --transition-fast:   150ms ease;
    --transition-base:   250ms ease;
    --transition-slow:   400ms ease;
    --transition-spring: 300ms cubic-bezier(0.34, 1.56, 0.64, 1);

    /* --------------------------------------------------------
       Z-INDEX
    -------------------------------------------------------- */
    --z-base:    0;
    --z-above:   10;
    --z-dropdown:100;
    --z-sticky:  200;
    --z-overlay: 300;
    --z-modal:   400;
    --z-toast:   500;
}