*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:Arial,sans-serif;
}


body{

background:#ffffff;
color:#17243b;

}


header{

display:flex;
align-items:center;
justify-content:space-between;
padding:20px 6%;
border-bottom:1px solid #eee;

}


.logo img{

width:80px;

}



nav a{

margin:0 10px;
cursor:pointer;
font-size:15px;
color:#292828;
text-decoration: none;
   	
}
.marathi_Menu{
  font-family: 'Tiro Devanagari Marathi', san-serif;
}

.current{
color:#f7791e;
}

.languages button{

padding:8px 15px;
border-radius:20px;
border:1px solid #ddd;
background:white;

}
.languages a{
color:#292828;
text-decoration: none;

}



.hero{

margin:40px 6%;
display:flex;
align-items:center;
justify-content:space-between;
background:#f7f7f7;
border-radius:25px;
background-image:url('hero-img.png');
background-repeat: no-repeat;
background-size: cover;
background-position: left;
padding: 60px 20px;

}



.hero-text{

width:50%;
padding:50px;

}



.hero h1{

font-size:45px;
line-height:1.2;

}



.hero span{

color:#198754;

}


.hero p{

margin:20px 0;
font-size:18px;

}



button{

cursor:pointer;

}


.primary{

background:#10243d;
color:white;
padding:14px 25px;
border-radius:30px;
border:none;

}
.primary:hover {
background-color: #f7791e;
transform: scale(1.0.5); 
}
.primary a{
text-decoration:none;
color:white;
}



.secondary{

padding:14px 25px;
border-radius:30px;
background:white;
border:1px solid #333;

}




h2{

margin:40px 6% 20px;

}



.categories{

display:grid;
grid-template-columns:repeat(4,1fr);
gap:20px;
padding:0 6%;

}
.categories img{

width:100%;

}


.card{

padding:25px;
border:1px solid #eee;
border-radius:20px;
box-shadow:0 5px 20px #ddd;

}
.card:hover{
padding:10px;
border:1px solid #eee;
border-radius:10px;
box-shadow:0 5px 20px #ddd;	
}


.articles{

display:grid;
grid-template-columns:repeat(4,1fr);
gap:20px;
padding:0 6%;

}


.article{

border-radius:20px;
overflow:hidden;
box-shadow:0 5px 20px #ddd;
padding-bottom:20px;

}


.article img{

width:100%;

}


.article h3,
.article p{

padding:10px 15px;

}


footer{

text-align:center;
padding:30px;
margin:50px 6%;
background:#10243d;
color:white;
padding:15px;
border-radius:10px;

}



/* Mobile */

@media(max-width:900px){

header,
.hero{

flex-direction:column;

}


.hero-text{

width:100%;

}


.categories,
.articles{

grid-template-columns:1fr;

}


nav{

margin:20px;

}

}