@import url('./icons.css');

/* Shared logo sizing; preserve the SVG's natural aspect ratio. */
.brand-logo {
  display: block;
  height: 56px;
  width: auto;
  max-width: 100%;
  object-fit: contain;
  flex-shrink: 0;
}

/* New Numbly raster logo ships with transparency (white removed).
   Renders crisp on light surfaces with zero blending hacks. */
.brand-logo--hd {
  image-rendering: auto;
}

/* Green lockup for light surfaces (transparent artwork). */
.brand-lockup--green {
  display: inline-block;
  line-height: 0;
}

.brand-lockup--green img {
  display: block;
  width: 100%;
  height: auto;
}

/* Neon glow lockup (transparent artwork) — index page only. */
.brand-lockup--neon {
  display: inline-block;
  line-height: 0;
}

.brand-lockup--neon img {
  display: block;
  width: 100%;
  height: auto;
}

.brand-lockup--neon.nav-logo img {
  max-width: 180px;
}

.brand-lockup--neon.foot-logo img {
  max-width: 208px;
}

/* Green lockup on a cream pill for the dark footer — logo stays 100% original. */
.foot-logo-pill {
  display: inline-block;
  line-height: 0;
  background: #FAF7F2;
  border: 1px solid #E8E1D3;
  border-radius: 14px;
  padding: 10px 18px;
}

.foot-logo-pill img {
  display: block;
  width: 100%;
  max-width: 190px;
  height: auto;
}

/* Cream glow lockup (transparent artwork) for dark surfaces. */
.brand-lockup--cream {
  display: inline-block;
  line-height: 0;
}

.brand-lockup--cream img {
  display: block;
  width: 100%;
  max-width: 196px;
  height: auto;
  filter: drop-shadow(0 0 14px rgba(250, 243, 220, 0.28));
}

.brand-logo.brand-logo--auth {
  height: 64px;
}

@media (max-width: 767px) {
  .brand-logo {
    height: 48px;
  }
}