.project-detail-dialog { width: min(1060px, calc(100vw - 36px)); max-height: calc(100svh - 36px); padding: 0; overflow: auto; border: 1px solid rgba(168, 220, 186, .62); background: radial-gradient(ellipse at 85% 5%, rgba(60, 143, 114, .18), transparent 40%), #081a25; color: #edf9f1; box-shadow: 0 40px 130px #000; }
.project-detail-dialog::backdrop { background: rgba(1, 6, 13, .87); backdrop-filter: blur(11px); }
.project-detail-top { position: sticky; z-index: 2; top: 0; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 14px 25px; border-bottom: 1px solid rgba(168, 220, 186, .34); background: rgba(6, 26, 35, .97); color: #b9e5a9; font: 700 10px var(--mono); letter-spacing: .12em; }
.project-detail-top button { width: 36px; height: 36px; border: 1px solid rgba(168, 220, 186, .4); background: transparent; color: #b9e5a9; cursor: pointer; }
.project-detail-body { padding: clamp(24px, 5vw, 65px); }
.project-detail-kicker, .project-detail-grid section > span { color: #b9e5a9; font: 700 10px var(--mono); letter-spacing: .14em; }
.project-detail-body h2 { max-width: 780px; margin: 12px 0 25px; font: 800 clamp(57px, 8vw, 105px)/.79 var(--display); }
.project-detail-body h2 em { color: #b9e5a9; font-style: normal; }
.project-detail-lead { max-width: 760px; margin: 0 0 38px; color: #d0e4df; font-size: clamp(17px, 1.7vw, 22px); line-height: 1.4; }
.project-detail-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 30px; border-top: 1px solid rgba(168, 220, 186, .28); }
.project-detail-grid section { padding: 28px 0 30px; border-bottom: 1px solid rgba(168, 220, 186, .28); }
.project-detail-grid h3 { margin: 12px 0; font: 700 clamp(31px, 3vw, 43px)/.9 var(--display); text-transform: uppercase; }
.project-detail-grid p { max-width: 440px; margin: 0; color: #bacfd0; font-size: 15px; line-height: 1.55; }
.project-detail-close-note { margin: 26px 0 0; color: #b9e5a9; font: 600 10px/1.5 var(--mono); letter-spacing: .05em; }
@media (max-width: 650px) { .project-detail-grid { grid-template-columns: 1fr; } .project-detail-body h2 { font-size: clamp(54px, 13vw, 80px); } }
