/* Crop only the display viewport. The supplied original stays intact in Medios. */
.site-masthead { --sas-logo-width: 224px; }
.site-masthead[data-brand-stage="1"] { --sas-logo-width: 214px; }
.site-masthead[data-brand-stage="2"] { --sas-logo-width: 204px; }
.site-masthead .site-logo {
  width: var(--sas-logo-width) !important;
  flex: 0 0 var(--sas-logo-width) !important;
  transition: width .2s ease, flex-basis .2s ease;
}
.site-masthead .sas-brand-viewport { display:block; position:relative; width:100%; }
.site-masthead .sas-brand-image {
  display:block; position:static; width:100%; height:auto; max-width:none;
  object-fit:contain; filter:none; transform:none;
}
.site-masthead .sas-brand-animated {
  height:calc(var(--sas-logo-width) * .45); overflow:hidden;
  transition:height .2s ease;
}
.site-masthead .sas-brand-animated .sas-brand-image {
  position:absolute; width:110.875%; height:auto;
  left:-5.6%; top:calc(var(--sas-logo-width) * -.065);
}
.site-masthead[data-brand-stage="1"] .sas-brand-animated { height:calc(var(--sas-logo-width) * .28); }
.site-masthead[data-brand-stage="2"] .sas-brand-animated { height:calc(var(--sas-logo-width) * .205); }
@media(max-width:1100px) {
  .site-masthead { --sas-logo-width:160px; }
  .site-masthead[data-brand-stage="1"] { --sas-logo-width:154px; }
  .site-masthead[data-brand-stage="2"] { --sas-logo-width:148px; }
}
@media(max-width:380px) {
  .site-masthead { --sas-logo-width:128px; }
  .site-masthead[data-brand-stage="1"] { --sas-logo-width:124px; }
  .site-masthead[data-brand-stage="2"] { --sas-logo-width:120px; }
}
@media(prefers-reduced-motion:reduce) {
  .site-masthead .site-logo,.site-masthead .sas-brand-animated { transition:none; }
}