
:root{
    --h1-clamp: clamp(24px, 3.2vw, 30px);
    --h2-clamp: clamp(24px, 3.2vw, 30px);
    --paragraph-clamp: clamp(1rem, 2.8vw, 18px);
    --welcome-clamp: clamp(49px, 13vw ,200px);
}

/*

DOCUMENTATION

Source : https://moderncsstools.com/guides/fluid-typography/

:root { 
  Base: 16px min, 18px max
  --fs-base: clamp(1rem, 0.208vw + 0.958rem, 1.125rem);

  Small: 14px min, 16px max
  --fs-sm: clamp(0.875rem, 0.208vw + 0.833rem, 1rem);

  Large (scale step 1): 20px min, 24px max
  --fs-lg: clamp(1.25rem, 0.417vw + 1.167rem, 1.5rem);

  XL (scale step 2): 25px min, 32px max
  --fs-xl: clamp(1.5625rem, 0.729vw + 1.417rem, 2rem);

  2XL (scale step 3): 31.25px min, 42.656px max
  --fs-2xl: clamp(1.953rem, 1.188vw + 1.716rem, 2.666rem);

  3XL (scale step 4): 39px min, 56.832px max
  --fs-3xl: clamp(2.441rem, 1.856vw + 2.071rem, 3.552rem);

}

body { font-size: var(--fs-base); }
h1   { font-size: var(--fs-3xl); }
h2   { font-size: var(--fs-2xl); }
h3   { font-size: var(--fs-xl); }
h4   { font-size: var(--fs-lg); }
small { font-size: var(--fs-sm); }

*/