components/Header.jsx

export default function Header() {
  return (
    <header className="text-center space-y-4">
      <h1 className="text-5xl font-bold bg-gradient-to-r from-primary-500 to-secondary-500 bg-clip-text text-transparent">
        🎨 Z-Image Turbo
      </h1>
      <p className="text-xl text-slate-600 font-normal">
        Fast, high-quality image generation with single-stream diffusion
      </p>
      
      <div className="flex justify-center mt-6">
        <a
          href="https://huggingface.co/settings/mcp?add=victor/Z-Image-Turbo-MCP"
          target="_blank"
          rel="noopener noreferrer"
          className="inline-block px-8 py-3 bg-gradient-to-r from-primary-500 to-secondary-500 text-white rounded-full font-semibold shadow-lg hover:shadow-xl transform hover:-translate-y-0.5 transition-all duration-200"
        >
          🔌 Connect via MCP
        </a>
      </div>
    </header>
  );
}