/* PrimeAset — lembar gaya daftar pantau */
:root{
  --bg:#f7f7fb; --ink:#0b1220; --vio:#6d28d9; --vio-d:#5b21b6; --lime:#65a30d; --lime-l:#ecfccb;
  --panel:#ede9fe; --mute:#465066; --line:#dfdaf0; --card:#ffffff; --r:14px;
  --lift:0 18px 40px -22px rgba(76,29,149,.45), 0 3px 10px -4px rgba(11,18,32,.10);
  --hd:"Syne", "Trebuchet MS", sans-serif; --tx:"Atkinson Hyperlegible", "Segoe UI", Arial, sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.68 var(--tx);overflow-wrap:break-word}
img{max-width:100%;height:auto;display:block}
a{color:var(--vio-d);text-underline-offset:3px}
a:hover{color:var(--vio)}
h1,h2,h3{font-family:var(--hd);line-height:1.18;letter-spacing:-.01em;color:var(--ink)}
h1{font-size:clamp(1.75rem,5.2vw,2.75rem);margin:.3em 0 .35em;font-weight:800}
h2{font-size:clamp(1.35rem,3.6vw,1.8rem);margin:2.1em 0 .6em;font-weight:700}
h3{font-size:1.14rem;margin:1.5em 0 .45em;font-weight:700}
p{margin:0 0 1em}
ul,ol{padding-left:1.25em}
li{margin:.3em 0}
table{border-collapse:collapse;width:100%;font-size:.95rem}
th,td{text-align:left;padding:.65em .75em;border-bottom:1px solid var(--line);vertical-align:top}
th{font-family:var(--hd);font-size:.9rem;background:var(--panel);font-weight:700}

