/* ==========================================================================
   Sanctuary v2, page-scoped styles: privacy.html and terms.html. Loads AFTER
   styles.css and only extends it. Every value traces to design/brands/sanctuary.md
   (the kit) or to a locked value already in styles.css. Inner pages are CALM:
   static world-light, no world flips, no pinned stacks (kit: signature is home
   only). Built pass-3 (oracle-web-eng) for the two legal pages; page-hero
   pattern matches about.css and contact.css exactly so the two new pages read
   as part of the same system.
   House rule: no em or en dashes anywhere in this file.
   ========================================================================== */

/* ---- Page hero (system vocabulary from the home hero, matches about.css/contact.css) ---- */
.page-hero {
  padding: 96px 48px 64px;   /* kit: section pads {76, 96, 128}; page gutter 48 */
  text-align: center;
}
.page-eyebrow {
  font-size: 24px;           /* locked system: hero eyebrow 24px (styles.css .hero-eyebrow) */
  font-weight: 400;
  opacity: .82;              /* locked system: eyebrow sits quieter than the h1 */
}
.page-h1 {
  font-size: 80px;           /* kit: hero h1 80px (ref typeScale) */
  line-height: 1.1;          /* kit: ref h1 88px at 80 = 1.1 */
  letter-spacing: -2px;      /* kit: ref h1 letter-spacing -2px */
  font-weight: 400;          /* kit: hierarchy by SIZE at weight 400 */
  margin: 20px auto 0;
}
.page-lead {
  max-width: 760px;          /* derived: calm lead measure inside the ref 1344 content box */
  margin: 32px auto 0;
  font-size: 20px;           /* derived: one step over body 16 (locked sheet-row 20 is the same step) */
  line-height: 1.6;
}

/* ---- Legal prose body: one reading column, kit tokens only ---- */
.legal-sec {
  padding: 32px 48px 128px;  /* kit: page gutter 48; section pad member 128 as the closing step */
  display: flex;
  justify-content: center;
}
.legal-content {
  max-width: 760px;          /* derived: matches .page-lead measure, a calm reading column */
  width: 100%;
}
.legal-updated {
  font-size: 16px;
  color: var(--muted-ink);   /* locked system: muted labels (styles.css .col-head) */
  margin-bottom: 32px;       /* ref card gap 32 */
}
.legal-content h2 {
  font-size: 32px;           /* locked system: mobile display step 32, hierarchy by SIZE at weight 400 */
  font-weight: 400;
  letter-spacing: -0.8px;    /* locked system: mobile display tracking */
  margin-top: 64px;          /* derived: two 32 gaps between sections */
}
.legal-content h2:first-of-type { margin-top: 0; }
.legal-content p {
  font-size: 16px;           /* kit: body 16 */
  line-height: 1.75;         /* locked system: disclosure leading (styles.css .disclosure p) */
  margin-top: 20px;
}
.legal-content ul {
  margin-top: 16px;          /* kit: spacing base 16 */
  padding-left: 24px;        /* kit: radius scale member 24 */
  list-style: disc;          /* legal lists read clearer with a real marker */
}
.legal-content li {
  font-size: 16px;
  line-height: 1.75;
  margin-top: 8px;
}
.legal-content a {
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: opacity .15s ease;      /* locked system: link hover treatment */
}
.legal-content a:hover { opacity: .7; }
.legal-content strong { font-weight: 500; } /* kit: 500 is the loaded medium weight */
.legal-disclaimer {
  margin-top: 64px;
  padding-top: 32px;
  border-top: 1px solid var(--line);  /* kit: secondary fill FADEDE, the one permitted hairline */
  font-size: 14px;                    /* ref legal-row scale 14 */
  line-height: 1.6;
  color: var(--muted-ink);
  font-style: italic;
}

/* ---- Mobile (locked breakpoint 820; kit: mobile gutter 20, h1 28) ---- */
@media (max-width: 820px) {
  .page-hero { padding: 56px 20px 40px; } /* kit: mobile gutter 20 */
  .page-eyebrow { font-size: 16px; }      /* locked system: mobile eyebrow 16 */
  .page-h1 {
    font-size: 28px;         /* kit: mobile h1 28px */
    letter-spacing: -0.7px;  /* locked system: mobile h1 tracking fingerprint, rounded */
  }
  .page-lead { font-size: 16px; margin-top: 20px; }
  .legal-sec { padding: 16px 20px 76px; }
  .legal-content h2 { font-size: 24px; letter-spacing: -0.5px; margin-top: 48px; } /* locked system: eyebrow scale 24 */
  .legal-disclaimer { margin-top: 48px; padding-top: 24px; }
}

/* ---- Reduced motion: nothing on this page animates beyond the locked foundation ---- */

/* long raw URLs (PDF links) must wrap at 375; fixes the allpages mobile overflow (2026-07-11) */
.legal-content a { overflow-wrap: anywhere; }