@media (max-width: 1100px) {
  .services-grid,
  .tech-grid,
  .two-col,
  .contact-grid,
  .tech-items {
    grid-template-columns: 1fr 1fr;
  }

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

  .philosophy-box {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .pillars-grid {
    max-width: none;
    margin-left: 0;
  }
}

@media (max-width: 900px) {
  .hero-grid {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  .logo-card {
    max-width: 420px;
  }
}

@media (max-width: 760px) {
  .container {
    width: min(calc(100% - 24px), var(--max));
  }

  .hero {
    padding: 60px 0 56px;
  }

  .section,
  .band {
    padding: 56px 0;
  }

  .two-col,
  .services-grid,
  .tech-grid,
  .tech-items,
  .contact-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .logo-card,
  .philosophy-box,
  .contact-box,
  .feature-card,
  .pillar,
  .tech-item {
    padding: 22px 18px;
  }

  .hero-title {
    margin-bottom: 28px;
    max-width: none;
    font-size: clamp(2rem, 9vw, 3rem);
    line-height: 1.04;
    letter-spacing: -0.045em;
  }

  .lead {
    font-size: 1rem;
    line-height: 1.8;
  }

  .brand-name {
    letter-spacing: 0.12em;
    text-indent: 0.12em;
    font-size: 1.85rem;
  }

  .brand-copy {
    max-width: 100%;
    font-size: 0.95rem;
    line-height: 1.8;
  }

  .logo-label,
  .section-kicker {
    letter-spacing: 0.18em;
    font-size: 11px;
  }

  .logo-wrap img {
    width: min(100%, 160px);
  }

  .actions {
    flex-direction: column;
    align-items: stretch;
  }

  .btn {
    width: 100%;
  }

  .eyebrow {
    font-size: 11px;
    letter-spacing: 0.22em;
    padding: 9px 14px;
  }

  h2 {
    font-size: clamp(1.8rem, 8vw, 2.4rem);
  }
}

@media (max-width: 420px) {
  .container {
    width: min(calc(100% - 20px), var(--max));
  }

  .hero {
    padding: 52px 0 48px;
  }

  .logo-card,
  .philosophy-box,
  .contact-box,
  .feature-card,
  .pillar,
  .tech-item {
    padding: 18px 16px;
    border-radius: 24px;
  }

  .hero-title {
    font-size: 1.85rem;
  }

  .brand-name {
    font-size: 1.7rem;
    letter-spacing: 0.1em;
    text-indent: 0.1em;
  }

  .logo-wrap img {
    width: min(100%, 145px);
  }
}
