/* Shared shell for /privacy, /support, and /terms. Same dark holo dress as
 * the sales page, narrowed to a reading column. Kept as one stylesheet on
 * the apex rather than three inline <style> blocks so the three pages can
 * never drift apart; app.ts serves it alongside the other landing assets. */

* { margin: 0; box-sizing: border-box; }
body {
  background: #14111A; color: #FCFCFD; min-height: 100vh;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", ui-sans-serif, system-ui, sans-serif;
  font-size: 17px; line-height: 1.65;
}
a { color: inherit; }
.holo {
  height: 4px;
  background: linear-gradient(100deg,#45B8FF,#2E5BFF 28%,#8601AF 52%,#FF00A8 76%,#FFC42E);
}

.shell { width: 100%; max-width: 760px; margin: 0 auto; padding: 0 28px 96px; }

header.head { padding: 56px 0 44px; border-bottom: 1px solid rgba(252,252,253,.09); }
.home {
  display: inline-flex; align-items: baseline; gap: 9px;
  font-weight: 700; font-size: 19px; letter-spacing: .01em; text-decoration: none;
}
.home span { font-size: 13px; font-weight: 500; opacity: .55; letter-spacing: 0; }
.tm { font-size: .62em; vertical-align: super; opacity: .75; }
.eyebrow {
  margin-top: 46px; font-size: 13px; font-weight: 600;
  letter-spacing: .13em; text-transform: uppercase; opacity: .5;
}
h1 {
  margin-top: 10px;
  font-size: clamp(40px, 6vw, 64px); font-weight: 700;
  letter-spacing: -0.03em; line-height: 1.05; text-wrap: balance;
}
.intro { margin-top: 18px; font-size: 20px; line-height: 1.55; opacity: .72; max-width: 34em; }
.date { margin-top: 20px; font-size: 15px; opacity: .45; }

article { padding-top: 8px; }
article section { padding-top: 40px; }
h2 {
  font-size: 24px; font-weight: 700; letter-spacing: -0.015em; line-height: 1.25;
}
h3 {
  margin-top: 26px; font-size: 17px; font-weight: 600; letter-spacing: -0.005em;
}
article p { margin-top: 14px; opacity: .74; }
article ul { margin-top: 14px; padding-left: 22px; opacity: .74; }
article li { margin-top: 8px; }
article a { text-decoration: underline; text-underline-offset: 3px; opacity: 1; }
article a:hover { opacity: .75; }
address { margin-top: 18px; font-style: normal; opacity: .6; font-size: 15px; line-height: 1.7; }

.callout {
  margin-top: 20px; padding: 20px 22px;
  border: 1px solid rgba(252,252,253,.14); border-radius: 14px;
  background: rgba(252,252,253,.03);
}
.callout p:first-child { margin-top: 0; }

footer.legal {
  margin-top: 72px; padding-top: 28px;
  border-top: 1px solid rgba(252,252,253,.09);
  display: flex; flex-wrap: wrap; gap: 12px 26px;
  align-items: center; justify-content: space-between;
  font-size: 15px; opacity: .55;
}
footer.legal nav { display: flex; flex-wrap: wrap; gap: 22px; }
footer.legal a { text-decoration: none; }
footer.legal a:hover { text-decoration: underline; text-underline-offset: 3px; }

@media (max-width: 640px) {
  body { font-size: 16px; }
  .shell { padding: 0 20px 72px; }
  header.head { padding: 36px 0 32px; }
  .eyebrow { margin-top: 34px; }
  .intro { font-size: 18px; }
}