:root{--biru:#23205F;--ungu:#8C84D9;--latar:#f6f5fb;--teks:#1d1b3a}
*{box-sizing:border-box}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;background:var(--latar);color:var(--teks);line-height:1.5}
.kepala{background:var(--biru);color:#fff;text-align:center;padding:40px 20px 36px}
.logo{border-radius:50%;width:120px;height:120px;box-shadow:0 0 0 4px rgba(255,255,255,.15)}
h1{margin:14px 0 4px;font-size:1.8rem;letter-spacing:.5px}
.bio{margin:0 0 22px;opacity:.9}
.butang{display:inline-block;background:#25D366;color:#fff;text-decoration:none;font-weight:700;padding:14px 26px;border-radius:999px;font-size:1.05rem}
.butang:hover{filter:brightness(.95)}
main{max-width:880px;margin:0 auto;padding:8px 18px 30px}
h2{color:var(--biru);font-size:1.25rem;margin:30px 0 12px}
.servis ul{list-style:none;padding:0;margin:0;display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.servis li{background:#fff;border-left:5px solid var(--ungu);border-radius:10px;padding:14px 16px;box-shadow:0 1px 3px rgba(0,0,0,.06)}
.servis li strong{display:block;color:var(--biru)}
.servis li span{font-size:.92rem;opacity:.8}
.galeri{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:26px}
.galeri img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:10px;display:block}
@media(min-width:720px){.galeri{grid-template-columns:repeat(4,1fr)}}
.hubungi{text-align:center;background:#fff;border-radius:14px;padding:24px 18px;margin-top:30px;box-shadow:0 1px 3px rgba(0,0,0,.06)}
.hubungi p{margin:0 0 18px}
.sosial{margin-top:18px;display:flex;gap:18px;justify-content:center;flex-wrap:wrap}
.sosial a{color:var(--biru);font-weight:600}
footer{text-align:center;font-size:.85rem;opacity:.7;padding:10px 18px 30px}
footer a{color:inherit}