/* bilah atas */
.bar{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
.bar-in{max-width:1180px;margin:0 auto;padding:8px 16px;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.mark{display:inline-flex;align-items:center;gap:9px;font:800 1.3rem var(--hd);color:var(--ink);text-decoration:none;min-height:44px}
.mark b{color:var(--vio)}
.topnav{margin-left:auto}
.topnav ul{list-style:none;margin:0;padding:0;display:flex;gap:4px;flex-wrap:wrap}
.topnav li{margin:0}
.topnav a{display:inline-flex;align-items:center;min-height:40px;padding:0 12px;border-radius:999px;text-decoration:none;color:var(--ink);font-size:.95rem}
.topnav a:hover,.topnav a[aria-current]{background:var(--panel);color:var(--vio-d)}
.rail{border-top:1px solid var(--line);background:linear-gradient(90deg,#fbfaff,#f3f0ff)}
.rail ul{list-style:none;margin:0 auto;max-width:1180px;padding:6px 16px;display:flex;gap:8px;overflow-x:auto;scrollbar-width:thin}
.rail li{margin:0;flex:0 0 auto}
.rail-code{display:inline-flex;align-items:center;gap:7px;min-height:38px;padding:0 13px;border-radius:999px;background:#fff;border:1px solid var(--line);font:700 .9rem var(--hd);color:var(--ink);text-decoration:none}
.rail-code span{font:400 .82rem var(--tx);color:var(--mute)}
.rail-code.on,.rail-code:hover{border-color:var(--vio);box-shadow:0 0 0 2px var(--panel)}
@media (max-width:640px){.topnav{margin-left:0;width:100%}.topnav ul{overflow-x:auto;flex-wrap:nowrap}.topnav a{padding:0 10px;font-size:.92rem}.rail-code span{display:none}}

/* kerangka isi */
.wrap{max-width:800px;margin:0 auto;padding:12px 16px 40px}
.wide{max-width:1180px;margin:0 auto;padding:12px 16px 40px}
.crumbs ol{list-style:none;padding:0;margin:10px 0 4px;display:flex;flex-wrap:wrap;gap:4px 8px;font-size:.88rem;color:var(--mute)}
.crumbs li{margin:0}
.crumbs li+li::before{content:"›";margin-right:8px;color:#9a93b8}
.crumbs a{color:var(--mute)}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}
.chip{display:inline-block;font:700 .8rem var(--tx);padding:4px 11px;border-radius:999px;background:var(--panel);color:var(--vio-d);letter-spacing:.01em}
.chip.g{background:var(--lime-l);color:#3f6212}
.chip.d{background:#0b1220;color:#fff}
.chip.o{background:#fff7ed;color:#9a3412}
.lead{font-size:1.12rem;color:#1c2436}
.stamp{font-size:.88rem;color:var(--mute);margin-top:-.3em}
.ph{margin:18px 0 26px}
.ph img{border-radius:var(--r);box-shadow:var(--lift);width:100%}
.ph figcaption{font-size:.88rem;color:var(--mute);margin-top:8px}
.tbl{overflow-x:auto;margin:1em 0 1.4em;border-radius:var(--r);background:#fff;box-shadow:var(--lift);-webkit-overflow-scrolling:touch}
.tbl table{min-width:520px}
.tbl caption{caption-side:bottom;text-align:left;font-size:.86rem;color:var(--mute);padding:.6em .8em}
.warn{border-radius:var(--r);background:#fff;border:1px solid #f1d5b8;border-left:6px solid #ea580c;padding:14px 16px;margin:26px 0;font-size:.97rem}
.warn p{margin:0}
.box{border-radius:var(--r);background:var(--panel);padding:16px 18px;margin:1.3em 0}
.box p:last-child{margin:0}
.calc{border-radius:var(--r);background:#0b1220;color:#e8e6f5;padding:16px 18px;margin:1.3em 0;font-size:.97rem}
.calc strong{color:#d9f99d}
.calc p:last-child{margin:0}
.next-read{margin:34px 0 0;border-top:2px dashed var(--line);padding-top:16px}
.nr-label{font:700 1rem var(--hd);margin-bottom:.4em}
.next-read ul{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.next-read li{margin:0}
.next-read a{display:flex;align-items:center;min-height:44px;padding:8px 14px;border-radius:12px;background:#fff;box-shadow:var(--lift);text-decoration:none;font-weight:700}
.faq .qa{background:#fff;border-radius:var(--r);padding:4px 18px 8px;margin:10px 0;box-shadow:var(--lift)}
.faq .qa h3{margin-top:.9em;font-size:1.04rem}
.steps{counter-reset:st;list-style:none;padding:0}
.steps li{counter-increment:st;position:relative;padding:4px 0 6px 48px;margin:.7em 0}
.steps li::before{content:counter(st);position:absolute;left:0;top:2px;width:34px;height:34px;border-radius:10px;background:var(--vio);color:#fff;font:800 .95rem var(--hd);display:flex;align-items:center;justify-content:center}

/* kartu emiten */
.id-card{background:#fff;border-radius:var(--r);box-shadow:var(--lift);padding:18px;margin:18px 0 8px;position:relative;overflow:hidden}
.id-card::after{content:"";position:absolute;right:-40px;top:-40px;width:140px;height:140px;border-radius:50%;background:radial-gradient(circle,var(--panel) 0,transparent 70%)}
.id-top{display:flex;align-items:center;gap:12px;margin-bottom:10px}
.id-code{font:800 1.5rem var(--hd);background:var(--vio);color:#fff;border-radius:12px;padding:6px 12px;letter-spacing:.04em}
.id-name{font-weight:700;line-height:1.3}
.id-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px 18px;margin:0}
.id-grid div{border-top:1px solid var(--line);padding-top:8px}
.id-grid dt{font-size:.82rem;color:var(--mute);text-transform:uppercase;letter-spacing:.04em}
.id-grid dd{margin:2px 0 0;font-weight:700}
.id-src{font-size:.84rem;color:var(--mute);margin:12px 0 0}
.tl{list-style:none;padding:0;margin:1em 0;border-left:3px solid var(--panel)}
.tl li{position:relative;padding:0 0 12px 22px;margin:0}
.tl li::before{content:"";position:absolute;left:-8px;top:7px;width:13px;height:13px;border-radius:50%;background:#fff;border:3px solid var(--vio)}
.tl b{font-family:var(--hd);color:var(--vio-d);margin-right:6px}
.chk-wrap{background:linear-gradient(160deg,#fff 0,#faf8ff 100%);border-radius:var(--r);box-shadow:var(--lift);padding:14px}
.chk-head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin:0 4px 8px}
.chk-count{font:700 .9rem var(--hd);color:var(--lime);background:var(--lime-l);padding:4px 10px;border-radius:999px}
.chk{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.chk li{margin:0}
.chk-item{all:unset;box-sizing:border-box;cursor:pointer;display:grid;grid-template-columns:30px 1fr;gap:4px 12px;width:100%;padding:12px;border-radius:12px;background:#fff;border:1px solid var(--line);min-height:48px;font:inherit;color:inherit}
.chk-item:focus-visible{outline:3px solid var(--vio);outline-offset:2px}
.chk-box{width:26px;height:26px;border-radius:8px;border:2px solid var(--vio);display:flex;align-items:center;justify-content:center;grid-row:span 2}
.chk-item[aria-pressed="true"]{background:#f7fee7;border-color:#bef264}
.chk-item[aria-pressed="true"] .chk-box{background:var(--lime);border-color:var(--lime)}
.chk-item[aria-pressed="true"] .chk-box::after{content:"";width:7px;height:12px;border:solid #fff;border-width:0 3px 3px 0;transform:rotate(45deg) translate(-1px,-1px)}
.chk-t{font-weight:700;line-height:1.35}
.chk-d{font-size:.95rem;color:#2c3446;line-height:1.5}
.chk-d .chip{margin-left:4px;font-size:.78rem;padding:2px 9px}

/* beranda */
.hero{display:grid;grid-template-columns:1.1fr .9fr;gap:30px;align-items:center;padding-top:10px}
.hero h1{font-size:clamp(1.9rem,5vw,3rem)}
.hero .ph{margin:0}
.pulse{display:inline-flex;align-items:center;gap:8px;font:700 .85rem var(--hd);color:#3f6212;background:var(--lime-l);padding:5px 12px;border-radius:999px}
.pulse::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 4px rgba(101,163,13,.2)}
.float-stack{display:grid;gap:10px;margin-top:18px}
.mini{display:flex;align-items:center;gap:12px;background:#fff;border-radius:var(--r);box-shadow:var(--lift);padding:10px 14px;text-decoration:none;color:var(--ink);min-height:56px}
.mini:nth-child(2){margin-left:18px}.mini:nth-child(3){margin-left:36px}
.mini b{font:800 1.05rem var(--hd);color:var(--vio-d);min-width:56px}
.mini span{font-size:.95rem;color:var(--mute)}
.sec-title{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.sec-title .chip{transform:translateY(-3px)}
.mtx{min-width:860px}
.mtx td:first-child{font-family:var(--hd);font-weight:800;color:var(--vio-d);white-space:nowrap}
.mtx td a{display:inline-flex;align-items:center;min-height:36px;padding:0 12px;border-radius:999px;background:var(--vio);color:#fff;text-decoration:none;font-weight:700;font-size:.9rem;white-space:nowrap}
.mtx td a:hover{background:var(--vio-d)}
.meter{display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:start;background:#fff;border-radius:var(--r);box-shadow:var(--lift);padding:20px}
.gauge{text-align:center}
.gauge svg{width:100%;max-width:340px;margin:0 auto;display:block}
.g-lab{font:800 1.25rem var(--hd);margin:4px 0 2px}
.g-sub{font-size:.95rem;color:var(--mute);margin:0}
.facts{display:grid;gap:8px}
.fact{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;gap:10px;min-height:48px;padding:10px 12px;border-radius:12px;border:1px solid var(--line);background:#fbfaff;font:inherit;font-size:.97rem;line-height:1.4}
.fact::before{content:"+";flex:0 0 26px;height:26px;border-radius:8px;background:var(--panel);color:var(--vio-d);font-weight:800;display:flex;align-items:center;justify-content:center}
.fact[aria-pressed="true"]{border-color:var(--vio);background:#f5f3ff}
.fact[aria-pressed="true"]::before{content:"✓";background:var(--vio);color:#fff}
.fact:focus-visible{outline:3px solid var(--vio);outline-offset:2px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 18px;border-radius:12px;border:0;background:var(--vio);color:#fff;font:700 .95rem var(--tx);cursor:pointer}
.btn:hover{background:var(--vio-d)}
.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding:0;list-style:none;counter-reset:tr}
.trio li{background:#fff;border-radius:var(--r);box-shadow:var(--lift);padding:18px;margin:0;counter-increment:tr}
.trio li::before{content:"0" counter(tr);font:800 1.6rem var(--hd);color:var(--lime);display:block}
.shelf{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.shelf article{background:#fff;border-radius:var(--r);box-shadow:var(--lift);overflow:hidden;display:flex;flex-direction:column}
.shelf .ph{margin:0}.shelf .ph img{border-radius:0;box-shadow:none}
.shelf h3{margin:.8em 16px .3em;font-size:1.05rem}
.shelf h3 a{color:var(--ink);text-decoration:none}
.shelf h3 a:hover{color:var(--vio)}
.shelf p{margin:0 16px 16px;font-size:.95rem;color:#2c3446}
.split{display:grid;grid-template-columns:1fr 1fr;gap:26px;align-items:center}
.note-strip{background:var(--ink);color:#e7e5f4;border-radius:var(--r);padding:20px 22px;margin-top:36px}
.note-strip a{color:#d9f99d}
.note-strip p:last-child{margin:0}
@media (max-width:860px){.hero,.meter,.split{grid-template-columns:1fr}.trio,.shelf{grid-template-columns:1fr}.mini:nth-child(n){margin-left:0}}

/* tabel ya/tidak & kontak */
.dodont{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.dodont div{background:#fff;border-radius:var(--r);box-shadow:var(--lift);padding:14px 16px}
.dodont .no{border-top:5px solid #ea580c}.dodont .yes{border-top:5px solid var(--lime)}
@media (max-width:640px){.dodont{grid-template-columns:1fr}}

/* kaki */
.foot{background:#0b1220;color:#c9c6dc;margin-top:30px;padding:34px 16px 20px;font-size:.95rem}
.foot-grid{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:24px}
.foot-name{font:800 1.3rem var(--hd);color:#fff}.foot-name b{color:#a78bfa}
.foot-label{font:700 .95rem var(--hd);color:#fff;margin-bottom:.4em}
.foot ul{list-style:none;padding:0;margin:0}
.foot li{margin:0}
.foot a{color:#ddd6fe;display:inline-flex;align-items:center;min-height:36px;text-decoration:none}
.foot a:hover{color:#d9f99d;text-decoration:underline}
.foot-copy{max-width:1180px;margin:20px auto 0;border-top:1px solid #243049;padding-top:14px;font-size:.88rem}
@media (max-width:860px){.foot-grid{grid-template-columns:1fr 1fr}.foot-brand{grid-column:1/-1}}
@media (max-width:480px){.foot-grid{grid-template-columns:1fr}}
.nf{text-align:center;padding:40px 0}

/* tambahan: rak teks, tanya-jawab, catatan meteran */
.art-head{padding-top:4px}
.shelf article{padding:6px 0 4px}
.shelf-k{font:800 1.5rem var(--hd);color:var(--lime);margin:12px 16px 0}
.g-note{font-size:.93rem;color:var(--mute);margin:10px 0 0}
.qa-list{margin:0}
.qa-list dt{font:700 1.08rem var(--hd);margin:1.4em 0 .35em;color:var(--vio-d)}
.qa-list dd{margin:0;padding:12px 16px;background:#fff;border-radius:var(--r);box-shadow:var(--lift)}
.split .trio{grid-template-columns:1fr}
.id-top{position:relative;z-index:1}
