.project-card {
            background: white;
            border-radius: 1.5rem;
            overflow: hidden;
            box-shadow: 0 15px 30px -10px rgba(0,0,0,0.1);
            transition: all 0.4s cubic-bezier(0.2, 0.9, 0.4, 1.1);
            height: 100%;
            display: flex;
            flex-direction: column;
        }
        .project-card:hover {
            transform: translateY(-10px);
            box-shadow: 0 25px 40px -12px rgba(0,0,0,0.2);
        }
        .project-img {
            height: 200px;
            object-fit: cover;
            width: 100%;
            transition: transform 0.5s ease;
        }
        .project-card:hover .project-img {
            transform: scale(1.05);
        }
        .project-body {
            padding: 1.5rem;
            flex: 1;
            display: flex;
            flex-direction: column;
        }
        .project-title {
            font-weight: 700;
            margin-bottom: 0.75rem;
            color: #0f172a;
        }
        .project-description {
            color: #475569;
            font-size: 0.9rem;
            line-height: 1.5;
            margin-bottom: 1.5rem;
            flex: 1;
        }
        .project-buttons {
            display: flex;
            gap: 0.75rem;
            flex-wrap: wrap;
            margin-top: auto;
        }
        .btn-project {
            background: #0f172a;
            color: white;
            border: none;
            border-radius: 40px;
            padding: 0.4rem 1rem;
            font-size: 0.8rem;
            font-weight: 600;
            transition: all 0.3s;
            text-decoration: none;
            display: inline-flex;
            align-items: center;
            gap: 0.5rem;
        }
        .btn-project i {
            font-size: 0.9rem;
        }
        .btn-project:hover {
            background: #facc15;
            color: #0f172a;
            transform: translateY(-2px);
        }
        .btn-outline-project {
            background: transparent;
            border: 2px solid #0f172a;
            color: #0f172a;
        }
        .btn-outline-project:hover {
            background: #0f172a;
            color: white;
            border-color: #0f172a;
        }
        .category-badge {
            display: inline-block;
            background: #f1f5f9;
            color: #0f172a;
            border-radius: 40px;
            padding: 0.25rem 1rem;
            font-size: 0.7rem;
            font-weight: 600;
            margin-bottom: 1rem;
        }
        .section-header {
            text-align: center;
            margin-bottom: 3rem;
        }
        .filter-btn {
            background: transparent;
            border: 2px solid #0f172a;
            border-radius: 40px;
            padding: 0.5rem 1.5rem;
            margin: 0 0.5rem;
            font-weight: 600;
            transition: all 0.3s;
        }
        .filter-btn.active, .filter-btn:hover {
            background: #0f172a;
            color: white;
        }
        @media (max-width: 768px) {
            .filter-btn {
                margin: 0.25rem;
                padding: 0.35rem 1rem;
                font-size: 0.8rem;
            }
        }