/* Responsive */

@media (max-width: 1100px) {
  .demo-stage,
  .services-list,
  .about-grid,
  .robot-grid,
  .quotes-grid,
  .faq-grid,
  .contact-grid,
  .price-card,
  .footer-grid {
    grid-template-columns: 1fr;
  }

  .service-item:nth-child(odd) {
    border-right: none;
  }

  .demo-picks {
    grid-template-columns: repeat(3, 1fr);
  }

  .events-mosaic {
    grid-template-columns: repeat(6, 1fr);
    grid-auto-rows: 180px;
  }

  .event-tile,
  .event-tile:nth-child(1),
  .event-tile:nth-child(2) {
    grid-column: span 3;
    grid-row: span 1;
  }

  .event-tile:nth-child(1) {
    grid-column: span 6;
    grid-row: span 2;
  }

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

  .faq-aside {
    position: static;
  }

  .about-visual::after {
    width: 48%;
    height: 40%;
  }
}

@media (max-width: 860px) {
  .nav-toggle {
    display: flex;
  }

  .nav-menu {
    position: fixed;
    inset: 0 0 0 auto;
    width: min(300px, 86vw);
    height: 100vh;
    background: rgba(6, 20, 40, 0.97);
    backdrop-filter: blur(12px);
    flex-direction: column;
    align-items: flex-start;
    padding: 6rem 1.75rem 2rem;
    gap: 0.25rem;
    transform: translateX(105%);
    transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
    border-left: 1px solid rgba(43, 224, 247, 0.15);
  }

  .nav-menu.open {
    transform: translateX(0);
  }

  .nav-menu .nav-cta {
    margin-left: 0;
    margin-top: 1rem;
  }

  .hero-content {
    padding: 7rem 0 4.5rem;
  }

  .hero-scroll {
    display: none;
  }

  .video-stack {
    flex-direction: column;
  }

  .demo-picks {
    grid-template-columns: 1fr 1fr;
  }

  .demo-footer {
    flex-direction: column;
    align-items: flex-start;
  }

  .events-mosaic {
    grid-template-columns: 1fr;
    grid-auto-rows: 220px;
  }

  .event-tile,
  .event-tile:nth-child(1),
  .event-tile:nth-child(2) {
    grid-column: span 1;
    grid-row: span 1;
  }

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

  .contact-form {
    grid-template-columns: 1fr;
  }

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

  .quotes-visual {
    order: -1;
    max-width: 360px;
  }

  .about-visual::after {
    display: none;
  }

  .about-visual img {
    aspect-ratio: 16/11;
  }
}

@media (max-width: 520px) {
  .container,
  .hero-content {
    width: calc(100% - 1.5rem);
  }

  .btn {
    width: 100%;
    justify-content: center;
  }

  .hero-actions {
    flex-direction: column;
  }

  .robot-stat {
    left: 0.5rem;
    bottom: 0.5rem;
    padding: 0.85rem 1rem;
  }

  .demo-picks {
    grid-template-columns: 1fr;
  }
}