.capitalPage {
    &.human_capital {
        .capWrap_1 {
            background-color: var(--humViolet);

            .h2Head {
                .h2HeadInner {
                    background-color: var(--humViolet);
                }
            }
        }

        .capWrap_2 {
            .comm_col {
                .capHead {
                    background-color: var(--humViolet);
                }

                .capCont {
                    &:after {
                        background-color: var(--humViolet);
                    }
                }
            }
        }
    }
}

.stakeWrap {
    .stakeItem {
        width: calc(100% / 2);
    }
}

.human_capital {
    .bannerWrap {
        /* .bannerImg {
            width: 100%;
            height: 750px;

            img {
                width: 100%;
                height: 100%;
                object-fit: cover;
                object-position: top;
            }
        } */
    }
}

.capSec_3 {
    .row_1 {
        .imgBox {
            border: 1px solid #7fc1a4;
        }
    }
}


.humKeyWrap {
    height: 100%;
    padding-top: 70px;

    .humKeyWrapInn {
        position: relative;
        padding: 60px 20px 40px;
        border: 1px solid #000;
        border-radius: 30px;
        background: #fff;
        text-align: center;
        overflow: visible;
        height: 100%;

        &::before {
            content: "";
            position: absolute;
            width: 120px;
            height: 60px;
            top: -1px;
            left: 50%;
            transform: translateX(-50%) translateY(-100%);
            background: linear-gradient(90deg,
                    #d8dd18 0%,
                    #168447 100%);
            border-radius: 100px 100px 0 0;
            z-index: 1;
        }

        .humKeyIcn {
            position: absolute;
            top: -40px;
            left: 50%;
            transform: translateX(-50%);
            width: 80px;
            height: 80px;
            background: #fff;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15);
            z-index: 2;

            img {
                max-width: 45px;
            }
        }
    }
}

.borderHeading {
    h4 {
        display: inline-block;
        border-radius: 40px;
        padding: 10px 20px;
        border: 1px solid #000;
    }
}

.br_btm_1 {
    border-bottom: 1px solid #000;
}

.br_rgt_1 {
    border-right: 1px solid #000;
}

.hgt_100 {
    height: 100%;
}

.humbuildWrap {
    .humbuildRow {
        display: flex;

        .humbuildCol {
            width: calc(33.33% - 10px);
            padding: 0 20px;

            .humbuildWrapInn {
                height: 100%;

                .humbuildHead {
                    border: 2px solid #bcbdbd;
                    border-radius: 50px 0 0 50px;
                    border-bottom: 0;
                    border-right: 0;
                    padding: 10px;
                    position: relative;

                    &::after {
                        content: "";
                        position: absolute;
                        bottom: -1px;
                        left: 0;
                        width: 80%;
                        height: 82px;
                        border: 2px solid #bcbdbd;
                        border-radius: 50px 0 0 50px;
                        border-left: none;
                        border-right: none;
                        border-top: none;
                    }

                    &::before {
                        content: "";
                        position: absolute;
                        top: -12px;
                        right: -22px;
                        width: 24px;
                        height: 24px;
                        border-radius: 50%;
                        border: 2px solid #bcbdbd;
                    }

                    .humbuildIcn {
                        width: 60px;
                        height: 60px;
                        border-radius: 500%;
                        background: linear-gradient(90deg, #d8dd18 0%, #168447 100%);
                        color: #fff;
                        display: flex;
                        align-items: center;
                        justify-content: center;

                        span {
                            font-size: 26px;
                        }
                    }
                }

                .humbuildBdy {
                    border-right: 2px solid #bcbdbd;
                    border-radius: 0 20px 0 0;
                    padding: 20px;
                    position: relative;
                    min-height: 200px;

                    &::before {
                        content: "";
                        position: absolute;
                        bottom: 1px;
                        right: 0;
                        width: 86%;
                        height: 100%;
                        border: 2px solid #bcbdbd;
                        border-radius: 0 20px 0 0;
                        border-left: none;
                        border-right: none;
                        border-bottom: none;
                    }

                    &::after {
                        content: "";
                        position: absolute;
                        bottom: -12px;
                        right: -8px;
                        width: 14px;
                        height: 14px;
                        border-radius: 50%;
                        border: 2px solid #bcbdbd;
                    }


                    .humbuildBdyInn {}
                }
            }
        }
    }
}

.humLearnWrap {
    margin-top: 50px;

    .humLearnRow {
        display: flex;
        justify-content: center;

        .humLearnCol {
            width: 13%;

            .humLearnBx {
                display: flex;
                flex-direction: column;
                gap: 20px;
                align-items: center;
                min-height: 200px;

                .humLearnIcn {
                    width: 140px;
                    height: 140px;
                    background: #fff;
                    border-radius: 50%;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15);
                    border: 12px solid #bcbdbd;
                    position: relative;

                    img {
                        max-width: 60px;
                    }

                }

                .humLearnTxt {
                    text-align: center;
                    height: calc(100% - 140px);

                    .humLearnTxtInn {
                        min-height: 80px;
                    }

                    p {}
                }
            }

            &:not(:last-child) {
                .humLearnBx {

                    .humLearnIcn {

                        &::after {
                            content: "";
                            position: absolute;
                            top: -14px;
                            right: -100px;
                            width: 112px;
                            height: 130px;
                            background-image: url(../images/capitals/human/learn-layer.png);
                            background-repeat: no-repeat;
                            background-size: 100% 100%;
                            transform: rotate(329deg);
                            z-index: -1;
                        }
                    }
                }


            }

            &:nth-child(even) {
                .humLearnBx {
                    flex-direction: column-reverse;

                    .humLearnIcn {
                        &::after {
                            top: auto;
                            bottom: -59px;
                            transform: rotate(120deg);
                        }
                    }
                }
            }

            &:nth-child(odd) {
                .humLearnBx {
                    .humLearnIcn {
                        &::after {
                            top: -59px;
                            right: -101px;
                            transform: rotate(63deg);
                        }
                    }
                }
            }

        }
    }
}

.bg_f1f09b {
    background-color: #f1f09b;
}

.bg_f4f8e8 {
    background-color: #f4f8e8;
}

.bg_f4f8e8 {
    background-color: #f4f8e8;
}

.humWrapBox_8 {
    .borderHeading {
        h4 {
            border: unset;
        }
    }
}

.echHumoutCm {

    position: relative;

    &:not(:last-child) {
        &::after {
            content: "";
            position: absolute;
            top: 0;
            right: 0;
            width: 1px;
            height: 100%;
            background-color: #000;
        }
    }

    .humOutCmWrap {
        .humOutCmIcn {
            width: 80px;
            height: 80px;
            border-radius: 50%;
            border: 1px solid var(--green);
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0 auto 20px;

            img {
                max-width: 45px;
            }
        }

        .humOutCmTxt {
            text-align: center;
        }
    }
}

.gradWrap {
    background: linear-gradient(13deg, rgba(68, 127, 172, 1) 0%, rgba(79, 178, 81, 1) 50%, rgba(224, 225, 105, 1) 100%);
}

.humWrapBox_11 {
    .col_12_1 {
        .col_2 {
            .imgBox {
                border: unset;
                height: 100%;

                img {
                    border-radius: 20px;
                }
            }
        }
    }
}

.humRewardWrap {
    .humRewardRow {
        display: flex;
        flex-wrap: wrap;

        .humRewardCol {
            width: calc(33.33% - 10px);
            padding: 0 14px;

            .humRewardBx {
                .humRewardHead {
                    position: relative;

                    &::after {
                        content: "";
                        position: absolute;
                        top: 50%;
                        transform: translateY(-50%);
                        left: 0;
                        width: 110%;
                        height: 1px;
                        background-color: #000;
                        z-index: -1;
                    }
                }

                .humRewardIcn {
                    width: 80px;
                    height: 80px;
                    border-radius: 50%;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    background-color: #f6f5c2;
                    padding: 15px;
                    margin-bottom: 20px;

                    img {
                        width: 100%;
                        height: 100%;
                        object-fit: contain;
                    }

                }

                .humRewardTxt {}
            }

        }
    }
}

.humAccoladesHead {
    position: relative;
    padding-bottom: 30px;

    &::before {
        content: "";
        position: absolute;
        bottom: 20px;
        left: 50%;
        transform: translateX(-50%);
        width: 40%;
        height: 1px;
        background-color: #000;
    }

    &::after {
        content: "";
        position: absolute;
        bottom: 6px;
        left: 50%;
        transform: translateX(-50%);
        width: 30px;
        height: 30px;
        background-image: url(../images/capitals/human/star.png);
        background-repeat: no-repeat;
        background-size: contain;
    }
}

.leafItem {
    padding: 20px 30px;
    position: relative;
    text-align: center;
    width: 500px;
    margin: 0 auto;

    &::before {
        width: 60px;
        height: 100%;
        position: absolute;
        left: 0;
        top: 50%;
        transform: translateY(-50%);
        background: url(../images/capitals/intellectual/leftLeaf.png) no-repeat center center;
        background-size: auto 100%;
        content: "";
    }

    &::after {
        width: 60px;
        height: 100%;
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%);
        background: url(../images/capitals/intellectual/rightLeaf.png) no-repeat center center;
        background-size: auto 100%;
        content: "";
    }
}



