/* ==================================================================
   Responsive rules — mobile-first overrides at breakpoints
   Breakpoints: 1200 / 992 / 768 / 560
   ================================================================== */

/* Ultra-wide */
@media (min-width: 1600px) {
  :root { --container: 1360px; }
}

/* Laptop / small desktop */
@media (max-width: 1200px) {
  .solution-grid { grid-template-columns: repeat(3, 1fr); }
  .footer-grid { grid-template-columns: 1.4fr 1fr 1.4fr; }
  .footer-grid .footer-col-hide { display: none; }
}

/* Tablet landscape */
@media (max-width: 992px) {
  .nav-menu, .navbar__actions .btn-hide-mobile { display: none; }
  .nav-toggle { display: inline-flex; }
  .solution-grid { grid-template-columns: repeat(2, 1fr); }
  .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .grid-3 { grid-template-columns: repeat(2, 1fr); }
  .brand-strip { grid-template-columns: repeat(3, 1fr); }
  .product-layout { grid-template-columns: 1fr; }
  .filter-panel { position: static; }
  .product-hero { grid-template-columns: 1fr; }
  .stats { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: 1fr 1fr; }
}

/* Tablet portrait / large phone */
@media (max-width: 768px) {
  :root { --header-h: 68px; }
  .topbar__contact span.hide-sm { display: none; }
  .solution-grid { grid-template-columns: 1fr; }
  .grid-2, .grid-3, .grid-4, .grid-6 { grid-template-columns: 1fr; }
  .form-row { grid-template-columns: 1fr; }
  .brand-strip { grid-template-columns: repeat(3, 1fr); }
  .hero p { font-size: var(--fs-base); }
  .footer-bottom { flex-direction: column; }
}

/* Small phone */
@media (max-width: 768px) {
  /* iOS Safari zooms the page whenever a focused field is under 16px. Bump
     every control to 16px on phones so tapping a field never rescales the
     layout (the 13px desktop size is unaffected). */
  .form-control,
  input[type=text], input[type=email], input[type=tel], input[type=password],
  input[type=number], input[type=date], input[type=search], input[type=url],
  select, textarea {
    font-size: 16px;
  }

  /* Footer links are only ~16px tall on desktop — well under the ~44px touch
     minimum. Give every footer link a comfortable tap area on phones. */
  .footer-col ul a,
  .site-footer .footer-col li > a,
  .footer-bottom__legal a {
    display: inline-block;
    padding-block: 0.5rem;
    min-height: 40px;
    line-height: 1.6;
  }
  /* Keep the legal row readable once its links grow. */
  .footer-bottom__legal { row-gap: 0; }
}

@media (max-width: 560px) {
  .container { padding-inline: var(--sp-4); }
  .brand-strip { grid-template-columns: repeat(2, 1fr); }
  .stats { grid-template-columns: 1fr 1fr; gap: var(--sp-4); }
  .hero-actions { flex-direction: column; align-items: stretch; }
  .hero-actions .btn { width: 100%; }
  .topbar { display: none; }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
}

/* Print (invoices, articles) */
@media print {
  .topbar, .site-header, .site-footer, .support, .nav-toggle, .breadcrumbs { display: none !important; }
  body { color: #000; }
  .container { max-width: 100%; }
}

/* Utility: skip link */
.skip-link { position: absolute; left: -999px; top: 0; background: var(--navy-800); color: #fff; padding: var(--sp-3) var(--sp-4); z-index: 999; border-radius: 0 0 var(--radius-sm) 0; }
.skip-link:focus { left: 0; color: #fff; }

/* Screen-reader only */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }