/* Identidad visual Nobelio.
   El wordmark reproduce la referencia: geometría limpia, peso medio
   y un espaciado amplio entre letras. */

.nobelio-brand {
    display: inline-flex;
    align-items: center;
    gap: clamp(8px, 1vw, 14px);
    min-width: 0;
}

.nobelio-logo {
    display: block;
    width: auto;
    height: var(--nobelio-logo-height, 55px);
    max-width: none;
    object-fit: contain;
    flex: 0 0 auto;
    transition: filter 180ms ease, opacity 180ms ease;
}

/* En los estilos oscuros el azul original se pierde sobre el fondo marino.
   La versión monocroma clara conserva la silueta y acompaña al wordmark. */
body.nobelio-themed:not(.classic):not(.vintage) .nobelio-logo {
    filter:
        brightness(0)
        invert(1)
        drop-shadow(0 0 7px rgba(112, 132, 255, 0.55));
    opacity: 0.98;
}

.nobelio-wordmark {
    display: inline-block;
    margin: 0;
    background: none !important;
    color: var(--text-primary, #071536) !important;
    -webkit-background-clip: initial !important;
    background-clip: initial !important;
    -webkit-text-fill-color: var(--text-primary, #071536) !important;
    font-family: "Century Gothic", "Avenir Next", Futura, Montserrat, Arial, sans-serif !important;
    font-size: var(--nobelio-wordmark-size, 22px) !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    letter-spacing: 0.3em !important;
    text-transform: uppercase;
    white-space: nowrap;
}

.nobelio-brand--compact {
    gap: 8px;
}

@media (max-width: 520px) {
    .nobelio-wordmark {
        font-size: min(var(--nobelio-wordmark-size, 22px), 18px) !important;
        letter-spacing: 0.22em !important;
    }
}

/* ── La moneda animada ──────────────────────────────────────────────────
   <n-coin> (logo/n-coin.js) sustituye en pantalla al logotipo plano.
   NO lleva la clase .nobelio-logo a propósito: el filter de los temas
   oscuros de arriba es una propiedad de agrupación y aplanaría el
   transform-style: preserve-3d — la moneda se quedaría en un disco.
   Si alguna vez hay que atenuarla, se atenúa el contenedor de fuera. */

.nobelio-coin {
    display: inline-block;
    flex: 0 0 auto;
    line-height: 0;
}

/* Hasta que el navegador registra el componente el elemento mide 0 y la
   cabecera daría un salto. Reservamos el hueco con la misma variable de
   altura que ya usaba el logotipo. */
n-coin.nobelio-coin:not(:defined) {
    display: inline-block;
    height: var(--nobelio-logo-height, 55px);
    aspect-ratio: 1 / 1;
}

/* Documentos que se exportan a PDF (informe de sexenio, CV): el 3D en CSS
   no viaja a la impresión. En pantalla gira la moneda; en papel, el
   logotipo plano. */
.nobelio-logo--print {
    display: none;
}

@media print {
    .nobelio-coin {
        display: none !important;
    }

    .nobelio-logo--print {
        display: block;
    }
}