/* =========================================================
   VARIABILE CSS GLOBALE — INNOVATIVA
   ========================================================= */

:root {
    /* ── Culori brand ───────────────────────────────────── */
    --color-navy:      #313959;
    --color-pink:      #eb2d5c;
    --color-white:     #ffffff;
    --color-bg:        #f7f7f5;

    /* Variante navy */
    --color-navy-dark:  #232840;
    --color-navy-light: #3f4a73;
    --color-navy-08:    rgba(49, 57, 89, 0.08);
    --color-navy-15:    rgba(49, 57, 89, 0.15);
    --color-navy-40:    rgba(49, 57, 89, 0.65);

    /* Variante pink */
    --color-pink-dark:  #c9244e;
    --color-pink-light: #ff4d75;
    --color-pink-10:    rgba(235, 45, 92, 0.09);
    --color-pink-20:    rgba(235, 45, 92, 0.18);

    /* ── Tipografie ─────────────────────────────────────── */
    --font-heading:  'Abril Fatface', serif;
    --font-body:     'DM Sans', sans-serif;

    --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:  1.875rem;   /* 30px */
    --text-4xl:  2.25rem;    /* 36px */
    --text-5xl:  3rem;       /* 48px */
    --text-6xl:  3.75rem;    /* 60px */

    --leading-tight:  1.15;
    --leading-snug:   1.35;
    --leading-base:   1.6;
    --leading-loose:  1.8;

    --weight-regular:   400;
    --weight-medium:    500;
    --weight-bold:      700;
    --weight-extrabold: 800;

    /* ── Spacing ────────────────────────────────────────── */
    --sp-1:  0.25rem;   /*  4px */
    --sp-2:  0.5rem;    /*  8px */
    --sp-3:  0.75rem;   /* 12px */
    --sp-4:  1rem;      /* 16px */
    --sp-5:  1.25rem;   /* 20px */
    --sp-6:  1.5rem;    /* 24px */
    --sp-8:  2rem;      /* 32px */
    --sp-10: 2.5rem;    /* 40px */
    --sp-12: 3rem;      /* 48px */
    --sp-14: 3.5rem;    /* 56px */
    --sp-16: 4rem;      /* 64px */

    --space-section: 4.5rem;    /* 72px — padding vertical secțiuni */
    --space-inner:   3rem;      /* 48px — padding orizontal intern */

    /* ── Layout ─────────────────────────────────────────── */
    --max-width:         1280px;
    --max-width-narrow:  760px;
    --container-px:      1.5rem;  /* padding inline container */

    /* ── Border radius ──────────────────────────────────── */
    --radius-sm:      4px;
    --radius-btn:     8px;
    --radius-card:    14px;
    --radius-card-lg: 18px;
    --radius-badge:   30px;
    --radius-full:    9999px;

    /* ── Shadows ────────────────────────────────────────── */
    --shadow-sm: 0 1px 4px var(--color-navy-08);
    --shadow-md: 0 4px 20px var(--color-navy-08), 0 1px 6px var(--color-navy-08);
    --shadow-lg: 0 8px 40px rgba(49, 57, 89, 0.12), 0 2px 10px var(--color-navy-08);
    --shadow-xl: 0 20px 60px rgba(49, 57, 89, 0.14);

    /* ── Transitions ────────────────────────────────────── */
    --ease:      cubic-bezier(0.4, 0, 0.2, 1);
    --trans-fast: 150ms var(--ease);
    --trans-base: 250ms var(--ease);
    --trans-slow: 400ms var(--ease);

    /* ── Z-index ────────────────────────────────────────── */
    --z-header:  100;
    --z-overlay: 200;
    --z-modal:   300;
}
