.detail-cover { background:#060817; }
.detail-cover:before { content:""; position:absolute; inset:-20px; background:linear-gradient(rgba(8,5,20,.24),rgba(8,5,20,.46)),url('assets/details/suitcase-cover.jpg') center/cover; filter:blur(16px); opacity:.7; transform:scale(1.08); }
.detail-cover img { position:relative; z-index:2; display:block; width:100%; height:100%; object-fit:cover; object-position:center top; }
.detail-project.is-active { cursor:pointer; }
.detail-project.is-active .project-info:after { content:"OPEN ↗"; position:absolute; right:14px; top:20px; color:#a879ff; font-size:7px; letter-spacing:1.5px; }
.detail-modal { position:fixed; inset:0; z-index:200; overflow-y:auto; padding:0 0 80px; background:radial-gradient(circle at 80% 0,rgba(106,58,202,.2),transparent 30%),#080714; opacity:0; visibility:hidden; transform:translateY(18px); transition:opacity .45s,visibility .45s,transform .45s; }
.detail-modal.open { opacity:1; visibility:visible; transform:none; }
.detail-view { width:100%; }
.detail-full-image { max-width:900px; margin:auto; overflow:hidden; border:1px solid rgba(174,132,255,.18); border-radius:18px; background:#03050d; box-shadow:0 35px 100px rgba(0,0,0,.5); }
.detail-full-image img { display:block; width:100%; height:auto; }
@media(max-width:760px){.detail-modal{padding-bottom:55px}.detail-full-image{border-radius:10px}.detail-next-work{padding:0 14px}}
