.cc_3gx8bz3t_Uf4qKeYA3V .program-grid__head {
  display: grid;
  gap: 1.25rem;
  margin-bottom: 2.5rem;
}

.cc_3gx8bz3t_Uf4qKeYA3V .program-grid__head .sukun-eyebrow {
  margin-bottom: 1rem;
}

.cc_3gx8bz3t_Uf4qKeYA3V .program-grid__title {
  font-size: clamp(2.5rem, 5vw, 4.5rem);
  color: var(--sukun-ink);
}

.cc_3gx8bz3t_Uf4qKeYA3V .program-grid__side p {
  margin: 0 0 1.25rem;
  color: var(--sukun-gray-600);
  max-width: 28rem;
}

.cc_3gx8bz3t_Uf4qKeYA3V .program-grid__list {
  display: grid;
  gap: 1.25rem;
}

@media (min-width: 640px) {
  .cc_3gx8bz3t_Uf4qKeYA3V .program-grid__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1024px) {
  .cc_3gx8bz3t_Uf4qKeYA3V .program-grid__head {
    grid-template-columns: 1.3fr 1fr;
    align-items: end;
    margin-bottom: 3.5rem;
  }

  .cc_3gx8bz3t_Uf4qKeYA3V .program-grid__list {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1.25rem;
  }

  /* Staggered rhythm */
  .cc_3gx8bz3t_Uf4qKeYA3V .program-grid__list > * > :nth-child(even) .program-card {
    margin-top: 3rem;
  }
}

/* The storefront base styles render headings and small text inline: force block layout. */
.cc_3gx8bz3t_Uf4qKeYA3V h1, .cc_3gx8bz3t_Uf4qKeYA3V h2, .cc_3gx8bz3t_Uf4qKeYA3V h3, .cc_3gx8bz3t_Uf4qKeYA3V h4, .cc_3gx8bz3t_Uf4qKeYA3V p, .cc_3gx8bz3t_Uf4qKeYA3V small {
  display: block;
}

/* Phones: one swipeable row instead of four tall stacked cards */
@media (max-width: 639px) {
  .cc_3gx8bz3t_Uf4qKeYA3V .program-grid__list {
    display: flex;
    gap: 0.875rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    margin: 0 -1rem;
    padding: 0 1rem 0.5rem;
    scroll-padding: 0 1rem;
  }

  .cc_3gx8bz3t_Uf4qKeYA3V .program-grid__list::-webkit-scrollbar {
    display: none;
  }

  .cc_3gx8bz3t_Uf4qKeYA3V .program-grid__list .program-card {
    flex: 0 0 82%;
    scroll-snap-align: start;
  }
}
