.header-area{
    background-color: black;
}
@media(min-width: 1800px) {
    .container.large {
        max-width:1750px
    }
}
.hero-area-inner {
    padding-top: 197px;
    padding-bottom: 93px
}

@media only screen and (max-width: 1199px) {
    .hero-area-inner {
        padding-top:137px;
        padding-bottom: 73px
    }
}

@media only screen and (max-width: 767px) {
    .hero-area-inner {
        padding-top:117px;
        padding-bottom: 50px
    }
}

.hero-area .section-title {
    font-size: 80px;
    line-height: .95;
    margin-top: -22px;
    line-height: 1.2;
}

@media only screen and (max-width: 1919px) {
    .hero-area .section-title {
        font-size:70px;
        margin-top: -15px
    }
}

@media only screen and (max-width: 1599px) {
    .hero-area .section-title {
        font-size:60px;
        margin-top: -15px
    }
}

@media only screen and (max-width: 1199px) {
    .hero-area .section-title {
        margin-top:0
    }
}

@media only screen and (max-width: 991px) {
    .hero-area .section-title {
        font-size:60px
    }
}

@media only screen and (max-width: 767px) {
    .hero-area .section-title {
        font-size:50px
    }
}

@media(max-width: 575px) {
    .hero-area .section-title {
        font-size:40px
    }
}

.hero-area .section-title .shape-1 {
    height: 95px
}

@media only screen and (max-width: 1919px) {
    .hero-area .section-title .shape-1 {
        height:65px
    }
}

@media only screen and (max-width: 767px) {
    .hero-area .section-title .shape-1 {
        display:none
    }
}

.hero-area .section-content {
    display: grid;
    gap: 30px 80px;
    grid-template-columns: 435px auto
}

@media only screen and (max-width: 1399px) {
    .hero-area .section-content {
        grid-template-columns:335px auto
    }
}

@media only screen and (max-width: 1199px) {
    .hero-area .section-content {
        grid-template-columns:auto
    }
}

.hero-area .section-content .text-wrapper p{
    max-width: 800px;
}

.hero-area .section-content .text-wrapper p.text {
    font-size: 26px;
    line-height: 1.27;
    max-width: 625px;
    font-weight: 500;
}



@media only screen and (max-width: 1399px) {
    .hero-area .section-content .text {
        font-size:20px
    }
}

.hero-area .section-content .text-wrapper {
    margin-top: 45px;
    margin-inline-start:200px
}

@media only screen and (max-width: 1919px) {
    .hero-area .section-content .text-wrapper {
        margin-inline-start:200px
    }
}

@media only screen and (max-width: 1599px) {
    .hero-area .section-content .text-wrapper {
        margin-inline-start:0px
    }
}

@media only screen and (max-width: 767px) {
    .hero-area .section-content .text-wrapper {
        margin-inline-start:0;
        margin-top: 35px
    }
}

.hero-area .section-content .wc-btn-underline {
    max-width: 300px;
    white-space: normal;
    font-size: 18px;
    line-height: 26px;
    font-family: var(--font_beatricetrial);
    text-transform: none;
    font-weight: 400;
    gap: 40px;
    padding-top: 20px;
    padding-bottom: 0;
    color: var(--primary)
}

.hero-area .section-content .wc-btn-underline:before {
    top: 0;
    height: 1px
}

.hero-area .section-content .wc-btn-underline i {
    transform: rotate(-45deg);
    font-size: 20px
}

.dir-rtl .hero-area .section-content .wc-btn-underline i {
    transform: rotate(-135deg)
}

.image-wrapper .p-relative {
    z-index: 99
}

.experience {
    width: 310px;
    aspect-ratio: 100/100;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    border-radius: 50%;
    background-color: #fbf9f9;
    position: absolute;
    inset-inline-start: 0;
    top: -116px;
    text-align: center;
}

.dark .experience {
    background-color: var(--black)
}

@media only screen and (max-width: 1919px) {
    .experience {
        width:250px
    }
}

@media only screen and (max-width: 1199px) {
    .experience {
        top:0
    }
}

@media only screen and (max-width: 991px) {
    .experience {
        width:200px
    }
}

@media only screen and (max-width: 767px) {
    .experience {
        position:static;
        margin-bottom: 30px;
    }
}

