/* Gradient-border card that still uses Bootstrap card internals */
.ga-card {
    /* keep your gradient border */
    border: 2px solid transparent;
    border-radius: 1rem;
    background:
    /* inner content surface */
    linear-gradient(var(--bs-body-bg), var(--bs-body-bg)) padding-box,
    /* outer border gradient (variant below) */
    var(--ga-border-gradient, linear-gradient(135deg, var(--bs-primary), var(--bs-pink))) border-box;
    /* equal-height behavior */
    display: flex;
    flex-direction: column; /* body grows, footer sticks */
    overflow: hidden; /* keep rounded corners clean */
    box-shadow: 0 8px 28px rgba(0,0,0,.06);
    transition: transform .18s ease, box-shadow .25s ease;
}

    /* grow the body so all cards even out regardless of copy length */
    .ga-card .card-body {
        flex: 1 1 auto;
    }

/* gradient footer "cap" that always sits at the bottom */
.card-footer.ga-card-cap {
    min-height: 40px; /* your chosen height */
    border-top: 0; /* remove default card footer line */
    background: var(--ga-border-gradient, linear-gradient(135deg, var(--bs-primary), var(--bs-pink)));
    /* keep corners perfectly rounded inside the 2px border */
    border-bottom-left-radius: calc(1rem - 2px);
    border-bottom-right-radius: calc(1rem - 2px);
    padding: 0; /* visual strip */
}

/* hover lift */
.ga-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 16px 36px rgba(0,0,0,.12);
}

/* your color variants (unchanged) */
.ga-card-uv-pink {
    --ga-border-gradient: linear-gradient(135deg, var(--bs-ultraviolet), var(--bs-pink));
}

.ga-card-blue-indigo {
    --ga-border-gradient: linear-gradient(135deg, var(--bs-blue), var(--bs-indigo));
}

.ga-card-orange-cyan {
    --ga-border-gradient: linear-gradient(135deg, var(--bs-orange), var(--bs-cyan));
}

.ga-card-yellow-green {
    --ga-border-gradient: linear-gradient(135deg, var(--bs-yellow), var(--bs-green));
}


/* Process stacked: simple cards + horizontal dividers */
#process-stacked .process-card {
    background: var(--bs-tertiary-bg);
    border-radius: 1rem;
    padding: 3.25rem 3.25rem;
}

#process-stacked .process-divider {
    border: 0;
    height: 1px;
    background-color: var(--bs-border-color, rgba(0,0,0,.125)); 
    margin: .75rem 0;
}

#process-stacked .illustration-wrapper {
    height: 400px;
}

@media (max-width: 767.98px) {
    #process-stacked .illustration-wrapper {
        height: 280px;
    }
}

#process-stacked .illustration-img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}