/* legal.css — privacy, terms, refund policy. Long-form reading on the app shell.
   Deliberately plain: these pages are read when someone is deciding whether to trust
   you with money, so legibility beats decoration. */

.legal-wrap { max-width: 760px; margin: 0 auto; padding: 8px 0 60px; }

.legal-head { margin: 0 0 6px; }
.legal-head h1 { margin: 0 0 6px; font-size: 30px; color: #14304f; }
.legal-updated { margin: 0 0 6px; color: #6b7885; font-size: 14px; }

/* Plain-English summary above the formal text. Nobody reads a terms page; a lot of
   people read four bullets, and the ones that matter here (no refunds, billing stops
   itself) are exactly what a buyer needs to know before paying. */
.legal-tldr {
  margin: 18px 0 26px;
  padding: 15px 18px;
  border: 1px solid #cfe0f0;
  border-left: 4px solid #14304f;
  border-radius: 8px;
  background: #f4f8fc;
}
.legal-tldr h2 { margin: 0 0 8px; font-size: 15px; letter-spacing: .04em; text-transform: uppercase; color: #14304f; }
.legal-tldr ul { margin: 0; padding-left: 20px; line-height: 1.7; color: #3d4753; }

.legal-body { color: #2b3440; font-size: 15.5px; line-height: 1.75; }
.legal-body h2 {
  margin: 32px 0 10px;
  padding-top: 18px;
  border-top: 1px solid #eceff2;
  font-size: 20px;
  color: #14304f;
}
.legal-body h3 { margin: 22px 0 6px; font-size: 16px; color: #14304f; }
.legal-body p { margin: 0 0 12px; }
.legal-body ul, .legal-body ol { margin: 0 0 12px; padding-left: 22px; }
.legal-body li { margin: 5px 0; }
.legal-body a { color: #0b57a4; }
.legal-body strong { color: #14304f; }

.legal-body table { width: 100%; border-collapse: collapse; margin: 0 0 14px; font-size: 14.5px; }
.legal-body th, .legal-body td { padding: 8px 10px; border: 1px solid #e3e6ea; text-align: left; vertical-align: top; }
.legal-body th { background: #f6f8fa; color: #14304f; }

/* Anything the operator must fill in before launch renders visibly unfinished, so a
   placeholder can never quietly ship as if it were a real address. */
.legal-todo {
  background: #fdf1c7;
  border-bottom: 2px dotted #b7912a;
  padding: 0 3px;
  font-weight: 700;
  color: #6b5410;
}

.legal-nav { margin: 26px 0 0; padding-top: 16px; border-top: 1px solid #eceff2; font-size: 14px; color: #6b7885; }
.legal-nav a { color: #0b57a4; margin-right: 14px; }

@media (max-width: 560px) {
  .legal-head h1 { font-size: 24px; }
  .legal-body { font-size: 15px; }
}