.brand { gap: 7px; height: 58px; }
.brand-mark { width: 42px; height: 52px; object-fit: cover; }
.brand-wordmark { width: 150px; height: 46px; object-fit: contain; }
.hero-logo { display: grid; justify-items: center; gap: 2px; margin-bottom: 8px; }
.hero-logo-mark { width: 172px; height: 182px; object-fit: cover; filter: drop-shadow(0 0 18px rgba(31, 129, 255, .44)); }
.hero-logo-wordmark { width: min(440px, 92%); height: 112px; object-fit: contain; filter: drop-shadow(0 5px 14px rgba(0, 0, 0, .8)); }
.footer-brand { gap: 8px; align-items: center; }
.footer-mark { width: 70px; height: 82px; object-fit: cover; }
.footer-wordmark { width: 220px; max-width: 100%; height: 70px; object-fit: contain; }
@media (max-width: 620px) { .brand-mark { width: 35px; height: 43px; } .brand-wordmark { width: 123px; } .hero-logo-mark { width: 145px; height: 153px; } .hero-logo-wordmark { height: 88px; } .footer-wordmark { width: 180px; } }