/* Hero Start */
section.our-values-hero {
    background: var(--t1-color);
    position: relative;
    display: flex;
    padding: 6px 0 104px 0;
}
section.our-values-hero .content {
    display: unset;
}
section.our-values-hero .txtContent{
    margin-top: 36px;
}
.txtContent h6 {
    color: var(--s1-color);
    font-family: var(--ff-cp-medium);
    font-size: 18px;
    margin: 18px 0px;
}
.txtContent h1 {
    color: var(--p-color);
    max-width: 530px;
    padding-top: 10px;
}
.txtContent h1 span {
    color: var(--s-color);
}
.our-values-hero .txtContent p {
    color: var(--p-color);
}
section.our-values-hero .txtContent {
    float: left;
    width: 49.4%;
}
section.our-values-hero .imgContent {
    float: right;
    width: 40.3%;
}
.our-values-hero__bg__span {
    transform-origin: bottom left;
    background: var(--w-color);
    height: 100%;
    display: block;
    width: 100%;
    position: absolute;
    z-index: 0;
    transform: skewY(-11deg);
    top: 0;
}
section.our-values-hero .container {
    z-index: 2;
    overflow: visible;
}
/* Hero End */

/* Blank Section Start */
section.timeline-blank-section {
    height: 200px;
    position: relative;
    background: var(--t1-color);
    overflow: hidden;
}
.timeline-blank-section__bg__span {
    transform-origin: top left;
    background: var(--p-color);
    height: 123%;
    display: block;
    width: 100%;
    position: absolute;
    z-index: 0;
    transform: skewY(6deg);
}
/* Blank Section End */

/* Our Values Section Start */
section.our-values {
    position: relative;
    display: flex;
    padding-bottom: 130px;
    background: var(--p-color);
}
.timeline-hero__bg__span2 {
    transform: matrix(1, -0.25, 0, 1, 0, 0);
    transform-origin: bottom left;
    background: var(--p-color);
    height: 95%;
    display: block;
    width: 100%;
    position: absolute;
    z-index: -1;
    transform: skewY(-10.9deg);
}
section.our-values .container {
    z-index: 2;
    overflow: visible;
}
section.our-values .txtContent p {
    color: var(--t1-color);
    margin: 25px 0;
    padding-bottom: 25px;
}
section.our-values .txtContent h2 {
    font-family: var(--ff-cp-regular);
    font-size: 40px;
    color: var(--w-color);
    margin-bottom: 30px;
}
section.our-values .txtContent span {
    color: var(--s-color);
}

section.our-values .txtContent {
    width: 47.5%;
}
section.our-values .imgContent {
    width: 47.5%;
}
section.our-values .txtContent h6 {
    color: var(--s1-color);
    font-size: 20px;
    line-height: 25.14px;
    font-family: var(--ff-cp-medium);
    margin-top: 38px;
    margin-bottom: -7px;
}
.our-values .content {
    display: unset;
}
.our-values-content-wrapper {
    display: flex;
    flex-direction: column;
}
.our-values-cards-wrapper {
    background: #ffffff;
    max-width: 300px;
    border-radius: 20px;
    text-align: center;
    padding: 45px 20px;
}
.our-values-card-img img {
    max-width: 200px;
    height: 261px;
}
.our-values-card-title h3 {
    font-size: 32px;
    color: var(--s-color);
    font-family: var(--ff-cp-medium);
    margin-block: 32px;
}
.our-values-card-description p {
    color: var(--p-color);
    font-size: 16px;
    line-height: 29px;
}
.our-values-cards {
    display: flex;
    gap: 8px;
}
/* Our Values Section End */

/* Image Text Section Start */
.image-text.elevate-bg-div .text-content span {
    color: var(--s-color);
}
section.image-text {
    padding: 90px 0px;
}
.text-content {
    max-width: 511px;
}
.image-text .content-wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.text-content h6 {
    font-family: var(--ff-cp-medium);
    color: var(--s1-color);
    font-size: 20px;
    line-height: 25.14px;
    margin-bottom: 20px;
}
.text-content h2 {
    color: var(--p-color);
    font-size: 40px;
    font-family: var(--ff-cp-medium);
    line-height: 50px;
}
.text-content p {
    color: var(--p2-color);
    font-size: 16px;
    line-height: 29px;
}
.content-wrapper:nth-of-type(odd) {
    padding-top: 50px;
    padding-bottom: 50px;
}
.content-wrapper:nth-of-type(even) {
    flex-direction: row-reverse;
    padding-top: 50px;
    padding-bottom: 50px;
}
/* Image Text Section End */

