.brand-logo{--logo-size:60;--logo-size-ratio:1;--logo-size-value:calc(var(--logo-size)/var(--logo-size-ratio)/16*1rem);background-color:var(--logo-background,var(--color-white));padding:1rem}.brand-logo.tall,.brand-logo.wide{--logo-size-ratio:1.5}.brand-logo.wide{--logo-width:18.75rem}.brand-logo:not(.portrait){--logo-height:var(--logo-size-value)}.brand-logo.portrait{--logo-width:var(--logo-size-value)}.brand-logo .media-image{max-height:var(--logo-height,100%);max-width:var(--logo-width,100%);-o-object-fit:contain;object-fit:contain}.brand-logo figcaption{clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}.brand-banner{--banner-ratio:51/20;background:linear-gradient(180deg,transparent 90%,rgba(0,0,0,.02)),linear-gradient(180deg,transparent,rgba(0,0,0,.03));display:grid;overflow:hidden}.brand-banner>*{grid-column:1/-1;grid-row:1/-1}.brand-banner .banner img{aspect-ratio:var(--banner-ratio)}.brand-banner .banner+.brand-logo{margin-top:1rem}.brand-banner .brand-logo{--logo-size:40;align-self:self-end;justify-self:self-start;margin-left:1rem;margin-right:1rem;margin-top:1.5rem;position:relative;z-index:1}@media (min-width:36em){.brand-banner .brand-logo{--logo-size:70}}@media (min-width:62em){.brand-banner{--banner-ratio:23/5}.brand-banner .brand-logo{--logo-size:60}}