/* First project: an image-led feature and a quieter, readable case study. */
#projects .project-spotlight{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(2rem,5vw,5rem);align-items:center;padding:2rem 0 3.5rem;border-top:1px solid var(--bd);border-bottom:1px solid var(--bd);margin-bottom:3rem}
.spotlight-visual{display:block;text-decoration:none;min-width:0}
.work-visual{position:relative;aspect-ratio:1.2;overflow:hidden;background:var(--sf);border:1px solid var(--bd)}
.work-visual.has-image{display:grid;place-items:center}.work-visual.has-image img{display:block;width:100%;height:100%;object-fit:contain}
.work-visual.is-placeholder{padding:clamp(1.1rem,2.5vw,2rem);display:flex;flex-direction:column;justify-content:space-between;background:linear-gradient(90deg,transparent calc(50% - .5px),var(--bd) 50%,transparent calc(50% + .5px)),var(--sf)}
.work-visual-top,.work-visual-bottom{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:center;gap:1rem;font:400 .58rem/1.7 var(--fm);letter-spacing:.07em;color:var(--mu)}
.work-visual-top>span:last-child{font-size:1.3rem;color:var(--ak)}
.work-visual-bottom{align-items:end;letter-spacing:0}.work-visual-bottom>span:first-child{max-width:15ch;color:var(--tx);font:500 clamp(.9rem,1.6vw,1.4rem)/1.3 var(--fd)}
.work-visual-bottom>span:last-child{max-width:15ch;text-align:right}
.work-visual-center{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none}
.work-orbit{position:absolute;width:62%;aspect-ratio:1;border:1px solid var(--bd);border-radius:50%}
.work-orbit::after{content:'';position:absolute;top:14%;right:14%;width:8px;height:8px;border-radius:50%;background:var(--ak)}
.work-number{font:400 clamp(5rem,12vw,12rem)/1 var(--fd);font-kerning:none;letter-spacing:-.06em;color:var(--ak);transition:transform .6s var(--eo)}
.spotlight-visual:hover .work-number{transform:translateY(-5px)}
.spotlight-copy{min-width:0}
.spotlight-eyebrow{display:flex;align-items:center;gap:.6rem;margin:0 0 1.5rem;font:400 .57rem var(--fm);letter-spacing:.07em;color:var(--mu)}
.spotlight-mark{width:6px;height:6px;background:var(--ak);border-radius:50%;flex-shrink:0}.spotlight-index{margin-left:auto;color:var(--ak)}
#projects .spotlight-copy h3{font:500 clamp(2rem,3.5vw,3.8rem)/1.08 var(--fd);font-kerning:none;letter-spacing:-.025em;margin:0 0 1.3rem}
.spotlight-copy h3 a{color:var(--tx);text-decoration:none}
.spotlight-problem{font-size:1rem;line-height:1.8;color:var(--mu);max-width:38ch;margin:0}
.spotlight-role{margin:1.6rem 0 1rem;display:grid;gap:.35rem}.spotlight-role dt{font:400 .6rem var(--fm);color:var(--mu)}.spotlight-role dd{margin:0;font-size:.9rem}
.spotlight-tags{display:flex;gap:.4rem;flex-wrap:wrap}.spotlight-tags>span{font:400 .61rem/1.5 var(--fm);border:1px solid var(--bd);padding:.3rem .5rem;color:var(--mu)}
.spotlight-open{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:1.7rem;padding:.85rem 0;border-block:1px solid var(--bd);font:500 .78rem var(--fm);text-decoration:none;min-height:48px;transition:color .2s}
.spotlight-open>span:last-child{color:var(--ak);font-size:1.25rem;transition:transform .25s}.spotlight-open:hover{color:var(--ak)}.spotlight-open:hover>span:last-child{transform:translate(2px,-2px)}
.spotlight-note{font:400 .58rem/1.7 var(--fm);color:var(--mu);margin:.75rem 0 0}
.case-study{max-width:1240px;margin:0 auto}
.case-cover{padding:clamp(2.5rem,6vw,5.5rem) 0 2.5rem}
.case-cover-top{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1rem}
.case-kicker,.case-sample{font:400 .6rem/1.8 var(--fm);letter-spacing:.05em;color:var(--mu);margin:0}.case-sample>span{color:var(--ak);margin-right:.3rem}
.case-cover h1{font:500 clamp(2.8rem,7vw,6.5rem)/1.05 var(--fd);font-kerning:none;letter-spacing:-.025em;margin:1.5rem 0;max-width:15ch;overflow-wrap:anywhere}
.case-standfirst{font:400 clamp(1.1rem,2vw,1.55rem)/1.65 var(--fd);max-width:43ch;color:var(--mu);margin:0}
.case-facts{display:grid;grid-template-columns:1fr 1fr 1.5fr;gap:2rem;margin:2.5rem 0 0;padding-top:1.2rem;border-top:1px solid var(--bd)}
.case-facts dt{font:400 .58rem var(--fm);color:var(--mu);margin-bottom:.65rem}.case-facts dd{margin:0;font-size:.9rem;line-height:1.6}
.case-link-note{font:400 .6rem/1.8 var(--fm);color:var(--mu);margin:1.1rem 0 0}
.case-showcase{margin:0}.case-showcase .work-visual{aspect-ratio:2.1}.case-showcase .work-orbit{width:32%}.case-showcase .work-number{font-size:clamp(6rem,17vw,16rem)}
.case-showcase figcaption{font:400 .6rem/1.8 var(--fm);color:var(--mu);margin-top:.7rem}
.case-reading{display:grid;grid-template-columns:minmax(180px,.7fr) minmax(0,2fr);gap:clamp(2rem,6vw,6rem);margin:clamp(3rem,7vw,6rem) 0}
.case-contents{position:sticky;top:2rem;align-self:start;border-top:1px solid var(--bd);padding-top:1rem;display:grid;gap:.15rem}
.case-contents>p{font:400 .6rem var(--fm);letter-spacing:.08em;color:var(--mu);margin:0 0 1rem}
.case-contents>a{display:flex;gap:.75rem;align-items:center;min-height:44px;font:400 .65rem/1.6 var(--fm);text-decoration:none;color:var(--mu)}
.case-contents>a>span:first-child{color:var(--ak)}.case-contents>a:hover{color:var(--tx)}.case-contents .case-back{border-top:1px solid var(--bd);margin-top:1.25rem;padding-top:.7rem}
#project-detail .case-chapter{display:grid;grid-template-columns:2.2rem minmax(0,1fr);gap:1rem;max-width:none;padding:0 0 2.7rem;margin:0 0 2.7rem;border-bottom:1px solid var(--bd);scroll-margin-top:2rem}
.case-chapter-number{font:400 .6rem var(--fm);color:var(--ak);margin:.65rem 0 0;white-space:nowrap}
.case-chapter h2{font:500 clamp(1.55rem,2.7vw,2.5rem)/1.15 var(--fd);letter-spacing:-.025em;margin:0 0 1.2rem}
.case-chapter>div>p{font-size:1.05rem;line-height:1.9;color:var(--mu);max-width:57ch;margin:0}
.case-tools{display:grid;gap:.8rem;margin-top:1.5rem}.case-tools>span{font:400 .6rem var(--fm);color:var(--mu)}
.case-unwritten{display:flex;gap:1rem;align-items:start;padding:1.1rem 0}.case-unwritten-mark{font-size:1.8rem;color:var(--ak);line-height:1}.case-unwritten h3{font:500 1.1rem var(--fd);margin:0 0 .6rem}.case-unwritten p{font:400 .8rem/1.8 var(--fd);color:var(--mu);margin:0}
.case-next{margin:0;padding:1.5rem 0 2rem;border-top:1px solid var(--bd);max-width:none}
.case-next>div{display:flex;justify-content:space-between;gap:1rem;color:var(--mu);font:400 .6rem/1.8 var(--fm)}.case-next>div>p{margin:0}
.case-next>a{display:flex;justify-content:space-between;align-items:center;gap:1rem;text-decoration:none;font:500 clamp(1.7rem,4vw,3.5rem)/1.2 var(--fd);letter-spacing:-.025em;padding:1.5rem 0}.case-next>a>span:last-child{color:var(--ak)}
@media(max-width:950px){#projects .project-spotlight{gap:2rem}.work-visual{aspect-ratio:1}.spotlight-copy h3{font-size:2rem}.case-reading{grid-template-columns:160px minmax(0,1fr);gap:2rem}}
@media(max-width:700px){
 #projects .project-spotlight{grid-template-columns:1fr;gap:1.5rem;padding:1.3rem 0 2.5rem;margin-bottom:2.5rem}
 .work-visual{aspect-ratio:1.2}.work-number{font-size:7.5rem}.work-visual-bottom>span:first-child{font-size:1rem}
 .spotlight-eyebrow{margin-bottom:1rem}.spotlight-copy h3{font-size:2.3rem}.spotlight-problem{font-size:.95rem}.spotlight-role{margin-top:1.2rem}.spotlight-open{margin-top:1.3rem}
 .case-cover{padding:2.5rem 0 1.8rem}.case-cover-top{gap:.7rem}.case-cover h1{font-size:clamp(2.4rem,10vw,4rem);margin:1.3rem 0}.case-standfirst{font-size:1.1rem}
 .case-facts{grid-template-columns:1fr 1fr;gap:1.4rem;margin-top:1.8rem}.case-facts>div:last-child{grid-column:1/-1}
 .case-showcase .work-visual{aspect-ratio:1.2}.case-showcase .work-orbit{width:62%}.case-showcase .work-number{font-size:8rem}
 .case-reading{grid-template-columns:1fr;gap:2rem;margin:2.5rem 0 0}
 .case-contents{position:static;grid-template-columns:1fr 1fr;column-gap:1rem}.case-contents>p{grid-column:1/-1}.case-contents>a{font-size:.6rem;gap:.5rem}.case-contents .case-back{display:none}
 #project-detail .case-chapter{grid-template-columns:1.4rem minmax(0,1fr);gap:.65rem;margin-bottom:2rem;padding-bottom:2rem}
 .case-chapter h2{font-size:1.7rem}.case-chapter>div>p{font-size:.98rem;line-height:1.85}.case-chapter-number{margin-top:.5rem}
 .case-next>div{flex-direction:column;gap:.3rem}.case-next>a{font-size:1.8rem}
}
@media(prefers-reduced-motion:reduce){.spotlight-visual:hover .work-number,.spotlight-open:hover>span:last-child{transform:none}}