/* Strategic Labs — V002-M4 Wave 3: institutional trust wall, boardroom
   Vision/Mission/Values, light proof line. Same language as m4-system.css. */

/* ======================================================================
   CLIENTS — institutional trust wall
   One tab-corner plinth; eight approved marks on a ruled 4×2 lattice; a
   hatched footing (the page's one hatch surface). No card fills, no shadows.
   ====================================================================== */
.wall4 { position: relative; padding-block-end: 26px; }
main .wall4__lattice.trustwall__grid.pm-client-field { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 0;
  border: var(--rule-strong); border-radius: var(--tab-sm); border-start-start-radius: var(--tab); overflow: clip; background: var(--white); }
.wall4__cell.trustwall__cell { position: relative; display: grid; grid-template-rows: auto 1fr auto; justify-items: center; align-items: center; gap: var(--s3);
  min-block-size: 220px; margin: 0; padding: var(--s5) var(--s5) var(--s4); background: transparent; border: 0; border-radius: 0; box-shadow: none;
  border-inline-end: var(--rule); border-block-end: var(--rule); transition: background var(--t) var(--ease); }
.wall4__cell.trustwall__cell:nth-child(4n) { border-inline-end: 0; }
.wall4__cell.trustwall__cell:nth-child(n+5) { border-block-end: 0; }
.wall4__cell.trustwall__cell:hover { background: var(--paper); }
.wall4__n { justify-self: start; font-size: var(--fs-folio); font-weight: 700; letter-spacing: var(--track-folio); color: var(--brand-mid); }
.wall4__mark { display: grid; place-items: center; inline-size: 100%; block-size: 96px; }
.wall4__mark img { max-block-size: 64px; max-inline-size: 78%; inline-size: auto; object-fit: contain; }
.wall4__cell figcaption { justify-self: stretch; padding-block-start: var(--s3); border-block-start: var(--rule); text-align: center; color: var(--ink-soft); font-size: .84rem; line-height: 1.5; }
.wall4__footing { position: absolute; inset-inline: 6%; inset-block-end: 0; block-size: 26px; color: var(--brand-deep); opacity: .35; background: var(--hatch-h); border-block-start: 2px solid var(--brand-deep); }
.wall4__note { margin-block-start: var(--s6); }
.wall4__note .pm-note { margin: 0; max-width: none; }

/* light proof line — About / Clients statistics */
.proof4--light { margin-block-start: var(--s6); border-block-start: var(--rule-strong); }
.proof4--light .proof4__item { padding: clamp(1.5rem, 1.2rem + 1.4vw, 2.5rem) var(--s6) var(--s5) 0; background: transparent; border: 0; border-radius: 0; box-shadow: none; }
.proof4--light .proof4__item::before { display: none; }
.proof4--light .proof4__item + .proof4__item { border-inline-start: var(--rule); padding-inline-start: var(--s6); }
.proof4--light .proof4__item b { color: var(--brand-deep); }
.proof4--light .proof4__item > span { border-block-start: 0; padding-block-start: 0; margin-block-start: var(--s3); color: var(--ink-soft); }
.proof4--light .proof4__item:hover { transform: none; box-shadow: none; }

/* ======================================================================
   ABOUT — Vision / Mission / Values, boardroom hierarchy
   ====================================================================== */
.vmv4 { grid-template-columns: 1fr; gap: 0; }
/* VISION — dominant: full width, display scale, the tab corner, the arc geometry */
.vmv4__vision { grid-column: 1 / -1; min-block-size: clamp(300px, 36vw, 460px); padding: clamp(2rem, 4vw, 4rem) clamp(1.75rem, 4vw, 4rem); justify-content: center; }
.vmv4__vision h3 { font-size: var(--fs-eyebrow); letter-spacing: .08em; text-transform: none; color: var(--brand); margin-bottom: var(--s5); }
.vmv4__vision p { max-width: 20ch; font-size: clamp(1.6rem, 1.1rem + 2.4vw, 3.1rem); line-height: 1.35; font-weight: 700; }
.vmv4__vision .about-vmv__mark { color: var(--brand); }
/* MISSION — supporting: a ruled statement bound to its label, no panel */
.vmv4__mission { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(1.5rem, 3vw, 3.5rem); align-items: start;
  margin-block-start: var(--s6); padding: var(--s6) 0; border-block: var(--rule-strong); background: transparent; border-inline: 0; border-radius: 0; box-shadow: none; }
