@media (max-width: 1024px) {
  :root { --header-h: 4rem; }

  .grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .header__main { --header-h: 4rem; }

  /* backdrop-filter on an ancestor creates a containing block that traps the
     fixed-position mobile nav drawer inside the header, so it must be removed
     at responsive sizes where .site-nav switches to position: fixed. */
  .header__main {
    background: rgba(255, 255, 255, 0.96);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }

  .nav-toggle { display: inline-flex; }

  /* Keep the toggle button above the open drawer (z-menu) so it stays visible
     and tappable to close the menu. */
  .header__actions {
    position: relative;
    z-index: calc(var(--z-menu) + 1);
  }

  .site-nav {
    position: fixed;
    inset: 0 0 0 auto;
    z-index: var(--z-menu);
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: var(--space-8);
    width: min(22rem, 88vw);
    height: 100%;
    padding: calc(var(--header-h) + var(--space-8)) var(--space-8) var(--space-10);
    background: rgba(255, 255, 255, 0.96);
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);
    box-shadow: var(--shadow-lg);
    overflow-y: auto;
    transform: translateX(100%);
    transition: transform var(--t-slow);
  }

  .site-nav.is-open { transform: translateX(0); }

  .nav__list { flex-direction: column; align-items: stretch; gap: var(--space-1); }

  .nav__link {
    justify-content: space-between;
    width: 100%;
    padding: var(--space-4) var(--space-3);
    font-size: var(--fs-md);
  }

  .nav__link.is-active::after { display: none; }
  .nav__link.is-active { color: var(--color-accent-dark); }

  .has-dropdown .dropdown {
    position: static;
    min-width: 0;
    margin: 0;
    padding: 0 0 0 var(--space-3);
    background: none;
    border: 0;
    box-shadow: none;
    border-radius: 0;
    opacity: 0;
    visibility: visible;
    transform: none;
    max-height: 0;
    overflow: hidden;
    transition: max-height var(--t-base), opacity var(--t-base), padding var(--t-base);
  }

  .has-dropdown.is-open .dropdown {
    max-height: 420px;
    opacity: 1;
    padding-bottom: var(--space-2);
  }

  .has-dropdown:hover .dropdown,
  .has-dropdown:focus-within .dropdown { opacity: 1; visibility: visible; transform: none; }

  .dropdown a { padding: var(--space-3) 0; border-radius: var(--radius-md); color: var(--text-secondary); }
  .dropdown a:hover { background: var(--slate-50); color: var(--color-primary); transform: none; }
  .dropdown__icon { display: none; }
  .dropdown__text small { font-size: 0.8125rem; }

  .nav__cta--mobile {
    display: inline-flex;
    justify-content: center;
    width: 100%;
    margin-top: var(--space-6);
  }

  .header__actions { gap: var(--space-2); }
  .header__actions .nav__cta { display: none; }
  .header__phone { padding: var(--space-2); background: none; border-color: transparent; }
  .header__phone svg { width: 1.4rem; height: 1.4rem; }
  .header__phone-text { display: none; }

  .u-hide-mobile { display: none; }

  .footer__grid { grid-template-columns: 1fr 1fr; }
}

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

  .split { grid-template-columns: minmax(0, 1fr); }

  .section-header { margin-bottom: var(--space-8); }

  .stat__value { font-size: clamp(2rem, 10vw, 2.5rem); }

  .footer__grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-8); }
  .footer__bottom { flex-direction: column; text-align: center; }
  .footer__cta-inner { flex-direction: column; align-items: flex-start; padding-block: var(--space-12); }
  .footer__cta-inner .btn { width: 100%; }
}

@media (max-width: 1024px) {
  .hero { min-height: 38rem; }
  .turnkey__steps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .turnkey__step::after { display: none; }
  .projects__grid { gap: var(--space-6); }
}

@media (max-width: 1100px) {
  .hero-slider__arrow { display: none; }
}

@media (min-width: 1101px) and (max-width: 1400px) {
  .hero-slider__content { padding-left: 3.5rem; }
}

@media (max-width: 768px) {
  .hero { min-height: 32rem; }
  .hero-slider__inner { padding-block: var(--space-16); }
  .hero-slider__scroll { display: none; }
  .hero-slider__bottom { gap: var(--space-4); }
  .about__card { left: var(--space-4); right: var(--space-4); bottom: -1rem; }
  .turnkey__steps { grid-template-columns: minmax(0, 1fr); }
  .clients-slider__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .quality__list { grid-template-columns: minmax(0, 1fr); }
  .why__body { grid-template-columns: minmax(0, 1fr); gap: var(--space-12); }
  .why__image { min-height: 18rem; }
  .why__card { left: var(--space-4); right: var(--space-4); bottom: -1rem; }
  .section-header--split { flex-direction: column; align-items: flex-start; }
  .section-header--split .btn { width: 100%; }
}

@media (max-width: 480px) {
  .hero { min-height: 0; }
  .clients-slider__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .quality__image { min-height: 18rem; }
  .btn--lg { width: 100%; }
}

@media (max-width: 1100px) {
  .nav__list { gap: var(--space-2); }
  .nav__link { padding: var(--space-3) var(--space-2); }
}

@media (max-width: 768px) {
  .check-list--inline { grid-template-columns: minmax(0, 1fr); }
  .timeline { padding-left: 2.75rem; }
  .timeline::before { left: 0.875rem; }
  .timeline__node { left: 0.875rem; width: 1.75rem; height: 1.75rem; font-size: var(--fs-xs); }
  .page-hero__title { font-size: clamp(1.9rem, 7vw, 2.5rem); }
}

@media (max-width: 480px) {
  .timeline__card { padding: var(--space-5) var(--space-6); }
}

@media (max-width: 1024px) {
  .header__main { --header-h: 4rem; }
  .header__main-inner { gap: var(--space-4); }
  .site-header .site-logo__img { height: 2.5rem; }
}

@media (max-width: 480px) {
  .site-header .site-logo__img { height: 2.25rem; }
}