@media (max-width: 1024px) {

  .hero-grid,
  .service-hero-grid,
  .split,
  .contact-layout {
    grid-template-columns: 1fr
  }

  .hero-visual {
    min-height: 420px
  }

  .service-grid,
  .feature-grid,
  .values-grid,
  .team-grid,
  .pricing-grid,
  .blog-grid {
    grid-template-columns: repeat(2, 1fr)
  }

  .timeline,
  .timeline.compact {
    grid-template-columns: repeat(2, 1fr)
  }

  .footer-grid {
    grid-template-columns: 1fr 1fr
  }

  .culture-card {
    position: static
  }
}

@media (max-width: 760px) {
  .navbar {
    top: 10px
  }

  .brand img {
    width: 142px
  }

  .nav-toggle {
    display: block
  }

  .nav-links {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% + 10px);
    display: none;
    flex-direction: column;
    align-items: stretch;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: rgba(5, 8, 22, .96)
  }

  .nav-links.open {
    display: flex
  }

  .nav-links a {
    text-align: center
  }

  .hero {
    padding-top: 112px
  }

  .hero-grid {
    gap: 20px
  }

  .hero h1,
  .page-hero h1,
  .service-hero h1 {
    font-size: 40px
  }

  .hero p,
  .page-hero p,
  .service-hero p {
    font-size: 16px
  }

  .counter-row,
  .stats-panel,
  .contact-cards,
  .form-grid {
    grid-template-columns: 1fr 1fr
  }

  .hero-visual {
    min-height: 340px
  }

  .orbital-shell {
    inset: 20px
  }

  .core-cube {
    width: 96px;
    height: 96px
  }

  .floating-card {
    display: none
  }

  .service-grid,
  .feature-grid,
  .values-grid,
  .team-grid,
  .pricing-grid,
  .pricing-grid.three,
  .blog-grid,
  .two-panels {
    grid-template-columns: 1fr
  }

  .timeline,
  .timeline.compact {
    grid-template-columns: 1fr
  }

  .cta-inner {
    display: block;
    padding: 26px
  }

  .cta-inner .btn {
    margin-top: 18px
  }

  .footer-grid {
    grid-template-columns: 1fr
  }

  .footer-bottom {
    display: block
  }

  .trusted {
    gap: 10px
  }

  .section {
    padding: 62px 0
  }

  .page-hero,
  .service-hero {
    padding: 132px 0 54px
  }

  .blog-search {
    flex-direction: column
  }

  .contact-cards {
    grid-template-columns: 1fr
  }
}

@media (max-width: 430px) {

  .counter-row,
  .stats-panel {
    grid-template-columns: 1fr
  }

  .hero-actions .btn {
    width: 100%
  }

  .hero-visual {
    min-height: 300px
  }

  .orbital-shell span {
    font-size: 12px;
    padding: 7px
  }

  .section-head h2,
  .cta-inner h2,
  .center-title {
    font-size: 32px
  }
}

@media (max-width: 760px) {
  .brand img {
    width: 240px
  }

  .nav-links {
    background: rgba(247, 252, 255, .98);
    box-shadow: 0 22px 60px rgba(2, 12, 18, .18)
  }

  .nav-item {
    width: 100%
  }

  .has-submenu>a {
    justify-content: center
  }

  .submenu {
    position: static;
    width: 100%;
    margin-top: 6px;
    display: none;
    opacity: 1;
    pointer-events: auto;
    transform: none;
    box-shadow: none;
    background: rgba(19, 185, 200, .07)
  }

  .has-submenu:hover .submenu,
  .has-submenu:focus-within .submenu,
  .has-submenu.open .submenu {
    display: block
  }

  .submenu a {
    text-align: center
  }
}

@media (max-width: 430px) {
  .brand img {
    width: 210px
  }
}