@media (max-width: 1100px) {
  .hero-feature__card {
    grid-template-columns: 1fr;
  }

  .hero-feature__media {
    min-height: 440px;
  }

  .post-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .site-footer__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 860px) {
  .site-header__inner {
    grid-template-columns: auto 1fr auto;
  }

  .site-nav--desktop {
    display: none;
  }

  .header-action--menu {
    display: inline-grid;
  }

  .newsletter-banner {
    grid-template-columns: 1fr;
  }

  .post-card--horizontal {
    grid-template-columns: 1fr;
  }

  .author-box,
  .author-hero {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .site-shell {
    width: min(100% - 28px, var(--site-width));
  }

  .site-main {
    padding-top: 24px;
  }

  .site-header__inner {
    min-height: 78px;
    gap: 14px;
  }

  .site-logo {
    font-size: 1.35rem;
  }

  .post-grid {
    grid-template-columns: 1fr;
  }

  .section-heading {
    align-items: start;
    flex-direction: column;
  }

  .search-form,
  .newsletter-form {
    grid-template-columns: 1fr;
  }

  .single-article__meta {
    align-items: start;
  }

  .site-footer__grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 520px) {
  body {
    font-size: 17px;
  }

  .hero-feature__content,
  .archive-hero,
  .author-hero,
  .page-article__header,
  .empty-state,
  .newsletter-banner,
  .author-box {
    padding: 22px;
  }

  .hero-feature__media {
    min-height: 300px;
  }

  .mobile-overlay {
    padding: 10px;
  }

  .mobile-overlay__panel {
    min-height: calc(100dvh - 20px);
    padding: 22px;
    border-radius: 22px;
  }

  .header-action,
  .search-form__button,
  .newsletter-form button,
  .button-link {
    width: 100%;
  }
}