@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200..700&display=swap');

 .service-thumb video {
    width: 100%;
    height: 100%;
    object-fit: cover; /* fills the container like an image */
    display: block;
    border-radius: inherit; /* if the container has rounded corners */
}

        .choose-us-section .counter-box-items{
    /*background:#fff;*/
    border-radius:18px;
    padding:40px;
    transition:.4s;
    transform-style:preserve-3d;
}

.choose-us-section .counter-box-items:hover{
    transform:perspective(900px) rotateX(8deg) rotateY(-8deg);
    box-shadow:0 25px 50px rgba(0,0,0,.15);
}

.counter-box-items h2{
    transition:.4s;
}

.counter-box-items:hover h2{
    letter-spacing:2px;
}

        .hero-subtitle{
    color:#ffffff;
    font-size:28px;
    font-weight:600;
    margin:20px 0 15px;
}

.hero-desc{
    color:rgba(255,255,255,.85);
    font-size:20px;
    line-height:1.8;
    max-width:720px;
    margin-bottom:40px;
}

.hero-btns{
    display:flex;
    gap:20px;
    flex-wrap:wrap;
    align-items:center;
}

.theme-btn.style-2{
    background:transparent;
    border:2px solid rgba(255,255,255,.7);
    color:#fff;
}


.hero-1 .hero-content .text-1 {
   color:#057fbe;
    text-transform: uppercase;
    font-family: "Teko", sans-serif;
    font-size: 30px;
}
.theme-btn.style-2:hover{
    background:#fff;
    color:#111;
    border-color:#fff;
}

@media(max-width:767px){

    .hero-subtitle{
        font-size:22px;
    }

    .hero-desc{
        font-size:17px;
    }

    .hero-btns{
        gap:15px;
    }

}
        
        .case-study-box-items-2 .content span{
    display:block;
    margin-top:12px;
    color:#6d6d6d;
    font-size:16px;
    line-height:1.6;
}

.case-study-box-items-2 .content span strong{
    color:#111;
    font-weight:600;
}

/*end*/

        .choose-us-section{
    position: relative;
    z-index: 1;
}

.choose-us-section::before{
    content: "";
    position: absolute;
    inset: 0;
    /*background: linear-gradient(*/
    /*    90deg,*/
    /*    rgba(5,18,45,0.92) 0%,*/
    /*    rgba(7,34,73,0.88) 45%,*/
    /*    rgba(10,48,92,0.72) 100%*/
    /*);*/
    
    background: linear-gradient(90deg, rgb(5 18 45 / 17%) 0%, rgb(7 34 73 / 52%) 45%, rgb(10 48 92 / 72%) 100%);
    z-index: -1;
}


        .pull-quote {
    max-width: 900px;
    margin: 0 auto;
    text-align: center;
    color: #fff;
    font-size: 24px;
    line-height: 1.6;
    font-weight: 600;
    font-style: italic;
    position: relative;
    padding: 40px 30px;
}

.pull-quote::before,
.pull-quote::after {
    content: "";
    position: absolute;
    width: 80px;
    height: 4px;
    background: #057fbe;
    left: 50%;
    transform: translateX(-50%);
}

.pull-quote::before {
    top: 0;
}

.pull-quote::after {
    bottom: 0;
}

.quote-icon {
    font-size: 4rem;
    color: #f3922f;
    line-height: 0;
    vertical-align: -20px;
    font-family: Georgia, serif;
}

.quote-icon.end {
    /*vertical-align: -10px;*/
}

@media (max-width: 991px) {
    .pull-quote {
        font-size: 1.6rem;
        padding: 30px 20px;
    }

    .quote-icon {
        font-size: 3rem;
    }
}

@media (max-width: 576px) {
    .pull-quote {
        font-size: 1.25rem;
        line-height: 1.8;
        padding: 25px 15px;
    }

    .quote-icon {
        font-size: 2.5rem;
    }
}


<!--end-->


#mobile-menu .submenu li a{
    position:relative;
    display:block;
    padding:14px 22px;
    transition:.35s ease;
}

#mobile-menu .submenu li a::before{
    content:"";
    position:absolute;
    left:0;
    top:50%;
    width:4px;
    height:0;
    background:#0b8df5;
    transform:translateY(-50%);
    transition:.35s ease;
}

