/* Mobile devices */
@media (max-width: 768px) {

    h1 {
        font-size: 2rem;
    }

    h2 {
        font-size: 1.6rem;
    }

    h3 {
        font-size: 1.3rem;
    }

    p {
        font-size: 1rem;
    }

}

For very small phones:

@media (max-width: 480px) {

    h1 {
        font-size: 1.6rem;
    }

    h2 {
        font-size: 1.3rem;
    }

    p {
        font-size: 0.95rem;
    }

}

h1 {
    font-size: 60px;
}

use:

h1 {
    font-size: clamp(2rem, 5vw, 4rem);
}

:root {
--body-bg: #1c5422;
}