/* Strategic Labs — V002-M5 system: the side-copy template is retired
   everywhere, chapters get an editorial composition + glyph voice, and the
   Home story is given intentional beats. Loaded after every M4 sheet. */

/* ======================================================================
   1. NO REPEATED SIDE-COPY TEMPLATE
   .sl-intro / .pm-copy-grid (heading | opposite paragraph | vertical rule)
   become an editorial stack: heading block, then the lead as a statement set
   in a measured column beneath it. The connector rule is gone.
   ====================================================================== */
.sl-intro, .pm-copy-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--s4); align-items: start; }
.sl-intro__body, .pm-copy-body { padding-inline-start: 0 !important; border-inline-start: 0 !important; }
.sl-intro__body > p, .pm-copy-body .prose { max-width: 58ch; }
.sl-intro__body .lead, .pm-copy-head .lead { font-size: var(--fs-lead); }
.sl-intro { margin-bottom: var(--s7); }
/* the two-column intro survives only where the second column is an ACTION, on
   the dark deep-dive and the corporate spotlight — there the action sits beside */
.home-deep .sl-intro, .m2-corp-spotlight .sl-intro { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); align-items: end; gap: clamp(1.5rem, 3vw, 3rem); }
.home-deep .sl-intro__body .cta__actions, .m2-corp-spotlight .sl-intro__body .cta__actions { justify-content: flex-end; margin-top: 0; }

/* ======================================================================
   2. EDITORIAL CHAPTER (generic headingText) — heading, statement, measure,
   glyph. Asymmetric: head on the start column, body in a 7-col measure,
   glyph occupying the end column as the chapter's visual voice.
   ====================================================================== */
.ed5__grid { display: grid; grid-template-columns: repeat(12, minmax(0,1fr)); column-gap: var(--gutter); row-gap: var(--s5); align-items: start; }
.ed5__head { grid-column: 1 / span 8; grid-row: 1; }
.ed5__body { grid-column: 1 / span 7; grid-row: 2; }
.ed5__glyph { grid-column: 9 / span 4; grid-row: 1 / span 2; align-self: center; justify-self: end; inline-size: min(100%, 300px); }
.ed5__lead { margin: 0 0 var(--s5); font-size: clamp(1.15rem, 1rem + .7vw, 1.45rem); line-height: 1.65; color: var(--ink); font-weight: 600; max-width: 32ch; }
.ed5__prose { max-width: 60ch; }
.ed5__prose p { color: var(--ink-soft); }
.ed5 .cta__actions { margin-top: var(--s5); }
/* the question beat (Home §3): paper-2 surface, the heading is the visual */
.ed5--question { background: var(--paper-2); }
.ed5--question .ed5__head { grid-column: 1 / span 7; grid-row: 1; }
.ed5--question .h2 { font-size: clamp(2rem, 1.4rem + 2.2vw, 3.4rem); line-height: 1.2; max-width: 18ch; }
.ed5--question .ed5__body { grid-column: 1 / span 6; grid-row: 2; }
.ed5--question .ed5__glyph { grid-column: 9 / span 4; inline-size: min(100%, 320px); }
/* glyph strokes */
.glyph { display: block; inline-size: 100%; block-size: auto; color: var(--brand-deep); }
.glyph__stroke { fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; }
.glyph__stroke--soft { opacity: .35; }
.glyph__node { fill: var(--paper); stroke: currentColor; stroke-width: 1.6; }
.glyph__node--on { fill: var(--brand); stroke: var(--brand-deep); }
.glyph__fill { fill: rgba(68,188,167,.22); }
.glyph__fill--2 { fill: rgba(68,188,167,.38); }
.glyph__fill--3 { fill: rgba(68,188,167,.62); }
.section--dark .glyph { color: var(--mint); }
.section--dark .glyph__node { fill: var(--ink-800); }

/* ======================================================================
   3. HOME STORY BEATS — surfaces alternate so no two text chapters share a
   ground; the hero field is the only dark spectacle, the deep-dive the only
   other dark chapter.
   ====================================================================== */
.home-proof { padding-block: var(--s6) var(--s5); }
.home-gateway { background: var(--paper); }
.home-method { background: var(--paper-2); }
.home-why { background: var(--paper); }
.home-team { background: var(--mint-wash); }

/* ================= RESPONSIVE ================= */
@media (max-width: 1023px) {
  .ed5__head { grid-column: 1 / span 12; grid-row: 1; }
  .ed5__body { grid-column: 1 / span 8; grid-row: 2; }
  .ed5__glyph { grid-column: 9 / span 4; grid-row: 2; align-self: start; inline-size: 100%; }
  .ed5--question .ed5__head { grid-column: 1 / span 12; }
  .ed5--question .ed5__body { grid-column: 1 / span 8; }
  .ed5--question .ed5__glyph { grid-column: 9 / span 4; }
  .home-deep .sl-intro, .m2-corp-spotlight .sl-intro { grid-template-columns: 1fr; align-items: start; }
  .home-deep .sl-intro__body .cta__actions, .m2-corp-spotlight .sl-intro__body .cta__actions { justify-content: flex-start; }
}
@media (max-width: 599px) {
  /* mobile authorship: the glyph sits BESIDE the heading (a 2-column head row),
     so the chapter gains a visual voice without gaining height */
  .ed5__grid { grid-template-columns: minmax(0,1fr) 84px; column-gap: var(--s4); row-gap: var(--s4); }
  .ed5 .ed5__head, .ed5--question .ed5__head { grid-column: 1; grid-row: 1; }
  .ed5 .ed5__glyph, .ed5--question .ed5__glyph { grid-column: 2; grid-row: 1; align-self: start; justify-self: end; inline-size: 84px; margin-block-start: 2rem; }
  .ed5 .ed5__body, .ed5--question .ed5__body { grid-column: 1 / -1; grid-row: 2; }
  .ed5__lead { font-size: 1.1rem; max-width: none; }
  .ed5--question .h2 { font-size: 1.9rem; }
}

/* a chapter may hold several .wrap containers (the VMV manifesto does); only
   the first carries the folio and rule */
main > .pm-section > .wrap ~ .wrap { counter-increment: none; }
main > .pm-section > .wrap ~ .wrap::before, main > .pm-section > .wrap ~ .wrap::after { display: none; }