/* Elevate Image Start */
section.elevate .imgContent {
    max-width: 597px;
}
section.elevate .imgContent img {
    border-radius: 36px;
}
.for-elevate-section .timeline-blank-section__bg__span {
    background: var(--t1-color);
}
section.timeline-blank-section.for-elevate-section {
    background: none;
}
section.elevate {
    background: var(--t1-color);
    position: relative;
    display: flex;
    padding: 40px 0 120px 0;
}
.elevate__bg__span {
    transform-origin: bottom left;
    background: var(--w-color);
    height: 100%;
    display: block;
    width: 100%;
    position: absolute;
    z-index: 0;
    transform: skewY(-11deg);
    top: 0;
}
section.elevate .container {
    z-index: 2;
    overflow: visible;
}
.elevate h2 {
    font-family: var(--ff-cp-medium);
    color: var(--p-color);
    font-size: 40px;
    line-height: 50px;
}
.elevate .txtContent p {
    font-size: 16px;
    color: var(--p-color);
    line-height: 29px;
}
.elevate .txtContent {
    max-width: 511px;
}
.elevate span {
    color: var(--s-color);
}
/* Elevate Image End */

.page-template-core-values .container::before, .page-template-core-values .container::after {
    display: none;
}

@media (min-width: 1180px) and (max-width: 1180px) and (min-height: 820px) and (max-height: 820px) and (orientation: landscape) {
    .our-values-cards {
        flex-wrap: wrap;
    }
}

/* Responsive CSS Starts Here */
@media only screen and (max-width: 1024px) {
/* Hero Section 1024 Starts Here */
    section.our-values-hero .content {
        display: flex;
        flex-direction: column;
    }
    section.our-values-hero .txtContent {
        width: 100%;
        text-align: center;
    }
    section.our-values-hero .imgContent {
        width: 100%;
        text-align: center;
    }
    .our-values-hero .txtContent h1 {
        max-width: 100%;
    }    
/* Hero Section Ends Here */

/* Our Values Section 1024 Starts Here */
    section.our-values .txtContent {
        width: 100%;
        text-align: center;
    }
    .our-values-cards {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        margin: 0 auto;
        gap: 15px;
    }
    section.timeline-blank-section {
        height: 151px;
    }
/* Our Values Section Ends Here */

/* Text Image 50/59 Section 1024 Starts Here */
    section.image-text .content-wrapper {
        display: flex;
        flex-direction: column;
    }
    .image-text .text-content {
        max-width: 100%;
        text-align: center;
    }
    .image-text .image-content {
        margin-top: 80px;
        max-width: 100%;
        width: 100%;
        text-align: center;
    }
    section.image-text {
        padding: 20px 0px;
    }
/* Text Image 50/59 Section 1024 Ends Here */

/* Elevate Section 1024 Starts Here */
    .elevate .content {
        flex-direction: column;
    }
    .elevate .txtContent {
        max-width: 100%;
        text-align: center;
    }
    .elevate .imgContent {
        margin-top: 60px;
    }
/* Elevate Section 1024 Ends Here */
}


@media only screen and (max-width: 640px) {
/* Hero Area 640 Start */
    section.our-values-hero .txtContent {
        text-align: left;
    }
    .our-values-hero .txtContent h1 {
        font-size: 40px;
        line-height: 50px;
    }
    section.our-values-hero {
        padding: 6px 0 55px 0;
    }
/* Hero Area 640 End */

/* Our Values 640 Start */
    section.our-values .txtContent {
        text-align: left;
    }
    section.our-values .txtContent h2 {
        font-size: 32px;
    }
    .our-values-cards {
        grid-template-columns: repeat(1, 1fr);
    }
/* Our Values 640 End */

/* Image/Text 50/50 640 Start */
    .image-text .text-content {
        text-align: left;
    }
    .image-text .text-content h2 {
        font-size: 32px;
        line-height: 40px;
    }
/* Image/Text 50/50 640 End */

/* Elevate 640 Start */
    .elevate h2 {
        font-size: 32px;
        line-height: 40px;
    }
    .elevate .txtContent {
        text-align: left;
    }
/* Elevate 640 End */

}
/* Responsive CSS Ends Here */