.projects {
    padding: 54px 0 62px;
}

.project-grid {
    display: grid;
    gap: 1.25rem;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}

.project-card {
    display: grid;
    gap: 1rem;
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

.project-card::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(140deg, rgba(34, 211, 238, 0.06), rgba(167, 139, 250, 0.04), transparent 60%);
    z-index: -1;
}

.project-card::after {
    content: '';
    position: absolute;
    inset: auto -30% -48% auto;
    width: 190px;
    height: 190px;
    background: radial-gradient(circle, rgba(34, 211, 238, 0.18), transparent 68%);
    pointer-events: none;
    z-index: -1;
}

.project-card h3 {
    margin: 0;
    line-height: 1.25;
}

.project-body {
    color: var(--muted);
    margin: 0;
}

.project-footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.55rem;
}

.project-footer .btn {
    padding: 0.7rem 1rem;
    font-size: 0.9rem;
}