/* Tata letak artikel BARU (rancangan UX 28 Okt): TOC kiri lengket + scrollspy + progres baca + bilah bawah HP/tablet.
   HANYA dimuat bila TATA_BARU (env SITUS_TATA_ARTIKEL=baru), SESUDAH artikel.css — jadi berkas ini menimpa aturan lama
   (.ar-toc kotak <details>, grid 2 kolom 300px, sembunyi .ar-reseller-sisip di >=1024). artikel.css sendiri tidak diubah. */
/* ---------- tata letak artikel: TOC kiri lengket + bilah bawah HP (rancangan 28 Okt) */
.ar{max-width:1180px}
.ar-tata{display:block}
.ar-utama{max-width:680px;min-width:0;margin:0 auto}
.ar-isi h2[id],.ar-isi h3[id],#h-faq,#h-produk,#h-wa,#ar-h1{scroll-margin-top:16px}
.ar-isi [tabindex="-1"]:focus,#ar-h1:focus,#h-faq:focus,#h-produk:focus,#h-wa:focus{outline:none}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}

/* daftar isi — tanpa JS: kotak biasa di atas isi; dengan JS: lembar (HP) / laci kiri (tablet) / kolom kiri lengket (desktop) */
.ar-kiri{display:flex;flex-direction:column;background:#fff;border-radius:12px;box-shadow:inset 0 0 0 1px #dbe5e2;
  max-width:680px;margin:0 auto 20px;box-sizing:border-box}
