/* Shared detail rhythm. Existing color and background tokens stay unchanged. */
:root{--feedback-time:220ms;--feedback-ease:cubic-bezier(.22,1,.36,1)}
.section .marker:before,.gallery-section .marker:before{width:24px;height:2px;background:var(--blue);opacity:.75}
section:hover .marker:before{width:24px}
.section h2{font-weight:650;line-height:1.18}.section h3{line-height:1.3}
p{line-height:1.75}.caption,figcaption,.context-note,.embed-note{font-size:14px;line-height:1.65;color:var(--muted)}
.tile>.media,.tile>.portfolio-cover,.home-playground,.button{box-shadow:none}
.website-screen .context-media,.screen-scroll,.embed-shell,.case-video video{box-shadow:0 10px 28px -24px rgba(0,0,0,.22)}
.website-points>div,.decision-grid>div{border-top-width:1px}.focus-row,.experience{border-color:var(--border)}
.tile,.button,.button .arrow,.discipline h2,.discipline-link,.nav-subpages a{transition-duration:var(--feedback-time);transition-timing-function:var(--feedback-ease)}
@media(hover:hover) and (pointer:fine){.tile:hover{transform:translateY(-3px)}.button:hover{transform:translateY(-2px);box-shadow:none}.tile:hover>.portfolio-cover,.tile:hover .media{box-shadow:none}.discipline:hover h2,.discipline:hover .discipline-link,.button:hover .arrow{transform:translateX(3px)}}
/* Case studies: 40px to 50px between sections, with a smaller mobile increase. */
.website-case .section,.portfolio-story .section{padding-block:50px}
.website-case .wrap.stack,.portfolio-story .section>.wrap.stack{gap:30px}
.website-case h2,.portfolio-story .section h2{margin-bottom:8px}
.website-case p:not(.mono):not(.caption),.portfolio-story .case-copy p,.portfolio-story .story-point p,.portfolio-story .case-section p{max-width:68ch;line-height:1.75}
.website-overview{gap:48px}.website-overview>.stack{gap:20px}
.website-points{gap:40px}.website-points>.case-copy{gap:16px;padding-top:24px}.website-points .case-copy h3:not(:first-child){margin-top:0}
.website-screen-grid{gap:52px}.contextual-screen figcaption{margin-bottom:22px;gap:20px 32px;align-items:start}.contextual-screen figcaption p{max-width:65ch}
.context-controls{padding-top:22px;gap:16px 28px}.context-note{margin-top:16px}.website-detail{padding-top:26px;gap:40px}.website-facts{padding-bottom:18px;gap:32px}
.portfolio-story .story-point{padding-top:24px}.portfolio-story .story-point h3{margin-bottom:18px}.portfolio-story .story-point p+p{margin-top:18px}
.portfolio-story .case-copy:has(>.story-point){column-gap:40px;row-gap:36px}
.portfolio-story .screen-figure figcaption,.portfolio-story .case-hero figcaption{margin-top:20px}
.website-case .website-outcome{max-width:68ch}.website-next{padding-block:8px}
@media(max-width:700px){
 .website-case .section,.portfolio-story .section{padding-block:34px}
 .website-case .wrap.stack,.portfolio-story .section>.wrap.stack{gap:24px}
 .website-case h2,.portfolio-story .section h2{margin-bottom:4px}
 .website-overview{gap:28px}.website-points{gap:28px}.website-points>.case-copy{padding-top:20px;gap:12px 16px}
 .website-screen-grid{gap:34px}.contextual-screen figcaption{margin-bottom:18px;gap:10px}.context-controls{padding-top:18px;gap:12px 20px}
 .website-facts{gap:22px;padding-bottom:10px}.website-detail{gap:20px;padding-top:22px}
 .portfolio-story .case-copy:has(>.story-point){gap:28px}.portfolio-story .story-point h3{margin-bottom:14px}
}
@media(prefers-reduced-motion:reduce){.tile,.button,.button .arrow,.discipline h2,.discipline-link,.nav-subpages a{transition:none}}
@media(max-width:800px){.website-points>.case-copy>p:not(.mono){grid-column:2}}
/* Less repeated ornament; let the project images carry the visual weight. */
.section .marker:before,.gallery-section .marker:before{display:none}.section .marker{margin-top:0}
.website-points>div,.decision-grid>div{border-top:0;padding-top:0}.website-points>.case-copy>.mono{display:none}
.edited-story .section,.website-case .section{border-block:0;background:var(--bg)}
.edited-story .section+.section,.website-case .section+.section{padding-top:32px}
.edited-story .case-hero{margin-bottom:24px}.edited-story .media-source{display:none}
.design-file-details{border-block:1px solid var(--border);padding-block:18px}.design-file-details>summary{cursor:pointer;color:var(--blue);font-size:16px;min-height:36px}.design-file-details .wrap{width:100%}.design-file-details .section{padding-bottom:0}
@media(max-width:700px){.edited-story .section+.section,.website-case .section+.section{padding-top:20px}}

.footer-copyright{font-size:12px;line-height:1.7;color:var(--muted);max-width:75ch;margin:18px 0}