/* ── m3 05 Pillars — maarch-3/sections/05-pillars/brief.md ──
   Figma 1:1491–1:1498 · columns x 91 → 1830 split by 3px rules (black 18%) at x 614 and 1303, 201h from y 2753 ·
   titles 600/42 coral · texts 26/26 · alignment left / centre / right */

.m3-pillars {
    background: var(--skin-canvas);
    padding: calc(73 * var(--u)) 0 calc(148 * var(--u));
}
.m3-pillars__inner {
    display: grid;
    grid-template-columns: 523fr 689fr 527fr;
    width: min(1739px, calc(1739 * var(--u)));
    margin-inline: auto;
}
.m3-pillars__col { min-height: calc(201 * var(--u)); padding-top: calc(14 * var(--u)); }
.m3-pillars__col + .m3-pillars__col { border-left: 3px solid rgba(0, 0, 0, .18); }
.m3-pillars__col h3 {
    font-size: var(--fs-sub);
    font-weight: 600;
    line-height: 1;
    color: var(--skin-coral);
}
.m3-pillars__col p {
    margin-top: calc(34 * var(--u));
    max-width: calc(396 * var(--u));
    font-size: var(--fs-body);
    line-height: 1;
}
.m3-pillars__col--center { text-align: center; }
.m3-pillars__col--center p { max-width: calc(475 * var(--u)); margin-inline: auto; }
.m3-pillars__col--right { text-align: right; }
.m3-pillars__col--right p { max-width: calc(440 * var(--u)); margin-left: auto; }

@media (max-width: 767.98px) {
    .m3-pillars { padding: 48px 0; }
    .m3-pillars__inner { grid-template-columns: 1fr; width: calc(100% - 2 * var(--skin-gutter)); }
    .m3-pillars__col { min-height: 0; padding: 28px 0; text-align: center; }
    .m3-pillars__col + .m3-pillars__col { border-left: 0; border-top: 1px solid rgba(0, 0, 0, .18); }
    .m3-pillars__col p { max-width: 420px; margin: 14px auto 0; line-height: 1.3; }
    .m3-pillars__col p br { display: none; }
}