/* ════════════════════════════════════════
   RESPONSIVE — Mobile-first media queries
   Breakpoints: 1200px | 992px | 768px | 480px
═══════════════════════════════════════ */

/* ── Large Desktop (≤1200px) ── */
@media (max-width: 1200px) {
  .edge-grid { grid-template-columns: repeat(2, 1fr); }
  .intel-grid { grid-template-columns: repeat(2, 1fr); }
  .matrix-grid, .resource-grid, .faq-grid { grid-template-columns: repeat(2, 1fr); }
  .placement-directory-grid { grid-template-columns: repeat(2, 1fr); }
  .search-results { grid-template-columns: repeat(2, 1fr); }
  .why-grid { grid-template-columns: repeat(3, 1fr); }
  .courses-grid { grid-template-columns: repeat(2, 1fr); }
  .blog-grid { grid-template-columns: repeat(2, 1fr); }
  .accelerator-grid { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: 1.5fr 1fr 1fr; }
  .footer-grid .footer-col:nth-child(4) { grid-column: span 3; }
}

/* ── Tablet (≤992px) ── */
@media (max-width: 992px) {
  .section { padding: 4rem 0; }
  .page-hero { padding: calc(var(--nav-height) + 3.5rem) 0 3.25rem; }
  .hero-inner { grid-template-columns: 1fr; }
  .hero {
    background-size: cover, cover;
    background-position: center, 88% 50%;
  }
  .hero-proof-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hero p { font-size: 1rem; max-width: 100%; }
  .blog-feature { grid-template-columns: 1fr; }
  .contact-quick-grid { grid-template-columns: 1fr 1fr; }
  .placement-directory-controls { grid-template-columns: 1fr 1fr; }
  .stats-grid { grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }
  .stat-item::after { display: none; }
  .why-grid { grid-template-columns: repeat(2, 1fr); }
  .blog-grid { grid-template-columns: repeat(2, 1fr); }
  .trainers-grid { grid-template-columns: repeat(2, 1fr); }
  .placement-stats { grid-template-columns: repeat(2, 1fr); }
  .story-grid { grid-template-columns: repeat(2, 1fr); }
  .about-grid { grid-template-columns: 1fr; gap: 2rem; }
  .contact-grid { grid-template-columns: 1fr; }
  .course-detail-grid { grid-template-columns: 1fr; }
  .enroll-card { position: static; }
  .course-detail-main { padding: 1.25rem; }
  .demo-band { flex-direction: column; gap: 2rem; }
  .grid-2 { grid-template-columns: 1fr; }
  .grid-3 { grid-template-columns: repeat(2, 1fr); }
  .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .footer-grid .footer-col:nth-child(1) { grid-column: span 2; }
}

