:root {
    --sky: #EEF6F9;
    --white: white;
    --sun: #FFBF0D;
    --ocean: #002C50;
}

body {
    margin: 0px;
}

.wrapper {
    background-color: var(--sky);
    height: 100vh;
    padding: 0px 32px;
}

.grid-container {
    margin: auto;
    padding-top: 32px;

    @media (min-width: 816px) {
        padding-top: 128px;
    }
}

.tile-wrapper {
    background-color: var(--white);
    max-width: 592px;
    padding: 40px 20px;
    border-radius: 24px;
    margin: auto;

    @media (min-width: 600px) {

    }

    @media (min-width: 816px) {
        padding: 40px;
    }

    h1 {
        font-size: 28px;
        text-align: center;
        line-height: 36px;
        font-weight: 400;
        margin: 20px 0px;
        font-family: "Inter", sans-serif;
        color: var(--ocean);

        @media (min-width: 816px) {
            font-size: 40px;
            line-height: 56px;
        }
        span {
            color: var(--sun);
        }
    }

    p {
        font-size: 16px;
        line-height: 24px;
        text-align: center;
        font-weight: 400;
        font-family: "Inter", sans-serif;
        color: var(--ocean);
        margin: 0px;
    }
}

.image-wrapper {
    display: flex;
    justify-content: center;
}