@tailwind base;
@tailwind components;
@tailwind utilities;

@layer components {
    /* The Signature Glowing Blue Ring from your screenshot */
    .v-hero-ring {
        @apply relative mx-auto max-w-6xl overflow-hidden rounded-[2.5rem] px-6 py-16 sm:px-12 sm:py-20 lg:px-16 lg:py-24 
               border-2 border-vydurya-blue/50 shadow-[0_0_40px_rgba(0,186,239,0.2)]
               dark:border-vydurya-blue/30 dark:shadow-[0_0_50px_rgba(0,186,239,0.1)]
               transition-all duration-500 bg-white/10 backdrop-blur-md;
    }

    /* Restoring Card Boundaries */
    .v-card {
        @apply flex flex-col rounded-3xl border border-vydurya-black/10 bg-white/40 p-6 backdrop-blur-md 
               transition-all duration-300 hover:border-vydurya-blue/40 hover:shadow-xl 
               dark:border-white/10 dark:bg-white/5;
    }

    .v-btn-primary {
        @apply inline-flex items-center justify-center rounded-xl bg-vydurya-blue px-6 py-3.5 text-sm font-semibold text-white 
               shadow-lg shadow-vydurya-blue/20 transition-all duration-300 hover:bg-vydurya-black;
    }
    /* 🚀 ADD THIS LINE TO CATCH THE SHORTCUT UTILITY GLOBAL PATH */
    .v-cta {
        @apply inline-flex items-center justify-center bg-vydurya-blue transition-all duration-300 hover:bg-vydurya-black text-white;
    }
    .v-btn-glass {
        @apply inline-flex items-center justify-center rounded-xl border border-vydurya-black/20 bg-white/40 px-6 py-3.5 
               text-sm font-semibold text-vydurya-black backdrop-blur transition-all duration-300 
               hover:bg-white/70 dark:border-white/15 dark:bg-white/5 dark:text-white;
    }
    /* Force the header to be sticky globally */
    header {
    position: -webkit-sticky !important; /* Safari */
    position: sticky !important;
    top: 0 !important;
    z-index: 9999 !important;
    }

    /* Remove overflow-hidden from body/html if not needed */
    html, body {
    overflow-x: hidden; /* Keep this */
    overflow-y: auto;   /* Ensure this is auto */
    }
}