@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300..700&display=swap');
:root {
            --primary:#ff8a00;
--secondary:#081018;
--white:#fff;
--gray:#cfcfcf;
            
     
            --font1:"Space Grotesk", sans-serif;
            --font2:"Space Grotesk", sans-serif;  
            --header-height:155px;
        }

body{
margin:0;
font-family: var(--font1); 
            color: rgb(38, 44, 44);
            font-size: 16px;
            text-align: left;

}

   @media(max-width:993px)
        {
          body{text-align: center;}
        }
a{text-decoration: none;}
        img { display: block;  max-width: 100%;}
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font2); 
  font-weight:500;
 
  margin: 0;
}
ul { margin: 0; padding: 0; list-style: none; }
.container { width: 80%; max-width: 100%; }
@media (max-width: 1401px) {
   .container {
        width: 80%;
    }
}
@media (max-width: 1204px) {
   .container {
        width: 95%;
    }
}

figcaption, figure{margin: 0; padding: 0;}

.cr-only{
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}


/***************************
HEADER
****************************/

.sc-header{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 999;
    padding: 20px 0;
    transition: .4s;
    padding: 10px 10px;
}

.sc-header.scrolled{
    position: fixed;
    background: #071018;
    padding: 12px 0;
    box-shadow: 0 10px 25px rgba(0,0,0,.25);
}

.sc-header .navbar-brand{
    display: flex;
    align-items: center;
    gap: 15px;
}

.sc-header .logo{
    /* max-height: 70px; */
}

.sc-header.scrolled .logo{
     max-height: 50px; 
}
.sc-header.scrolled .call-box{display: none;}

/*==========================
Navbar
==========================*/

.navbar-expand-lg .offcanvas-lg{
    flex-grow:1;
}

.offcanvas-body{
    justify-content:center;
}

.sc-header .navbar-nav{
    gap:20px;
}

.sc-header .nav-link{
    color:#fff !important;
    font-weight:600;
    font-size:15px;
    position:relative;
    transition:.35s;
}

.sc-header .nav-link:hover,
.sc-header .nav-link.active{
    color:var(--primary) !important;
}


/*==========================
Creative Hamburger
==========================*/

.sc-toggler{
    border:0;
    padding:0;
    width:55px;
    height:55px;
    background:none;
    box-shadow:none !important;
}

.sc-toggler span{
    display:block;
    width:30px;
    height:2px;
    margin:7px auto;
    background:#fff;
    border-radius:20px;
    transform-origin:center;
    transition:transform .4s ease, width .4s ease;
}

.sc-toggler:hover span:nth-child(1){
    width:18px;
    transform:translateX(-6px);
}

.sc-toggler:hover span:nth-child(3){
    width:18px;
    transform:translateX(6px);
}





/*==========================
Desktop
==========================*/

@media(min-width:992px){

    .navbar-toggler{
        display:none;
    }

     .offcanvas{
        position:static;
        transform:none !important;
        visibility:visible !important;
        background:transparent;
        border:0;
        height:auto !important;
        width:auto;
        flex-grow:1;
    }

    .offcanvas-header{
        display:none;
    }

    .offcanvas-body{
        display:flex;
        justify-content:center;
        padding:0;
    }

}


/*==========================
Mobile
==========================*/

@media(max-width:991.98px){

    .call-box{
        display:none;
    }

    .offcanvas-top{
        height:100vh !important;
        background:#061c39;
        color:#fff;
        border:0;
    }

    .offcanvas-header{
        padding:20px;
        border-bottom:1px solid rgba(255,255,255,.08);
    }

    .offcanvas-body{
        display:flex;
        align-items:center;
        justify-content:center;
    }

    .offcanvas-body .navbar-nav{
        width:100%;
        gap:18px;
        text-align:center;
    }

    .offcanvas-body .nav-link{
        color:#fff !important;
        font-size:30px;
        font-weight:700;
        letter-spacing:2px;
        padding:10px 0;
    }

    .offcanvas-body .nav-link:hover,
    .offcanvas-body .nav-link.active{
        color:var(--primary) !important;
    }

}


.menu-close{
    width:50px;
    height:50px;
    border:1px solid rgba(255,255,255,.2);
    border-radius:50%;
    background:transparent;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:.35s;
    margin-left:auto;
}

.menu-close:hover{
    background:var(--primary);
    border-color:var(--primary);
    transform:rotate(180deg) scale(1.08);
}

.menu-close i{
    font-size:18px;
}


.sc-header .call-box{
    display: flex;
    align-items: center;
    gap: 15px;
    color: #fff;
}

.sc-header .call-icon{
    width: 58px;
    height: 58px;
    border: 2px solid var(--primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--primary);
    font-size: 22px;
}

.sc-header .call-box h6{
    margin: 0;
    font-size: 13px;
    color: #ddd;
}

.sc-header .call-box h4{
    margin: 0;
    font-size: 28px;
    font-weight: 700;
}

.phone-link{
    color:#fff;
    text-decoration:none;
    transition:.3s;
}

.phone-link:hover{
    color:var(--primary);
}


/***************************
SLIDER
****************************/

/* ===========================
BANNER
=========================== */

.sc-banner{
    height:100vh;
}

.sc-banner .carousel-item{
    height:100vh;
    position:relative;
}
.sc-banner .carousel-item figure{width: 100%; height: 100%;}
.sc-banner .carousel-item img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.sc-banner .overlay{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:linear-gradient(to right,
        rgba(5,10,20,.85),
        rgba(5,10,20,.55),
        rgba(5,10,20,.25));
}

.sc-banner .hero-content{
    position:absolute;
    top:52%;
    left:0;
    width:100%;
    transform:translateY(-50%);
    z-index:5;
}

.sc-banner .hero-small{
    color:var(--primary);
    font-size:22px;
    font-weight:700;
    margin-bottom:20px;
}

.sc-banner .hero-title{
    font-size:92px;
    font-weight:800;
    line-height:0.95;
    color:#fff;
    margin-bottom:25px;
}

.sc-banner .hero-title span{
    display:block;
    color:var(--primary);
}

.sc-banner .hero-text{
    font-size:22px;
    color:#ddd;
    max-width:650px;
    margin-bottom:35px;
}

.sc-banner .btn-orange{
    background:var(--primary);
    color:#fff;
    padding:18px 40px;
    font-weight:700;
    border-radius:8px;
    transition:.3s;
}

.sc-banner .btn-orange:hover{
    background:#ff9900;
    color:#fff;
    transform:translateY(-3px);
}

.sc-banner .btn-outline-light{
    padding:18px 40px;
    border-radius:8px;
    font-weight:700;
}

.sc-banner .carousel-control-prev,
.sc-banner .carousel-control-next{
    width:65px;
    height:65px;
    background:#fff;
    border-radius:50%;
    top:50%;
    opacity:1;
    transform:translateY(-50%);
}

.sc-banner .carousel-control-prev{
    left:35px;
}

.sc-banner .carousel-control-next{
    right:35px;
}

.sc-banner .carousel-control-prev-icon,
.sc-banner .carousel-control-next-icon{
    filter:invert(1);
}

.sc-banner .carousel-indicators{
    bottom:110px;
}

.sc-banner .carousel-indicators [data-bs-target]{
    /* width:12px !important;
    height:12px !important;
    border-radius:50%;
    background:var(--primary) !important; */
}
.carousel-indicators [data-bs-target] {

  width: 20px;
  height: 20px;
border-radius:50%;
background-color:var(--primary) !important;
    }

@media(max-width:992px){

    .sc-banner .hero-title{
        font-size:58px;
    }

    .sc-banner .hero-text{
        font-size:18px;
    }

}

@media(max-width:768px){

    .sc-banner{
        height:700px;
    }

    .sc-banner .carousel-item{
        height:700px;
    }

    .sc-banner .hero-title{
        font-size:42px;
    }

    .sc-banner .hero-small{
        font-size:18px;
    }

    .sc-banner .hero-text{
        font-size:16px;
    }

}



/* -----------------------------
   SECTION
------------------------------*/

.who-we-are{
    position:relative;
    overflow:hidden;
    padding:120px 0;
    /* min-height:1200px; */
}

/* -----------------------------
   MOVING LINE ARTS
------------------------------*/

.line-art{
    position:absolute;
    width:260px;
    height:260px;
    
    opacity:.3;
    pointer-events:none;
    z-index:0;
    will-change:transform;
}

.line-art svg{
    width:100%;
    height:100%;
}

.line-art svg line{
    stroke:#000;
    stroke-width:2;
}

/* Top Left */

.line-art-left{
    top:180px;
    left:200px;
}

/* Top Right */

.line-art-right{
    top:180px;
    right:170px;
}

/* -----------------------------
   FIXED HELMET
------------------------------*/

.bg-helmet{
    position:absolute;
    right:-60px;
    bottom:-30px;
    font-size:280px;
    color:#ececec;
    opacity:.8;
    z-index:0;
}

/* -----------------------------
   CONTENT
------------------------------*/

.container{
    position:relative;
    z-index:5;
}

.subtitle{
    color:#ff6a00;
    font-size:14px;
    font-weight:700;
    letter-spacing:2px;
    text-transform:uppercase;
    display:flex;
    align-items:center;
    gap:15px;
}

.subtitle::before{
    content:"";
    width:50px;
    height:2px;
    background:#ff6a00;
}

.main-title{
    font-size:72px;
    font-weight:900;
    line-height:1.05;
    margin:25px 0 45px;
}
.line-mask{
    display:block;
    overflow:hidden;
}

.line-inner{
    display:block;
    transform:translateY(110%);
    opacity:0;
    transition:
        transform .9s cubic-bezier(.22,.61,.36,1),
        opacity .9s ease;
}

.line-inner.active{
    transform:translateY(0);
    opacity:1;
}

.small-image{
    width:100%;
    /* height:320px; */
    object-fit:cover;
    border-radius:30px;
}

.big-image{
    width:100%;
    /* height:520px; */
    object-fit:cover;
    border-radius:30px;
    margin-top:30px;
}

.learn-btn{
    position:relative;
    overflow:hidden;

    width:190px;
    height:60px;
    margin-top:20px;

    display:flex;
    align-items:center;
    justify-content:space-between;

    padding:0 8px 0 30px;

    border-radius:60px;

    background:#ff6a00;
    color:#fff;
    text-decoration:none;
    font-weight:600;

    transition:.45s ease;
    z-index:1;
}

.learn-btn::before{
    content:"";
    position:absolute;
    inset:0;
    background:#000;
    transform:scaleX(0);
    transform-origin:left;
    transition:.45s cubic-bezier(.77,0,.18,1);
    z-index:-1;
}

.learn-btn span{
    width:46px;
    height:46px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;

    background:#111;

    transition:.45s ease;
}

.learn-btn span i{
    transition:.45s ease;
}

.learn-btn:hover{

    color:#fff;

    transform:translateY(-6px);

    box-shadow:0 18px 35px rgba(0,0,0,.18);

}

.learn-btn:hover::before{

    transform:scaleX(1);

}

.learn-btn:hover span{

    background:#fff;
    transform:rotate(45deg) scale(1.08);

}

.learn-btn:hover span i{

    color:#ff6a00;

}

