/* One visual grammar: focus, decision, outcome. Content works without scripts. */
.site-header{position:sticky;top:0}
.reading-progress{height:2px;background:var(--accent);width:var(--reading-progress,0%)}
.landing .desktop-nav a{position:relative;padding-block:12px}
.landing .desktop-nav a[aria-current="location"]{color:var(--accent)}
.landing .desktop-nav a[aria-current="location"]::after{content:"";position:absolute;bottom:3px;left:0;width:100%;height:1px;background:var(--accent)}
.case-nav{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-block:1px solid #aeb4b9;padding:0;margin-bottom:40px}
.case-nav a{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:10px;padding:20px 16px;border:0;border-right:1px solid #bfc4c8;font-size:12px;min-height:96px;transition:background .18s}
.case-nav a:first-child{padding-left:0}.case-nav a:last-child{border-right:0}
.case-nav a:hover,.case-nav a:focus-visible{background:var(--accent);color:var(--ink)}
.case-nav-result{display:flex;justify-content:space-between;width:100%;gap:10px;font-size:clamp(15px,1.6vw,22px);letter-spacing:-.03em}
.case-nav-result>span{font-size:18px}
.case-story{position:relative}
.case-feature{border-top:0;padding:44px}
.case-feature::before{content:"";position:absolute;left:0;top:0;width:80px;height:4px;background:var(--accent)}
.case-evidence{position:relative;box-shadow:10px 10px 0 #454532}
.case-pair{gap:0;border:1px solid #b9bfc4;margin-top:32px}
.case-pair .case-story{padding:36px}
.case-pair .case-concert{border-left:1px solid #b9bfc4;border-top:0;background:var(--paper)}
.case-pair .result-line{border-top:2px solid var(--ink)}
.case-heading p,.case-period{font-size:12px!important}
.case-photo{margin-top:32px;border:0;background:#e2e5e7;padding:44px}
.case-photo .photo-layout{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:64px;align-items:start}
.case-photo .case-narrative>p{color:#454c52}
.case-focus-step{position:relative;padding:24px 0 24px 24px;border-left:2px solid #aeb4b9;margin:0}
.case-focus-step .decision-label{font-size:12px;margin-bottom:10px;color:#565d63}
.case-focus-step h4{font-size:21px;font-weight:400;line-height:1.3;letter-spacing:-.025em;margin:0 0 12px}
.case-story .case-focus-step p:not([class]){font-size:16px;color:#454c52;margin:0}
.case-focus-step.is-focused{border-left-color:var(--ink)}
.case-focus-step.is-focused::before{content:"";position:absolute;left:-7px;top:26px;width:12px;height:12px;background:var(--accent);border:2px solid var(--ink)}
.case-photo .photo-result{position:sticky;top:120px;background:var(--accent);color:var(--ink);padding:28px;border:0}
.focus-route{display:flex;flex-wrap:wrap;gap:8px;align-items:center;border-bottom:1px solid #998119;padding-bottom:18px;margin-bottom:26px;font-size:12px}
.focus-route [data-focus-label]{padding:5px 3px;border-bottom:2px solid transparent}
.focus-route [data-focus-label].is-focused{border-color:var(--ink)}
.case-photo .focus-boundary{font-size:12px;margin:20px 0 0;color:#41402b}
.case-photo .case-bottom{border-color:#b4bbc1}
.work{position:relative}.work-grid{counter-reset:work}
.work-grid article{counter-increment:work;position:relative}
.work-grid article::before{content:"0" counter(work);display:block;font-size:12px;letter-spacing:.08em;margin-bottom:20px;color:#565019}
.work-grid article:not(:last-child)::after{content:"→";position:absolute;right:0;top:22px;font-size:22px;font-weight:400}
.pricing-sheet{position:relative;background:#303236;padding:8px 28px 24px}
.pricing-note{color:var(--paper)}
.steps-list li{border-top-width:2px}
.landing .channel-option input:focus-visible+span{outline:3px solid var(--ink);outline-offset:4px}
@media(min-width:761px) and (max-height:720px){.case-photo .photo-result{position:static}}
.landing .header-cta:hover,.landing .source-link:hover{color:var(--accent)}
.landing .case-evidence .source-link:hover,.landing .case-pair .source-link:hover,.landing .case-photo .source-link:hover{color:var(--ink);text-decoration-thickness:2px}
@media(max-width:1100px){.case-feature,.case-photo{padding:32px}.case-photo .photo-layout{gap:32px}.case-pair .case-story{padding:28px}.focus-route{gap:5px}.case-photo .photo-result{padding:22px}}
@media(max-width:760px){
.case-nav{grid-template-columns:1fr 1fr;margin-bottom:28px}.case-nav a{padding:16px!important;min-height:88px;font-size:12px}.case-nav a:nth-child(2){border-right:0}.case-nav a:nth-child(-n+2){border-bottom:1px solid #bfc4c8}.case-nav-result{font-size:16px}
.case-feature,.case-photo{padding:26px 20px}.case-evidence{box-shadow:6px 6px 0 #454532}.case-pair{margin-top:24px}.case-pair .case-story{padding:26px 20px}.case-pair .case-concert{border-left:0;border-top:1px solid #b9bfc4}
.case-photo{margin-top:24px}.case-photo .photo-layout{grid-template-columns:1fr;gap:26px}.case-photo .photo-result{position:static;padding:22px 18px}.case-focus-step{padding:20px 0 20px 20px}.case-focus-step h4{font-size:21px}.focus-route{gap:8px}.case-heading{gap:8px}.case-period{line-height:1.5}
.work-grid article::before{margin-bottom:14px}.work-grid article:not(:last-child)::after{content:"↓"}.pricing-sheet{padding:4px 20px 22px}
}
@media(prefers-reduced-motion:reduce){.reading-progress,.case-nav a{transition:none}.case-focus-step::before{animation:none}}
