/* ==========================================================================
   SPLIT — the boards' editorial two-column band: 760 | 100 | 940 of 1800
   ==========================================================================
   42.2% | 5.6% gap | 52.2%. Used wherever a heading (or copy) sits left of the
   body or a visual: What We Do and Resources' numbered bands, every Case Study.
   Not a col-* pair — the gap is a PERCENTAGE so it keeps its share at every
   width, and the widths use the framework's `P% - gap x P` so the row sums
   exactly. Stacks at the framework's 992.

   Build: element_group `row split` with two children (no col-* on them).
   ========================================================================== */
.split {
    --gap-x: 5.56%;
    --gap-y: var(--space-40);
    align-items: start;

    > :first-child { flex: 0 0 calc(44.7% - var(--gap-x) * 0.447); }
    > :last-child  { flex: 0 0 calc(55.3% - var(--gap-x) * 0.553); }
}
@media only screen and (max-width: 992px) {
    .split {
        --gap-x: 0px;
        /* the same selectors as the widths above, or (0,1,0) loses to their (0,2,0) */
        > :first-child, > :last-child { flex: 0 0 100%; }
    }
}