/* ==========================================================================
   Makwana Corporate — Responsive layer
   Desktop defaults first, then targeted step-downs.
   Breakpoints:  1280 · 1180 · 1080 (nav → drawer) · 900 · 768 · 600 · 400
   Tested widths: 1920 1440 1366 1024 768 430 390 360
   ========================================================================== */

/* ---------- Desktop compositions ---------- */
.footer-grid { grid-template-columns: minmax(0, 1.6fr) repeat(3, minmax(0, 1fr)) minmax(0, 1.4fr); }
.footer-cta { grid-template-columns: minmax(0, 1.3fr) auto; }
.cta-band { grid-template-columns: minmax(0, 1.4fr) auto; }
.page-hero__grid--aside { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); }

/* Very large screens: let the hero and wide sections breathe a little more */
@media (min-width: 1680px) {
  :root { --container: 1320px; }
}

/* ---------- ≤1280 ---------- */
@media (max-width: 1280px) {
  .main-nav__link { padding: 0 0.7rem; }
  .main-nav__link[aria-current="page"]::after, .main-nav__link.is-active::after { left: 0.7rem; }
  .site-header__inner { gap: var(--space-5); }
  .header-login { padding: 0 0.7rem; }
}

/* ---------- ≤1180 ---------- */
@media (max-width: 1180px) {
  .footer-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .footer-brand { grid-column: 1 / -1; display: grid; grid-template-columns: auto 1fr; gap: var(--space-4) var(--space-9); align-items: start; }
  .footer-brand p { margin-top: 0; }
  .footer-brand .social { grid-column: 2; margin-top: 0; }
  .grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ---------- ≤1080 : primary nav moves into the drawer ---------- */
@media (max-width: 1080px) {
  :root { --header-h: 76px; --header-h-compact: 66px; }
  .main-nav, .header-login { display: none; }
  .site-header__actions { margin-left: auto; }
  .nav-toggle { display: block; }
  .header-apply .dropdown { right: 0; left: auto; transform: translate(0, 8px); }
  .header-apply .dropdown.is-open { transform: translate(0, 0); }
}

/* ---------- ≤900 ---------- */
@media (max-width: 900px) {
  .grid-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .footer-cta,
  .cta-band,
  .page-hero__grid--aside { grid-template-columns: 1fr; }
  .footer-cta .trace, .cta-band .trace { width: 90%; height: 60%; }

  .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: var(--space-8); }
  .stat:nth-child(odd) { border-left: 0; padding-left: 0; }

  .dropdown--products { width: 560px; }
  .accordion__content > div { padding-right: 0; }
}

/* ---------- ≤768 ---------- */
@media (max-width: 768px) {
  .grid-2, .form-grid { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-8) var(--space-6); padding-block: var(--space-10) var(--space-9); }
  .footer-brand { display: block; }
  .footer-brand p { margin-top: var(--space-5); }
  .footer-brand .social { margin-top: var(--space-6); }
  .footer-contact-col { grid-column: 1 / -1; }
  .footer-cta { margin-top: var(--space-10); }

  .page-hero::before { inset: 0 0 0 20%; }
  .page-hero .trace { width: 80%; height: 55%; }

  .modal { width: 100%; max-width: none; margin: auto 0 0; border-radius: var(--radius-lg) var(--radius-lg) 0 0; }
  .modal[open] { animation-name: mk-sheet-in; }
  @keyframes mk-sheet-in { from { transform: translateY(40px); opacity: 0; } }
}

/* ---------- ≤600 : phones ---------- */
@media (max-width: 600px) {
  :root { --header-h: 68px; --header-h-compact: 62px; }
  .brand img { height: 36px; }
  .site-header.is-scrolled .brand img { height: 34px; }
  .header-apply { display: none; }
  .nav-toggle { width: 44px; height: 44px; }

  .grid-3, .grid-4 { grid-template-columns: 1fr; }

  .btn { min-height: 52px; }
  .footer-cta__actions .btn,
  .cta-band__actions .btn,
  .page-hero__actions .btn { flex: 1 1 100%; }

  .footer-bottom__inner { flex-direction: column; align-items: flex-start; }

  /* Help button collapses to an icon */
  .help-fab { right: var(--space-4); bottom: var(--space-4); }
  .help-fab__btn { width: 54px; padding: 0; justify-content: center; }
  .help-fab__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }
  .help-panel { width: min(320px, calc(100vw - 2rem)); }

  .toast-region { left: var(--space-4); right: var(--space-4); width: auto; bottom: calc(var(--space-4) + 68px); }

  .accordion__trigger { padding: 1.2rem 0; }
  .accordion__icon { width: 30px; height: 30px; }
}

/* ---------- ≤400 : small phones (390 / 360) ---------- */
@media (max-width: 400px) {
  .footer-grid { grid-template-columns: 1fr 1fr; column-gap: var(--space-5); }
  .brand img { height: 33px; }
  .stats { grid-template-columns: 1fr; }
  .stat { border-left: 0; padding-left: 0; }
  .kicker { font-size: var(--fs-xs); }
}

/* ---------- Touch devices: no hover lift ---------- */
@media (hover: none) {
  .btn:hover, .card--interactive:hover, .social a:hover, .help-fab__btn:hover { transform: none; }
}

/* ---------- Print ---------- */
@media print {
  .site-header, .site-footer, .help-fab, .toast-region, .drawer, .drawer-backdrop, .skip-link { display: none !important; }
  body { color: #000; }
  .section { padding-block: 1.5rem; }
  a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 0.8em; }
}
