/* One physical header layout for every route; page styles only choose colours. */
:root{--site-header-height:78px}
body #site-header,body #site-header.dark{
 position:fixed;inset:0 0 auto;box-sizing:border-box;height:var(--site-header-height);
 display:grid;grid-template-columns:minmax(100px,1fr) 90px minmax(140px,1fr) auto 88px;
 grid-template-rows:48px;align-items:center;align-content:start;gap:0 24px;
 padding:15px 24px;border:0;box-shadow:none;z-index:40;font-size:14px;line-height:1.2;
}
#site-header .brand-symbol{grid-column:1;grid-row:1;display:block;width:26px;height:48px;justify-self:start;align-self:center}
#site-header .brand-symbol img{display:block;width:100%;height:100%;object-fit:contain}
/* Keep logo focus frameless; keyboard navigation still has a visible cue. */
#site-header .brand-symbol:focus{outline:none;box-shadow:none}
#site-header .brand-symbol:focus-visible img{opacity:.55}
#site-header #page-label{grid-column:2;grid-row:1;justify-self:start;align-self:center;font-size:14px;white-space:nowrap}
#site-header #view-controls{grid-column:3;grid-row:1;display:flex;align-items:center;justify-self:start;gap:8px;font-size:12px;white-space:nowrap}
#site-header #view-controls button{font-size:inherit;line-height:inherit}
#site-header nav{grid-column:4;grid-row:1;display:flex;align-items:center;justify-self:end;gap:24px;margin:0;padding:0;font-size:14px;line-height:1.2;white-space:nowrap}
#site-header nav a,#site-header nav a[aria-current=page]{display:inline!important;font-size:inherit;line-height:inherit}
#site-header nav a[aria-current=page]{text-decoration:underline;text-underline-offset:5px}
#site-header nav a:before{content:none!important}
#site-header .contact-link{grid-column:5;grid-row:1;justify-self:end;align-self:center;font-size:14px;white-space:nowrap}
#site-header #mobile-menu{display:none}
.home-field{padding-top:var(--site-header-height)}
#home-project-view{inset:var(--site-header-height) 12px 48px}
.home-tile{height:calc((100svh - var(--site-header-height) - 48px)/6 - 12px)}
.home-field .home-tile{width:min(calc((100% - 96px)/7),calc((100svh - var(--site-header-height) - 48px)/6 - 12px))}
@media(min-width:801px) and (max-width:1100px){
 body #site-header,body #site-header.dark{grid-template-columns:40px 72px minmax(100px,1fr) auto 72px;column-gap:14px;padding-inline:16px}
 #site-header nav{gap:16px;font-size:13px}
 #site-header .contact-link,#site-header #page-label{font-size:13px}
 #site-header #view-controls{gap:5px;font-size:11px}
}
@media(max-width:800px){
 :root{--site-header-height:70px}
 body #site-header,body #site-header.dark{grid-template-columns:40px 68px minmax(0,1fr) 44px;grid-template-rows:48px;column-gap:12px;padding:11px 16px}
 #site-header #page-label{font-size:12px}
 #site-header #view-controls{gap:5px;font-size:11px}
 #site-header #mobile-menu{display:block;grid-column:4;grid-row:1;justify-self:end;align-self:center;font-size:12px;min-height:44px}
 #site-header nav,#site-header .contact-link{display:none}
 body #site-header.menu-open{height:100svh}
 #site-header.menu-open nav{position:absolute;top:110px;left:16px;right:16px;width:auto;display:flex;flex-direction:column;align-items:center;gap:16px;font-size:32px;line-height:1.3;margin:0;padding:0}
 #site-header.menu-open .contact-link{display:block;position:absolute;left:16px;right:16px;top:410px;width:auto;text-align:center;font-size:32px;line-height:1.3}
 .home-tile{height:calc((100svh - var(--site-header-height) - 48px)/7 - 10px)}
 .home-field .home-tile{width:min(calc((100% - 48px)/4),calc((100svh - var(--site-header-height) - 48px)/7 - 10px))}
}