/* Shared styling for the privacy and terms pages. Deliberately plain: these
   documents are read by carrier vetting teams and App Review, not skimmed. */
:root { color-scheme: light dark; }
* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: Geist, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 16px;
  line-height: 1.65;
  color: #18181b;
  background: #fff;
}
.wrap { max-width: 46rem; margin: 0 auto; padding: 3rem 1.5rem 6rem; }
header.masthead {
  display: flex; align-items: center; gap: .55rem;
  font-weight: 600; letter-spacing: -.01em;
  text-decoration: none; color: inherit;
  margin-bottom: 3rem;
}
/* The masthead is an <a>, not a <header>, so the old `header.masthead svg`
   never matched and the icon rendered at its natural size. */
.masthead svg { width: 26px; height: 26px; color: #6366f1; }
header.masthead .by { font-weight: 400; color: #71717a; }
h1 { font-size: 1.9rem; letter-spacing: -.02em; margin: 0 0 .35rem; }
.updated { color: #71717a; margin: 0 0 2.5rem; font-size: .9rem; }
h2 { font-size: 1.1rem; letter-spacing: -.01em; margin: 2.4rem 0 .6rem; }
p, li { color: #3f3f46; }
ul { padding-left: 1.15rem; }
li { margin: .3rem 0; }
a { color: #6366f1; }
code {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: .9em; background: #f4f4f5; padding: .1em .35em; border-radius: 4px;
}
.callout {
  border: 1px solid #e4e4e7; border-radius: 12px;
  padding: 1rem 1.25rem; margin: 1.5rem 0; background: #fafafa;
}
.callout p:last-child { margin-bottom: 0; }
.callout p:first-child { margin-top: 0; }
footer { margin-top: 4rem; padding-top: 1.5rem; border-top: 1px solid #e4e4e7; font-size: .9rem; color: #71717a; }
footer a { margin-right: 1rem; }

@media (prefers-color-scheme: dark) {
  body { color: #fafafa; background: #09090b; }
  p, li { color: #a1a1aa; }
  .updated, header.masthead .by, footer { color: #71717a; }
  code { background: #18181b; }
  .callout { border-color: #27272a; background: #101012; }
  footer { border-top-color: #27272a; }
}

/* ── /page/sms ─────────────────────────────────────────────────────────
   Moved out of an inline <style> on that page so style-src need not allow
   'unsafe-inline'. Only sms.html uses these selectors. */
  /* The consent block is a facsimile of the live control in the dashboard, so
     this page shows the same wording a user sees before any message is sent. */
  .optin { border: 1px solid #e4e4e7; border-radius: 12px; padding: 1.25rem 1.35rem; margin: 1.5rem 0; }
  .optin .field { display: block; font-size: .9rem; color: #71717a; margin-bottom: .35rem; }
  .optin input[type=tel] {
    width: 100%; font: inherit; font-size: .95rem; padding: .55rem .7rem;
    border: 1px solid #d4d4d8; border-radius: 8px; background: #fff; color: #18181b;
  }
  .optin .row { display: flex; gap: .6rem; align-items: flex-start; margin-top: 1rem; }
  .optin .row input { margin-top: .25rem; accent-color: #6366f1; height: 1rem; width: 1rem; flex: none; }
  .optin .row label { font-size: .9rem; color: #3f3f46; line-height: 1.55; }
  .optin button {
    margin-top: 1rem; font: inherit; font-weight: 500; font-size: .93rem;
    padding: .55rem 1.1rem; border-radius: 8px; border: 0;
    background: #6366f1; color: #fff;
  }
  .optin .note { font-size: .82rem; color: #a1a1aa; margin: .85rem 0 0; }
  .sample { border-left: 2px solid #6366f1; padding: .1rem 0 .1rem 1rem; margin: 1.1rem 0; }
  .sample p { margin: .2rem 0; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .88rem; }
  .sample .kind { font-family: inherit; font-size: .82rem; color: #71717a; }
  @media (prefers-color-scheme: dark) {
    .optin { border-color: #27272a; }
    .optin input[type=tel] { background: #101012; border-color: #27272a; color: #fafafa; }
    .optin .row label { color: #a1a1aa; }
  }