/* ==========================================================================
   Responsive rules — Phase 3 (desktop-first breakpoints)
   1200 laptop · 992 tablet landscape · 768 tablet portrait · 576 mobile
   ========================================================================== */

@media (max-width: 1200px) {
  .grid--4 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 1200px) {
  .site-footer__top { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .site-footer__brand { grid-column: 1 / -1; }
}

@media (max-width: 992px) {
  /* backdrop-filter would make the header the containing block of the fixed mobile menu (menu collapses to header height) */
  .site-header { -webkit-backdrop-filter: none; backdrop-filter: none; background: var(--white); }
  .nav-toggle { display: inline-block; }
  .primary-nav { position: fixed; inset: var(--header-h) 0 0 0; background: var(--white); padding: var(--sp-5) var(--gutter) var(--sp-7); overflow-y: auto; transform: translateX(100%); visibility: hidden; transition: transform var(--t-base) var(--ease), visibility var(--t-base); }
  .primary-nav.is-open { transform: none; visibility: visible; }
  body.nav-open { overflow: hidden; }
  .primary-nav__list { flex-direction: column; align-items: stretch; gap: 0; }
  .primary-nav__list > li > a:not(.btn) { padding: 0.9rem 0.5rem; font-size: var(--fs-base); border-bottom: 1px solid var(--color-border); border-radius: 0; }
  .has-dropdown { flex-wrap: wrap; }
  .has-dropdown > a { flex: 1; }
  .dropdown-toggle { width: 44px; height: 44px; margin: 0; }
  .dropdown { position: static; flex: 0 0 100%; display: none; opacity: 1; visibility: visible; transform: none; box-shadow: none; border: 0; padding: 0 0 var(--sp-2) var(--sp-4); }
  .has-dropdown.is-open > .dropdown { display: block; }
  .has-dropdown:hover > .dropdown:not(:focus-within) { opacity: 1; }
  .primary-nav__cta { margin: var(--sp-5) 0 0; }
  .primary-nav__cta .btn { width: 100%; min-height: 50px; }
}

@media (max-width: 992px) {
  .grid--3, .grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .split { grid-template-columns: 1fr; gap: var(--sp-6); }
  .section-head { margin-bottom: var(--sp-6); }
}

@media (max-width: 768px) {
  :root { --header-h: 64px; }
  .grid--2, .grid--3, .grid--4, .form-grid { grid-template-columns: 1fr; }
  .card { padding: var(--sp-5); }
  .card__media { margin: calc(-1 * var(--sp-5)) calc(-1 * var(--sp-5)) var(--sp-4); }
  .page-hero { padding-block: var(--sp-7); }
}

@media (max-width: 992px) {
  .hero__inner { grid-template-columns: 1fr; }
  .process { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .process__step::after { display: none; }
}

@media (max-width: 576px) {
  .process { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {
  .site-footer__top { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 576px) {
  .site-footer__top { grid-template-columns: 1fr; }
  .site-footer__bottom { flex-direction: column; }
  .btn { white-space: normal; text-align: center; }
  .cluster > .btn { flex: 1 1 100%; }
  .section-head { text-align: left; }
  .section-head .lead { margin-inline: 0; }
}

@media print {
  .skip-link, .btn { display: none !important; }
  body { color: #000; background: #fff; }
}

@media (max-width: 992px) {
  .process--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 768px) {
  .services-head { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 576px) {
  .process--4 { grid-template-columns: 1fr; }
}