/* NordBrief mobile and UI stability fixes */
html, body { max-width: 100%; overflow-x: hidden; }
*, *::before, *::after { box-sizing: border-box; }
img, svg, video, canvas, iframe { max-width: 100%; }
a, button, input, select, textarea { -webkit-tap-highlight-color: transparent; }
button, .btn, .btn-primary, .btn-secondary, .signup-btn, .submit-btn, .btn-next, .btn-back { min-height: 44px; }
#clerk-sign-up, #clerk-sign-in, #clerk-sign-up > div, #clerk-sign-in > div, .cl-component, .cl-card, .cl-rootBox { width: 100% !important; max-width: 100% !important; }
table { max-width: 100%; border-collapse: collapse; }
pre, code, .table-wrap, .data-table, .comparison-table { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.nav, nav, .topbar, .app-nav, .bottom-nav { max-width: 100vw; }
.support-chat, .chat-widget, #support-chat, #chat-widget, .chat-panel, .support-panel { max-width: calc(100vw - 24px) !important; }
@media (max-width: 820px) {
  body { width: 100%; }
  nav, .nav, .topbar, .header, .app-header { padding-left: 16px !important; padding-right: 16px !important; }
  main, .main, .container, .content, .page, section { max-width: 100% !important; }
  section { padding-left: 16px !important; padding-right: 16px !important; }
  .nav-right, .nav-links, .tabs, .tabbar, .filter-row, .toolbar { max-width: 100%; overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .nav-right::-webkit-scrollbar, .nav-links::-webkit-scrollbar, .tabs::-webkit-scrollbar, .tabbar::-webkit-scrollbar, .filter-row::-webkit-scrollbar, .toolbar::-webkit-scrollbar { display: none; }
  .grid, .cards, .card-grid, .pricing-grid, .feature-grid, .dashboard-grid, .kpi-grid, .metrics-grid { grid-template-columns: 1fr !important; }
  .card, .panel, .stat-card, .metric-card, .brief-card, .news-card, .pricing-card, .legal-card, .form-wrap, .auth-wrap, .cta-wrap, .demo-card { max-width: 100% !important; }
  .hero, .hero-grid, .split, .two-col, .three-col { grid-template-columns: 1fr !important; }
  .hero h1, h1 { overflow-wrap: anywhere; }
  .signup-row, .cta-row, .button-row, .actions, .form-actions { flex-direction: column !important; align-items: stretch !important; }
  .signup-row input, .signup-input, input, select, textarea, .signup-row button, .signup-btn, .btn-primary, .btn-secondary, .submit-btn, .btn-next, .btn-back { width: 100% !important; max-width: 100% !important; }
  .bottom-nav { left: 8px !important; right: 8px !important; bottom: max(8px, env(safe-area-inset-bottom)) !important; width: auto !important; border-radius: 18px !important; }
  body:has(.bottom-nav) main, body:has(.bottom-nav) .main, body:has(.bottom-nav) .content { padding-bottom: 96px !important; }
  .support-chat, .chat-widget, #support-chat, #chat-widget { right: 12px !important; bottom: calc(86px + env(safe-area-inset-bottom)) !important; }
  .chat-panel, .support-panel { right: 12px !important; left: 12px !important; width: auto !important; bottom: calc(142px + env(safe-area-inset-bottom)) !important; }
}
@media (max-width: 520px) {
  nav { min-width: 0; }
  .auth-title, h1 { font-size: clamp(28px, 9vw, 40px) !important; }
  h2 { font-size: clamp(24px, 7vw, 34px) !important; }
  .auth-wrap, .form-wrap { padding-left: 0 !important; padding-right: 0 !important; }
  .progress-labels-row, .progress-steps-row { min-width: 0 !important; }
  .radio-group, .checkbox-group { grid-template-columns: 1fr !important; }
  .footer-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 16px; }
  .footer-legal { line-height: 1.7; overflow-wrap: anywhere; }
}