/* ==========================================================================
   Logo — officieel logo (merkteken + "MILESTONE / REAL ESTATE")
   Kleur via --logo-color (in de header: petrol op licht, wit op donker),
   anders de tekstkleur. Het merkteken kan apart via --logo-mark-color.
   ========================================================================== */

.logo {
  display: inline-flex;
  align-items: center;
  color: var(--logo-color, inherit);
  text-decoration: none;
  transition: color var(--dur-3) var(--ease-plain);
}

.logo:hover {
  color: var(--logo-color, inherit);
}

.logo__svg {
  display: block;
  width: auto;
  height: 2.5rem; /* 40px op mobiel; "REAL ESTATE" blijft leesbaar */
  aspect-ratio: 236 / 66; /* viewBox */
}

.logo__mark {
  color: var(--logo-mark-color, currentColor);
  transition: color var(--dur-3) var(--ease-plain);
}

@media (min-width: 48em) {
  .logo__svg {
    height: 3rem; /* 48px */
  }
}