/* start responsive */

@media(max-width: 1768px) {

    /* keep the floating capital icon inside the viewport */
    .capitalPage {
        .capIcon {
            right: 0px;
        }
    }
}

@media(max-width: 1600px) {}

@media(max-width: 1536px) {
    .humLearnWrap {
        .humLearnRow {
            .humLearnCol {
                .humLearnBx {
                    .humLearnIcn {
                        width: 124px;
                        height: 124px;
                        border-width: 10px;

                        img {
                            max-width: 52px;
                        }
                    }

                    .humLearnTxt {
                        height: calc(100% - 124px);
                    }
                }

                &:not(:last-child) {
                    .humLearnBx {
                        .humLearnIcn {
                            &::after {
                                right: -92px;
                                width: 100px;
                                height: 116px;
                            }
                        }
                    }
                }

                &:nth-child(even) {
                    .humLearnBx {
                        .humLearnIcn {
                            &::after {
                                bottom: -52px;
                            }
                        }
                    }
                }

                &:nth-child(odd) {
                    .humLearnBx {
                        .humLearnIcn {
                            &::after {
                                top: -52px;
                                right: -93px;
                            }
                        }
                    }
                }
            }
        }
    }

    .humKeyWrap {
        padding-top: 60px;

        .humKeyWrapInn {
            padding: 55px 15px 30px;
        }
    }

    .humbuildWrap {
        .humbuildRow {
            .humbuildCol {
                padding: 0 14px;
            }
        }
    }
}