.experience .number {
    font-size: 110px;
    font-weight: 600;
    font-family: 'Instrument Sans';
}

@media only screen and (max-width: 1919px) {
    .experience .number {
        font-size:100px
    }
}

@media only screen and (max-width: 991px) {
    .experience .number {
        font-size:70px
    }
}

.experience .text {
    font-size: 24px;
    line-height: 1.16;
    font-weight: 400
}

@media only screen and (max-width: 1919px) {
    .experience .text {
        font-size:20px
    }
}

@media only screen and (max-width: 991px) {
    .experience .text {
        font-size:16px
    }
}

.experience .text br {
    display: block
}
















.about-area .section-heading {
    text-align: center
}

.about-area .section-heading .section-title {
    max-width: 610px;
    margin-inline:auto;
    line-height: 1.2;
}

.about-area .section-heading .section-desc {
    max-width: 820px;
    margin: auto;
    margin-top: 22px;
}

.about-area .about-thumb {
    text-align: center;
    margin-top: 14px
}

/* .about-area .about-thumb img {
    width: 450px
}

.dir-rtl .about-area .about-thumb img {
    transform: rotateY(180deg)
}

@media only screen and (max-width: 991px) {
    .about-area .about-thumb img {
        width:350px
    }
}

@media only screen and (max-width: 767px) {
    .about-area .about-thumb img {
        width:250px
    }
} */






/*
.feature-area {
    background-color: #f0f2f4;
    border-radius: 20px;
    padding-inline:45px}

.dark .feature-area {
    background-color: #1b1b1b
}

@media only screen and (max-width: 991px) {
    .feature-area {
        padding-inline:15px
    }
}

.feature-area .section-title {
    max-width: 820px
}

.feature-area .section-content {
    display: grid;
    gap: 40px 60px;
    grid-template-columns: auto 550px;
    align-items: flex-start;
    margin-top: 63px
}

@media only screen and (max-width: 1919px) {
    .feature-area .section-content {
        margin-top:53px
    }
}

@media only screen and (max-width: 1399px) {
    .feature-area .section-content {
        margin-top:43px;
        grid-template-columns: auto 450px
    }
}

@media only screen and (max-width: 1199px) {
    .feature-area .section-content {
        margin-top:33px;
        grid-template-columns: auto
    }
}

.feature-area .feature-thumb {
    border-radius: 20px;
    overflow: hidden;
    display: inline-block;
    position: relative;
    max-width: 660px
}

.feature-area .feature-thumb .thumb img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.feature-area .feature-thumb .info {
    text-align: center
}

.feature-area .feature-thumb .info img {
    width: 90px
}

@media only screen and (max-width: 767px) {
    .feature-area .feature-thumb .info img {
        width:60px
    }
}

.feature-area .feature-thumb .info .text {
    font-size: 24px;
    line-height: 1.08;
    margin-top: 11px;
    color: var(--white);
    font-family: var(--font_instrumentsans);
    font-weight: 500
}

@media only screen and (max-width: 767px) {
    .feature-area .feature-thumb .info .text {
        font-size:18px
    }
}

.feature-area .feature-thumb .btn-wrapper {
    background-color: #f0f2f4;
    position: absolute;
    inset-inline-start: 110px;
    bottom: 0;
    padding: 25px 35px 19px;
    border-radius: 20px 20px 0 0
}

.dark .feature-area .feature-thumb .btn-wrapper {
    background-color: #1b1b1b
}

@media only screen and (max-width: 767px) {
    .feature-area .feature-thumb .btn-wrapper {
        inset-inline-start:40px;
        padding: 15px 25px 15px
    }
}

.feature-area .feature-thumb .btn-wrapper:before {
    content: "";
    width: 40px;
    height: 40px;
    background-color: rgba(0,0,0,0);
    border-radius: 50%;
    position: absolute;
    bottom: 0;
    right: 100%;
    box-shadow: 20px 20px 0 #f0f2f4
}

.dark .feature-area .feature-thumb .btn-wrapper:before {
    box-shadow: 20px 20px 0 #1b1b1b
}

.feature-area .feature-thumb .btn-wrapper:after {
    content: "";
    width: 40px;
    height: 40px;
    background-color: rgba(0,0,0,0);
    border-radius: 50%;
    position: absolute;
    bottom: 0;
    left: 100%;
    box-shadow: -20px 20px 0 #f0f2f4
}

.dark .feature-area .feature-thumb .btn-wrapper:after {
    box-shadow: -20px 20px 0 #1b1b1b
}

.feature-area .features-wrapper>* {
    border-bottom: 1px solid var(--border);
    padding: 37px 0 33px
}

@media only screen and (max-width: 1399px) {
    .feature-area .features-wrapper>* {
        padding:27px 0 23px
    }
}

.feature-area .features-wrapper>*:first-child {
    border-top: 1px solid var(--border)
}

.feature-area .feature-box {
    display: grid;
    gap: 20px 44px;
    grid-template-columns: auto 1fr;
    align-items: flex-start
}

@media only screen and (max-width: 1399px) {
    .feature-area .feature-box {
        gap:20px 34px
    }
}

@media(max-width: 575px) {
    .feature-area .feature-box {
        grid-template-columns:auto
    }
}

.feature-area .feature-box .thumb img {
    max-width: 96px
}

@media only screen and (max-width: 1399px) {
    .feature-area .feature-box .thumb img {
        max-width:76px
    }
}

.feature-area .feature-box .title {
    font-size: 24px;
    line-height: 1
}

.feature-area .feature-box .text {
    margin-top: 16px
} */











