.thn2 {
    --blue: #173d7a;
    --green: #4eb67a;
    --peach: #efbd9c;
    --white: #fff;
    width: 100%;
    max-width: 1500px;
    margin: 0 auto;
    box-sizing: border-box;
}

.thn2 *, .thn2 *::before, .thn2 *::after { box-sizing: border-box; }

.thn2-desktop {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 330px;
    gap: 34px;
    align-items: center;
}

.thn2-map {
    position: relative;
    min-width: 0;
    isolation: isolate;
}

.thn2-map__image {
    display: block;
    width: 100%;
    height: auto;
}

.thn2-marker {
    position: absolute;
    top: var(--y);
    left: var(--x);
    z-index: 2;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    transform: translate(-50%, -50%);
    cursor: pointer;
    font: inherit;
}

.thn2-marker__card {
    display: flex;
    align-items: center;
    justify-content: center;
    width: clamp(78px, 8vw, 118px);
    aspect-ratio: 1.58 / 1;
    padding: clamp(2px, .28vw, 4px);
    overflow: hidden;
    background: var(--white);
    border: 1px solid transparent;
    border-radius: 12px;
    box-shadow: 0 7px 20px rgba(23, 61, 122, .17);
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.thn2-marker__card img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.thn2-panel__logo img,
.thn2-mobile-card__logo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.thn2-marker:hover .thn2-marker__card,
.thn2-marker:focus-visible .thn2-marker__card,
.thn2-marker.is-active .thn2-marker__card {
    transform: translateY(-3px) scale(1.035);
    border-color: var(--green);
    box-shadow: 0 12px 28px rgba(23, 61, 122, .24);
}

.thn2-marker:focus-visible { outline: none; }
.thn2-marker:focus-visible .thn2-marker__card { outline: 3px solid var(--green); outline-offset: 4px; }

.thn2-panel {
    align-self: center;
    padding: 26px 22px;
    background: var(--white);
    border: 1px solid rgba(23, 61, 122, .08);
    border-radius: 18px;
    box-shadow: 0 14px 38px rgba(23, 61, 122, .14);
    text-align: center;
}

.thn2-panel__logo {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 190px;
    height: 105px;
    margin: 0 auto 18px;
    padding: 10px;
}

.thn2-panel h3,
.thn2-mobile-card h3 {
    margin: 0 0 22px;
    color: var(--blue);
    font-size: 21px;
    line-height: 1.25;
    font-weight: 800;
    text-transform: uppercase;
}

.thn2-stats {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
}

.thn2-stat {
    padding-top: 13px;
    border-top: 1px dotted rgba(23, 61, 122, .25);
    text-align: center;
}

.thn2-stat:first-child { padding-top: 0; border-top: 0; }

.thn2-stat strong {
    display: block;
    color: var(--blue);
    font-size: 24px;
    line-height: 1.1;
    font-weight: 800;
}

.thn2-stat span {
    display: block;
    margin-top: 5px;
    color: #586476;
    font-size: 12px;
    line-height: 1.3;
}

.thn2-mobile { display: none !important; }

@media (max-width: 1100px) and (min-width: 821px) {
    .thn2-desktop { grid-template-columns: minmax(0, 1fr) 280px; gap: 22px; }
    .thn2-marker__card { width: clamp(66px, 7.4vw, 88px); border-radius: 9px; padding: 2px; }
    .thn2-panel { padding: 20px 16px; }
    .thn2-panel__logo { width: 150px; height: 84px; }
    .thn2-panel h3 { font-size: 17px; }
    .thn2-stat strong { font-size: 20px; }
}

@media (max-width: 820px) {
    .thn2-desktop { display: none !important; }
    .thn2-mobile { display: grid !important; grid-template-columns: 1fr; gap: 16px; }

    .thn2-mobile-card {
        margin: 0;
        padding: 20px 16px;
        background: var(--peach);
        border-radius: 16px;
        box-shadow: 0 6px 18px rgba(23, 61, 122, .09);
        text-align: center;
    }

    .thn2-mobile-card__logo {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 150px;
        height: 85px;
        margin: 0 auto 14px;
        padding: 10px;
        background: var(--white);
        border-radius: 12px;
    }

    .thn2-mobile-card h3 { margin-bottom: 16px; font-size: 17px; }
    .thn2-mobile-card .thn2-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
    .thn2-mobile-card .thn2-stat { padding: 0 4px; border: 0; }
    .thn2-mobile-card .thn2-stat strong { font-size: 18px; }
    .thn2-mobile-card .thn2-stat span { color: var(--blue); font-size: 10px; }
}

.thn2-panel__text,
.thn2-mobile-card__text {
    margin: -8px 0 20px;
    color: #586476;
    font-size: 14px;
    line-height: 1.5;
}
.thn2-panel__text.is-empty { display: none; }
.thn2-mobile-card__text { margin: -6px auto 16px; max-width: 520px; }