/* RESET */
*{margin:0;padding:0;box-sizing:border-box;}
body{font-family:system-ui;}

/* CONTAINER */
.container{width:90%;max-width:1200px;margin:auto;}

/* HERO */
.hero{
height:100vh;
position:relative;
background:url('/hub/Assets/4-Photoroom.png') center/cover no-repeat;
display:flex;
align-items:center;
justify-content:center;
}

.hero-overlay{
position:absolute;
inset:0;
background:linear-gradient(rgba(0,0,0,.6),rgba(0,0,0,.2));
}

.hero-content{
position:relative;
color:white;
text-align:center;
}

.hero-content h1{font-size:52px;}
.hero-sub{margin:10px 0 20px;color:#d1d5db;}

.hero-cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;}

.btn-primary{
background:#10b981;color:white;padding:12px 20px;border:none;border-radius:8px;
}
.btn-outline{
border:1px solid white;color:white;padding:12px 20px;background:transparent;border-radius:8px;
}

/* PRODUCT */
.product-showcase{text-align:center;padding:60px 0;}
.main-bike{width:60%;max-width:700px;}

/* QUICK SPECS */
.quick-specs{background:#f9fafb;padding:60px 0;}
.spec-row{display:flex;flex-wrap:wrap;gap:20px;justify-content:space-between;}
.spec-item{flex:1;min-width:120px;text-align:center;}
.spec-item h3{color:#10b981;}

/* FEATURE */
.feature{padding:100px 0;}
.feature-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:60px;
align-items:center;
}
.feature img{width:100%;border-radius:20px;}

/* SPECS */
.full-specs{padding:100px 0;background:#f9fafb;}
.section-title{text-align:center;margin-bottom:40px;font-size:36px;}

.spec-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
gap:25px;
}

.spec-box{
background:white;
padding:25px;
border-radius:12px;
text-align:center;
box-shadow:0 10px 25px rgba(0,0,0,0.05);
}

/* GALLERY */
.gallery{padding:100px 0;}
.gallery-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
gap:20px;
}
.gallery-grid img{width:100%;border-radius:12px;}

/* FOOTER */
.footer{background:#020617;color:white;padding:80px 0;}
.footer-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
gap:50px;
}
.footer a{display:block;color:#9ca3af;margin-bottom:10px;text-decoration:none;}
.footer-bottom{text-align:center;margin-top:40px;color:#6b7280;}

/* SCROLL ANIMATION */
.reveal{
opacity:0;
transform:translateY(60px);
transition:all 0.8s ease;
}
.reveal.active{
opacity:1;
transform:translateY(0);
}

/* RESPONSIVE */
@media(max-width:768px){
.hero-content h1{font-size:32px;}
.main-bike{width:90%;}
.feature-grid{grid-template-columns:1fr;}
.section-title{font-size:28px;}
}