* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

body {
    font-family: sans-serif;
}

header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0rem 1rem;
    border-bottom: 1px solid rgb(201, 201, 201);
    position: sticky;
    top: 0;
    left: 0;
    background-color: white;
}

.logo {
    width: 13rem;
}

.login-link {
    text-decoration: none;
    color: white;
    background-color: black;
    padding: 0.7rem 2rem;
    border-radius: 0.4rem;
}

section {
    margin: auto;
    margin-top: 3rem;
    width: 80%;
    max-width: 800px;
}

.sec-space {
    margin-top: 9rem;
}

.heading {
    text-align: center;
    font-size: 3rem;
}

.highlight-text {
    border-bottom: 6px solid #0da8ef;
}

.description {
    font-size: 1.2rem;
    color: grey;
    text-align: center;
    margin-top: 0.9rem;
}

.about-desc {
    font-size: 1.2rem;
    color: rgb(58, 58, 58);
    text-align: center;
    margin-top: 0.9rem;
    line-height: 1.5rem;
}

.about-ul {
    color: black;
    list-style: none;
    font-size: 1.2rem;
    color: rgb(81, 81, 81);
    margin-top: 0.9rem;
}

.about-link {
    color: grey;
    font-size: 1.5rem;
}


.cover-image {
    width: 100%;
    display: flex;
    margin: auto;
    margin-top: 3rem;
}


.grid {
    display: grid;
    gap: 1.5rem
}

.footer {
    background-color:  hsl(206, 12%, 12%);
    padding: 4rem 0 2.25rem;
    color: hsl(206, 4%, 42%);
    display: flex;
    width: 100%;
    justify-content: center;
}

.footer__title {
    color: #fff;
    font-size: 2.25rem;
    margin-bottom: 2rem
}

.footer__description {
    margin-bottom: .75rem
}

.footer__newsletter {
    display: flex;
    column-gap: .5rem
}

.footer__input {
    border: none;
    outline: 0;
    padding: 1.25rem 1rem;
    border-radius: .25rem;
    width: 70%;
    color: hsl(206, 4%, 42%);
}

.footer__button {
    padding: .75rem;
    font-size: 2rem;
    border-radius: .25rem;
    display: inline-flex;
    background-color: #fff
}

.footer__button i {
    transform: rotate(-30deg);
    transition: .4s
}

.footer__button:hover i {
    transform: rotate(-30deg) translate(.25rem)
}

.footer__content {
    display: flex;
    width: 100%;
    justify-content: center;
    row-gap: 2.5rem;
    padding-bottom: 2.5rem;
    border-bottom: 1px solid hsl(206, 4%, 42%);
}

.footer__subtitle {
    color: #fff;
    font-size: 1.5rem;
    margin-bottom: .75rem
}

.footer__flag {
    width: 1rem
}

.footer__group {
    display: flex;
    /* flex-direction: column; */
    text-align: center;
    justify-content: space-between;
    margin-top: 1.5rem
}

.footer_policy_link {
    color: hsl(206, 4%, 42%);
    cursor: pointer
}

.footer__social {
    display: flex;
    justify-content: center;
    column-gap: 1.5rem;
    font-size: 1.25rem;
    margin-bottom: 2rem
}

.footer__social-link {
    color: #fff;
    transition: .4s
}

.footer__social-link:hover {
    color: #0da8ef
}

.footer__copy {
    font-size: var(--smaller-font-size)
}

@media only screen and (max-width: 600px) {

    section .heading {
        font-size: 2rem;
    }

    .footer__content, .footer__group{
        display: flex;
        flex-direction: column;
    }
}