/* ============================================================
   About — section 08
   No dedicated reference prototype existed for this section (only
   system_2.md's "scroll reveal" mechanic description and the copy
   deck's content). Built directly on the shared .rv reveal component.
   ============================================================ */

/* #about's own header is a duplicate of Stack02's Panel B preview
   (skills-scatter.js/css, the Uncover transition) — hidden here so it
   isn't shown twice in a row as the pin releases. Reduced motion
   doesn't run that slide at all, so it's the only copy left there. */
#about-head{ display:none; }
@media (prefers-reduced-motion:reduce){ #about-head{ display:block; } }

/* padding-top:0, overriding .section's own flat --sp-9 — this section
   picks up directly from Panel B's lede (skills-scatter.css), which
   already ends with its own --sp-10 bottom padding as the intentional
   breathing room before the pin releases. Stacking a second top
   padding here on top of that was the real gap the owner saw (~450px:
   Panel B's own padding, plus this section's, plus .about__body's
   margin-top). Bottom padding (the close before Contact) is untouched. */
#about{ padding-top:0; }
@media (prefers-reduced-motion:reduce){
  /* Panel B's slide never runs here, so there's no bottom padding to
     lean on — restore the normal top padding so #about doesn't sit
     flush against whatever the real Stack02 grid ends on. */
  #about{ padding-top:var(--sp-9); }
}

/* Owner request: this section's paragraph-by-paragraph reveal (the
   shared .rv/.rv__in component, site.css) should have the same feel as
   the Hero fix above it — refer/feel-sample_1.html's own single curve
   (--ease-move) rather than the site-wide --ease-reveal every other
   .rv user (Contact's own note/meta blocks use .fade instead; the five
   detail pages still use the original .rv) keeps. Scoped to #about
   specifically — durations (1150ms/1500ms) are untouched, only the
   curve changes, since duration wasn't what read as different. */
#about .rv{ transition-timing-function:var(--ease-move); }
#about .rv__in{ transition-timing-function:var(--ease-move); }

.about__body{ max-width:var(--measure); margin-top:var(--sp-6); }
.about__body p{ margin:0 0 var(--sp-5); font-size:var(--fs-t2); color:var(--text-muted); }
.about__body p:last-child{ margin-bottom:0; }

/* Owner request: some hierarchy to this section, not seven flat
   paragraphs at one size. The lede (this body's own first paragraph —
   panB's own lede line, skills-scatter.css, already carried the actual
   opening line before the pin released) reads a size up and in the
   main text colour, continuing that same weight rather than dropping
   straight back to muted body copy. */
.about__lede{
  font-size:var(--fs-t1); color:var(--text) !important;
  max-width:38ch;
}

.about__quote{
  margin:var(--sp-7) 0; padding-left:var(--sp-5); border-left:2px solid var(--text);
  font-family:var(--font-display); font-weight:400;
  font-size:clamp(24px,2.4vw,28px); line-height:1.25; letter-spacing:var(--ls-display);
}

/* The closing personal aside — set apart like Contact's own .note, so
   the register shift (professional narrative -> "also I play chess")
   reads as a deliberate closing beat, not just the last item in a list. */
.about__aside{
  margin-top:var(--sp-7) !important; padding-top:var(--sp-5);
  border-top:1px solid var(--border);
  font-size:var(--fs-t3);
}