:root{--navy:#2E3B4E;--navy-tua:#1F2A3A;--abu:#8A94A3;--abu-muda:#E6E9EE;--teks:#1F2A3A;--pucat:#5B6676}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--teks);background:#fff;line-height:1.55}
.wadah{max-width:960px;margin:0 auto;padding:0 1rem}
.atas{background:var(--navy-tua);color:#fff}
.atas-isi{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:.5rem;padding-top:.9rem;padding-bottom:.9rem}
.atas a{color:#fff;text-decoration:none}
.merek{font-weight:700;font-size:1.1rem}
.atas nav a{margin-left:1rem}
.atas nav a:hover{text-decoration:underline}
main{padding-top:2rem;padding-bottom:2rem}
h1,h2,h3{color:var(--navy-tua);line-height:1.2}
.hero h1{font-size:clamp(1.7rem,4.5vw,2.6rem);max-width:22ch;margin:0 0 .75rem}
.hero p{max-width:52ch;color:var(--pucat)}
.tombol{display:inline-block;background:var(--navy);color:#fff;border:0;border-radius:4px;padding:.7rem 1.25rem;font:inherit;font-weight:600;text-decoration:none;cursor:pointer}
.tombol:hover{background:var(--navy-tua)}
:focus-visible{outline:2px solid var(--navy);outline-offset:2px}
.layanan{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem;margin:2rem 0}
.panel{border:1px solid var(--abu);border-radius:6px;padding:1.25rem}
.panel h3{margin-top:0}
.panel-utama{background:var(--navy);border-color:var(--navy);color:#fff}
.panel-utama h3{color:#fff}
.bungkus-tabel{overflow-x:auto}
table{width:100%;border-collapse:collapse}
th,td{padding:.6rem .75rem;text-align:left;border-bottom:1px solid var(--abu-muda)}
thead th{background:var(--navy);color:#fff}
tbody tr:nth-child(even)>*{background:var(--abu-muda)}
.angka{text-align:right!important;white-space:nowrap}
.catatan{color:var(--pucat);font-size:.9rem}
.bawah{background:var(--abu-muda);padding:1rem 0;color:var(--pucat);font-size:.9rem}
.form{max-width:600px}
.form p{margin:0 0 1rem}
.form label{display:block;font-weight:600;margin-bottom:.25rem}
.form input[type=text],.form input[type=tel],.form input[type=number],.form select,.form textarea{width:100%;padding:.55rem .65rem;border:1px solid var(--abu);border-radius:4px;font:inherit;background:#fff;color:var(--teks)}
.form fieldset{border:0;padding:0;margin:0 0 1rem;min-width:0}
.form legend{font-weight:600;padding:0;margin-bottom:.5rem}
.pilihan{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:.75rem}
.pilihan label{border:1px solid var(--abu);border-radius:6px;padding:.75rem 1rem;cursor:pointer;margin:0}
.pilihan label:has(input:checked){border-color:var(--navy);background:var(--abu-muda)}
.pilihan small{display:block;font-weight:400;color:var(--pucat)}
.bantu{font-weight:400;font-size:.875em;color:var(--pucat)}
.jebakan{position:absolute;left:-9999px}
.estimasi{background:var(--abu-muda);border-left:4px solid var(--navy);padding:.75rem 1rem;margin-bottom:1rem}
.pesan{padding:.75rem 1rem;border-left:4px solid;margin-bottom:1rem}
.pesan ul{margin:.5rem 0 0 1.1rem;padding:0}
.pesan-ok{border-color:#2e7d32;background:#edf7ee}
.pesan-err{border-color:#b3261e;background:#fdeeed}