/* ==============================================
   responsive.css
   Breakpoints: 1440 / 1024 / 768 / 480 / 320
   ============================================== */

@media (min-width: 1440px) {
  :root { --container-px: 48px; }
}

/* === ≤ 1200px === */
@media (max-width: 1200px) {
  .cards-grid--4 { grid-template-columns: repeat(2, 1fr); }
  .footer__inner { grid-template-columns: 220px 1fr 1fr 1fr; gap: 32px; }
}

/* === ≤ 1024px === */
@media (max-width: 1024px) {
  :root { --section-py: 64px; }

  /* Header nav → drawer */
  .header__nav {
    position: fixed;
    top: 80px; left: 0; right: 0;
    background: rgba(8,8,8,.98);
    border-bottom: 1px solid var(--gold-border);
    padding: 16px var(--container-px) 24px;
    transform: translateY(-110%);
    visibility: hidden;
    transition: transform .4s cubic-bezier(.4,0,.2,1), visibility 0s linear .4s;
    z-index: 150;
    max-height: calc(100vh - 80px);
    overflow-y: auto;
  }
  .header__nav.open {
    transform: translateY(0);
    visibility: visible;
    transition: transform .4s cubic-bezier(.4,0,.2,1), visibility 0s linear 0s;
  }
  .nav__list { flex-direction: column; gap: 0; }
  .nav__link { padding: 11px 0; font-size: var(--fs-sm); display: block; border-bottom: 1px solid var(--border); }
  .nav__link::after { bottom: 8px; left: 0; right: 0; }

  .burger { display: flex; }
  .header__right .header__phones { display: none; }

  /* Why us */
  .why-us__inner { grid-template-columns: 1fr; gap: 40px; }
  .why-us__list  { columns: 2; }

  /* Slider */
  .slide { grid-template-columns: 1fr; }
  .slide__img-wrap { height: 300px; }
  .slide__info { padding: 32px; }
  .slide__title { font-size: var(--fs-lg); }

  /* Footer */
  .footer__inner { grid-template-columns: 1fr 1fr; row-gap: 36px; }
}

/* === ≤ 768px === */
@media (max-width: 768px) {
  :root {
    --section-py: 52px;
    --fs-2xl: 28px;
  }

  /* Page hero */
  .page-hero__title { font-size: 32px; letter-spacing: 2px; }

  /* Hero */
  .hero { min-height: 80vh; }
  .hero__title { font-size: 28px; }
  .hero__subtitle { font-size: var(--fs-sm); }
  .hero__actions { flex-direction: column; align-items: flex-start; }
  .hero__actions .btn { width: 100%; justify-content: center; }

  /* Grids */
  .cards-grid--3 { grid-template-columns: 1fr; }
  .cards-grid--4 { grid-template-columns: 1fr; }

  /* Why us */
  .why-us__list { columns: 1; }

  /* Form */
  .form__row { grid-template-columns: 1fr; }
  .form__footer { flex-direction: column; align-items: stretch; }
  .form__consent { text-align: center; }

  /* Footer */
  .footer__inner { grid-template-columns: 1fr; }
  .footer__bottom-inner { flex-direction: column; gap: 8px; text-align: center; }

  /* Section */
  .section__title { font-size: var(--fs-xl); }
}

/* === ≤ 480px === */
@media (max-width: 480px) {
  :root { --container-px: 16px; }

  .header__nav { top: 64px; max-height: calc(100vh - 64px); }

  .header__inner { gap: 8px; }
  .header__right .btn { padding: 10px 14px; font-size: 10px; }

  .page-hero__title { font-size: 24px; letter-spacing: 1px; }
  .hero__title { font-size: 24px; letter-spacing: 1px; }

  .slide__img-wrap { height: 220px; }
  .slide__info { padding: 20px; }
  .slider__btn { width: 36px; height: 36px; }

  .popup__content { padding: 28px 20px; margin: 12px; }
}

/* === ≤ 320px === */
@media (max-width: 320px) {
  .header__right .btn { display: none; }
  .logo-img { height: 36px; }
}