body {
    font-family: "Poppins";
    margin:0;
    padding:0;
}

.first {
    background-image: url("./images/bg-hero-desktop.svg");
    height:85vh;
    padding:3em 5em;
    background-color: hsl(193, 100%, 96%);
}

.header > img {
    height:2.5em;
    margin-top:0.8em;
}

.heading {
    width:40em;
}

.heading > h1 {
    font-size:40px;
    font-weight: 600;
}

.headerButton {
    padding:0.5em 3em;
    box-shadow:0 6px 20px 0 rgba(42, 42, 42, 0.1);
    border-radius: 2em;
}
.content {
    align-items: center;
    margin-top: 3em;
}



.button {
    padding:1em 3em;
    box-shadow:0 6px 20px 0 rgba(42, 42, 42, 0.1);
    border-radius: 2em;
    width:fit-content;
    background-color:hsl(322, 100%, 66%);
    color:white;
}

.image > img {
    height:60vh;
}

.grow {
    align-items: center;
    box-shadow:0 6px 20px 0 rgba(42, 42, 42, 0.1);
    padding:2em 5em;
    height:50vh;
    width:75vw;
    margin:5em auto 0;
    border-radius: 0.5em;
}

.grow img {
    height:80%;
}

.grow > div {
    width:35em;
}

.flowing {
    align-items: center;
    box-shadow:0 6px 20px 0 rgba(42, 42, 42, 0.1);
    padding:2em 5em;
    height:50vh;
    width:75vw;
    margin:2em auto;
    border-radius: 0.5em;
}

.flowing img {
    height:80%;
}

.flowing > div {
    width:35em;
}

.your {
    align-items: center;
    box-shadow:0 6px 20px 0 rgba(42, 42, 42, 0.1);
    padding:2em 5em;
    height:50vh;
    width:75vw;
    margin:2em auto;
    border-radius: 0.5em;
    margin-bottom:5em;
}

.your img {
    height:80%;
}

.your > div {
    width:35em;
}

.ready {
    width:40vw;
    box-shadow:0 6px 20px 0 rgba(42, 42, 42, 0.1);
    text-align: center;
    padding:3em;
    left:28%;
    border-radius:1em;
    z-index: 2;
    position:absolute;
    background-color: white;

    
}

.ready > p {
    background-color: hsl(322, 100%, 66%);
    padding:1em 3em;
    width:fit-content;
    margin:auto;
    border-radius:3em;
    color:white;
}

.final {
    background-color: hsl(192, 100%, 9%);
    color:white;
    padding:10em 5em 2em 5em;
    position:relative;
    z-index:1;
    margin-top:13em;
}

.finalContent {
    
    gap:3em;
    
    
}

.final > img {
    filter: brightness(0) invert(1);
}

.finalContent > div {
    width:30vw;
}

.links {
    display:grid;
    grid-template: 1fr 1fr 1fr / 1fr 1fr;
    height:20vh;
    
}

.links > a {
    text-decoration: none;
    color:white;
}



.icon > img {
    height:1em;
    width:1em;
    padding:1em;
    filter: brightness(0) invert(1);
    border:1px solid white;
    border-radius:50%;
    margin-left:2em;

}

table {
    border-spacing:1em;
}

footer {
    float:right;
}

.header, .content ,.grow ,.flowing ,.your ,.finalContent {
    display:flex;
    justify-content: space-between; 
}