* {margin:0; padding:0; box-sizing:border-box;}
body {background:#f3f4f6; color:#1f2937; font-family:'Segoe UI', sans-serif; line-height:1.6;}
a {text-decoration:none; color:inherit;}
.wadah {max-width:1200px; margin:0 auto; padding:0 15px;}

/* HEADER */
.header {background:#0a2463; color:#fff; padding:15px 0; position:sticky; top:0; z-index:100; box-shadow:0 2px 5px rgba(0,0,0,.1);}
.header .wadah {display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px;}
.logo {font-size:20px;}
.menu {display:flex; gap:15px; align-items:center; flex-wrap:wrap; font-size:14px;}
.menu a {color:#e0e7ff; padding:6px 10px; border-radius:4px;}
.menu a.aktif, .menu a:hover {background:#1e3a8a; color:#fff;}

/* BANNER */
.banner {background:linear-gradient(135deg, #0a2463, #2d47a0); color:#fff; padding:60px 20px; text-align:center;}
.banner h2 {font-size:28px; margin-bottom:10px;}
.banner p {font-size:16px; margin-bottom:20px; opacity:.9;}
.btn {display:inline-block; background:#d90429; color:#fff; padding:10px 25px; border-radius:6px; font-weight:500;}
.btn:hover {background:#b90322;}

/* BAGIAN */
.bagian {padding:40px 15px;}
.judul-bagian {font-size:22px; margin-bottom:25px; padding-bottom:10px; border-bottom:2px solid #e5e7eb;}

/* GRID PRODUK */
.grid-produk {display:grid; grid-template-columns:repeat(auto-fill, minmax(230px,1fr)); gap:20px;}
.kartu-produk {background:#fff; border-radius:10px; overflow:hidden; box-shadow:0 2px 5px rgba(0,0,0,.06); transition:.2s;}
.kartu-produk:hover {transform:translateY(-4px); box-shadow:0 5px 15px rgba(0,0,0,.1);}
.gambar-produk {width:100%; aspect-ratio:1; background:#e5e7eb; overflow:hidden;}
.gambar-produk img {width:100%; height:100%; object-fit:cover;}
.tidak-ada-gambar {width:100%; height:100%; display:flex; align-items:center; justify-content:center; font-size:30px; color:#9ca3af;}
.kartu-produk h3 {padding:12px 12px 5px; font-size:15px; color:#1f2937;}
.harga {padding:0 12px; font-size:17px; font-weight:bold; color:#d90429;}
.stok {padding:5px 12px 12px; font-size:13px; color:#6b7280;}

/* DETAIL PRODUK */
.kembali {display:inline-block; margin-bottom:20px; color:#0a2463;}
.detail-produk {display:grid; grid-template-columns:1fr 1fr; gap:30px; background:#fff; padding:25px; border-radius:10px;}
.gambar-detail img {width:100%; border-radius:8px;}
.tidak-ada-gambar-besar {width:100%; aspect-ratio:1; background:#e5e7eb; display:flex; align-items:center; justify-content:center; font-size:50px; color:#9ca3af; border-radius:8px;}
.harga-besar {font-size:28px; font-weight:bold; color:#d90429; margin:10px 0;}
.info-stok {font-size:15px; color:#374151; margin-bottom:15px;}
.deskripsi {margin:20px 0;}
.deskripsi h4 {margin-bottom:10px;}
.btn-pesan {display:inline-block; background:#25d366; color:#fff; padding:12px 30px; border-radius:6px; font-weight:bold; margin-top:10px;}
.btn-pesan:hover {background:#20ba59;}

/* FOOTER */
.footer {background:#0a2463; color:#fff; text-align:center; padding:20px; margin-top:20px;}
.footer a {color:#93c5fd;}

/* RESPONSIF HP */
@media (max-width:768px) {
    .header .wadah {justify-content:center;}
    .menu {justify-content:center;}
    .detail-produk {grid-template-columns:1fr;}
    .grid-produk {grid-template-columns:repeat(auto-fill, minmax(150px,1fr)); gap:12px;}
}