* {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
            font-family: 'Inter', sans-serif;
        }

        body {
            background: linear-gradient(145deg, #0a1929 0%, #11212e 100%);
            min-height: 100vh;
            padding: 24px;
            color: #f0f9ff;
        }

        /* Header */
        .header {
            display: flex;
            justify-content: center;
            margin-bottom: 40px;
        }


        /* Hero */
        .hero {
            text-align: center;
            margin-bottom: 48px;
        }

        .hero h1 {
            font-size: clamp(2rem, 5vw, 3.2rem);
            font-weight: 600;
            background: linear-gradient(to right, #fff, #b0d4ff);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            margin-bottom: 8px;
        }

        .hero p {
            color: #a0b8cc;
            font-size: 1.2rem;
        }

.logo {
    text-decoration: none;
  color: #fff;
            background: rgba(0, 0, 0, 0.3);
            backdrop-filter: blur(8px);
            border: 1px solid rgba(255, 255, 255, 0.1);
            border-radius: 60px;
            padding: 8px 24px;
            display: inline-flex;
            align-items: center;
            gap: 12px;
            font-weight: 500;
        }

        .logo img {
            height: 32px;
            width: auto;
        }

        .blue {
    color: blue !important;
    -webkit-text-fill-color: blue;
}

.violet {
    color: violet !important;
    -webkit-text-fill-color: violet;
}