@media(max-width: 1440px) {}

@media(max-width: 1366px) {
    .humbuildWrap {
        .humbuildRow {
            .humbuildCol {
                .humbuildWrapInn {
                    .humbuildHead {
                        &::after {
                            bottom: -3px;
                        }
                    }

                    .humbuildBdy {
                        &::before {
                            bottom: -1px;
                            right: -2px;
                        }
                    }
                }
            }
        }
    }

    .humLearnWrap {
        .humLearnRow {
            .humLearnCol {
                .humLearnBx {
                    .humLearnIcn {
                        width: 108px;
                        height: 108px;
                        border-width: 8px;

                        img {
                            max-width: 44px;
                        }
                    }

                    .humLearnTxt {
                        height: calc(100% - 108px);
                    }
                }

                &:not(:last-child) {
                    .humLearnBx {
                        .humLearnIcn {
                            &::after {
                                right: -80px;
                                width: 88px;
                                height: 102px;
                            }
                        }
                    }
                }

                &:nth-child(even) {
                    .humLearnBx {
                        .humLearnIcn {
                            &::after {
                                bottom: -46px;
                            }
                        }
                    }
                }

                &:nth-child(odd) {
                    .humLearnBx {
                        .humLearnIcn {
                            &::after {
                                top: -46px;
                                right: -81px;
                            }
                        }
                    }
                }
            }
        }
    }

    .humbuildWrap {
        .humbuildRow {
            .humbuildCol {
                .humbuildWrapInn {
                    .humbuildHead {
                        .humbuildIcn {
                            width: 52px;
                            height: 52px;

                            span {
                                font-size: 22px;
                            }
                        }
                    }

                    .humbuildBdy {
                        min-height: 170px;
                        padding: 16px;
                    }
                }
            }
        }
    }
}

@media(max-width: 1280px) {
    .humRewardWrap {
        .humRewardRow {
            .humRewardCol {
                padding: 0 10px;
            }
        }
    }

    .humKeyWrap {
        .humKeyWrapInn {
            .humKeyIcn {
                width: 70px;
                height: 70px;
                top: -35px;

                img {
                    max-width: 38px;
                }
            }
        }
    }
}

