/* Shared Bletaria lockup; the existing local serif font supplies the wordmark. */
body .brand-lockup-v4 { display: inline-flex; align-items: center; gap: 11px; min-width: 0; }
body .brand-lockup-v4 > .brand-logo { width: 54px; max-width: 54px; height: 50px; flex: 0 0 54px; object-fit: contain; filter: none; }
body .brand-lockup-v4 .brand-name { position: relative; display: block; font: 700 32px/1 BletariaSerif, Georgia, serif; letter-spacing: 0; color: #244730; white-space: nowrap; }
body .brand-lockup-v4 .brand-name:after { content: none; }
body .brand-lockup-v4 .brand-domain { font-size: .7em; font-weight: 600; color: #916b23; }
body .brand-lockup-v4 .brand-name small { position: static; display: block; margin-top: 7px; font: 400 8px/1.3 'Segoe UI', Arial, sans-serif; letter-spacing: 0; color: #7d806c; }
body .reference-footer .brand-lockup-v4 { gap: 10px; }
body .reference-footer .brand-lockup-v4 > .brand-logo { width: 43px; max-width: 43px; height: 40px; flex-basis: 43px; }
body .reference-footer .brand-lockup-v4 .brand-name { font-size: 25px; color: #fffdf7; }
body .reference-footer .brand-lockup-v4 .brand-domain { color: #edb548; }
body .reference-footer .brand-lockup-v4 .brand-name small { color: #c0cdbf; font-size: 7px; }
@media (max-width: 760px) {
  body .reference-header .brand-lockup-v4 { gap: 8px; }
  body .reference-header .brand-lockup-v4 > .brand-logo { width: 39px; max-width: 39px; height: 38px; flex-basis: 39px; }
  body .reference-header .brand-lockup-v4 .brand-name { font-size: 27px; }
  body .reference-header .brand-lockup-v4 .brand-name small { font-size: 6.8px; margin-top: 6px; }
}
@media (max-width: 370px) {
  body .reference-header .brand-lockup-v4 { gap: 6px; }
  body .reference-header .brand-lockup-v4 > .brand-logo { width: 33px; max-width: 33px; height: 34px; flex-basis: 33px; }
  body .reference-header .brand-lockup-v4 .brand-name { font-size: 24px; }
  body .reference-header .brand-lockup-v4 .brand-name small { font-size: 6px; }
}

/* Glyph outlines keep the complete domain at one size without a font dependency. */
body .brand-wordmark-link { display: inline-flex; align-items: center; min-width: 0; max-width: 230px; line-height: 0; }
body .brand-wordmark-link > .brand-wordmark-image { display: block; width: 230px; max-width: 100%; height: auto; aspect-ratio: 6655.578 / 900.762; flex: none; object-fit: contain; }
@media (max-width: 760px) {
  body .brand-wordmark-link, body.design-rich .reference-header > .brand.brand-wordmark-link { max-width: 170px; }
  body .brand-wordmark-link > .brand-wordmark-image { width: 170px; }
}
