:root {
    --black: black;
    --grey: DimGray;
    --blue: hsla(205, 98%, 49%, 1);
    --blue-darker: hsla(242, 86%, 23%, 1);
    --green: hsla(87, 100%, 38%, 1);
    --orange-lighter: hsla(60, 100%, 50%, 1);
    --orange: hsla(45, 100%, 50%, 1);
    --orange-darker: hsla(20, 100%, 23%, 1);
    --red: hsla(348, 100%, 50%, 1);

    --header-background: black;
    --header-link-color: var(--grey);
    --header-link-highlighted: var(--light-gray);
    --footer-background: black;

    --button-cta-color: var(--blue);
    --button-cta-highlighted: black;
    --button-research-color: var(--orange);
    --button-research-background: black;
}

body { background: linear-gradient(45deg, var(--black) 0%, var(--orange-darker) 75%, var(--orange) 100%); }

*:focus-visible { box-shadow: 0 0 0 2px var(--blue); }

.burger__up { fill: var(--red); }
.burger__mid { fill: var(--green); }
.burger__low { fill: var(--blue-darker); }

.character__image { top: -20% !important; }