/*
 * Label Equipée — design system — v0.1.0
 *
 * FICHIER GÉNÉRÉ — ne pas modifier à la main.
 * Source : design-system/tokens.json
 * Régénérer : node bin/build-tokens.mjs <racine-du-site>
 */

:root {
  /* color */
  --color-brand-50:               #eef7f6;
  --color-brand-100:              #d9eceb;
  --color-brand-200:              #a1d0cc;
  --color-brand-300:              #70b7bc;
  --color-brand-400:              #3399a8;
  --color-brand-500:              #297a86;
  --color-brand-600:              #256e79;
  --color-brand-700:              #1e5961;
  --color-brand-800:              #184951;
  --color-brand-900:              #133a40;
  --color-neutral-0:              #ffffff;
  --color-neutral-50:             #f7f8fa;
  --color-neutral-100:            #eef0f4;
  --color-neutral-200:            #dfe3ea;
  --color-neutral-300:            #c5cbd6;
  --color-neutral-400:            #8a92a1;
  --color-neutral-500:            #646d7c;
  --color-neutral-600:            #545d6d;
  --color-neutral-700:            #3d4553;
  --color-neutral-800:            #1d1d1d;
  --color-neutral-900:            #060606;
  --color-neutral-1000:           #0b0d11;
  --color-accent-soft:            #fcf7d5;
  --color-accent-base:            #efd416;
  --color-accent-bright:          #ffea46;
  --color-accent-strong:          #94830e;
  --color-accent-ink:             #262a2d;
  --color-feedback-success:       #117d57;
  --color-feedback-success-soft:  #e4f6ee;
  --color-feedback-warning:       #996100;
  --color-feedback-warning-soft:  #fdf1dc;
  --color-feedback-danger:        #c72d2d;
  --color-feedback-danger-soft:   #fbe7e7;
  --color-feedback-info:          #256e79;
  --color-feedback-info-soft:     #eef7f6;
  --color-surface-page:           #ffffff;
  --color-surface-raised:         #f7f8fa;
  --color-surface-sunken:         #eef0f4;
  --color-surface-inverse:        #060606;
  --color-surface-overlay:        rgba(11, 13, 17, 0.6);
  --color-text-strong:            #060606;
  --color-text-base:              #060606;
  --color-text-muted:             #646d7c;
  --color-text-inverse:           #ffffff;
  --color-text-link:              #256e79;
  --color-text-link-hover:        #1e5961;
  --color-border-subtle:          #dfe3ea;
  --color-border-base:            #8a92a1;
  --color-border-strong:          #646d7c;
  --color-border-focus:           #297a86;
  --color-action-base:            #f86544;
  --color-action-strong:          #cb5338;
  --color-action-soft:            #fee9e5;

  /* font */
  --font-family-sans:             'Open Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-family-display:          'Open Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-family-mono:             ui-monospace, 'SFMono-Regular', 'Menlo', monospace;
  --font-family-serif:            'PT Serif', Georgia, 'Times New Roman', serif;
  --font-weight-regular:          400;
  --font-weight-medium:           500;
  --font-weight-semibold:         600;
  --font-weight-bold:             700;
  --font-size-2xs:                0.75rem;
  --font-size-xs:                 0.8125rem;
  --font-size-s:                  0.9375rem;
  --font-size-m:                  1rem;
  --font-size-l:                  1.125rem;
  --font-size-xl:                 clamp(1.25rem, 0.5vw + 1.13rem, 1.5rem);
  --font-size-2xl:                clamp(1.5rem, 1vw + 1.25rem, 1.953rem);
  --font-size-3xl:                clamp(1.875rem, 1.8vw + 1.42rem, 2.441rem);
  --font-size-4xl:                clamp(2.25rem, 3vw + 1.5rem, 3.052rem);
  --font-size-5xl:                clamp(2.75rem, 4.5vw + 1.63rem, 3.815rem);
  --font-line-height-tight:       1.1;
  --font-line-height-snug:        1.25;
  --font-line-height-base:        1.73;
  --font-line-height-relaxed:     1.75;
  --font-letter-spacing-tight:    -0.02em;
  --font-letter-spacing-base:     0;
  --font-letter-spacing-wide:     0.04em;

  /* space */
  --space-3xs:                    0.25rem;
  --space-2xs:                    0.5rem;
  --space-xs:                     0.75rem;
  --space-s:                      1rem;
  --space-m:                      1.5rem;
  --space-l:                      2rem;
  --space-xl:                     3rem;
  --space-2xl:                    4rem;
  --space-3xl:                    6rem;
  --space-4xl:                    8rem;
  --space-section:                70px;
  --space-gutter:                 40px;

  /* size */
  --size-container:               1280px;
  --size-container-narrow:        800px;
  --size-container-wide:          1600px;
  --size-measure:                 68ch;
  --size-touch-target:            44px;

  /* radius */
  --radius-none:                  0;
  --radius-s:                     4px;
  --radius-m:                     8px;
  --radius-l:                     16px;
  --radius-xl:                    24px;
  --radius-full:                  999px;

  /* shadow */
  --shadow-xs:                    0 1px 2px rgba(11, 13, 17, 0.06);
  --shadow-s:                     0 2px 8px rgba(11, 13, 17, 0.08);
  --shadow-m:                     0 8px 24px rgba(11, 13, 17, 0.10);
  --shadow-l:                     0 16px 48px rgba(11, 13, 17, 0.14);
  --shadow-focus:                 0 0 0 3px rgba(47, 99, 246, 0.35);

  /* motion */
  --motion-duration-instant:      80ms;
  --motion-duration-fast:         160ms;
  --motion-duration-base:         240ms;
  --motion-duration-slow:         420ms;
  --motion-easing-standard:       cubic-bezier(0.2, 0, 0.2, 1);
  --motion-easing-enter:          cubic-bezier(0, 0, 0.2, 1);
  --motion-easing-exit:           cubic-bezier(0.4, 0, 1, 1);
  --motion-easing-spring:         cubic-bezier(0.34, 1.56, 0.64, 1);

  /* layer */
  --layer-base:                   1;
  --layer-dropdown:               100;
  --layer-sticky:                 200;
  --layer-overlay:                300;
  --layer-modal:                  400;
  --layer-toast:                  500;

  /* breakpoint */
  --breakpoint-mobile:            480px;
  --breakpoint-tablet:            768px;
  --breakpoint-laptop:            1024px;
  --breakpoint-desktop:           1280px;
}
