body {
    font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    line-height: 1.6;
    margin: 0;
    padding: 0;
}

header {
    background-color: #f4f4f4;
    padding: 1rem;
}

.logo {
    height: 50px;
}

nav ul {
    list-style-type: none;
    padding: 0;
}

nav ul li {
    display: inline;
    margin-right: 10px;
}

nav ul li a {
    text-decoration: none;
    color: #333;
}

footer {
    background-color: #333;
    color: #fff;
    text-align: center;
    padding: 1rem;
    bottom: 0;
    width: 100%;
}


@keyframes shimmer {
  to {
    background-position: 200% center;
  }
}
.animate-shimmer {
  animation: shimmer 6s ease infinite;
}

/* Add to your Tailwind CSS config or global CSS */

/* Extra small screens (below 475px) */
@media (max-width: 374px) {
  .hero-text-xs {
    font-size: 2rem; /* 32px */
    line-height: 0.8;
    letter-spacing: -0.025em;
  }
  
  .hero-description-xs {
    font-size: 0.875rem; /* 14px */
    line-height: 1.4;
    max-width: 280px;
  }
  
  .hero-status-xs {
    font-size: 0.75rem; /* 12px */
    padding: 0.375rem 0.75rem;
  }
}

/* Ensure proper touch targets on mobile */
@media (max-width: 768px) {
  .touch-target {
    min-height: 44px;
    min-width: 44px;
  }
  
  /* Reduce motion for better mobile performance */
  @media (prefers-reduced-motion: reduce) {
    .animate-pulse {
      animation: none;
    }
    
    .blur-2xl,
    .blur-3xl {
      filter: none;
    }
  }
}

/* Performance optimizations for mobile */
@supports (backdrop-filter: blur(8px)) {
  .mobile-backdrop {
    backdrop-filter: blur(8px);
  }
}

/* Safe area handling for newer mobile devices */
@supports (padding: env(safe-area-inset-top)) {
  .hero-mobile-safe {
    padding-top: calc(1rem + env(safe-area-inset-top));
    padding-left: calc(1rem + env(safe-area-inset-left));
    padding-right: calc(1rem + env(safe-area-inset-right));
  }
}
        @keyframes shimmer {
          0% {
            transform: translateX(-100%);
          }
          100% {
            transform: translateX(100%);
          }
        }
        .animate-shimmer {
          animation: shimmer 2s infinite;
        }