/* AI Exam Center — mobile responsiveness.
   The site's pages are built with inline styles, so these rules use
   attribute selectors + !important to adapt the existing markup for
   small screens without rewriting each element. Linked from every page. */

@media (max-width: 768px) {
  * { box-sizing: border-box; }
  html, body { overflow-x: hidden; }
  img, svg, video { max-width: 100%; height: auto; }

  /* Collapse every multi-column grid to a single column on phones */
  [style*="grid-template-columns"] { grid-template-columns: 1fr !important; }

  /* Scale down oversized headings (handles both "px" and " px" spacing) */
  [style*="font-size: 64px"], [style*="font-size:64px"] { font-size: 38px !important; }
  [style*="font-size: 56px"], [style*="font-size:56px"] { font-size: 34px !important; }
  [style*="font-size: 52px"], [style*="font-size:52px"] { font-size: 32px !important; line-height: 1.15 !important; }
  [style*="font-size: 48px"], [style*="font-size:48px"] { font-size: 30px !important; line-height: 1.15 !important; }
  [style*="font-size: 46px"], [style*="font-size:46px"] { font-size: 29px !important; line-height: 1.15 !important; }
  [style*="font-size: 44px"], [style*="font-size:44px"] { font-size: 28px !important; line-height: 1.15 !important; }
  [style*="font-size: 36px"], [style*="font-size:36px"] { font-size: 25px !important; }
  [style*="font-size: 34px"], [style*="font-size:34px"] { font-size: 23px !important; }

  /* Navigation: allow it to wrap and tighten spacing so links fit */
  nav > div {
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 8px 14px !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  nav [style*="gap: 30px"] { gap: 14px !important; }
  nav a, nav button, nav span { font-size: 14px !important; }

  /* Wide tables (e.g. dashboard attempts) scroll rather than overflow */
  table { display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }

  /* Trim the tallest hero/section paddings for better density on phones */
  [style*="padding: 80px 32px"] { padding: 44px 20px !important; }
  [style*="padding: 72px 32px"] { padding: 40px 20px !important; }
  [style*="padding: 64px 32px"] { padding: 40px 20px !important; }
  [style*="padding: 48px 32px"] { padding: 32px 20px !important; }
}