@media(max-width: 1200px) {
    .leafItem {
        padding: 18px 26px;
    }
}

@media(max-width: 1199px) {

    /* the learning wave is too wide to hold seven steps - lay them out as a grid */
    .humLearnWrap {
        margin-top: 30px;

        .humLearnRow {
            flex-wrap: wrap;
            row-gap: 35px;

            .humLearnCol {
                width: 25%;

                /* the empty boxes only exist to stagger the desktop wave */
                .humLearnBx:empty {
                    display: none;
                }

                .humLearnBx {
                    min-height: 0;
                    gap: 15px;

                    .humLearnIcn {
                        width: 116px;
                        height: 116px;

                        &::after {
                            display: none;
                        }
                    }

                    .humLearnTxt {
                        height: auto;

                        .humLearnTxtInn {
                            min-height: 0;
                        }
                    }
                }

                &:nth-child(even) {
                    .humLearnBx {
                        flex-direction: column;
                    }
                }
            }
        }
    }

    .humWrapBox_9 {
        .humTextWrap {
            &.gradWrap {
                &.wid_40 {
                    width: 50%;
                }
            }
        }
    }

    .humWrapBox_6 {
        .col_2 {
            .row_6_2 {
                .col_2 {
                    .imgBox {
                        width: 500px;
                        margin: 0 auto;
                    }
                }
            }
        }
    }
}

@media(max-width: 1024px) {
    .humbuildWrap {
        .humbuildRow {
            .humbuildCol {
                .humbuildWrapInn {
                    .humbuildBdy {
                        min-height: 150px;
                    }
                }
            }
        }
    }

    .humWrapBox_11 {
        .row_12 {
            .humtxtWrap {
                &.fltRgt {
                    &.wid_50 {
                        width: 100%;
                        margin-left: 0 !important;
                    }
                }
            }
        }
    }
}

@media(max-width: 991px) {

    /* the three build steps stack once the columns get too narrow to read */
    .humbuildWrap {
        .humbuildRow {
            flex-wrap: wrap;

            .humbuildCol {
                width: 50%;

                &:not(:last-child) {
                    margin-bottom: 50px;
                }

                .humbuildWrapInn {
                    .humbuildBdy {
                        min-height: 0;
                    }
                }
            }
        }
    }

    /* stacked outcome columns must not keep their vertical dividers */
    .echHumoutCm {
        margin-bottom: 30px;

        &:nth-child(2) {
            &::after {
                display: none;
            }
        }

        &:not(:last-child) {
            &::after {
                /* display: none; */
            }
        }

        .humOutCmWrap {
            .humOutCmIcn {
                width: 66px;
                height: 66px;
                margin-bottom: 15px;

                img {
                    max-width: 36px;
                }
            }
        }
    }

    .humRewardWrap {
        .humRewardRow {
            row-gap: 30px;

            .humRewardCol {
                width: 100%;

                .humRewardBx {
                    .humRewardHead {
                        &::after {
                            width: 100%;
                        }
                    }

                    .humRewardIcn {
                        width: 66px;
                        height: 66px;
                    }
                }
            }
        }
    }

    /* the floated highlight card gets the full width instead of a narrow sliver */
    .humWrapBox_9 {
        .humTextWrap {
            &.gradWrap {
                float: none;
                width: 100% !important;
                margin-left: 0 !important;
            }
        }
        .row_9_1 {
            .col_2 {
                .imgBox {
                    width: 430px;
                    margin-left: auto;
                }
            }
        }
    }

    .humKeyWrap {
        padding-top: 55px;

        &:not(:last-child) {
            margin-bottom: 25px;
        }
    }

    .humWrapBox_5 {
        .row_5 {
            .col_3 {
                .hgt_100 {
                    padding-right: 0 !important;
                    border-right: unset;

                    .shadowBox {
                        margin-bottom: 0;
                    }
                }
            }
        }
    }
}

@media(max-width: 768px) {
    .humLearnWrap {
        .humLearnRow {
            .humLearnCol {
                width: 33.33%;
            }
        }
    }
}

