/* The approved discovery logo, shared by the portal, lessons and 3D rooms.
   Lettering is outlined in SVG so the brand never depends on a loaded font. */
.site-brand {
  --brand-ink: #263e38;
  --brand-caption: #6d7c6c;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  flex: none;
  color: var(--brand-ink);
  line-height: 1;
  vertical-align: middle;
}
.site-brand--light { --brand-ink: #faf8f1; --brand-caption: #cfdbc7; }
.site-brand-mark { display: block; flex: none; width: 58px; height: 58px; object-fit: contain; }
.site-brand-copy { display: flex; flex-direction: column; align-items: flex-start; gap: 1px; }
.site-brand-wordmark { display: block; width: 94px; height: 36px; color: var(--brand-ink); fill: currentColor; overflow: visible; }
.site-brand-tagline { display: block; color: var(--brand-caption); font: 800 8px/1.4 "Bricolage Grotesque", "Nunito", "Segoe UI", sans-serif; letter-spacing: 1.3px; text-transform: uppercase; white-space: nowrap; }
.site-brand--compact { gap: 6px; }
.site-brand--compact .site-brand-mark { width: 43px; height: 43px; }
.site-brand--compact .site-brand-wordmark { width: 77px; height: 29px; }
.topbar > .logo { gap: 0; flex: none; }
.pfoot-logo:has(.site-brand) { text-decoration: none; }
.discover-footer-brand:has(.site-brand) { letter-spacing: 0; }
.discover-footer-brand .site-brand-mark { width: 38px; height: 38px; }
.discover-footer-brand .site-brand-wordmark { width: 67px; height: 26px; }
:is(.lab-mark, .atlas-mark):has(.site-brand-room-mark),
:is(.lab-mark, .atlas-mark):has(.site-brand-room-mark):hover { background: transparent; border: 0; box-shadow: none; }
.site-brand-room-mark { display: block; width: 100%; height: 100%; object-fit: contain; }
@media (max-width: 760px) {
  .topbar .site-brand-mark { width: 48px; height: 48px; }
  .topbar .site-brand-wordmark { width: 82px; height: 31px; }
  .topbar .site-brand-tagline { font-size: 7px; letter-spacing: 1px; }
}
@media (max-width: 600px) {
  .discover-brand .site-brand { gap: 6px; }
  .discover-brand .site-brand-mark { width: 46px; height: 46px; }
  .discover-brand .site-brand-wordmark { width: 79px; height: 30px; }
  .discover-brand .site-brand-tagline { font-size: 5px; letter-spacing: .65px; }
  .discover-brand--compact .site-brand-mark { width: 33px; height: 33px; }
  .discover-brand--compact .site-brand-wordmark { width: 65px; height: 25px; }
}
@media (max-width: 360px) {
  .discover-brand .site-brand-tagline { display: none; }
  .discover-brand--compact .site-brand { gap: 4px; }
  .discover-brand--compact .site-brand-wordmark { width: 57px; height: 22px; }
}