.inno--text {margin-top: 24px}
body .inno--text h1, body .inno-main-container .inno--text H1{font-family: 'Inter';font-weight: 700;font-size: 28px;line-height: 130%;color:var(--text)}
.about--text {display: flex;justify-content: space-between;align-items: flex-start;margin-bottom: 60px;gap:32px;}
.about--text .about--left{max-width: 550px}
.about--text .social--links{display: flex;gap:8px;}
.about--text .social--link{width: 48px;height: 48px;display: flex;align-items: center;justify-content: center;background-color: var(--back--lightgreeen);border-radius: 12px;transition: .4s}
.about--text .social--link:hover{background-color: transparent;}
.about--right-text {padding: 24px;background-color: var(--back--lighter);border-radius: 24px}
.about--right-text h2{font-family: 'Inter';font-weight: 600;font-size: 22px;line-height: 140%;margin-bottom: 8px;}

body .inno--text > h3 {font-family: 'Inter';font-weight: 600;font-size: 22px;line-height: 140%;color:var(--text);margin-bottom: 0;max-width: 540px}

.about--block {background-color: var(--main);padding: 8px;border-radius: 24px;overflow: hidden;margin-top: 40px;}
.about--top {display: flex;gap:8px;}
.about--top .left{width: 40%;background-color: #FFFFFF1A;border-radius: 24px;overflow: hidden;padding: 24px;display: flex;gap:16px;flex-direction: column}
.about--top .right{width: 60%;position: relative}
.about--top-header {display: flex;justify-content: space-between;align-items: flex-start;gap:12px;flex-wrap: wrap}
.about--country {border-radius: 24px;padding: 4px 8px;align-items: center;gap:4px;background-color: #FFFFFF26;font-family: 'Inter';font-weight: 500;font-size: 16px;line-height: 140%;color:#fff;display: flex;white-space: nowrap}
.about--light {font-family: 'Inter';font-weight: 400;font-size: 16px;line-height: 140%;color:#fff;}
.about--back {position: absolute;top:0;left:0;width: 100%;height: 100%;background-size: cover;background-repeat: no-repeat;background-position: bottom center;border-radius: 24px;}

.about--bottom {display: flex;--gap: 4px;--columns: 3;gap: var(--gap);flex-wrap: wrap;border-radius: 24px;background-color: #fff;padding: 8px;margin-top: 8px}
.about--col {width: calc((100% / var(--columns)) - var(--gap) + (var(--gap) / var(--columns)));display: flex;gap:10px;background-color: var(--main);padding: 24px;border-radius: 16px;overflow: hidden}
.about--col-img {width: 32px;}
.about--col-text {width: calc(100% - 32px - 10px);}
.about--col-title {font-family: 'Inter';font-weight: 600;font-size: 18px;line-height: 140%;color:#fff;}
.about--col-desc {margin-top: 6px;font-family: 'Inter';font-weight: 400;font-size: 16px;line-height: 140%;color:#fff;}

.about--block2 {margin-top: 24px;background-color: var(--main);padding: 8px;border-radius: 24px;overflow: hidden;gap:8px;display: flex;flex-direction: column}

.about2--top {display: flex;gap:8px;}
.about2--top .left{width: 35%;background: #FFFFFF1A;padding:24px;border-radius: 24px;display: flex;gap:16px;flex-direction: column}
.about2--top .right{position: relative;width: 65%}
.about2--top .about--back{background-position: top center}

.about2--bottom {background-color: #fff;border-radius: 24px;overflow: hidden;display: flex;justify-content: space-between}
.about2--bottom .left{width: 35%;padding:24px;}
.about2--bottom .left .title{font-family: 'Inter';font-weight: 600;font-size: 22px;line-height: 120%;}
.about2--bottom .left .text{font-family: 'Inter';font-weight: 400;font-size: 16px;line-height: 140%;margin-top: 10px}
.about2--bottom .right{width: 65%;}
.about2--bottom .right img{object-fit: cover;object-position: center;width: 100%;height: 100%;}

.mobile {display: none}

.inno--text .about--right-box p, .inno-main-container .inno--text .about--right-box p {margin-bottom: 0}

@media all and (min-width: 1024px) {
    .about--right-text .social--links {margin-top: 10px}
}

@media all and (max-width: 1024px) {
    .desktop {display: none}
    .mobile {display: block}
    .about2--bottom .right img.mobile {object-fit: contain;max-height: 235px}

    .about--text {flex-wrap: wrap}
    .about--text .about--left {max-width: 100%}
    .about--text .about--right {width: 100%}

    .about--right-text {display: flex;gap:10px;flex-wrap: wrap;justify-content: space-between}

    .about--bottom {--columns: 1;}

    .about--top .left {width: 70%}
    .about--top .right {width: 30%}

    .about2--bottom .left, .about2--top .left{width: 65%;}
    .about2--bottom .right, .about2--top .right{width: 35%;}
    .about2--bottom .left .text {margin-top: 10px}
}

@media all and (max-width: 767px) {
    body .inno--text h1, body .inno-main-container .inno--text H1 {font-size: 20px;}
    .about--top, .about2--top, .about2--bottom {flex-wrap: wrap}

    .about--top .left, .about--top .right,
    .about2--bottom .left, .about2--top .left,
    .about2--bottom .right, .about2--top .right{width: 100%}

    .about--top .right, .about2--top .right {position: relative;height: 0;padding-top: 53.69%}

    .about--col {flex-wrap: wrap}
    .about--col-text {width: 100%}

    .about2--top .about--back {background-image: url(/about/img/image.aboutcompany_mob.png) !important;}
}

@media all and (max-width: 540px) {
    body .inno--text > h3 {max-width: 100%}
}