/* Method stage grid alignment repair.

   The design is unchanged: same columns, same typography, same gold divider
   and same designed line breaks. The bug was structural: the headline lines
   are `white-space: nowrap`, but the left grid track was a fractional width
   (minmax(14rem, .85fr)), so on longer statements the text overflowed its own
   track and ran into / under the vertical gold divider.

   Fix: the left track is sized to its content (capped at half the card), so
   the statement always sits completely inside its own column and the divider
   always keeps a real gap on both sides. */

@media (width > 900px) {
  .stg .stg-card,
  .stg[data-stage="audit"] .stg-card,
  .stg[data-stage="essence"] .stg-card,
  .stg[data-stage="recognition"] .stg-card,
  .stg[data-stage="orchestration"] .stg-card,
  .stg[data-stage="navigation"] .stg-card {
    grid-template-columns: fit-content(50%) 1px minmax(0, 1fr);
    column-gap: clamp(2.25rem, 4vw, 3.75rem);
    align-items: stretch;
  }

  .stg .stg-card-main,
  .stg .stg-card-explanation {
    align-self: center;
    min-width: 0;
  }

  .stg .stg-card-divider {
    align-self: stretch;
    height: 100%;
  }
}

/* Narrow desktop / tablet, before the card stacks: let the statement wrap
   naturally instead of forcing the designed line breaks into a tight track. */
@media (width > 720px) and (width <= 900px) {
  .stg .stg-card-statement > span {
    white-space: normal;
  }

  .stg .stg-card > * {
    min-width: 0;
  }
}

/* Capability matrices: four columns need real room. Between 900px and 1024px
   the cells fall under ~140px and long single words (e.g. "applications")
   spill out of their cell and past the page edge. Reduce the column count on
   content failure instead of shrinking type. */
@media (width > 900px) and (width <= 1024px) {
  .stg .stg-matrix--3,
  .stg .stg-matrix--4 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .stg .stg-matrix--3 .stg-cell:nth-child(3n),
  .stg .stg-matrix--4 .stg-cell:nth-child(4n) {
    border-right: 1px solid #dce5ea;
  }
  .stg .stg-matrix .stg-cell:nth-child(2n) {
    border-right: none;
  }
}

/* Never let a single long capability word escape its cell. */
.stg .stg-cell-label {
  overflow-wrap: break-word;
}