/* career-brain-assessment/assets/css/mobile.css */
/* Mobile-first Enhancements */

@media (max-width: 640px) {
  body {
    font-size: 0.95rem;
  }

  .container {
    padding: var(--space-4) var(--space-3);
  }

  .btn {
    width: 100%;
    padding: var(--space-4);
    font-size: var(--font-size-md);
  }

  .nav-buttons {
    flex-direction: column;
  }

  .question-card h2 {
    font-size: var(--font-size-lg);
  }

  .answers {
    gap: var(--space-2);
  }

  .answer-option {
    padding: var(--space-4);
  }

  .progress-wrap {
    margin-bottom: var(--space-4);
  }

  .site-header .container {
    flex-direction: column;
    gap: var(--space-2);
  }

  .site-footer p {
    font-size: var(--font-size-xs);
  }

  .mobile-safe-area {
    padding-bottom: 80px;
  }
}