/* GarudaKripto — lembar gaya buatan sendiri. Krem, tinta, merah tua, emas. */
:root{
  --krem:#fffaf0; --tinta:#1f1a17; --merah:#9f1239; --merah-gelap:#7a0e2c;
  --emas:#b8860b; --panel:#f5ecd9; --abu:#5b504a; --garis:#e4d6b8;
  --sudut:8px; --lebar:780px;
  --f-judul:"Be Vietnam Pro",system-ui,sans-serif; --f-isi:"Noticia Text",Georgia,serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--krem);color:var(--tinta);font-family:var(--f-isi);font-size:17.5px;line-height:1.7;overflow-wrap:break-word}
img{max-width:100%;height:auto;display:block}
a{color:var(--merah)}
a:hover{color:var(--merah-gelap)}
h1,h2,h3{font-family:var(--f-judul);line-height:1.25;color:var(--tinta)}
h1{font-size:clamp(1.65rem,4.6vw,2.45rem);font-weight:800;margin:.2em 0 .45em;letter-spacing:-.01em}
h2{font-size:clamp(1.3rem,3.3vw,1.6rem);font-weight:700;margin:2.1em 0 .6em;padding-top:.7em;border-top:1px solid var(--emas)}
h3{font-size:1.14rem;font-weight:700;margin:1.5em 0 .4em}
p,ul,ol{margin:0 0 1.05em}
li{margin-bottom:.35em}
strong{font-weight:700}

/* kepala situs */
.pita-emas{height:4px;background:linear-gradient(90deg,var(--merah) 0 38%,var(--emas) 38% 100%)}
.kepala{background:var(--krem);border-bottom:1px solid var(--garis)}
.kepala-dalam{max-width:1120px;margin:0 auto;padding:12px 16px;display:flex;flex-wrap:wrap;align-items:center;gap:10px 22px;justify-content:space-between}
.merek{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--tinta);min-height:44px}
.merek svg{width:38px;height:38px;flex:none}
.merek-nama{font-family:var(--f-judul);font-weight:800;font-size:1.22rem;line-height:1.1}
.merek-nama span{color:var(--merah)}
.merek-sub{display:block;font-family:var(--f-isi);font-weight:400;font-size:.78rem;color:var(--abu)}
.menu{display:flex;flex-wrap:wrap;gap:4px;margin:0;padding:0;list-style:none}
.menu li{margin:0}
.menu a{display:inline-flex;align-items:center;min-height:40px;padding:6px 11px;border-radius:var(--sudut);font-family:var(--f-judul);font-size:.92rem;font-weight:600;color:var(--tinta);text-decoration:none}
.menu a:hover,.menu a[aria-current="page"]{background:var(--panel);color:var(--merah)}

