/*==============================
 HERO SECTION
==============================*/

.hero-section{
padding:80px 0;
background:linear-gradient(135deg,#f8f9fa,#ffffff);
overflow:hidden;
}

.hero-content h1{
font-size:58px;
font-weight:800;
line-height:1.15;
margin:20px 0;
color:#111;
}

.hero-content h1 span{
color:#dc3545;
}

.hero-content p{
font-size:18px;
color:#666;
max-width:600px;
margin-bottom:35px;
}

.hero-badge{
display:inline-block;
padding:10px 20px;
background:#fff;
border-radius:50px;
font-size:14px;
font-weight:600;
box-shadow:0 10px 25px rgba(0,0,0,.08);
}

.hero-buttons{
display:flex;
gap:15px;
flex-wrap:wrap;
}

.hero-products{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:20px;
}

.hero-product-card{
background:#fff;
border-radius:20px;
padding:20px;
text-align:center;
box-shadow:0 15px 40px rgba(0,0,0,.08);
transition:.35s;
}

.hero-product-card:hover{
transform:translateY(-8px);
}

.hero-product-card img{
width:100%;
height:170px;
object-fit:contain;
margin-bottom:15px;
}

.hero-product-card h6{
font-size:15px;
height:42px;
overflow:hidden;
margin-bottom:10px;
}

.hero-product-card strong{
color:#dc3545;
font-size:20px;
}

/* Mobile */

@media(max-width:991px){

.hero-section{
padding:50px 0;
}

.hero-content{
text-align:center;
margin-bottom:40px;
}

.hero-content h1{
font-size:36px;
}

.hero-products{
grid-template-columns:repeat(2,1fr);
gap:15px;
}

.hero-product-card img{
height:120px;
}

}