/* =====================================================================
   tokens.css — design tokens rvm-machine.org
   Inspiration Tomra : bleu/turquoise primaire + 4 quadrants pastel
   ===================================================================== */

:root {
    /* Brand — bleu turquoise (transactionnel) */
    --brand-primary:   #0EA5E9;
    --brand-primary-d: #0284C7;
    --brand-primary-l: #38BDF8;
    --brand-accent:    #06B6D4;
    --brand-accent-d:  #0891B2;

    /* Brand institutionnel — navy profond (autorité) */
    --brand-institutional:    #0B2545;   /* Navy ardoise */
    --brand-institutional-d:  #061830;
    --brand-institutional-l:  #1A3A5C;
    --brand-gold:             #C8A35A;   /* Or sobre — accent éditorial */
    --brand-gold-d:           #A88947;
    --brand-ivory:            #FAF7F0;   /* Ivoire — fond éditorial */
    --brand-cream:            #F5EFE0;

    --brand-dark:      #0F172A;
    --brand-darker:    #020617;

    /* Quadrants Tomra-inspired (homepage hero) */
    --quad-pink:  #F9C5D1;
    --quad-blue:  #BFE3F2;
    --quad-teal:  #7AD7C4;
    --quad-sage:  #B9D4B3;
    --quad-pink-d: #F4A2B3;
    --quad-blue-d: #99CFE6;
    --quad-teal-d: #5BC4AF;
    --quad-sage-d: #9DC397;

    /* Neutrals */
    --c-bg:        #FFFFFF;
    --c-bg-soft:   #F8FAFC;
    --c-bg-mute:   #F1F5F9;
    --c-border:    #E2E8F0;
    --c-border-d:  #CBD5E1;
    --c-text:      #1E293B;
    --c-text-mute: #64748B;
    --c-text-soft: #94A3B8;

    /* Status */
    --c-success: #10B981;
    --c-warning: #F59E0B;
    --c-danger:  #EF4444;
    --c-info:    #3B82F6;

    /* Type */
    --font-body:    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --font-title:   'Space Grotesk', 'Inter', sans-serif;
    --font-display: 'Fraunces', 'Space Grotesk', Georgia, serif;  /* Serif éditoriale pour citations & manchettes premium */
    --fs-xs:    .75rem;
    --fs-sm:    .875rem;
    --fs-base:  1rem;
    --fs-lg:    1.125rem;
    --fs-xl:    1.25rem;
    --fs-2xl:   1.5rem;
    --fs-3xl:   1.875rem;
    --fs-4xl:   2.25rem;
    --fs-5xl:   3rem;
    --fs-6xl:   3.75rem;
    --fs-7xl:   4.5rem;

    /* Spacing */
    --sp-1:  .25rem;
    --sp-2:  .5rem;
    --sp-3:  .75rem;
    --sp-4:  1rem;
    --sp-5:  1.25rem;
    --sp-6:  1.5rem;
    --sp-7:  1.75rem;
    --sp-8:  2rem;
    --sp-10: 2.5rem;
    --sp-12: 3rem;
    --sp-16: 4rem;
    --sp-20: 5rem;
    --sp-24: 6rem;

    /* Radius */
    --radius-sm:   6px;
    --radius:      10px;
    --radius-lg:   16px;
    --radius-xl:   22px;
    --radius-2xl:  28px;
    --radius-full: 9999px;

    /* Shadow */
    --shadow-sm: 0 1px 2px rgba(15, 23, 42, .06);
    --shadow:    0 4px 14px rgba(15, 23, 42, .08);
    --shadow-md: 0 8px 24px rgba(15, 23, 42, .10);
    --shadow-lg: 0 20px 50px rgba(15, 23, 42, .14);
    --shadow-xl: 0 30px 80px rgba(15, 23, 42, .18);
    --shadow-brand: 0 12px 30px rgba(14, 165, 233, .35);
    --shadow-institutional: 0 12px 40px rgba(11, 37, 69, .35);
    --shadow-editorial: 0 1px 0 rgba(15, 23, 42, .04), 0 8px 30px rgba(15, 23, 42, .06);

    /* Container */
    --container-max: 1240px;
    --container-pad: 1.5rem;

    /* Breakpoints (for ref / JS) */
    --bp-sm:  640px;
    --bp-md:  768px;
    --bp-lg: 1024px;
    --bp-xl: 1280px;

    /* Transitions */
    --t-fast:   .15s ease;
    --t:        .25s cubic-bezier(.4, 0, .2, 1);
    --t-slow:   .45s cubic-bezier(.4, 0, .2, 1);

    /* Z-index */
    --z-base:   1;
    --z-sticky: 100;
    --z-nav:    200;
    --z-modal:  900;
    --z-toast:  1000;
}