:root {
    --font-xs: 400 16px / 1.5 var(--font-poppins);
    --font-sm: 400 clamp(16px, 2vw, 20px)/1.5 var(--font-poppins);
    --font: 600 clamp(20px, 2.4vw, 24px)/1.3 var(--font-outfit);
    --font-base: 400 clamp(16px, 1.8vw, 18px)/1.5 var(--font-poppins);
    --font-main: 600 clamp(24px, 3.5vw, 36px)/1.3 var(--font-outfit);
    --font-md: 600 clamp(32px, 5vw, 52px)/1.3 var(--font-outfit);
    --font-lg: 400 clamp(32px, 5vw, 64px)/1 var(--font-gendy);
    --font-max: 400 clamp(32px, 9vw, 128px)/.9 var(--font-gendy);

    /* --space-xs */
    --space: clamp(18px, 2.4vw, 24px);
    --space-xs: clamp(24px, 3vw, 32px);
    --space-sm: clamp(32px, 4vw, 40px);
    --space-md: clamp(40px, 5vw, 56px);
    --space-lg: clamp(64px, 8vw, 96px);
    --space-max: clamp(64px, 8vw, 124px);

    --font-gendy: "Gendy", sans-serif;
    --font-outfit: "Outfit", sans-serif;
    --font-poppins: "Poppins", sans-serif;

    --shadow: 0 10px 40px 0 rgba(11, 11, 11, 0.08);
}