/*
 * Synthvero Brand System
 * Source-controlled product identity.
 *
 * Brand direction:
 * deep navy · royal blue · electric cyan · violet
 */

:root {
    --sv-navy-950: #06101d;
    --sv-navy-900: #081522;
    --sv-navy-850: #0b1929;
    --sv-navy-800: #10243a;

    --sv-blue-600: #2563eb;
    --sv-blue-500: #3478f6;
    --sv-cyan-500: #06b6d4;
    --sv-violet-600: #7c3aed;

    --sv-ink: #0b1628;
    --sv-text: #283a52;
    --sv-muted: #64748b;
    --sv-line: #dce7f4;
    --sv-soft: #f6f9fd;
    --sv-white: #ffffff;

    --sv-gradient:
        linear-gradient(
            100deg,
            var(--sv-blue-600) 0%,
            var(--sv-cyan-500) 48%,
            var(--sv-violet-600) 100%
        );

    --sv-shadow-sm:
        0 8px 28px rgba(15, 35, 64, .07);

    --sv-shadow-lg:
        0 28px 80px rgba(9, 29, 58, .14);
}


/* =========================================================
   SHARED BRAND MARK
   ========================================================= */

.mi-sv-brand-mark {
    display: inline-flex;
    width: 40px;
    height: 40px;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
}

.mi-sv-brand-mark img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.mi-sv-brand-copy {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
}

.mi-sv-brand-copy b {
    color: var(--sv-ink);
    font-size: 18px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -.025em;
}

.mi-sv-brand-copy small {
    margin-top: 5px;
    color: var(--sv-muted);
    font-size: 10px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: .04em;
}


/* =========================================================
   PUBLIC MARKETING HEADER
   ========================================================= */

.mi-mkt-header .mi-mkt-brand {
    display: inline-flex;
    align-items: center;
    gap: 11px;
    text-decoration: none;
}

.mi-mkt-header .mi-mkt-brand:hover {
    opacity: .94;
}

.mi-mkt-header .mi-mkt-brand .mi-sv-brand-mark {
    width: 38px;
    height: 38px;
}


/* =========================================================
   PUBLIC MARKETING FOOTER
   ========================================================= */

.mi-mkt-footer .mi-sv-footer-brand {
    display: flex;
    align-items: flex-start;
    gap: 13px;
}

.mi-mkt-footer .mi-sv-brand-mark {
    width: 42px;
    height: 42px;
}

.mi-mkt-footer .mi-sv-brand-copy b {
    color: inherit;
}


/* =========================================================
   BRAND UTILITY
   ========================================================= */

.sv-gradient-text {
    background: var(--sv-gradient);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 720px) {

    .mi-mkt-header .mi-mkt-brand .mi-sv-brand-mark {
        width: 34px;
        height: 34px;
    }

    .mi-sv-brand-copy b {
        font-size: 16px;
    }

    .mi-sv-brand-copy small {
        font-size: 9px;
    }

}

/* SYNTHVERO DARK HEADER CONTRAST V3 */

.mi-mkt-header .mi-sv-brand-copy b {
    color: #f7fbff;
    text-shadow: 0 1px 1px rgba(0, 0, 0, .08);
}

.mi-mkt-header .mi-sv-brand-copy small {
    color: #9fb0c7;
}

.mi-mkt-header .mi-mkt-brand:focus-visible {
    outline: 2px solid #60a5fa;
    outline-offset: 6px;
    border-radius: 8px;
}