/*! © 2026 Arkafadu (arkafadu.com). Hak cipta dilindungi undang-undang. Dilarang menyalin, mengubah, atau menyebarkan tanpa izin tertulis. */
/* Dunia Kulminasi — halaman depan (kawasan Tugu Khatulistiwa, tepi Sungai Kapuas) */
:root{
  --kertas:#F7F3E8; --kertas-2:#EFE8D6; --tinta:#1D2B53; --redup:#4A5878;
  --melayu:#1E5A45; --hijau:#2F7A4A; --kuning:#F2C94C; --emas:#F5A623; --garis0:#C0392B;
  --kapuas:#8A7550; --kapuas-2:#6E5B3C; --langit:#BFE3F7; --oranye:#C2410C; --garis:#E3D8BC;
  --huruf:'Plus Jakarta Sans','Segoe UI',Arial,sans-serif; --judul:'Baloo 2','Trebuchet MS',sans-serif; --retro:'Jersey 10','Courier New',monospace;
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:80px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--kertas);color:var(--tinta);font:16px/1.6 var(--huruf);-webkit-font-smoothing:antialiased}
a{color:inherit}
h1,h2,h3{font-family:var(--judul);font-weight:800;line-height:1.08;margin:0 0 12px}
h1{font-size:clamp(34px,5vw,54px)} h2{font-size:clamp(28px,3.6vw,40px)} h3{font-size:21px;margin-bottom:6px}
p{margin:0 0 12px}
.wadah{max-width:1140px;margin:0 auto;padding:0 24px}
.retro{display:block;font-family:var(--retro);font-size:24px;letter-spacing:1.5px;line-height:1;color:var(--garis0);margin-bottom:8px}
.retro.terang{color:#FFE08A}
.pengantar{color:var(--redup);max-width:42em}
.px{image-rendering:pixelated}
:focus-visible{outline:3px solid var(--emas);outline-offset:3px;border-radius:6px}

/* tombol */
.tbl{display:inline-flex;align-items:center;justify-content:center;gap:6px;text-decoration:none;font-weight:800;border-radius:999px;padding:13px 24px;font-size:15px;border:2px solid transparent;line-height:1.2;cursor:pointer}
.tbl.kecil{padding:8px 16px;font-size:13.5px}
.tbl.oranye{background:var(--oranye);color:#fff}.tbl.oranye:hover{background:#9A3A0C}
.tbl.garis{border-color:var(--tinta);color:var(--tinta);background:#fff}.tbl.garis:hover{background:var(--kertas-2)}
.tbl.kuning{background:var(--kuning);color:var(--tinta)}
.tbl.garis-terang{border-color:#fff;color:#fff}.tbl.garis-terang:hover{background:rgba(255,255,255,.12)}
.tbl.mati{background:#E4DED0;color:var(--redup);cursor:default}

/* kepala */
.atas{position:sticky;top:0;z-index:10;background:rgba(247,243,232,.95);backdrop-filter:blur(6px);border-bottom:2px solid var(--garis)}
.baris-atas{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:10px;padding-bottom:10px}
.merek{display:flex;align-items:center;gap:10px;text-decoration:none}
.merek b{display:block;font-family:var(--judul);font-size:22px;line-height:1}
.merek small{font-size:12px;color:var(--redup);font-weight:600}
.menu{display:flex;align-items:center;gap:18px;font-weight:700;font-size:14px}
.menu a{text-decoration:none}.menu a:not(.tbl):hover{color:var(--garis0)}

/* pembuka */
.pembuka{position:relative;padding:44px 0 56px;overflow:hidden;background:linear-gradient(#A9DBF3,#DCEFF8 58%,#F4EEDA);border-bottom:4px solid var(--kapuas-2)}
.isi-pembuka{position:relative;display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:32px;align-items:center}
.kertas-catatan{background:rgba(255,253,246,.96);border:2px solid var(--garis);border-radius:22px;padding:28px 30px;box-shadow:8px 8px 0 rgba(30,90,69,.28);max-width:580px}
.kertas-catatan p{color:var(--redup)}
.lencana{display:inline-flex;align-items:center;gap:8px;background:#FFF4D2;border:2px solid #EBC96B;border-radius:999px;padding:4px 12px;font-size:13px;font-weight:800;color:#7A5A12;margin-bottom:10px}
.lencana i{width:10px;height:10px;border-radius:50%;background:var(--garis0);display:inline-block}
.aksi{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0 10px}
.catatan{font-size:13.5px;margin:0}
.ilustrasi{margin:0;justify-self:center;width:100%;max-width:540px}
.ilustrasi svg{display:block;width:100%;height:auto;border-radius:26px;border:4px solid #fff;box-shadow:0 16px 34px rgba(29,43,83,.22)}
.ilustrasi figcaption{font-size:13px;color:var(--redup);text-align:center;margin-top:8px;font-weight:600}

/* jendela 3D: tangkapan layar dunia */
.jendela-3d{padding:56px 0 8px}
.foto{margin:0;background:#fff;padding:10px 10px 8px;border-radius:8px;box-shadow:0 14px 30px rgba(0,0,0,.18)}
.foto img{display:block;width:100%;height:auto;border-radius:4px}
.foto figcaption{font-family:var(--retro);font-size:21px;color:var(--garis0);text-align:center;padding-top:8px;line-height:1.1}

/* bagian */
.bagian{padding:72px 0}
.paket-saya{font-size:14px;color:var(--redup)}
.kisi-balai{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:24px}
.balai{display:flex;flex-direction:column;text-decoration:none;background:#FFFDF6;border:2px solid var(--garis);border-radius:20px;overflow:hidden;transition:transform .15s,box-shadow .15s}
a.balai:hover{transform:translateY(-4px);box-shadow:0 12px 24px rgba(30,90,69,.18)}
.atap-balai{position:relative;display:block;height:92px;background:linear-gradient(#CDEBF7,#EAF6FB)}
.atap-balai svg{position:absolute;inset:0;width:100%;height:100%}
.papan-balai{display:flex;flex-direction:column;gap:2px;padding:14px 20px;color:#FFF3C4;background:var(--melayu);border-top:4px solid var(--kuning)}
.balai-11 .papan-balai{background:#8E3B22}
.balai-12 .papan-balai{background:#24566A}
.papan-balai b{font-family:var(--judul);font-size:28px;line-height:1}
.papan-balai small{font-weight:700;font-size:14px;opacity:.95}
.isi-balai{display:flex;flex-direction:column;gap:8px;padding:16px 20px 18px;flex:1}
.isi-balai .ket{color:var(--redup);font-size:14px}
.status{font-weight:800;color:var(--redup)}
.label-bab{font:800 12px var(--huruf);letter-spacing:.06em;text-transform:uppercase;color:var(--hijau)}
.daftar-bab{margin:0;padding-left:20px;font-weight:700;font-size:14.5px}
.daftar-bab li{margin:2px 0}
.masuk{margin-top:auto;font-weight:800;color:var(--oranye)}
.balai.tutup{background:#F4EFE2}
.balai.tutup .papan-balai,.balai.tutup .atap-balai{filter:saturate(.5)}

/* tentang kulminasi */
.kulminasi{background:linear-gradient(#FFF7DE,#FBEFC8);border-top:2px solid #EBDDAF;border-bottom:2px solid #EBDDAF}
.dua-kolom{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:36px;align-items:center}
.fakta{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:10px}
.fakta li{display:grid;grid-template-columns:92px 1fr;gap:12px;align-items:start;background:#FFFDF6;border:2px solid #EBDDAF;border-radius:16px;padding:10px 14px}
.fakta .th{font-family:var(--judul);font-weight:800;font-size:20px;line-height:1.1;color:var(--garis0)}
.fakta b{display:block}
.fakta small{display:block;color:var(--redup);font-size:13.5px;line-height:1.45}
.diagram{width:100%;height:auto;filter:drop-shadow(0 10px 18px rgba(0,0,0,.1))}
.keterangan{font-size:13px;color:var(--redup);text-align:center;margin-top:6px}

/* peta */
.peta-bagian{background:var(--kertas-2);border-bottom:2px solid var(--garis)}
.daftar-peta{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-direction:column;gap:9px}
.daftar-peta li{display:flex;gap:12px;align-items:flex-start;background:#FFFDF6;border:2px solid var(--garis);border-radius:16px;padding:9px 14px}
.daftar-peta b{display:block}
.daftar-peta small{color:var(--redup);font-size:13.5px}
.pin{flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--tinta);color:#fff;font:800 13px var(--huruf)}
.pin-10{background:var(--melayu)}.pin-11{background:#8E3B22}.pin-12{background:#24566A}.pin-rg{background:var(--oranye)}.pin-0{background:var(--garis0)}
.peta{width:100%;height:auto;filter:drop-shadow(0 10px 18px rgba(0,0,0,.12))}

/* teman */
.teman{list-style:none;margin:20px 0 0;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px}
.teman li{display:flex;flex-direction:column;align-items:center;gap:6px;background:#FFFDF6;border:2px solid var(--garis);border-radius:18px;padding:14px 8px;font-weight:800}
.teman img{width:72px;height:72px}

/* guru */
.guru{background:var(--melayu);color:#fff}
.guru h2{color:#fff}
.langkah{margin:12px 0 0;padding-left:20px;display:flex;flex-direction:column;gap:10px;color:#E3F1E6}
.langkah b{color:#fff}
.kartu-guru{background:rgba(255,255,255,.08);border:2px solid rgba(255,255,255,.22);border-radius:22px;padding:24px;display:flex;flex-direction:column;gap:10px}
.kartu-guru p{color:#E3F1E6}

/* kaki */
.bawah{padding:26px 0;font-size:13.5px;color:var(--redup);border-top:2px solid var(--garis)}
.baris-bawah{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}

@media (max-width:900px){
  .isi-pembuka,.dua-kolom{grid-template-columns:1fr}
  .kisi-balai{grid-template-columns:1fr}
  .teman{grid-template-columns:repeat(3,minmax(0,1fr))}
  .ilustrasi{order:-1;max-width:460px}
}
@media (max-width:600px){
  .wadah{padding:0 16px}
  .menu a:not(.tbl){display:none}
  .kertas-catatan{padding:22px 20px}
  .bagian{padding:52px 0}
  .pembuka{padding:24px 0 40px}
  .ilustrasi svg{border-radius:20px}
  .fakta li{grid-template-columns:1fr;gap:2px}
}