/* 중개명장: colors sampled from the approved logo, with darker text accents. */
:root {
    --brand-navy: #061e42;
    --brand-blue: #075bc8;
    --brand-blue-hover: #064aa3;
    --brand-blue-soft: #edf4fd;
    --brand-teal: #00a79d;
    --brand-teal-dark: #007b75;
    --brand-teal-soft: #e6f5f3;
}

/* Display the original artwork without its outer whitespace. No image distortion. */
.hv2-brand.mjlink-brand {
    position: relative;
    display: block;
    flex: 0 0 auto;
    width: 176px;
    aspect-ratio: 1720 / 456;
    overflow: hidden;
}
.mjlink-brand > .mjlink-brand-image {
    position: absolute;
    display: block;
    width: 126.27907%;
    max-width: none;
    height: auto;
    left: -13.48837%;
    top: -29.82456%;
    mix-blend-mode: multiply;
}
.hv2-footer .mjlink-brand {
    width: 136px;
}
.hv2-footer .mjlink-brand-image {
    filter: grayscale(1) contrast(4) invert(1);
    mix-blend-mode: screen;
}
.auth-brand .mjlink-brand {
    width: 212px;
}
.home-site :is(.hv2-logo, .hv2-button, .hv2-desktop-nav a, .hv2-menu summary, .hv2-menu a, .hv2-questions summary, .hv2-footer-links a):focus-visible {
    outline: 3px solid var(--brand-blue);
    outline-offset: 4px;
}
.hv2-footer a:focus-visible {
    outline-color: #58d2c7;
}
.hv2-desktop-nav a:hover {
    color: var(--brand-blue);
}
.hv2-intro-card > .hv2-icon,
.hv2-icon-tile {
    color: var(--brand-teal-dark);
}
@media (max-width: 767px) {
    .hv2-header .mjlink-brand {
        width: 136px;
    }
    .auth-brand .mjlink-brand {
        width: 184px;
    }
}
@media (max-width: 359px) {
    .home-site .hv2-header-inner {
        gap: 8px;
    }
    .hv2-header .mjlink-brand {
        width: 120px;
    }
}