/* ============================================================
   МЕДІСФЕРА — Responsive
   ============================================================ */

/* ── 1280px ───────────────────────────────────────────────── */
@media (max-width: 1280px) {
  :root { --container: 1060px; }
  .hero__title { font-size: 2.75rem; }
}

/* ── 1024px (tablet) ──────────────────────────────────────── */
@media (max-width: 1024px) {
  :root { --container: 100%; }

  .section { padding: 64px 0; }

  /* Hero */
  .hero { padding: 72px 0 64px; min-height: auto; }
  .hero__inner { grid-template-columns: 1fr; gap: 48px; }
  .hero__sub { max-width: 100%; }
  .hero__stats-grid { grid-template-columns: repeat(4, 1fr); }
  .hero__blob { display: none; }

  /* Services / Adv */
  .services__grid { grid-template-columns: repeat(2, 1fr); }
  .advantages__grid { grid-template-columns: repeat(2, 1fr); }

  /* About */
  .about__inner { grid-template-columns: 1fr; gap: 40px; }
  .about__img-wrap { max-width: 480px; }

  /* Stats */
  .stats__grid { grid-template-columns: repeat(2, 1fr); gap: 32px; }
  .stat-sep { display: none; }

  /* Steps */
  .steps__grid { grid-template-columns: repeat(3, 1fr); }
  .steps__grid::before { display: none; }

  /* Gallery */
  .gallery__grid { grid-template-columns: repeat(2, 1fr); }

  /* Reviews */
  .reviews__grid { grid-template-columns: 1fr; }

  /* Articles */
  .articles__grid { grid-template-columns: repeat(2, 1fr); }

  /* Footer */
  .footer__top { grid-template-columns: 1fr 1fr; gap: 32px; }
}

/* ── 768px (mobile) ───────────────────────────────────────── */
@media (max-width: 768px) {
  /* Header — disable backdrop-filter so position:fixed children
     use the viewport as containing block (fixes Safari/iOS) */
  .header {
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    background: var(--white);
  }

  /* Lang banner — move above FAB button */
  .lang-banner { bottom: 90px; }

  .header__inner { gap: 12px; }
  .nav {
    display: none;
    position: fixed;
    top: var(--header-h);
    right: 0;
    bottom: 0;
    left: 0;
    background: var(--white);
    flex-direction: column;
    padding: 24px;
    z-index: 300;
    overflow-y: auto;
    box-shadow: 0 8px 40px rgba(10,22,40,.18);
    margin-left: 0;
  }
  .nav.open { display: flex; }
  .nav__list { flex-direction: column; gap: 4px; }
  .nav__link { padding: 14px 18px; font-size: 1.0625rem; border-radius: var(--radius-sm); }
  .burger { display: flex; }
  .header__phone { padding: 8px 14px; }
  .header__phone-num { display: none; }
  /* nav is hidden so lang-sw takes over the auto-margin role */
  .lang-sw { margin-left: auto; }

  /* FAB */
  .fab-phone { display: flex; }

  /* Hero */
  .hero__actions .btn--lg { padding: 12px 22px; font-size: .9375rem; }
  .hero__actions .btn--lg svg { width: 17px; height: 17px; }
  .hero {
    padding: 56px 0 52px;
    background-image:
      linear-gradient(135deg, rgba(10,22,40,.82) 0%, rgba(17,32,64,.72) 55%, rgba(21,101,192,.58) 100%),
      url('../images/hero-bg-mobile.webp');
    background-size: cover;
    background-position: center;
  }
  .hero__stats-grid { grid-template-columns: repeat(2, 1fr); }
  .hero__badge { font-size: .75rem; }
  .hero__actions { gap: 10px; }

  /* Services */
  .services__grid { grid-template-columns: 1fr; }

  /* Stats */
  .stats { padding: 56px 0; }
  .stats__grid { grid-template-columns: repeat(2, 1fr); gap: 24px; }

  /* Steps */
  .steps__grid { grid-template-columns: repeat(2, 1fr); }

  /* Contacts */
  .contacts__inner { grid-template-columns: 1fr; gap: 32px; }
  .form-wrap { padding: 28px 22px; }
  .form-row { grid-template-columns: 1fr; }

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

  /* Section head */
  .section-head { margin-bottom: 36px; }

  /* CTA */
  .cta-block { padding: 56px 0; }
  .cta-block__actions { flex-direction: column; align-items: center; }
}

/* ── 480px (small mobile) ─────────────────────────────────── */
@media (max-width: 480px) {
  .container { padding: 0 16px; }

  h1 { font-size: 1.875rem; }
  h2 { font-size: 1.5rem; }

  /* Hero */
  .hero__title { font-size: 2rem; }
  .hero__stats-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .hero__stat-num { font-size: 1.75rem; }
  .hero__actions { flex-direction: column; }
  .hero__actions .btn { width: 100%; justify-content: center; padding: 11px 20px; font-size: .875rem; }
  .hero__actions .btn svg { width: 16px; height: 16px; }

  /* Stats */
  .stats__grid { grid-template-columns: 1fr 1fr; }
  .stat-item__num { font-size: 2.25rem; }

  /* Steps */
  .steps__grid { grid-template-columns: 1fr; }

  /* Gallery */
  .gallery__grid { grid-template-columns: 1fr; }

  /* Articles */
  .articles__grid { grid-template-columns: 1fr; }

  /* Advantages */
  .advantages__grid { grid-template-columns: 1fr; }

  /* Reviews */
  .reviews__grid { grid-template-columns: 1fr; }

  /* Messenger buttons */
  .messengers { flex-direction: column; }
  .messenger-btn { justify-content: center; }

  /* Modal */
  .modal { padding: 28px 20px; }

  /* Lightbox nav */
  .lightbox__prev { left: 8px; }
  .lightbox__next { right: 8px; }
}

/* ── Landscape mobile ─────────────────────────────────────── */
@media (max-width: 768px) and (orientation: landscape) {
  .hero { min-height: auto; padding: 40px 0 36px; }
}

/* ── Article page responsive ──────────────────────────────── */
@media (max-width: 1024px) {
  .article-layout { grid-template-columns: 1fr; }
  .article-sidebar { position: static; }
}
@media (max-width: 768px) {
  .article-hero-img { height: 240px; }
  .article-content h1 { font-size: 1.625rem; }
  .article-content h2 { font-size: 1.25rem; margin: 36px 0 12px; }
  .article-cta-inline { padding: 24px 20px; }
}