/* Shared width matches the broad homepage composition. */
body,body.picture{--content-width:1800px;--page-gutter:max(5vw,calc((100vw - var(--content-width))/2))}
.picture header,.picture .picture-intro,.picture .features,.picture .learn,.picture .picture-end,.picture .site-footer{padding-left:var(--page-gutter);padding-right:var(--page-gutter)}
.picture .picture-hero>div{left:var(--page-gutter)}
.tablet-stage{max-width:var(--content-width)}
@media(max-width:700px){body,body.picture{--page-gutter:7vw}.picture .picture-hero>div{left:var(--page-gutter);right:var(--page-gutter)}}

/* Homepage alignment: same gutters as header, hero and collection. */
body.picture .picture-intro,body.picture .features,body.picture .learn,body.picture .picture-end{padding-left:var(--page-gutter);padding-right:var(--page-gutter);box-sizing:border-box}
body.direction-8 .picture-story{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr)}
body.direction-8 .picture-story:nth-of-type(even){grid-template-columns:minmax(0,2fr) minmax(0,3fr)}
body.direction-8 .picture-story>img{min-width:0;width:100%;height:100%;min-height:520px;object-fit:cover}
body.direction-8 .picture-story>div{min-width:0;padding:60px clamp(30px,5vw,90px);box-sizing:border-box}
@media(max-width:900px){body.direction-8 .picture-story,body.direction-8 .picture-story:nth-of-type(even){grid-template-columns:1fr}body.direction-8 .picture-story>img{order:0!important;height:380px;min-height:0}body.direction-8 .picture-story>div{padding:45px var(--page-gutter)}}

/* Story text uses the same viewport gutters as the rest of the homepage. */
body.direction-8 .picture-story>div{padding-left:clamp(28px,4vw,64px);padding-right:clamp(28px,4vw,64px)}
body.picture .featured-grid{width:100%;min-width:0}
body.picture main{width:100%;overflow-x:clip}

/* Split-panel copy needs local padding, independent of full-page gutters. */
body.direction-8 .picture-story h2{font-size:clamp(32px,3vw,60px);line-height:1.08;max-width:none;white-space:normal}
body.direction-8 .picture-story>div{width:100%;padding:60px clamp(28px,4vw,64px)}
@media(max-width:1050px){body.direction-8 .picture-story,body.direction-8 .picture-story:nth-of-type(even){grid-template-columns:1fr}body.direction-8 .picture-story>img{order:0!important;height:380px;min-height:0}body.direction-8 .picture-story>div{padding:45px 7vw}body.direction-8 .picture-story h2{font-size:clamp(32px,5vw,48px)}}
