/* ============================================================
   PeakPro — legal.css (Privacy, Terms, Contact)
   Long-form reading layout. Builds on styles.css tokens.
   ============================================================ */

.legal-hero {
  background: linear-gradient(145deg, #1C1917 0%, #1C1917 18%, #374151 45%, #0EA5E9 90%);
  padding: 130px 0 56px;
  text-align: center;
}
.legal-hero .eyebrow { color: var(--copper); }
.legal-hero h1 { font-size: clamp(2rem, 4vw, 2.9rem); font-weight: 700; color: #fff; letter-spacing: -0.02em; margin-bottom: 10px; }
.legal-hero .effective { color: rgba(255,255,255,.6); font-size: 0.9375rem; }

.legal { padding: 64px 0 88px; }
.legal .container { max-width: 800px; }

.legal h2 {
  font-size: 1.35rem;
  font-weight: 700;
  color: var(--ink);
  letter-spacing: -0.01em;
  margin: 44px 0 12px;
  padding-top: 24px;
  border-top: 1px solid var(--border);
}
.legal h2:first-of-type { border-top: none; padding-top: 0; margin-top: 0; }
.legal h3 { font-size: 1.05rem; font-weight: 700; color: var(--ink); margin: 22px 0 8px; }
.legal p { color: var(--body); margin-bottom: 14px; }
.legal ul { margin: 0 0 16px; padding-left: 0; }
.legal li {
  position: relative; padding-left: 22px; margin-bottom: 8px; color: var(--body);
}
.legal li::before {
  content: ''; position: absolute; left: 4px; top: 11px;
  width: 6px; height: 6px; border-radius: 50%; background: var(--copper);
}
.legal a { color: var(--copper-d); font-weight: 600; }
.legal a:hover { text-decoration: underline; }
.legal strong { color: var(--ink); }

/* Google Limited Use callout */
.legal-callout {
  background: var(--surface);
  border: 1px solid var(--border-d);
  border-left: 4px solid var(--copper);
  border-radius: var(--radius-md);
  padding: 22px 24px;
  margin: 16px 0 20px;
}
.legal-callout p:last-child { margin-bottom: 0; }
.legal-callout ul { margin-bottom: 0; }

.legal-toc {
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 22px 26px;
  margin-bottom: 40px;
}
.legal-toc h2 { border: none; padding: 0; margin: 0 0 12px; font-size: 0.8125rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--muted); }
.legal-toc ol { columns: 2; column-gap: 32px; padding-left: 18px; }
.legal-toc li { padding-left: 0; margin-bottom: 6px; list-style: decimal; color: var(--copper-d); }
.legal-toc li::before { display: none; }
.legal-toc a { color: var(--body); font-weight: 500; }

/* Contact page */
.contact-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 36px;
  text-align: center;
  max-width: 520px;
  margin: 0 auto;
  box-shadow: var(--shadow-sm);
}
.contact-card h2 { font-size: 1.25rem; color: var(--ink); margin-bottom: 6px; }
.contact-card p { color: var(--muted); margin-bottom: 18px; }
.contact-email { font-size: 1.25rem; font-weight: 700; color: var(--copper-d); }
.contact-meta { margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--border); color: var(--muted); font-size: 0.9375rem; }

@media (max-width: 600px) {
  .legal-toc ol { columns: 1; }
}