@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&display=swap');

/* Typography */
:root{
    --h1: 65px;
    --h2: 60px;
    --h3: 42px;
    --h4: 30px;
    --h5: 22px;
    --h6: 18px;
    --a: 18px; /* Link font size */
    --p: 18px; /* Paragraph font size */
}

h1 {
    font-size: clamp(4rem, 3.385vw, 3.385vw);
    margin-bottom: 0;
}
h2 {
    font-size: clamp(3.6rem, 3.125vw, 3.125vw);
    margin-bottom: 0;
}
h3 {
    font-size: clamp(2.4rem, 2.188vw, 2.188vw);
    margin-bottom: 0;
}
h4 {
    font-size: clamp(2rem, 1.563vw, 1.563vw);
    margin-bottom: 0;
}
h5 {
    font-size: clamp(1.8rem, 1.146vw, 1.146vw);
    margin-bottom: 0;
}
h6 {
    font-size: clamp(1.6rem, 0.938vw, 0.938vw);
    margin-bottom: 0;
}
p {
    font-size: clamp(1.6rem, 0.938vw, 0.938vw);
    margin-bottom: 0;
}
a {
    font-size: clamp(1.6rem, 0.938vw, 0.938vw);
    margin-bottom: 0;
}

/* Font Weights */

.thin {
    font-weight: 100; /* Thin */
}
.extraLight {
    font-weight: 200; /* Extra Light */
}
.light {
    font-weight: 300; /* Light */
}
.regular {
    font-weight: 400; /* Regular */
}
.medium {
    font-weight: 500; /* Medium */
}
.semiBold {
    font-weight: 600; /* SemiBold */
}
.bold {
    font-weight: 700; /* Bold */
}
.extraBold {
    font-weight: 800; /* Extra Bold */
}
.black {
    font-weight: 900; /* Black */
}