.counter-area {
    background-color: #f9f9f9;
}
.counter-area .section-header {
    display: grid;
    gap: 20px 70px;
    grid-template-columns: auto 1000px;
    justify-content: flex-end;
    margin-inline-end:80px;margin-bottom: 89px
}

@media only screen and (max-width: 1919px) {
    .counter-area .section-header {
        margin-inline-end:50px;
        margin-bottom: 59px
    }
}

@media only screen and (max-width: 1199px) {
    .counter-area .section-header {
        grid-template-columns:auto 690px
    }
}

@media only screen and (max-width: 991px) {
    .counter-area .section-header {
        grid-template-columns:auto
    }
}

@media only screen and (max-width: 767px) {
    .counter-area .section-header {
        margin-inline-end:0;
        margin-bottom: 39px
    }
}

@media(max-width: 575px) {
    .counter-area .section-header {
        justify-content:center
    }
}

.counter-area .section-header .text {
    max-width: 375px
}

.counter-area .content-last {
    display: flex;
    align-items: center;
    gap: 20px 110px
}

@media(max-width: 575px) {
    .counter-area .content-last {
        flex-direction:column;
        align-items: flex-start
    }
}

.counter-area .section-title {
    font-size: 60px;
    max-width: 500px;
}

@media only screen and (max-width: 1919px) {
    .counter-area .section-title {
        font-size:60px
    }
}

@media only screen and (max-width: 1199px) {
    .counter-area .section-title {
        font-size:46px
    }
}

@media only screen and (max-width: 991px) {
    .counter-area .section-title {
        font-size:40px
    }
}

@media only screen and (max-width: 767px) {
    .counter-area .section-title {
        font-size:35px
    }
}

.counter-area .section-subtitle {
    font-size: 18px;
    font-family: var(--font_plusjakartasans);
    color: var(--primary)
}

.counter-area .section-subtitle span {
    font-weight: 700
}

.counter-area .subtitle-wrapper {
    margin-top: 20px
}

.counter-area .text-wrapper {
    margin-top: 20px
}

.counter-item {
    width: 380px;
    height: 380px;
    border: 1px solid var(--border);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    padding: 0 30px;
    text-align: center
}

@media only screen and (max-width: 1399px) {
    .counter-item {
        width:340px;
        height: 340px
    }
}

@media only screen and (max-width: 1199px) {
    .counter-item {
        width:260px;
        height: 260px
    }
}

.counter-item .number {
    font-size: 80px;
    font-weight: 500;
    font-family: "Instrument Sans", sans-serif;
}

@media only screen and (max-width: 1399px) {
    .counter-item .number {
        font-size:80px
    }
}

@media only screen and (max-width: 1199px) {
    .counter-item .number {
        font-size:60px
    }
}