/* ── Mobile (≤768px) ── */
@media (max-width: 768px) {
  .container { padding: 0 0.95rem; }

  /* Nav */
  .nav-logo::before { width: 272px; height: 64px; }
  .hamburger { display: flex; }
  .nav-links {
    display: none;
    position: absolute; top: var(--nav-height); left: 0; right: 0;
    background: rgba(5, 10, 24, 0.98);
    flex-direction: column; align-items: flex-start;
    padding: 1.5rem 1.1rem 1.25rem; gap: 1rem;
    border-bottom: 1px solid var(--accent-border);
    box-shadow: 0 20px 36px rgba(0,0,0,0.34);
  }
  .nav-links.open { display: flex; }
  .nav-links a { font-size: 1rem; padding: 0.58rem 0; min-height: 44px; width: 100%; display: flex; align-items: center; }
  .nav-dropdown { width: 100%; display: block; }
  .nav-dropdown-toggle { width: 100%; justify-content: space-between; }
  .nav-dropdown-menu {
    position: static;
    min-width: 0;
    margin-top: 0.35rem;
    border: 1px solid var(--accent-border);
    box-shadow: none;
    opacity: 1;
    visibility: visible;
    transform: none;
    padding: 0.45rem;
    background: rgba(8, 15, 32, 0.95);
    border-radius: 12px;
    display: grid;
    gap: 0.25rem;
  }
  .nav-dropdown-menu a {
    width: 100%;
    min-height: 42px;
    font-size: 0.9rem;
    padding: 0.58rem 0.7rem;
  }
  .nav-dropdown-menu a.active,
  .nav-dropdown-menu a:hover {
    background: rgba(47,111,223,0.1);
  }
  .btn { min-height: 44px; }
  .nav-cta { width: 100%; }
  .nav-links a.nav-cta {
    margin-top: 0.35rem;
    justify-content: center;
    padding: 0.72rem 1rem;
  }
  .nav-cta .btn { width: 100%; justify-content: center; }
  .btn-primary { box-shadow: 0 8px 18px rgba(47,140,255,0.24); }

  /* Hero */
  .hero-stats { gap: 1.5rem; }
  body[data-hero-source="api"] .hero-actions { flex-direction: column; }
  body[data-hero-source="api"] .hero-actions .btn { width: 100%; justify-content: center; }
  body[data-hero-source="api"] .hero-content { max-width: 100%; }
  body[data-hero-source="api"] .hero-inner { grid-template-columns: 1fr; }
  body[data-hero-source="api"] .hero-bg {
    background-position: 86% 50%;
  }
  .hero-proof-grid { grid-template-columns: 1fr; gap: 0.72rem; }
  .hero-proof-card { padding: 0.9rem 0.88rem; }
  .hero-proof-icon { width: 48px; height: 48px; font-size: 1.12rem; }
  .hero p { font-size: 0.98rem; line-height: 1.58; }
  .hero-trust-row span { font-size: 0.78rem; }

  /* Sections */
  .section { padding: 3.15rem 0; }
  .page-hero { padding: calc(var(--nav-height) + 2.8rem) 0 2.8rem; }
  .courses-grid { grid-template-columns: 1fr; }
  .edge-grid { grid-template-columns: 1fr; }
  .intel-grid { grid-template-columns: 1fr; }
  .matrix-grid, .resource-grid, .faq-grid { grid-template-columns: 1fr; }
  .placement-directory-grid { grid-template-columns: 1fr; }
  .search-results { grid-template-columns: 1fr; }
  .site-search-form { grid-template-columns: 1fr; }
  .blog-grid { grid-template-columns: 1fr; }
  .story-grid { grid-template-columns: 1fr; }
  .accelerator-grid { grid-template-columns: 1fr; }
  .trainers-grid { grid-template-columns: 1fr; }
  .placement-stats { grid-template-columns: repeat(2, 1fr); }
  .why-grid { grid-template-columns: 1fr 1fr; }
  .form-row { grid-template-columns: 1fr; }
  .program-proof-band { grid-template-columns: repeat(2, 1fr); }
  .program-spotlight-grid { grid-template-columns: 1fr; }

  /* Batch table */
  .batch-table th:nth-child(4),
  .batch-table td:nth-child(4) { display: none; }

  /* Footer */
  .footer-grid { grid-template-columns: 1fr; }
  .footer-grid .footer-col:nth-child(1) { grid-column: unset; }
  .footer-bottom { flex-direction: column; text-align: center; }

  /* Demo band */
  .demo-form { flex-direction: column; }
  .demo-form input, .demo-form select { min-width: 0; width: 100%; }
  .demo-form input,
  .demo-form select,
  .form-control,
  .site-search-input {
    font-size: 16px;
  }

  .contact-form-card { padding: 1.4rem; }
  .course-card,
  .story-card,
  .trainer-card,
  .blog-card-body { padding: 1.25rem; }
  .enroll-card { padding: 1.4rem; }
  .page-status-banner { font-size: 0.84rem; padding: 0.6rem 0.8rem; }
  .placement-directory-controls { grid-template-columns: 1fr; }
  .contact-quick-grid { grid-template-columns: 1fr; }
  .blog-post-content h2 { font-size: 1.12rem; }
  .blog-post-content p { font-size: 0.94rem; }
  .demo-band { padding: 2rem 1.3rem; }
  .mobile-sticky-cta,
  .mobile-sticky-cta-spacer { display: block; }

  .get-in-touch-shell {
    right: 0.85rem;
    bottom: calc(82px + env(safe-area-inset-bottom));
  }

  .get-in-touch-fab {
    font-size: 0.82rem;
    padding: 0.62rem 0.88rem;
  }

  .get-in-touch-panel {
    min-width: 214px;
  }
}

/* ── Small Mobile (≤480px) ── */
@media (max-width: 480px) {
  .container { padding: 0 0.85rem; }
  .nav-logo::before { width: 244px; height: 58px; }
  .stats-grid { grid-template-columns: 1fr 1fr; padding: 0.9rem 0.6rem; gap: 0.8rem; }
  .stat-item strong { font-size: 1.65rem; }
  .stat-item span { font-size: 0.82rem; }
  .why-grid { grid-template-columns: 1fr; }
  .placement-stats { grid-template-columns: 1fr; }
  .program-proof-band { grid-template-columns: 1fr; }
  .cert-row { flex-direction: column; align-items: center; }
  .demo-band { padding: 1.7rem 1.1rem; }
  .grid-3, .grid-4 { grid-template-columns: 1fr; }
  body[data-hero-source="api"] .hero h1 { font-size: 1.72rem; }
  body[data-hero-source="api"] .hero p { font-size: 0.95rem; }
  body[data-hero-source="api"] .hero-bg { background-position: 82% 50%; }
  body[data-hero-source="api"] .hero-proof-card { transform: none; }
  .mobile-sticky-cta .mobile-sticky-inner { grid-template-columns: 1fr; }
  .batch-table { font-size: 0.8rem; }
  .batch-table th, .batch-table td { padding: 0.5rem 0.6rem; }
  .footer-grid { gap: 1.5rem; }
}

@media (max-width: 360px) {
  .nav-logo::before { width: 220px; height: 52px; }
  .hero h1 { font-size: 1.58rem; }
}