/* ═══════════════════════════════════════════════════════════════════════════
   IMPOSSIBLE MEANS GO — LEGAL PAGES
   Standalone stylesheet. Deliberately NOT css/style.css: that file is the
   landing page's system (canvas hero, pricing tiers, accordions) and none of
   it applies here. The brand tokens below are copied from it so the two stay
   visually one site; if a token changes there, change it here too.

   These pages are plain HTML on purpose. A2P 10DLC reviewers fetch them with
   no JavaScript, and a page that renders client-side looks empty to them —
   which is what has been failing MMR's campaign since July 2026.
   ═════════════════════════════════════════════════════════════════════════ */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --bg-base:      #0A0A0F;
  --bg-darker:    #070709;
  --bg-card:      #141422;
  --border:       rgba(255,255,255,0.07);
  --border-gold:  rgba(196,158,69,0.3);
  --gold:         #C49E45;
  --gold-light:   #E0BA6A;
  --text:         #F0EDE6;
  --text-muted:   #9B9B9B;
  /* RAISED FROM #5A5A6A ON 2026-10-10. It measured 2.92:1 on the page
     background and 2.69:1 on a card, against a 4.5 floor, and on /sms it
     carries the "(optional)" field labels and the closing fineprint - which
     holds the "no mobile information is shared with third parties" clause a
     mobile carrier reads. #7F7F92 is the same hue at 5.03 and 4.64.
     THIS FILE NOW DRESSES ONLY sms.html: the three legal documents moved to
     css/site.css the same day, so this change cannot reach them. */
  --text-faint:   #7F7F92;
  --radius:       16px;
  --max-w:        820px;
}

html { font-size: 16px; scroll-behavior: smooth; }

body {
  background: var(--bg-base);
  color: var(--text);
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-weight: 400;
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

a { color: var(--gold-light); text-decoration: none; }
a:hover { text-decoration: underline; }

.wrap {
  width: 100%;
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 0 24px;
}

/* ─── HEADER ─────────────────────────────────────────────────────────────── */
.legal-head {
  border-bottom: 1px solid var(--border);
  background: var(--bg-darker);
  padding: 18px 0;
}

.legal-head-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}

.logo {
  display: flex;
  align-items: center;
  gap: 12px;
  color: var(--text);
}
.logo:hover { text-decoration: none; }

.logo-mark {
  font-weight: 900;
  letter-spacing: 0.1em;
  font-size: 1rem;
  color: var(--gold);
  border: 1px solid var(--border-gold);
  border-radius: 6px;
  padding: 4px 9px;
}

.logo-text {
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  line-height: 1.3;
}

.back {
  font-size: 0.85rem;
  color: var(--text-muted);
}
.back:hover { color: var(--text); text-decoration: none; }

/* ─── DOCUMENT ───────────────────────────────────────────────────────────── */
main { flex: 1; padding: 56px 0 72px; }

h1 {
  font-size: clamp(1.9rem, 5vw, 2.6rem);
  font-weight: 900;
  letter-spacing: -0.02em;
  line-height: 1.15;
  margin-bottom: 12px;
}

.effective {
  font-size: 0.85rem;
  color: var(--text-muted);
  margin-bottom: 14px;
}

.operator {
  font-size: 0.88rem;
  color: var(--text-muted);
  border-left: 2px solid var(--border-gold);
  padding: 8px 0 8px 16px;
  margin-bottom: 36px;
}

.intro { margin-bottom: 34px; color: rgba(240,237,230,0.9); }

/* Jump list — these documents are long and a reviewer is looking for one
   clause, not reading them. */
.toc {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 20px 24px;
  margin-bottom: 44px;
}
.toc h2 {
  font-size: 0.75rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 12px;
}
.toc ol { margin: 0; padding-left: 20px; }
.toc li { font-size: 0.9rem; margin-bottom: 4px; color: var(--text-muted); }
.toc a { color: var(--text-muted); }
.toc a:hover { color: var(--gold-light); }

section { margin-bottom: 34px; scroll-margin-top: 24px; }

h2 {
  font-size: 1.25rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  margin-bottom: 12px;
  color: var(--text);
}

h3 {
  font-size: 0.98rem;
  font-weight: 600;
  margin: 18px 0 8px;
  color: var(--text);
}

p { margin-bottom: 14px; color: rgba(240,237,230,0.86); }
p:last-child { margin-bottom: 0; }

ul, ol.spec { padding-left: 22px; margin-bottom: 14px; }
ul { list-style: disc; }
li { margin-bottom: 7px; color: rgba(240,237,230,0.86); }
li:last-child { margin-bottom: 0; }

strong { color: var(--text); font-weight: 600; }

/* ─── CALLOUT — the clauses a carrier reviewer is looking for ───────────── */
.callout {
  background: var(--bg-card);
  border: 1px solid var(--border-gold);
  border-radius: var(--radius);
  padding: 22px 24px;
  margin-bottom: 34px;
}
.callout h2 { color: var(--gold); margin-bottom: 10px; }

.kv { margin: 0; }
.kv dt {
  font-weight: 600;
  color: var(--text);
  margin-top: 14px;
  font-size: 0.94rem;
}
.kv dt:first-child { margin-top: 0; }
.kv dd { margin: 2px 0 0; color: rgba(240,237,230,0.86); }

/* ─── FOOTER ─────────────────────────────────────────────────────────────── */
.footer {
  background: var(--bg-darker);
  border-top: 1px solid var(--border);
  padding: 32px 0;
}
.footer-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  flex-wrap: wrap;
  font-size: 0.82rem;
  color: var(--text-faint);
}
.footer-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text);
  font-size: 0.85rem;
}
.footer-links { display: flex; gap: 14px; flex-wrap: wrap; }

@media (max-width: 600px) {
  main { padding: 40px 0 56px; }
  .toc { padding: 16px 18px; }
  .callout { padding: 18px 18px; }
}