.vmv4__mission-head { display: grid; gap: var(--s3); }
.vmv4__mission-head .about-vmv__mark { margin: 0; color: var(--brand-mid); }
.vmv4__mission h3 { margin: 0; font-size: 1.15rem; color: var(--brand-deep); }
.vmv4__mission p { margin: 0; font-size: clamp(1.15rem, 1rem + .7vw, 1.5rem); line-height: 1.7; color: var(--ink); max-width: 40ch; }
/* VALUES — numbered principles on oversized folios */
.vmv4__values { grid-column: 1 / -1; padding: var(--s6) 0 0; background: transparent; border-radius: 0; }
.vmv4__values-head { margin-bottom: var(--s5); }
.vmv4__values-head h3 { font-size: 1.15rem; }
.vmv4__principles { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: var(--s5); }
.vmv4__values .vmv4__principles > li { display: grid; justify-items: start; text-align: start; gap: var(--s3); padding: var(--s4) 0 0; margin: 0;
  background: transparent; border: 0; border-radius: 0; box-shadow: none; border-block-start: 2px solid var(--brand-deep); color: var(--ink); font-weight: 400; }
.vmv4__values .vmv4__principles > li::before { display: none; }
.vmv4__folio { font-size: clamp(2.4rem, 1.8rem + 2vw, 3.6rem); font-weight: 700; line-height: .9; letter-spacing: -.04em; color: var(--brand); }
.vmv4__principles .about-vmv__value { font-size: 1.08rem; font-weight: 600; color: var(--ink); }

