/* ============================================
   Premium Gradient Card Design Overrides
   ============================================ */

.liquid-glass,
.service-card,
.product-card,
.contact-connect-card,
.callback,
.legal-card,
.blog-editor,
.industry-card,
.blog-card-public,
.blog-card,
.enquiry-item,
.user-item,
.admin-login-card,
.workflow-step,
.technology-panel,
.technology-item {
    position: relative !important;
    border: none !important;
    background: none !important;
    box-shadow: none !important;
    z-index: 1 !important;
    transition: transform 0.4s var(--ease-out-expo) !important;
}

/* Base Card Pseudo-element (Normal State Gradient background & border) */
body .liquid-glass::before,
body .service-card::before,
body .product-card::before,
body .contact-connect-card::before,
body .callback::before,
body .legal-card::before,
body .blog-editor::before,
body .industry-card::before,
body .blog-card-public::before,
body .blog-card::before,
body .enquiry-item::before,
body .user-item::before,
body .admin-login-card::before,
body .workflow-step::before,
body .technology-panel::before,
body .technology-item::before {
    display: block !important;
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    border: 1px solid transparent !important;
    border-radius: inherit !important;
    background: 
        linear-gradient(var(--card-bg-start), var(--card-bg-end)) padding-box,
        linear-gradient(135deg, var(--card-border-start), var(--card-border-mid), var(--card-border-end)) border-box !important;
    box-shadow: var(--card-shadow) !important;
    z-index: -2 !important;
    opacity: 1 !important;
    transition: opacity 0.4s ease, box-shadow 0.4s ease !important;
}

/* Hover Card Pseudo-element (Hover State Gradient background & border) */
body .liquid-glass::after,
body .service-card::after,
body .product-card::after,
body .contact-connect-card::after,
body .callback::after,
body .legal-card::after,
body .blog-editor::after,
body .industry-card::after,
body .blog-card-public::after,
body .blog-card::after,
body .enquiry-item::after,
body .user-item::after,
body .admin-login-card::after,
body .workflow-step::after,
body .technology-panel::after,
body .technology-item::after {
    display: block !important;
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    border: 1px solid transparent !important;
    border-radius: inherit !important;
    background: 
        linear-gradient(var(--card-hover-bg-start), var(--card-hover-bg-end)) padding-box,
        linear-gradient(135deg, var(--card-hover-border-start), var(--card-hover-border-mid), var(--card-hover-border-end)) border-box !important;
    box-shadow: var(--card-hover-shadow) !important;
    z-index: -1 !important;
    opacity: 0 !important;
    transition: opacity 0.4s ease !important;
}

/* Hover Interactive Triggers */
.liquid-glass:hover::after,
.service-card:hover::after,
.product-card:hover::after,
.contact-connect-card:hover::after,
.callback:hover::after,
.legal-card:hover::after,
.blog-editor:hover::after,
.industry-card:hover::after,
.blog-card-public:hover::after,
.blog-card:hover::after,
.enquiry-item:hover::after,
.user-item:hover::after,
.admin-login-card:hover::after,
.workflow-step:hover::after,
.technology-panel:hover::after,
.technology-item:hover::after {
    opacity: 1 !important;
}

/* Consistent Hover translation for cards */
.service-card:hover,
.product-card:hover,
.industry-card:hover,
.blog-card-public:hover,
.blog-card:hover,
.enquiry-item:hover,
.user-item:hover,
.workflow-step:hover,
.technology-item:hover {
    transform: translateY(-5px) !important;
}

/* Content wrapper visibility to stay on top of absolute background overlays */
.liquid-glass > *,
.service-card > *,
.product-card > *,
.contact-connect-card > *,
.callback > *,
.legal-card > *,
.blog-editor > *,
.industry-card > *,
.blog-card-public > *,
.blog-card > *,
.enquiry-item > *,
.user-item > *,
.admin-login-card > *,
.workflow-step > *,
.technology-panel > *,
.technology-item > * {
    position: relative;
    z-index: 2;
}