/* ===== Portfolio Section ===== */
.portfolio {
    padding: var(--section-space-desktop) 0;
}

.portfolio__title {
    font-size: clamp(28px, 4vw, 56px);
    font-weight: 400;
    letter-spacing: var(--letter-spacing);
    line-height: 1.1;
    text-transform: uppercase;
    color: var(--color-text);
    margin-bottom: 48px;
}

/* Responsive utilities */
.hide-mobile { display: inline; }
.hide-desktop { display: none; }

/* Portfolio component grid show/hide */
.portfolio-masonry__grid--desktop { display: block; }
.portfolio-masonry__grid--mobile { display: none; }

/* Loader & sentinel hidden on homepage */
.portfolio-masonry__loader,
.portfolio-masonry__sentinel {
    display: none;
}

/* Footer */
.portfolio__footer {
    text-align: center;
    margin-top: 48px;
}

/* ===== Mobile ===== */
@media (max-width: 768px) {
    .portfolio {
        padding: var(--section-space-mobile) 0;
    }

    .portfolio__title {
        font-size: clamp(24px, 7vw, 32px);
        margin-bottom: 32px;
    }

    .hide-mobile { display: none; }
    .hide-desktop { display: inline; }

    /* Show mobile grid, hide desktop */
    .portfolio-masonry__grid--desktop { display: none; }
    .portfolio-masonry__grid--mobile { display: block; }

    .portfolio__footer {
        margin-top: 32px;
    }

    .portfolio__footer .btn--outline {
        width: 100%;
        background-color: var(--color-dark);
        color: #FFFFFF;
        border-color: var(--color-dark);
    }
}