.card-dark{
    background:linear-gradient(135deg,#000,#222);
    color:#fff;
    border-radius:30px;
    padding:35px;
    min-height:220px;
}

.card-dark .card-stats{
    font-size:60px;
    font-weight:900;
}

.orange{
    color:#ff6a00;
}

/* -----------------------------
   MOBILE
------------------------------*/


.img-reveal{
    overflow:hidden;
    border-radius:30px;
}

.img-reveal img{
    width:100%;
    display:block;

    clip-path: inset(0 100% 0 0);

    transition:clip-path 1.4s cubic-bezier(.77,0,.18,1);
}

.who-we-are.active .img-reveal img{
    clip-path: inset(0 0 0 0);
}
.wave-text span{
    display:inline-block;
    overflow:hidden;
}

.wave-text span i{
    display:inline-block;
    font-style:normal;
    transform:translateY(120%);
    opacity:0;
    transition:.8s cubic-bezier(.22,.61,.36,1);
}

.wave-text.active span i{
    transform:translateY(0);
    opacity:1;
}



/* ==================================
   SRI CHAKRA SERVICES SECTION
================================== */

/* ===============================
   SRI CHAKRA SERVICES SECTION
================================= */

.sce-services-section{
    background:
        radial-gradient(circle at top left,#032a58 0%,transparent 40%),
        radial-gradient(circle at bottom right,#02162e 0%,transparent 35%),
        #020b1f;
}

.sce-electric-grid{
    position:absolute;
    inset:0;
    background:
        linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),
        linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);
    background-size:50px 50px;
    opacity:.2;
}

/* Heading */

.sce-services-small-title{
    color:#f7941d;
    font-size:14px;
    font-weight:700;
    letter-spacing:2px;
    display:inline-block;
    position:relative;
    padding:0 70px;
}

.sce-services-small-title::before,
.sce-services-small-title::after{
    content:'';
    width:50px;
    height:2px;
    background:#f7941d;
    position:absolute;
    top:50%;
}

.sce-services-small-title::before{
    left:0;
}

.sce-services-small-title::after{
    right:0;
}

.sce-services-main-title{
    color:#fff;
    font-size:48px;
    font-weight:800;
    margin-top:20px;
}

.sce-services-main-title span{
    color:#f7941d;
}

/* Card */

.sce-service-card{
    position:relative;
    background:rgba(255,255,255,.03);
    border:1px solid rgba(255,255,255,.08);
    border-radius:28px;
    padding:35px 20px;
    text-align:center;
    overflow:hidden;
    backdrop-filter:blur(12px);
    transition:.4s;
    height:100%;
}

.sce-service-card:hover{
    transform:translateY(-12px);
    border-color:#f7941d;
    box-shadow:0 20px 40px rgba(247,148,29,.2);
}

.sce-service-card::before{
    content:'';
    position:absolute;
    top:0;
    left:-120%;
    width:100%;
    height:100%;
    background:linear-gradient(
        90deg,
        transparent,
        rgba(255,255,255,.08),
        transparent
    );
    transition:1s;
}

.sce-service-card:hover::before{
    left:120%;
}

.sce-service-top-border{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:4px;
    background:linear-gradient(to right,#f7941d,#ffce75);
}

/* Hexagon */

.sce-service-hexagon{
    width:90px;
    height:90px;
    margin:auto;
    margin-bottom:25px;
    background:rgba(247,148,29,.08);
    border:1px solid rgba(247,148,29,.3);

    clip-path:polygon(
        25% 6.7%,
        75% 6.7%,
        100% 50%,
        75% 93.3%,
        25% 93.3%,
        0% 50%
    );

    display:flex;
    align-items:center;
    justify-content:center;

    color:#f7941d;
    font-size:42px;

    transition:.4s;
}

.sce-service-card:hover .sce-service-hexagon{
    background:#f7941d;
    color:#fff;
    transform:rotate(10deg) scale(1.1);
}

.sce-service-card h5{
    color:#fff;
    font-size:18px;
    font-weight:600;
    line-height:1.6;
    min-height:55px;
}

.sce-service-arrow{
    width:40px;
    height:40px;
    border-radius:50%;
    border:1px solid rgba(247,148,29,.3);
    display:flex;
    align-items:center;
    justify-content:center;
    color:#f7941d;
    margin:20px auto 0;
    transition:.3s;
}

.sce-service-card:hover .sce-service-arrow{
    background:#f7941d;
    color:#fff;
    transform:rotate(45deg);
}

/* Button */

.sce-services-view-btn{
    display:inline-flex;
    align-items:center;
    background:#f7941d;
    color:#fff;
    padding:15px 40px;
    border-radius:50px;
    text-decoration:none;
    font-weight:700;
    transition:.3s;
}

.sce-services-view-btn:hover{
    background:#ffab2f;
    color:#fff;
    transform:translateY(-3px);
}

/* Mobile */

@media(max-width:991px){

    .sce-services-main-title{
        font-size:32px;
    }

    .sce-service-card{
        padding:25px 15px;
    }

    .sce-service-hexagon{
        width:70px;
        height:70px;
        font-size:30px;
    }

    .sce-service-card h5{
        font-size:15px;
    }

}

/* ==============================
   EV HUB SECTION
============================== */

.sce-ev-hub-section{
    background:#fff;
    position:relative;
}

.sce-ev-grid{
    position:absolute;
    inset:0;
    background:
        linear-gradient(rgba(0,91,170,.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(0,91,170,.03) 1px, transparent 1px);
    background-size:40px 40px;
}

.sce-ev-glow{
    position:absolute;
    border-radius:50%;
    filter:blur(80px);
}

.sce-ev-glow-1{
    width:300px;
    height:300px;
    background:rgba(0,91,170,.15);
    top:-100px;
    left:-100px;
}

.sce-ev-glow-2{
    width:250px;
    height:250px;
    background:rgba(247,148,29,.15);
    bottom:-100px;
    right:-100px;
}

/* Heading */

.sce-ev-tag{
    color:#f7941d;
    font-weight:700;
    letter-spacing:2px;
    margin-bottom:15px;
}

.sce-ev-heading{
    font-size:56px;
    font-weight:900;
}

.sce-ev-heading span{
    color:#005baa;
}

.sce-ev-subheading{
    max-width:700px;
    margin:auto;
    color:#666;
}

/* Hub */

.sce-ev-hub-wrapper{
    position:relative;
    height:750px;
}

.sce-ev-center{
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
}

/* Future Badge */

.sce-future-badge{
    position:absolute;
    top:-70px;
    left:50%;
    transform:translateX(-50%);
    padding:10px 20px;
    background:rgba(255,255,255,.7);
    backdrop-filter:blur(20px);
    border-radius:50px;
    font-size:13px;
    font-weight:700;
    color:#005baa;
    box-shadow:0 5px 20px rgba(0,0,0,.08);
}

/* Ring */

.sce-ev-ring{
    position:absolute;
    width:260px;
    height:260px;
    border:2px dashed rgba(0,91,170,.15);
    border-radius:50%;
    top:-40px;
    left:-40px;
    animation:rotateRing 25s linear infinite;
}

@keyframes rotateRing{
    from{
        transform:rotate(0deg);
    }
    to{
        transform:rotate(360deg);
    }
}

/* Pulse */

.sce-ev-pulse{
    position:absolute;
    width:180px;
    height:180px;
    border:2px solid rgba(0,91,170,.15);
    border-radius:50%;
    animation:pulse 3s infinite;
}

.sce-ev-pulse.delay{
    animation-delay:1.5s;
}

@keyframes pulse{
    0%{
        transform:scale(1);
        opacity:1;
    }
    100%{
        transform:scale(1.8);
        opacity:0;
    }
}

/* Center Circle */

.sce-ev-circle{
    width:180px;
    height:180px;
    border-radius:50%;
    background:linear-gradient(135deg,#005baa,#1d7cff);
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    font-size:70px;
    box-shadow:0 20px 60px rgba(0,91,170,.3);
    position:relative;
    z-index:5;
}

.sce-ev-counter{
    text-align:center;
    margin-top:25px;
}

.sce-ev-counter-stats{
    font-size:60px;
    font-weight:900;
    color:#005baa;
}

.sce-ev-counter span{
    color:#f7941d;
}

/* Cards */

.sce-ev-card{
    position:absolute;
    width:250px;
    background:#fff;
    border-radius:25px;
    padding:30px;
    text-align:center;
    box-shadow:0 20px 50px rgba(0,0,0,.08);
    animation:floatCard 5s ease-in-out infinite;
}

@keyframes floatCard{
    0%,100%{
        transform:translateY(0);
    }
    50%{
        transform:translateY(-10px);
    }
}

.sce-card-icon{
    width:80px;
    height:80px;
    margin:auto auto 20px;
    border-radius:20px;
    background:#f5f9ff;
    color:#005baa;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:34px;
}

.sce-card-tl{top:60px;left:100px;}
.sce-card-tr{top:60px;right:100px;}
.sce-card-bl{bottom:60px;left:100px;}
.sce-card-br{bottom:60px;right:100px;}

/* Connection Lines */

.sce-ev-line{
    position:absolute;
    height:2px;
    background:#dce7f3;

}


.sce-line-tl{
    width:230px;
    top:220px;
    left:340px;
    transform:rotate(35deg);
}

.sce-line-tr{
    width:230px;
    top:220px;
    right:340px;
    transform:rotate(-35deg);
}

.sce-line-bl{
    width:230px;
    bottom:220px;
    left:340px;
    transform:rotate(-35deg);
}

.sce-line-br{
    width:230px;
    bottom:220px;
    right:340px;
    transform:rotate(35deg);
}

/* Moving Energy Dot */

.sce-energy-dot{
    position:absolute;
    width:12px;
    height:12px;
    background:#f7941d;
    border-radius:50%;
    box-shadow:0 0 20px #f7941d;
    animation:energyMove 3s linear infinite;
}

@keyframes energyMove{
    0%{
        left:0;
    }
    100%{
        left:100%;
    }
}

@media(max-width:991px){

    .sce-ev-hub-wrapper{
        height:auto;
        display:flex;
        flex-direction:column;
        gap:30px;
    }

    .sce-ev-center,
    .sce-ev-card{
        position:relative;
        top:auto;
        left:auto;
        right:auto;
        bottom:auto;
        transform:none;
        margin:auto;
    }

    .sce-ev-line{
        display:none;
    }

    .sce-ev-heading{
        font-size:36px;
    }
}



/* ===========================================
   OUR PROJECTS SECTION
=========================================== */

.sce-project-section{
    position:relative;
    padding:120px 0;
    overflow:hidden;

    background:linear-gradient(
        180deg,
        #081426 0%,
        #0b1b31 50%,
        #081426 100%
    );
}

/* Premium Background Glow */

.sce-project-section::before{
    content:'';
    position:absolute;
    inset:0;

    background:
        radial-gradient(
            circle at 15% 20%,
            rgba(247,148,29,.08),
            transparent 25%
        ),

        radial-gradient(
            circle at 85% 80%,
            rgba(0,91,170,.10),
            transparent 30%
        ),

        radial-gradient(
            circle at center,
            rgba(255,255,255,.02),
            transparent 60%
        );

    pointer-events:none;
}

.sce-project-section::after{
    content:'';
    position:absolute;
    width:600px;
    height:600px;

    background:
        radial-gradient(
            rgba(247,148,29,.10),
            transparent 70%
        );

    right:-250px;
    top:-150px;

    filter:blur(100px);
    pointer-events:none;
}

/* ===========================================
   SECTION TITLE
=========================================== */

.sce-project-small-title{
    color:#f7941d;
    font-size:14px;
    font-weight:700;
    letter-spacing:4px;
    text-transform:uppercase;
    margin-bottom:20px;
}

.sce-project-main-title{
    font-size:64px;
    font-weight:900;
    line-height:1.1;
    color:#ffffff;
    margin-bottom:20px;
}

.sce-project-main-title span{
    color:#f7941d;
}

.sce-project-description{
    max-width:750px;
    margin:auto;
    color:rgba(255,255,255,.75);
    font-size:18px;
    line-height:1.9;
}

/* ===========================================
   PROJECT CARDS
=========================================== */

.sce-feature-project,
.sce-project-card{
    position:relative;
    overflow:hidden;
    border-radius:32px;
    height:100%;

    border:1px solid rgba(255,255,255,.08);

    transition:
        transform .4s ease,
        box-shadow .4s ease,
        border-color .4s ease;
}

.sce-feature-project{
    min-height:650px;
}

.sce-project-card{
    height:310px;
}

/* ===========================================
   IMAGE
=========================================== */

.sce-feature-project img,
.sce-project-card img{
    width:100%;
    height:100%;
    object-fit:cover;

    transition:
        transform .9s ease,
        filter .9s ease;
}

/* ===========================================
   OVERLAY
=========================================== */

.sce-project-overlay{
    position:absolute;
    inset:0;

    background:
        linear-gradient(
            to top,
            rgba(0,0,0,.92),
            rgba(0,0,0,.60),
            rgba(0,0,0,.15)
        );
}

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

.sce-feature-content,
.sce-project-card-content{
    position:absolute;
    left:30px;
    right:30px;
    bottom:30px;
    color:#fff;
    z-index:5;
}

/* ===========================================
   FEATURE BADGE
=========================================== */

.sce-feature-badge{
    display:inline-flex;
    align-items:center;
    gap:8px;

    padding:10px 18px;

    background:#f7941d;
    color:#fff;

    border-radius:50px;

    font-size:14px;
    font-weight:600;

    margin-bottom:20px;
}

/* ===========================================
   CATEGORY
=========================================== */

.sce-project-category{
    color:#f7941d;
    font-size:13px;
    font-weight:700;
    letter-spacing:2px;
    margin-bottom:12px;
}

/* ===========================================
   TITLES
=========================================== */

.sce-feature-content h3{
    font-size:46px;
    font-weight:800;
    line-height:1.2;
    margin-bottom:15px;
}

.sce-project-card h4{
    font-size:26px;
    font-weight:700;
    line-height:1.4;
    margin-bottom:10px;
}

/* ===========================================
   LOCATION
=========================================== */

.sce-project-location{
    display:flex;
    align-items:center;
    gap:8px;
    margin-top:12px;
    color:rgba(255,255,255,.75);
    font-size:15px;
}

/* ===========================================
   ICON BACKGROUND
=========================================== */

.sce-project-icon{
    width:65px;
    height:65px;

    border-radius:18px;

    background:linear-gradient(
        135deg,
        #f7941d,
        #ffb347
    );

    color:#fff;

    display:flex;
    align-items:center;
    justify-content:center;

    font-size:28px;
    margin-bottom:20px;

    transition:.35s ease;
}

/* ===========================================
   FEATURE BUTTON
=========================================== */

.sce-project-btn{
    display:inline-flex;
    align-items:center;
    gap:10px;

    padding:14px 30px;

    border:2px solid #f7941d;
    border-radius:12px;

    color:#fff;
    text-decoration:none;

    margin-top:25px;

    transition:.35s ease;
}

.sce-project-btn i{
    transition:.35s ease;
}

.sce-project-btn:hover{
    background:#f7941d;
    color:#081426;

    transform:translateY(-3px);

    /* box-shadow:
        0 12px 30px rgba(247,148,29,.35); */
}

.sce-project-btn:hover i{
    transform:translateX(5px);
}

/* ===========================================
   VIEW ALL BUTTON
=========================================== */

.sce-view-project-btn{
    display:inline-flex;
    align-items:center;
    gap:12px;

    padding:16px 38px;

    border:2px solid #f7941d;
    border-radius:12px;

    color:#fff;
    text-decoration:none;
    font-weight:600;

    transition:.35s ease;
}

.sce-view-project-btn i{
    transition:.35s ease;
}

.sce-view-project-btn:hover{
    background:#f7941d;
    color:#081426;

    transform:translateY(-3px);

    /* box-shadow:
        0 15px 35px rgba(247,148,29,.35); */
}

.sce-view-project-btn:hover i{
    transform:translateX(6px);
}



.sce-project-btn,
.sce-view-project-btn{
    position:relative;
    overflow:hidden;
    z-index:1;
    transition:.4s ease;
}

.sce-project-btn::before,
.sce-view-project-btn::before{
    content:'';
    position:absolute;
    top:0;
    left:-100%;
    width:100%;
    height:100%;
    background:#f7941d;
    transition:.4s ease;
    z-index:-1;
}

.sce-project-btn:hover::before,
.sce-view-project-btn:hover::before{
    left:0;
}

.sce-project-btn:hover,
.sce-view-project-btn:hover{
    color:#081426;
    border-color:#f7941d;
}

.sce-project-btn i,
.sce-view-project-btn i{
    transition:.4s ease;
}

.sce-project-btn:hover i,
.sce-view-project-btn:hover i{
    transform:translateX(6px);
}

/* ===========================================
   HOVER EFFECTS
=========================================== */

.sce-feature-project:hover,
.sce-project-card:hover{
    transform:translateY(-8px);

    border-color:rgba(247,148,29,.30);

    box-shadow:
        0 20px 45px rgba(0,0,0,.35);
}

.sce-feature-project:hover img,
.sce-project-card:hover img{
    transform:scale(1.05);
}

.sce-project-card:hover .sce-project-icon{
    transform:translateY(-4px);

    box-shadow:
        0 10px 25px rgba(247,148,29,.35);
}

/* ===========================================
   RESPONSIVE
=========================================== */

@media(max-width:991px){

    .sce-project-main-title{
        font-size:42px;
    }

    .sce-feature-project{
        min-height:450px;
    }

    .sce-project-card{
        height:280px;
    }

    .sce-feature-content h3{
        font-size:30px;
    }

    .sce-project-card h4{
        font-size:22px;
    }

    .sce-project-description{
        font-size:16px;
    }
}


/*=========================================
VIDEOS SECTION
=========================================*/

.sce-video-section{
    position:relative;
    padding:120px 0;
    overflow:hidden;
    background:linear-gradient(
        180deg,
        #081426 0%,
        #0b1b31 50%,
        #081426 100%
    );
}

/* Background Glow */

.sce-video-section::before{
    content:'';
    position:absolute;
    inset:0;
    background:
        radial-gradient(circle at 15% 20%, rgba(247,148,29,.08), transparent 25%),
        radial-gradient(circle at 85% 80%, rgba(0,91,170,.10), transparent 30%),
        radial-gradient(circle at center, rgba(255,255,255,.02), transparent 60%);
    pointer-events:none;
}

.sce-video-section::after{
    content:'';
    position:absolute;
    width:600px;
    height:600px;
    right:-250px;
    top:-150px;
    background:radial-gradient(rgba(247,148,29,.10), transparent 70%);
    filter:blur(100px);
    pointer-events:none;
}

/*=========================================
SECTION TITLE
=========================================*/

.sce-project-small-title{
    color:#f7941d;
    font-size:14px;
    font-weight:700;
    letter-spacing:4px;
    text-transform:uppercase;
    margin-bottom:18px;
}

.sce-project-main-title{
    font-size:60px;
    font-weight:900;
    color:#fff;
    line-height:1.1;
    margin-bottom:20px;
}

.sce-project-main-title span{
    color:#f7941d;
}

.sce-project-description{
    max-width:760px;
    margin:auto;
    color:rgba(255,255,255,.75);
    font-size:18px;
    line-height:1.8;
}

/*=========================================
VIDEO CARD
=========================================*/

.sce-video-card{
    position:relative;
    overflow:hidden;
    border-radius:24px;
    background:#000;
    border:1px solid rgba(255,255,255,.08);

    transition:
        transform .4s ease,
        box-shadow .4s ease,
        border-color .4s ease;
}

/* Responsive YouTube */

.sce-video-card iframe{
    display:block;
    width:100%;
    aspect-ratio:16/9;
    border:0;
}

/* Hover */

.sce-video-card:hover{

    transform:translateY(-8px);

    border-color:rgba(247,148,29,.35);

    box-shadow:
        0 20px 45px rgba(0,0,0,.35);

}

/*=========================================
RESPONSIVE
=========================================*/

@media(max-width:1199px){

    .sce-project-main-title{
        font-size:52px;
    }

}

@media(max-width:991px){

    .sce-video-section{
        padding:90px 0;
    }

    .sce-project-main-title{
        font-size:42px;
    }

    .sce-project-description{
        font-size:16px;
    }

}

@media(max-width:767px){

    .sce-video-section{
        padding:70px 0;
    }

    .sce-project-main-title{
        font-size:34px;
    }

    .sce-project-small-title{
        letter-spacing:3px;
    }

}

/* ===================================================
   CLIENTS SECTION
=================================================== */

.sce-clients-section{
    background:#fff;
    padding:100px 0 70px;
    position:relative;
    overflow:hidden;
}

/* Background Glow */

.sce-clients-section::before{
    content:'';
    position:absolute;
    width:350px;
    height:350px;
    background:rgba(247,148,29,.05);
    border-radius:50%;
    top:-150px;
    left:-150px;
    filter:blur(100px);
}

.sce-clients-section::after{
    content:'';
    position:absolute;
    width:300px;
    height:300px;
    background:rgba(0,91,170,.05);
    border-radius:50%;
    bottom:-100px;
    right:-100px;
    filter:blur(100px);
}

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

.sce-client-small-title{
    color:#f7941d;
    font-size:14px;
    font-weight:700;
    letter-spacing:4px;
    text-transform:uppercase;
    margin-bottom:18px;
}

.sce-client-main-title{
    font-size:60px;
    font-weight:900;
    color:#081426;
    margin-bottom:20px;
}

.sce-client-main-title span{
    color:#f7941d;
}

.sce-client-description{
    max-width:750px;
    margin:auto;
    color:#666;
    font-size:18px;
    line-height:1.8;
}

/* ===================================================
   CAROUSEL
=================================================== */

.sce-client-carousel{
    position:relative;
    margin-top:55px;
}

.sce-client-carousel .owl-stage-outer{
    padding:10px 0 0 !important;
}

.sce-client-carousel .owl-stage{
    display:flex;
    align-items:center;
}

.sce-client-carousel .owl-item{
    display:flex;
    align-items:center;
    justify-content:center;
}

/* ===================================================
   CLIENT CARD
=================================================== */

.sce-client-card{
    background:#fff;
    border-radius:18px;
    height:120px;
    /* padding:20px; */

    display:flex;
    align-items:center;
    justify-content:center;

    border:1px solid #f1f1f1;

    transition:all .35s ease;

    width:100%;
    position:relative;
    overflow:hidden;
}

/* Top Orange Border Animation */

.sce-client-card::before{
    content:'';
    position:absolute;
    top:0;
    left:50%;
    transform:translateX(-50%);
    width:0;
    height:3px;
    background:#f7941d;
    transition:.35s ease;
}

.sce-client-card:hover::before{
    width:100%;
}

/* ===================================================
   LOGOS
=================================================== */

.sce-client-card img{
    /* max-width:150px;
    max-height:65px; */
    width:auto;
    height:auto;
    object-fit:contain;

    /* filter:grayscale(100%); */
    /* opacity:.65; */

    transition:all .35s ease;
}

.sce-client-card:hover img{
    filter:none;
    opacity:1;
    transform:scale(1.05);
}

/* ===================================================
   HOVER EFFECT
=================================================== */

.sce-client-card:hover{
    transform:translateY(-4px);
    border-color:#f7941d;
    box-shadow:0 10px 25px rgba(0,0,0,.08);
}
.sce-client-card{
    margin:0 2px;
}

/* ===================================================
   NAVIGATION
=================================================== */

.sce-client-carousel .owl-nav{
    margin-top:18px !important;
    display:flex;
    justify-content:center;
    align-items:center;
    gap:15px;
}

.sce-client-carousel .owl-nav button{
    width:48px !important;
    height:48px !important;

    border-radius:50% !important;

    background:#fff !important;
    border:2px solid #f7941d !important;

    color:#f7941d !important;
    font-size:18px !important;

    display:flex !important;
    align-items:center;
    justify-content:center;

    transition:all .35s ease;
}

.sce-client-carousel .owl-nav button:hover{
    background:#f7941d !important;
    color:#fff !important;
    transform:translateY(-2px);
    box-shadow:0 8px 20px rgba(247,148,29,.30);
}

.sce-client-carousel .owl-nav button span{
    display:none;
}

.sce-client-carousel .owl-nav .disabled{
    opacity:.5;
}

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

.sce-client-carousel .owl-dots{
    margin-top:15px;
}

.sce-client-carousel .owl-dot span{
    width:10px;
    height:10px;
    background:#ddd !important;
    transition:.3s ease;
}

.sce-client-carousel .owl-dot.active span{
    width:28px;
    border-radius:20px;
    background:#f7941d !important;
}

/* ===================================================
   RESPONSIVE
=================================================== */

@media(max-width:991px){

    .sce-client-main-title{
        font-size:42px;
    }

    .sce-client-description{
        font-size:16px;
    }

    .sce-client-card{
        height:110px;
        padding:15px;
    }

    .sce-client-card img{
        max-width:120px;
        max-height:55px;
    }
}

@media(max-width:576px){

    .sce-client-main-title{
        font-size:34px;
    }

    .sce-client-card{
        height:100px;
    }

    .sce-client-carousel .owl-nav button{
        width:42px !important;
        height:42px !important;
    }
}



.sce-contact-strip{
    padding:60px 0;
    background:#fff;
}

.sce-contact-card1{
    position:relative;
    overflow:hidden;

    padding:80px 70px;

    border-radius:35px;

    background:
        linear-gradient(
            rgba(8,20,38,.82),
            rgba(8,20,38,.82)
        ),
        url('../images/sri-chakra-electricals-bg.jpg');

    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;

    box-shadow:
        0 30px 80px rgba(0,0,0,.18);
}

/* Orange Glow */

.sce-contact-card1::before{
    content:'';
    position:absolute;
    width:400px;
    height:400px;

    border-radius:50%;

    background:
        radial-gradient(
            rgba(247,148,29,.22),
            transparent 70%
        );

    top:-150px;
    right:-150px;

    filter:blur(100px);
}

.sce-contact-tag{
    color:#f7941d;
    letter-spacing:4px;
    font-weight:700;
    font-size:14px;
}

.sce-contact-card1 h2{
    color:#fff;
    font-size:48px;
    font-weight:900;
    margin:20px 0;
}

.sce-contact-card1 p{
    color:rgba(255,255,255,.80);
    font-size:18px;
    line-height:1.9;
    max-width:650px;
}

/* Phone Box */

.sce-phone-box{
    background:#fff;
    border-radius:24px;

    padding:25px 30px;

    display:flex;
    align-items:center;
    gap:20px;

    text-decoration:none;

    transition:.35s ease;
}

.sce-phone-box:hover{
    transform:translateY(-6px);

    box-shadow:
        0 20px 40px rgba(0,0,0,.20);
}

.sce-phone-icon{
    width:75px;
    height:75px;

    border-radius:20px;

    background:
        linear-gradient(
            135deg,
            #f7941d,
            #ffb347
        );

    color:#fff;

    display:flex;
    align-items:center;
    justify-content:center;

    font-size:32px;
}

.sce-phone-box small{
    display:block;
    color:#666;
    font-size:14px;
}

.sce-phone-box h3{
    margin:0;
    color:#081426;
    font-size:28px;
    font-weight:900;
}

@media(max-width:991px){

    .sce-contact-card1{
        padding:60px 40px;
        text-align:center;
    }

    .sce-contact-card1 h2{
        font-size:42px;
    }

    .sce-phone-box{
        justify-content:center;
        margin-top:40px;
    }
}

@media(max-width:576px){

    .sce-contact-card1{
        padding:50px 25px;
    }

    .sce-contact-card1 h2{
        font-size:32px;
    }

    .sce-phone-box h3{
        font-size:24px;
    }
}

/* =========================
        FOOTER
========================== */

.sce-footer{
    position:relative;
    overflow:hidden;

    padding:100px 0 0;

    background:
        linear-gradient(
            135deg,
            #020817 0%,
            #04142d 40%,
            #061f45 100%
        );

    color:#fff;
}

/* Glow Effects */

.sce-footer::before{
    content:'';
    position:absolute;
    width:400px;
    height:400px;

    background:
        radial-gradient(
            rgba(247,148,29,.18),
            transparent 70%
        );

    top:-200px;
    left:-200px;

    filter:blur(120px);
}

.sce-footer::after{
    content:'';
    position:absolute;
    width:350px;
    height:350px;

    background:
        radial-gradient(
            rgba(0,91,170,.25),
            transparent 70%
        );

    bottom:-150px;
    right:-150px;

    filter:blur(120px);
}

/* Right Side Electrical Tower */
.sce-footer-top{position: relative;   padding-bottom:70px;}
.sce-footer-line-art{
    position:absolute;
    right:10px;
    bottom:0px;
    opacity:.15;
    pointer-events:none;
}

.sce-footer-line-art img{
    width:180px;
    /* animation:sceTowerMove 8s ease-in-out infinite; */
   
}

@keyframes sceTowerMove{
    0%,100%{
        transform:translateY(0);
    }
    50%{
        transform:translateY(-12px);
    }
}

/* Logo */

.sce-footer-logo{
    width:260px;
    margin-bottom:25px;
}

.sce-footer-about{
    color:rgba(255,255,255,.72);
    line-height:1.9;
    margin-bottom:30px;
}

/* Footer Title */

.sce-footer-title{
    color:#fff;
    font-size:24px;
    font-weight:700;
    margin-bottom:30px;
    position:relative;
}

.sce-footer-title::after{
    content:'';
    position:absolute;
    left:0;
    bottom:-12px;

    width:45px;
    height:3px;

    background:#f7941d;
}

/* Links */

.sce-footer-links{
    list-style:none;
    padding:0;
    margin:0;
}

.sce-footer-links li{
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:18px;
    color:rgba(255,255,255,.75);
}

.sce-footer-links a{
    display:flex;
    align-items:center;
    gap:12px;
    text-decoration:none;
    color:rgba(255,255,255,.75);
    transition:.35s;
}

.sce-footer-links a:hover{
    color:#f7941d;
    transform:translateX(8px);
}

/* Icon Circle */

.sce-footer-link-icon{
    width:34px;
    height:34px;

    border-radius:50%;

    background:rgba(253, 253, 253, 0.15);

    color:#f7941d;

    display:flex;
    align-items:center;
    justify-content:center;

    font-size:12px;

    flex-shrink:0;

    transition:.35s;
}

.sce-footer-links a:hover .sce-footer-link-icon,
.sce-footer-links li:hover .sce-footer-link-icon{
    background:#f7941d;
    color:#fff;
    transform:rotate(360deg);
}

/* Contact */

.sce-footer-contact{
    list-style:none;
    padding:0;
}

.sce-footer-contact li{
    display:flex;
    gap:15px;
    margin-bottom:18px;
    color:rgba(255,255,255,.75);
}

.sce-footer-contact i{
    color:#f7941d;
    font-size:18px;
    min-width:20px;
}
.sce-footer-contact-link{
    color:rgba(255,255,255,.75);
    text-decoration:none;
    transition:.3s ease;
}

.sce-footer-contact-link:hover{
    color:#f7941d;
}
.sce-footer-phone-wrapper{
    display:flex;
    flex-direction:column;
    gap:5px;
}

/* Social Icons */

.sce-footer-social{
    display:flex;
    gap:15px;
}

.sce-footer-social a{
    width:45px;
    height:45px;

    border-radius:50%;

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

    display:flex;
    align-items:center;
    justify-content:center;

    color:#fff;
    text-decoration:none;

    transition:.35s;
}

.sce-footer-social a:hover{
    background:#f7941d;
    transform:translateY(-5px);
}

/* Bottom Footer */

.sce-footer-bottom{
  
    padding:25px 0;

    border-top:1px solid rgba(255,255,255,.08);

    color:rgba(255,255,255,.65);
}
.sce-footer-bottom a{
    color:rgba(255,255,255,.65);}

    .sce-footer-bottom a:hover {
  color: #f7941d;
}

/* Responsive */

@media(max-width:991px){

    .sce-footer{
        text-align:center; padding: 50px 0; padding-bottom: 0;
    }

    .sce-footer-title::after{
        left:50%;
        transform:translateX(-50%);
    }

    .sce-footer-links li,
    .sce-footer-contact li{
        justify-content:center;
    }

    .sce-footer-social{
        justify-content:center;
    }

    .sce-footer-line-art{
        display:none;
    }

}


@media(max-width:1601px)
{
    .sc-banner .hero-title {
  font-size: 52px;}
  .sce-ev-heading {
  font-size: 46px;}
  .sce-project-main-title {
  font-size: 44px;}
  .main-title {
  font-size: 42px;}
  .sce-services-main-title{font-size: 37px;}
  .sce-client-main-title {
  font-size: 40px;}
  .sce-contact-card1 h2{font-size: 35px;}
}

@media(max-width:1401px)
{
.sc-header .call-box h4{font-size: 20px;}
.sc-header .logo{max-height: 70px;}


}

@media(max-width:1301px)
{
    .card-dark h5{font-size: 18px;}
    
}


@media(max-width:1201px)
{
    .sc-banner .hero-content{left: 8%;}
    .sc-banner .carousel-indicators {
  bottom: 30px;
}
    .sce-footer-contact{font-size: 14px;}
      .sce-phone-box h3{font-size: 22px;}
}

@media(max-width:1151px)
{
   .sc-header .logo {
    max-height: 60px;
  }
  .sc-header .call-box h4 {
    font-size: 15px;
  }
.sc-header .nav-link{font-size: 12px;}
}

@media (max-width: 1001px) {
  .sc-header .call-box h4 {
    font-size: 13px;
  }
  .sc-header .logo {
    max-height: 60px;
  }
.sc-header .call-icon{width: 38px;
  height: 38px; font-size: 14px;}
  .sce-service-card h5{font-size: 13px;}
  .sce-phone-box h3{font-size: 19px;}
}
@media (max-width: 993px) {
    .sc-header .nav-link {
    font-size: 16px;
padding-left: 0; padding-right: 0;  
}
.sc-header .logo {
    max-height: 100px;
  }

.call-box{display: none !important;}
.sc-header.scrolled{padding: 3px 0;}
.img-reveal img{clip-path: none;}
.sce-phone-box{display: inline-flex;}
.learn-btn{margin-left: auto; margin-right: auto; margin-top: 30px;}
.who-we-are{padding: 60px 0;}
.subtitle{justify-content: center;}
.sc-banner .hero-text{max-width: 60%; text-align: center; margin-left: auto; margin-right: auto;}
.sc-banner .hero-content {
    left: 0%; max-width: 100%; margin-left: auto;margin-right: auto;
  }
  .sce-contact-card1 p {
  max-width: 80%; margin-left: auto; margin-right: auto;}
  .sce-footer-logo{margin-left: auto; margin-right: auto;}
.sce-footer-social {justify-content: center;}
.sce-footer-title::after{left: 50%; transform: translateX(-50%);}
.sce-footer-links{display: flex;
  justify-content: center;
  column-gap: 20px; flex-wrap: wrap;}
  .sce-footer-contact{font-size: inherit; }
  .sce-footer-contact li{justify-content: center;}
  .sce-footer-top{padding-bottom: 20px;}
  .sce-footer-bottom {
  padding: 15px 0;}
  .sc-banner .carousel-control-prev, .sc-banner .carousel-control-next {
  width: 30px;
  height: 30px; font-size: 12px;}
  .carousel-control-next-icon, .carousel-control-prev-icon{width: 1rem; height: 1rem;}
   .sc-banner .hero-title {
    font-size: 32px;
  }
}

@media(max-width:501px)
{
    .main-title {
    font-size: 34px;
  }
  .sce-services-main-title {
    font-size: 27px;
  }
.sce-ev-heading {
    font-size: 34px;
  }
  .sce-phone-icon {
  width: 55px;
  height: 55px;}
  .sce-footer-links a{font-size: 13px;}
}
.sc-banner .btn-outline-light{margin-top: 20px;}


/*=========================
ABOUT BANNER
=========================*/

.about-banner-wrap{
    min-height:560px;
    background:#081018;
    padding-top:var(--header-height);
    padding-bottom: 50px;
}

.about-banner-bg{
    position:absolute;
    inset:0;
}

.about-banner-bg img, .about-banner-bg figure{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:right center;
}


.about-banner-overlay{
    position:absolute;
    inset:0;
    background:
        linear-gradient(
            90deg,
            rgba(8,16,24,.96) 0%,
            rgba(8,16,24,.92) 20%,
            rgba(8,16,24,.82) 35%,
            rgba(8,16,24,.55) 50%,
            rgba(8,16,24,.20) 70%,
            rgba(8,16,24,.05) 100%
        );
}
.about-banner-content{
    position:relative;
    z-index:2;
    max-width:580px;
}

.about-banner-tag{

    display:inline-block;
    margin-bottom:18px;

    padding:8px 18px;

    border-radius:50px;

    background:rgba(255,138,0,.12);

    border:1px solid rgba(255,138,0,.35);

    color:#ff8a00;

    font-weight:600;

    letter-spacing:1px;

    font-size:14px;

}

.about-banner-heading{

    color:#fff;

    font-size:72px;

    line-height:1;

    font-weight:800;

    margin-bottom:28px;

}

.about-banner-heading span{

    color:#ff8a00;

}

.about-banner-text{

    color:#ffffff;

    font-size:19px;

    line-height:1.8;

    margin-bottom:40px;

    opacity:.95;

    max-width:520px;

}

.about-banner-breadcrumb{

    background:none;

    padding:0;

    margin:0;

}

.about-banner-breadcrumb li{

    font-weight:500;

}

.about-banner-breadcrumb li+li::before{

    color:#ffffff !important;

}

.about-banner-breadcrumb a{

    color:#ffffff;

    text-decoration:none;

}

.about-banner-breadcrumb .active{

    color:#ff8a00;

}

/* Decorative Bottom Line */

.about-banner-wrap::after{

    content:"";

    position:absolute;

    left:0;

    bottom:0;

    width:100%;

    height:5px;

    background:linear-gradient(
        90deg,
        #ff8a00,
        transparent
    );

}

@media (max-width:991px){
    

.about-banner-bg img, .about-banner-bg figure{

    object-fit:cover;

    object-position:72% center;

}
.about-banner-overlay{

background:linear-gradient(
90deg,
rgba(8,16,24,.85) 0%,
rgba(8,16,24,.55) 40%,
rgba(8,16,24,.5) 70%,
transparent 100%
);

}
}

@media(max-width:991px){

.about-banner-wrap{

    min-height:500px;

}

.about-banner-heading{

    font-size:54px;

}

.about-banner-text{

    font-size:20px;

}

}

@media (max-width: 767px){

.about-banner-wrap{
    min-height:720px;
    display:flex;
    align-items:center;
}

.about-banner-content{

    max-width:100%;
    text-align:center;
    margin:auto;

}

.about-banner-tag{
    display:inline-block;
}

.about-banner-heading{

    font-size:48px;
    line-height:1.1;

}

.about-banner-text{

    max-width:300px;
    margin:20px auto 30px;
    font-size:18px;

}

.about-banner-breadcrumb{

    justify-content:center;

}
.about-banner-heading span{
    color:#ffffff;
}
.about-banner-heading span{
    color:#ffb347;
}
.about-banner-tag{

    background:rgba(8,16,24,.90);

    color:#ffffff;

    border-color:#ff8a00;

}
}

@media(max-width:576px){

.about-banner-wrap{

    min-height:420px;

}

.about-banner-heading{

    font-size:42px;

}

.about-banner-text{

    font-size:17px;

    line-height:1.7;

}

.about-banner-tag{

    font-size:12px;

}

}


.about-company{
    background:#fff;
}

.about-label{

    color:var(--primary);

    font-weight:700;

    letter-spacing:2px;

    text-transform:uppercase;

    font-size:14px;

}

.about-heading{

    font-size:46px;

    font-weight:800;

    color:var(--secondary);

    margin-bottom:25px;

}

.about-heading span{

    color:var(--primary);

}

.about-company p{

    color:#555;

    line-height:1.9;

    font-size:17px;

}

.about-image{

    overflow:visible;

}

.about-image img{

    border-radius:20px;
    z-index: 2;
    position: relative;

}

.corner-box{

    position:absolute;

    width:70px;

    height:70px;

    background:var(--primary);

    left:-15px;

    bottom:-15px;

    border-radius:12px;

}

.dot-pattern{

    position:absolute;

    width:90px;

    height:120px;

    right:-20px;

    top:40px;

    background-image:radial-gradient(var(--primary) 1.8px,transparent 1.8px);

    background-size:12px 12px;

    opacity:.35;

}

.info-card{

    display:flex;

    gap:18px;

    align-items:flex-start;

    padding:22px;

    background:#fff;

    border-radius:16px;

    box-shadow:0 10px 30px rgba(0,0,0,.08);

    transition:.3s;

}

.info-card:hover{

    transform:translateY(-6px);

}

.info-card i{

    width:65px;

    height:65px;

    background:var(--primary);

    color:#fff;

    border-radius:14px;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:28px;

    flex-shrink:0;

}

.info-card h5{

    font-weight:700;

    color:var(--secondary);

    margin-bottom:6px;

}

.info-card p{

    margin:0;

    font-size:15px;

}


.strengths-section{
    background:#f7f9fc;
}

.strength-label{

    display:inline-block;

    color:var(--primary);

    font-weight:700;

    letter-spacing:2px;

    text-transform:uppercase;

    font-size:14px;

}

.strength-title{

    font-size:42px;

    font-weight:800;

    color:var(--secondary);

    margin-top:10px;

}

.strength-title span{

    color:var(--primary);

}

.strength-divider{

    width:70px;

    height:4px;

    background:var(--primary);

    border-radius:30px;

    margin-top:15px;

}

.strength-card{

    background:#fff;

    padding:35px 30px;

    border-radius:20px;

    text-align:center;

    height:100%;

    transition:.35s;

    box-shadow:0 10px 35px rgba(0,0,0,.07);

}

.strength-card:hover{

    transform:translateY(-10px);

    box-shadow:0 20px 50px rgba(0,0,0,.12);

}

.strength-icon{

    width:85px;

    height:85px;

    margin:auto;

    border-radius:50%;

    background:var(--primary);

    color:#fff;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:34px;

    margin-bottom:25px;

}

.strength-card h4{

    font-size:22px;

    font-weight:700;

    color:var(--secondary);

    margin-bottom:18px;

}

.strength-card p{

    color:#666;

    line-height:1.8;

    margin-bottom:0;

}

.why-section{
    background:#fff;
    overflow:hidden;
}

.why-tag{

    color:var(--primary);

    font-weight:700;

    text-transform:uppercase;

    letter-spacing:2px;

    font-size:14px;

}

.why-heading{

    font-size:44px;

    font-weight:800;

    color:var(--secondary);

    margin-top:12px;

}

.why-heading span{

    color:var(--primary);

}

.why-line{

    width:70px;

    height:4px;

    background:var(--primary);

    border-radius:50px;

    margin-top:18px;

}

.why-text{

    color:#666;

    line-height:1.9;

    margin-bottom:30px;

}

.why-list{

    list-style:none;

    padding:0;

    margin:0;

}

.why-list li{

    display:flex;

    align-items:flex-start;

    gap:15px;

    margin-bottom:18px;

    color:#444;

    font-size:17px;

    line-height:1.6;

}

.why-list i{

    color:var(--primary);

    font-size:20px;

    margin-top:2px;

}

.why-image-wrap{

    position:relative;

}

.why-image-wrap figure{

    position:relative;

    z-index:2;

}

.why-image-wrap img{

    border-radius:24px;

}

.why-accent-box{

    position:absolute;

    width:90px;

    height:90px;

    background:var(--primary);

    right:-20px;

    bottom:-20px;

    border-radius:16px;

    z-index:1;

}

.why-dots{

    position:absolute;

    width:120px;

    height:120px;

    right:-40px;

    top:40px;

    background-image:radial-gradient(var(--primary) 2px,transparent 2px);

    background-size:14px 14px;

    opacity:.30;

}

@media(max-width:991px){

.why-heading{

    font-size:36px;

}

.why-image-wrap{

    margin-top:25px;

}

}



.mission-vision-section{

    background:#ffffff;

}

.mission-box{

    background:var(--secondary);

    border-radius:22px;

    padding:55px;

    position:relative;

    overflow:hidden;

    box-shadow:0 20px 50px rgba(0,0,0,.12);

}

.mission-title{

    color:#fff;

    font-size:40px;

    font-weight:800;

    margin-bottom:15px;

}

.mission-title span{

    color:var(--primary);

}

.mission-line{

    width:80px;

    height:4px;

    background:var(--primary);

    margin:auto;

    border-radius:50px;

}

.mv-item{

    display:flex;

    gap:25px;

    align-items:flex-start;

    padding:20px 30px;

}

.mv-icon{

    width:95px;

    height:95px;

    border:2px solid var(--primary);

    border-radius:50%;

    display:flex;

    justify-content:center;

    align-items:center;

    color:var(--primary);

    font-size:46px;

    flex-shrink:0;

}

.mv-item h3{

    color:var(--primary);

    font-size:28px;

    font-weight:700;

    margin-bottom:15px;

    text-transform:uppercase;

}

.mv-item p{

    color:#d7d7d7;

    line-height:1.9;

    margin:0;

}

@media(min-width:992px){

.border-start-lg{

    border-left:1px solid rgba(255,255,255,.15);

}

}

@media(max-width:991.8px){

.mission-box{

    padding:40px 25px;
    margin-bottom: 20px;

}

.mv-item{

    margin-bottom:35px;

    padding:0;

}

.mission-title{

    font-size:32px;

}
 .info-card{margin-bottom: 20px;}
  .strength-card{height: auto; margin-bottom: 30px;}
  .why-line{margin-left: auto; margin-right: auto;}
  .about-banner-content{max-width: 90%; margin-left: auto; margin-right: auto;}
  .about-banner-text{max-width: 100%;}
  .breadcrumb{justify-content: center;}

}

@media(max-width:576px){
.about-heading {
  font-size: 36px;}
 
.mv-item{

    flex-direction:column;

    text-align:center;

}

.mv-icon{

    margin:auto;

}

}

.cta-area{

    background:#fff8f0;

    position:relative;

    overflow:hidden;

}

.cta-area::before{

    content:"";

    position:absolute;

    width:220px;

    height:220px;

    background:rgba(255,138,0,.06);

    border-radius:50%;

    left:-80px;

    top:-80px;

}

.cta-area::after{

    content:"";

    position:absolute;

    width:180px;

    height:180px;

    background:rgba(255,138,0,.06);

    border-radius:50%;

    right:-60px;

    bottom:-60px;

}

.cta-small-title{

    color:var(--primary);

    letter-spacing:2px;

    font-weight:700;

}

.cta-title{

    font-size:52px;

    font-weight:800;

    color:var(--secondary);

    margin:18px 0;

}

.cta-title span{

    color:var(--primary);

}

.cta-description{

    max-width:760px;

    margin:auto;

    color:#666;

    line-height:1.9;

}

.cta-action{

    margin-top:40px;

    display:flex;

    justify-content:center;

    gap:20px;

    flex-wrap:wrap;

}
.btn-primary-custom{

    background:var(--primary) !important;

    border:2px solid var(--primary) !important;

    color:#ffffff !important;

    padding:16px 36px;

    font-weight:700;

    border-radius:10px;

    transition:.35s;

}

.btn-primary-custom:hover{

    background:#081018 !important;

    border-color:#081018 !important;

    color:#ffffff !important;

}
.btn-phone{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:12px;

    padding:16px 36px;

    border:2px solid var(--primary);

    background:#ffffff;

    color:#081018 !important;

    border-radius:10px;

    text-decoration:none;

    font-weight:700;

    transition:.35s;

}

.btn-phone i{

    color:var(--primary);

}

.btn-phone:hover{

    background:var(--primary);

    color:#ffffff !important;

}

.btn-phone:hover i{

    color:#ffffff;

}



.partnership-section{

    padding:100px 0;

    background:#fff;

}

.partnership-subtitle{

    color:var(--primary);

    font-size:15px;

    font-weight:700;

    text-transform:uppercase;

    letter-spacing:2px;

}

.partnership-title{

    font-size:52px;

    font-weight:800;

    color:var(--secondary);

    margin:15px 0 25px;

    line-height:1.2;

}

.partnership-title span{

    color:var(--primary);

}

.partnership-text{

    color:#666;

    line-height:1.9;

    margin-bottom:20px;

}

.feature-item{

    display:flex;

    align-items:center;

    gap:12px;

    font-weight:600;

}

.feature-item i{

    color:var(--primary);

    font-size:20px;

}

.partnership-btn{

    background:var(--primary);

    color:#fff;

    padding:15px 34px;

    border-radius:8px;

    font-weight:600;

    transition:.4s;

}

.partnership-btn:hover{

    background:var(--secondary);

    color:#fff;

}

.image-wrapper{

    position:relative;

    padding:40px;

}

.main-image{

    width:100%;

    border-radius:25px;

    object-fit:cover;

    box-shadow:0 30px 60px rgba(0,0,0,.15);

    position:relative;

    z-index:2;

}

.less-image{

    position:absolute;

    width:220px;

    height:220px;

    object-fit:cover;

    border-radius:20px;

    right:0;

    top:0;

    border:8px solid #fff;

    box-shadow:0 20px 40px rgba(0,0,0,.15);

    z-index:3;
    

}

.experience-box{

    position:absolute;

    left:0;

    bottom:35px;

    background:var(--primary);

    color:#fff;

    width:190px;

    padding:28px;

    border-radius:18px;

    z-index:4;

    box-shadow:0 20px 40px rgba(0,0,0,.20);

}

.experience-box h2{

    font-size:52px;

    margin:0;

    font-weight:800;

    line-height:1;

}

.experience-box span{

    display:block;

    margin-top:10px;

    line-height:1.5;

}

.circle-shape{

    position:absolute;

    width:220px;

    height:220px;

    background:rgba(255,138,0,.08);

    border-radius:50%;

    right:-40px;

    bottom:-30px;

    z-index:1;

}

.dot-pattern{

    position:absolute;

    width:130px;

    height:130px;

    background-image:radial-gradient(var(--primary) 2px, transparent 2px);

    background-size:14px 14px;

    left:-20px;

    top:40px;

    opacity:.4;

}

@media(max-width:991px){

.partnership-title{

    font-size:38px;

}

.image-wrapper{

    margin-top:50px;

    padding:0;
    overflow:hidden;

}

.less-image{

    width:150px;

    height:150px;

}

.experience-box{

    width:150px;

    padding:20px;

}

.experience-box h2{

    font-size:38px;

}


}

@media (max-width: 576px){
    .cta-title {
  font-size: 32px;}

    .image-wrapper{
        padding:0;
        overflow:hidden;
        border-radius: 25px;
    }

    .less-image{
        display:none;
    }

    .circle-shape{
        right:0;
        bottom:0;
        width:140px;
        height:140px;
    }

    .dot-pattern{
        left:10px;
        top:10px;
    }

    .experience-box{
        left:15px;
        bottom:15px;
        width:140px;
        padding:16px;
    }

    .experience-box h2{
        font-size:32px;
    }
}



.services-banner{

    position:relative;

    min-height:560px;

    overflow:hidden;

    display:flex;

    align-items:center;
    padding-top:var(--header-height);
    padding-bottom: 100px;

}

.services-banner-image{

    position:absolute;

    inset:0;

    z-index:1;

}

.services-banner-image img{

    width:100%;

    height:100%;

    object-fit:cover;

}

.services-overlay{

    position:absolute;

    inset:0;

    z-index:2;

    background:linear-gradient(
    90deg,
    rgba(5,14,28,.96) 0%,
    rgba(5,14,28,.92) 35%,
    rgba(5,14,28,.35) 65%,
    rgba(5,14,28,.10) 100%
    );

}

.services-banner .container{

    position:relative;

    z-index:3;

}

.banner-content{

    color:#fff;

}

.banner-subtitle{

    display:flex;

    align-items:center;

    gap:15px;

    color:var(--primary);

    font-size:15px;

    font-weight:700;

    letter-spacing:2px;

    margin-bottom:25px;

}

.banner-subtitle span{

    width:80px;

    height:2px;

    background:var(--primary);

}

.banner-content h1{

    font-size:68px;

    line-height:1.1;

    font-weight:800;

    margin-bottom:20px;

}

.banner-content h1 span{

    color:var(--primary);

}

.banner-content h3{

    color:var(--primary);

    font-size:36px;

    font-style:italic;

    margin-bottom:30px;

}

.banner-content p{

    color:#f4f4f4;

    font-size:20px;

    line-height:1.9;

    margin-bottom:35px;

}

.breadcrumb{

    background:none;

    padding:0;

    margin:0;

}

.breadcrumb-item a{

    color:#fff;

    text-decoration:none;

}

.breadcrumb-item.active{

    color:var(--primary);

}

.breadcrumb-item+.breadcrumb-item::before{

    color:#fff;

}


.services-intro{

    background:#fff;

}

.section-subtitle{

    color:var(--primary);

    font-weight:700;

    letter-spacing:2px;

    text-transform:uppercase;

    display:inline-block;

    margin-bottom:15px;

}

.section-title{

    font-size:48px;

    font-weight:800;

    color:var(--secondary);

    margin-bottom:25px;

    line-height:1.2;

}

.section-title span{

    color:var(--primary);

}

.services-intro p{

    color:#666;

    line-height:1.9;

    margin-bottom:18px;

}

.services-intro-image{

    overflow:hidden;

    border-radius:24px;

    box-shadow:0 20px 60px rgba(0,0,0,.08);

}

.services-intro-image img{

    transition:.4s;

}

.services-intro-image:hover img{

    transform:scale(1.05);

}

.promise-box{
    position: relative;
    text-align: center;
    padding: 20px 15px;
}

.promise-box::after{
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    width: 1px;
    height: 70%;
    background: #dcdcdc;
}

/* Remove line from the last box */
.col-lg-3:last-child .promise-box::after,
.col-md-3:last-child .promise-box::after{
    display: none;
}
.promise-box i{

    font-size:34px;

    color:var(--primary);

    margin-bottom:12px;

}

.promise-box h6{

    font-weight:700;

    color:var(--secondary);

    margin-bottom:5px;

}

.promise-box small{

    color:#666;

}

@media(max-width:991px){

.section-title{

    font-size:36px;

}

.promise-box{

    border:none;

}

}


/*==================================
Commitment Section
==================================*/

.commitment-section{
    padding:100px 0;
    background:#faf6f1;
    overflow:hidden;
}

/*=========================
Left Content
=========================*/

.commitment-tag{
    display:inline-block;
    color:var(--primary);
    font-size:15px;
    font-weight:700;
    letter-spacing:2px;
    text-transform:uppercase;
    margin-bottom:15px;
}

.commitment-heading{
    font-size:48px;
    font-weight:800;
    line-height:1.2;
    color:var(--secondary);
    margin-bottom:25px;
}

.commitment-heading span{
    color:var(--primary);
}

.commitment-text{
    font-size:17px;
    line-height:1.9;
    color:#666;
    margin-bottom:30px;
}


/*=========================
Diagram
=========================*/

.commitment-diagram{
    width:620px;
    height:620px;
    margin:auto;
    position:relative;
}


/*=========================
Outer Circle
=========================*/

.commitment-outer-circle{
    position:absolute;
    width:520px;
    height:520px;
    border:2px dashed #d8d8d8;
    border-radius:50%;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
}

.commitment-inner-circle{

    position:absolute;

    width:320px;
    height:320px;

    border-radius:50%;

    border:2px dashed rgba(255,138,0,.25);

    left:50%;
    top:50%;

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

}


/*=========================
Diamond
=========================*/

.commitment-diamond{
    position:absolute;
    width:240px;
    height:240px;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%) rotate(45deg);
    border:2px solid var(--primary);
    background:#fff;
}


/*=========================
Center Logo
=========================*/

.commitment-center-logo{

    position:absolute;

    left:50%;
    top:50%;

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

    width:180px;
    height:180px;

    border-radius:50%;

    background:#071018;

    display:flex;
    align-items:center;
    justify-content:center;

    border:10px solid #fff;

    box-shadow:
        0 0 0 8px rgba(255,138,0,.08),
        0 20px 60px rgba(0,0,0,.12);

    z-index:50;

}

.commitment-center-logo img{

    width:100%;
    padding: 10px;

}


/*=========================
Points
=========================*/

.commitment-point{
    position:absolute;
    width:150px;
    text-align:center;
    z-index:30;
}

.commitment-icon{

    width:90px;
    height:90px;

    border-radius:50%;

    background:#fff;

    display:flex;

    justify-content:center;
    align-items:center;

    margin:auto auto 20px;

    border:2px solid #f4f4f4;

    box-shadow:0 15px 40px rgba(0,0,0,.08);

    transition:.4s;

}

.commitment-icon i{

    font-size:34px;

    color:var(--primary);

    transition:.3s;

}

.commitment-point:hover .commitment-icon{

    background:var(--primary);

    transform:translateY(-10px);

    box-shadow:0 20px 50px rgba(255,138,0,.35);

}

.commitment-point:hover i{

    color:#fff;

}


/*=========================
Positions
=========================*/

.commitment-quality{
    left:50%;
    top:-5px;
    transform:translateX(-50%);
}

.commitment-service{
    left:-10px;
    top:50%;
    transform:translateY(-50%);
}

.commitment-cost{
    right:-10px;
    top:50%;
    transform:translateY(-50%);
}

.commitment-time{
    left:50%;
    bottom:-5px;
    transform:translateX(-50%);
}


/*=========================
Hover
=========================*/

.commitment-point:hover .commitment-icon{
    background:var(--primary);
    transform:translateY(-8px);
}

.commitment-point:hover .commitment-icon i{
    color:#fff;
}


/*=========================
Responsive
=========================*/

@media(max-width:991px){

    .commitment-diagram{
        width:500px;
        height:500px;
        margin-top:70px;
    }

    .commitment-outer-circle{
        width:420px;
        height:420px;
    }

    .commitment-diamond{
        width:180px;
        height:180px;
    }

    .commitment-center-logo{
        width:150px;
        height:150px;
    }

    .commitment-center-logo img{
        width:90px;
    }

    .commitment-heading{
        font-size:38px;
    }

}

@media(max-width:767px){

    .commitment-diagram{
        width:340px;
        height:340px;
    }

    .commitment-outer-circle{
        width:300px;
        height:300px;
    }

    .commitment-diamond{
        width:120px;
        height:120px;
    }

    .commitment-center-logo{
        width:100px;
        height:100px;
    }

    .commitment-center-logo img{
        width:100px;
    }

    .commitment-icon{
        width:60px;
        height:60px;
    }

    .commitment-icon i{
        font-size:22px;
    }

    .commitment-point{
        width:100px;
    }

    .commitment-point h5{
        font-size:14px;
    }

    .commitment-heading{
        font-size:30px;
    }

}

/*==============================
Orange Lines
==============================*/

.commitment-line{

    position:absolute;

    background:var(--primary);

    z-index:1;

}

/* Top */

.commitment-line-top{

    width:2px;

    height:150px;

    left:50%;

    top:-150px;

    transform:translateX(-50%);

}

/* Right */

.commitment-line-right{

    width:150px;

    height:2px;

    right:-150px;

    top:50%;

    transform:translateY(-50%);

}

/* Bottom */

.commitment-line-bottom{

    width:2px;

    height:150px;

    left:50%;

    bottom:-150px;

    transform:translateX(-50%);

}

/* Left */

.commitment-line-left{

    width:150px;

    height:2px;

    left:-150px;

    top:50%;

    transform:translateY(-50%);

}


/*==============================
Orange Dots
==============================*/

.commitment-dot{

    position:absolute;

    width:16px;

    height:16px;

    background:var(--primary);

    border-radius:50%;

    box-shadow:0 0 0 6px rgba(255,138,0,.15);

}

/* Positions */

.commitment-dot-top{

    left:50%;

    top:-158px;

    transform:translateX(-50%);

}

.commitment-dot-right{

    right:-158px;

    top:50%;

    transform:translateY(-50%);

}

.commitment-dot-bottom{

    left:50%;

    bottom:-158px;

    transform:translateX(-50%);

}

.commitment-dot-left{

    left:-158px;

    top:50%;

    transform:translateY(-50%);

}
.commitment-line{

    transition:.4s;

}

.commitment-dot{

    transition:.4s;

}

.commitment-diagram:hover .commitment-line{

    background:#ff6b00;

}

.commitment-diagram:hover .commitment-dot{

    transform:scale(1.25);

}





/*=====================================
OUR CORE SERVICES
======================================*/

.our-services-section{
    padding:100px 0;
    background:#fff;
}

.our-services-tag{
    display:inline-block;
    color:var(--primary);
    font-size:15px;
    font-weight:700;
    letter-spacing:2px;
    text-transform:uppercase;
    margin-bottom:12px;
}

.our-services-heading{
    font-size:48px;
    font-weight:800;
    color:var(--secondary);
    margin-bottom:20px;
    line-height:1.2;
}

.our-services-heading span{
    color:var(--primary);
}

.our-services-text{
    max-width:720px;
    margin:auto;
    color:#6b7280;
    font-size:17px;
    line-height:1.9;
}


/*=====================================
SERVICE CARD
======================================*/

.service-card{
    position:relative;
    background:#fff;
    border:1px solid #ececec;
    border-radius:20px;
    overflow:hidden;
    height:100%;
    transition:.35s ease;
    box-shadow:0 10px 30px rgba(0,0,0,.05);
}

.service-card:hover{
    transform:translateY(-10px);
    box-shadow:0 20px 50px rgba(0,0,0,.10);
}


/*=====================================
IMAGE
======================================*/

.service-image{
    height:100%;
    overflow:hidden;
}

.service-image img{
    width:100%;
    height:100%;
    min-height:290px;
    object-fit:cover;
    transition:.45s;
}

.service-card:hover .service-image img{
    transform:scale(1.08);
}


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

.service-content{
    position:relative;
    padding:38px 35px 35px 90px;
}

.service-content h3{
    font-size:28px;
    font-weight:700;
    color:var(--secondary);
    line-height:1.3;
    margin-bottom:18px;
}

.service-content p{
    color:#666;
    font-size:15px;
    line-height:1.8;
    margin-bottom:22px;
}


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

.service-number{

    position:absolute;

    top:28px;

    left:20px;   /* instead of -22px */

    width:52px;

    height:52px;

    border-radius:50%;

    background:var(--primary);

    color:#fff;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:18px;

    font-weight:700;

    border:5px solid #fff;

    box-shadow:0 12px 25px rgba(255,138,0,.35);

}


/*=====================================
LIST
======================================*/

.service-list{
    list-style:none;
    padding:0;
    margin:0;
}

.service-list li{
    display:flex;
    align-items:flex-start;
    margin-bottom:14px;
    font-size:15px;
    color:#444;
    line-height:1.6;
}

.service-list li:last-child{
    margin-bottom:0;
}

.service-list i{
    color:var(--primary);
    font-size:17px;
    margin-right:10px;
    margin-top:3px;
}


/*=====================================
FIGURE
======================================*/

.service-image figure{
    margin:0;
}


/*=====================================
RESPONSIVE
======================================*/

@media (max-width:991px){

    .our-services-section{
        padding:80px 0;
    }

    .our-services-heading{
        font-size:38px;
    }

    .service-card{
        margin-bottom:30px;
    }

    .service-image img{
        min-height:260px;
    }

    .service-content{
        padding:35px;
    }

    .service-content h3{
        font-size:24px;
    }

    .service-number{
        left:20px;
        top:-25px;
    }

}


@media (max-width:767px){

    .our-services-heading{
        font-size:32px;
    }

    .our-services-text{
        font-size:15px;
    }

    .service-image img{
        min-height:230px;
    }

    .service-content{
        padding:30px 25px;
    }

    .service-content h3{
        font-size:22px;
    }

    .service-content p{
        font-size:14px;
    }

    .service-number{
        position:relative;
        top:0;
        left:0;
        margin-bottom:20px;
    }

}




/*=========================================
WORKING PROCESS SECTION
=========================================*/

.sce-working-process{
    background:linear-gradient(135deg,#06182d 0%,#0b2342 100%);
    border-radius:24px;
    position:relative;
    overflow:hidden;
}

.sce-working-process::before{
    content:"";
    position:absolute;
    inset:0;
    background:
    radial-gradient(circle at top right,rgba(255,138,0,.10),transparent 35%),
    radial-gradient(circle at bottom left,rgba(255,255,255,.04),transparent 40%);
    pointer-events:none;
}

/*=========================
Heading
=========================*/

.sce-section-subtitle{
    color:#ff8a00;
    font-size:15px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.8px;
}

.sce-section-title{
    color:#fff;
    font-size:42px;
    font-weight:800;
    margin-top:10px;
}

.sce-section-title span{
    color:#ff8a00;
}

.sce-title-line{
    width:70px;
    height:3px;
    background:#ff8a00;
    border-radius:50px;
    margin:18px auto 0;
}

/*=========================
Wrapper
=========================*/

.sce-process-wrapper{
    position:relative;
    z-index:2;
}

/*=========================
Connecting Line
=========================*/

.sce-process-line{
    position:absolute;
    left:6%;
    right:6%;
    top:43px;
    border-top:2px dashed rgba(255,255,255,.35);
    z-index:0;
}

/*=========================
Item
=========================*/

.sce-process-box{
    text-align:center;
    position:relative;
    z-index:2;
}

.sce-process-box h5{
    color:#fff;
    font-size:15px;
    font-weight:600;
    margin-top:22px;
    line-height:1.5;
    transition:.35s;
}

/*=========================
Icon Circle
=========================*/

.sce-process-icon{

    width:86px;
    height:86px;

    margin:auto;

    border:2px solid #ff8a00;
    border-radius:50%;

    background:#081a30;

    display:flex;
    align-items:center;
    justify-content:center;

    position:relative;

    transition:.4s;
}

.sce-process-icon i{

    color:#fff;
    font-size:34px;

    transition:.35s;
}

/*=========================
Number
=========================*/

.sce-process-icon span{

    position:absolute;

    bottom:-10px;
    left:50%;

    transform:translateX(-50%);

    background:#ff8a00;

    width:28px;
    height:28px;

    border-radius:50%;

    color:#fff;

    font-size:13px;
    font-weight:700;

    display:flex;
    align-items:center;
    justify-content:center;

    box-shadow:0 8px 18px rgba(255,138,0,.2);
}

/*=========================
Hover
=========================*/

.sce-process-box:hover .sce-process-icon{

    background:#ff8a00;

    transform:translateY(-8px);

    box-shadow:0 18px 40px rgba(255,138,0,.2);

}

.sce-process-box:hover .sce-process-icon i{

    color:#fff;

}

.sce-process-box:hover h5{

    color:#ffb15b;

}

/*=========================
Desktop Equal Width
=========================*/

@media(min-width:992px){

    .sce-working-process .col-lg{

        flex:0 0 12.5%;
        max-width:12.5%;

    }

}

/*=========================
Tablet
=========================*/

@media(max-width:991px){

    .sce-section-title{

        font-size:34px;

    }

    .sce-process-line{

        display:none;

    }

    .sce-process-box{

        margin-bottom:35px;

    }

}

/*=========================
Mobile
=========================*/

@media(max-width:767px){

    .sce-working-process{

        border-radius:16px;
        padding:25px 10px;

    }

    .sce-section-title{

        font-size:28px;

    }

    .sce-process-icon{

        width:72px;
        height:72px;

    }

    .sce-process-icon i{

        font-size:28px;

    }

    .sce-process-box h5{

        font-size:14px;

    }

}


/*=====================================
INDUSTRIES WE SERVE
======================================*/

.sce-industries{
    background:#ffffff;
    position:relative;
    overflow:hidden;
}

.sce-industries .sce-section-subtitle{
    display:inline-block;
    color:var(--primary);
    font-size:15px;
    font-weight:700;
    letter-spacing:2px;
    text-transform:uppercase;
    margin-bottom:12px;
}

.sce-industries .sce-section-title{
    font-size:42px;
    font-weight:800;
    color:var(--secondary);
    margin-bottom:18px;
    line-height:1.3;
}

.sce-industries .sce-section-title span{
    color:var(--primary);
}

.sce-industries .sce-heading-line{
    width:70px;
    height:4px;
    border-radius:30px;
    background:var(--primary);
    margin:0 auto 25px;
}

.sce-industries .sce-section-desc{
    max-width:760px;
    margin:auto;
    color:#6b7280;
    line-height:1.9;
    font-size:16px;
}

/*=====================================
INDUSTRY ITEM
======================================*/

.sce-industry-item{

    text-align:center;

    padding:25px 30px 15px;

    position:relative;

    transition:.35s ease;

    height:100%;

}

/* Vertical Divider */

.sce-industry-item::after{

    content:"";

    position:absolute;

    right:0;
    top:10%;

    width:1px;
    height:80%;

    background:#e9e9e9;

}

/* Remove divider on 4th & 8th */

.sce-industries .col-lg-3:nth-child(4) .sce-industry-item::after,
.sce-industries .col-lg-3:nth-child(8) .sce-industry-item::after{

    display:none;

}

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

.sce-industry-icon{

    width:90px;
    height:90px;

    margin:0 auto 30px;

    border-radius:50%;

    border:2px solid #ececec;

    display:flex;
    align-items:center;
    justify-content:center;

    position:relative;

    transition:.4s;

    background:#fff;

}

.sce-industry-icon::before{

    content:"";

    position:absolute;

    width:72px;
    height:72px;

    border-radius:50%;

    background:#fff7ef;

    transition:.35s;

}

.sce-industry-icon i{

    position:relative;

    z-index:2;

    font-size:38px;

    color:var(--primary);

    transition:.35s;

}

/*=====================================
TEXT
======================================*/

.sce-industry-item h5{

    font-size:22px;

    font-weight:700;

    color:var(--secondary);

    margin-bottom:15px;

}

.sce-industry-item p{

    color:#666;

    line-height:1.8;

    font-size:15px;

    margin-bottom:0;

}

/*=====================================
HOVER
======================================*/

.sce-industry-item:hover{

    transform:translateY(-10px);

}

.sce-industry-item:hover .sce-industry-icon{

    border-color:var(--primary);

    box-shadow:0 15px 35px rgba(255,138,0,.18);

}

.sce-industry-item:hover .sce-industry-icon::before{

    background:var(--primary);

}

.sce-industry-item:hover .sce-industry-icon i{

    color:#fff;

}

.sce-industry-item:hover h5{

    color:var(--primary);

}

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

@media(max-width:991px){

    .sce-industries .sce-section-title{

        font-size:34px;

    }

    .sce-industry-item{

        border:1px solid #ececec;
        border-radius:15px;
        padding:35px 20px;
        margin: 0 20px;

    }

    .sce-industry-item::after{

        display:none;

    }

}

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

@media(max-width:767px){

    .sce-industries{

        padding:70px 0;

    }

    .sce-industries .sce-section-title{

        font-size:28px;

    }

    .sce-industries .sce-section-desc{

        font-size:15px;

    }

    .sce-industry-item{

        padding:30px 20px;

    }

    .sce-industry-icon{

        width:75px;
        height:75px;
        margin-bottom:20px;

    }

    .sce-industry-icon::before{

        width:60px;
        height:60px;

    }

    .sce-industry-icon i{

        font-size:30px;

    }

    .sce-industry-item h5{

        font-size:18px;

    }

}
/*=========================================
PART 3
Premium Effects & Animations
=========================================*/

/* Decorative Background */

.sce-industries::before{
    content:"";
    position:absolute;
    width:420px;
    height:420px;
    border-radius:50%;
    background:rgba(255,138,0,.04);
    top:-180px;
    right:-180px;
}

.sce-industries::after{
    content:"";
    position:absolute;
    width:320px;
    height:320px;
    border-radius:50%;
    background:rgba(8,16,24,.03);
    bottom:-160px;
    left:-160px;
}

/*------------------------------------
Card Hover
------------------------------------*/

.sce-industry-item{
    overflow:hidden;
}

.sce-industry-item::before{

    content:"";

    position:absolute;

    left:50%;
    bottom:0;

    transform:translateX(-50%);

    width:0;

    height:3px;

    background:var(--primary);

    transition:.4s ease;

}

.sce-industry-item:hover::before{

    width:65%;

}

/*------------------------------------
Icon Animation
------------------------------------*/

.sce-industry-item:hover .sce-industry-icon{

    transform:translateY(-8px) rotate(8deg);

}

.sce-industry-item:hover .sce-industry-icon i{

    transform:scale(1.12);

}

/*------------------------------------
Text Animation
------------------------------------*/

.sce-industry-item h5,
.sce-industry-item p,
.sce-industry-icon,
.sce-industry-icon i{

    transition:all .35s ease;

}

/*------------------------------------
Appear Animation
------------------------------------*/

.sce-industry-item{

    animation:sceFadeUp .8s ease both;

}

.sce-industries .col-lg-3:nth-child(2){animation-delay:.1s;}
.sce-industries .col-lg-3:nth-child(3){animation-delay:.2s;}
.sce-industries .col-lg-3:nth-child(4){animation-delay:.3s;}
.sce-industries .col-lg-3:nth-child(5){animation-delay:.4s;}
.sce-industries .col-lg-3:nth-child(6){animation-delay:.5s;}
.sce-industries .col-lg-3:nth-child(7){animation-delay:.6s;}
.sce-industries .col-lg-3:nth-child(8){animation-delay:.7s;}

@keyframes sceFadeUp{

    from{

        opacity:0;
        transform:translateY(40px);

    }

    to{

        opacity:1;
        transform:translateY(0);

    }

}

/*------------------------------------
Desktop
------------------------------------*/

@media(min-width:1200px){

    .sce-industry-item{

        min-height:280px;

    }

}

/*------------------------------------
Tablet
------------------------------------*/

@media(max-width:991px){

    .sce-industries::before,
    .sce-industries::after{

        display:none;

    }

}

/*------------------------------------
Mobile
------------------------------------*/

@media(max-width:767px){

    .sce-industry-item{

        min-height:auto;

    }

    .sce-industry-item h5{

        margin-bottom:10px;

    }

    .sce-industry-item p{

        line-height:1.7;

    }

}




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

.sce-services-list-section{

    background:#fff;

}

.sce-services-image{

    overflow:hidden;

    border-radius:20px;

    box-shadow:0 20px 50px rgba(0,0,0,.10);

}

.sce-services-image img{

    width:100%;

    height:620px;

    object-fit:cover;

    transition:.5s;

}

.sce-services-image:hover img{

    transform:scale(1.05);

}

.sce-services-subtitle{

    color:var(--primary);

    text-transform:uppercase;

    letter-spacing:2px;

    font-size:15px;

    font-weight:700;

    display:inline-block;

    margin-bottom:12px;

}

.sce-services-title{

    font-size:42px;

    font-weight:800;

    color:var(--secondary);

    margin-bottom:20px;

}

.sce-services-text{

    color:#6b7280;

    line-height:1.9;

    margin-bottom:30px;

}

.sce-services-list{

    list-style:none;

    padding:0;

    margin:0;

}

.sce-services-list li{

    display:flex;

    align-items:flex-start;

    gap:12px;

    margin-bottom:16px;

    color:#444;

    font-size:16px;

    font-weight:500;

    transition:.3s;

}

.sce-services-list li i{

    color:var(--primary);

    font-size:18px;

    margin-top:3px;

}

.sce-services-list li:hover{

    transform:translateX(8px);

    color:var(--primary);

}

@media(max-width:991px){

    .sce-services-title{

        font-size:34px;

    }

    .sce-services-image img{

        height:450px;

    }

}

@media(max-width:767px){

    .sce-services-title{

        font-size:28px;

    }

    .sce-services-image img{

        height:320px;

    }

}



/*=========================================
EV CHARGING HERO
=========================================*/

.scev-banner{

    position: relative;

    overflow: hidden;

    background: linear-gradient(135deg,#081018 0%,#12253a 100%);

    padding: 180px 0 120px;

    min-height: 620px;

    display: flex;

    align-items: center;

}

.scev-banner::before{

    content: "";

    position: absolute;

    inset: 0;

    background: radial-gradient(circle at top right,
    rgba(255,138,0,.12),transparent 45%);

    pointer-events: none;

}

.scev-banner .container{

    position: relative;

    z-index: 2;

}

/*==========================
Breadcrumb
==========================*/

.scev-banner-breadcrumb{

    display:flex;

    align-items:center;

    gap:12px;

    margin-top:25px;

    font-size:15px;

}

.scev-banner-breadcrumb a{

    color:#fff;

    text-decoration:none;

    transition:.3s;

}

.scev-banner-breadcrumb a:hover{

    color:var(--primary);

}

.scev-banner-breadcrumb span{

    color:var(--primary);

}

/*==========================
Heading
==========================*/

.scev-banner-title{

    color:#fff;

    font-size:72px;

    font-weight:800;

    line-height:1.05;

    margin-bottom:28px;

}

.scev-banner-title span{

    display:block;

    color:var(--primary);

}

/*==========================
Description
==========================*/

.scev-banner-description{

    color:#d2dae5;

    font-size:18px;

    line-height:1.9;

    max-width:560px;

    margin-bottom:40px;

}

/*==========================
Button
==========================*/

.scev-banner-btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:10px;

    padding:16px 34px;

    border-radius:50px;

    background:var(--primary);

    color:#fff;

    font-weight:600;

    text-decoration:none;

    transition:.35s;

}

.scev-banner-btn:hover{

    background:#ff7600;

    color:#fff;

    transform:translateY(-4px);

}

/*==========================
Right Image
==========================*/

.scev-banner-image{

    position:relative;

    text-align:right;

}

.scev-banner-image figure{

    margin:0;

}

.scev-banner-image img{

    width:100%;

    max-width:640px;

    animation:scevFloat 6s ease-in-out infinite;

}

/*==========================
Decorative Shapes
==========================*/

.scev-circle-one{

    position:absolute;

    width:260px;

    height:260px;

    border-radius:50%;

    background:rgba(255,138,0,.08);

    top:-120px;

    right:-120px;

}

.scev-circle-two{

    position:absolute;

    width:180px;

    height:180px;

    border-radius:50%;

    border:1px solid rgba(255,255,255,.08);

    bottom:40px;

    left:-90px;

}

/*==========================
Animation
==========================*/

@keyframes scevFloat{

    0%{

        transform:translateY(0);

    }

    50%{

        transform:translateY(-15px);

    }

    100%{

        transform:translateY(0);

    }

}

/*==========================
Responsive
==========================*/

@media(max-width:1199px){

.scev-banner-title{

    font-size:60px;

}

}

@media(max-width:991px){

.scev-banner{

    padding:140px 0 80px;

    text-align:center;

}

.scev-banner-description{

    margin-left:auto;

    margin-right:auto;

}

.scev-banner-image{

    margin-top:60px;

    text-align:center;

}

.scev-banner-image img{

    max-width:500px;

}

}

@media(max-width:767px){

.scev-banner{

    min-height:auto;

    padding:120px 0 70px;

}

.scev-banner-title{

    font-size:42px;

}

.scev-banner-description{

    font-size:16px;

}

.scev-banner-btn{

    width:100%;

}

.scev-banner-image img{

    max-width:340px;

}

.scev-circle-one,

.scev-circle-two{

    display:none;

}

}
/*=========================================
HEADER OVER HERO
=========================================*/

.main-header{

    position:absolute;

    top:0;

    left:0;

    width:100%;

    z-index:999;

    background:transparent;

    border-bottom:1px solid rgba(255,255,255,.08);

}

.main-header .navbar{

    padding:22px 0;

}

.main-header.nav-scroll{

    position:fixed;

    background:#081018;

    animation:scevHeader .35s ease;

    box-shadow:0 10px 30px rgba(0,0,0,.12);

}

@keyframes scevHeader{

    from{

        opacity:0;

        transform:translateY(-15px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}

/*=========================================
HERO IMAGE POSITION
=========================================*/

.scev-banner-image{

    position:relative;

    display:flex;

    justify-content:flex-end;

    align-items:center;

    height:100%;

}

.scev-banner-image img{

    display:block;

    max-width:700px;

    width:100%;

    margin-right:-50px;

    filter:drop-shadow(0 30px 60px rgba(0,0,0,.28));

}

/*=========================================
BACKGROUND EFFECT
=========================================*/

.scev-banner::after{

    content:"";

    position:absolute;

    width:900px;

    height:900px;

    border-radius:50%;

    background:radial-gradient(circle,
    rgba(255,138,0,.10) 0%,
    rgba(255,138,0,.02) 55%,
    transparent 80%);

    right:-250px;

    top:-220px;

    z-index:1;

}

/*=========================================
TITLE ANIMATION
=========================================*/

.scev-banner-content{

    animation:scevFadeUp .8s ease;

}

.scev-banner-image{

    animation:scevFadeRight .9s ease;

}

@keyframes scevFadeUp{

    from{

        opacity:0;

        transform:translateY(40px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}

@keyframes scevFadeRight{

    from{

        opacity:0;

        transform:translateX(60px);

    }

    to{

        opacity:1;

        transform:translateX(0);

    }

}

/*=========================================
BUTTON
=========================================*/

.scev-banner-btn{

    box-shadow:0 15px 35px rgba(255,138,0,.35);

}

.scev-banner-btn:hover{

    box-shadow:0 20px 45px rgba(255,138,0,.45);

}

/*=========================================
RESPONSIVE
=========================================*/

@media(max-width:1200px){

.scev-banner-image img{

    max-width:580px;

    margin-right:0;

}

}

@media(max-width:991px){

.scev-banner{

    text-align:center;

}

.scev-banner-image{

    justify-content:center;

    margin-top:50px;

}

.scev-banner-image img{

    max-width:480px;

}

}

@media(max-width:767px){

.scev-banner{

    padding:120px 0 70px;

}

.scev-banner-title{

    font-size:38px;

}

.scev-banner-image img{

    max-width:320px;

}

.main-header .navbar{

    padding:15px 0;

}

}



/*=========================================
ABOUT EV CHARGING
=========================================*/

.sce-about-ev{

    background:#fff;

    padding:100px 0;

    position:relative;

    overflow:hidden;

}

.sce-about-ev::before{

    content:"";

    position:absolute;

    top:-120px;

    right:-120px;

    width:350px;

    height:350px;

    border-radius:50%;

    background:rgba(255,138,0,.05);

}

.sce-about-ev .container{

    position:relative;

    z-index:2;

}

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

.sce-about-image{

    overflow:hidden;

    border-radius:22px;

    box-shadow:0 20px 60px rgba(0,0,0,.12);

}

.sce-about-image img{

    width:100%;

    transition:.5s;

    display:block;

}

.sce-about-image:hover img{

    transform:scale(1.05);

}

/*=============================
SMALL TITLE
=============================*/

.sce-small-title{

    display:inline-block;

    color:var(--primary);

    font-size:15px;

    font-weight:700;

    text-transform:uppercase;

    letter-spacing:1px;

    margin-bottom:18px;

    position:relative;

    padding-bottom:12px;

}

.sce-small-title::after{

    content:"";

    position:absolute;

    left:0;

    bottom:0;

    width:48px;

    height:3px;

    background:var(--primary);

    border-radius:20px;

}

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

.sce-about-content h2{

    font-size:48px;

    font-weight:700;

    color:#081018;

    line-height:1.25;

    margin-bottom:28px;

}

.sce-about-content h2 span{

    display:block;

}

/*=============================
PARAGRAPH
=============================*/

.sce-about-content p{

    color:#606b7b;

    font-size:17px;

    line-height:1.9;

    margin-bottom:18px;

}

/*=============================
FEATURE CARD
=============================*/

.sce-feature-card{

    background:#fff;

    border:1px solid #ececec;

    border-radius:18px;

    padding:28px 22px;

    display:flex;

    align-items:flex-start;

    gap:18px;

    height:100%;

    transition:.35s;

}

.sce-feature-card:hover{

    transform:translateY(-8px);

    box-shadow:0 18px 45px rgba(0,0,0,.10);

    border-color:transparent;

}

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

.sce-feature-icon{

    width:72px;

    height:72px;

    min-width:72px;

    border-radius:50%;

    background:#fff7ef;

    display:flex;

    align-items:center;

    justify-content:center;

}

.sce-feature-icon i{

    font-size:34px;

    color:var(--primary);

}

/*=============================
CARD TITLE
=============================*/

.sce-feature-card h5{

    margin-bottom:10px;

    font-size:21px;

    font-weight:700;

    color:#081018;

}

/*=============================
CARD TEXT
=============================*/

.sce-feature-card p{

    margin:0;

    font-size:15px;

    line-height:1.8;

    color:#6f7b8a;

}

/*=============================
RESPONSIVE
=============================*/

@media (max-width:1199px){

.sce-about-content h2{

    font-size:40px;

}

}

@media (max-width:991px){

.sce-about-ev{

    padding:80px 0;

}

.sce-about-content{

    margin-top:20px;

}

.sce-about-content h2{

    font-size:36px;

}

.sce-feature-card{

    margin-bottom:5px;

}

}

@media (max-width:767px){

.sce-about-ev{

    padding:60px 0;

}

.sce-about-content{

    text-align:center;

}

.sce-small-title::after{

    left:50%;

    transform:translateX(-50%);

}

.sce-about-content h2{

    font-size:30px;

}

.sce-about-content h2 span{

    display:inline;

}

.sce-about-content p{

    font-size:16px;

}

.sce-feature-card{

    text-align:left;

}

.sce-feature-icon{

    width:60px;

    height:60px;

    min-width:60px;

}

.sce-feature-icon i{

    font-size:28px;

}

}


/*==================================================
OUR CHARGING STATION WORKS
==================================================*/

.sce-works-section{

    padding:100px 0;

    background:#fff8f0;

    position:relative;

    overflow:hidden;

}

.sce-works-section::before{

    content:"";

    position:absolute;

    width:320px;

    height:320px;

    border-radius:50%;

    background:rgba(255,138,0,.05);

    top:-180px;

    left:-120px;

}

.sce-works-section .container{

    position:relative;

    z-index:2;

}

/*==================================
Section Subtitle
==================================*/

.sce-works-section .sce-section-subtitle{

    display:inline-block;

    color:var(--primary);

    font-size:15px;

    font-weight:700;

    text-transform:uppercase;

    letter-spacing:1px;

    position:relative;

    padding-bottom:12px;

    margin-bottom:20px;

}

.sce-works-section .sce-section-subtitle::after{

    content:"";

    position:absolute;

    left:50%;

    bottom:0;

    width:55px;

    height:3px;

    transform:translateX(-50%);

    background:var(--primary);

    border-radius:30px;

}

/*==================================
Heading
==================================*/

.sce-works-section .sce-section-title{

    font-size:48px;

    font-weight:700;

    color:#081018;

    margin-bottom:22px;

    line-height:1.25;

}

/*==================================
Description
==================================*/

.sce-works-section .sce-section-description{

    font-size:18px;

    line-height:1.9;

    color:#5f6978;

    max-width:900px;

    margin:auto;

}

/*==================================
Gallery Card
==================================*/

.sce-work-card{

    position:relative;

    overflow:hidden;

    border-radius:18px;

    background:#fff;

    box-shadow:0 15px 40px rgba(0,0,0,.08);

    transition:.35s;

}

.sce-work-card img{

    width:100%;

    height:360px;

    object-fit:cover;

    transition:.45s;

    display:block;

}

.sce-work-card:hover{

    transform:translateY(-8px);

    box-shadow:0 25px 60px rgba(0,0,0,.15);

}

.sce-work-card:hover img{

    transform:scale(1.08);

}

/*==================================
Optional Overlay
==================================*/

.sce-work-card::after{

    content:"";

    position:absolute;

    inset:0;

    background:linear-gradient(to top,
    rgba(8,16,24,.18),
    transparent 55%);

    opacity:0;

    transition:.35s;

}

.sce-work-card:hover::after{

    opacity:1;

}

/*==================================
Responsive
==================================*/

@media (max-width:1200px){

.sce-work-card img{

    height:320px;

}

}

@media (max-width:991px){

.sce-works-section{

    padding:80px 0;

}

.sce-works-section .sce-section-title{

    font-size:38px;

}

.sce-works-section .sce-section-description{

    font-size:17px;

}

.sce-work-card img{

    height:300px;

}

}

@media (max-width:767px){

.sce-works-section{

    padding:60px 0;

}

.sce-works-section .sce-section-title{

    font-size:30px;

}

.sce-works-section .sce-section-description{

    font-size:16px;

}

.sce-work-card img{

    height:260px;

}

}



/*=========================================
OUR EV CHARGING SOLUTIONS
=========================================*/

.sce-solutions-section{

    padding:100px 0;

    background:#fff;

    position:relative;

    overflow:hidden;

}

.sce-solutions-section::before{

    content:"";

    position:absolute;

    width:320px;

    height:320px;

    border-radius:50%;

    background:rgba(255,138,0,.04);

    left:-120px;

    top:-120px;

}

.sce-solutions-section .container{

    position:relative;

    z-index:2;

}

/*==========================
Heading
==========================*/

.sce-solutions-subtitle{

    display:inline-block;

    color:var(--primary);

    font-size:15px;

    font-weight:700;

    letter-spacing:1px;

    text-transform:uppercase;

    position:relative;

    padding-bottom:12px;

    margin-bottom:18px;

}

.sce-solutions-subtitle::after{

    content:"";

    position:absolute;

    width:55px;

    height:3px;

    background:var(--primary);

    left:50%;

    bottom:0;

    transform:translateX(-50%);

    border-radius:20px;

}

.sce-solutions-title{

    font-size:50px;

    font-weight:700;

    color:#081018;

    margin-bottom:10px;

}

/*==========================
Cards
==========================*/

.sce-solution-card{

    background:#fff;

    border-radius:20px;

    padding:35px;

    border:1px solid #ececec;

    box-shadow:0 10px 35px rgba(0,0,0,.05);

    transition:.35s;

    height:100%;

    position:relative;

    overflow:hidden;

}

.sce-solution-card:hover{

    transform:translateY(-10px);

    box-shadow:0 25px 60px rgba(0,0,0,.12);

    border-color:rgba(255,138,0,.25);

}

.sce-solution-card::before{

    content:"";

    position:absolute;

    top:0;

    left:0;

    width:5px;

    height:100%;

    background:var(--primary);

    transform:scaleY(0);

    transition:.35s;

    transform-origin:top;

}

.sce-solution-card:hover::before{

    transform:scaleY(1);

}

/*==========================
Icon
==========================*/

.sce-solution-icon{

    width:95px;

    height:95px;

    border-radius:50%;

    background:#f8f8f8;

    display:flex;

    align-items:center;

    justify-content:center;

    transition:.35s;

}

.sce-solution-card:hover .sce-solution-icon{

    background:rgba(255,138,0,.10);

}

.sce-solution-icon i{

    font-size:52px;

    color:var(--primary);

}

/*==========================
Title
==========================*/

.sce-solution-card h4{

    font-size:28px;

    font-weight:700;

    color:#081018;

    margin-bottom:20px;

}

/*==========================
List
==========================*/

.sce-solution-card ul{

    list-style:none;

    padding:0;

    margin:0;

}

.sce-solution-card ul li{

    position:relative;

    padding-left:28px;

    margin-bottom:14px;

    color:#5d6674;

    font-size:17px;

    line-height:1.7;

}

.sce-solution-card ul li:last-child{

    margin-bottom:0;

}

.sce-solution-card ul li::before{

    content:"";

    width:10px;

    height:10px;

    border-radius:50%;

    background:var(--primary);

    position:absolute;

    left:0;

    top:9px;

    box-shadow:0 0 0 4px rgba(255,138,0,.15);

}

/*==========================
Responsive
==========================*/

@media(max-width:1200px){

.sce-solutions-title{

    font-size:42px;

}

.sce-solution-card{

    padding:30px;

}

.sce-solution-icon{

    width:85px;

    height:85px;

}

.sce-solution-icon i{

    font-size:45px;

}

.sce-solution-card h4{

    font-size:24px;

}

}

@media(max-width:991px){

.sce-solutions-section{

    padding:80px 0;

}

.sce-solutions-title{

    font-size:36px;

}

.sce-solution-card{

    padding:28px;

}

}

@media(max-width:767px){

.sce-solutions-section{

    padding:60px 0;

}

.sce-solutions-title{

    font-size:30px;

}

.sce-solution-card{

    text-align:center;

    padding:25px;

}

.sce-solution-card .row{

    flex-direction:column;

}

.sce-solution-icon{

    margin:0 auto 25px;

}

.sce-solution-card ul{

    text-align:left;

}

.sce-solution-card h4{

    font-size:22px;

}

.sce-solution-card ul li{

    font-size:16px;

}

}



/*=========================================
PROJECT HERO
=========================================*/

.project-hero-section{

    position:relative;

    overflow:hidden;

    min-height:560px;

    display:flex;

    align-items:center;

    padding:170px 0 120px;

    background-image:
    linear-gradient(
        90deg,
        rgba(8,16,24,.95) 0%,
        rgba(8,16,24,.92) 22%,
        rgba(8,16,24,.82) 40%,
        rgba(8,16,24,.55) 58%,
        rgba(8,16,24,.15) 78%,
        rgba(8,16,24,.02) 100%
    ),
    url("../images/sri-chakra-electricals-projects-banner.jpg");

    background-size:cover;

    background-position:center center;

    background-repeat:no-repeat;

}

/*======================================
Overlay
======================================*/

.project-overlay{

    position:absolute;

    inset:0;

    background:linear-gradient(
        to bottom,
        rgba(8,16,24,.15),
        rgba(8,16,24,.05)
    );

    z-index:1;

}

.project-hero-section .container{

    position:relative;

    z-index:10;

}

/*======================================
Breadcrumb
======================================*/

.project-breadcrumb{

    display:flex;

    align-items:center;

    gap:12px;

    margin-bottom:30px;

    font-size:15px;

    font-weight:500;

}

.project-breadcrumb a{

    color:#ffffff;

    text-decoration:none;

    transition:.3s;

}

.project-breadcrumb a:hover{

    color:#ff8a00;

}

.project-breadcrumb span{

    color:#ffffff;

}

.project-breadcrumb .active{

    color:#ff8a00;

}

/*======================================
Heading
======================================*/

.project-title{

    font-size:78px;

    font-weight:800;

    line-height:1;

    color:#fff;

    margin-bottom:25px;

    text-transform:uppercase;

}

.project-title span{

    display:block;

    color:#ff8a00;

}

/*======================================
Orange Line
======================================*/

.project-title-line{

    width:90px;

    height:5px;

    border-radius:50px;

    background:#ff8a00;

    margin-bottom:30px;

}

/*======================================
Paragraph
======================================*/

.project-hero-content p{

    color:rgba(255,255,255,.88);

    font-size:18px;

    line-height:1.9;

    max-width:520px;

    margin:0;

}

/*======================================
Responsive
======================================*/

@media(max-width:1200px){

.project-title{

    font-size:64px;

}

}

@media(max-width:991px){

.project-hero-section{

    min-height:480px;

    padding:140px 0 90px;

    background-position:72% center;

}

.project-title{

    font-size:52px;

}

.project-hero-content p{

    font-size:17px;

}

}

@media(max-width:767px){

.project-hero-section{

    min-height:420px;

    padding:120px 0 70px;

    background-position:78% center;

}

.project-title{

    font-size:38px;

}

.project-title-line{

    width:70px;

    height:4px;

}

.project-breadcrumb{

    font-size:14px;

}

.project-hero-content p{

    font-size:16px;

    line-height:1.8;

}

}
/*=========================================
PROJECT HERO ANIMATIONS
=========================================*/

.project-hero-content{

    animation:projectFadeUp .9s ease;

}

@keyframes projectFadeUp{

    0%{

        opacity:0;

        transform:translateY(50px);

    }

    100%{

        opacity:1;

        transform:translateY(0);

    }

}

/*=========================================
BACKGROUND EFFECTS
=========================================*/

.project-hero-section::before{

    content:"";

    position:absolute;

    width:700px;

    height:700px;

    border-radius:50%;

    background:radial-gradient(circle,
    rgba(255,138,0,.12),
    transparent 70%);

    right:-250px;

    top:-250px;

    z-index:2;

    pointer-events:none;

}

.project-hero-section::after{

    content:"";

    position:absolute;

    width:500px;

    height:500px;

    border-radius:50%;

    border:1px solid rgba(255,255,255,.08);

    left:-250px;

    bottom:-250px;

    z-index:2;

}

/*=========================================
TEXT EFFECT
=========================================*/

.project-title{

    text-shadow:

        0 5px 15px rgba(0,0,0,.35);

}

.project-hero-content p{

    text-shadow:

        0 2px 8px rgba(0,0,0,.25);

}

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

.project-title-line{

    position:relative;

    overflow:hidden;

}

.project-title-line::before{

    content:"";

    position:absolute;

    left:-100%;

    top:0;

    width:100%;

    height:100%;

    background:#ffffff;

    opacity:.35;

    animation:lineShine 3.5s linear infinite;

}

@keyframes lineShine{

    100%{

        left:120%;

    }

}

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

.main-header{

    position:absolute;

    top:0;

    left:0;

    width:100%;

    z-index:999;

    background:transparent;

    transition:.35s;

}

.main-header.header-fixed{

    position:fixed;

    background:#081018;

    box-shadow:0 12px 30px rgba(0,0,0,.18);

    animation:headerSlide .35s ease;

}

@keyframes headerSlide{

    from{

        opacity:0;

        transform:translateY(-25px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}

/*=========================================
OPTIONAL DARK MASK
=========================================*/

.project-overlay{

    backdrop-filter:blur(1px);

}

/*=========================================
LARGE DESKTOP
=========================================*/

@media(min-width:1400px){

.project-hero-section{

    min-height:620px;

}

.project-title{

    font-size:90px;

}

.project-hero-content p{

    max-width:560px;

}

}

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

@media(max-width:991px){

.project-overlay{

    background:

        linear-gradient(

            90deg,

            rgba(8,16,24,.92),

            rgba(8,16,24,.72)

        );

}

.project-hero-content{

    max-width:550px;

}

}

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

@media(max-width:575px){

.project-hero-section{

    text-align:left;

}

.project-title{

    font-size:34px;

    line-height:1.15;

}

.project-breadcrumb{

    margin-bottom:18px;

}

.project-title-line{

    width:60px;

    margin-bottom:22px;

}

.project-hero-content p{

    font-size:15px;

}

.project-hero-section::before,

.project-hero-section::after{

    display:none;

}

}



/*====================================
PROJECT SHOWCASE
=====================================*/

.project-showcase-section{

    background:#ffffff;

    position:relative;

    overflow:hidden;

    padding:100px 0;

}

.project-showcase-section::before{

    content:"";

    position:absolute;

    width:420px;

    height:420px;

    background:radial-gradient(rgba(255,138,0,.08),transparent 70%);

    top:-150px;

    right:-120px;

    border-radius:50%;

}

.project-showcase-section::after{

    content:"";

    position:absolute;

    width:320px;

    height:320px;

    background:radial-gradient(rgba(8,16,24,.05),transparent 70%);

    left:-120px;

    bottom:-120px;

    border-radius:50%;

}

/*====================================
SECTION TITLE
=====================================*/

.project-subtitle{

    display:inline-block;

    color:var(--primary);

    font-size:15px;

    font-weight:700;

    text-transform:uppercase;

    letter-spacing:1px;

    margin-bottom:15px;

}

.project-main-title{

    font-size:48px;

    font-weight:700;

    color:var(--secondary);

    margin-bottom:18px;

}

.project-title-divider{

    width:70px;

    height:4px;

    background:var(--primary);

    border-radius:50px;

    margin:0 auto 25px;

}

.project-main-text{

    font-size:18px;

    line-height:1.8;

    color:#666;

    max-width:700px;

    margin:auto;

}

/*====================================
VIDEO CARD
=====================================*/

.project-video-card{

    background:#fff;

    border-radius:18px;

    overflow:hidden;

    box-shadow:0 15px 45px rgba(0,0,0,.08);

    transition:.35s;

    height:100%;

    border:1px solid #f1f1f1;

}

.project-video-card:hover{

    transform:translateY(-10px);

    box-shadow:0 20px 60px rgba(0,0,0,.15);

}

.project-video-card iframe{

    width:100%;

    height:100%;

    border:0;

}

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

.project-video-content{

    padding:28px;

    text-align:center;

}

.project-video-content h4{

    font-size:30px;

    font-weight:700;

    color:var(--secondary);

    margin-bottom:15px;

    transition:.3s;

}

.project-video-card:hover h4{

    color:var(--primary);

}

.project-location{

    display:flex;

    justify-content:center;

    align-items:center;

    gap:10px;

    color:#666;

    font-size:18px;

}

.project-location i{

    color:var(--primary);

    font-size:18px;

}

/*====================================
RESPONSIVE
=====================================*/

@media(max-width:991px){

.project-main-title{

    font-size:38px;

}

.project-video-content{

    padding:22px;

}

.project-video-content h4{

    font-size:24px;

}

}

@media(max-width:767px){

.project-showcase-section{

    padding:70px 0;

}

.project-main-title{

    font-size:30px;

}

.project-main-text{

    font-size:16px;

}

.project-video-content h4{

    font-size:22px;

}

.project-location{

    font-size:16px;

}

}


/*====================================
CLIENT HERO SECTION
=====================================*/

.client-hero-section{

    position:relative;

    overflow:hidden;

    min-height:560px;

    display:flex;

    align-items:center;

    padding:170px 0 120px;

    background-image:
    linear-gradient(
        90deg,
        rgba(8,16,24,.96) 0%,
        rgba(8,16,24,.93) 22%,
        rgba(8,16,24,.82) 42%,
        rgba(8,16,24,.55) 58%,
        rgba(8,16,24,.18) 76%,
        rgba(8,16,24,0) 100%
    ),
    url("../images/sri-chakra-electricals-clients-banner.jpg");

    background-size:cover;

    background-position:right center;

    background-repeat:no-repeat;

}

/*====================================
Overlay
=====================================*/

.client-hero-overlay{

    position:absolute;

    inset:0;

    background:linear-gradient(
        to bottom,
        rgba(8,16,24,.12),
        rgba(8,16,24,.05)
    );

    z-index:1;

}

.client-hero-section .container{

    position:relative;

    z-index:10;

}

/*====================================
Breadcrumb
=====================================*/

.client-breadcrumb{

    display:flex;

    align-items:center;

    gap:12px;

    margin-top:28px;

    font-size:15px;

    font-weight:500;

}

.client-breadcrumb a{

    color:#fff;

    text-decoration:none;

    transition:.3s;

}

.client-breadcrumb a:hover{

    color:var(--primary);

}

.client-breadcrumb span{

    color:#fff;

}

.client-breadcrumb .active{

    color:var(--primary);

}

/*====================================
Heading
=====================================*/

.client-hero-title{

    font-size:82px;

    font-weight:800;

    line-height:1;

    color:#ffffff;

    margin-bottom:22px;

    text-transform:uppercase;

}

.client-hero-title span{

    display:block;

    color:var(--primary);

}

/*====================================
Orange Line
=====================================*/

.client-hero-line{

    width:75px;

    height:4px;

    background:var(--primary);

    border-radius:50px;

    margin-bottom:28px;

}

/*====================================
Description
=====================================*/

.client-hero-content p{

    color:rgba(255,255,255,.88);

    font-size:20px;

    line-height:1.9;

    max-width:500px;

    margin:0;

}

/*====================================
Animation
=====================================*/

.client-hero-content{

    animation:clientFade .8s ease;

}

@keyframes clientFade{

    from{

        opacity:0;

        transform:translateY(40px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}

/*====================================
Responsive
=====================================*/

@media(max-width:1200px){

.client-hero-title{

    font-size:68px;

}

}

@media(max-width:991px){

.client-hero-section{

    min-height:480px;

    padding:140px 0 90px;

    background-position:72% center;

}

.client-hero-title{

    font-size:54px;

}

.client-hero-content p{

    font-size:17px;

}

}

@media(max-width:767px){

.client-hero-section{

    min-height:420px;

    padding:120px 0 70px;

    background-position:80% center;
    padding-top: var(--header-height);

}

.client-hero-title{

    font-size:40px;

    line-height:1.1;

}

.client-hero-line{

    width:60px;
    margin-left: auto; margin-right: auto;

}

.client-breadcrumb{

    font-size:14px;
    justify-content: center;

}

.client-hero-content p{

    font-size:16px;

    line-height:1.8;

}

}


/*====================================
CLIENTS SECTION
=====================================*/

.sce-clients-section{

    position:relative;

    padding:100px 0;

    background:#ffffff;

    overflow:hidden;

}

.sce-clients-section::before{

    content:"";

    position:absolute;

    width:450px;

    height:450px;

    top:-180px;

    right:-180px;

    border-radius:50%;

    background:radial-gradient(rgba(255,138,0,.08),transparent 70%);

}

.sce-clients-section::after{

    content:"";

    position:absolute;

    width:380px;

    height:380px;

    left:-180px;

    bottom:-180px;

    border-radius:50%;

    background:radial-gradient(rgba(8,16,24,.05),transparent 70%);

}

/*====================================
SECTION HEADING
=====================================*/

.sce-clients-subtitle{

    display:inline-block;

    color:var(--primary);

    font-size:15px;

    font-weight:700;

    letter-spacing:1px;

    text-transform:uppercase;

    margin-bottom:15px;

}

.sce-clients-title{

    font-size:48px;

    font-weight:800;

    color:var(--secondary);

    margin-bottom:18px;

}

.sce-clients-line{

    width:70px;

    height:4px;

    background:var(--primary);

    border-radius:50px;

    margin:0 auto 25px;

}

.sce-clients-text{

    max-width:760px;

    margin:auto;

    color:#666;

    font-size:18px;

    line-height:1.9;

}

/*====================================
CLIENT CARD
=====================================*/

.sce-client-card{

    position:relative;

    background:#ffffff;

    border-radius:18px;

    height:180px;

    display:flex;

    align-items:center;

    justify-content:center;

    padding:30px;

    overflow:hidden;

    border:1px solid #ececec;

    box-shadow:0 10px 35px rgba(0,0,0,.08);

    transition:.35s;

}

.sce-client-card:hover{

    transform:translateY(-8px);

    border-color:rgba(255,138,0,.35);

    box-shadow:0 20px 50px rgba(0,0,0,.15);

}

.sce-client-card::before{

    content:"";

    position:absolute;

    inset:0;

    background:linear-gradient(135deg,
    rgba(255,138,0,.05),
    transparent 50%);

    opacity:0;

    transition:.35s;

}

.sce-client-card:hover::before{

    opacity:1;

}

/*====================================
NUMBER BADGE
=====================================*/

.sce-client-number{

    position:absolute;

    top:0;

    left:0;

    width:42px;

    height:42px;

    background:var(--primary);

    color:#fff;

    font-size:15px;

    font-weight:700;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:18px 0 12px 0;

    z-index:2;

}

/*====================================
LOGO
=====================================*/

.sce-client-card img{

    max-width:180px;

    max-height:80px;

    width:auto;

    height:auto;

    object-fit:contain;

    transition:.35s;

    position:relative;

    z-index:1;

}

.sce-client-card:hover img{

    transform:scale(1.08);

}

/*====================================
RESPONSIVE
=====================================*/
@media (min-width:1200px){

    .col-xl-2-4{

        flex:0 0 20%;

        max-width:20%;

    }

}

@media (max-width:1199px){

.sce-client-card{

    height:170px;

}

}

@media (max-width:991px){

.sce-clients-section{

    padding:80px 0;

}

.sce-clients-title{

    font-size:38px;

}

.sce-clients-text{

    font-size:17px;

}

.sce-client-card{

    height:160px;

}

}

@media (max-width:767px){

.sce-clients-title{

    font-size:30px;

}

.sce-clients-text{

    font-size:16px;

}

.sce-client-card{

    height:145px;

    padding:20px;

}

.sce-client-card img{

    max-width:140px;

    max-height:60px;

}

.sce-client-number{

    width:36px;

    height:36px;

    font-size:13px;

}

}


/*====================================
CONTACT HERO START
=====================================*/

.sce-contact-hero{

    position:relative;

    overflow:hidden;

    background:url('../images/sri-chakra-electricals-contact-banner.jpg') center center/cover no-repeat;

    min-height:520px;

    display:flex;

    align-items:center;

    justify-content:center;

    padding:120px 0 140px;
    padding-top: var(--header-height);

}

.sce-contact-overlay{

    position:absolute;

    inset:0;

    background:linear-gradient(
        90deg,
        rgba(8,16,24,.94) 0%,
        rgba(8,16,24,.88) 40%,
        rgba(8,16,24,.78) 100%
    );

}

/*====================================
BREADCRUMB
=====================================*/

.sce-contact-breadcrumb{

    display:flex;

    align-items:center;

    gap:12px;

    margin-bottom:70px;

    font-size:15px;

    position:relative;

    z-index:2;

}

.sce-contact-breadcrumb a{

    color:#ffffff;

    text-decoration:none;

    transition:.3s;

}

.sce-contact-breadcrumb a:hover{

    color:var(--primary);

}

.sce-contact-breadcrumb span{

    color:#ffffff;

}

.sce-contact-breadcrumb .active{

    color:var(--primary);

    font-weight:600;

}

/*====================================
SUB TITLE
=====================================*/

.sce-contact-subtitle{

    display:inline-flex;

    align-items:center;

    gap:15px;

    color:var(--primary);

    font-size:17px;

    font-weight:700;

    letter-spacing:2px;

    text-transform:uppercase;

    margin-bottom:25px;

}

.sce-contact-subtitle::before,

.sce-contact-subtitle::after{

    content:"";

    width:70px;

    height:2px;

    background:var(--primary);

}

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

.sce-contact-title{

    color:#ffffff;

    font-size:62px;

    font-weight:800;

    line-height:1.2;

    margin-bottom:25px;

}

.sce-contact-title span{

    color:var(--primary);

}

/*====================================
TEXT
=====================================*/

.sce-contact-text{

    color:rgba(255,255,255,.88);

    font-size:20px;

    line-height:1.9;

    max-width:760px;

    /* margin:0 auto; */

}

/*====================================
DIVIDER
=====================================*/

.sce-contact-divider{

    width:70px;

    height:4px;

    border-radius:50px;

    background:var(--primary);

    /* margin:35px auto 0; */
    margin:35px 0;

}

/*====================================
BOTTOM CURVE
=====================================*/

.sce-contact-wave{

    position:absolute;

    left:0;

    bottom:-2px;

    width:100%;

    height:95px;

    display:block;

    z-index:2;

}

/*====================================
RESPONSIVE
=====================================*/

@media(max-width:991px){

.sce-contact-hero{

    min-height:460px;

    /* padding:100px 0 120px; */

}

.sce-contact-breadcrumb{

    margin-bottom:50px;
    justify-content: center;

}
.sce-contact-wave{display: none;}

.sce-contact-title{

    font-size:46px;

}

.sce-contact-text{

    font-size:18px;

}

.sce-contact-subtitle::before,

.sce-contact-subtitle::after{

    width:45px;

}
.sce-contact-divider{margin-left: auto; margin-right: auto;}
}

@media(max-width:767px){

.sce-contact-hero{

    min-height:420px;

    /* padding:90px 0 100px; */

}

.sce-contact-breadcrumb{

    justify-content:center;

    margin-bottom:35px;

    font-size:14px;

}

.sce-contact-title{

    font-size:34px;

}

.sce-contact-subtitle{

    font-size:14px;

    gap:10px;

}

.sce-contact-subtitle::before,

.sce-contact-subtitle::after{

    width:30px;

}

.sce-contact-text{

    font-size:16px;

    line-height:1.8;

}

.sce-contact-wave{

    height:60px;

}

}


/*====================================
CONTACT SECTION START
=====================================*/

.sce-contact-section{

    position: relative;

    background: #f8fafc;

    padding: 100px 0;

    overflow: hidden;

}

.sce-contact-section::before{

    content: "";

    position: absolute;

    width: 350px;

    height: 350px;

    top: -180px;

    right: -180px;

    border-radius: 50%;

    background: rgba(255,138,0,.05);

}

.sce-contact-section::after{

    content: "";

    position: absolute;

    width: 280px;

    height: 280px;

    left: -150px;

    bottom: -150px;

    border-radius: 50%;

    background: rgba(8,16,24,.04);

}

/*====================================
CONTACT CARD
=====================================*/

.sce-contact-card{

    background: var(--secondary);

    color: #fff;

    border-radius: 20px;

    padding: 40px 30px;

    text-align: center;

    height: 100%;

    position: relative;

    overflow: hidden;

    transition: .35s;

    box-shadow: 0 15px 40px rgba(0,0,0,.12);

}

.sce-contact-card:hover{

    transform: translateY(-8px);

}

.sce-contact-card::before{

    content:"";

    position:absolute;

    width:120px;

    height:120px;

    right:-50px;

    bottom:-50px;

    border-radius:50%;

    background:rgba(255,138,0,.08);

}

.sce-contact-icon{

    width:80px;

    height:80px;

    border:2px solid var(--primary);

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    margin:0 auto 25px;

    font-size:30px;

    color:var(--primary);

}

.sce-contact-card h4{

    color:#fff;

    font-size:28px;

    font-weight:700;

    margin-bottom:20px;

}

.sce-contact-card p{

    color:#d8d8d8;

    margin:0;

    line-height:2;

    font-size:17px;

}

.sce-contact-card a{

    display:block;

    color:#fff;

    text-decoration:none;

    margin:10px 0;

    transition:.3s;

    font-size:18px;

}

.sce-contact-card a:hover{

    color:var(--primary);

}

/*====================================
FORM BOX
=====================================*/

.sce-contact-form-box{

    background:#fff;

    border-radius:22px;

    padding:45px;

    box-shadow:0 20px 50px rgba(0,0,0,.08);

}

.sce-form-subtitle{

    color:var(--primary);

    font-weight:700;

    letter-spacing:1px;

    text-transform:uppercase;

    display:block;

    margin-bottom:12px;

}

.sce-form-title{

    color:var(--secondary);

    font-size:42px;

    font-weight:800;

    margin-bottom:35px;

}

.sce-contact-form-box .form-control{

    height:58px;

    border-radius:12px;

    border:1px solid #e4e4e4;

    box-shadow:none;

    padding:15px 20px;

    transition:.3s;

}

.sce-contact-form-box textarea.form-control{

    height:170px;

    resize:none;

}

.sce-contact-form-box .form-control:focus{

    border-color:var(--primary);

}

/*====================================
BUTTON
=====================================*/

.sce-btn-contact{

    background:var(--primary);

    color:#fff;

    padding:14px 36px;

    border-radius:10px;

    font-weight:600;

    transition:.35s;

}

.sce-btn-contact:hover{

    background:var(--secondary);

    color:#fff;

}

/*====================================
HELP BOX
=====================================*/

.sce-help-box{

    background:#fff;

    border-radius:22px;

    padding:45px;

    height:100%;

    box-shadow:0 20px 50px rgba(0,0,0,.08);

}

.sce-help-icon{

    width:90px;

    height:90px;

    background:rgba(255,138,0,.12);

    color:var(--primary);

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:38px;

    margin-bottom:30px;

}

.sce-help-box h3{

    color:var(--secondary);

    font-size:34px;

    font-weight:700;

    margin-bottom:20px;

}

.sce-help-box p{

    color:#666;

    line-height:1.9;

    margin-bottom:30px;

}

.sce-help-box ul{

    margin:0;

    padding:0;

    list-style:none;

}

.sce-help-box ul li{

    margin-bottom:18px;

    color:var(--secondary);

    font-weight:500;

}

.sce-help-box ul li i{

    color:var(--primary);

    margin-right:10px;

}

/*====================================
RESPONSIVE
=====================================*/

@media(max-width:991px){

.sce-contact-section{

    padding:80px 0;

}

.sce-contact-form-box,

.sce-help-box{

    padding:35px;

}

.sce-form-title{

    font-size:34px;

}

.sce-help-box{

    margin-top:30px;

}

}

@media(max-width:767px){

.sce-contact-card{

    padding:35px 25px;

}

.sce-contact-icon{

    width:70px;

    height:70px;

    font-size:26px;

}

.sce-contact-card h4{

    font-size:24px;

}

.sce-contact-form-box,

.sce-help-box{

    padding:25px;

}

.sce-form-title{

    font-size:28px;

}

.sce-help-box h3{

    font-size:28px;

}

.sce-btn-contact{

    width:100%;

}

}

/*====================================
GOOGLE MAP SECTION START
=====================================*/

.sce-map-section{

    position: relative;

    padding: 100px 0;

    background: #ffffff;

    overflow: hidden;

}

.sce-map-section::before{

    content: "";

    position: absolute;

    width: 320px;

    height: 320px;

    top: -180px;

    right: -150px;

    border-radius: 50%;

    background: rgba(255,138,0,.05);

}

.sce-map-section::after{

    content: "";

    position: absolute;

    width: 250px;

    height: 250px;

    left: -120px;

    bottom: -120px;

    border-radius: 50%;

    background: rgba(8,16,24,.04);

}

/*====================================
SECTION TITLE
=====================================*/

.sce-map-subtitle{

    display:inline-block;

    color:var(--primary);

    font-size:16px;

    font-weight:700;

    text-transform:uppercase;

    letter-spacing:1px;

    margin-bottom:15px;

}

.sce-map-title{

    font-size:46px;

    font-weight:800;

    color:var(--secondary);

    margin-bottom:20px;

}

.sce-map-text{

    max-width:720px;

    margin:auto;

    color:#666;

    font-size:18px;

    line-height:1.9;

}

/*====================================
MAP WRAPPER
=====================================*/

.sce-map-wrapper{

    position:relative;

    border-radius:22px;

    overflow:hidden;

    background:#fff;

    border:8px solid #fff;

    box-shadow:0 20px 60px rgba(0,0,0,.12);

    transition:.35s;

}

.sce-map-wrapper:hover{

    transform:translateY(-6px);

    box-shadow:0 28px 70px rgba(0,0,0,.18);

}

.sce-map-wrapper::before{

    content:"";

    position:absolute;

    top:0;

    left:0;

    width:100%;

    height:6px;

    background:linear-gradient(90deg,var(--primary),#ffb347);

    z-index:2;

}

/*====================================
GOOGLE MAP
=====================================*/

.sce-map-wrapper iframe{

    width:100%;

    height:550px;

    border:0;

    display:block;

}

/*====================================
RESPONSIVE
=====================================*/

@media(max-width:991px){

    .sce-map-section{

        padding:80px 0;

    }

    .sce-map-title{

        font-size:38px;

    }

    .sce-map-wrapper iframe{

        height:450px;

    }

}

@media(max-width:767px){

    .sce-map-section{

        padding:70px 0;

    }

    .sce-map-title{

        font-size:30px;

    }

    .sce-map-text{

        font-size:16px;

    }

    .sce-map-wrapper{

        border-radius:15px;

        border-width:5px;

    }

    .sce-map-wrapper iframe{

        height:350px;

    }

}
@media(max-width:992px)
{
.banner-subtitle{display: flex; justify-content: center;}
.services-overlay{background: linear-gradient( 90deg, rgba(5,14,28,.96) 0%, rgba(5,14,28,.92) 35%, rgba(5,14,28,.5) 65%, rgba(5,14,28,.5) 100% );}
.sce-about-image{margin-top: 20px;}
}

@media(max-width:576px)
{
    .banner-content h1 {
  font-size: 38px;}
  .banner-content h3{font-size: 18px;}
  .project-video-card{margin-bottom: 20px; height: auto;}
  
}