/* ==========================================================================
   NN LEGAL — RESPONSIVE RULES
   Breakpoint-specific recomposition. Type sizes are handled with clamp()
   in styles.css; this file governs layout changes and spacing reduction.
   Reference breakpoints: 1512 / 1440 / 1280 / 1024 / 768 / 390
   ========================================================================== */

/* Small laptop / large tablet */
@media (max-width: 1279px) {
  .section { padding: var(--space-4xl) 0; }
}

/* Tablet landscape */
@media (max-width: 1023px) {
  :root { --header-height: 76px; }
  .section { padding: var(--space-3xl) 0; }
  .practice-visual { display: none; }
  .about-head { position: static; }
  .legal-toc { display: none; }
}

/* Tablet */
@media (max-width: 767px) {
  .container { width: min(var(--container-max), calc(100% - 44px)); }
  .section { padding: var(--space-2xl) 0; }
  .footer-legal { flex-direction: column; align-items: flex-start; }
  .bio-block { grid-template-columns: 1fr; }
  .related-people { grid-template-columns: 1fr 1fr; }
  .team-sub-grid { grid-template-columns: 1fr 1fr; }
}

/* Mobile */
@media (max-width: 480px) {
  .container { width: min(var(--container-max), calc(100% - 40px)); }
  .section { padding: var(--space-xl) 0; }
  .hero-ctas, .btn-row, .cta-actions { flex-direction: column; align-items: stretch; }
  .hero-ctas .btn, .btn-row .btn, .cta-actions .btn { justify-content: center; }
  .related-people, .team-sub-grid { grid-template-columns: 1fr; }
  .footer-mark { font-size: 15vw; }
  .practice-item { gap: var(--space-sm); }
  .audience-row { grid-template-columns: 1fr; }
  .insights-filter { gap: 8px; }
  .filter-chip { padding: 8px 14px; font-size: 12px; }
}

/* Fine breakpoints matching the brief's explicit test widths */
@media (max-width: 390px) {
  .t-display-xl { font-size: 40px; }
  .t-h1 { font-size: 36px; }
  .error-code { font-size: 84px; }
}