.project-case-page{background:radial-gradient(ellipse at 95% 8%,rgb(var(--accent-rgb) / 0.0471),transparent 45%),var(--bg)}
.project-case-page .content-view{display:flex;align-items:stretch;min-height:100dvh;padding:clamp(100px,16dvh,138px) 5.8vw clamp(24px,4dvh,48px)}
.project-case{display:flex;flex-direction:column;width:100%;max-width:1460px;min-width:0;margin:0 auto}
.case-topline{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:clamp(18px,3.2dvh,42px);font:11px/1.6 Plex,monospace}
.case-topline p{margin:0;color:var(--muted)}
.case-back{display:inline-flex;align-items:center;gap:14px;min-height:32px;font:11px/1.6 Plex,monospace;color:var(--muted);transition:color .3s}
.case-back:hover,.case-back:focus-visible{color:var(--accent-alt)}
.case-heading{margin-bottom:clamp(22px,3.6dvh,38px)}
.case-category{margin:0 0 clamp(10px,1.8dvh,14px);font:11px/1.6 Plex,monospace;color:var(--accent)}
.case-heading h1{margin:0;font:180 clamp(64px,min(10.8vw,16dvh),166px)/.95 Roboto Flex,Arial,sans-serif;font-variation-settings:'opsz' 144,'wdth' 80;letter-spacing:-.04em;overflow-wrap:anywhere;animation:case-arrive .9s var(--ease) both}
.case-overview{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.8fr);align-items:start;gap:8vw;padding-bottom:clamp(24px,4.5dvh,48px)}
.case-copy>p{max-width:55ch;margin:0;color:var(--copy);font:350 clamp(15px,1.35vw,19px)/1.65 Roboto Flex,Arial,sans-serif}
.case-visit{position:relative;display:inline-flex;gap:44px;align-items:center;min-height:44px;margin-top:22px;padding:4px 0;color:var(--ink);font:11px/1.5 Plex,monospace;transition:color .3s,gap .5s var(--ease)}
.case-visit-text{display:grid;gap:6px;padding:6px 0}
.case-domain{color:var(--muted);font-size:11px}
.case-visit::after{content:'';position:absolute;inset:auto 0 0;height:1px;background:linear-gradient(90deg,var(--accent),var(--accent-alt));transform:scaleX(.45);transform-origin:left;transition:transform .6s var(--ease)}
.case-visit>span[aria-hidden]{font-size:22px;color:var(--accent-alt);transition:translate .4s var(--ease)}
.case-visit:hover,.case-visit:focus-visible{color:var(--accent-alt);gap:54px}
.case-visit:hover::after,.case-visit:focus-visible::after{transform:scaleX(1)}
.case-visit:hover>span[aria-hidden],.case-visit:focus-visible>span[aria-hidden]{translate:2px -2px}
.case-details{display:grid;gap:22px;margin:4px 0 0}
.case-details dt{margin-bottom:8px;color:var(--detail-label);font:11px/1.5 Plex,monospace;text-transform:uppercase;letter-spacing:.1em}
.case-details dd{margin:0;color:var(--detail);font:12px/1.7 Roboto Flex,Arial,sans-serif}
.case-navigation{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-top:auto;padding-top:clamp(16px,2.8dvh,30px);border-top:1px solid var(--line)}
.case-next{display:grid;justify-items:end;gap:14px;max-width:70%;text-align:right}
.case-next>span{font:11px/1.6 Plex,monospace;color:var(--muted)}
.case-next>span>span{display:inline-block;margin-left:20px;color:var(--accent-alt);transition:translate .4s var(--ease)}
.case-next strong{font:260 clamp(24px,3vw,48px)/1.1 Roboto Flex,Arial,sans-serif;font-variation-settings:'opsz' 100,'wdth' 85;letter-spacing:-.025em;transition:color .3s}
.case-next:hover strong,.case-next:focus-visible strong{color:var(--accent)}
.case-next:hover>span>span{translate:2px -2px}
@keyframes case-arrive{from{opacity:0;translate:0 12px}to{opacity:1;translate:0 0}}
@media(max-width:760px){
 .project-case-page .content-view{padding:104px 5vw 24px}
 .case-topline{margin-bottom:24px;font-size:11px;gap:16px}
 .case-back{font-size:11px}
 .case-category{font-size:11px;margin-bottom:12px}
 .case-heading{margin-bottom:24px}
 .case-heading h1{font-size:clamp(54px,13.5vw,100px)}
 .case-overview{grid-template-columns:1fr;gap:24px;padding-bottom:28px}
 .case-copy>p{font-size:16px;line-height:1.6}
 .case-visit{margin-top:18px}
 .case-details{grid-template-columns:1fr 1fr;gap:22px;margin:0}
 .case-details dd{font-size:11px}
 .case-navigation{gap:18px}
 .case-next{max-width:60%}
}
@media(prefers-reduced-motion:reduce){.case-heading h1{animation:none}}