/* tata letak isi */
main{display:block}
.wadah{max-width:var(--lebar);margin:0 auto;padding:0 16px 40px}
.wadah-lebar{max-width:1120px;margin:0 auto;padding:0 16px 40px}
.remah{font-family:var(--f-judul);font-size:.84rem;color:var(--abu);margin:18px 0 6px}
.remah ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px}
.remah li{margin:0}
.remah li+li::before{content:"›";margin-right:6px;color:var(--emas)}
.remah a{color:var(--abu)}
.kicker{font-family:var(--f-judul);font-size:.8rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--emas);margin:14px 0 0}
.lead{font-size:1.1rem;color:#3a302b}
.stempel{display:flex;flex-wrap:wrap;gap:6px 14px;font-family:var(--f-judul);font-size:.82rem;color:var(--abu);border-top:1px dashed var(--garis);border-bottom:1px dashed var(--garis);padding:8px 0;margin:0 0 1.4em}
.stempel b{color:var(--tinta)}

/* gambar */
.foto{margin:1.4em 0}
.foto img{border-radius:var(--sudut);border:1px solid var(--garis)}
.foto figcaption{font-size:.86rem;color:var(--abu);margin-top:6px;font-style:italic}

/* langkah bernomor besar */
.tapak{list-style:none;counter-reset:tp;margin:1.3em 0;padding:0}
.tapak>li{counter-increment:tp;position:relative;padding:14px 16px 6px 74px;margin:0 0 12px;background:var(--panel);border-radius:var(--sudut);border:1px solid var(--garis)}
.tapak>li::before{content:counter(tp);position:absolute;left:14px;top:14px;width:44px;height:44px;border-radius:50%;background:var(--merah);color:var(--krem);font-family:var(--f-judul);font-weight:800;font-size:1.3rem;display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 3px var(--panel),0 0 0 4px var(--emas)}
.tapak-judul{font-family:var(--f-judul);font-weight:700;margin:0 0 .25em;font-size:1.03rem}

/* catatan cek ulang */
.cek-ojk{border:1px solid var(--emas);border-left:6px solid var(--emas);background:#fff6df;border-radius:var(--sudut);padding:12px 16px;margin:1.4em 0}
.cek-ojk p{margin:0 0 .5em}
.cek-ojk p:last-child{margin:0}
.cek-label{font-family:var(--f-judul);font-weight:800;font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;color:var(--merah)}

/* kartu ringkas */
.kartu-ringkas{background:#fff;border:1px solid var(--garis);border-top:4px solid var(--merah);border-radius:var(--sudut);padding:14px 16px;margin:1.2em 0 1.6em}
.kr-judul{font-family:var(--f-judul);font-weight:800;margin:0 0 .5em;font-size:.95rem}
.kartu-ringkas dl{margin:0;display:grid;gap:0}
.kartu-ringkas dl>div{display:grid;grid-template-columns:minmax(110px,34%) 1fr;gap:10px;padding:7px 0;border-top:1px solid var(--panel)}
.kartu-ringkas dt{font-family:var(--f-judul);font-size:.86rem;font-weight:600;color:var(--abu)}
.kartu-ringkas dd{margin:0;font-size:.96rem}

/* tabel */
.gulir{overflow-x:auto;margin:1.2em 0 1.5em;border:1px solid var(--garis);border-radius:var(--sudut);background:#fff}
.tbl{border-collapse:collapse;width:100%;font-size:.93rem;min-width:520px}
.tbl caption{text-align:left;font-family:var(--f-judul);font-weight:700;padding:10px 12px;font-size:.9rem;background:var(--panel)}
.tbl th{font-family:var(--f-judul);font-size:.82rem;text-align:left;background:var(--tinta);color:var(--krem);padding:9px 10px;font-weight:600}
.tbl td{padding:9px 10px;border-top:1px solid var(--panel);vertical-align:top}
.tbl tbody tr:nth-child(even) td{background:#fffcf5}
.angka{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}

/* FAQ */
.tanya h3{font-size:1.05rem;padding-left:28px;position:relative}
.tanya h3::before{content:"T";position:absolute;left:0;top:0;width:20px;height:20px;border-radius:50%;background:var(--emas);color:#fff;font-size:.72rem;display:flex;align-items:center;justify-content:center}

/* tombol & tautan kartu */
.tombol{display:inline-flex;align-items:center;min-height:44px;padding:8px 18px;border-radius:var(--sudut);background:var(--merah);color:var(--krem);font-family:var(--f-judul);font-weight:700;font-size:.95rem;text-decoration:none}
.tombol:hover{background:var(--merah-gelap);color:#fff}
.baca-lanjut{list-style:none;padding:0;margin:1em 0;display:grid;gap:10px}
.baca-lanjut li{margin:0}
.baca-lanjut a{display:block;padding:12px 14px;border:1px solid var(--garis);border-radius:var(--sudut);background:#fff;text-decoration:none;font-family:var(--f-judul);font-weight:600;color:var(--tinta)}
.baca-lanjut a:hover{border-color:var(--merah);color:var(--merah)}
.baca-lanjut small{display:block;font-family:var(--f-isi);font-weight:400;color:var(--abu);font-size:.86rem;margin-top:2px}

/* beranda */
.sampul{display:grid;gap:24px;align-items:center;margin-top:10px}
@media(min-width:880px){.sampul{grid-template-columns:1.25fr .75fr}}
.sampul .foto{margin:0}
.buku-besar{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border:1px solid var(--emas);border-radius:var(--sudut);margin:1.2em 0;background:#fff}
.buku-besar div{padding:10px 12px;border-left:1px solid var(--garis)}
.buku-besar div:first-child{border-left:0}
.buku-besar b{display:block;font-family:var(--f-judul);font-size:1.45rem;color:var(--merah);line-height:1.1}
.buku-besar span{font-size:.82rem;color:var(--abu);line-height:1.35;display:block;margin-top:3px}
.dua-kolom{display:grid;gap:16px}
@media(min-width:760px){.dua-kolom{grid-template-columns:1fr 1fr}}
.kolom-kotak{background:var(--panel);border-radius:var(--sudut);padding:14px 16px;border:1px solid var(--garis)}
.kolom-kotak h3{margin-top:.2em}
.kolom-kotak ul{padding-left:1.1em;margin:0}
.linimasa{list-style:none;margin:1em 0;padding:0 0 0 22px;border-left:2px solid var(--emas)}
.linimasa li{position:relative;margin:0 0 14px;padding-left:4px}
.linimasa li::before{content:"";position:absolute;left:-30px;top:.45em;width:12px;height:12px;border-radius:50%;background:var(--krem);border:3px solid var(--merah)}
.linimasa time{display:block;font-family:var(--f-judul);font-weight:700;font-size:.88rem;color:var(--merah)}
.rak{display:grid;gap:14px;margin:1em 0}
@media(min-width:760px){.rak{grid-template-columns:1fr 1fr}}
.rak a{display:block;position:relative;padding:16px 16px 14px 64px;background:#fff;border:1px solid var(--garis);border-radius:var(--sudut);text-decoration:none;color:var(--tinta);min-height:84px}
.rak a:hover{border-color:var(--merah)}
.rak .no{position:absolute;left:14px;top:16px;width:36px;height:36px;border-radius:50%;border:2px solid var(--emas);color:var(--merah);font-family:var(--f-judul);font-weight:800;display:flex;align-items:center;justify-content:center}
.rak strong{display:block;font-family:var(--f-judul);font-size:1.02rem}
.rak span.ket{display:block;font-size:.9rem;color:var(--abu);margin-top:3px}

/* papan harga & kalkulator */
.papan{background:#fff;border:1px solid var(--garis);border-radius:var(--sudut);padding:4px 0 10px;margin:1.3em 0}
.papan .gulir{margin:0;border:0}
.papan-cat{font-size:.86rem;color:var(--abu);margin:8px 14px 0}
.hitung{background:var(--panel);border:1px solid var(--garis);border-radius:var(--sudut);padding:16px;margin:1.4em 0}
.hitung-baris{display:grid;gap:12px}
@media(min-width:620px){.hitung-baris{grid-template-columns:repeat(3,1fr)}}
.hitung label{display:block;font-family:var(--f-judul);font-size:.86rem;font-weight:600;margin-bottom:4px}
.hitung input{width:100%;min-height:44px;padding:8px 10px;font:inherit;font-size:1rem;border:1px solid #c9b995;border-radius:var(--sudut);background:#fff;color:var(--tinta)}
.hitung-hasil{margin:14px 0 0;display:grid;gap:8px}
@media(min-width:620px){.hitung-hasil{grid-template-columns:1fr 1fr}}
.hitung-hasil div{background:#fff;border-radius:var(--sudut);padding:10px 12px;border:1px solid var(--garis)}
.hitung-hasil span{display:block;font-size:.84rem;color:var(--abu)}
.hitung-hasil output{font-family:var(--f-judul);font-weight:800;font-size:1.15rem;color:var(--merah)}

/* kaki */
.kaki{background:var(--tinta);color:#efe4cf;margin-top:30px}
.kaki-dalam{max-width:1120px;margin:0 auto;padding:26px 16px 30px;display:grid;gap:20px}
@media(min-width:820px){.kaki-dalam{grid-template-columns:1.2fr 1fr 1fr}}
.kaki p{margin:0 0 .6em;font-size:.93rem}
.kaki-label{font-family:var(--f-judul);font-weight:700;color:var(--emas);letter-spacing:.05em;text-transform:uppercase;font-size:.8rem}
.kaki ul{list-style:none;margin:0;padding:0}
.kaki li{margin:0}
.kaki a{color:#fff3dc;display:block;padding:6px 0;min-height:32px;text-decoration:none;font-size:.93rem}
.kaki a:hover{color:var(--emas)}
.kaki-bawah{border-top:1px solid #4a3f39;text-align:left;font-size:.84rem;color:#c9bca5;padding:12px 16px;max-width:1120px;margin:0 auto}