:root {
    --color-primary: #28388f;
    --color-secondary: #364dcd;

    --color-accent-100: #fff;
    --color-accent-200: #c4c4c4;
    --color-accent-300: #878787;
    --color-accent-400: #575756;
    --color-accent-500: #000;

    --color-support-100: #1cbb1a;
    --color-support-200: #f20808;
    --color-support-300: #ffc001;

    --radius-half: 50px;
    --radius-five: 5px;
    --radius-two: 2px;
    --radius-rounded: 50%;

    --overlay-primary: rgba(0, 0, 0, 0.5);

    --shadow-primary: rgba(0, 10, 255, 0.15);
    --shadow-secondary: rgba(54, 77, 205, 0.2);

    --font-family-primary: "Source Sans Pro";

    --z-index-10: 10;

    --font-weight-300: 300;
    --font-weight-400: 400;
    --font-weight-600: 600;
    --font-weight-700: 700;
}

* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
button,
label,
span,
a {
    font-family: var(--font-family-primary);
}

input {
    -webkit-appearance: none;
    border-radius: 0;
}

html {
    font-size: 14px;
    scroll-behavior: smooth;
    margin: 0;
    padding: 0;
}

@media (max-width: 600px) {
    html {
        font-size: 16px;
    }
}

html,
body {
    height: 100%;
}

body {
    font-size: 0.875rem;
    font-weight: 400;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    margin: 0;
}

body > :first-child {
    min-height: 100%;
    min-height: -webkit-fill-available;
    display: flex;
    flex-direction: column;
}