/*======================================
PRODUCTS HERO
======================================*/

.products-hero{

height:70vh;

background:url("../images/hero/products-banner.jpg") center center/cover;

position:relative;

display:flex;

align-items:center;

}

.hero-overlay{

position:absolute;

inset:0;

background:rgba(7,26,46,.82);

}

.products-hero .container{

position:relative;

z-index:5;

color:white;

}

.breadcrumb{

margin-bottom:30px;

font-size:15px;

}

.breadcrumb a{

color:#FFC107;

}

.breadcrumb span{

margin:0 10px;

color:#fff;

}

.products-hero h1{

font-size:68px;

line-height:1.1;

max-width:700px;

font-weight:800;

}

.products-hero h1 span{

display:block;

color:#FFC107;

}

.products-hero p{

margin-top:25px;

max-width:650px;

font-size:18px;

line-height:1.8;

color:#d8d8d8;

}

.hero-btns{

margin-top:45px;

display:flex;

gap:20px;

}

/*======================================
FILTER
======================================*/

.product-filter{

padding:100px 0;

background:#fff;

}

.filter-heading{

text-align:center;

max-width:750px;

margin:auto;

}

.filter-heading span{

color:#C8102E;

font-weight:600;

letter-spacing:2px;

}

.filter-heading h2{

font-size:46px;

margin:20px 0;

}

.filter-heading p{

color:#64748B;

line-height:1.8;

}

.filter-buttons{

display:flex;

justify-content:center;

gap:20px;

margin-top:50px;

flex-wrap:wrap;

}

.filter-buttons button{

padding:15px 30px;

border:none;

background:#f3f3f3;

font-family:Poppins;

font-weight:600;

border-radius:40px;

cursor:pointer;

transition:.35s;

}

.filter-buttons button:hover{

background:#C8102E;

color:white;

}

.filter-buttons .active{

background:#C8102E;

color:white;

}

/*======================================
PRODUCT GRID
======================================*/

.products-grid-section{

padding:30px 0 120px;

background:#fff;

}

.products-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:35px;

}

.product-card{

background:white;

border-radius:18px;

overflow:hidden;

box-shadow:0 15px 40px rgba(0,0,0,.08);

transition:.4s;

}

.product-card:hover{

transform:translateY(-12px);

box-shadow:0 30px 60px rgba(0,0,0,.18);

}

.product-image{

position:relative;

overflow:hidden;

height:270px;

}

.product-image img{

width:100%;

height:100%;

object-fit:cover;

transition:.5s;

}

.product-card:hover img{

transform:scale(1.08);

}

.product-overlay{

position:absolute;

inset:0;

background:rgba(7,26,46,.75);

display:flex;

align-items:center;

justify-content:center;

opacity:0;

transition:.4s;

}

.product-card:hover .product-overlay{

opacity:1;

}

.product-overlay a{

padding:14px 28px;

background:#C8102E;

color:white;

border-radius:40px;

font-weight:600;

}

.product-content{

padding:30px;

}

.product-content h3{

margin-bottom:15px;

font-size:24px;

color:#071A2E;

}

.product-content p{

line-height:1.8;

color:#64748B;

margin-bottom:25px;

}

.product-specs{

display:flex;

gap:12px;

flex-wrap:wrap;

}

.product-specs span{

background:#F4F7FA;

padding:8px 16px;

border-radius:30px;

font-size:14px;

font-weight:600;

color:#071A2E;

}