/* Shared reading width and section hierarchy across About, Work and Playground. */
:root{--collection-width:min(76.56vw,1280px);--collection-gap:clamp(30px,3vw,56px)}
:is(.about,.works,.playground)>.section-label{width:var(--collection-width);max-width:100%;margin-inline:auto;padding-top:16px;border-top:1px solid #dfe2e5;font-size:10px;letter-spacing:.12em;line-height:1.5;color:#80858a}
.works.page-section,.playground.page-section{padding-top:64px;padding-bottom:96px}
.playground.page-section{border-top:0}
:is(.works,.playground)>.work-heading{width:var(--collection-width);max-width:100%;margin:32px auto 40px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:var(--collection-gap);align-items:end}
:is(.works,.playground)>.work-heading h2{font-size:clamp(32px,3.1vw,48px);font-weight:400;line-height:1.15;letter-spacing:-.045em}
.works>.work-heading p{font-size:13px;line-height:1.8;max-width:320px;margin:0;color:#777d83}
.works>.work-grid,.playground>.playground-group{width:var(--collection-width);max-width:100%;margin-inline:auto}
/* About's rail follows its two-column composition, rather than the narrower card grid. */
.about.page-section>.section-label{width:100%;max-width:1360px;margin-inline:auto}
.about.page-section>.about-layout{width:100%;max-width:1360px;margin:28px auto 0}
.about .reasons-portrait .portrait-note{font-family:inherit;font-size:clamp(16px,1.25vw,19px);font-weight:400;font-style:normal;letter-spacing:.025em;line-height:1.5;color:#65696d;transform:rotate(-6deg);transform-origin:left center}
@media(min-width:1000px){
 .about.page-section{padding:28px 6.5%;scroll-margin-top:0}
 .about.page-section>.about-layout{grid-template-columns:minmax(0,52%) minmax(0,1fr);gap:5%;align-items:center}
 .about .reasons-portrait{height:min(740px,calc(100svh - 148px));min-height:530px;align-self:center}
 .about .about-content{max-width:none}
 .about .reasons-portrait .portrait-note{left:7%;top:32px}
 .about .reasons-portrait .portrait-caption{left:7%}
}
@media(max-width:760px){
 :root{--collection-width:75.68vw}
 .works.page-section,.playground.page-section{padding-top:44px;padding-bottom:64px}
 :is(.about,.works,.playground)>.section-label{font-size:9px;padding-top:14px}
 :is(.works,.playground)>.work-heading{grid-template-columns:minmax(0,1fr);gap:14px;margin-top:26px;margin-bottom:32px}
 :is(.works,.playground)>.work-heading h2{font-size:clamp(28px,6.8vw,38px)}
 .works>.work-heading p{font-size:12px;max-width:32em}
}