#mobile-menu .submenu li a:hover{
    padding-left:35px;
    color:#0b8df5;
    background:#f7f9fc;
}

#mobile-menu .submenu li a:hover::before{
    height:70%;
}


            .video-section{
    position:relative;
    overflow:hidden;
}

.video-section .bg-video{
    position:absolute;
    top:50%;
    left:50%;
    width:100%;
    height:100%;
    object-fit:cover;
    transform:translate(-50%,-50%);
    z-index:1;
}

/* Dark Overlay */
.video-section .video-overlay{
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.65);
    z-index:2;
}

/* Keep content above video */
.video-section .container{
    position:relative;
    z-index:3;
}

.counter-box h2{
    display:flex;
    align-items:flex-end;
    gap:6px;
}

.counter-box .count{
    font-size:64px;
    line-height:1;
     font-family: 'Oswald', sans-serif!important;
}

.counter-box .unit{
    font-size:26px;
    font-weight:600;
    margin-bottom:8px;
     font-family: 'Oswald', sans-serif!important;
}

            .video-hero{
    position: relative;
    overflow: hidden;
    min-height: 100vh;
}

.hero-video{
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: translate(-50%, -50%);
    z-index: -2;
}

.hero-overlay{
    position: absolute;
    inset: 0;
/*    background: rgba(0,0,0,0.45); */
    z-index: -1;
}

/* Keep all content above the video */
.video-hero .container-fluid,
.video-hero .icon-text,
.video-hero .hero-list,
.video-hero .client-info{
    position: relative;
    z-index: 2;
}


/* ===== Premium Service Section ===== */

