/* rp-cm-cards — "Features That Make Working Together Simple" 6-card grid.
   Scope: .rp-cm-cards. Structural layout by CC; Cowork refines to Figma 15642:8500. */
.rp-cm-cards { padding: 80px 24px; }
/* Figma 15642:8500: full-bleed navy band with white pill cards + yellow highlight */
.rp-cm-cards.rp-section.rp-container { background: #021143; width: 100vw !important; max-width: 100vw !important; margin-left: calc(50% - 50vw) !important; margin-right: calc(50% - 50vw) !important; overflow-x: clip; }
.rp-cm-cards__heading { font-family: Mulish, -apple-system, sans-serif; font-size: 40px; line-height: 48px; font-weight: 700; color: #ffffff !important; text-align: center; max-width: 760px; margin: 0 auto 48px; }
.rp-cm-cards__heading .rp-blue { color: #FFC83A !important; }
/* beat the legacy page rule .rp-contractors .new-rp-section-header{3rem}; Figma = 40/48 */
body.page-template-page-contractors .rp-cm-cards__heading { font-size: 40px; line-height: 48px; }
/* Figma 15642:8500: ONE row of 6 cards (212x330, 8px gap), each = 72x72 icon +
   Heading 3 title + description. (Not a 3x2 grid.) CC: add the 6 card icons
   (USD Debit Cards, Health Insurance, Seven Payout Methods, Flexible Contracts,
   KYC & Screening, Human Support) into .rp-cm-cards__icon — markup/asset. */
.rp-cm-cards__grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; max-width: 1312px; margin: 0 auto; }
/* cards: centred icon + centred text, pill-rounded corners (99px) per design review */
.rp-cm-cards__card { background: #fff; border: 1px solid #E3E8F1; border-radius: 99px; padding: 44px 20px; box-shadow: 0 2px 12px rgba(15,16,53,.04); display: flex; flex-direction: column; align-items: center; text-align: center; gap: 16px; }
.rp-cm-cards__icon { width: 72px; height: 72px; border-radius: 16px; display: flex; align-items: center; justify-content: center; flex: 0 0 auto; }
.rp-cm-cards__icon img { width: 100%; height: 100%; object-fit: contain; }
.rp-cm-cards__title { font-family: Mulish, sans-serif; font-size: 18px; line-height: 24px; font-weight: 700; color: #021143; margin: 0; }
.rp-cm-cards__text { font-family: Mulish, sans-serif; font-size: 14px; line-height: 22px; font-weight: 400; color: #545454; margin: 0; }
@media (max-width: 1199px) { .rp-cm-cards__grid { grid-template-columns: repeat(3, 1fr); gap: 24px; max-width: 760px; } }
/* heading responsiveness synced with .rp-cm-vis__heading (28/36 at <=991px); page-scoped
   selector included so it beats body.page-template-page-contractors 40px rule */
@media (max-width: 991px) { .rp-cm-cards__heading, body.page-template-page-contractors .rp-cm-cards__heading { font-size: 28px; line-height: 36px; } }
@media (max-width: 767px) { .rp-cm-cards__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 460px) { .rp-cm-cards__grid { grid-template-columns: 1fr; } }