/* PICKED — legal document page (Terms of Use).
   Reuses ../css/styles.css tokens/utilities and ../css/picked.css brand
   tokens, then dials the page back toward plain, readable legal-doc
   conventions: narrower measure, quieter type, numbered sections. */

.legal-header{
  position:relative;
  padding:22px var(--gutter);
  display:flex; align-items:center; justify-content:space-between; gap:20px;
  border-bottom:1px solid var(--line);
}
.legal-brand{ display:flex; align-items:center; }
.legal-brand img{ height:24px; width:auto; display:block; border-radius:4px; }
.legal-back{
  font-size:13.5px; color:var(--paper-dim);
  display:inline-flex; align-items:center; gap:6px;
  transition:color var(--dur-fast) var(--ease);
}
.legal-back:hover{ color:var(--current); }

.legal-main{ padding:clamp(48px,8vw,96px) 0 clamp(64px,10vw,120px); }
.legal-doc{
  max-width:720px; margin:0 auto;
  padding-left:var(--gutter); padding-right:var(--gutter);
}

.legal-doc .kicker{ display:block; margin-bottom:14px; }
.legal-doc h1{
  font-family:var(--font-display); text-transform:uppercase;
  font-size:clamp(1.8rem, 4.5vw, 2.6rem); line-height:1.06;
}
.legal-updated{ margin-top:14px; font-size:13px; color:var(--stone); }

.legal-intro{
  margin-top:28px; padding-top:28px; border-top:1px solid var(--line);
  font-size:15.5px; line-height:1.7; color:var(--paper-dim);
  max-width:66ch;
}
.legal-intro strong{ color:var(--paper); font-weight:600; }

.legal-toc{
  margin-top:36px; padding:20px 22px;
  border:1px solid var(--line-strong); border-radius:var(--radius-md);
  background:var(--panel);
}
.legal-toc h2{
  font-size:11px; letter-spacing:0.1em; text-transform:uppercase;
  color:var(--stone); font-family:var(--font-body); font-weight:700;
  margin-bottom:14px;
}
.legal-toc ol{
  list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns:1fr 1fr; gap:8px 24px;
  counter-reset:toc;
}
.legal-toc li{ counter-increment:toc; }
.legal-toc a{
  font-size:13.5px; color:var(--paper-dim);
  display:flex; gap:8px;
  transition:color var(--dur-fast) var(--ease);
}
.legal-toc a::before{
  content:counter(toc) "."; color:var(--stone); flex-shrink:0;
}
.legal-toc a:hover{ color:var(--current); }

.legal-body{ margin-top:44px; }
.legal-section{
  padding:26px 0; border-top:1px solid var(--line);
  scroll-margin-top:24px;
}
.legal-section:last-child{ padding-bottom:0; }
.legal-section h2{
  font-size:1.05rem; font-weight:700; color:var(--paper);
  margin-bottom:12px; text-transform:none; letter-spacing:-0.005em;
}
.legal-section p{
  font-size:15px; line-height:1.75; color:var(--paper-dim);
  max-width:66ch;
}
.legal-section p + p{ margin-top:14px; }
.legal-section ul{
  margin:14px 0 0; padding-left:20px; max-width:64ch;
}
.legal-section li{
  font-size:15px; line-height:1.7; color:var(--paper-dim);
  margin-bottom:6px;
}
.legal-section a{
  color:var(--paper); border-bottom:1px solid var(--line-strong);
  transition:color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease);
}
.legal-section a:hover{ color:var(--current); border-color:var(--current); }

.legal-back-top{
  margin-top:48px; display:inline-flex; align-items:center; gap:8px;
  font-size:13.5px; color:var(--paper-dim);
  transition:color var(--dur-fast) var(--ease);
}
.legal-back-top:hover{ color:var(--current); }

.legal-footer{
  border-top:1px solid var(--line);
  padding:28px var(--gutter);
  display:flex; justify-content:space-between; align-items:center;
  flex-wrap:wrap; gap:12px;
  color:var(--stone); font-size:12.5px;
}
.legal-footer a{ color:var(--stone); transition:color var(--dur-fast) var(--ease); }
.legal-footer a:hover{ color:var(--current); }

@media (max-width:640px){
  .legal-toc ol{ grid-template-columns:1fr; }
}