/* Soffguiden — the masthead lockup.
 *
 * The mark is a dimensioned sofa: front elevation over an architectural
 * dimension line. It is the identity brief made literal — "sajten är ett
 * mätinstrument … vi ser ut som ett specifikationsblad, inte ett showroom"
 * (brand/identity.md). The sofa inherits ink via currentColor and the
 * dimension line uses the accent token, so a vibe swap re-skins both.
 */

.kr-brand {
  gap: 0.6rem;
  align-items: center;
}

.kr-brand__mark {
  display: flex;
  align-items: center;
  color: var(--wp--preset--color--contrast);
  flex: 0 0 auto;
  /* Optically align the mark's baseline with the wordmark's, not its box. */
  margin-block-start: 0.08em;
}

.kr-brand__mark svg {
  display: block;
  width: clamp(2.5rem, 3.4vw, 3.25rem);
  height: auto;
}

/* The condensed (scrolled) masthead shrinks the wordmark; match it. */
.kr-masthead.is-condensed .kr-brand__mark svg {
  width: clamp(2rem, 2.6vw, 2.5rem);
}

/* The wordmark is a link; the mark sits outside it, so keep the whole
   lockup from picking up the link underline treatment. */
.kr-brand__mark a,
.kr-brand__mark a::after {
  text-decoration: none;
}

@media (max-width: 560px) {
  .kr-brand {
    gap: 0.45rem;
  }
  .kr-brand__mark svg {
    width: 2.25rem;
  }
}

@media (prefers-reduced-motion: no-preference) {
  .kr-brand__mark svg {
    transition: opacity 160ms var(--kr-ease, ease);
  }
  .kr-brand:hover .kr-brand__mark svg {
    opacity: 0.78;
  }
}