/* Halaman undang-undang (site/legalpage.py): hero spec, indeks melekat di kiri, teks lebar baca di kanan. Tiada JS. */
.lg-hero { padding-bottom: 0; }
/* «In short»: kotak kelabu 4 perkara utama di bawah hero (content.LEGAL_SUMMARY). */
.lg-short { padding-top: 48px; }
.lg-short > div { padding: 32px 36px; border-radius: 20px; background: color-mix(in srgb, var(--ink) 4%, var(--bg)); }
.lg-short h2 { margin: 0 0 20px; color: var(--ink); font: 600 20px/1.3 var(--font-display); }
.lg-short ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 48px; margin: 0; padding: 0; list-style: none; }
.lg-short li { display: flex; gap: 12px; align-items: flex-start; color: var(--ink); font-size: 16px; line-height: 1.55; }
.lg-short li i { flex: none; display: grid; place-items: center; width: 26px; height: 26px; margin-top: -1px; border-radius: 50%; background: var(--bg); color: var(--ink); }
.lg-short svg { fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
html[lang="ar"] .lg-short li { font-size: 17.5px; line-height: 1.8; }
html[lang="ar"] .lg-short h2 { font-size: 22px; line-height: 1.5; }
.lg-body { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 72px; align-items: start; padding-block: 64px 112px; }
.lg-nav { position: sticky; top: calc(var(--top-h) + 28px); display: grid; gap: 2px; max-height: calc(100vh - var(--top-h) - 56px); overflow-y: auto; scrollbar-width: none; }
.lg-nav::-webkit-scrollbar { display: none; }
.sp-page p.lg-h { margin: 0 0 8px; padding-inline-start: 10px; color: var(--muted) !important; font-size: 12.5px !important; font-weight: 600; }
.lg-nav a, .lg-mtoc a { display: block; padding: 6px 10px; border-radius: 8px; color: var(--copy); font-size: 14px; line-height: 1.4; text-decoration: none; background-image: none; }
.lg-nav a:hover, .lg-mtoc a:hover { background: color-mix(in srgb, var(--ink) 6%, var(--bg)); color: var(--ink); }
.lg-mtoc { display: none; }
/* Teks: lebar baca ~70 aksara; tajuk seksyen dan perenggan ikut gaya halaman Core. */
.lg-doc { max-width: 70ch; }
.lg-doc h2 { margin: 48px 0 12px; color: var(--ink); font: 600 22px/1.3 var(--font-display); letter-spacing: -.01em; scroll-margin-top: calc(var(--top-h) + 24px); }
.lg-doc h2:first-child { margin-top: 0; }
.sp-page .lg-doc p, .lg-doc li { color: var(--copy); font-size: 16px !important; line-height: 1.75 !important; }
.sp-page .lg-doc p { margin: 0 0 14px; }
.lg-doc ul, .lg-doc ol { margin: 0 0 14px; padding-inline-start: 22px; }
.lg-doc li { margin: 0 0 6px; }
.lg-doc b, .lg-doc strong { color: var(--ink); font-weight: 600; }
html[lang="ar"] .lg-doc h2 { font-size: 24px; letter-spacing: 0; line-height: 1.5; }
html[lang="ar"] .sp-page .lg-doc p, html[lang="ar"] .lg-doc li { font-size: 17.5px !important; line-height: 1.9 !important; }
html[lang="ar"] .lg-nav a, html[lang="ar"] .lg-mtoc a { font-size: 15.5px; }
@media (max-width: 900px) {
  .lg-body { grid-template-columns: minmax(0, 1fr); gap: 24px; padding-top: 36px; }
  .lg-short { padding-top: 36px; }
  .lg-short > div { padding: 24px 22px; }
  .lg-short ul { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .lg-nav { display: none; }
  /* Telefon: indeks jadi senarai boleh dibuka (tempat sempit). */
  .lg-mtoc { display: block; border: 1px solid var(--line); border-radius: 12px; }
  .lg-mtoc summary { padding: 12px 14px; color: var(--ink); font: 500 15px var(--font); cursor: pointer; list-style: none; }
  .lg-mtoc summary::-webkit-details-marker { display: none; }
  .lg-mtoc summary::after { content: "+"; float: inline-end; color: var(--muted); }
  .lg-mtoc[open] summary::after { content: "–"; }
  .lg-mtoc nav { padding: 0 6px 8px; }
}
.lg-short + .lg-body { padding-top: 56px; }
@media (max-width: 900px) { .lg-short + .lg-body { padding-top: 28px; } }