/* ==========================================================================
   Singularity Hypertech — APPROACH PAGE, responsive
   Loaded after approach.css. Breakpoints match the rest of the site
   (1200 / 1080 / 860 / 560).
   ========================================================================== */

@media (max-width: 1200px) {
  .apr-hero-inner { grid-template-columns: 1fr 1fr; }
  .apr-phil-grid { grid-template-columns: 360px 1fr; gap: 40px; }
}

@media (max-width: 1080px) {
  .apr-hero {
    min-height: 0;
    padding: 150px 0 24px; /* the feathered art closes the section */
  }
  .apr-hero-inner {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .apr-hero-copy { gap: 32px; }
  .apr-phil-grid { grid-template-columns: 1fr; gap: 44px; }
  .apr-phil-cards { grid-template-columns: 1fr; gap: 2px; }
  .apr-phil-card:nth-child(n) { grid-column: 1; grid-row: auto; }
  .apr-phil-card { min-height: 0; }
  .apr-phil-card h3 { padding-top: 28px; font-size: 21px; }
  .apr-phil-copy p { max-width: none; }

  .apr-proven-cards { gap: 24px; }
}

@media (max-width: 860px) {
  .apr-proven-cards { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
  .apr-hero { padding: 130px 0 24px; }
  .apr-hero-actions { width: 100%; gap: 12px; }
  .apr-hero-actions .btn { flex: 1 1 100%; }
  .apr-philosophy { padding: 64px 0 72px; }
  .apr-proven { padding: 72px 0 76px; }
  .apr-proven-cards { margin-top: 48px; }
}