body {
            font-family: 'Inter', sans-serif;
            /* Mobile background by default */
            background-image: linear-gradient(rgba(15, 23, 42, 0.2), rgba(15, 23, 42, 0.2)), url('/img/mobile.png');
            background-size: cover;
            background-position: center;
            background-attachment: fixed;
            background-repeat: no-repeat;
            min-height: 100vh;
            display: flex;
            flex-direction: column;
            align-items: center;
            transition: background-image 0.5s ease-in-out;
        }

        /* Desktop background switch */
        @media (min-width: 768px) {
            body {
                background-image: linear-gradient(rgba(15, 23, 42, 0.1), rgba(15, 23, 42, 0.1)), url('/img/bg-desktop.png');
            }
        }

        @keyframes fadeInUp {
            from {
                opacity: 0;
                transform: translateY(20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        .animate-fade-in {
            animation: fadeInUp 0.6s ease-out forwards;
            opacity: 0;
        }

        .delay-1 { animation-delay: 0.1s; }
        .delay-2 { animation-delay: 0.2s; }
        .delay-3 { animation-delay: 0.3s; }
        .delay-4 { animation-delay: 0.4s; }
        .delay-5 { animation-delay: 0.5s; }

        .link-card {
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            border: 1px solid rgba(255, 255, 255, 0.3);
            backdrop-filter: blur(12px);
            background-color: rgba(255, 255, 255, 0.85);
        }

        .link-card:active {
            transform: scale(0.96);
            background-color: #0f172a;
            color: white;
        }

        @media (hover: hover) {
            .link-card:hover {
                transform: translateY(-3px);
                box-shadow: 0 15px 30px -5px rgba(0, 0, 0, 0.2);
                border-color: #1e3a8a;
                color: #1e3a8a;
                background-color: #ffffff;
            }
        }

        .logo-glow {
            box-shadow: 0 0 40px rgba(255, 255, 255, 0.4);
        }

        header h1 {
            text-shadow: 0 2px 8px rgba(0,0,0,0.4);
            color: white !important;
        }
        
        header p {
            background-color: rgba(30, 58, 138, 0.85);
            padding: 5px 14px;
            border-radius: 9999px;
            display: inline-block;
            color: white !important;
            box-shadow: 0 4px 6px rgba(0,0,0,0.1);
        }