.project-hero { background: var(--navy); color: #fff; padding: 135px clamp(22px, 12vw, 190px) 82px; }
.project-hero .eyebrow { color: #bfcedd; }
.project-hero h1 { max-width: 1000px; margin: 0; font-size: clamp(48px, 7vw, 92px); letter-spacing: -.065em; line-height: .96; font-weight: 600; }
.project-hero p:last-child { max-width: 700px; margin: 28px 0 0; color: #d2dee9; font-size: 17px; line-height: 1.7; }
.project-page { max-width: 1100px; margin: 0 auto; padding: 86px 28px 130px; }
.project-overview { display: grid; grid-template-columns: 1.2fr .8fr; gap: 70px; margin-bottom: 70px; }
.project-overview h2, .project-section h2 { margin: 0 0 18px; color: var(--navy); font-size: clamp(31px, 4vw, 50px); letter-spacing: -.05em; line-height: 1; }
.project-overview p, .project-section p { font-size: 17px; line-height: 1.78; }
.project-facts { border-top: 1px solid var(--line); }
.project-facts div { border-bottom: 1px solid var(--line); padding: 14px 0; }
.project-facts dt { color: var(--orange); font: 500 10px "DM Mono", monospace; letter-spacing: .1em; }
.project-facts dd { margin: 5px 0 0; font-size: 14px; line-height: 1.5; }
.project-gallery { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; margin: 65px 0; }
.project-gallery img { width: 100%; min-height: 260px; object-fit: cover; background: #d3e0df; }
.project-gallery img:only-child { grid-column: span 2; max-height: 600px; object-fit: contain; }
.project-section { max-width: 820px; margin: 0 auto 62px; }
.project-section ul { padding-left: 20px; font-size: 17px; line-height: 1.78; }
@media (max-width: 800px) { .project-hero { padding: 95px 22px 65px; } .project-page { padding: 65px 22px 85px; } .project-overview { grid-template-columns: 1fr; gap: 38px; } .project-gallery { grid-template-columns: 1fr; } .project-gallery img:only-child { grid-column: auto; } }
