:root {
  /*UTILITY CLASS - FLUID SPACE VARIABLES*/
  --space-2xs: clamp(0.5rem, calc(0.42rem + 0.31vw), 0.69rem);
  --space-xs: clamp(0.75rem, calc(0.65rem + 0.42vw), 1rem);
  --space-s: clamp(1rem, calc(0.87rem + 0.52vw), 1.31rem);
  --space-m: clamp(1.5rem, calc(1.29rem + 0.83vw), 2rem);
  --space-l: clamp(2rem, calc(1.74rem + 1.04vw), 2.63rem);
  --space-xl: clamp(3rem, calc(2.61rem + 1.56vw), 3.94rem);
  --space-2xl: clamp(4rem, calc(3.48rem + 2.08vw), 5.25rem);
  --space-3xl: clamp(6rem, calc(5.22rem + 3.13vw), 7.88rem);
  /*Fluid typographie*/
  --font-size-sm: clamp(0.8rem, 0.15vw + 0.76rem, 1.6rem);
  --font-size-base: clamp(1rem, 0.31vw + 0.92rem, 1.8rem);
  --font-size-md: clamp(1.5rem, 0.55vw + 1.11rem, 2.2rem);
  --font-size-lg: clamp(2rem, 0.91vw + 1.33rem, 2.8rem);
  --font-size-xl: clamp(2.5rem, 1.43vw + 1.59rem, 3.2rem);
  --font-size-2xl: clamp(3rem, 2.18vw + 1.9rem, 4rem);
  --font-size-3xl: clamp(4rem, 3.24vw + 2.24rem, 5rem);
}
/*UTILITY CLASS - FONT SIZE*/
.font-sm {
  font-size: var(--font-size-sm);
}
.font-base {
  font-size: var(--font-size-base);
}
.font-md {
  font-size: var(--font-size-md);
}
.font-lg {
  font-size: var(--font-size-lg);
}
.font-xl {
  font-size: var(--font-size-xl);
}
.font-2xl {
  font-size: var(--font-size-2xl);
}
.font-3xl {
  font-size: var(--font-size-3xl);
}
.gap-row-m {
  row-gap: var(--space-m);
}
/*UTILITY CLASS - MARGIN TOP - BOTTOM*/
.m-top--xs {
  margin-top: var(--space-xs);
}
.m-top--s {
  margin-top: var(--space-s);
}
.m-top--m {
  margin-top: var(--space-m);
}
.m-top--l {
  margin-top: var(--space-l);
}
.m-top--xl {
  margin-top: var(--space-xl);
}
.m-top--2xl {
  margin-top: var(--space-2xl);
}
.m-top--3xl {
  margin-top: var(--space-3xl);
}
.m-bottom--xs {
  margin-bottom: var(--space-xs);
}
.m-bottom--s {
  margin-bottom: var(--space-s);
}
.m-bottom--m {
  margin-bottom: var(--space-m);
}
.m-bottom--l {
  margin-bottom: var(--space-l);
}
.m-bottom--xl {
  margin-bottom: var(--space-xl);
}
.m-bottom--2xl {
  margin-bottom: var(--space-2xl);
}
.m-bottom--3xl {
  margin-bottom: var(--space-3xl);
}
/*UTILITY CLASS - PADDING*/
.pad--xs {
  padding: var(--space-xs);
}
.pad--s {
  padding: var(--space-s);
}
.pad--m {
  padding: var(--space-m);
}
.pad--l {
  padding: var(--space-l);
}
.pad--xl {
  padding: var(--space-xl);
}
.pad--2xl {
  padding: var(--space-2xl);
}
.pad--3xl {
  padding: var(--space-3xl);
}
.pad--none {
  padding: 0rem !important;
}