/* One shared page rail for every step, so the header never shifts between screens. */
body:has(>.studio-header){--site-width:1224px;--site-gutter:24px}
body>.studio-header{padding-inline:max(var(--site-gutter),calc((100% - var(--site-width))/2 + var(--site-gutter)))}
#main>.step,body>.studio-footer{max-width:var(--site-width);padding-inline:var(--site-gutter)}

/* Frame the supplied artwork without its transparent canvas affecting alignment. */
.brand-mark,.studio-header .brand-mark{
  position:relative;display:block;flex:none;width:64px;height:auto;
  aspect-ratio:870/597;overflow:hidden;
}
.brand-mark img,.studio-header .brand-mark img,.logo.brand-mark .brand-logo,.back .brand-mark .brand-logo{
  position:absolute;display:block;width:176.552%;height:171.524%;max-width:none;
  left:-39.77%;top:-34.674%;object-fit:fill;transform:none;
}
body:has(>main.doc) .nav-inner{max-width:760px}
.back .brand-mark{width:48px}
@media(max-width:760px){
  body:has(>.studio-header){--site-gutter:20px}
  .brand-mark,.studio-header .brand-mark{width:52px}
}

/* A plain-text summary of who we build for, readable by people and search engines */
body>.studio-footer{flex-wrap:wrap}
.studio-footer .footer-seo{order:3;flex-basis:100%;margin:6px 0 0;max-width:860px;line-height:1.7;color:#8a9087}
