/* ============================================================
   responsive.css — Responsive / Media Queries
   مكتب المحامية نورة منيف المرشدي
   ============================================================ */

/* ── Tablet (≤ 1024px) ── */
@media (max-width: 1024px) {
  .grid-2 { grid-template-columns: 1fr; gap: 28px; }
  .grid-3 { grid-template-columns: repeat(2, 1fr); }
  .bilingual-grid { grid-template-columns: 1fr; }
  .bilingual-ar { border-radius: var(--radius-md) var(--radius-md) 0 0; border-left: 1px solid var(--grey-light); border-bottom: none; }
  .bilingual-en { border-radius: 0 0 var(--radius-md) var(--radius-md); }
  .bilingual-cols { grid-template-columns: 1fr; }
  .col-en { border-top: 1px solid var(--grey-light); padding-top: 30px; }
  .contact-grid { grid-template-columns: 1fr; gap: 40px; }
  .honor-grid { grid-template-columns: 1fr; gap: 40px; }
  .values-grid { grid-template-columns: 1fr; }
  .home-nav-grid { grid-template-columns: repeat(2, 1fr); }
  .vision-image-wrap img,
  .vision-image-placeholder { width: 260px; height: 340px; }
}

/* ── Mobile (≤ 768px) ── */
@media (max-width: 768px) {
  .nav-links { display: none; }
  .nav-toggle { display: flex; }

  .nav-inner { padding: 12px 5%; }

  .hero-content { padding: 100px 16px 50px; }

  .corner-frame { width: 70px; height: 70px; }
  .corner-frame.tl { top: 20px; right: 20px; }
  .corner-frame.br { bottom: 20px; left: 20px; }

  .section-pad { padding: 55px 0; }
  .section-pad-sm { padding: 35px 0; }

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

  .inner-hero { padding: 140px 0 50px; min-height: 260px; }

  .home-nav-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
  .home-nav-card { padding: 18px 12px; }
  .home-nav-card .icon { font-size: 1.5rem; }
  .home-nav-card h4 { font-size: .85rem; }

  .honor-photo-frame { width: 200px; height: 200px; }

  .bilingual-ar,
  .bilingual-en { padding: 35px 24px; }

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

  .vision-image-wrap {
    display: block;
    text-align: center;
    margin: 0 auto 30px;
  }

  .vision-image-wrap img,
  .vision-image-placeholder {
    width: 220px;
    height: 280px;
    margin: 0 auto;
  }

  .social-links { flex-wrap: wrap; }

  #back-to-top { bottom: 20px; left: 20px; width: 40px; height: 40px; }

  .quran-text { font-size: 1rem; padding: 0 16px; }

  .btn { padding: 12px 24px; font-size: .9rem; }

  .services-cover-title { font-size: clamp(2rem, 8vw, 3.5rem); }
}

/* ── Small Mobile (≤ 480px) ── */
@media (max-width: 480px) {
  .home-nav-grid { grid-template-columns: 1fr; }
  .grid-2 { grid-template-columns: 1fr; }
  .contact-item { flex-direction: column; gap: 10px; }

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

  .card { padding: 20px; }
  .container { width: 94%; }

  .hero-label { font-size: .75rem; letter-spacing: 2px; }
}