.ar-toc-kepala{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 6px 0 16px;flex:none}
.ar-toc-judul{font:600 13px/1.4 Inter,sans-serif;letter-spacing:.04em;text-transform:uppercase;color:#0b6355}
.ar-lembar-tutup{display:none;align-items:center;justify-content:center;width:44px;height:44px;border:0;border-radius:10px;
  background:none;color:#05231c;cursor:pointer}
.ar-lembar-tutup:hover{background:#eef5f3}
.ar-progres{display:none}
.ar-toc{position:relative;overflow-y:auto;overscroll-behavior:contain;padding:4px 8px 4px;
  background:none;border-radius:0;box-shadow:none;margin:0}
.ar-toc ol{list-style:none;margin:0;padding:0;font-size:inherit;line-height:inherit}
.ar-toc li{margin:0}
.ar-toc a{display:flex;align-items:center;min-height:44px;box-sizing:border-box;padding:7px 10px 7px 12px;
  border-left:3px solid transparent;border-radius:0 8px 8px 0;color:#25433b;text-decoration:none;font-size:15px;line-height:1.35}
.ar-toc ol ol a{padding-left:26px;font-size:14px;color:#4a635c}
.ar-toc li:not(.ar-toc-ekor)+.ar-toc-ekor{border-top:1px solid #eef5f3;margin-top:4px;padding-top:4px}
.ar-toc a:hover{background:#f5faf9;color:#05231c;text-decoration:none}
.ar-toc a[aria-current]{border-left-color:#0e7a68;background:#e6f4f0;color:#05231c;font-weight:600}
.ar-toc a:focus-visible,.ar-ke-atas:focus-visible,.ar-lembar-tutup:focus-visible,.ar-bilah-buka:focus-visible{outline:2px solid #0e7a68;outline-offset:-2px}
.ar-ke-atas{display:flex;align-items:center;gap:6px;flex:none;min-height:44px;padding:0 16px 4px;color:#0b6355;
  font:500 14px Inter,sans-serif;text-decoration:none}
.ar-ke-atas:hover{text-decoration:underline}
.ar-kiri-cta,.ar-kanan,.ar-tirai[hidden],.ar-bilah[hidden]{display:none}

/* bilah bawah HP & tablet: bagian aktif + progres + satu tombol belanja */
.ar-bilah{position:fixed;z-index:30;left:0;right:0;bottom:0;display:flex;align-items:center;gap:8px;
  padding:6px 12px;padding-bottom:max(6px,env(safe-area-inset-bottom));background:#fff;
  box-shadow:0 -1px 0 #dbe5e2,0 -6px 16px rgba(5,35,28,.10);transition:transform .2s ease}
.ar-bilah.sembunyi{transform:translateY(110%)}
.ar-bilah-progres{position:absolute;left:0;right:0;top:0;height:3px;background:#0e7a68;transform:scaleX(0);transform-origin:0 50%}
.ar-bilah-buka{flex:1;min-width:0;min-height:48px;display:flex;align-items:center;gap:10px;padding:0 6px;border:0;
  border-radius:10px;background:none;color:#05231c;font:inherit;text-align:left;cursor:pointer}
.ar-bilah-buka svg{flex:none;color:#0e7a68}
.ar-bilah-teks{display:flex;flex-direction:column;min-width:0;flex:1}
.ar-bilah-kecil{font:500 12.5px/1.3 Inter,sans-serif;color:#4a635c}
.ar-bilah-label{font:600 15px/1.3 Inter,sans-serif;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ar-bilah .btn{flex:none;min-height:44px;padding:0 16px;font-size:15px}
@media (max-width:400px){.ar-bilah-panah{display:none}.ar-bilah .btn{padding:0 14px}}
.ar-tirai{position:fixed;inset:0;z-index:40;background:rgba(5,35,28,.45)}
.kunci-gulir,.kunci-gulir body{overflow:hidden}
@media (prefers-reduced-motion:reduce){.ar-bilah{transition:none}}

@media (max-width:1023.98px){
  .js .ar-kiri{display:none}
  .js .ar-kiri.buka{display:flex;position:fixed;z-index:41;left:0;right:0;bottom:0;margin:0;max-width:none;
    max-height:80vh;max-height:80dvh;border-radius:16px 16px 0 0;box-shadow:0 -8px 30px rgba(5,35,28,.25);
    padding-bottom:env(safe-area-inset-bottom)}
  .js .ar-kiri.buka .ar-lembar-tutup{display:inline-flex}
  .js .ar-bertoc{padding-bottom:96px}
}
@media (min-width:768px) and (max-width:1023.98px){
  /* tablet potret: laci dari KIRI (sesuai permintaan "TOC di kiri") */
  .js .ar-kiri.buka{top:0;right:auto;width:min(380px,85vw);max-height:none;border-radius:0 16px 16px 0}
}

/* desktop & tablet lanskap: TOC jadi kolom kiri lengket */
@media (min-width:1024px){
  .ar-bilah,.ar-tirai{display:none}
  .ar-tata{display:grid;grid-template-columns:220px minmax(0,680px);column-gap:48px;row-gap:0;justify-content:center;align-items:start}
  .ar-reseller-sisip{display:block}
  .ar-utama{margin:0;max-width:none}
  .ar-kiri,.js .ar-kiri{position:sticky;top:16px;max-height:calc(100vh - 32px);margin:0;max-width:none;
    background:none;box-shadow:none;border-radius:0}
  .ar-toc-kepala{padding:2px 0 6px 12px}
  .ar-progres{display:block;flex:none;height:3px;margin:0 0 8px 12px;border-radius:2px;background:#dbe5e2;overflow:hidden}
  .ar-progres span{display:block;height:100%;background:#0e7a68;transform:scaleX(0);transform-origin:0 50%}
  .ar-toc{flex:1 1 auto;min-height:0;padding:0}
  .ar-toc a{font-size:14px;padding:6px 8px 6px 12px}
  .ar-toc ol ol a{padding-left:24px;font-size:13.5px}
  .ar-toc[data-panjang] ol ol{display:none}
  .ar-toc[data-panjang] .induk-aktif>ol{display:block}
  .ar-ke-atas{padding:0 12px}
  .ar-kiri-cta{display:block;flex:none;margin-top:8px;padding:14px;border-radius:12px;background:#05231c;color:#e3efeb;font-size:14px;line-height:1.45}
  .ar-kiri-cta b{color:#fff}
  .ar-kiri-cta .btn{width:100%;min-height:44px;margin-top:10px;padding:0 12px;font-size:15px}
}
/* layar lebar: 3 kolom — TOC | isi | belanja */
@media (min-width:1200px){
  .ar-tata{grid-template-columns:220px minmax(0,1fr) 264px;column-gap:40px;justify-content:stretch}
  .ar-kiri-cta,.ar-reseller-sisip{display:none}
  .ar-kanan{display:flex;flex-direction:column;gap:16px;position:sticky;top:16px}
  .ar-iklan{display:flex;flex-direction:column;gap:4px;background:#fff;border-radius:14px;box-shadow:0 2px 12px rgba(5,35,28,.08);padding:14px;text-decoration:none;color:#05231c}
  .ar-iklan:hover{color:#05231c;box-shadow:0 6px 18px rgba(5,35,28,.16)}
  .ar-iklan img{width:100%;height:120px;object-fit:cover;border-radius:10px;background:#eef5f3;margin:4px 0}
  .ar-iklan-label{font:600 12.5px/1.4 Inter,sans-serif;color:#0b6355;text-transform:uppercase;letter-spacing:.04em}
  .ar-iklan-nama{font:600 16px/1.3 Inter,sans-serif}
  .ar-iklan-meta,.ar-iklan-ecer{font-size:13px;color:#4a635c}
  .ar-iklan-harga{font-size:15px}.ar-iklan-harga b{font-size:17px}
  .ar-iklan-btn{margin-top:8px;min-height:44px;font-size:15px}
  .ar-kanan .ar-reseller{margin:0;padding:16px}
  .ar-kanan .ar-reseller li:nth-child(2){display:none}   /* rail: cukup harga mulai + COD; detail tingkat ada di isi */
}
@media (min-width:1200px) and (max-height:700px){.ar-iklan img{display:none}}

/* ajakan reseller & tabel sisipan */
.ar-reseller{background:#05231c;color:#fff;border-radius:14px;padding:18px;margin:8px 0 28px}
.ar-reseller-judul{font:600 17px/1.35 Inter,sans-serif;margin-bottom:8px}
.ar-reseller ul{margin:0 0 14px;padding-left:1.1em;font-size:15px;line-height:1.5;color:#e3efeb}
.ar-reseller li{margin:.3em 0}.ar-reseller b{color:#fff}
.ar-reseller .btn{width:100%;margin-bottom:8px}
.ar-reseller-wa{display:flex;justify-content:center;align-items:center;min-height:44px;color:#d4fff5;font-size:15px}
/* PERBAIKAN KRITIS: aturan tautan isi (.ar-isi a) menimpa warna tombol di ajakan sisipan */
.ar-isi .ar-reseller a.btn,.ar-isi .ar-reseller a.btn:hover{color:#fff;text-decoration:none}
.ar-isi .ar-reseller .ar-reseller-wa{color:#d4fff5}
.ar-isi .si-tabel th:not(:first-child),.ar-isi .si-tabel td:not(:first-child){text-align:right}
.ar-isi .si-tabel td{font-variant-numeric:tabular-nums}

/* artikel tanpa TOC (<3 judul): tanpa kolom kiri — 1024–1199 isi di tengah, >=1200 isi + kanan */
@media (min-width:1024px){.ar:not(.ar-bertoc) .ar-tata{grid-template-columns:minmax(0,680px)}}
@media (min-width:1200px){.ar:not(.ar-bertoc) .ar-tata{grid-template-columns:minmax(0,760px) 264px;justify-content:center}}

/* kotak pembuka per jenis (owner ACC 28 Okt): label per jenis, jawaban, poin, peringatan, lompat ke. Ringkas di 360px. */
.ar-kotak .ar-kotak-jawab{margin:0}
.ar-kotak-poin{margin:10px 0 0;padding-left:1.35em;font-size:15.5px;line-height:1.5;color:#05231c}
.ar-kotak-poin li{margin:.3em 0;padding-left:2px}
.ar-kotak-poin li::marker{color:#0b6355;font-weight:600}
.ar-kotak-poin b{font-weight:600}
/* peringatan: jelas namun tenang — latar krem, garis amber, teks coklat tua (kontras 11:1; ikon amber 4,7:1 di atas #fff6e5) */
.ar-intisari .ar-kotak-awas{display:flex;gap:8px;align-items:flex-start;margin:12px 0 0;padding:9px 12px;border-radius:8px;
  background:#fff6e5;box-shadow:inset 3px 0 0 #b45309;color:#5a2a00;font-size:15px;line-height:1.5}
.ar-kotak-ikon{flex:none;color:#b45309;font-weight:700}
.ar-kotak-lompat{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;margin-top:12px;font-size:14px}
.ar-kotak-lompat-judul{font-weight:600;color:#0b6355}
.ar-kotak-lompat a{display:inline-flex;align-items:center;min-height:36px;padding:4px 12px;border-radius:18px;background:#fff;
  box-shadow:inset 0 0 0 1px #9cc7bc;color:#0b6355;text-decoration:none;line-height:1.3}
.ar-kotak-lompat a:hover{background:#f5faf9;color:#05231c}
.ar-kotak-lompat a:focus-visible{outline:2px solid #0e7a68;outline-offset:2px}
@media (max-width:420px){.ar-kotak-poin{font-size:15px;padding-left:1.2em}.ar-intisari .ar-kotak-awas{padding:8px 10px}}
/* iklan kanan artikel non-lampu: kalimat sesuai topik menggantikan label "Lampu terlaris" */
.ar-iklan-kalimat{font:600 15px/1.35 Inter,sans-serif;color:#0b6355}