/* Base Styles */
        .service-card {
            border-radius: 20px;
            padding: 2rem;
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
            transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
            position: relative;
            overflow: hidden;
            cursor: pointer;
            border: 1px solid rgba(255, 255, 255, 0.8);
            backdrop-filter: blur(10px);
        }

        .service-card::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            height: 4px;
            background: linear-gradient(90deg, #667eea 0%, #764ba2 100%);
            transform: scaleX(0);
            transform-origin: left;
            transition: transform 0.4s ease;
        }

        .service-card:hover::before {
            transform: scaleX(1);
        }

        .service-card:hover {
            transform: translateY(-10px);
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.12);
        }

        /* Enhanced gradient overlay on hover */
        .service-card::after {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: linear-gradient(135deg, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0.1) 100%);
            opacity: 0;
            transition: opacity 0.4s ease;
            pointer-events: none;
        }

        .service-card:hover::after {
            opacity: 1;
        }

        /* Icon Wrapper */
        .icon-wrapper {
            display: flex;
            justify-content: center;
            align-items: center;
            height: 120px;
            margin-bottom: 1.5rem;
            position: relative;
        }

        /* 3D Rotate Icon - Blue Theme */
        .icon-3d-rotate {
            width: 80px;
            height: 80px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 2.5rem;
            background: linear-gradient(135deg, #4a90e2 0%, #7b68ee 100%);
            -webkit-background-clip: text;
            background-clip: text;
            -webkit-text-fill-color: transparent;
            position: relative;
            transform-style: preserve-3d;
            transition: all 0.6s ease;
        }

        .icon-3d-rotate::before {
            content: '';
            position: absolute;
            width: 100%;
            height: 100%;
            background: linear-gradient(135deg, #4a90e2 0%, #7b68ee 100%);
            border-radius: 50%;
            opacity: 0.08;
            transform: scale(1.2);
            transition: all 0.6s ease;
        }

        .service-card:hover .icon-3d-rotate {
            transform: rotateY(360deg) scale(1.1);
        }

        .service-card:hover .icon-3d-rotate::before {
            transform: scale(1.5);
            opacity: 0.15;
        }

        /* 3D Flip Icon - Green Theme */
        .icon-3d-flip {
            width: 80px;
            height: 80px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 2.5rem;
            background: linear-gradient(135deg, #27ae60 0%, #2ecc71 100%);
            -webkit-background-clip: text;
            background-clip: text;
            -webkit-text-fill-color: transparent;
            transform-style: preserve-3d;
            transition: all 0.6s ease;
        }

        .icon-3d-flip::before {
            content: '';
            position: absolute;
            width: 100%;
            height: 100%;
            background: linear-gradient(135deg, #27ae60 0%, #2ecc71 100%);
            border-radius: 20px;
            opacity: 0.08;
            transform: rotateX(0deg);
            transition: all 0.6s ease;
        }

        .service-card:hover .icon-3d-flip {
            transform: rotateX(360deg);
        }

        .service-card:hover .icon-3d-flip::before {
            transform: rotateX(180deg);
            opacity: 0.15;
        }

        /* 3D Depth Icon - Gold Theme */
        .icon-3d-depth {
            width: 80px;
            height: 80px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 2.5rem;
            background: linear-gradient(135deg, #f39c12 0%, #f1c40f 100%);
            -webkit-background-clip: text;
            background-clip: text;
            -webkit-text-fill-color: transparent;
            position: relative;
            transition: all 0.6s ease;
        }

        .icon-3d-depth::before,
        .icon-3d-depth::after {
            content: '';
            position: absolute;
            width: 100%;
            height: 100%;
            background: linear-gradient(135deg, #f39c12 0%, #f1c40f 100%);
            border-radius: 50%;
            opacity: 0.08;
            transition: all 0.6s ease;
        }

        .icon-3d-depth::before {
            transform: translate(-5px, -5px);
            z-index: -1;
        }

        .icon-3d-depth::after {
            transform: translate(5px, 5px);
            z-index: -2;
        }

        .service-card:hover .icon-3d-depth {
            transform: translateZ(20px) scale(1.1);
        }

        .service-card:hover .icon-3d-depth::before {
            transform: translate(-10px, -10px);
            opacity: 0.12;
        }

        .service-card:hover .icon-3d-depth::after {
            transform: translate(10px, 10px);
            opacity: 0.12;
        }

        /* 3D Pulse Icon - Purple Theme */
        .icon-3d-pulse {
            width: 80px;
            height: 80px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 2.5rem;
            background: linear-gradient(135deg, #9b59b6 0%, #8e44ad 100%);
            -webkit-background-clip: text;
            background-clip: text;
            -webkit-text-fill-color: transparent;
            position: relative;
            transition: all 0.6s ease;
        }

        .icon-3d-pulse::before {
            content: '';
            position: absolute;
            width: 100%;
            height: 100%;
            background: linear-gradient(135deg, #9b59b6 0%, #8e44ad 100%);
            border-radius: 50%;
            opacity: 0;
            transform: scale(0.8);
            transition: all 0.6s ease;
            animation: pulse-wave 2s infinite;
        }

        .service-card:hover .icon-3d-pulse {
            transform: scale(1.1) rotateZ(5deg);
        }

        .service-card:hover .icon-3d-pulse::before {
            opacity: 0.15;
            animation: pulse-wave 1s infinite;
        }

        @keyframes pulse-wave {
            0% {
                transform: scale(0.8);
                opacity: 0.15;
            }

            50% {
                transform: scale(1.3);
                opacity: 0;
            }

            100% {
                transform: scale(0.8);
                opacity: 0.15;
            }
        }

        /* Modern Button */
        .btn-modern {
            display: inline-flex;
            align-items: center;
            gap: 10px;
            padding: 15px 40px;
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            color: white;
            text-decoration: none;
            border-radius: 50px;
            font-weight: 600;
            font-size: 1.1rem;
            position: relative;
            overflow: hidden;
            transition: all 0.4s ease;
            box-shadow: 0 10px 30px rgba(102, 126, 234, 0.4);
        }

        .btn-modern::before {
            content: '';
            position: absolute;
            top: 0;
            left: -100%;
            width: 100%;
            height: 100%;
            background: linear-gradient(135deg, #764ba2 0%, #667eea 100%);
            transition: left 0.4s ease;
            z-index: 0;
        }

        .btn-modern:hover::before {
            left: 0;
        }

        .btn-modern:hover {
            transform: translateY(-3px);
            box-shadow: 0 15px 40px rgba(102, 126, 234, 0.5);
        }

        .btn-modern .btn-text,
        .btn-modern .btn-icon {
            position: relative;
            z-index: 1;
        }

        .btn-modern .btn-icon {
            transition: transform 0.3s ease;
        }

        .btn-modern:hover .btn-icon {
            transform: translateX(5px);
        }

        /* Responsive Design */
        @media (max-width: 768px) {
            .service-card {
                margin-bottom: 1.5rem;
            }

            .icon-wrapper {
                height: 100px;
            }

            .icon-3d-rotate,
            .icon-3d-flip,
            .icon-3d-depth,
            .icon-3d-pulse {
                width: 60px;
                height: 60px;
                font-size: 2rem;
            }

            .btn-modern {
                padding: 12px 30px;
                font-size: 1rem;
            }
        }

        /* Dark mode support */
        @media (prefers-color-scheme: dark) {
            .service-card {
                border-color: rgba(255, 255, 255, 0.1);
            }

            .service-card h4 {
                color: #fff;
            }

            .service-card p {
                color: #ddd;
            }
        }

        /* Loading animation */
        @keyframes float {

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

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

        .service-card {
            animation: float 6s ease-in-out infinite;
        }

        .service-card:nth-child(2) {
            animation-delay: 1.5s;
        }

        .service-card:nth-child(3) {
            animation-delay: 3s;
        }

        .service-card:nth-child(4) {
            animation-delay: 4.5s;
        }

        /* Additional padding for bottom section */
        .pb-5 {
            padding-bottom: 3rem !important;
        }