/* ============================================================
   projects.css — Blankette
   Styles pour projects.html et project_detail.html.
   page-hero / project-card / link-arrow sont dans base.css.
   ============================================================ */

/* ---------------------------
   Project detail
--------------------------- */

.project-detail {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
    align-items: start;
}

.detail-img {
    border-radius: var(--radius);
    box-shadow: var(--shadow-hard);
    border: 5px solid var(--black);
    background: var(--paper);
    filter: sepia(0.25) contrast(1.04);
}

/* ---------------------------
   Responsive
--------------------------- */

@media (max-width: 980px) {
    .project-detail {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .project-card {
        box-shadow: 5px 5px 0 var(--black);
    }
}