:root{
    --primary-color: hsl(0, 100%, 50%);
    --primary-color-light: rgb(249, 54, 36);
    --primary-color-dark: hsl(0, 100%, 28%);
    --secondary-color: hsl(207, 34%, 50%);
    --secondary-color-light: hsl(208, 90%, 76%);
    --secondary-color-dark: rgb(36, 72, 96);
    --gray-100:  hsl(0, 0%, 100%);
    --gray-300:  hsl(201, 42%, 89%);
    --gray-500:  hsl(202, 12%, 57%);
    --gray-700:  hsl(206, 25%, 16%);
    --gray-900:  hsl(210, 100%, 5%);
    --black-light:  rgb(25, 25, 25);
    --black-dark:  rgb(0, 0, 0);

    --header-height: 3.5rem;

    --biggest-font-size: 2.75rem;
    --big-font-size: 1.75rem;
    --h1-font-size: 1.5rem;
    --h2-font-size: 1.25rem;
    --h3-font-size: 1.1rem;
    --normal-font-size: .938rem;
    --small-font-size: .813rem;
    --smaller-font-size: .75rem;

    --font-regular: 300;
    --font-medium: 500;
    --font-semi-bold: 600;
    --font-bold: 800;

    --serif-family: 'Playfair Display', serif;
    --sans-family: 'Inter', sans-serif;
    --cursive-family: 'Dancing Script', cursive;

    --z-tooltip: 10;
    --z-fixed: 100;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    list-style: none;
    font-family: var(--sans-family);
}

a{
    color: inherit;
    text-decoration: none;
}

html{
    scroll-behavior: smooth;

}