.service-section-5{
    position:relative;
  
    background:linear-gradient(180deg,#f7fbff 0%,#ffffff 100%);
    overflow:hidden;
}

.service-section-5::before{
    content:"";
    position:absolute;
    width:700px;
    height:700px;
    background:radial-gradient(circle,#0b79d020 0%,transparent 70%);
    top:-250px;
    left:-250px;
    border-radius:50%;
}

.service-section-5::after{
    content:"";
    position:absolute;
    width:650px;
    height:650px;
    background:radial-gradient(circle,#00bcd420 0%,transparent 70%);
    right:-250px;
    bottom:-250px;
    border-radius:50%;
}

.service-wrapper-5{
    position:relative;
    z-index:2;
}

/* Left */

.service-left{
    position:sticky;
    top:120px;
}

.service-left h2{
    font-size:72px;
    line-height:1;
    margin-bottom:45px;
}

.service-left h2 span{
    display:block;
    color:transparent;
    -webkit-text-stroke:1px #0b79d0;
}

.service-left .theme-btn{
    border-radius:60px;
    transition:.4s;
}

.service-left .theme-btn:hover{
    transform:translateY(-5px);
    box-shadow:0 20px 40px rgba(11,121,208,.18);
}

/* Cards */

.service-box-items-5{
    position:relative;
    background:#fff;
    padding:45px;
    border-radius:25px;
    border:1px solid #edf2f7;
    overflow:hidden;
    transition:.45s ease;
    box-shadow:0 12px 40px rgba(0,0,0,.05);
}

.service-box-items-5::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(135deg,#0b79d0,#00bcd4);
    transform:translateY(100%);
    transition:.45s;
    z-index:0;
}

.service-box-items-5>*{
    position:relative;
    z-index:2;
}

.service-box-items-5:hover{
    transform:translateY(-12px);
    box-shadow:0 30px 60px rgba(0,0,0,.15);
}

.service-box-items-5:hover::before{
    transform:translateY(0);
}

.service-box-items-5>span{
    /*position:absolute;
    top:18px;
    right:25px;
    font-size:70px;
    font-weight:700;
    line-height:1;
    opacity:.08;
    transition:.4s;*/
}

.service-box-items-5:hover>span{
    
    -webkit-text-stroke-color: #fff!important;
}

.service-box-items-5 h3{
    font-size:28px;
    margin-bottom:18px;
    transition:.4s;
}

.service-box-items-5 p{
    color:#666;
    line-height:1.9;
    transition:.4s;
}


.service-box-items-5:hover p{
    color:#fff!important;
}

.service-box-items-5:hover .content h3{
    color:#fff!important;
}

.service-box-items-5:hover h3 a{
    color:#fff!important;
}

.service-box-items-5 .icon{
    width:60px;
    height:60px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#f3f7fb;
    transition:.4s;
}

.service-box-items-5:hover .icon{
    background:#fff;
    transform:rotate(45deg) scale(1.08);
}

/* Stagger Effect */


/* Mobile */

@media(max-width:991px){

    .service-left{
        position:static;
        margin-bottom:50px;
    }

    .service-left h2{
        font-size:48px;
    }

    .service-right .col-lg-6{
        margin-top:0 !important;
    }

    .service-box-items-5{
        padding:35px;
    }
}


/*end*/

/* =========================================================
   MAIN SECTION
========================================================= */

.battery-capacity {

    position: relative;

    width: 100%;

    min-height: 535px;
      padding: 110px 0;

    overflow: hidden;

    background: #f7faf8;

    color: #171c19;

}


.battery-body {

    position: relative;

    width: 38px;

    height: 55px;

    overflow: hidden;

    border: 1px solid rgba(166,220,183,.55);

    border-radius: 4px;

}


.battery-fill {

    position: absolute;

    left: 4px;

    right: 4px;

    bottom: 4px;

    height: 75%;

    background:

        linear-gradient(
            to top,
            #a6dcb7,
            rgba(166,220,183,.35)
        );

    animation:
        batteryCharge 2.5s ease-in-out infinite alternate;

}


@keyframes batteryCharge {

    from {
        height: 55%;
    }

    to {
        height: 82%;
    }

}


.energy-pulse {

    position: absolute;

    left: 0;

    width: 100%;

    height: 2px;

    background: rgba(255,255,255,.9);

    animation:
        pulseMove 1.5s linear infinite;

}


.energy-pulse:nth-child(2) {
    animation-delay: .5s;
}


.energy-pulse:nth-child(3) {
    animation-delay: 1s;
}


@keyframes pulseMove {

    from {
        top: 100%;
        opacity: 0;
    }

    20% {
        opacity: 1;
    }

    to {
        top: -10%;
        opacity: 0;
    }

}



/* =========================================================
   BACKGROUND GRID
========================================================= */

.capacity-grid-bg {

    position: absolute;

    inset: 0;

    background-image:
        linear-gradient(
            rgba(68, 105, 84, .055) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(68, 105, 84, .055) 1px,
            transparent 1px
        );

    background-size: 70px 70px;

    pointer-events: none;

}


/* =========================================================
   CONTAINER
========================================================= */

.capacity-container {

    position: relative;

    z-index: 5;

    width: 90%;

    max-width: 1280px;

    min-height: 535px;

    margin: auto;

    display: flex;

    align-items: center;

}


/* =========================================================
   LEFT
========================================================= */

.capacity-left {

    position: relative;

    z-index: 10;

    width: 48%;

    padding-top: 10px;

}


/* =========================================================
   EYEBROW
========================================================= */

.capacity-eyebrow {

    display: flex;

    align-items: center;

    gap: 12px;

    margin-bottom: 34px;

    color: #508c64;

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 3px;

}


.capacity-eyebrow span {

    display: block;

    width: 40px;

    height: 1px;

    background: #508c64;

}


/* =========================================================
   MAIN HEADING
========================================================= */

/*.capacity-left h2 {*/

/*    margin: 0;*/

/*    padding: 0;*/

/*    font-size: clamp(*/
/*        43px,*/
/*        4.5vw,*/
/*        62px*/
/*    );*/

/*    line-height: 1.08;*/

/*    letter-spacing: -2.5px;*/

/*    font-weight: 800;*/

/*    color: #180032;*/

/*}*/


/*.capacity-left h2 strong {*/

/*    color: #057fbe;*/

/*    font-weight: 800;*/

/*}*/


/* =========================================================
   SERVICES
========================================================= */

.capacity-services {

    display: flex;

    align-items: center;

    flex-wrap: wrap;

    gap: 12px;

    margin-top: 54px;

    color: #727c76;

    font-size: 12px;

}


.capacity-services i {

    width: 4px;

    height: 4px;

    border-radius: 50%;

    background: #5aa16e;

}



/* =========================================================
   RIGHT VISUAL
========================================================= */

.capacity-visual {

    position: absolute;

    right: -40px;

    top: 50%;

    width: 690px;

    height: 690px;

    transform: translateY(-50%);

}


/* =========================================================
   ORBITS
========================================================= */

.orbit {

    position: absolute;

    left: 50%;

    top: 50%;

    border-radius: 50%;

    transform: translate(
        -50%,
        -50%
    );

    pointer-events: none;

}


.orbit-one {

    width: 285px;

    height: 285px;

    border: 1px solid rgba(
        79,
        145,
        101,
        .32
    );

}


.orbit-two {

    width: 440px;

    height: 440px;

    border: 1px dashed rgba(
        79,
        145,
        101,
        .19
    );

}


.orbit-three {

    width: 575px;

    height: 575px;

    border: 1px solid rgba(
        79,
        145,
        101,
        .14
    );

}



/* =========================================================
   ORBIT GLOW
========================================================= */

.capacity-visual::after {

    content: "";

    position: absolute;

    left: 50%;

    top: 50%;

    width: 480px;

    height: 480px;

    transform:
        translate(-50%, -50%);

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(
                115,
                184,
                132,
                .12
            ) 0%,
            rgba(
                115,
                184,
                132,
                .04
            ) 40%,
            transparent 70%
        );

    pointer-events: none;

}



/* =========================================================
   DOTS
========================================================= */

.orbit-dot {

    position: absolute;

    display: block;

    width: 5px;

    height: 5px;

    border-radius: 50%;

    background: #057fbe;

    box-shadow:
        0 0 0 6px
        rgba(
            119,
            186,
            138,
            .10
        );

    z-index: 2;

}


.dot-one {

    left: 49%;

    top: 9%;

}


.dot-two {

    right: 7%;

    top: 46%;

}


.dot-three {

    left: 31%;

    bottom: 8%;

}


.dot-four {

    left: 20%;

    top: 27%;

}



/* =========================================================
   CENTER CIRCLE
========================================================= */

.capacity-center {

    position: absolute;

    z-index: 10;

    left: 50%;

    top: 50%;

    width: 285px;

    height: 285px;

    transform:
        translate(-50%, -50%);

    border-radius: 50%;

    border: 1px solid
        rgba(
            82,
            153,
            103,
            .38
        );

    background:
        radial-gradient(
            circle at center,
            rgba(
                255,
                255,
                255,
                .92
            ) 0%,
            rgba(
                247,
                250,
                248,
                .85
            ) 65%,
            rgba(
                231,
                243,
                234,
                .55
            ) 100%
        );

    box-shadow:
        0 0 40px
        rgba(
            70,
            140,
            88,
            .08
        );

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

}



/* =========================================================
   BATTERY ICON
========================================================= */

.battery-icon {

    position: relative;

    width: 34px;

    height: 52px;

    margin-bottom: 18px;

}


.battery-top {

    position: absolute;

    top: 0;

    left: 11px;

    width: 12px;

    height: 5px;

    border-radius: 2px 2px 0 0;

    background: #057fbe;

}


.battery-body {

    position: absolute;

    left: 2px;

    top: 5px;

    width: 30px;

    height: 44px;

    border: 1px solid #057fbe;

    border-radius: 4px;

    padding: 5px;

    display: flex;

    flex-direction: column;

    justify-content: space-between;

}


.battery-body span {

    display: block;

    height: 8px;

    background: #c5e1eec4;

    border-radius: 1px;

}



/* =========================================================
   CENTER NUMBER
========================================================= */

.capacity-center-number {

    display: flex;

    align-items: baseline;

    justify-content: center;

    gap: 8px;

    width: 100%;

    margin-top: 2px;

    white-space: nowrap;

}


.capacity-center-number .counter {

    display: inline-block;

    font-size: 76px;

    line-height: .8;

    font-weight: 500;

    letter-spacing: -5px;

    color: #057fbe;

}


.center-plus {

    position: relative;

    top: -1px;

    font-size: 52px;

    line-height: 1;

    font-weight: 400;

    color: #17201b;

}


.center-unit {

    position: relative;

    top: -1px;

    font-size: 26px;

    line-height: 1;

    font-weight: 400;

    color: #057fbe;

}



/* =========================================================
   CENTER CAPTION
========================================================= */

.center-caption {

    margin-top: 18px;

    text-align: center;

    font-size: 12px;

    line-height: 14px;

    /*letter-spacing: 2px;*/

    font-weight: 700;

    color: #7c8981;

}



/* =========================================================
   SIDE DATA
========================================================= */

.capacity-data {

    position: absolute;

    z-index: 15;

    display: flex;

    align-items: center;

}


.capacity-data-line {

    width: 55px;

    height: 1px;

    background: #76a987;

}


.capacity-data-content {

    display: flex;

    flex-direction: column;

}


.capacity-data-label {

    margin-bottom: 8px;

    font-size: 12px;

    line-height: 1;

    font-weight: 700;

    /*letter-spacing: 1.5px;*/

    color: #7d8881;

    white-space: nowrap;

}



/* =========================================================
   SIDE NUMBER
========================================================= */

.side-number {

    display: flex;

    align-items: baseline;

    gap: 5px;

    white-space: nowrap;

}


.side-number .counter {

    display: inline-block;

    font-size: 46px;

    line-height: .9;

    font-weight: 500;

    letter-spacing: -2px;

    color: #057fbe;

}


.side-number b {

    font-size: 18px;

    font-weight: 500;

    color: #057fbe;

}


.side-number strong {

    font-size: 35px;

    line-height: 1;

    font-weight: 400;

    color: #17201b;

}


.capacity-data-content p {

    margin: 10px 0 0;

    font-size: 10px;

    color: #7b847e;

    white-space: nowrap;

}



/* =========================================================
   RIGHT 6 GWh
========================================================= */

.capacity-data-right {

    top: 23%;

    right: 2%;

}


.capacity-data-right
.capacity-data-content {

    order: 1;

}


.capacity-data-right
.capacity-data-line {

    order: 0;

    margin-right: 16px;

}



/* =========================================================
   BOTTOM 9 YEARS
========================================================= */

.capacity-data-bottom {

    left: 2%;

    bottom: 29%;

}


.capacity-data-bottom
.capacity-data-line {

    margin-left: 16px;

    order: 1;

}


.capacity-data-bottom
.capacity-data-content {

    order: 0;

}



/* =========================================================
   COUNTER ENTER ANIMATION
========================================================= */

.capacity-center-number,
.capacity-data-right,
.capacity-data-bottom {

    transition:
        opacity .5s ease,
        transform .7s
        cubic-bezier(
            .2,
            .8,
            .2,
            1
        );

}


/* initial */

.battery-capacity:not(.counter-active)
.capacity-center-number {

    opacity: .45;

}


.battery-capacity:not(.counter-active)
.capacity-data-right {

    opacity: .65;

}


.battery-capacity:not(.counter-active)
.capacity-data-bottom {

    opacity: .65;

}



/* active */

.battery-capacity.counter-active
.capacity-center-number {

    opacity: 1;

}


.battery-capacity.counter-active
.capacity-data-right {

    opacity: 1;

}


.battery-capacity.counter-active
.capacity-data-bottom {

    opacity: 1;

}



/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 1100px) {

    .capacity-left {

        width: 50%;

    }


    .capacity-left h2 {

        font-size: 48px;

    }


    .capacity-visual {

        right: -120px;

        transform:
            translateY(-50%)
            scale(.9);

    }

}



@media (max-width: 991px) {

    .battery-capacity {

        min-height: auto;

    }


    .capacity-container {

        min-height: 850px;

        display: block;

        padding-top: 90px;

    }


    .capacity-left {

        width: 100%;

    }


    .capacity-left h2 {

        font-size: 50px;

    }


    .capacity-visual {

        top: 610px;

        right: 50%;

        transform:
            translate(
                50%,
                -50%
            )
            scale(.85);

    }

}



/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .capacity-container {

        width: 90%;

        min-height: 730px;

        padding-top: 70px;

    }


    .capacity-eyebrow {

        margin-bottom: 24px;

        font-size: 9px;

        letter-spacing: 2.5px;

    }


    .capacity-eyebrow span {

        width: 30px;

    }


    .capacity-left h2 {

        font-size: 37px;

        line-height: 1.06;

        letter-spacing: -1.5px;

    }


    .capacity-services {

        margin-top: 30px;

        gap: 8px;

        font-size: 9px;

    }


    .capacity-visual {

        top: 515px;

        width: 500px;

        height: 500px;

        transform:
            translate(
                50%,
                -50%
            )
            scale(.9);

    }


    .orbit-one {

        width: 230px;

        height: 230px;

    }


    .orbit-two {

        width: 350px;

        height: 350px;

    }


    .orbit-three {

        width: 460px;

        height: 460px;

    }


    .capacity-center {

        width: 230px;

        height: 230px;

    }


    .battery-icon {

        transform: scale(.8);

        margin-bottom: 9px;

    }


    .capacity-center-number {

        gap: 5px;

    }


    .capacity-center-number .counter {

        font-size: 62px;

        letter-spacing: -4px;

    }


    .center-plus {

        font-size: 43px;

    }


    .center-unit {

        font-size: 21px;

    }


    .center-caption {

        margin-top: 13px;

        font-size: 6px;

        letter-spacing: 1.5px;

    }


    .side-number .counter {

        font-size: 35px;

    }


    .side-number b {

        font-size: 14px;

    }


    .side-number strong {

        font-size: 28px;

    }


    .capacity-data-label {

        font-size: 7px;

    }


    .capacity-data-content p {

        font-size: 8px;

    }


    .capacity-data-right {

        right: -2%;

        top: 20%;

    }


    .capacity-data-bottom {

        left: -2%;

        bottom: 27%;

    }


    .capacity-data-line {

        width: 35px;

    }

}



