/* Legal documents. Uses the site tokens from pages.css, including dark theme. */

.legal-wrap{
  width:min(1040px,100%);
  margin:0 auto;
  padding:36px 0 12px;
}
.legal-head{margin-bottom:28px}
.legal-kicker{
  margin:0 0 10px;
  font:600 11px/1 var(--sans);
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--muted);
}
.legal-head h1{
  margin:0;
  max-width:16ch;
  font:400 clamp(44px,7vw,76px)/.94 var(--serif);
  letter-spacing:-.035em;
}
.legal-lead{
  margin:16px 0 0;
  max-width:62ch;
  font-size:18px;
  line-height:1.5;
}
.legal-meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px 18px;
  margin:14px 0 0;
  color:var(--muted);
  font-size:13px;
}
.legal-draft{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:12px 14px;
  align-items:start;
  margin:0 0 28px;
  padding:14px 16px;
  border:1px solid var(--line);
  border-radius:18px;
  background:var(--soft);
}
.legal-draft strong{display:block;margin-bottom:4px}
.legal-draft p{margin:0;color:var(--muted);font-size:14.5px;line-height:1.5}
.legal-draft__mark{
  display:grid;
  place-items:center;
  width:36px;
  height:36px;
  border-radius:50%;
  background:var(--ink);
  color:var(--paper);
  font:600 12px/1 var(--sans);
}
.legal-layout{
  display:grid;
  grid-template-columns:minmax(180px,220px) minmax(0,72ch);
  gap:40px;
  align-items:start;
}
.legal-toc{
  position:sticky;
  top:108px;
  display:flex;
  flex-direction:column;
  gap:8px;
  margin:0;
  padding:0;
  list-style:none;
}
.legal-toc a{
  display:block;
  padding:4px 0;
  color:var(--muted);
  font-size:13.5px;
  line-height:1.35;
  text-decoration:none;
}
.legal-toc a:hover,
.legal-toc a[aria-current=true]{color:var(--ink)}
.legal-doc section{scroll-margin-top:120px}
.legal-doc h2{max-width:22ch}
.legal-facts,
.pending-list{
  margin:0 0 8px;
  padding:0;
  list-style:none;
}
.legal-facts div,
.pending-list li{
  display:grid;
  grid-template-columns:minmax(140px,.8fr) 1.4fr;
  gap:10px 16px;
  padding:10px 0;
  border-bottom:1px solid var(--line);
  font-size:15px;
}
.legal-facts dt{color:var(--muted)}
.legal-facts dd{margin:0}
.pending,
mark.pending{
  display:inline;
  padding:0 .35em;
  border-radius:6px;
  background:#E7D7B8;
  color:#2E3D30;
  font-weight:600;
  font-size:.92em;
}
html[data-theme=dark] mark.pending,
html[data-theme=dark] .pending{
  background:#6D5A3E;
  color:#FAF5F2;
}
.legal-table-wrap{overflow-x:auto;margin:8px 0 14px}
.legal-doc table{
  width:100%;
  border-collapse:collapse;
  font-size:14px;
}
.legal-doc th,
.legal-doc td{
  text-align:left;
  vertical-align:top;
  padding:10px 12px;
  border-bottom:1px solid var(--line);
}
.legal-doc th{
  font-size:11px;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--muted);
}
.legal-doc a{text-decoration:underline;text-underline-offset:3px}
.legal-more{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
  margin-top:36px;
}
.legal-more a{
  display:flex;
  flex-direction:column;
  gap:6px;
  min-height:112px;
  padding:16px;
  border:1px solid var(--line);
  border-radius:18px;
  background:var(--surface,#F4F7F2);
  text-decoration:none;
}
.legal-more small{
  color:var(--muted);
  font-size:11px;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.legal-more strong{
  font:400 22px/1.15 var(--serif);
  letter-spacing:-.02em;
}
.legal-call{
  margin-top:8px;
  padding:14px 16px;
  border-radius:16px;
  background:var(--soft);
}

@media(max-width:860px){
  .legal-layout{grid-template-columns:1fr;gap:18px}
  .legal-toc{
    position:static;
    flex-direction:row;
    flex-wrap:wrap;
    gap:8px;
  }
  .legal-toc a{
    padding:8px 12px;
    border:1px solid var(--line);
    border-radius:999px;
    background:var(--paper);
  }
  .legal-facts div,
  .pending-list li{grid-template-columns:1fr;gap:2px}
  .legal-more{grid-template-columns:1fr}
  .legal-draft{grid-template-columns:1fr}
}
@media(max-width:700px){
  .legal-wrap{padding-top:22px}
  .legal-head h1{font-size:clamp(40px,12vw,56px)}
  .legal-lead{font-size:16px}
}
@media print{
  .header,.legal-toc,.legal-more,footer,.menu-toggle{display:none!important}
  .legal-layout{display:block}
  body.page{background:#fff;color:#000}
}
