/* ============================================================
   Compliance / legal documents: privacy, terms, messaging.
   Maps the ORIGINAL July markup onto the "paper on steel" system.
   The body markup of those pages is NOT edited - their text is
   cited in live AWS and carrier filings - so this file only
   restyles the class names that were already there.
   Loads after fonts.css and site.css, which supply the tokens.
   ============================================================ */

body{
  margin:0;background:var(--steel-900);color:var(--ticket);
  font-family:var(--body);font-size:17px;line-height:1.62;
  -webkit-font-smoothing:antialiased;
}
.wrap{max-width:900px;margin:0 auto;padding-inline:var(--pad-page);}

/* Icon font was dropped with the CDN. Keep the <i> elements in place
   (markup is frozen) but take them out of the layout. */
.doc-hero i,.toc i,.callout i,.foot i,.nav i{display:none;}

/* ---------- nav ---------- */
.nav{position:sticky;top:0;z-index:40;background:rgba(31,37,35,.93);backdrop-filter:blur(9px);border-bottom:1px solid var(--steel-700);}
.nav-inner{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding-block:12px;}
.brand{display:flex;align-items:center;gap:10px;min-height:44px;font-family:var(--display);font-weight:800;font-size:16px;color:var(--ticket);text-decoration:none;letter-spacing:-.01em;}
/* ---------- the mark: BR standing on a check (variant C) ----------
   The letters are HTML text so they render in the real display face; the tick
   is an inline SVG data URI so it stays sharp at any size. Amber on steel,
   amber-deep on paper. */
.brand .mark{
  position:relative;width:36px;height:36px;flex:none;box-sizing:border-box;
  background:var(--steel-800);border-radius:7px;border:0;
  display:grid;place-items:center;align-content:center;
  padding-bottom:9px;
  font-family:var(--display);font-size:14px;font-weight:800;letter-spacing:-.03em;
  color:var(--ticket);line-height:1;
}
.brand .mark::after{
  content:"";position:absolute;left:6px;right:6px;bottom:7px;height:9px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 13'%3E%3Cpath d='M2 7 l5 5 l31 -10' fill='none' stroke='%23E9A13B' stroke-width='4.5' stroke-linecap='square' stroke-linejoin='miter'/%3E%3C/svg%3E") no-repeat center/contain;
}
.nav-links{margin-left:auto;display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.nav-links a{color:var(--muted);text-decoration:none;font-size:15px;padding:11px 12px;min-height:44px;display:inline-flex;align-items:center;}
.nav-links a:hover{color:var(--ticket);}
@media (max-width:560px){ .nav-links a{font-size:14px;padding:11px 9px;} }

/* ---------- hero ---------- */
.doc-hero{border-top:4px solid var(--amber);border-bottom:1px solid var(--steel-700);}
.doc-hero-inner{padding-block:clamp(34px,5vw,58px);display:flex;flex-direction:column;gap:12px;}
.doc-hero h1{font-family:var(--display);font-weight:800;font-size:clamp(30px,5vw,46px);line-height:1.06;letter-spacing:-.022em;margin:0;color:var(--ticket);text-wrap:balance;}
.eyebrow{font-family:var(--mono);font-size:11.5px;text-transform:uppercase;letter-spacing:.14em;color:var(--amber);margin:0;}
.updated{font-family:var(--mono);font-size:12px;letter-spacing:.05em;color:var(--muted);margin:0;}

/* ---------- the document itself: long-form reading goes on paper ---------- */
.doc{
  background:var(--ticket);color:var(--ink);border-radius:2px;
  padding:clamp(24px,4vw,46px);
  margin:clamp(26px,4vw,44px) 0;
}
.doc h2{font-family:var(--display);font-weight:800;font-size:clamp(20px,2.6vw,25px);letter-spacing:-.015em;line-height:1.18;color:var(--ink);margin:34px 0 12px;scroll-margin-top:90px;}
.doc h2:first-of-type{margin-top:8px;}
.doc h3{font-family:var(--display);font-weight:800;font-size:17.5px;color:var(--ink);margin:22px 0 8px;}
.doc p{margin:0 0 13px;max-width:70ch;color:var(--ink);}
.doc a{color:var(--indie-ink);text-underline-offset:3px;}
.doc a:hover{color:var(--ink);}
.doc ul,.doc ol{margin:0 0 15px;padding-left:22px;max-width:70ch;}
.doc li{margin-bottom:8px;}
.doc strong,.doc b{font-weight:700;}
.doc hr{border:0;border-top:1px solid #E4DFD4;margin:26px 0;}
.doc table{width:100%;border-collapse:collapse;margin:0 0 16px;font-size:15px;}
.doc th,.doc td{text-align:left;padding:9px 10px;border-bottom:1px solid #E4DFD4;vertical-align:top;}
.doc th{font-family:var(--mono);font-size:11.5px;text-transform:uppercase;letter-spacing:.09em;color:var(--ink-soft);}

/* ---------- table of contents ---------- */
.toc{background:#EDE9E0;border-left:3px solid var(--amber-ink);border-radius:2px;padding:18px 22px;margin:0 0 30px;}
.toc ol,.toc ul{margin:0;padding-left:20px;}
.toc li{margin-bottom:6px;font-size:15px;}
.toc a{color:var(--ink);text-decoration:none;}
.toc a:hover{text-decoration:underline;}

/* ---------- callout ---------- */
.callout{background:#EDE9E0;border-left:3px solid var(--amber-ink);border-radius:2px;padding:16px 20px;margin:0 0 18px;}
.callout p{margin:0;font-size:15.5px;}
.callout p + p{margin-top:10px;}

/* ---------- messaging.html: the consent-screen mock ---------- */
.consent-mock{background:#EDE9E0;border:1px solid #DDD7CA;border-radius:2px;padding:20px 22px;margin:0 0 18px;}
.consent-mock .prog{font-family:var(--display);font-size:17px;font-weight:800;color:var(--ink);margin-bottom:6px;}
.consent-mock .aud,.consent-mock .msg,.consent-mock .lbl{font-size:15px;color:var(--ink);}
.consent-mock .lbl{font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--ink-soft);margin-top:12px;}
.consent-mock .optin,.consent-mock .optin-text{font-size:15px;color:var(--ink);}
.elements li{margin-bottom:7px;}

/* ---------- footer ---------- */
.foot{border-top:1px solid var(--steel-700);padding-block:32px;color:var(--muted);font-size:14.5px;}
.foot-inner{display:flex;flex-wrap:wrap;gap:14px 26px;align-items:center;}
.foot-meta{margin-left:auto;text-align:right;font-size:13.5px;color:var(--muted);line-height:1.6;}
.foot-meta a{color:var(--muted);text-decoration:none;}
.foot-meta a:hover{color:var(--ticket);text-decoration:underline;}
@media (max-width:620px){ .foot-meta{margin-left:0;text-align:left;} }

:focus-visible{outline:3px solid var(--amber);outline-offset:3px;border-radius:2px;}
