/**
 * SuredaAnalytics wordmark (static/sureda-logo.png)
 *
 * Nav uses CSS Grid so the logo sits in its own column (minmax(0,1fr)) and
 * never draws under .nav-links — flex+space-between often overlapped the
 * wordmark on the home page. The img uses max-width:100% to scale within
 * that column.
 */
nav {
    overflow: visible;
}

nav .nav-container {
    display: grid !important;
    /* Match index: reserve a bit more space so the wordmark can breathe */
    grid-template-columns: minmax(270px, 1.15fr) auto auto;
    align-items: center;
    column-gap: 16px;
    row-gap: 8px;
    justify-content: stretch;
    min-width: 0;
}

@media (max-width: 480px) {
    nav .nav-container {
        grid-template-columns: minmax(0, 1fr) auto auto;
    }
}

/* Home page uses .logo--home + <span> background; flex here collapses empty spans — exclude it */
nav .nav-container > a.logo {
    min-width: 0;
    width: 100%;
    max-width: 100%;
    overflow: visible;
    box-sizing: border-box;
}

nav .nav-container > a.logo:not(.logo--home) {
    display: flex;
    align-items: center;
}

nav .nav-container > a.logo.logo--home {
    display: block;
}

nav .nav-links {
    flex-shrink: 0;
    justify-self: end;
}

nav .nav-container > a.logo > img,
nav a.logo > img {
    display: block;
    width: auto;
    height: auto;
    max-height: clamp(36px, 5vw, 52px);
    max-width: 100%;
    min-width: 0;
    object-fit: contain;
    object-position: left center;
    flex-shrink: 1;
    vertical-align: middle;
    /* No filter here: filter: drop-shadow() on <img> is often clipped in Chrome (top nav). */
}

/* Footer wordmark: full width of column, never clipped */
.footer-brand a.logo {
    display: inline-flex;
    align-items: center;
    max-width: min(380px, 100%);
    box-sizing: border-box;
}

.footer-brand .logo img {
    display: block;
    width: auto;
    height: auto;
    max-height: 42px;
    max-width: 100%;
    min-width: 0;
    object-fit: contain;
    filter: drop-shadow(0 0 10px rgba(0, 210, 255, 0.35));
}

/* Standalone nav-style logo blocks (rare) */
.nav-logo img {
    height: auto;
    max-height: clamp(36px, 4.5vw, 48px);
    width: auto;
    max-width: min(360px, 100%);
    box-sizing: border-box;
    object-fit: contain;
    display: block;
    filter: drop-shadow(0 0 10px rgba(0, 210, 255, 0.4));
}

/* Auth / centered pages */
a.logo-link {
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: min(420px, calc(100vw - 32px));
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
}

a.logo-link > img {
    display: block;
    width: auto;
    height: auto;
    max-height: clamp(40px, 6vw, 56px);
    max-width: 100%;
    min-width: 0;
    object-fit: contain;
    margin: 0 auto;
    filter: drop-shadow(0 0 12px rgba(0, 210, 255, 0.4));
}