/* Shared page geometry. Typography remains editable in the administrator. */
:root{
 --page-max:1200px;
 --page-gutter:48px;
 --page-edge:max(var(--page-gutter),calc((100% - var(--page-max))/2));
 --section-space:96px;
 --hero-height:800px;
 --hero-top:156px;
 --hero-bottom:72px;
 --header-height:84px;
 --portfolio-gap:24px;
}
.wrap,.section-wrap,.cover-content,.story-intro,.project-notes{
 width:min(var(--page-max),calc(100% - var(--page-gutter)*2));
 margin-left:auto;
 margin-right:auto;
}
.nav,.section-nav,.detail-nav{
 height:var(--header-height);
 padding-left:var(--page-edge);
 padding-right:var(--page-edge);
}
.hero,.section-hero{
 height:auto;
 min-height:var(--hero-height);
 max-height:none;
 padding:var(--hero-top) 0 var(--hero-bottom);
 align-items:flex-start;
}
.hero-content{padding-bottom:0}
.hero h1,.section-hero h1{margin-top:24px;margin-bottom:24px}
.section,.section-content{padding-top:var(--section-space);padding-bottom:var(--section-space)}
.story-intro,.project-notes{padding-top:var(--section-space);padding-bottom:var(--section-space)}
.film-section,.next-project{
 padding-left:var(--page-edge);
 padding-right:var(--page-edge);
 padding-top:var(--section-space);
 padding-bottom:var(--section-space);
}
.tool{padding-bottom:var(--section-space)}
.contact{padding-top:var(--section-space);padding-bottom:var(--section-space)}
.section-head,.works-top,.works-intro{margin-bottom:36px}
.grid,.work-grid{gap:var(--portfolio-gap)}
.section-footer,.detail-footer{padding:28px var(--page-edge)}
.footer{padding-top:28px;padding-bottom:28px}
@media(max-width:1000px){
 :root{--page-gutter:32px;--hero-height:680px;--section-space:76px;--hero-top:132px;--hero-bottom:60px;--header-height:68px;--portfolio-gap:20px}
}
@media(max-width:760px){
 :root{--page-gutter:20px;--section-space:64px;--hero-height:600px;--hero-top:116px;--hero-bottom:48px;--portfolio-gap:16px}
 .grid,.work-grid{grid-template-columns:minmax(0,1fr)}
}

.card,.card:nth-child(3n+1),.work-card{aspect-ratio:16/9}