/* ==========================================================================
   EAGLE EYE LOGICRAFT PRIVATE LIMITED
   Responsive Breakpoints Stylesheet - Enterprise Edition
   Fluid typography, flex wrapping, touch target sizing, stack rules
   ========================================================================== */

/* --- 1440px and Up (Large Displays) --- */
@media (min-width: 1440px) {
  :root {
    --container-width: 1400px;
  }
}

/* --- 1280px and Down (Standard Desktop) --- */
@media (max-width: 1280px) {
  :root {
    --container-width: 1180px;
  }

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

  .footer-top-grid {
    grid-template-columns: 1.2fr 1fr 1fr 1.2fr;
    gap: 36px;
  }

  .mega-menu-executive {
    width: 710px;
  }

  .mega-menu-body {
    grid-template-columns: 1fr 220px;
    gap: 12px;
  }
}

/* --- 1024px and Down (Tablet Landscape) --- */
@media (max-width: 1024px) {
  :root {
    --header-height: 76px;
  }

  /* Navigation adjustments */
  .nav-desktop {
    display: none;
  }

  .nav-toggle {
    display: flex;
  }

  .header-actions .btn,
  .header-desk-call {
    display: none;
  }

  /* Split layout stacking */
  .header-top-bar {
    display: none;
  }

  .hero-split-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .hero-left-column {
    max-width: 100%;
  }

  .hero-command-dock {
    grid-template-columns: repeat(2, 1fr);
  }

  .intro-split-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .industrial-image-frame img {
    height: 400px;
  }

  /* Capabilities grid 2 columns */
  .capabilities-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Timeline grid 2x2 */
  .timeline-line {
    display: none;
  }

  .timeline-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 28px;
  }

  /* Industries 2 cols */
  .industries-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Modes grid 2 cols */
  .modes-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Why grid 2 cols */
  .why-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Quote CTA Split card */
  .quote-split-card {
    grid-template-columns: 1fr;
  }

  .quote-left-info {
    padding: 40px 32px;
  }

  .quote-form-wrapper {
    padding: 36px 32px;
  }

  /* Services catalog */
  .services-catalog-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Solutions row cards */
  .solution-row-card {
    grid-template-columns: 1fr;
  }

  .solution-media {
    height: 240px;
  }

  .map-telemetry-grid {
    grid-template-columns: repeat(2, 1fr);
  }

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

  .blueprint-viewport {
    border-right: none;
    border-bottom: 1px solid rgba(56, 189, 248, 0.2);
  }

  /* Contact split grid */
  .contact-split-grid {
    grid-template-columns: 1fr;
  }

  /* Footer grid */
  .footer-top-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 40px;
  }
}

/* --- 768px and Down (Tablet Portrait & Large Mobile) --- */
@media (max-width: 768px) {
  :root {
    --header-height: 70px;
  }

  .container {
    padding-left: 20px;
    padding-right: 20px;
  }

  .hero-cta-group {
    flex-direction: column;
    width: 100%;
  }

  .hero-cta-group .btn {
    width: 100%;
  }

  .hero-specs-strip {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }

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

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

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

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

  .industry-card {
    height: 350px;
  }

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

  .modal-diagram-flex {
    flex-direction: column;
    align-items: flex-start;
  }

  .diagram-arrow {
    display: none;
  }

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

  .multi-step-indicator {
    overflow-x: auto;
    padding-bottom: 8px;
    gap: 16px;
  }

  .step-tab-label {
    font-size: 0.75rem;
  }

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

  .cbm-calculator-strip {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
  }

  .tracking-input-group {
    flex-direction: column;
  }

  .tracking-wrapper {
    padding: 28px 20px;
  }

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

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

  .solution-details {
    padding: 28px 20px;
  }

  .about-pillars-grid {
    grid-template-columns: 1fr;
  }

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

  .footer-bottom {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }
}

/* --- 480px and Down (Standard Mobile) --- */
@media (max-width: 480px) {
  :root {
    --header-height: 64px;
  }

  .mobile-nav-drawer {
    max-width: 100%;
    padding: 20px 18px 32px;
  }

  .hero-specs-strip,
  .hero-command-dock {
    grid-template-columns: 1fr;
  }

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

  .hero-disciplines {
    gap: 6px;
  }

  .tech-hud-badge {
    font-size: 0.7rem;
    padding: 4px 10px;
  }

  .btn {
    padding: 14px 22px;
    font-size: 0.875rem;
  }

  .quote-form-wrapper {
    padding: 24px 16px;
  }

  .quote-left-info {
    padding: 28px 20px;
  }

  .contact-info-panel {
    padding: 28px 20px;
  }

  .map-viewport-wrapper {
    padding: 10px;
  }

  .map-telemetry-grid {
    grid-template-columns: 1fr;
  }

  .map-legend-bar {
    gap: 14px;
    font-size: 0.7rem;
  }

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

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

  .faq-answer-inner {
    padding: 0 18px 18px 18px;
  }
}

/* --- 375px and Down (Small Mobile) --- */
@media (max-width: 375px) {
  .header-logo img {
    height: 34px;
  }

  .form-actions {
    flex-direction: column;
    gap: 12px;
  }

  .form-actions .btn {
    width: 100%;
  }

  .quick-cargo-chips {
    gap: 6px;
  }

  .cargo-chip {
    font-size: 0.7rem;
    padding: 5px 8px;
  }
}

/* --- Responsive Rules for Spedition India Pictorial Components --- */
@media (max-width: 1024px) {
  .floating-hero-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .pictorial-cards-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .spedition-services-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .spec-photo-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .gallery-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .cert-badges-strip {
    grid-template-columns: repeat(3, 1fr);
  }
  .pictorial-quote-split {
    grid-template-columns: 1fr;
  }
  .quote-photo-column {
    min-height: 280px;
    padding: 28px;
  }
}

@media (max-width: 768px) {
  .hero-visual-banner {
    min-height: 580px;
    padding: 120px 0 80px 0;
    background-position: center 18%;
  }
  .floating-hero-cards-wrap {
    margin-top: -30px;
  }
  .floating-hero-grid {
    grid-template-columns: 1fr;
  }
  .pictorial-cards-grid {
    grid-template-columns: 1fr;
  }
  .spedition-services-grid {
    grid-template-columns: 1fr;
  }
  .spec-photo-grid {
    grid-template-columns: 1fr;
  }
  .gallery-grid {
    grid-template-columns: 1fr;
  }
  .cert-badges-strip {
    grid-template-columns: repeat(2, 1fr);
  }
  .gallery-filter-tabs {
    gap: 8px;
  }
  .gallery-filter-btn {
    padding: 7px 16px;
    font-size: 0.8rem;
  }
}

