@media (max-width: 1024px) {
  :root { --section-y: 80px; }
  .container { padding: 0 32px; }
  .intro-grid, .why-grid, .story-grid, .approach-grid, .contact-grid {
    grid-template-columns: 1fr;
    gap: 50px;
  }
  .why-image, .story-image { aspect-ratio: 16/10; max-height: 480px; }
  .services-grid { gap: 28px; }
  .showcase-grid {
    grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: 240px;
  }
  .showcase-item.large { grid-column: span 2; grid-row: span 1; }
  .testimonial-grid, .philosophy-grid { grid-template-columns: 1fr; }
  .nav-desktop { display: none; }
  .menu-toggle { display: flex; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 40px; }
}

@media (max-width: 640px) {
  :root { --section-y: 60px; }
  .container { padding: 0 22px; }
  body { font-size: 16px; }
  .hero-content { padding-top: 120px; padding-bottom: 80px; }
  .hero-cta { flex-direction: column; align-items: stretch; }
  .hero-cta .btn { text-align: center; }
  .services-grid { grid-template-columns: 1fr; }
  .showcase-grid { grid-template-columns: 1fr; grid-auto-rows: 280px; }
  .showcase-item.large { grid-column: span 1; }
  .contact-form { padding: 30px; }
  .approach-steps li { flex-direction: column; gap: 8px; }
  .approach-steps span { font-size: 1.2rem; }
  .footer-grid { grid-template-columns: 1fr; gap: 30px; padding-bottom: 40px; }
  .page-hero { padding: 160px 0 70px; }
  .section-head { margin-bottom: 50px; }
  .philosophy-card, .testimonial-grid blockquote { padding: 32px 26px; }
}