/* ============================================================
   GSI Land Services — mobile.css
   All responsive / mobile overrides
   ============================================================ */

@media (max-width: 1024px) {
  .about-grid { gap: 50px; }
  .contact-grid { gap: 50px; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 36px; }
}

@media (max-width: 900px) {
  .services-grid { grid-template-columns: repeat(2, 1fr); }
  .why-grid { grid-template-columns: repeat(2, 1fr); }
  .about-grid { grid-template-columns: 1fr; gap: 60px; }
  .about-accent-box { right: -10px; }
  .contact-grid { grid-template-columns: 1fr; gap: 48px; }
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .stat-item:nth-child(3)::before { display: none; }
  .hero-badge { display: none; }
  .call-cards { grid-template-columns: 1fr; }
  .call-number { font-size: 2rem; }
}

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

  #mainNav {
    position: absolute;
    top: 74px; left: 0; right: 0;
    background: #111111;
    border-top: 2px solid #e87722;
    border-bottom: 2px solid #e87722;
    box-shadow: 0 8px 32px rgba(0,0,0,0.8);
    display: block;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 999;
  }

  #mainNav.open { max-height: 600px; }

  #mainNav ul {
    flex-direction: column;
    gap: 0;
    text-align: left;
    width: 100%;
    padding: 8px 0 16px;
  }

  #mainNav a {
    font-size: 1.05rem;
    padding: 14px 28px;
    display: block;
    color: #e0e0e0;
    border-bottom: 1px solid rgba(255,255,255,0.05);
    border-radius: 0;
    width: 100%;
  }

  #mainNav a:hover,
  #mainNav a.active { color: #e87722; background: rgba(232,119,34,0.06); }

  #mainNav li:last-child a { border-bottom: none; }

  #mainNav .nav-cta {
    margin: 12px 24px 0;
    background: #e87722 !important;
    color: #ffffff !important;
    border-radius: 6px !important;
    border-bottom: none !important;
    text-align: center;
    width: calc(100% - 48px);
    padding: 12px 24px !important;
  }

  .nav-toggle.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .nav-toggle.open span:nth-child(2) { opacity: 0; }
  .nav-toggle.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

  .services-grid { grid-template-columns: 1fr; }
  .services-detail-grid { grid-template-columns: 1fr; }
  .why-grid { grid-template-columns: 1fr; }
  .gallery-grid { grid-template-columns: 1fr; }
  .gi-large, .gi-wide { grid-column: span 1; }
  .footer-grid { grid-template-columns: 1fr; gap: 32px; }
  .footer-bottom .container { flex-direction: column; text-align: center; }

  .project-photo-grid { grid-template-columns: repeat(2, 1fr); }
  .project-photo-grid-4 { grid-template-columns: repeat(2, 1fr); }
  .project-photo-grid-3 { grid-template-columns: repeat(2, 1fr); grid-template-rows: 180px; }
  .project-photo-grid-2 { grid-template-columns: 1fr; grid-template-rows: 220px 220px; }
  .project-photo-main { grid-column: span 2; grid-row: span 1; height: 240px; }
  .project-entry-header { padding: 24px 20px 20px; }

  .service-card-full { grid-template-columns: 1fr; }
  .service-card-full-icon { border-right: none; border-bottom: 1px solid rgba(255,255,255,0.08); padding: 28px; }
  .service-card-full-icon svg { width: 52px; height: 52px; }
  .service-card-full-body { padding: 28px 24px; }
  .service-features { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .hero-actions { flex-direction: column; align-items: center; }
  .cta-banner-actions { flex-direction: column; align-items: center; }
  .sticky-call { bottom: 16px; right: 16px; padding: 12px 18px; font-size: 0.78rem; }
  .gallery-grid-full { grid-template-columns: 1fr; }
  .filter-btn { font-size: 0.72rem; padding: 7px 14px; }
  .project-photo-grid { grid-template-columns: 1fr; }
  .project-photo-grid-3 { grid-template-columns: 1fr; grid-template-rows: auto; }
  .project-photo-main { grid-column: span 1; }
}
