/* ============================================================
   INS - Responsive Stylesheet (grounded corporate)
   Breakpoints: 1200 / 1024 / 768 / 600 / 400
   Solid header -> drawer on mobile. No horizontal scroll.
   ============================================================ */

/* ---------- 1200px ---------- */
@media (max-width: 1200px) {
  .vendor-grid { grid-template-columns: repeat(4, 1fr); }
  .footer-top { grid-template-columns: 1.4fr 1fr 1fr 1.3fr; }
  .footer-col--products { display: none; }
  .nav-link { padding: 0.5rem 0.6rem; font-size: 0.9rem; }
}

/* ---------- 1100px : laptop / tablet landscape ---------- */
/* Drawer engages here (before the 7-item nav gets cramped) to prevent overlap */
@media (max-width: 1100px) {
  :root { --header-h: 68px; }

  /* Collapse nav into hamburger drawer */
  .nav-menu, .nav-login, .btn--signup { display: none; }
  .nav-toggle { display: flex; }

  .nav-menu {
    position: fixed;
    inset: var(--header-h) 0 0 auto;
    width: min(340px, 86vw);
    height: calc(100dvh - var(--header-h));
    background: #fff; flex-direction: column; align-items: stretch; gap: 0;
    margin-inline: 0; padding: 1.1rem;
    overflow-y: auto;
    border-left: 1px solid var(--color-border);
    box-shadow: var(--shadow-lg);
    transform: translateX(100%);
    transition: transform var(--dur) var(--ease);
    z-index: 1002;
  }
  .nav-menu.open { display: flex; transform: translateX(0); }
  .nav-link { padding: .85rem .7rem; font-size: 1rem; border-radius: var(--radius-sm); justify-content: space-between; }
  .nav-item { border-bottom: 1px solid var(--color-border); }
  .nav-item:last-child { border-bottom: none; }
  .nav-item.active > .nav-link::after { display: none; }
  .nav-item.active > .nav-link { background: var(--color-light-gray); }

  /* Mega menu -> inline accordion */
  .mega {
    position: static; width: auto; transform: none; box-shadow: none; border: none;
    padding: 0 0 .7rem; opacity: 1; visibility: visible; pointer-events: auto;
    max-height: 0; overflow: hidden; transition: max-height var(--dur) var(--ease);
  }
  .nav-item.has-mega .mega { display: block; }
  .nav-item.mega-open .mega { max-height: 1200px; }
  .mega-grid { grid-template-columns: 1fr; gap: 0.9rem; }
  .mega-links { grid-template-columns: 1fr; }
  .mega-promo { display: none; }
  .nav-item.has-mega:hover .mega { transform: none; }
  .nav-item.mega-open .caret { transform: rotate(180deg); }

  .nav-drawer-cta { display: grid; gap: .6rem; margin-top: 1.1rem; }

  /* Layout collapses */
  .hero__grid { grid-template-columns: 1fr; gap: 2.2rem; }
  .hero::before { display: none; }              /* drop the side tint when stacked */
  .hero__visual { max-width: 560px; }
  .hero__float--1 { left: 1rem; }
  .split { grid-template-columns: 1fr; gap: 2.2rem; }
  .split .media-img, .split.reverse > *:first-child { order: -1; }

  .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .stats-grid { grid-template-columns: repeat(2, 1fr); gap: 2rem 1rem; }
  .stat + .stat { border-left: none; }
  .vendor-grid { grid-template-columns: repeat(3, 1fr); }
  .cert-grid { grid-template-columns: repeat(2, 1fr); }
  .industry-grid { grid-template-columns: repeat(2, 1fr); }

  .footer-top { grid-template-columns: 1fr 1fr; gap: 2rem; }
  .footer-brand, .footer-newsletter { grid-column: 1 / -1; }
  .footer-col--products { display: block; }
}

/* ---------- 768px : tablet ---------- */
@media (max-width: 768px) {
  .grid-3 { grid-template-columns: 1fr 1fr; }
  .mega-nav-only { display: none; }

  .hero__stats { gap: 1.4rem; }
  .cta-banner .btn-group { flex-direction: column; align-items: stretch; }
  .cta-banner .btn { width: 100%; }

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

/* ---------- 600px : large mobile ---------- */
@media (max-width: 600px) {
  :root { --section-y: 3.2rem; }

  .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; }
  .form-row { grid-template-columns: 1fr; }
  .stats-grid { grid-template-columns: 1fr 1fr; }
  .vendor-grid { grid-template-columns: repeat(2, 1fr); }
  .cert-grid, .industry-grid { grid-template-columns: 1fr; }

  .footer-top { grid-template-columns: 1fr; }
  .footer-about { max-width: none; }

  .newsletter { flex-direction: column; }
  .newsletter .btn { width: 100%; }

  .hero__float { display: none; }

  .btn-group { flex-direction: column; align-items: stretch; }
  .hero .btn-group .btn, .cta-banner .btn-group .btn { width: 100%; justify-content: center; }

  .tabs { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .filter-bar { overflow-x: auto; padding-bottom: .4rem; }
}

/* ---------- 400px : small mobile ---------- */
@media (max-width: 400px) {
  .logo__text { font-size: 1.1rem; }
  .stats-grid { grid-template-columns: 1fr; }
  .chat-panel { right: .75rem; left: .75rem; width: auto; }
}
