/* DOM places the action before benefits for mobile; desktop keeps its layout. */
@media (min-width: 1051px) {
  .membership-plan-card--action-first .membership-plan-card__intro { grid-column: 1; grid-row: 1; }
  .membership-plan-card--action-first .membership-plan-card__features { grid-column: 2; grid-row: 1; }
  .membership-plan-card--action-first .membership-plan-card__action { grid-column: 3; grid-row: 1; }
}
@media (min-width: 761px) and (max-width: 1050px) {
  .membership-plan-card--action-first .membership-plan-card__intro { grid-column: 1; grid-row: 1; }
  .membership-plan-card--action-first .membership-plan-card__features { grid-column: 2; grid-row: 1; }
  .membership-plan-card--action-first .membership-plan-card__action { grid-column: 1 / -1; grid-row: 2; }
}
@media (max-width: 760px) {
  .membership-plan-card.membership-plan-card--action-first { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .membership-plan-card--action-first .membership-plan-card__action {
    grid-column: auto;
    grid-row: auto;
    padding: 14px 0 0;
    border-left: 0;
    border-top: 1px solid #dbe6eb;
  }
  .membership-plan-card--action-first .membership-plan-card__action > * { grid-column: auto; grid-row: auto; }
  .membership-plan-card--action-first .membership-plan-card__features {
    grid-column: 1 / -1;
    padding-top: 16px;
    border-top: 1px solid #dbe6eb;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}