/* ============================================================
   BUKA · legal.css — light editorial theme (legal pages only)
   Soft White #FAFAFA carries these two pages; amber appears in
   small doses (links, TOC markers, the triangle).
   ============================================================ */

html.theme-light body {
  --bg: var(--white);
  --bg-card: #FFFFFF;
  --bg-raised: #F2F2F2;
  --line: #E6E6E6;
  --line-strong: #D4D4D4;
  --text-hi: var(--ink);
  --text: #1E1E1E;
  --text-mut: #5A5A5A;
  --text-dim: #8A8A8A;
}
html.theme-light .site-head {
  background: color-mix(in srgb, #FAFAFA 88%, transparent);
  border-bottom-color: #E6E6E6;
}
@supports (backdrop-filter: blur(10px)) {
  html.theme-light .site-head { background: rgba(250, 250, 250, 0.75); backdrop-filter: blur(10px); }
}
html.theme-light .eyebrow { color: var(--amber-press); }
html.theme-light a:not(.btn):not(.brand-mark) { color: inherit; }
html.theme-light ::selection { background: var(--amber); color: var(--ink); }

/* ---- Layout ---- */
.legal-hero { padding: clamp(96px, 14vh, 150px) 0 clamp(28px, 4vw, 48px); border-bottom: 1px solid var(--line); }
.legal-hero h1 { font-size: clamp(2.4rem, 6vw, 4.5rem); }
.legal-hero .lede { margin-top: 18px; max-width: 56ch; font-size: var(--step-body-lg); color: var(--text-mut); }
.legal-hero .meta-line { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 26px; }

.legal-body {
  display: grid;
  grid-template-columns: minmax(200px, 260px) minmax(0, 1fr);
  gap: clamp(32px, 5vw, 88px);
  padding-block: clamp(40px, 6vw, 80px);
}
@media (max-width: 880px) { .legal-body { grid-template-columns: 1fr; } }

/* ---- TOC ---- */
.toc { position: sticky; top: 84px; align-self: start; }
@media (max-width: 880px) { .toc { position: static; } }
.toc h2 {
  font: 500 var(--step-mono-sm)/1 var(--mono);
  letter-spacing: var(--track-mono);
  text-transform: uppercase;
  color: var(--text-dim);
  margin: 0 0 14px;
}
.toc ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.toc a {
  display: flex; align-items: baseline; gap: 10px;
  padding: 7px 0;
  font-size: 0.875rem;
  color: var(--text-mut);
}
.toc a:hover { color: var(--ink); }
.toc a i {
  font: 500 var(--step-mono-sm)/1.6 var(--mono);
  font-style: normal;
  color: var(--amber-press);
  min-width: 22px;
}

/* ---- Articles ---- */
.legal-art { max-width: 68ch; }
.legal-art section { padding-block: clamp(20px, 3vw, 36px); border-top: 1px solid var(--line); scroll-margin-top: 84px; }
.legal-art section:first-child { border-top: none; padding-top: 0; }
.legal-art h2 {
  display: flex; align-items: baseline; gap: 14px;
  font-size: var(--step-h3);
  letter-spacing: -0.01em;
}
.legal-art h2 i {
  font: 500 var(--step-mono)/1.6 var(--mono);
  font-style: normal;
  color: var(--amber-press);
}
.legal-art p, .legal-art li { color: var(--text-mut); font-size: 1rem; }
.legal-art p { margin-top: 14px; }
.legal-art ul { margin: 14px 0 0; padding-left: 0; list-style: none; display: grid; gap: 8px; }
.legal-art ul li { display: flex; gap: 10px; align-items: baseline; }
.legal-art ul li::before {
  content: "";
  width: 0; height: 0; flex: none;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  border-left: 6px solid var(--amber);
  position: relative; top: -1px;
}
.legal-art a { color: var(--amber-press); font-weight: 700; }
.legal-art a:hover { color: var(--ink); }
.legal-art .plain {
  margin-top: 14px;
  padding: 14px 18px;
  background: var(--amber-08);
  border-radius: var(--r-md);
  font-size: 0.9375rem;
  color: var(--ink);
}
.legal-art .plain b { font-weight: 700; }

html.theme-light .site-foot { border-top-color: var(--line); }