@media (max-width: 760px) {
  body { overflow-x: hidden; }

  .section-shell { width: calc(100% - 32px); }

  .site-header {
    height: 108px;
    flex-wrap: wrap;
    align-content: center;
    gap: 8px;
  }

  .site-header nav {
    order: 3;
    display: flex;
    width: 100%;
    justify-content: space-between;
    gap: 10px;
    overflow-x: auto;
    scrollbar-width: none;
  }

  .site-header nav::-webkit-scrollbar { display: none; }
  .site-header nav a { flex: 0 0 auto; padding: 4px 0; }
  .header-action { display: none; }
  .hero-copy, .hero-lede, h1 { max-width: calc(100vw - 32px); }
  h1 { width: calc(100vw - 32px); overflow-wrap: anywhere; }
  .hero { padding-top: 64px; gap: 40px; }
  .capability-card[style] { grid-column: auto !important; min-height: 260px !important; }
}

@media (max-width: 420px) {
  h1 { width: 100%; max-width: 320px; font-size: clamp(42px, 13vw, 54px); letter-spacing: -.07em; }
  .hero-copy, .hero-lede { max-width: 320px; }
  .hero-actions { align-items: flex-start; flex-direction: column; gap: 18px; margin-top: 30px; }
  .hero-object { min-height: 330px; border-radius: 24px; }
  .core { width: 112px; }
  .core span { font-size: 23px; }
  .object-label { font-size: 8px; }
  .statement h2, .section-intro h2, .contact h2 { font-size: 36px; }
  .contact { padding: 34px 22px; }
  .principles-list h3 { font-size: 21px; }
  .principles-list article { grid-template-columns: 45px 1fr; }
  .capability-card { padding: 22px; border-radius: 18px; }
  .capability-card h3 { font-size: 27px; }
  .site-footer { font-size: 9px; }
}
