/* Only the new project pages; the existing Portfolio grid is unchanged. */
.project-detail {
    min-height: calc(100dvh - 98px);
    padding: 132px 24px 85px;
    color: var(--white);
    background: var(--black);
}
.detail-inner { width: 100%; max-width: var(--max-width); margin-inline: auto; }
.detail-back { display: inline-flex; align-items: center; min-height: 44px; margin-bottom: 38px; color: #b5bfce; font-size: 14px; }
.detail-back:hover { color: var(--white); }
.detail-back:focus-visible { outline: 3px solid #9bc2ff; outline-offset: 4px; }
.detail-feedback { color: #b5bfce; }
.detail-feedback:empty { display: none; }
.detail-retry { margin-top: 20px; cursor: pointer; }
.detail-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; margin-bottom: 22px; }
.project-detail .detail-meta .project-status { margin-bottom: 0; }
.detail-heading h1 { font-size: clamp(48px, 7vw, 92px); font-weight: 800; line-height: 1; letter-spacing: -3.5px; overflow-wrap: anywhere; }
.detail-description { color: #b5bfce; font-size: 17px; line-height: 1.7; white-space: pre-line; overflow-wrap: anywhere; }
.detail-heading .detail-description { max-width: 780px; margin-top: 24px; }
.detail-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.detail-heading .detail-actions { margin-top: 30px; }
.detail-actions .button { min-height: 44px; text-align: center; }
.detail-preview { margin: 48px 0 52px; }
.project-detail .detail-preview .project-image { height: auto; aspect-ratio: 16 / 10; border: 1px solid #2a3544; }
.detail-preview figcaption { margin-top: 12px; color: #a6b4c9; font-size: 12px; }
.detail-overview { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 48px; }
.detail-section { min-width: 0; padding: 32px 0; border-top: 1px solid #2a3544; }
.detail-section h2 { margin-bottom: 20px; font-size: clamp(26px, 3vw, 36px); line-height: 1.15; letter-spacing: -1px; }
.detail-technologies { list-style: none; }
.detail-features { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; list-style: none; }
.detail-features li { padding: 24px; background: #111820; border: 1px solid #2a3544; color: #d7e2f2; font-size: 15px; overflow-wrap: anywhere; }
.detail-gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.detail-gallery figure { min-width: 0; border: 1px solid #2a3544; background: #111820; }
.detail-gallery img { width: 100%; height: auto; }
.detail-gallery .preview-note { padding: 24px; }
.detail-back-bottom { margin: 24px 0 0; }
@media (max-width: 950px) {
    .detail-overview { gap: 28px; }
    .detail-features { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
    .project-detail { padding: 108px 16px 64px; }
    .detail-back { margin-bottom: 28px; }
    .detail-heading h1 { font-size: clamp(43px, 12vw, 68px); letter-spacing: -2px; }
    .detail-description { font-size: 16px; }
    .detail-actions { flex-direction: column; }
    .detail-actions .button { width: 100%; }
    .detail-preview { margin: 32px 0 36px; }
    .detail-overview { grid-template-columns: 1fr; gap: 0; }
    .detail-section { padding: 28px 0; }
    .detail-features, .detail-gallery { grid-template-columns: 1fr; gap: 16px; }
}

/* Versions belong to one project presentation, never separate cards. */
.detail-version-intro{color:#aebbd0;margin:12px 0 22px;}
.detail-version-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;}
.detail-version-card{padding:14px;border:1px solid #2a3544;border-radius:14px;background:#111820;min-width:0;}
.detail-version-card img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;border-radius:8px;}
.detail-version-card h3{font-size:21px;margin:16px 0;}
.detail-version-features{padding-left:18px;color:#b5bfce;font-size:14px;line-height:1.6;margin:0 0 20px;}
.detail-version-features li+li{margin-top:8px;}
.detail-version-card .button{border-radius:8px;min-height:44px;}
.version-pending{display:inline-block;padding:8px 12px;border:1px solid #7b5b37;border-radius:8px;color:#f7cc85;font-size:13px;}
.version-pending-note{margin:12px 0 0;color:#aebbd0;font-size:12px;}
@media(max-width:720px){.detail-version-grid{grid-template-columns:1fr;}}