/* Fine material joints keep the light/dark rhythm architectural and readable.
   Surfaces stay still; only content inside a section may reveal on scroll. */
:root{--material-joint:#b9934280}
body :is(.portfolio-opening,.workshop-intro,.story-hero,.purpose-opening,.shortlist-evolved .page-opening,.enquiry-intro.motif){border-bottom:1px solid var(--material-joint)}
body :is(.institute-journal,.story-process-intro,.courtyard-making,.article-layout){border-top:1px solid var(--material-joint)}
body :is(.signature-counter,.institute.section,.invitation,.notes-evolved .research-card:nth-child(2)){border-block:1px solid var(--material-joint)}
body .invitation::after{content:none}
body .story-hero+.story-body,body .story-chapter-nav{border-top:0}
body .home-institute{border-top:1px solid var(--material-joint);border-bottom:1px solid var(--green)}
body .site-process.motif .process-film figcaption{color:#dedbd4;font-size:10px}
/* These neighbouring About sections share one texture, with a quiet inset
   divider marking the invitation instead of restarting the background. */
.material-run{position:relative;isolation:isolate;background:var(--surface-dark-color);border-top:1px solid var(--material-joint)}
.material-run::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:var(--surface) center/cover no-repeat;opacity:var(--surface-dark-opacity);filter:var(--surface-dark-filter)}
body.about-evolved .material-run>.section{background:transparent;border-top:0}
body.about-evolved .material-run>.section.institute{border-bottom:0}
body .material-run>section::before,body .material-run>section::after{content:none}
body .material-run>.invitation::after{content:'';position:absolute;inset:0 5% auto;height:1px;width:auto;background:var(--material-joint);pointer-events:none}
@media(max-width:850px){body .material-run>.invitation::after{inset-inline:6%}}