/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 480px) {

    .capacity-container {

        min-height: 690px;

    }


    .capacity-left h2 {

        font-size: 32px;

    }


    .capacity-services {

        max-width: 320px;

        line-height: 1.8;

    }


    .capacity-visual {

        top: 495px;

        width: 430px;

        height: 430px;

        transform:
            translate(
                50%,
                -50%
            )
            scale(.9);

    }


    .orbit-one {

        width: 200px;

        height: 200px;

    }


    .orbit-two {

        width: 300px;

        height: 300px;

    }


    .orbit-three {

        width: 390px;

        height: 390px;

    }


    .capacity-center {

        width: 200px;

        height: 200px;

    }


    .capacity-center-number .counter {

        font-size: 52px;

    }


    .center-plus {

        font-size: 37px;

    }


    .center-unit {

        font-size: 18px;

    }


    .battery-icon {

        transform: scale(.65);

        margin-bottom: 3px;

    }


    .center-caption {

        font-size: 5px;

        letter-spacing: 1.2px;

    }


    .capacity-data-right {

        right: -5%;

    }


    .capacity-data-bottom {

        left: -5%;

    }


    .side-number .counter {

        font-size: 30px;

    }


    .side-number b {

        font-size: 12px;

    }


    .side-number strong {

        font-size: 24px;

    }

}