/* ================= RESPONSIVE ================= */
@media (max-width: 1023px) {
  main .wall4__lattice.trustwall__grid.pm-client-field { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 0; }
  .wall4__cell.trustwall__cell:nth-child(n) { border-inline-end: var(--rule); border-block-end: var(--rule); }
  .wall4__cell.trustwall__cell:nth-child(2n) { border-inline-end: 0; }
  .wall4__cell.trustwall__cell:nth-child(n+7) { border-block-end: 0; }
  .wall4__cell.trustwall__cell { min-block-size: 190px; }
  .vmv4__mission { grid-template-columns: 1fr; gap: var(--s4); }
  .vmv4__principles { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 599px) {
  main .wall4__lattice.trustwall__grid.pm-client-field { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 0; border-start-start-radius: 22px; }
  .wall4__cell.trustwall__cell { min-block-size: 150px; padding: var(--s4) var(--s3) var(--s3); gap: var(--s2); }
  .wall4__mark { block-size: 64px; }
  .wall4__mark img { max-block-size: 40px; }
  .wall4__cell figcaption { font-size: .74rem; }
  .wall4 { padding-block-end: 18px; }
  .wall4__footing { block-size: 18px; }
  .proof4--light { grid-template-columns: 1fr; }
  .proof4--light .proof4__item { padding: var(--s4) 0; border-inline-start: 0 !important; padding-inline-start: 0 !important; border-block-end: var(--rule); }
  .proof4--light .proof4__item b { font-size: 3rem; }
  .vmv4__vision { min-block-size: 0; padding: var(--s6) var(--s5); }
  .vmv4__vision p { max-width: none; font-size: clamp(1.35rem, 1rem + 2.2vw, 1.8rem); }
  .vmv4__mission { margin-block-start: var(--s5); padding: var(--s5) 0; }
  .vmv4__mission p { font-size: 1.05rem; }
  .vmv4__principles { grid-template-columns: repeat(2, minmax(0,1fr)); gap: var(--s4); }
  .vmv4__folio { font-size: 2rem; }
  .vmv4__principles .about-vmv__value { font-size: .95rem; }
}

/* ======================================================================
   WAVE 3 — MOBILE DENSITY (composition compression, not shrinking copy)
   Measured at 390: capability ledger 843px, why-us 1,454px, hero proof
   379px were the outliers after the ledger/folio grammar stacked what M3
   had hidden in rails. Each is recomposed; nothing is removed or hidden.
   ====================================================================== */
@media (max-width: 599px) {
  /* hero proof line: numeral and label share one baseline row */
  .hero4__proof.proof4 { grid-template-columns: 1fr; }
  .hero4__proof .proof4__item { display: grid; grid-template-columns: auto minmax(0,1fr); align-items: baseline; gap: var(--s4); padding: var(--s3) 0; }
  .hero4__proof .proof4__item b { font-size: 2.6rem; }
  .hero4__proof .proof4__item > span { margin: 0; padding: 0; border: 0; font-size: .86rem; }
  /* capability preview: two compact columns, practice label kept as a small line */
  .pm-cap-preview.ledger4--rows { grid-template-columns: repeat(2, minmax(0,1fr)); column-gap: var(--s4); }
  .pm-cap-preview.ledger4--rows > li.ledger4__row { grid-template-columns: 1.6rem minmax(0,1fr); gap: var(--s2); padding: var(--s3) 0; align-items: start; }
  .pm-cap-preview.ledger4--rows > li.ledger4__row b { font-size: .88rem; line-height: 1.45; }
  .pm-cap-preview.ledger4--rows > li.ledger4__row p { grid-column: 2; font-size: .72rem; }
  /* why-us: traits pair up; reasons keep the oversized folio but inline with the title */
  .home-why .ledger4--4 { grid-template-columns: repeat(2, minmax(0,1fr)); column-gap: var(--s4); }
  .home-why .ledger4--4 > li { padding: var(--s3) 0; }
  .home-why .ledger4--4 > li:nth-child(odd) { border-inline-end: var(--rule); padding-inline-end: var(--s3); }
  .home-why .ledger4--4 h3 { font-size: .95rem; }
  .home-why .ledger4--4 p { font-size: .84rem; line-height: 1.7; }
  .folio4__item { grid-template-columns: auto minmax(0,1fr); display: grid; column-gap: var(--s4); align-items: baseline; }
  .folio4__item .folio4__n { grid-row: 1 / span 2; margin: 0; font-size: 2.4rem; }
  .folio4__item h3 { margin: 0 0 var(--s2); }
  /* trust wall cells */
  .wall4__cell.trustwall__cell { min-block-size: 124px; }
  .wall4__mark { block-size: 52px; }
  /* index rows: a touch tighter */
  .index4 > li:nth-child(n) .index4__item { padding-block: var(--s3); }
}
@media (max-width: 599px) {
  /* refinements after measurement: decorative folios off inside the wall cells,
     capability practice label inline where it fits, tighter trait leading */
  .wall4__n { display: none; }
  .wall4__cell.trustwall__cell { grid-template-rows: 1fr auto; padding-block-start: var(--s3); }
  .pm-cap-preview.ledger4--rows > li.ledger4__row { grid-template-columns: 1.6rem minmax(0,1fr); }
  .home-why .ledger4--4 p { font-size: .8rem; line-height: 1.62; }
  .home-why .ledger4--4 h3 { margin-bottom: var(--s1); }
  .home-why .ledger4--4 .ledger4__n { margin-bottom: var(--s2); }
  .hero4__ledger a { min-height: 44px; padding: .3rem 0; }
}
/* the M2 tail-spanning schedule for .home-why__traits (3n+1 at <=1199) would
   float the fourth trait across both columns — ledgers never span */
.home-why .ledger4--4 > li:nth-child(n):last-child { grid-column: auto; }
