/* Shared shell for the Inferel legal / policy pages (matches ../index.html branding). */
:root {
  --bg: #16161C;
  --bg-elevated: #1E1E26;
  --violet: #C4B5FD;
  --violet-soft: #DDD4FE;
  --amber: #F6C99A;
  --rose: #F6BBD2;
  --text: rgba(255, 255, 255, 0.94);
  --text-dim: rgba(255, 255, 255, 0.62);
  --text-faint: rgba(255, 255, 255, 0.40);
  --border: rgba(255, 255, 255, 0.11);
  --border-light: rgba(255, 255, 255, 0.18);
  --card: rgba(255, 255, 255, 0.055);
  --card-hover: rgba(255, 255, 255, 0.08);
  --accent-gradient: linear-gradient(135deg, #C4B5FD 0%, #F6BBD2 48%, #F6C99A 100%);
  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji", sans-serif;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--font);
  background-color: var(--bg);
  color: var(--text);
  font-size: 16px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
  background-image:
    radial-gradient(ellipse 80% 60% at 12% 14%, rgba(196, 181, 253, 0.16) 0%, transparent 60%),
    radial-gradient(ellipse 70% 55% at 88% 10%, rgba(246, 201, 154, 0.12) 0%, transparent 55%),
    linear-gradient(rgba(20, 20, 26, 0.92), rgba(20, 20, 26, 0.95)),
    url("/assets/hero-galaxy.png");
  background-size: auto, auto, cover, cover;
  background-position: 0 0, 0 0, center, center;
  background-attachment: fixed;
  background-repeat: no-repeat;
}
::selection { background-color: rgba(196, 181, 253, 0.36); }
a { color: inherit; text-decoration: none; }
.wrap { max-width: 860px; margin: 0 auto; padding: 0 28px; }
.gradient-text {
  background: var(--accent-gradient);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
}

/* ---------- Nav (same shell as the landing page) ---------- */
header {
  position: sticky; top: 0; z-index: 50;
  background-color: rgba(22, 22, 28, 0.62);
  backdrop-filter: blur(40px) saturate(180%); -webkit-backdrop-filter: blur(40px) saturate(180%);
  border-bottom: 1px solid var(--border);
}
.nav { max-width: 1180px; margin: 0 auto; padding: 0 28px; display: flex; align-items: center; justify-content: space-between; height: 70px; }
.brand { display: flex; align-items: center; gap: 10px; }
.brand .brand-mark { height: 28px; width: auto; display: block; }
.brand .brand-word { height: 19px; width: auto; display: block; }
.nav-links { display: flex; align-items: center; gap: 28px; }
.nav-links a.lnk { color: var(--text-dim); font-size: 0.92rem; font-weight: 500; transition: color 0.2s ease; }
.nav-links a.lnk:hover { color: var(--text); }
.btn {
  display: inline-flex; align-items: center; gap: 9px;
  font-family: var(--font); font-weight: 700; font-size: 0.9rem; letter-spacing: 0.01em;
  border-radius: 12px; padding: 10px 18px; cursor: pointer; border: 1px solid transparent;
  transition: transform 0.18s ease, box-shadow 0.2s ease, filter 0.2s ease;
  white-space: nowrap;
}
.btn-primary { color: #241a33; background: var(--accent-gradient); box-shadow: 0 6px 18px rgba(196, 181, 253, 0.26); }
.btn-primary:hover { filter: brightness(1.05); transform: translateY(-1px); box-shadow: 0 10px 30px rgba(196, 181, 253, 0.42); }

/* ---------- Document body ---------- */
.doc { padding: 64px 0 90px; }
.crumbs { font-size: 0.88rem; color: var(--text-faint); margin-bottom: 26px; }
.crumbs a { color: var(--text-dim); transition: color 0.2s ease; }
.crumbs a:hover { color: var(--text); }
.crumbs .sep { margin: 0 8px; color: var(--text-faint); }

.doc h1 { font-size: 2.15rem; line-height: 1.2; font-weight: 800; letter-spacing: -0.02em; margin-bottom: 12px; }
.doc-meta { color: var(--text-faint); font-size: 0.9rem; margin-bottom: 38px; padding-bottom: 26px; border-bottom: 1px solid var(--border); }
.doc h2 { font-size: 1.3rem; font-weight: 700; letter-spacing: -0.01em; margin: 40px 0 14px; }
.doc h2:first-of-type { margin-top: 0; }
.doc h3 { font-size: 1.05rem; font-weight: 700; margin: 26px 0 10px; }
.doc .allcaps { text-transform: none; }
.doc p { color: var(--text-dim); margin-bottom: 14px; }
.doc ul { margin: 4px 0 18px 0; padding-left: 24px; color: var(--text-dim); }
.doc li { margin-bottom: 9px; padding-left: 4px; }
.doc li::marker { color: var(--violet); }
.doc strong { color: var(--text); font-weight: 600; }
.doc a.inline { color: var(--violet-soft); font-weight: 600; }
.doc a.inline:hover { text-decoration: underline; }

/* Index cards */
.doc-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 34px; }
.doc-card {
  display: block; background: var(--card); border: 1px solid var(--border); border-radius: 16px;
  padding: 26px 26px 24px; transition: background-color 0.2s ease, border-color 0.2s ease, transform 0.18s ease;
}
.doc-card:hover { background: var(--card-hover); border-color: rgba(196, 181, 253, 0.5); transform: translateY(-2px); }
.doc-card h3 { font-size: 1.08rem; font-weight: 700; margin-bottom: 8px; }
.doc-card p { color: var(--text-dim); font-size: 0.92rem; margin: 0 0 14px; }
.doc-card .go { color: var(--violet-soft); font-size: 0.9rem; font-weight: 600; }

/* Prev/next cross-links at the bottom of a document */
.doc-nav { display: flex; justify-content: space-between; gap: 16px; margin-top: 52px; padding-top: 28px; border-top: 1px solid var(--border); flex-wrap: wrap; }
.doc-nav a { color: var(--violet-soft); font-weight: 600; font-size: 0.93rem; }
.doc-nav a:hover { text-decoration: underline; }

/* ---------- Footer ---------- */
footer { border-top: 1px solid var(--border); padding: 34px 0 46px; }
.foot { max-width: 1180px; margin: 0 auto; padding: 0 28px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 18px; }
.foot-links { display: flex; gap: 26px; flex-wrap: wrap; }
.foot-links a { color: var(--text-dim); font-size: 0.88rem; transition: color 0.2s ease; }
.foot-links a:hover { color: var(--text); }
.foot-copy { font-size: 0.82rem; color: var(--text-faint); }

@media (max-width: 720px) {
  .nav-links a.lnk { display: none; }
  .doc { padding: 44px 0 64px; }
  .doc h1 { font-size: 1.7rem; }
  .doc-cards { grid-template-columns: 1fr; }
}
