/* ==========================================================
   RTM ART — media.css — Responsive
   ========================================================== */

/* ---- LG ≤ 991px ----------------------------------------- */
@media (max-width: 991.98px) {
  .rtm-header-inner { padding: 16px 24px; }
  .rtm-nav { gap: 22px; }
  .rtm-hero-content { padding: 30px 24px; }
  .rtm-hero-caption { left: 24px; }
  .rtm-portfolio { padding: 48px 0 72px; }
  .rtm-about { padding: 52px 0 72px; }
  .rtm-contacts { padding: 56px 0 72px; }
  .rtm-footer-inner { padding: 22px 24px; }
  .rtm-vline { display: none; }
}

/* ---- MD ≤ 767px ----------------------------------------- */
@media (max-width: 767.98px) {
  /* Header nav collapse */
  .rtm-burger { display: flex; }
  .rtm-nav-wrap {
    display: none;
    position: absolute; top: 100%; left: 0; right: 0;
    background: rgba(17,18,20,0.98);
    border-top: 1px solid var(--rtm-gold-dim);
    padding: 20px 24px 28px; z-index: 49;
  }
  .rtm-nav-wrap.open { display: block; }
  .rtm-nav { flex-direction: column; gap: 0; align-items: flex-start; width: 100%; }
  .rtm-nav a {
    font-size: 14px; padding: 12px 0; opacity: 0.8;
    border-bottom: 1px solid rgba(175,146,88,0.08); width: 100%;
  }
  .rtm-nav li.active > a::after,
  .rtm-nav a.active::after { display: none; }

  /* Hero */
  .rtm-hero { min-height: calc(100svh - 60px); }
  .rtm-hero-logo { width: 200px; }
  .rtm-hero-caption { display: none; }

  /* About */
  .rtm-about-img { max-width: 360px; margin-bottom: 36px; }
  .rtm-about-content { padding-left: 0; }
  .rtm-about-content p { max-width: none; }

  /* Contacts */
  .rtm-contacts-invite { max-width: none; }
  .rtm-form-box { padding: 26px 20px 32px; margin-top: 36px; }

  /* Footer */
  .rtm-footer-inner { flex-direction: column; align-items: center; text-align: center; gap: 12px; }
}

/* ---- SM ≤ 575px ----------------------------------------- */
@media (max-width: 575.98px) {
  .rtm-cats { gap: 0 16px; }
  .rtm-cats li a { font-size: 12px; padding-bottom: 12px; }
  .rtm-lb-nav { width: 40px; height: 40px; font-size: 22px; }
  .rtm-lb-prev { left: 4px; }
  .rtm-lb-next { right: 4px; }
  .rtm-section-title { font-size: clamp(34px, 10vw, 60px); }
}