/* Westernmost Logo Redesign / final approved v28 horizontal and boxed marks.
   The logo lettering is embedded artwork, not a retyped website font.
   Header geometry is shared by both divisions; page navigation stays contextual. */
:root{
  --westernmost-teal:#004048;
  --westernmost-frame:#02434D;
  --westernmost-monochrome:#000000;
  --westernmost-light-surface:#ffffff;
  --ink:var(--westernmost-teal);
  --green:var(--westernmost-teal);
}
/* Reserve the same viewport width on pages with different content lengths. */
html{overflow-y:scroll;scrollbar-gutter:stable}
.construction-page .site-header{
  display:block;
  width:auto;
  min-height:0;
  margin:0;
  padding:0;
  background:#f4f2eb;
  color:var(--westernmost-teal);
}
:is(.drafting-page .site-header,.construction-page .header-inner){
  --header-paper:#f4f2eb;
  box-sizing:border-box;
  position:relative;
  z-index:1;
  isolation:isolate;
  display:grid;
  grid-template-columns:minmax(0,1fr) 240px minmax(0,1fr);
  grid-template-rows:auto;
  align-items:center;
  justify-content:normal;
  gap:24px;
  width:min(1260px,calc(100% - 112px));
  min-width:0;
  min-height:0;
  height:auto;
  margin:0 auto;
  padding:10px 0;
  border:0;
  color:var(--westernmost-teal);
  background:var(--header-paper);
  font-family:"Avenir Next",Avenir,"Segoe UI",Helvetica,Arial,sans-serif;
  font-size:12px;
  line-height:1.2;
}
.site-header .brand{
  position:relative;
  isolation:isolate;
  grid-column:1;
  grid-row:1;
  justify-self:start;
  width:100%;
  max-width:460px;
  min-width:0;
  margin:0;
  padding:8px;
  display:block;
  background:var(--header-paper);
  border-radius:3px;
}
/* Suppress the older drafting-page backdrop as well as the shared halo. */
.site-header .brand:before{content:none}
.brand picture{display:block}
.site-header .brand img{
  position:static;
  width:100%;
  max-width:100%;
  height:auto;
  aspect-ratio:3 / 1;
  object-fit:contain;
  filter:none;
  mix-blend-mode:normal;
  transform:none;
}
:is(.drafting-page,.construction-page) .site-header .division-switch{
  box-sizing:border-box;
  grid-column:2;
  grid-row:1;
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:center;
  justify-content:normal;
  justify-self:center;
  width:240px;
  min-width:0;
  margin:0;
  padding:5px;
  gap:4px;
  border:0;
  border-radius:100px;
  background:#e2e8da;
  font-size:12px;
  line-height:1.2;
}
:is(.drafting-page,.construction-page) .site-header nav.division-switch>a{
  box-sizing:border-box;
  display:block;
  width:auto;
  margin:0;
  padding:11px 8px;
  border:0;
  border-radius:100px;
  background:transparent;
  color:var(--westernmost-teal);
  font-size:12px;
  font-weight:600;
  line-height:1.2;
  letter-spacing:normal;
  text-align:center;
  text-decoration:none;
  white-space:nowrap;
}
:is(.drafting-page,.construction-page) .site-header .division-switch>a:hover{background:#d4decc}
:is(.drafting-page,.construction-page) .site-header .division-switch>a[aria-current=page]{background:var(--westernmost-teal);color:#fffefa}
:is(.drafting-page,.construction-page) .site-header :is(.drafting-nav,.page-nav){
  grid-column:3;
  grid-row:1;
  display:grid;
  grid-template-columns:64px 72px 112px;
  align-items:center;
  justify-content:end;
  justify-self:end;
  width:288px;
  min-width:0;
  margin:0;
  padding:0;
  gap:20px;
  border:0;
  background:none;
  font-size:12px;
  font-weight:600;
  line-height:1.2;
  white-space:nowrap;
}
:is(.drafting-page,.construction-page) .site-header :is(.drafting-nav,.page-nav)>a{
  display:block;
  margin:0;
  padding:12px 0;
  border:0;
  font-size:12px;
  font-weight:600;
  line-height:1.2;
  letter-spacing:normal;
  text-align:center;
  text-decoration:none;
  white-space:nowrap;
}
:is(.drafting-page,.construction-page) .site-header :is(.drafting-nav,.page-nav)>a:hover{text-decoration:underline}
:is(.drafting-page,.construction-page) .site-header :is(.drafting-nav,.page-nav)>a span{margin-left:8px}
.footer-identity{display:flex;align-items:center;gap:14px;color:var(--westernmost-monochrome)}
.footer-identity img{width:64px;height:auto;aspect-ratio:1;flex-shrink:0}
.footer-identity p{width:auto!important}
@media(max-width:1100px){
  :is(.drafting-page .site-header,.construction-page .header-inner){width:calc(100% - 64px)}
  .site-header .brand{max-width:390px}
}
@media(max-width:1000px){
  :is(.drafting-page .site-header,.construction-page .header-inner){
    grid-template-columns:minmax(0,1fr) 240px;
    gap:16px 24px;
    padding:15px 0 20px;
  }
  :is(.drafting-page,.construction-page) .site-header .division-switch{justify-self:end}
  :is(.drafting-page,.construction-page) .site-header :is(.drafting-nav,.page-nav){grid-column:1 / -1;grid-row:2}
}
@media(max-width:780px){
  :is(.drafting-page .site-header,.construction-page .header-inner){
    width:calc(100% - 40px);
    grid-template-columns:minmax(0,1fr);
    gap:16px;
  }
  .site-header .brand{grid-column:1;grid-row:1;justify-self:center;width:min(460px,100%);max-width:460px}
  :is(.drafting-page,.construction-page) .site-header .division-switch{grid-column:1;grid-row:2;width:100%;justify-self:stretch}
  :is(.drafting-page,.construction-page) .site-header nav.division-switch>a{padding:12px 8px}
  :is(.drafting-page,.construction-page) .site-header :is(.drafting-nav,.page-nav){grid-column:1;grid-row:3;justify-self:center;width:280px;grid-template-columns:62px 70px 108px}
  :is(.drafting-page,.construction-page) .site-header :is(.drafting-nav,.page-nav)>a{font-size:11px;padding:6px 0}
  .footer-identity{width:100%}
  .site-footer nav{margin-left:0}
}
@media(max-width:340px){
  :is(.drafting-page,.construction-page) .site-header :is(.drafting-nav,.page-nav){width:100%;grid-template-columns:1fr 1fr 1.6fr;gap:12px}
}
@media print{
  /* Use the supplied monochrome asset; do not synthesize a reverse logo. */
  .site-header .brand{background:white}
}
