/* /product/training · page scoped CSS (prefix pg-training-). Spacing between shared blocks, plus the small parts of three pictures:
   the note line in the hero answer card, the lesson moment on the checklist plate (fig. 02), the Training due square in the menu bar
   card (fig. 03, DS menu bar state: a 26px iris square) and the plate foot of fig. 04. Listed as promote requests in the team report.
   Nothing here restyles a cy- class except through a pg-training- class on the same element. */

/* hero: the note line in the answer card */
.pg-training-note{font-size:calc(14px + var(--pg-mock-bump));line-height:1.45;color:#515154;text-wrap:pretty}

/* how it works: the intro head, then the first block on the same ground one title gap below (as /product) */
.pg-training-how{padding-bottom:var(--pg-title-gap)}
.pg-training-how__head{margin-bottom:0}
.pg-training-block--first{padding-top:0}

/* fig. 02: the moment, the question, three boxes nobody ticks, the rule */
.pg-training-moment{font-family:var(--font-display);font-size:26px;font-weight:500;letter-spacing:-.02em;line-height:1.35;color:var(--s-ink);text-wrap:pretty}
.pg-training-moment__2{color:var(--s-ink-3)}
.pg-training-ask{margin-top:24px;padding-bottom:4px;font-family:var(--font-mono);font-size:13px;line-height:1.4;color:var(--s-ink-3)}
.pg-training-rule{display:flex;align-items:baseline;gap:12px;margin-top:16px;padding-top:16px;border-top:1px solid var(--s-line-2);font-size:calc(15px + var(--pg-mock-bump));font-weight:500;line-height:1.4;color:var(--s-ink)}
.pg-training-rule__mark{flex:none;width:14px;height:3px;transform:translateY(-4px);background:#FF6B2B}
@media (max-width:519px){.pg-training-moment{font-size:22px}}

/* recorded: the limits callout one paragraph gap under the body */
.pg-training-limit{margin-top:28px}