:root {
    --accent-color: #67C69F;
    --accent-color-light: #76ECB2;
    --accent-color-dark: #4B8A7E;
    --color-bg: #1e1e1e;
    --color-bg-dark: #232B3E;
    --font-color: #bababa;
    --font-color-buttons: #ffffff;
    --border-color: #316c63;
    --pill-background: #4B8A7E;
    --pill-color: #000000;
    --font-base: 'Lexend', sans-serif;
    --font-cta: 'Dongle', sans-serif;
    --p-color: #bababa;
    --h1-color: #bababa;
    --h2-color: #bababa;
    --h3-color: #bababa;
    --button-bg: var(--gradient-buttons);
    --font-color-dark: #b2b2b2;
    --color-link-hover: #232B3E;
    --font-color-light: #bbbbbb;
    --p-font: 'Lexend', sans-serif;
    --h1-font: 'Lexend', sans-serif;
    --h2-font: 'Lexend', sans-serif;
    --h3-font: 'Lexend', sans-serif;
    --button-font: 'Lexend', sans-serif;
    --p-font-size: 16px;
    --h1-font-size: 2.5rem;
    --h2-font-size: 2rem;
    --h3-font-size: 1.5rem;
    --button-radius: 0.5rem;
    --p-font-weight: 400;
    --h1-font-weight: 400;
    --h2-font-weight: 400;
    --h3-font-weight: 400;
    --button-font-size: calc(1rem + 0.2vw);
    --general-font-base: 'Lexend', sans-serif;
    --button-font-weight: 500;
    --general-font-base-size: 16px;
    --general-font-base-weight: 400;
    --font: "Lexend";
    --span-cta-font: "Dongle";
    --accent-color-bg: linear-gradient(to right, var(--color-bg), var(--accent-color) 40%, var(--accent-color-light) 50%, var(--accent-color) 60%, var(--color-bg));
    --accent-bg-image: linear-gradient(0deg, var(--color-bg) 40%, var(--accent-color));
    --accent-bg-image-corner: linear-gradient(-45deg, var(--color-bg) 40%, var(--accent-color) 90%, var(--accent-color-light) 100%);
    --gradient-buttons: linear-gradient(45deg, var(--accent-color-dark) 0%, var(--accent-color) 50%, var(--accent-color) 100%);
    --gradient-fluff: linear-gradient(175deg, var(--accent-color-light) 10%, var(--accent-color) 30%, var(--accent-color-dark) 100%);
    --border: 1px solid var(--border-color);
}
