/* r89 group D (2026-10-13): the reading template for the eleven reading pages (methodology, the two standards,
   release gate, custody note, sample Passport, why independent, brand claims, counsel, privacy, terms).
   Linked after s2/r88/d.css. Layout and type scale only; every colour, font, radius and ring is one vx-sections.css
   already uses. Built from Stripe's guides (summary box, term lists, boxed figure), Linear's Method (narrow measure,
   previous and next cards) and the homepage (two-tone slogan heads). */

/* ---------- 1. the opening intro never outranks the H1 on a phone (it was 44px under a 30px H1) ---------- */
@media (max-width:767px){
  :root .pg .pg-light.art>.sh-intro h2{font-size:26px!important;line-height:31px!important}
  :root .pg .pg-light.art>.sh-intro p:not(.sh-src){font-size:16.5px!important;line-height:26px!important}
}

/* ---------- 2. "In short": the page in four lines, before the first section ---------- */
:root .pg .pg-light.art .art-short{margin:0 0 80px;padding:26px 32px 22px;background:#fff;border-radius:16px;box-shadow:0 0 0 1px rgba(15,23,42,.07),0 1px 2px rgba(15,23,42,.04)}
:root .pg .pg-light.art .art-short .vs-k{margin:0 0 6px!important;font:500 14px/20px var(--vs-sans)!important;letter-spacing:-.011em!important;color:var(--vs-sub)!important}
:root .pg .pg-light.art .art-short ul{margin:0!important;padding:0!important;list-style:none!important}
:root .pg .pg-light.art .art-short li{position:relative;margin:0!important;padding:8px 0 8px 24px!important;border:0!important;font:400 17px/27px var(--vs-sans)!important;letter-spacing:-.011em!important;color:var(--vs-ink)!important;list-style:none!important}
:root .pg .pg-light.art .art-short li::before{content:""!important;position:absolute;left:2px;top:17px;width:8px;height:8px;border-radius:2px;background:#2554e8}
:root .pg .pg-light.art .art-short li::marker{content:none}

/* ---------- 3. slogan heads: the claim, then the payoff on its own line (the homepage's light heading) ---------- */
:root .pg .pg-light.art .art-sec h2 .vs-dim{display:block}

/* ---------- 4. pull quotes: a document clipping inside a section, at the measure (the shared .vs-clip, protected
   from the article's blockquote and paragraph rules) ---------- */
:root .pg .pg-light.art .art-sec>.vs-clip{max-width:640px;margin:20px 0 40px!important}
:root .pg .pg-light.art .art-sec .vs-doc{box-shadow:0 0 0 1px rgba(15,23,42,.06),0 18px 34px -20px rgba(15,23,42,.35)}
:root .pg .pg-light.art .art-sec .vs-doc p.vs-src{display:flex!important;justify-content:space-between;align-items:baseline;gap:12px;margin:0 0 14px!important;padding:0 0 10px!important;border-bottom:1px solid #dedcd4!important;font:500 11px/16px var(--vs-mono)!important;letter-spacing:.04em!important;text-transform:uppercase;color:#6b6a63!important}
:root .pg .pg-light.art .art-sec .vs-doc p.vs-src span{text-transform:none;letter-spacing:0;white-space:normal;text-align:right}
:root .pg .pg-light.art .art-sec .vs-doc blockquote{margin:0!important;padding:0!important;border:0!important;background:none!important;font:400 18px/29px Georgia,"Times New Roman",serif!important;letter-spacing:0!important;color:#3a3a36!important}
:root .pg .pg-light.art .art-sec .vs-clip figcaption{margin:20px 2px 0!important;font:500 17px/26px var(--vs-sans)!important;letter-spacing:-.012em!important;color:var(--vs-ink)!important}

/* ---------- 5. a boundary line set apart (the "will not" line in plain view) ---------- */
:root .pg .pg-light.art .art-sec p.art-bound{margin:8px 0 24px!important;padding:16px 20px!important;border-radius:12px;background:#fff;box-shadow:0 0 0 1px rgba(15,23,42,.07);font:500 16px/25px var(--vs-sans)!important;color:var(--vs-ink)!important}

/* ---------- 6. previous and next: two cards at the end of the document ---------- */
:root .pg .pg-light.art .art-pn{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:72px 0 0;padding:0}
:root .pg .pg-light.art .art-pn a{display:block;padding:20px 24px 22px;border-radius:16px;background:#fff;box-shadow:0 0 0 1px rgba(15,23,42,.07),0 1px 2px rgba(15,23,42,.04);text-decoration:none!important;transition:box-shadow .2s}
:root .pg .pg-light.art .art-pn a:hover{box-shadow:0 0 0 1px rgba(15,23,42,.14),0 8px 24px -12px rgba(15,23,42,.18)}
:root .pg .pg-light.art .art-pn a.nx{text-align:right}
:root .pg .pg-light.art .art-pn small{display:block;font:400 13px/20px var(--vs-sans);color:var(--vs-sub)}
:root .pg .pg-light.art .art-pn b{display:block;margin-top:4px;font:500 20px/26px var(--vs-display);letter-spacing:-.015em;color:var(--vs-ink)}
:root .pg .pg-light.art .art-pn a:hover b{color:#2554e8}
:root .pg .pg-light.art .art-pn a:only-child{grid-column:2}

/* ---------- 7. figures: every one captioned; the caption reads as part of the document ---------- */
:root .pg .pg-light.art .art-fig figcaption{max-width:640px}

/* ---------- 8. tables on a phone: the row label sits above its value (it wrapped to three lines in a 76px column) ---------- */
@media (max-width:767px){
  :root .pg .pg-light.art .art-sec .vt td{display:block!important;margin-top:8px!important}
  :root .pg .pg-light.art .art-sec .vt td::before{display:block;margin:0 0 2px;font:500 13px/20px var(--vs-sans);color:var(--vs-sub)}
  :root .pg .pg-light.art .art-short{margin-bottom:56px;padding:22px 20px 18px}
  :root .pg .pg-light.art .art-short li{font-size:16px!important;line-height:25px!important}
  :root .pg .pg-light.art .art-pn{grid-template-columns:1fr;margin-top:56px}
  :root .pg .pg-light.art .art-pn a.nx{text-align:left}
  :root .pg .pg-light.art .art-pn a:only-child{grid-column:1}
  :root .pg .pg-light.art .art-sec .vs-doc blockquote{font-size:17px!important;line-height:27px!important}
}

/* ---------- 9. legal documents (privacy, terms): clauses, not marketing sections ---------- */
:root .pg.r59-legal .pg-light.art .art-sec{margin-bottom:40px!important}
:root .pg.r59-legal .pg-light.art .art-sec p:last-child{margin-bottom:0!important}
:root .pg.r59-legal .pg-light.art .art-sec h2{display:grid!important;grid-template-columns:44px minmax(0,1fr);column-gap:0!important;align-items:baseline;margin:0 0 12px!important;font:500 22px/28px var(--vs-display)!important;letter-spacing:-.014em!important}
:root .pg.r59-legal .pg-light.art .art-sec h2 .n{display:block!important;font:500 14px/28px var(--vs-mono)!important;letter-spacing:0!important;color:var(--vs-sub)!important}
:root .pg.r59-legal .pg-light.art .art-sec h2~*{margin-left:44px!important}
:root .pg.r59-legal .pg-light.art .art-toc a .n{display:inline!important;margin-right:8px;font:500 12px/20px var(--vs-mono);color:var(--vs-sub)}
@media (max-width:767px){
  :root .pg.r59-legal .pg-light.art .art-sec{margin-bottom:40px!important}
  :root .pg.r59-legal .pg-light.art .art-sec h2{grid-template-columns:34px minmax(0,1fr);column-gap:0!important;font-size:20px!important;line-height:26px!important}
  :root .pg.r59-legal .pg-light.art .art-sec h2~*{margin-left:34px!important}
  /* the contents list is a full screen on a phone; two columns halve it */
  :root .pg.r59-legal .pg-light.art .art-toc{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:16px}
  :root .pg.r59-legal .pg-light.art .art-toc b{grid-column:1/-1}
}

/* ---------- 10. the shared comparison and stat band inside a document section: closer to the lead, shared type kept ---------- */
:root .pg .pg-light.art .art-sec>.vs-vs{margin:20px 0 32px!important}
:root .pg .pg-light.art .art-sec>.vs-stats{margin:20px 0 32px!important}
:root .pg .pg-light.art .art-sec .vs-stats p{margin:8px 0 0!important;font:400 15px/23px var(--vs-sans)!important;color:var(--vs-mut)!important}

/* ---------- 11. an end block that holds only the previous and next cards ---------- */
:root .pg .pg-light.art .art-next>.art-pn:first-child{margin-top:0}

/* r90: the date the legal text last changed, under the intro */
.art .sh-intro .art-upd{margin-top:12px!important;font:500 13px/20px var(--vs-mono,"Geist Mono",ui-monospace,monospace)!important;letter-spacing:0;color:#71717a!important}