body,
        html {
            font-family: "Figtree", sans-serif;
            margin: 0;
            padding: 0;
            height: 100%;
        }
/* Base styles for step content */
      .step-content {
         opacity: 0;
         visibility: hidden;
         height: 0;
         overflow: hidden;
         transform: translateX(20px);
         transition:
            opacity 0.5s ease,
            transform 0.5s ease,
            visibility 0s 0.5s,
            height 0s 0.5s;
      }

      /* Active step styles */
      .step-content.active {
         opacity: 1;
         visibility: visible;
         height: auto;
         transform: translateX(0);
         transition:
            opacity 0.5s ease,
            transform 0.5s ease;
      }
     
      /* Reduced motion preferences */
      @media (prefers-reduced-motion: reduce) {
         .step-content {
            transition:
               opacity 0.1s linear,
               visibility 0s 0.1s,
               height 0s 0.1s !important;
            transform: none !important;
         }

         .step-content.active {
            transition: opacity 0.1s linear !important;
         }

         button {
            transition: none !important;
         }
      }

      .error-message {
         color: #ef4444;
         /* Tailwind's red-500 */
         font-size: 0.75rem;
         /* Tailwind's text-xs */
         font-style: italic;
         margin-top: 0.25rem;
         /* Tailwind's mt-1 */
      }

      .warning-message {
         color: #d97706;
         /* Tailwind's yellow-700 */
         font-size: 0.75rem;
         font-style: italic;
         margin-top: 0.25rem;
      }