.kkm-growth,
.kkm-growth * {
    box-sizing: border-box;
}

.kkm-growth {
    --kkm-growth-container-width: 1500px;
    --kkm-growth-bar-start: #5d9cf7;
    --kkm-growth-bar-end: #0b3f92;
    position: relative;
    overflow: hidden;
    padding: 70px 20px 70px;
    background: #fff;
    font-family: 'Inter', Arial, sans-serif;
    isolation: isolate;
}

.kkm-growth::before,
.kkm-growth::after {
    content: '';
    position: absolute;
    z-index: 0;
    pointer-events: none;
    opacity: .18;
}

.kkm-growth::before {
    left: -90px;
    top: -15px;
    width: 390px;
    height: 280px;
    background:
        repeating-linear-gradient(145deg, transparent 0 11px, rgba(67,119,188,.38) 12px 13px, transparent 14px 23px);
    transform: skewX(-18deg);
    mask-image: linear-gradient(135deg,#000 0%,transparent 72%);
    -webkit-mask-image: linear-gradient(135deg,#000 0%,transparent 72%);
}

.kkm-growth::after {
    right: -20px;
    bottom: -25px;
    width: 280px;
    height: 300px;
    border: 2px solid rgba(62,118,191,.18);
    clip-path: polygon(35% 0,100% 26%,100% 100%,0 100%,0 38%);
}

.kkm-growth__world {
    position: absolute;
    inset: 210px 16% 120px 14%;
    z-index: 0;
    opacity: .24;
    pointer-events: none;
    background: url('../img/kkm-growth-world-map.svg') center / contain no-repeat;
}

.kkm-growth__container {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: var(--kkm-growth-container-width);
    margin: 0 auto;
}

.kkm-growth__logo {
    position: absolute;
    top: -28px;
    right: 0;
    z-index: 4;
}

.kkm-growth__logo img {
    display: block;
    width: 250px;
    height: auto;
    max-width: 100%;
}

.kkm-growth__header {
    width: 100%;
    max-width: 980px;
    margin: 0 auto 34px;
    text-align: center;
}

.kkm-growth__preheading {
    margin: 0 0 8px;
    color: #ff6a00;
    font-family: 'Poppins', Arial, sans-serif;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.kkm-growth__title {
    margin: 0;
    color: #0b3478;
    font-family: 'Poppins', Arial, sans-serif;
    font-size: 38px;
    font-weight: 700;
    line-height: 1.14;
    letter-spacing: -.025em;
}

.kkm-growth__decor {
    position: relative;
    width: 340px;
    height: 18px;
    margin: 24px auto 0;
}

.kkm-growth__decor::before,
.kkm-growth__decor::after {
    content: '';
    position: absolute;
    top: 8px;
    width: 145px;
    height: 3px;
    border-radius: 999px;
    background: #0b3478;
}

.kkm-growth__decor::before { left: 0; }
.kkm-growth__decor::after { right: 0; }

.kkm-growth__decor span {
    position: absolute;
    top: 7px;
    left: 50%;
    width: 54px;
    height: 4px;
    transform: translateX(-50%);
    border-radius: 999px;
    background: #ff6a00;
}

.kkm-growth__decor span::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    width: 11px;
    height: 11px;
    transform: translate(-50%,-50%);
    border: 3px solid #fff;
    border-radius: 50%;
    background: #ff6a00;
}

.kkm-growth__chart-wrap {
    position: relative;
    padding-left: 62px;
}

.kkm-growth__y-title {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%) rotate(-90deg);
    transform-origin: center;
    color: #0b3478;
    font-family: 'Poppins', Arial, sans-serif;
    font-size: 17px;
    font-weight: 700;
    white-space: nowrap;
}

.kkm-growth__chart-main {
    display: grid;
    grid-template-columns: 94px minmax(0,1fr);
    height: 560px;
    min-height: 300px;
}

.kkm-growth__y-axis {
    position: relative;
    height: calc(100% - 48px);
}

.kkm-growth__y-label {
    position: absolute;
    right: 15px;
    transform: translateY(-50%);
    color: #0b3478;
    font-family: 'Poppins', Arial, sans-serif;
    font-size: 17px;
    font-weight: 500;
    line-height: 1;
    white-space: nowrap;
}

.kkm-growth__y-label:first-child { transform: translateY(0); }
.kkm-growth__y-label:last-child { transform: translateY(-100%); }

.kkm-growth__plot-scroll {
    min-width: 0;
    height: 100%;
    overflow-x: auto;
    overflow-y: visible;
    scrollbar-width: thin;
    padding-bottom: 4px;
}

.kkm-growth__plot {
    position: relative;
    width: max(100%, calc(var(--kkm-growth-count) * 190px));
    height: 100%;
    border-left: 2px solid #0b3478;
    border-bottom: 2px solid #0b3478;
}

.kkm-growth__grid {
    position: absolute;
    inset: 0 0 48px 0;
    pointer-events: none;
}

.kkm-growth__grid-line {
    position: absolute;
    left: 0;
    right: 0;
    height: 1px;
    background: #dce5f1;
    opacity: .82;
}

.kkm-growth__bars {
    position: absolute;
    inset: 0;
    display: grid;
    grid-template-columns: repeat(var(--kkm-growth-count), minmax(0,1fr));
    align-items: stretch;
    padding: 0 30px;
}

.kkm-growth__point {
    position: relative;
    min-width: 130px;
    height: 100%;
}

.kkm-growth__bar-area {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 48px;
    left: 0;
}

.kkm-growth__bar {
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 122px;
    max-width: 76%;
    height: var(--kkm-growth-bar-height);
    transform: translateX(-50%);
    border-radius: 10px 10px 0 0;
    background: linear-gradient(180deg, var(--kkm-growth-bar-start) 0%, var(--kkm-growth-bar-end) 100%);
    box-shadow: 0 8px 20px rgba(20,74,152,.08);
}

.kkm-growth__bar--custom {
    background: linear-gradient(180deg, var(--kkm-growth-point-color-light) 0%, var(--kkm-growth-point-color) 100%);
}

.kkm-growth__value {
    position: absolute;
    left: 50%;
    bottom: calc(var(--kkm-growth-bar-height) + 10px);
    transform: translateX(-50%);
    color: #0a347a;
    font-family: 'Poppins', Arial, sans-serif;
    font-size: 30px;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
}

.kkm-growth__x-label {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 42px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    color: #0b3478;
    font-family: 'Poppins', Arial, sans-serif;
    font-size: 17px;
    font-weight: 500;
    line-height: 1.15;
    text-align: center;
    white-space: nowrap;
}

.kkm-growth__bottom-label {
    display: inline-flex;
    align-items: center;
    gap: 16px;
    margin-top: 17px;
    margin-left: 0;
    color: #0b3478;
    font-family: 'Poppins', Arial, sans-serif;
    font-size: 17px;
    font-weight: 700;
    line-height: 1;
}

.kkm-growth__bottom-label i {
    display: inline-block;
    width: 0;
    height: 0;
    border-top: 7px solid transparent;
    border-bottom: 7px solid transparent;
    border-left: 9px solid #ff6a00;
}

.elementor-widget-kkm_2026_growth,
.elementor-widget-kkm_2026_growth .elementor-widget-container {
    width: 100% !important;
    max-width: none !important;
    overflow: visible;
}

@media (max-width: 1200px) {
    .kkm-growth__logo { top: -18px; }
    .kkm-growth__header { max-width: 760px; }
    .kkm-growth__title { font-size: 38px; }
    .kkm-growth__chart-wrap { padding-left: 48px; }
    .kkm-growth__chart-main { grid-template-columns: 78px minmax(0,1fr); }
    .kkm-growth__plot { width: max(100%, calc(var(--kkm-growth-count) * 160px)); }
    .kkm-growth__bars { padding-left: 22px; padding-right: 22px; }
}

@media (max-width: 1024px) {
    .kkm-growth__title { font-size: 34px; }
}

@media (max-width: 767px) {
    .kkm-growth {
        padding: 35px 16px 35px;
    }

    .kkm-growth__world {
        inset: 170px 0 110px 0;
        opacity: .16;
    }

    .kkm-growth__logo {
        position: relative;
        top: auto;
        right: auto;
        display: flex;
        justify-content: center;
        margin: 0 0 20px;
    }

    .kkm-growth__header { margin-bottom: 24px; }
    .kkm-growth__title { font-size: 28px; line-height: 1.18; }
    .kkm-growth__decor { width: 220px; margin-top: 18px; }
    .kkm-growth__decor::before,
    .kkm-growth__decor::after { width: 88px; }
    .kkm-growth__decor span { width: 38px; }

    .kkm-growth__chart-wrap { padding-left: 30px; }
    .kkm-growth__y-title { left: -15px; font-size: 13px; }
    .kkm-growth__chart-main { grid-template-columns: 58px minmax(0,1fr); height: 430px; }
    .kkm-growth__y-label,
    .kkm-growth__x-label,
    .kkm-growth__bottom-label { font-size: 13px; }
    .kkm-growth__y-label { right: 9px; }
    .kkm-growth__plot { width: max(100%, calc(var(--kkm-growth-count) * 125px)); }
    .kkm-growth__bars { padding-left: 10px; padding-right: 10px; }
    .kkm-growth__point { min-width: 105px; }
    .kkm-growth__bar { width: 72px; max-width: 74%; }
    .kkm-growth__value { font-size: 20px; }
    .kkm-growth__bottom-label { margin-top: 14px; gap: 10px; }
}


/* v9.0.90 typography normalization */

.kkm-growth__preheading {
    font-size: 13px;
    line-height: 1.2;
}

.kkm-growth__title {
    font-size: 38px;
    font-weight: 700;
    line-height: 1.16;
}

@media (max-width: 1024px) {
    .kkm-growth__preheading {
        font-size: 13px;
        line-height: 1.2;
    }

    .kkm-growth__title {
        font-size: 34px;
        line-height: 1.16;
    }
}

@media (max-width: 767px) {
    .kkm-growth__preheading {
        font-size: 12px;
        line-height: 1.2;
    }

    .kkm-growth__title {
        font-size: 28px;
        line-height: 1.16;
    }
}