/* Shopper marketing page layout. Shared hero/activation/final-cta/grid patterns live in styles.css. */
.journey-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 24px; margin-top: 48px; }
.journey-grid article { border-top: 3px solid var(--blue); padding-top: 20px; }
.journey-stage { display: block; margin-bottom: 14px; font: 700 15px Manrope, sans-serif; letter-spacing: 2px; text-transform: uppercase; color: var(--blue); }
.journey-grid p { font-size: 16px; line-height: 1.55; }

.fmcg-section > p { max-width: 700px; }

@media (max-width: 1100px) {
  .journey-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 800px) {
  .journey-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
}
@media (max-width: 540px) {
  .journey-grid { grid-template-columns: 1fr; gap: 24px; }
}