/* Mobile: single column */
.bento-grid {
  grid-template-columns: 1fr;
  grid-template-areas:
    "hero"
    "review"
    "trust"
    "benefit"
    "faq"
    "cta";
}

/* Tablet: 2 columns */
@media (min-width: 768px) {
  .bento-grid {
    grid-template-columns: repeat(3, 1fr);
    grid-template-areas:
      "hero    hero hero"
      "review review review"
      "trust   trust trust"
      "benefit benefit benefit"
      "faq   faq  faq"
      "cta cta cta";
  }
}

/* Desktop: 3 columns, trust spans right */
@media (min-width: 1024px) {
  .bento-grid {
    grid-template-columns: repeat(4, 1fr);
    grid-template-areas:
      "hero hero hero hero"
      "review review review review"
      "trust trust trust trust"
      "benefit benefit benefit benefit"
      "faq faq faq faq"
      "cta cta cta cta";
  }
}