.project-detail { --detail-navy:#061f2b; }
.project-detail .container { max-width:1440px; }
.project-detail h2 { font-size:28px; line-height:1.2; letter-spacing:-.7px; margin:0 0 18px; }
.project-detail p { line-height:1.6; }
.project-detail .button { font-size:12px; padding:12px 24px; gap:24px; min-height:46px; }
.detail-hero { position:relative; background:var(--detail-navy); color:white; }
.detail-hero-photo { position:absolute; width:100%; height:100%; inset:0; object-fit:cover; object-position:center 42%; }
.detail-hero::after { content:''; position:absolute; inset:0; background:linear-gradient(90deg,rgba(3,25,38,.98),rgba(3,25,38,.84) 32%,rgba(3,25,38,.15) 65%,rgba(3,25,38,.1)); }
.detail-hero-inner { position:relative; z-index:1; min-height:500px; display:grid; grid-template-columns:1fr 360px; gap:70px; align-items:center; }
.detail-hero-copy { padding:34px 0; max-width:650px; }
.detail-back { display:block; font-size:14px; margin:0 0 22px; }
.detail-back span { color:var(--yellow); margin-right:12px; }
.detail-category { display:inline-block; color:var(--ink); background:var(--yellow); padding:8px 16px; font-size:12px; font-weight:700; margin-bottom:16px; }
.detail-hero h1 { font-size:clamp(38px,3.5vw,60px); line-height:1.06; letter-spacing:-1.5px; margin:0 0 18px; font-weight:800; }
.detail-hero-copy>p { max-width:530px; font-size:18px; margin:0; }
.detail-overview { background:#f5f7f8; color:var(--ink); padding:28px; box-shadow:0 10px 30px #00000012; position:relative; margin:24px 0 -28px; }
.detail-overview h2 { font-size:23px; }
.detail-overview dl { display:grid; gap:20px; margin:0 0 26px; }
.detail-overview dl>div { border-left:2px solid var(--red); padding-left:14px; }
.detail-overview dt { font-size:13px; font-weight:700; }
.detail-overview dd { font-size:14px; margin:4px 0 0; color:#62676b; }
.detail-overview .button { width:100%; padding:12px; gap:14px; }
.detail-gallery-strip { display:flex; gap:14px; padding-top:18px; padding-bottom:18px; overflow-x:auto; }
.detail-thumb { flex:1 0 180px; height:180px; min-width:0; }
.detail-thumb-primary { flex-grow:2; max-width:520px; }
.detail-thumb img { width:100%; height:100%; object-fit:cover; display:block; }
.detail-gallery-open { background:var(--detail-navy); color:white; border:0; flex:0 0 170px; padding:24px; display:flex; flex-direction:column; justify-content:center; gap:8px; align-items:center; cursor:pointer; font:14px Manrope,Arial,sans-serif; }
.detail-gallery-open[hidden] { display:none; }
.detail-gallery-symbol { font-size:36px; }
.detail-gallery-open>span:last-child { font-size:12px; color:#d1dbe1; }
.detail-body { display:grid; grid-template-columns:200px minmax(0,1fr) 310px; gap:40px; padding-top:24px; padding-bottom:36px; align-items:start; }
.detail-body-wide { grid-template-columns:200px minmax(0,1fr); }
.detail-section-nav { display:grid; border-left:2px solid #dce2e7; }
.detail-section-nav a { padding:12px 20px; color:#62676b; font-size:13px; }
.detail-section-nav a:first-child { color:var(--red); border-left:2px solid var(--red); margin-left:-2px; font-weight:700; }
.detail-section-nav a:hover { color:var(--red); }
.detail-narrative { max-width:900px; }
.detail-narrative p,.detail-narrative li { color:#62676b; }
.detail-narrative section+section { margin-top:30px; }
.detail-highlights { background:#f3f6f7; padding:24px; }
.detail-highlights h2 { font-size:18px; }
.detail-highlights ul { margin:0; padding-left:20px; color:#62676b; font-size:13px; }
.detail-highlights li { margin-bottom:12px; }
.detail-related { background:#f3f6f7; padding:26px 0; }
.detail-related-heading { display:flex; justify-content:space-between; gap:20px; align-items:center; margin-bottom:18px; }
.detail-related-heading h2 { margin:0; font-size:23px; }
.detail-related-heading>a,.detail-related-grid a { color:var(--red); font-size:13px; font-weight:700; }
.detail-related-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.detail-related-grid article { display:grid; grid-template-columns:40fr 60fr; background:white; min-width:0; }
.detail-related-grid img { width:100%; height:100%; min-height:160px; object-fit:cover; }
.detail-related-grid article>div { padding:20px; }
.detail-related-grid p { font-size:10px; color:#62676b; margin:0 0 8px; }
.detail-related-grid h3 { font-size:17px; line-height:1.25; margin:0 0 14px; }
.detail-related-grid a span { margin-left:10px; }
.project-detail .detail-cta { background:var(--detail-navy); }
.detail-cta .container { min-height:220px; }
.project-detail .detail-cta h2 { font-size:36px; text-transform:none; margin:0; }
.detail-cta p:not(.detail-label) { max-width:620px; }
.detail-label { text-transform:uppercase; font-size:11px; letter-spacing:.5px; border-left:3px solid var(--yellow); padding-left:16px; }
.detail-cta-actions { display:flex; gap:20px; flex:none; }
.detail-not-found { padding-top:100px; padding-bottom:100px; }
.detail-lightbox { border:0; padding:20px; margin:0; width:100vw; max-width:none; height:100dvh; max-height:none; background:#07131b; color:white; }
.detail-lightbox::backdrop { background:#07131b; }
.detail-lightbox-bar { display:flex; justify-content:space-between; align-items:center; height:48px; }
.detail-lightbox button { background:#ffffff15; color:white; border:1px solid #ffffff60; padding:12px 20px; font:600 14px Manrope,Arial,sans-serif; cursor:pointer; }
.detail-lightbox button[hidden] { display:none; }
.detail-lightbox-stage { height:calc(100% - 48px); display:flex; align-items:center; justify-content:center; gap:20px; }
.detail-lightbox figure { margin:0; min-width:0; height:100%; flex:1; display:flex; flex-direction:column; justify-content:center; align-items:center; }
.detail-lightbox figure img { max-width:100%; max-height:calc(100% - 70px); object-fit:contain; }
.detail-lightbox figcaption { padding:16px; font-size:14px; text-align:center; }
@media(max-width:1100px) {
 .detail-hero-inner { grid-template-columns:1fr 320px; gap:35px; }
 .detail-overview { padding:24px; }
 .detail-body { grid-template-columns:170px 1fr; gap:28px; }
 .detail-highlights { grid-column:2; }
 .detail-related-grid { gap:16px; }
 .detail-related-grid article { grid-template-columns:1fr; }
 .detail-related-grid img { height:170px; min-height:0; }
 .detail-cta .container { align-items:flex-start; flex-direction:column; }
}
@media(max-width:800px) {
 .detail-hero-inner { grid-template-columns:1fr; gap:0; padding-bottom:24px; }
 .detail-hero-copy { min-height:420px; max-width:600px; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; }
 .detail-overview { margin:0; }
 .detail-overview dl { grid-template-columns:1fr 1fr; }
 .detail-overview .button { width:auto; }
 .detail-hero-photo,.detail-hero::after { height:420px; }
 .detail-body,.detail-body-wide { grid-template-columns:1fr; }
 .detail-section-nav { display:flex; flex-wrap:wrap; }
 .detail-highlights { grid-column:auto; }
}
@media(max-width:600px) {
 .detail-hero h1 { font-size:38px; }
 .detail-hero-copy>p { font-size:16px; }
 .detail-hero-inner { width:100% !important; padding-bottom:0; }
 .detail-hero-copy { padding:28px 18px; }
 .detail-overview { padding:26px 18px; box-shadow:none; }
 .detail-overview dl { grid-template-columns:1fr; }
 .detail-gallery-strip { gap:10px; }
 .detail-thumb { flex:0 0 220px; height:150px; }
 .detail-gallery-open { flex-basis:140px; padding:18px; }
 .detail-body { padding-top:14px; gap:24px; }
 .detail-section-nav a { padding:10px 14px; font-size:12px; }
 .detail-related-grid { grid-template-columns:1fr; }
 .detail-related-grid article { grid-template-columns:38fr 62fr; }
 .detail-related-grid img { height:100%; min-height:140px; }
 .detail-related-heading { align-items:flex-start; }
 .detail-related-heading h2 { font-size:21px; }
 .detail-related-heading>a { font-size:11px; }
 .project-detail .detail-cta h2 { font-size:29px; }
 .detail-cta-actions { gap:10px; flex-wrap:wrap; }
 .project-detail .detail-cta .button { padding:12px 18px; gap:14px; }
 .detail-lightbox { padding:12px; }
 .detail-lightbox-stage { gap:6px; }
 .detail-lightbox-stage button { padding:12px 8px; }
}