.counter-item .text {
    font-size: 20px;
    font-family: var(--font_plusjakartasans);
    color: var(--primary);
    margin-top: 15px
}

.counter-item .text span {
    font-weight: 700
}

.counter-wrapper {
    display: flex
}

@media only screen and (max-width: 767px) {
    .counter-wrapper {
        display:grid;
        grid-template-columns: auto auto
    }
}

@media(max-width: 575px) {
    .counter-wrapper {
        grid-template-columns:auto;
        justify-content: center
    }
}

.counter-wrapper>*:not(:first-child) {
    margin-inline-start:-70px}

@media only screen and (max-width: 1199px) {
    .counter-wrapper>*:not(:first-child) {
        margin-inline-start:-30px
    }
}

@media only screen and (max-width: 767px) {
    .counter-wrapper>*:not(:first-child) {
        margin-inline-start:0px
    }
}



















.feature-area {
    background-color: var(--theme)
}

.feature-area .section-title {
    max-width: 730px;
    margin-inline:auto;color: var(--black)
}

@media only screen and (max-width: 1399px) {
    .feature-area .section-title {
        max-width:610px
    }
}

@media only screen and (max-width: 1199px) {
    .feature-area .section-title {
        max-width:460px
    }
}

@media only screen and (max-width: 991px) {
    .feature-area .section-title {
        max-width:460px;
        margin: 0
    }
}

.feature-area .section-header .text {
    max-width: 400px;
    margin-inline-start: 410px;
    color: var(--black)
}

@media only screen and (max-width: 1399px) {
    .feature-area .section-header .text {
        margin-inline-start:520px
    }
}

@media only screen and (max-width: 1199px) {
    .feature-area .section-header .text {
        margin-inline-start:430px
    }
}

@media only screen and (max-width: 991px) {
    .feature-area .section-header .text {
        max-width:460px;
        margin: 0
    }
}

.feature-area .section-header .text-wrapper {
    margin-top: 22px
}

@media only screen and (max-width: 1199px) {
    .feature-area .section-header .text-wrapper {
        margin-top:12px
    }
}

.feature-area .section-header .section-title-wrapper {
    position: relative
}

.feature-area .section-header .section-title-wrapper .shape-1 {
    position: absolute;
    width: 93px;
    top: -60px;
    inset-inline-start: 43%;
    z-index: 99
}

@media only screen and (max-width: 1199px) {
    .feature-area .section-header .section-title-wrapper .shape-1 {
        display:none
    }
}

.feature-area .features-wrapper-box {
    margin-top: 73px;
    overflow: hidden
}

@media only screen and (max-width: 1199px) {
    .feature-area .features-wrapper-box {
        margin-top:53px
    }
}

.feature-area .features-wrapper {
    display: grid;
    gap: 0 0;
    grid-template-columns: repeat(3, 1fr);
    margin: 0 -80px
}

@media only screen and (max-width: 1399px) {
    .feature-area .features-wrapper {
        margin:0 -80px
    }
}

@media only screen and (max-width: 1199px) {
    .feature-area .features-wrapper {
        margin:0 -30px
    }
}

@media only screen and (max-width: 767px) {
    .feature-area .features-wrapper {
        grid-template-columns:repeat(2, 1fr)
    }
}

@media(max-width: 575px) {
    .feature-area .features-wrapper {
        grid-template-columns:repeat(1, 1fr)
    }
}

.feature-box {
    padding: 0 80px 120px;
    border-inline-end:1px solid rgba(0,0,0,.12)}

@media only screen and (max-width: 1399px) {
    .feature-box {
        padding:0 80px 72px
    }
}

@media only screen and (max-width: 1199px) {
    .feature-box {
        padding:0 30px 52px
    }
}

.feature-box .title {
    font-size: 32px;
    line-height: .88;
    font-weight: 600;
    /* text-transform: uppercase; */
    color: var(--black)
}
.feature-box .title span{
    font-weight: 300;
}

@media only screen and (max-width: 1599px) {
    .feature-box .title {
        font-size:28px
    }
}

.feature-box .content {
    margin-top: 48px
}

@media only screen and (max-width: 1199px) {
    .feature-box .content {
        margin-top:38px
    }
}

.feature-box .text {
    margin-top: 19px;
    color: var(--black)
}