*{margin:0;padding:0;box-sizing:border-box;font-family:'Poppins',sans-serif;scroll-behavior:smooth;}
body{background:#0f2027;color:#fff;}
.container{width:90%;max-width:1100px;margin:auto;}

/* NAVBAR */
.navbar{position:fixed;width:100%;background:#111;padding:15px 0;z-index:999;}
.nav-container{display:flex;justify-content:space-between;align-items:center;}
.logo-section{display:flex;align-items:center;gap:10px;}
.logo-section img{width:40px;}
.nav-menu{display:flex;list-style:none;gap:25px;}
.nav-menu a{color:#fff;text-decoration:none;}
.hamburger{display:none;color:#fff;font-size:24px;cursor:pointer;}

/* HERO */
.hero{height:100vh;background:url('https://astraotoshop.com/asset/article-aop/Memilih-Spare-Part-Mobil-Tepat-Panduan-Lengkap-dan-Tips%20-itu_20240805.webp') center/cover no-repeat;display:flex;align-items:center;justify-content:center;position:relative;text-align:center;}
.hero-overlay{position:absolute;width:100%;height:100%;background:rgba(0,0,0,0.6);}
.hero-content{position:relative;z-index:2;background:rgba(255,255,255,0.08);padding:40px;border-radius:20px;backdrop-filter:blur(10px);}
.btn{display:inline-block;margin-top:15px;padding:10px 25px;background:#ee2f16f5;color:#fff;border-radius:5px;text-decoration:none;}

/* PRODUK */
.produk{padding:150px 0;text-align:center;}
.produk-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap: 30px; margin-top:50px;}
.produk-card{display: flex; flex-direction: column; background:rgba(255,255,255,0.08);border-radius:20px;overflow:hidden;transition:0.4s;backdrop-filter:blur(10px);}
.produk-card p {margin-bottom: 25px;}
.produk-card:hover{transform:translateY(-10px);box-shadow:0 15px 35px rgba(0,0,0,0.5);}
.produk-card img{width:100%;display:block;}
.produk-card button {margin-top: 6px;}
.produk-info{padding:20px; text-align:center;}
.button{display:flex; justify-content: space-around; align-items: center; padding: 20px;background:#ee2f16f5;color:#fff;border-radius:20px;text-decoration:none; transform: translateY(-3px);}

/* TESTIMONI */
.testimoni{padding:100px 0;text-align:center;overflow:hidden;}
.slider{overflow:hidden;margin-top:50px;}
.slide-track{display:flex;width:calc(300px * 5);animation:scroll 20s linear infinite;}
.slide{width:300px;margin-right:20px;padding:25px;background:rgba(255,255,255,0.08);border-radius:15px;}
@keyframes scroll{0%{transform:translateX(0);}100%{transform:translateX(-50%);}}

/* SOCIAL FOOTER */
.social-footer{padding:60px 0;text-align:center;background:#111;}
.social-footer h3{margin-bottom:25px;}
.social-icons{display:flex;justify-content:center;gap:30px;}
.social-icons a{width:55px;height:55px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:rgba(255,255,255,0.08);color:#fff;font-size:22px;transition:0.3s;backdrop-filter:blur(10px);}
.social-icons a:hover{background:#00c853;transform:translateY(-5px);}

/* FOOTER */
footer{background:#000;padding:25px 0;text-align:center;font-size:14px;}

/* WA */
.wa-float{position:fixed;bottom:20px;right:20px;width:55px;height:55px;background:#25D366;border-radius:50%;text-align:center;line-height:55px;color:#fff;font-size:28px;}

/* RESPONSIVE */
@media(max-width:768px){
.nav-menu{position:absolute;top:70px;right:-100%;flex-direction:column;background:#111;width:200px;padding:20px;transition:0.3s;}
.nav-menu.active{right:0;}
.hamburger{display:block;}
=======
*{margin:0;padding:0;box-sizing:border-box;font-family:'Poppins',sans-serif;scroll-behavior:smooth;}
body{background:#0f2027;color:#fff;}
.container{width:90%;max-width:1100px;margin:auto;}