@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;900&display=swap');

/* Global Reset/Base */
body {
    font-family: 'Inter', sans-serif !important;
}

/* Custom Design Tokens */
.mesh-gradient-light {
    background-color: #f8fafc;
    background-image:
        radial-gradient(at 0% 0%, rgba(59, 130, 246, 0.15) 0px, transparent 50%),
        radial-gradient(at 100% 0%, rgba(99, 102, 241, 0.15) 0px, transparent 50%),
        radial-gradient(at 100% 100%, rgba(244, 114, 182, 0.1) 0px, transparent 50%),
        radial-gradient(at 0% 100%, rgba(59, 130, 246, 0.1) 0px, transparent 50%);
}

.text-gradient {
    background: linear-gradient(135deg, #2563eb 0%, #3b82f6 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.bg-blur {
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    background: rgba(255, 255, 255, 0.7);
}

/* Animations that Tailwind might not catch or good to have in CSS */
@keyframes float {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-10px);
    }
}

.animate-float {
    animation: float 4s ease-in-out infinite;
}

/* WordPress Specific Overrides */
.single-post .entry-content {
    /* Ensure content has some breathing room but don't break tailwind layout */
    max-width: 100% !important;
    /* Let container handle manual width */
}

/* Fix Blocksy Container Width if incompatible with Tailwind max-w-* */
[class*="ct-container"] {
    /* Optional: override if needed, but Blocksy usually plays nice */
}