/* Keep laptop layouts comfortable in CSS pixels, including scaled displays. */
.site-main :is(.hero-grid, .program-grid, .community-grid, .impact-grid, .posts-grid, .contact-layout) > * { min-width: 0; }

@media (min-width: 821px) and (max-width: 1440px) {
  .site-main .container { width: min(1200px, calc(100% - 64px)); }
  .section { padding-block: 64px; }
  .section-head h2 { font-size: clamp(2rem, 3.2vw, 2.8rem); }
  .program-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
  .program-card.wp-block-cover .wp-block-cover__inner-container { padding: 24px; }
  .program-card h3 { font-size: 1.6rem; }
}
@media (min-width: 821px) and (max-width: 1050px) {
  .program-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 820px) {
  .site-main .container { width: calc(100% - 32px); }
}
@media (min-width: 901px) and (max-width: 1200px) {
  .editorial-grid { grid-template-columns: minmax(0, 1fr) 200px; gap: 32px; }
}
@media (min-width: 1025px) {
  .site-header .wp-block-navigation__responsive-container-open,
  .site-header .wp-block-navigation__responsive-container-close { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .hero :is(h1, p, .hero-actions, .mini-proof) { animation: none; }
}
/* WordPress flow spacing must not push navigation below the logo. */
.site-header .header-inner > * { margin-block: 0; }

/* Keep the restored hero at its original container widths. */
.hero .container { width: min(var(--max), calc(100% - 32px)); }
@media (max-width: 820px) { .hero .container { width: min(var(--max), calc(100% - 24px)); } }
@media (max-width: 560px) { .hero .container { width: min(var(--max), calc(100% - 18px)); } }