/* Blog Card Hover Effects */
        .blog-card {
            position: relative;
            overflow: hidden;
            cursor: pointer;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }

.blog-card:hover {
            transform: translateY(-8px);
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
        }

.blog-card img {
            transition: transform 0.5s ease, filter 0.3s ease;
        }

.blog-card:hover img {
            transform: scale(1.08);
        }

/* Category Badge */
        .category-badge {
            background: linear-gradient(135deg, #6e6e6e 0%, #4a4a4a 100%);
            transition: all 0.3s ease;
        }

.blog-card:hover .category-badge {
            transform: translateY(-2px);
        }

/* Read More Link */
        .read-more {
            transition: all 0.3s ease;
        }

.blog-card:hover .read-more {
            color: #4a4a4a;
        }

/* Pagination */
        .pagination-btn {
            transition: all 0.3s ease;
        }

.pagination-btn:hover:not(:disabled) {
            background-color: #6e6e6e;
            color: white;
            transform: translateY(-2px);
        }

.pagination-btn:disabled {
            opacity: 0.5;
            cursor: not-allowed;
        }

.pagination-btn.active {
            background-color: #6e6e6e;
            color: white;
        }

/* Loading Skeleton */
        @keyframes shimmer {
            0% {
                background-position: -1000px 0;
            }

            100% {
                background-position: 1000px 0;
            }
        }

.skeleton {
            animation: shimmer 2s infinite;
            background: linear-gradient(to right, #1d1d1f 4%, #2d2d2f 25%, #1d1d1f 36%);
            background-size: 1000px 100%;
        }

/* Contact Modal Animation */
        #contact-modal-overlay .modal-content {
            transform: scale(0.5);
            opacity: 0;
            transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.3s ease-out;
        }