.ksbh-banner {
    position: relative;
    display: flex;
    align-items: center;
    min-height: var(--ksbh-height, 150px);
    margin: 0;
    overflow: hidden;
    color: var(--ksbh-text, #fff);
    background-color: #060606;
    background-image: var(--ksbh-bg, none);
    background-repeat: no-repeat;
    background-position: var(--ksbh-position, center center);
    background-size: cover;
    font-family: Poppins, Arial, Helvetica, sans-serif;
    isolation: isolate;
}

.ksbh-banner,
.ksbh-banner * {
    box-sizing: border-box;
}

.ksbh-banner__overlay {
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(
            90deg,
            rgba(0, 0, 0, calc(var(--ksbh-overlay, .72) + .12)) 0%,
            rgba(0, 0, 0, var(--ksbh-overlay, .72)) 48%,
            rgba(0, 0, 0, calc(var(--ksbh-overlay, .72) * .55)) 100%
        );
}

.ksbh-banner__container {
    width: min(calc(100% - 64px), var(--ksbh-container, 1420px));
    margin-inline: auto;
}

.ksbh-banner__content {
    max-width: 720px;
    padding-block: 25px;
}

.ksbh-banner__title {
    margin: 0;
    color: inherit;
    font-size: clamp(27px, 2.35vw, 34px);
    font-weight: 700;
    line-height: 1.12;
    letter-spacing: -0.02em;
}

.ksbh-banner__description {
    margin: 8px 0 0;
    color: inherit;
    font-size: clamp(14px, 1.05vw, 16px);
    font-weight: 400;
    line-height: 1.45;
}

@media (max-width: 720px) {
    .ksbh-banner {
        min-height: var(--ksbh-height-mobile, 170px);
        background-image: var(--ksbh-bg-mobile, var(--ksbh-bg, none));
        background-position: var(--ksbh-position-mobile, center center);
    }

    .ksbh-banner__container {
        width: min(calc(100% - 30px), var(--ksbh-container, 1420px));
    }

    .ksbh-banner__content {
        max-width: 100%;
        padding-block: 24px;
    }

    .ksbh-banner__title {
        font-size: 25px;
    }

    .ksbh-banner__description {
        margin-top: 7px;
        font-size: 14px;
        line-height: 1.4;
    }
}
