:root {
    --purple: #A682FF;
    --mint: #EBF5EE;
    --yellow: #F2FF49;
}

body {
    background-color: var(--purple);
    font-family: Arial, Helvetica, sans-serif;
    margin: 0;
}

main {
    padding: 1rem;
}

h1 {
    font-size: 6rem;
    margin: 0;
    color: var(--yellow);
}

a {
    color: var(--yellow);
    font-size: 1rem;
}

p,
li {
    color: var(--mint);
    font-size: 1rem;
}

@media (min-width: 420px) {
    h1 {
        font-size: 8.5rem;
    }
}

@media (min-width: 624px) {
    h1 {
        font-size: 10rem;
    }
}

@media (min-width: 1024px) {
    h1 {
        font-size: 13rem;
    }
}