/* ── TRANSFORMER Logo Widget ─────────────────────────────────────
   Single source of truth for the pill-shaped logo widget.
   Include this file in every page that renders the widget.
   All child rules are scoped under .nav__logo-widget to avoid
   being overridden by lower-specificity page rules.
──────────────────────────────────────────────────────────────── */
.nav__logo-widget {
    display: inline-flex; align-items: center;
    gap: clamp(5px, 1vw, 9px);
    padding: 10px;
    background: rgba(255,255,255,.04);
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 999px;
    text-decoration: none;
    transition: border-color .2s, background .2s, transform .2s;
    flex-shrink: 0;
}
.nav__logo-widget:hover {
    background: rgba(249,115,22,.08);
    border-color: rgba(249,115,22,.35);
    transform: translateY(-1px);
}
.nav__logo-widget .nav__logo-widget-icon {
    width: 40px; height: 40px;
    object-fit: contain; border-radius: 50%; flex-shrink: 0;
}
.nav__logo-widget .nav__logo-widget-text {
    display: flex; flex-direction: column; gap: 1px; line-height: 1.15;
}
.nav__logo-widget .nav__logo-widget-brand {
    font-size: .88rem;
    font-weight: 900; letter-spacing: .07em;
    color: #fff; white-space: nowrap; align-self: flex-start;
}
.nav__logo-widget-f { color: #f97316; }
.nav__logo-widget .nav__logo-widget-f { color: #f97316; }
.nav__logo-widget .nav__logo-widget-slogan {
    font-size: .48rem;
    font-weight: 600; letter-spacing: .13em; text-transform: uppercase;
    color: rgba(255,255,255,.3);
    display: inline-block; white-space: nowrap; align-self: flex-start;
}

/* ── Mobile scaling ──────────────────────────────────────────── */
@media (max-width: 600px) {
    .nav .nav__logo-widget { gap: 5px; }
    .nav .nav__logo-widget .nav__logo-widget-icon { width: 34px; height: 34px; }
    .nav .nav__logo-widget .nav__logo-widget-brand { font-size: .88rem; }
    footer .nav__logo-widget { display: none; }
}

/* ── Footer-context overrides — flat wordmark style ─────────── */
footer .nav__logo-widget {
    background: none;
    border: none;
    border-radius: 0;
    padding: 0;
    gap: 4px;
    transition: filter .3s;
}
footer .nav__logo-widget:hover {
    background: none;
    border-color: transparent;
    transform: none;
    filter: drop-shadow(0 0 10px rgba(249,115,22,.5));
}
footer .nav__logo-widget .nav__logo-widget-icon {
    width: 24px; height: 24px;
}
footer .nav__logo-widget .nav__logo-widget-brand {
    font-size: .52rem;
}
footer .nav__logo-widget .nav__logo-widget-slogan {
    display: none;
}
footer .nav__logo-widget .nav__logo-widget-f {
    background: none;
    -webkit-text-fill-color: #f97316;
    color: #f97316;
    filter: none;
}

/* ── Nav-context overrides — flat wordmark style ─────────────── */
.nav .nav__logo-widget {
    background: none;
    border: none;
    border-radius: 0;
    padding: 0;
    gap: 7px;
    transition: filter .3s;
}
.nav .nav__logo-widget:hover {
    background: none;
    border-color: transparent;
    transform: none;
    filter: drop-shadow(0 0 10px rgba(249,115,22,.5));
}
.nav .nav__logo-widget .nav__logo-widget-icon {
    width: 48px; height: 48px;
}
.nav .nav__logo-widget .nav__logo-widget-brand {
    font-size: 1.05rem;
}
.nav .nav__logo-widget .nav__logo-widget-slogan {
    display: none;
}
.nav .nav__logo-widget .nav__logo-widget-f {
    background: none;
    -webkit-text-fill-color: #f97316;
    color: #f97316;
    filter: none;
}