.brand { display: flex; align-items: center; line-height: 1; font-size: 0; }
.brand img { display: block; width: 104px; height: auto; max-height: 56px; object-fit: contain; object-position: left center; }
/* Dark footers use the white mark; light content pages opt into the dark mark below. */
footer { background: var(--ink); color: #fff; border-top: 1px solid #353630; }
footer .brand { width: 104px; height: 56px; font-size: 0; }
footer .brand img { width: 104px; height: auto; max-height: 56px; object-fit: contain; }
footer p { color: #a5a79e; }
.about-page .site-header .brand::before { content: ''; display: block; width: 104px; height: 56px; background: url('/logo-revaz-white.png') left center / contain no-repeat; }
.about-page footer .brand::before { content: ''; display: block; width: 104px; height: 56px; background: url('/logo-revaz-dark.png') left center / contain no-repeat; }
.about-page .site-header .brand img, .about-page footer .brand img { display: none; }

/* About and Article pages have light footers, so use the dark logo for contrast. */
.about-page footer,
.stories-page footer { background: var(--white); color: var(--ink); border-top-color: #d7d8d1; }
.about-page footer p,
.stories-page footer p { color: #6f7169; }
.about-page footer .brand img,
.stories-page footer .brand img { content: url('/logo-revaz-dark.png'); }