body{
font-family:Poppins;
margin:0;
background:#f5f7fb;

}

/* NAVBAR */



nav div{
    display: flex;
    gap: 3rem;
}

/* HERO */
.container{
background-color: #3fc6ec28;
text-align: center;
padding: 5px;
}
.hero{
display: flex;
padding: 30px 50px;
/* align-items: center;  */
}
.hero img{
    width: 40vw;
    border-radius: 10px;
    
}
.hero-1{
    padding:0 90px;
    text-align: start;
}
.hero-h2 {
    
    color: #02337c;
    /* font-size:2vw;  */
    line-height: normal;
}

.hero-h1{

font-size: xxx-large;
margin-bottom:10px;

}
h2{
    text-align: center;
}

p{
color:#666;
}

/* TOOL GRID */

.tools{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
gap:25px;
max-width:1000px;
margin:auto;
padding:40px 20px;

}

.tool-card{
background:#15b5f433;
padding:30px;
border-radius:10px;
box-shadow:0 5px 20px rgba(0,0,0,0.05);
text-align:center;
transition:0.3s;
}

.tool-card:hover{
transform:translateY(-5px);
}

.tool-card h3{
margin-bottom:10px;
color: #02337c;
}

.tool-card p{
font-size:14px;
color:#666;
}

.tool-card a{
display:inline-block;
margin-top:15px;
padding:10px 20px;
background:#0d6dfd79;
color:white;
border-radius:5px;
text-decoration:none;
}

/* ARTICLE */

article{
max-width:900px;
margin:auto;
padding:40px 20px;
line-height:1.6;
color:#444;
}
article li{
    list-style: none;
}

/* FOOTER */



@media (max-width:1120px) {


    .hero{
    padding: 30px 10px;
    align-items: center;
    }
    .hero img{
        width: 40vw;
        border-radius: 10px;
        
    }
    .hero-1{
        padding:0 20px;
    }
    .hero-h1{
    font-size: xx-large;
    }
    .hero-h2 {
    font-size:x-large; 

    
}
}
@media (max-width:830px) {
    nav div{
        gap:1rem;
    }
    
}
@media (max-width:600px) {
    nav div{
        gap:1rem;
    }
    .hero{
    display: block;
    padding: 0px 10px;
    }
    .hero img{
        width: 80vw;
        border-radius: 10px;
        
    }

    .hero-h1{
    font-size: x-large;

    }
    .hero-h2 {
    font-size:large; 

    
}
    
}