/*end*/

/* =========================================================
   SUNERGIZE ABOUT V2
========================================================= */

.sunergize-about-v2 {

    position: relative;

    overflow: hidden;

    padding: 50px 0 50px;

    background: #ffffff;

    color: #18002F;

}


/* subtle background */

.sunergize-about-v2::before {

    content: "";

    position: absolute;

    inset: 0;

    opacity: .35;

    background-image:

        linear-gradient(
            rgba(24,0,47,.035) 1px,
            transparent 1px
        ),

        linear-gradient(
            90deg,
            rgba(24,0,47,.035) 1px,
            transparent 1px
        );

    background-size: 80px 80px;

}


/* blue glow */

.sunergize-about-v2::after {

    content: "";

    position: absolute;

    width: 500px;

    height: 500px;

    right: -250px;

    top: 30%;

    border-radius: 50%;

    background:

        radial-gradient(
            circle,
            rgba(0,139,203,.08),
            transparent 70%
        );

}


/* container */

.about-v2-container {

    position: relative;

    z-index: 2;

    width: min(1280px, 90%);

    margin: auto;

}


/* =========================================================
   HEADER
========================================================= */

.about-v2-header {

    display: flex;

    justify-content: space-between;

    align-items: center;

    padding-bottom: 35px;

    border-bottom: 1px solid #E5E8EA;

}


