.logo-tile {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  background: #f2f5fa;
  border: 1px solid #ffffff90;
  border-radius: 5px;
}

/* Display the supplied PNG at its visible bounds, preserving the original file. */
.logo-mark {
  display: block;
  position: relative;
  overflow: hidden;
  width: 100%;
  aspect-ratio: 835 / 386;
}

.logo-mark img {
  display: block;
  position: absolute;
  width: 140.12%;
  max-width: none;
  height: auto;
  left: -19.88%;
  top: -49.48%;
}

.app { margin-left: 0; }

.header-identity {
  display: flex;
  flex: 1;
  min-width: 0;
  align-items: center;
  gap: 18px;
}

.header-logo {
  width: 84px;
  height: 52px;
  padding: 10px;
  border-radius: 7px;
}

.header-kicker {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 8px;
}

.header-heading { min-width: 0; }
.header-heading h1 { overflow-wrap: anywhere; line-height: 1.25; }

.header-kicker .eyebrow {
  margin-bottom: 0;
}

.footer-brand.logo-tile {
  width: 34px;
  height: 18px;
  padding: 3px;
  border-radius: 3px;
}

@media (max-width: 700px) {
  .header { flex-wrap: wrap; gap: 14px; }
  .header-identity { flex-basis: 100%; gap: 12px; }
  .header-logo {
    width: 62px;
    height: 42px;
    padding: 8px;
    border-radius: 5px;
  }
  .header-right { margin-left: auto; }
  .header-heading h1 { font-size: 21px; line-height: 1.3; }
  .header-kicker .eyebrow {
    font-size: 7px;
    letter-spacing: 1px;
  }
}
