/* =============================================================
   AHS ZONE — responsive.css
   Tablet (<= 980px) and mobile (<= 680px) adjustments.
   The base layout in style.css targets desktop-first.
   ============================================================= */

/* ---------- TABLET: <= 980px ---------- */
@media (max-width: 980px) {
  :root { --space-6: 80px; --space-7: 104px; }
  .wrap { padding: 0 var(--space-3); }

  .hero-grid { grid-template-columns: 1fr; gap: var(--space-4); }
  .seal { justify-self: start; width: 150px; height: 150px; }

  .about-grid { grid-template-columns: 1fr; gap: var(--space-4); }
  .stat-block {
    flex-direction: row;
    flex-wrap: wrap;
    border-left: none;
    border-top: 1px solid var(--rule-strong);
    padding-left: 0; padding-top: var(--space-3);
    gap: var(--space-4);
  }
}

/* ---------- MOBILE NAV: <= 820px ---------- */
@media (max-width: 820px) {
  .nav-toggle { display: inline-flex; }
  .nav-cta { display: none; }
  .nav-list { display: none; }
}

/* ---------- MOBILE: <= 680px ---------- */
@media (max-width: 680px) {
  :root { --space-6: 64px; --space-5: 48px; --header-h: 64px; }

  .hero { padding: var(--space-5) 0; }
  .hero-meta { gap: var(--space-3); }
  .hero-actions { width: 100%; }
  .hero-actions .btn { width: 100%; justify-content: center; }

  .section { padding: var(--space-5) 0; }
  .section-head { flex-direction: column; gap: 6px; }

  .company-card {
    grid-template-columns: 1fr;
    text-align: left;
    gap: var(--space-2);
  }
  .company-seal { width: 56px; height: 56px; font-size: 0.95rem; }
  .company-link { justify-self: start; }

  .clause { grid-template-columns: 1fr; gap: 8px; }
  .clause-tag { padding-top: 0; }

  .contact-panel { padding: var(--space-4) var(--space-3); }
  .contact-panel::before { left: var(--space-3); }
  .contact-grid { grid-template-columns: 1fr; gap: var(--space-2); }
  .contact-signoff { flex-direction: column; align-items: stretch; }
  .contact-signoff .btn { width: 100%; justify-content: center; }

  .site-footer { flex-direction: column; align-items: flex-start; }
  .footer-logo { height: 54px; }
}

/* ---------- SMALL MOBILE: <= 420px ---------- */
@media (max-width: 420px) {
  .hero-title { font-size: clamp(2rem, 9vw, 2.8rem); }
  .stat-num { font-size: 2.2rem; }
}