/* Shared geometry, independent of each page's content width and hero theme. */
:root{--studio-header-width:min(78%,1600px)}
#site-header{width:var(--studio-header-width);max-width:none;height:88px;gap:20px}
#site-header .studio-logo{font-size:21px;gap:7px;flex-shrink:0}
#site-header .studio-logo img{width:27px;height:27px}
#site-header .top-nav{position:absolute;left:50%;transform:translateX(-50%);padding:0 13px}
#site-header .top-nav>a,#site-header .nav-services>summary{font-size:12px;line-height:1.6;gap:8px;padding:11px 15px}
#site-header .header-tools{margin-left:auto;margin-right:44px;gap:4px}
#site-header .header-icon{width:40px;height:40px;padding:9px}
#site-header .header-icon svg{width:21px;height:21px}
#site-menu-launch{top:24px;right:calc((100% - var(--studio-header-width))/2);width:40px;height:40px;padding:11px;justify-content:center;border:1px solid transparent}
#site-menu-launch>span{display:none}
.is-scrolled #site-menu-launch{right:18px}
@media(max-width:1200px){:root{--studio-header-width:88%}#site-header .top-nav>a,#site-header .nav-services>summary{padding-inline:10px}}
@media(max-width:900px){#site-header .top-nav{display:none}}
@media(max-width:760px){
 :root{--studio-header-width:calc(100% - 36px)}
 #site-header{height:75px;gap:8px}
 #site-header .studio-logo{font-size:20px;gap:6px}
 #site-header .header-tools{margin-right:38px;gap:0}
 #site-header .header-icon{width:34px;height:40px;padding:7px}
 #site-menu-launch{top:17.5px;width:34px;padding:8px}
 .is-scrolled #site-menu-launch{right:18px}
}

/* One content grid across the home page and all subpages. */
.menu-top{display:grid;grid-template-columns:1fr auto auto;gap:16px}
.menu-tools{display:flex;align-items:center;gap:4px}
.menu-tools[hidden]{display:none}
.menu-tools .header-icon{width:44px;height:44px}
.menu-close{min-height:44px;white-space:nowrap}
@media(max-width:600px){
 .menu-top{grid-template-columns:1fr auto;gap:12px}
 .menu-top .menu-close{grid-column:2;grid-row:1;padding-right:0}
 .menu-tools{grid-column:1/-1;grid-row:2;justify-content:flex-end}
}

@media(min-width:761px){.home-studio.about-studio .page-width,.home-studio.about-studio .about-logo-grid{width:88%;max-width:1760px}}

@media(min-width:901px) and (max-width:1200px){.home-studio.about-studio .page-width,.home-studio.about-studio .about-logo-grid{width:90%}}
@media(min-width:601px) and (max-width:900px){.home-studio.about-studio .page-width,.home-studio.about-studio .about-logo-grid{width:92%}}
@media(max-width:600px){.home-studio.about-studio .page-width,.home-studio.about-studio .about-logo-grid{width:calc(100% - 32px)}}
