/* Meridian BFD — shared styles for the legal documents (/terms, /privacy).
   A branded navy header/footer (matching the landing page) wraps a light,
   readable document body. All body wording lives in the HTML; this file only
   styles it. Palette variables mirror public/styles.css. */

:root {
  --ink:#1c1e21;
  --muted:#5f6368;
  --line:#e4e6ea;
  --accent:#2b5cd9;          /* brand blue, deepened for AA contrast on white */
  --bg-soft:#f7f8fa;

  /* Brand palette (shared with the landing page) */
  --brand-bg:#0b1220;
  --brand-bg-soft:#111a2e;
  --brand-ink:#e8eefc;
  --brand-muted:#93a4c4;
  --brand-blue:#5b8cff;
  --brand-teal:#7af5d0;
  --brand-hairline:rgba(255, 255, 255, 0.08);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin:0;
  font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  color:var(--ink);
  background:#fff;
  -webkit-font-smoothing:antialiased;
}

/* Signature gradient hairline at the very top */
.top-accent { height:3px; background:linear-gradient(100deg, var(--brand-blue), var(--brand-teal)); }

/* Branded top bar */
.site-bar { background:var(--brand-bg); border-bottom:1px solid var(--brand-hairline); }
.site-bar-inner { max-width:780px; margin:0 auto; padding:16px 24px; }
.brand-link { display:inline-flex; align-items:center; gap:12px; text-decoration:none; }
.brand-link .mark {
  display:inline-flex; align-items:center; justify-content:center;
  width:38px; height:38px; border-radius:10px;
  background:linear-gradient(160deg, var(--brand-bg-soft), #0c1426);
  border:1px solid var(--brand-hairline);
  color:var(--brand-blue);
}
.brand-link .wordmark { font-size:1rem; font-weight:600; letter-spacing:.01em; color:var(--brand-ink); }
.brand-link .wordmark .suffix { color:var(--brand-muted); font-weight:500; }

/* Document body */
.page { max-width:780px; margin:0 auto; padding:48px 24px 72px; }
header.doc { border-bottom:1px solid var(--line); padding-bottom:24px; margin-bottom:28px; }
.company { font-size:13px; letter-spacing:.12em; text-transform:uppercase; color:var(--accent); font-weight:600; margin:0 0 10px; }
h1 { font-size:34px; line-height:1.15; margin:0 0 10px; letter-spacing:-.01em; }
.meta { color:var(--muted); font-size:14px; margin:0; }

nav.toc { background:var(--bg-soft); border:1px solid var(--line); border-radius:10px;
          padding:18px 22px; margin:0 0 36px; font-size:14px; }
nav.toc .toc-title { font-weight:600; font-size:13px; letter-spacing:.08em; text-transform:uppercase;
                     color:var(--muted); margin:0 0 8px; }
nav.toc ol { margin:0; padding-left:20px; columns:2; column-gap:32px; }
nav.toc li { margin:3px 0; break-inside:avoid; }
nav.toc a { color:var(--ink); text-decoration:none; }
nav.toc a:hover { color:var(--accent); text-decoration:underline; }

h2 { font-size:21px; margin:42px 0 14px; padding-top:8px; letter-spacing:-.01em; }
p, li { font-size:15.5px; line-height:1.65; }
p { margin:0 0 14px; }
ul { margin:0 0 14px; padding-left:26px; }
li { margin:0 0 8px; }
a { color:var(--accent); }

.legal-notice { background:var(--bg-soft); border-left:3px solid var(--brand-blue);
                padding:12px 16px; border-radius:0 8px 8px 0; }

table { border-collapse:collapse; width:100%; margin:18px 0 22px; font-size:14px; }
td { border:1px solid var(--line); padding:9px 12px; vertical-align:top; line-height:1.5; }
tr:first-child td { background:var(--bg-soft); font-weight:600; }

/* Branded footer */
.site-foot { background:var(--brand-bg); border-top:1px solid var(--brand-hairline);
             padding:28px 24px; font-size:13.5px; color:var(--brand-muted); }
.site-foot .foot-inner { max-width:780px; margin:0 auto; }
.site-foot p { margin:0 0 6px; line-height:1.6; }
.site-foot a { color:var(--brand-ink); text-decoration:none; }
.site-foot a:hover { color:var(--brand-teal); }

@media (max-width:640px) {
  nav.toc ol { columns:1; }
  h1 { font-size:28px; }
  .page { padding-top:36px; }
}
@media print {
  .top-accent, .site-bar, .site-foot, nav.toc { display:none; }
  .page { padding:0; max-width:none; }
  a { color:var(--ink); }
}