.about-v2-label {

    display: flex;

    align-items: center;

    gap: 13px;

    font-size: 10px;

    font-weight: 800;

    letter-spacing: 3px;

}


.about-v2-label span {

    width: 42px;

    height: 2px;

    background: #F28C00;

}


.about-v2-est {

    font-size: 10px;

    color: #8B9296;

    letter-spacing: 2px;

}


.about-v2-est strong {

    color: #18002F;

}



/* =========================================================
   BLOCK
========================================================= */

.about-v2-block {

    position: relative;

    display: grid;

    grid-template-columns: 32% 68%;

    min-height: auto;

    /*border-bottom: 1px solid #E5E8EA;*/
    
    border-bottom:1px solid #e5e8ea36;

}


/*.about-v2-block:nth-child(3) {*/

/*   grid-template-columns: 68% 32%;*/

/*}*/

/*.about-v2-block.about-v2-who .about-v2-content .about-v2-line {*/
   
/*   right: 80px !important;*/
/*    left: auto;*/
 
/*}*/



/* =========================================================
   LEFT TITLE
========================================================= */

.about-v2-title {

    position: relative;

    padding:

        50px 50px 50px 0;

}


.about-v2-index {

    display: block;

    margin-bottom: 25px;

    color: #F28C00;

    font-size: 10px;

    font-weight: 800;

    letter-spacing: 2px;

}