@media(max-width: 767px) {
    .capSec_2 {
        .col-md-4 {
            margin-bottom: 0px;
        }
    }

    .col_count_2 {
        column-count: 1;
    }

    .humWrapBox_4 {
        .row_4 {
            .fltRgt {
                &.wid_20 {
                    width: 30%;
                }
            }
        }
    }

    .echHumoutCm {
        &:nth-child(2) {
            padding-bottom: 30px;

            &::after {
                height: 1px;
                width: 100%;
                top: auto;
                bottom: 0;
                display: block;
            }
        }

        &:not(:last-child) {
            padding-bottom: 30px;

            &::after {
                height: 1px;
                width: 100%;
                top: auto;
                bottom: 0;
            }
        }
    }

    .humLearnWrap {
        .humLearnRow {
            row-gap: 28px;

            .humLearnCol {
                .humLearnBx {
                    gap: 12px;

                    .humLearnIcn {
                        width: 100px;
                        height: 100px;
                        border-width: 8px;

                        img {
                            max-width: 40px;
                        }
                    }
                }
            }
        }
    }

    .humRewardWrap {
        .humRewardRow {
            .humRewardCol {
                width: 100%;
                padding: 0;

                .humRewardBx {
                    .humRewardHead {
                        &::after {
                            width: 100%;
                        }
                    }
                }
            }
        }
    }

    .borderHeading {
        h4 {
            padding: 8px 16px;
        }
    }

    .leafItem {
        padding: 15px 55px;

        &::before,
        &::after {
            width: 45px;
        }
    }

    .humAccoladesHead {
        padding-bottom: 24px;

        &::before {
            width: 60%;
        }
    }

    /* horizontal rules between stacked columns read better than side borders */
    .br_rgt_1 {
        border-right: 0;
    }

    .humWrapBox_6 {
        .col_2 {
            .row_6_2 {
                .col_2 {
                    .imgBox {
                        width: 100%;
                        margin: 0 auto;
                    }
                }
            }
        }
    }
}

@media(max-width: 640px) {
    .shadowBox2 {
        padding: 15px;
    }

    .humbuildWrap {
        .humbuildRow {
            .humbuildCol {
                .humbuildWrapInn {
                    .humbuildHead {
                        &::after {
                            height: 70px;
                        }
                    }

                    .humbuildBdy {
                        padding: 14px;
                    }
                }
            }
        }
    }
}

@media(max-width: 575px) {
    .humbuildWrap {
        .humbuildRow {
            .humbuildCol {
                width: 100%;
                padding: 0 15px 0 0;
            }
        }
    }

    .humLearnWrap {
        .humLearnRow {
            .humLearnCol {
                width: 50%;

                .humLearnBx {
                    .humLearnIcn {
                        width: 94px;
                        height: 94px;
                        border-width: 7px;

                        img {
                            max-width: 36px;
                        }
                    }
                }
            }
        }
    }


    .humKeyWrap {
        padding-top: 50px;

        .humKeyWrapInn {
            padding: 50px 12px 25px;

            &::before {
                width: 100px;
                height: 50px;
            }
        }
    }

    .leafItem {
        padding: 12px 48px;
        width: 356px;

        &::before,
        &::after {
            width: 38px;
        }
    }


    .humWrapBox_9 {
        .row_9_1 {
            .col_2 {
                .imgBox {
                    width: 100%;
                    margin-left: auto;
                }
            }
        }
    }
}

@media(max-width: 480px) {

    .humWrapBox_4 {
        .row_4 {
            .fltRgt {
                &.wid_20 {
                    width: 100%;
                    margin-left: 0 !important;
                    margin-top: 14px;
                }
            }
        }
    }

    .humLearnWrap {
        .humLearnRow {
            .humLearnCol {
                .humLearnBx {
                    .humLearnIcn {
                        width: 86px;
                        height: 86px;
                        border-width: 6px;

                        img {
                            max-width: 32px;
                        }
                    }
                }
            }
        }
    }

    .humbuildWrap {
        .humbuildRow {
            .humbuildCol {
                .humbuildWrapInn {
                    .humbuildHead {
                        .humbuildIcn {
                            width: 46px;
                            height: 46px;

                            span {
                                font-size: 20px;
                            }
                        }
                    }
                }
            }
        }
    }

    .leafItem {
        width: 300px;

        &::before,
        &::after {
            width: 38px;
        }

    }
}

@media(max-width: 420px) {
    .humLearnWrap {
        .humLearnRow {
            .humLearnCol {
                .humLearnBx {
                    .humLearnIcn {
                        width: 78px;
                        height: 78px;
                    }
                }
            }
        }
    }

    .leafItem {
        padding: 10px 42px;

    }
}

/* end responsive */