:root {

  --brand-blue:        #0414e3;
  --brand-blue-tint:   #f0f5fe;
  --brand-green:       #84bd4e;
  --brand-lime:        #99cc00;
  --brand-gold:        #f2be39;
  --brand-black:       #000000;

  --brand-blue-900:    #050c78;
  --brand-blue-700:    #0611b4;
  --brand-green-700:   #3f6b21;
  --brand-green-800:   #2f5117;
  --brand-green-100:   #eef6e4;
  --brand-gold-800:    #6b4c00;

  --color-bg:            #ffffff;
  --color-bg-alt:        var(--brand-blue-tint);
  --color-bg-soft:       #f6f7f9;
  --color-bg-inverse:    #0a1020;
  --color-bg-inverse-2:  #111a30;

  --color-text:          #1a1d24;
  --color-text-muted:    #4d5461;
  --color-text-inverse:  #ffffff;
  --color-text-inverse-muted: #c8cedd;
  --color-text-inverse-faint: #7a8296;

  --color-primary:       var(--brand-blue);
  --color-primary-hover: var(--brand-blue-900);
  --color-accent:        var(--brand-green-700);
  --color-accent-soft:   var(--brand-green);
  --color-highlight:     var(--brand-gold);

  --color-chrome-bg:      var(--brand-green);
  --color-chrome-bg-alt:  #77ac44;
  --color-chrome-fg:      var(--color-text);
  --color-chrome-fg-muted:#33402a;
  --color-chrome-accent:  var(--brand-blue-900);
  --color-chrome-line:    rgba(26, 29, 36, .20);

  --color-border:        #dfe3ea;
  --color-border-strong: #b9c0cd;
  --color-focus:         var(--brand-gold);
  --color-overlay:       rgba(10, 16, 32, .62);
  --color-overlay-soft:  rgba(10, 16, 32, .35);

  --voile-bandeau-haut:         rgba(10, 16, 32, .30);
  --voile-bandeau-milieu:       rgba(10, 16, 32, .55);
  --voile-bandeau-bas:          rgba(10, 16, 32, .88);
  --voile-bandeau-texte-haut:   rgba(10, 16, 32, .62);
  --voile-bandeau-texte-milieu: rgba(10, 16, 32, .76);
  --voile-bandeau-texte-bas:    rgba(10, 16, 32, .92);

  --voile-bandeau-cote:         rgba(10, 16, 32, .46);
  --voile-bandeau-cote-milieu:  rgba(10, 16, 32, .34);
  --voile-bandeau-cote-fin:     rgba(10, 16, 32, 0);

  --color-error:         #a4161a;
  --color-error-bg:      #fdeced;
  --color-success:       #1d6b3f;
  --color-success-bg:    #e8f5ed;

  --font-heading: "Cormorant Garamond", Garamond, Georgia, serif;
  --font-body:    "Jost", "Futura", "Century Gothic", system-ui, sans-serif;

  --font-ui:      "Jost", "Futura", "Century Gothic", system-ui, sans-serif;

  --fs-3xs:  clamp(0.75rem, 0.73rem + 0.10vw, 0.8125rem);
  --fs-2xs:  clamp(0.8125rem, 0.79rem + 0.11vw, 0.875rem);
  --fs-xs:   clamp(0.875rem, 0.85rem + 0.12vw, 0.9375rem);
  --fs-sm:   clamp(0.9375rem, 0.90rem + 0.17vw, 1rem);
  --fs-base: clamp(1rem, 0.96rem + 0.20vw, 1.125rem);
  --fs-md:   clamp(1.0625rem, 1.00rem + 0.30vw, 1.25rem);
  --fs-lg:   clamp(1.1875rem, 1.09rem + 0.42vw, 1.5rem);
  --fs-xl:   clamp(1.375rem, 1.22rem + 0.70vw, 1.875rem);
  --fs-2xl:  clamp(1.625rem, 1.38rem + 1.10vw, 2.375rem);
  --fs-3xl:  clamp(1.875rem, 1.50rem + 1.65vw, 3rem);
  --fs-4xl:  clamp(2.125rem, 1.55rem + 2.55vw, 3.75rem);

  --lh-tight:   1.15;
  --lh-snug:    1.3;
  --lh-normal:  1.55;
  --lh-relaxed: 1.75;

  --fw-light:    300;
  --fw-regular:  400;
  --fw-medium:   500;
  --fw-bold:     500;
  --fw-black:    500;

  --ls-tight:   0;
  --ls-normal:  0.005em;
  --ls-wide:    0.12em;
  --ls-wider:   0.22em;

  --measure:      68ch;
  --measure-narrow: 54ch;

  --space-3xs: 0.25rem;
  --space-2xs: 0.5rem;
  --space-xs:  0.75rem;
  --space-sm:  1rem;
  --space-md:  1.5rem;
  --space-lg:  2rem;
  --space-xl:  3rem;
  --space-2xl: 4rem;
  --space-3xl: 6rem;

  --section-y:      clamp(3rem, 2.1rem + 3.9vw, 5.5rem);
  --section-y-lg:   clamp(4rem, 2.7rem + 5.6vw, 7.5rem);

  --pied-y:         clamp(2.25rem, 1.7rem + 2.4vw, 3.5rem);
  --gutter:         clamp(1rem, 0.55rem + 2.0vw, 2rem);

  --taille-macaron: clamp(5.5rem, 4.2rem + 4.2vw, 9rem);

  --container-max:   75rem;
  --container-wide:  85rem;
  --container-header: 106rem;

  --h-header-sticky: 5.5625rem;
  --offset-sticky:   calc(var(--h-header-sticky) + var(--space-lg));

  --h-media-etroite:  40cqw;
  --h-media-egale:    47cqw;
  --h-media-large:    54cqw;
  --container-text:  48rem;
  --header-h:        4.5rem;
  --header-h-lg:     5.5rem;

  --radius-xs:   4px;
  --radius-sm:   6px;
  --radius-md:  10px;
  --radius-lg:  16px;
  --radius-xl:  24px;
  --radius-pill: 999px;

  --border-w:      1px;
  --border-w-thick: 2px;
  --focus-ring-w:  3px;
  --focus-ring-offset: 2px;

  --shadow-xs: 0 1px 2px rgba(10, 16, 32, .06);
  --shadow-sm: 0 2px 6px rgba(10, 16, 32, .08);
  --shadow-md: 0 6px 18px rgba(10, 16, 32, .10);
  --shadow-lg: 0 16px 40px rgba(10, 16, 32, .14);

  --dur-fast:  120ms;
  --dur-base:  220ms;
  --dur-slow:  420ms;
  --ease-out:  cubic-bezier(.22, .61, .36, 1);
  --ease-in-out: cubic-bezier(.65, .05, .36, 1);

  --z-base:     1;
  --z-sticky:  100;
  --z-header:  200;
  --z-drawer:  300;
  --z-overlay: 400;
  --z-cookie:  500;
  --z-skip:    600;
}