.about-v2-title h2 {

    margin: 0;

    font-size: clamp(
        48px,
        6vw,
        60px
    );

    /*line-height: .82;*/

    /*letter-spacing: -5px;*/

    /*font-weight: 700;*/

    color: #fff;

}


/*.about-v2-title h2 span {*/

/*    color: #008BCB;*/

/*}*/



/* =========================================================
   CONTENT
========================================================= */

.about-v2-content {

    position: relative;

    padding:

        50px 0 5px 50px;

}


.about-v2-line {

    position: absolute;

    left: 0;

    top: 50px;

    bottom: 80px;

    width: 1px;

    background: #E1E6E8;

}


.about-v2-line span {

    position: absolute;

    top: 0;

    left: -2px;

    width: 5px;

    height: 70px;

    background:
        linear-gradient(
            #F28C00,
            #008BCB
        );

}


.about-v2-content-inner {

    max-width: 720px;

}


.about-v2-kicker {

    display: block;

    margin-bottom: 25px;

    /*color: #008BCB;*/

    font-size: 9px;

    font-weight: 800;

    line-height: 1.7;

    /*letter-spacing: 2px;*/

}


.about-v2-content-inner h3 {

    margin: 0;

    font-size: clamp(
        30px,
        4.2vw,
        40px
    );

    line-height: 1;

    /*letter-spacing: -2.5px;*/

    font-weight: 500;

    color: #fff;

}


.about-v2-content-inner h3 span {

    color: #008BCB;

}


.about-v2-content-inner p {

    max-width: 670px;

    margin: 27px 0 0;

    color: #fff;

    font-size: 15px;

    line-height: 1.8;

}


.about-v2-content-inner p strong {

    color: #057fbe;

}



/* =========================================================
   WHO WE ARE
========================================================= */

.about-v2-who {

    min-height: 500px;

}


.about-v2-year-row {

    display: flex;

    align-items: center;

    gap: 30px;

    margin: 35px 0 30px;

}


.about-v2-year {

    display: flex;

    flex-direction: column;

}


.about-v2-year strong {

    font-size: 34px;

    line-height: 1;

    /*color: #18002F;*/
    
    color:#fff;

}


.about-v2-year span {

    margin-top: 7px;

    color: #929A9E;

    font-size: 8px;

    font-weight: 800;

    letter-spacing: 1.5px;

}


.about-v2-arrow {

    color: #F28C00;

    font-size: 30px;

    font-weight: 300;

}


.about-v2-tags {

    display: flex;

    flex-wrap: wrap;

    gap: 10px;

    margin-top: 30px;

}


.about-v2-tags span {

    padding: 9px 14px;

    border: 1px solid #E0E5E7;

    color: #fff;

    font-size: 12px;

    font-weight: 800;

    letter-spacing: 1.5px;

    /*background: #FAFBFC;*/

}


