/* FCS Magazine — Responsive overrides.
 * Single file holds all @media blocks. V7 already structured this way.
 * Per Doc #163 §3, existing breakpoints carry the new templates without
 * additional mobile work for v1.
 */

@media (max-width: 1024px) {
  .numbers-layout { grid-template-columns: 1fr; gap: 3rem; }
  .number-list { margin-top: 0; }

  .issue-inner { grid-template-columns: 1fr; grid-template-rows: auto; gap: 2rem; }
  .issue-cover-col { order: 1; }
  .issue-btn-wrap--cover { order: 2; }
  .issue-content { order: 3; }
  .issue-btn-wrap--view { order: 4; }
  .issue-cover-wrap {
    position: static;
    top: auto; left: auto; right: auto; bottom: auto;
  }
  .issue-cover-img {
    max-height: none;
    width: 320px;
    height: auto;
  }

  .blog-masonry { grid-template-columns: 1fr; grid-template-rows: auto auto auto; min-height: auto; }
  .blog-card--featured { min-height: 380px; grid-row: auto; }
  .blog-card--small { flex-direction: row; }

  .footer-grid { grid-template-columns: 1fr 1fr; gap: 2.5rem; }
}

@media (max-width: 768px) {
  .container { padding: 0 1.25rem; }
  .nav-inner { padding: 1rem 1.25rem; }
  .nav-links a:not(.nav-cta) { display: none; }

  .cover-spread { padding: 7rem 0 2.5rem; }
  .cover-foot { padding: 0 1.25rem; }

  .stats { padding: 5rem 0; }
  .number-hero-value { font-size: clamp(3.25rem, 15vw, 6.25rem); }
  .number-list-value { font-size: 1.75rem; min-width: 100px; }

  .issue { padding: 4.5rem 0; }
  .issue-cover-img { width: 260px; }
  .issue-content { padding: 2rem 1.75rem; border-radius: 20px; }

  .quote-section { padding: 4.5rem 0; }

  .blog { padding: 4.5rem 0; }
  .blog-card--small { flex-direction: column; }
  .blog-card--small .blog-card-image { width: 100%; min-height: 180px; }

  .media-kit { padding: 6rem 0; }
  .media-kit-actions { flex-direction: column; gap: 1rem; }
  .btn-media-primary, .btn-media-ghost { width: 100%; justify-content: center; }

  .newsletter-form { flex-direction: column; border-radius: 4px; padding: 0.5rem; }
  .newsletter-input { padding: 0.9rem 1rem; }
  .newsletter-btn { width: 100%; padding: 0.85rem; }

  .footer { padding: 3.5rem 0 1.5rem; }
  .footer-grid { grid-template-columns: 1fr; gap: 2.5rem; }
  .footer-bottom { flex-direction: column; gap: 0.5rem; text-align: center; }
}