.project-page { min-height: 100vh; }
.project-detail { padding-top: 76px; }
.project-detail__hero { padding: clamp(7rem,12vw,12rem) clamp(1.25rem,7vw,7.5rem) clamp(3rem,6vw,6rem); }
.project-detail__hero>p { color: #928c9a; font: .68rem var(--mono); letter-spacing: .14em; text-transform: uppercase; }
.project-detail__hero>p span { color: var(--violet); }
.project-detail__hero h1 { max-width: 1100px; margin: 1.2rem 0 2.5rem; font: 700 clamp(4rem,10vw,10rem)/.86 var(--display); letter-spacing: -.08em; }
.project-detail__intro { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 3rem; align-items: end; border-top: 1px solid var(--line); padding-top: 1.5rem; }
.project-detail__intro p { max-width: 630px; margin: 0; color: #aaa4b1; font-size: 1rem; line-height: 1.8; }
.project-detail__intro div { display: flex; gap: .5rem; flex-wrap: wrap; justify-content: flex-end; }
.project-detail__intro span { border: 1px solid var(--line); border-radius: 99px; padding: .5rem .7rem; color: #9b95a3; font: .6rem var(--mono); }
.project-detail__visual { min-height: min(72vw,850px); margin-inline: clamp(1.25rem,4vw,4rem); display: grid; place-items: center; overflow: hidden; border: 1px solid var(--line); background: radial-gradient(circle,#46237c,#100b19 62%); }
.project-detail__visual[data-accent="cyan"] { background: radial-gradient(circle,#075467,#09141b 62%); }.project-detail__visual[data-accent="orange"] { background: radial-gradient(circle,#71321e,#160c0b 62%); }.project-detail__visual[data-accent="lime"] { background: radial-gradient(circle,#3d5419,#0d130b 62%); }
.project-detail__visual strong { font: 800 clamp(8rem,25vw,25rem)/1 var(--display); letter-spacing: -.12em; text-shadow: 0 30px 90px rgba(0,0,0,.4); }.project-detail__visual img { width: 100%; height: 100%; object-fit: cover; }
.project-detail__story { padding: clamp(5rem,10vw,10rem) clamp(1.25rem,10vw,11rem); display: grid; grid-template-columns: .55fr 1.45fr; gap: clamp(2rem,8vw,9rem); }
.project-detail__label { display: flex; justify-content: space-between; height: fit-content; padding-top: .7rem; border-top: 1px solid var(--line); color: #8e8997; font: .65rem var(--mono); text-transform: uppercase; letter-spacing: .12em; }.project-detail__label span { color: var(--cyan); }
.project-detail__copy { font: 500 clamp(1.4rem,2.6vw,2.5rem)/1.5 var(--display); letter-spacing: -.03em; }.project-detail__copy p { margin: 0 0 1.5rem; }.project-detail__copy p+ p { color: #aaa4b2; font: .95rem/1.8 var(--sans); }
.project-detail__links { display: flex; justify-content: center; align-items: center; gap: 2rem; padding: 0 1.25rem 7rem; }
.next-project { min-height: 75vh; padding: 6rem 1.25rem; display: grid; place-items: center; align-content: center; text-align: center; border-top: 1px solid var(--line); background: radial-gradient(circle at center,rgba(134,71,255,.12),transparent 60%); }.next-project p { color: var(--violet); font: .65rem var(--mono); text-transform: uppercase; letter-spacing: .15em; }.next-project h2 { margin: 1rem 0 2.5rem; font: 600 clamp(3.5rem,8vw,8rem)/.9 var(--display); letter-spacing: -.07em; }.next-project h2 em { color: transparent; -webkit-text-stroke: 1px #7c7685; font-style: normal; }
.not-found { min-height: 100vh; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; padding: 2rem; }.not-found>p { color: var(--violet); font: .7rem var(--mono); letter-spacing: .15em; }.not-found h1 { margin: 1rem 0 2rem; font: 700 clamp(3rem,8vw,7rem)/.95 var(--display); letter-spacing: -.07em; }
@media(max-width:760px){.project-detail__intro,.project-detail__story{grid-template-columns:1fr}.project-detail__intro div{justify-content:flex-start}.project-detail__hero h1{font-size:clamp(3.8rem,18vw,6rem)}.project-detail__visual{min-height:75vh}.project-detail__story{padding-block:5rem}.project-detail__links{flex-direction:column}}