.about-v2-tags span:hover{
    
    background: #ef7f01;
}
    
/*}*/



/* =========================================================
   VISION
========================================================= */

.about-v2-vision {

    border-bottom: 0;

}


.about-v2-vision
.about-v2-content-inner h3 {

    font-size: clamp(
        30px,
        4.5vw,
        40px
    );

}


.about-v2-vision
.about-v2-content-inner h3 span {

    /*color: #F28C00;*/

}


.about-v2-kicker i {

    font-style: normal;

    margin: 0 8px;

    color: #F28C00;

}



/* =========================================================
   REVEAL ANIMATION
========================================================= */

.about-v2-block {

    opacity: 0;

    transform:
        translateY(45px);

    transition:

        opacity .9s ease,

        transform 1s
        cubic-bezier(
            .16,
            1,
            .3,
            1
        );

}


.sunergize-about-v2.is-visible
.about-v2-block {

    opacity: 1;

    transform:
        translateY(0);

}


.sunergize-about-v2.is-visible
.about-v2-block:nth-child(2) {

    transition-delay: .05s;

}


.sunergize-about-v2.is-visible
.about-v2-block:nth-child(3) {

    transition-delay: .18s;

}


.sunergize-about-v2.is-visible
.about-v2-block:nth-child(4) {

    transition-delay: .30s;

}


/* =========================================================
   LINE ANIMATION
========================================================= */

.sunergize-about-v2.is-visible
.about-v2-line span {

    animation:
        aboutLine 1.2s
        ease forwards;

}


@keyframes aboutLine {

    from {

        height: 0;

    }

    to {

        height: 70px;

    }

}



/* =========================================================
   TABLET
========================================================= */

@media(max-width: 991px) {

    .sunergize-about-v2 {

        padding: 50px 0;

    }


    .about-v2-block {

        grid-template-columns:
            28% 72%;

    }
    
/*    .about-v2-block:nth-child(3) {*/

/*   grid-template-columns: 72% 28%;*/

/*}*/


    .about-v2-title h2 {

        font-size: 65px;

    }


    .about-v2-content {

        padding-left: 45px;

    }

}



/* =========================================================
   MOBILE
========================================================= */

@media(max-width: 767px) {

    .sunergize-about-v2 {

        padding: 50px 0 50px;

    }


    .about-v2-container {

        width: 88%;

    }


    .about-v2-header {

        padding-bottom: 25px;

    }


    .about-v2-label {

        font-size: 8px;

        letter-spacing: 2px;

    }


    .about-v2-label span {

        width: 28px;

    }


    .about-v2-est {

        font-size: 8px;

    }


    .about-v2-block {

        display: block;

        min-height: auto;

        padding: 60px 0;

    }


    .about-v2-title {

        padding: 0;

        margin-bottom: 40px;

    }


    .about-v2-index {

        margin-bottom: 18px;

    }


    .about-v2-title h2 {

        font-size: 58px;

        letter-spacing: -3px;

    }


    .about-v2-content {

        padding:

            0 0 0 28px;

    }


    .about-v2-line {

        top: 0;

        bottom: 0;

    }


    .about-v2-content-inner {

        max-width: none;

    }


    .about-v2-kicker {

        font-size: 8px;

        margin-bottom: 20px;

    }


    .about-v2-content-inner h3 {

        font-size: 37px;

        letter-spacing: -1.5px;

        line-height: 1.02;

    }


    .about-v2-content-inner p {

        font-size: 14px;

        line-height: 1.7;

    }


    .about-v2-year-row {

        gap: 20px;

        margin: 28px 0;

    }


    .about-v2-year strong {

        font-size: 27px;

    }


    .about-v2-arrow {

        font-size: 24px;

    }


    .about-v2-tags {

        gap: 7px;

    }


    .about-v2-tags span {

        padding: 8px 10px;

        font-size: 7px;

    }

}



/* =========================================================
   SMALL MOBILE
========================================================= */

@media(max-width: 480px) {

    .about-v2-title h2 {

        font-size: 50px;

    }


    .about-v2-content-inner h3 {

        font-size: 32px;

    }


    .about-v2-content-inner p {

        font-size: 13px;

    }

}
