/* ============================================================
   SkySoar Technologies — Responsive Styles
   Breakpoints aligned to common devices + production QA targets
   ============================================================ */

/* Tablet and below */
@media (max-width: 960px) {
  .about-inner {
    grid-template-columns: 1fr;
  }

  .about-visual {
    height: 360px;
  }

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

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

  nav .nav-links {
    display: none;
  }

  .hamburger {
    display: flex;
  }

  .timeline-item,
  .timeline-item:nth-child(even) {
    flex-direction: column;
    gap: 16px;
  }

  .timeline-line {
    display: none;
  }

  .timeline-dot {
    width: 40px;
    height: 40px;
  }

  .timeline-spacer {
    display: none;
  }

  .tech-orbit {
    width: 320px;
    height: 320px;
  }

  .orbit-ring-1 {
    width: 160px;
    height: 160px;
  }

  .orbit-ring-2 {
    width: 270px;
    height: 270px;
  }

  .orbit-ring-3 {
    width: 310px;
    height: 310px;
  }
}

/* Mobile */
@media (max-width: 600px) {
  section {
    padding: 70px 5%;
  }

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

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

  .footer-bottom {
    flex-direction: column;
    text-align: center;
  }

  .hero-stats {
    flex-direction: column;
    align-items: center;
  }

  .testimonial-card {
    padding: 32px 20px;
  }

  .contact-form-wrap {
    padding: 24px;
  }

  .about-float-card {
    display: none;
  }

  .tech-orbit {
    width: 280px;
    height: 280px;
  }

  .products {
    padding: 70px 5%;
  }

  .products h2 {
    font-size: 1.75rem;
  }

  .product-card {
    padding: 28px 20px;
  }

  .hero-btns {
    flex-direction: column;
    align-items: center;
  }

  .btn-primary,
  .btn-secondary {
    width: 100%;
    max-width: 280px;
    justify-content: center;
  }

  .whatsapp-btn {
    bottom: 20px;
    right: 20px;
    width: 50px;
    height: 50px;
  }

  .scroll-top {
    bottom: 80px;
    right: 20px;
    width: 40px;
    height: 40px;
  }
}

/* Small phones */
@media (max-width: 380px) {
  .hero-title {
    letter-spacing: -1px;
  }

  .section-title {
    font-size: clamp(28px, 8vw, 40px);
  }

  .nav-logo-text {
    font-size: 16px;
  }

  .nav-logo-video {
    width: 40px;
    height: 40px;
  }
}

/* Large desktop refinements */
@media (min-width: 1440px) {
  nav,
  section,
  footer {
    padding-left: max(5%, calc((100% - 1400px) / 2));
    padding-right: max(5%, calc((100% - 1400px) / 2));
  }
}

/* Reduce motion preference */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }

  .reveal {
    opacity: 1;
    transform: none;
  }
}

/* Summary button positioning on mobile */
@media (max-width: 600px) {
  .summary-btn {
    bottom: 20px;
    left: 20px;
    width: 44px;
    height: 44px;
  }
}