/* Base Typography */
body { 
    font-family: 'Inter', sans-serif; 
}

h1, h2, h3 { 
    font-family: 'Playfair Display', serif; 
}

/* Hero Section Background */
.celestial-gradient {
    background: #1f3540;
    position: relative;
}

.celestial-gradient::after {
    content: "";
    position: absolute;
    inset: 0;
    background-image: 
        radial-gradient(1px 1px at 20px 30px, white, rgba(0,0,0,0)),
        radial-gradient(1.5px 1.5px at 50px 160px, white, rgba(0,0,0,0)),
        radial-gradient(1px 1px at 90px 40px, white, rgba(0,0,0,0)),
        radial-gradient(1.5px 1.5px at 130px 80px, white, rgba(0,0,0,0)),
        radial-gradient(1px 1px at 160px 120px, white, rgba(0,0,0,0)),
        radial-gradient(2px 2px at 200px 50px, white, rgba(0,0,0,0)),
        radial-gradient(1.5px 1.5px at 230px 210px, white, rgba(0,0,0,0)),
        radial-gradient(1px 1px at 40px 240px, white, rgba(0,0,0,0)),
        radial-gradient(2px 2px at 280px 130px, white, rgba(0,0,0,0));
    background-repeat: repeat;
    background-size: 300px 300px;
    opacity: 0.5;
    animation: twinkle 4s infinite ease-in-out;
    pointer-events: none;
}

@keyframes twinkle {
    0%, 100% { opacity: 0.25; }
    50% { opacity: 0.8; }
}

/* Glassmorphism Effect */
.glass {
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.1);
}

/* Tint logo to #e5e7bf */
.logo-tint {
    filter: brightness(0) saturate(100%) invert(95%) sepia(17%) saturate(395%) hue-rotate(16deg) brightness(96%) contrast(89%);
}