/* Branding (§9.2): monograma ~64px + wordmark en versalitas espaciadas. */

.c-branding__link {
  display: inline-flex;
  align-items: center;
  gap: var(--space-3);
  min-height: 44px;
  color: var(--div-ink);
  text-decoration: none;
}

/* El SVG usa currentColor: en divisiones oscuras --div-accent ya es champán. */
.c-branding__monogram {
  display: block;
  color: var(--div-accent);
  transition: color var(--dur-fast) var(--ease-out);
}

.c-branding__monogram svg,
.c-branding__monogram img {
  display: block;
  width: 64px;
  height: auto;
}

.c-branding__link:hover .c-branding__monogram,
.c-branding__link:focus-visible .c-branding__monogram {
  color: var(--div-accent-strong);
}

.c-branding__link:hover .c-branding__monogram img,
.c-branding__link:focus-visible .c-branding__monogram img {
  filter: brightness(1.07);
}

/* Variantes del logo real: crema en claros, bronce en oscuros (home/art/private).
   Si algún día se activa el sub-esquema claro de ART (data-scheme="light"),
   añadir aquí la excepción. */
.c-branding__monogram .c-logo--dark {
  display: none;
}

body[data-division="home"] .c-branding__monogram .c-logo--light,
body[data-division="art"] .c-branding__monogram .c-logo--light,
body[data-division="private"] .c-branding__monogram .c-logo--light {
  display: none;
}

body[data-division="home"] .c-branding__monogram .c-logo--dark,
body[data-division="art"] .c-branding__monogram .c-logo--dark,
body[data-division="private"] .c-branding__monogram .c-logo--dark {
  display: block;
}

.c-branding__wordmark {
  font-family: var(--ff-display);
  font-size: var(--fs-nav);
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: var(--ls-caps-3);
  text-transform: uppercase;
  color: var(--div-ink);
  white-space: nowrap;
}

@media (max-width: 639.98px) {
  .c-branding__monogram svg,
  .c-branding__monogram img {
    width: 48px;
  }

  .c-branding__wordmark {
    display: none;
  }
}