/* Legal pages (Terms, Privacy, Refund) — reuses the site chrome + tokens. */
@import url('site.css');

body { padding-top: 96px; background: var(--paper); }

.legal { max-width: 860px; margin: 0 auto; padding: 28px 24px 90px; }

.legal-head { border-bottom: 2px solid var(--line); padding-bottom: 22px; margin-bottom: 30px; }
.legal-kicker { font-family: 'Caveat', cursive; color: var(--coral); font-size: 1.6rem; font-weight: 700; margin: 0; }
.legal-title { font-size: clamp(30px, 5vw, 44px); color: var(--ink); margin: 2px 0 14px; line-height: 1.08; letter-spacing: -0.02em; }
.legal-meta { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; color: var(--ink-soft); font-size: 14px; }
.legal-pdf {
  display: inline-flex; align-items: center; gap: 7px; color: var(--coral); font-weight: 700;
  border: 1.5px solid var(--coral); padding: 7px 16px; border-radius: var(--r-pill);
  transition: background .18s, color .18s, transform .12s;
}
.legal-pdf:hover { background: var(--coral); color: #fff; transform: translateY(-1px); }

.legal-body { color: var(--body); font-size: 16px; line-height: 1.78; }
.legal-body > *:first-child { margin-top: 0; }
.legal-body h2 {
  font-size: clamp(22px, 3.4vw, 27px); color: var(--ink); margin: 42px 0 14px;
  padding-top: 14px; border-top: 1px solid var(--line); letter-spacing: -0.01em;
}
.legal-body h3 { font-size: 18px; color: var(--coral-dark); margin: 26px 0 8px; }
.legal-body h4 { font-size: 15px; color: var(--ink); margin: 20px 0 6px; }
.legal-body p { margin: 0 0 16px; }
.legal-body ul, .legal-body ol { margin: 0 0 18px; padding-left: 26px; }
.legal-body li { margin: 7px 0; }
.legal-body ul { list-style: none; padding-left: 20px; }
.legal-body ul > li { position: relative; padding-left: 20px; }
.legal-body ul > li::before {
  content: ''; position: absolute; left: 0; top: 11px;
  width: 7px; height: 7px; border-radius: 50%; background: var(--coral);
}
.legal-body ol { list-style: decimal; }
.legal-body ol > li { padding-left: 4px; }
.legal-body a { color: var(--coral); text-decoration: underline; }
.legal-body a:hover { color: var(--coral-dark); }
.legal-body strong { color: var(--ink); font-weight: 700; }
.legal-body hr { border: 0; border-top: 1px solid var(--line); margin: 40px 0; }

.legal-body table { border-collapse: collapse; width: 100%; margin: 20px 0; font-size: 15px; }
.legal-body th, .legal-body td { border: 1px solid var(--line); padding: 11px 13px; text-align: left; vertical-align: top; }
.legal-body th { background: rgba(255,107,31,0.08); color: var(--ink); font-weight: 700; }

.legal-note {
  background: rgba(255,107,31,0.06); border-left: 3px solid var(--coral);
  padding: 14px 18px; border-radius: 8px; margin: 20px 0;
}

@media (max-width: 640px) { .legal { padding: 18px 16px 64px; } }