/* ==========================================================================
   Design System — apphamza.com
   Thème : sombre anthracite + accent or doux
   ========================================================================== */

:root {
    /* ---- Couleurs : base sombre ---- */
    --bg:           #14110F;   /* charbon profond */
    --bg-2:         #100D0B;   /* plus sombre (sections alternées) */
    --surface:      #1C1916;   /* cartes / surfaces */
    --surface-2:    #241F1A;   /* surfaces survolées */
    --line:         rgba(237, 232, 225, 0.09);  /* filets / séparateurs */
    --line-strong:  rgba(237, 232, 225, 0.16);

    /* ---- Texte ---- */
    --text:         #EDE8E1;   /* ivoire */
    --text-muted:   #A79E92;   /* texte secondaire */
    --text-faint:   #6F675D;   /* labels discrets */

    /* ---- Accent : or doux ---- */
    --accent:       #C9A24B;
    --accent-soft:  #DDB968;
    --accent-deep:  #8A6D2F;
    --accent-glow:  rgba(201, 162, 75, 0.16);
    --accent-line:  rgba(201, 162, 75, 0.32);

    /* ---- États ---- */
    --success:      #6FBF8B;
    --error:        #E08A7B;

    /* ---- Typographie ---- */
    --font-serif: 'Fraunces', 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
    --font-sans:  'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
    --font-ar:    'Tajawal', 'IBM Plex Sans Arabic', system-ui, sans-serif;

    /* Échelle typographique fluide (clamp : min, préféré, max) */
    --fs-xs:   0.78rem;
    --fs-sm:   0.875rem;
    --fs-base: 1rem;
    --fs-md:   clamp(1.05rem, 0.98rem + 0.35vw, 1.2rem);
    --fs-lg:   clamp(1.25rem, 1.1rem + 0.7vw, 1.6rem);
    --fs-xl:   clamp(1.6rem, 1.3rem + 1.4vw, 2.4rem);
    --fs-2xl:  clamp(2.1rem, 1.6rem + 2.4vw, 3.4rem);
    --fs-3xl:  clamp(2.6rem, 1.8rem + 3.8vw, 5rem);

    --lh-tight:   1.1;
    --lh-snug:    1.25;
    --lh-normal:  1.6;
    --lh-relaxed: 1.75;

    /* ---- Espacements (échelle 4/8) ---- */
    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-5: 1.5rem;
    --space-6: 2rem;
    --space-7: 3rem;
    --space-8: 4rem;
    --space-9: 6rem;
    --space-10: 8rem;

    /* Rythme vertical des sections (fluide) */
    --section-y: clamp(4rem, 2.5rem + 7vw, 9rem);

    /* ---- Layout ---- */
    --container:      1200px;
    --container-wide: 1320px;
    --container-text: 760px;
    --gutter: clamp(1.25rem, 0.8rem + 2vw, 2.5rem);

    /* ---- Rayons ---- */
    --radius-sm: 6px;
    --radius:    14px;
    --radius-lg: 22px;
    --radius-full: 999px;

    /* ---- Ombres ---- */
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
    --shadow:    0 18px 40px -24px rgba(0, 0, 0, 0.7);
    --shadow-lg: 0 40px 80px -40px rgba(0, 0, 0, 0.8);

    /* ---- Transitions ---- */
    --ease:        cubic-bezier(0.4, 0, 0.2, 1);
    --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
    --t-fast:      0.18s var(--ease);
    --t:           0.3s var(--ease);
    --t-slow:      0.6s var(--ease-out);

    /* ---- Divers ---- */
    --header-h: 76px;
    --z-header: 100;
    --z-menu:   200;
    --z-top:    300;
}
