.ev-process{
  padding:90px 40px;
  background:#f5faf7; /* white se alag soft green */
  text-align:center;
  overflow:hidden;
}

/* ===== HEADING ===== */
.ev-heading{
  margin-bottom:70px;
}

.ev-heading .line1{
  font-size:20px;
  letter-spacing:3px;
  text-transform:uppercase;
  color:#6b7d73;
  margin-bottom:8px;
}

.ev-heading .line2{
  font-size:40px;
  font-weight:800;
  color:#1fbf4a;
}

/* ===== FLOW ===== */
.process-wrapper{
  display:flex;
  justify-content:space-between;
  gap:30px;
  position:relative;
}

.process-wrapper::before{
  content:'';
  position:absolute;
  top:45px;
  left:4%;
  right:4%;
  height:2px;
  background:repeating-linear-gradient(
    to right,
    #cdeed9 0,
    #cdeed9 6px,
    transparent 6px,
    transparent 12px
  );
  animation: dash 6s linear infinite;
}

@keyframes dash{
  from{background-position:0;}
  to{background-position:120px;}
}

.process-step{
  width:16%;
  z-index:2;
  transition:.4s ease;
}

.process-step:hover{
  transform:translateY(-10px);
}

/* ===== ICON ===== */
.icon{
  width:84px;
  height:84px;
  background:white;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  margin:0 auto 18px;
  animation:pulse 2s infinite;
}

.icon img{
  width:54px;
  height:54px;
}
.process-step:hover .icon{
  background:#1fbf4a;
  color:#fff;    /* hover pe white icon */
}

@keyframes pulse{
  0%{box-shadow:0 0 0 0 rgba(31,191,74,.4);}
  70%{box-shadow:0 0 0 15px rgba(31,191,74,0);}
  100%{box-shadow:0 0 0 0 rgba(31,191,74,0);}
}

.process-step h4{
  font-size:18px;
  margin-bottom:10px;
}

.process-step p{
  font-size:14px;
  color:#555;
}

/* ===== CTA ===== */
.cta{
  margin-top:70px;
}

.cta a{
  background:#1fbf4a;
  color:#fff;
  padding:15px 40px;
  border-radius:40px;
  font-weight:600;
  text-decoration:none;
  transition:.3s;
}

.cta a:hover{
  background:#159b39;
}

/* ===== MOBILE ===== */
@media(max-width:768px){
  .ev-process{
    padding:60px 20px;
    text-align:left;
  }

  .process-wrapper{
    flex-direction:column;
    gap:45px;
  }

  .process-wrapper::before{
    display:none;
  }

  .process-step{
    width:100%;
    display:flex;
    gap:15px;
  }
 
  
  .ev-heading .line2{
  font-size:20px;
  font-weight:800;
  color:#1fbf4a;
}
}













 





/* EV Charging Devices Section */
.ev-charging-devices {
    padding: 90px 0;
    background: #f6f6f6;
}

.ev-title h2 {
    font-size: 42px;
    font-weight: 700;
    margin-bottom: 15px;
    color: #000;
}

.ev-title p {
    max-width: 820px;
    margin: 0 auto 60px;
    font-size: 16px;
    color: #666;
    line-height: 1.7;
}

/* Cards */
.ev-device-card {
    background: #ffffff;
    border-radius: 22px;
    padding: 40px 35px;
    min-height: 210px;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.05);
    transition: all 0.35s ease;
}

.ev-device-card h4 {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 12px;
}

.ev-device-card p {
    font-size: 15px;
    color: #555;
    line-height: 1.6;
}

.ev-device-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.12);
}

/* Owl fixes */
.ev-devices-slider .owl-stage {
    display: flex;
}

.ev-devices-slider .owl-item {
    display: flex;
    justify-content: center;
}

/* Dots (same style) */
.ev-devices-slider .owl-dots {
    margin-top: 35px;
}

.ev-devices-slider .owl-dot span {
    width: 18px;
    height: 6px;
    border-radius: 10px;
    background: #cfd3ff;
}

.ev-devices-slider .owl-dot.active span {
    background: #4b50ff;
}

/* Hide arrows */
.ev-devices-slider .owl-nav {
    display: none;
}

/* Mobile */
@media (max-width: 768px) {
    .ev-title h2 {
        font-size: 30px;
    }

    .ev-device-card {
        padding: 30px 25px;
    }
}


.block {
    padding: 70px 0;
}

.section-title {
    font-size: 36px;
    font-weight: 700;
    line-height: 1.3;
}

.subTitle.setWidth {
    max-width: 120px;
    margin: 10px auto 0;
}

/* image fix */
.block img {
    max-width: 100%;
    height: auto;
    display: block;
    text-align: center;
}
 .section-title {
    max-width: 100%;
    margin: 0 auto;
    word-break: normal;
}
.section-title {
    font-weight: 700;
    text-align: center;
}

/* MOBILE FIX */
@media (max-width: 767px) {

    .section-title {
        font-size: 22px !important;
        line-height: 1.3;
        max-width: 260px;     /* 🔥 2-line lock */
        margin: 0 auto 8px;
    }

    .subTitle.setWidth {
        margin-bottom: 18px;
    }

    .block {
        padding-top: 35px;
        padding-bottom: 35px;
    }

    .block img {
        max-width: 100%;
        height: auto;
        margin-top: 10px;
    }
}





        
    /* Carousel image height fix for mobile */
@media (max-width: 576px) {
    #myCarousel .item img {
        height: 300px;       /* Apni marzi se badha sakte ho: 300px, 350px etc. */
        object-fit: cover;   /* Image crop nahi hogi, proper fill hogi */
        width: 100%;
    }

    /* Top spacing so banner neeche aaye */
    #myCarousel {
        margin-top: 50px;
    }

    /* Caption center and better for mobile */
    .carousel-caption {
        bottom: 20px;
        padding: 40px;
    }
}
  
  
  
  .ev-about-section {
    padding: 70px;
    background-color:#fafcfb;
}

.ev-about-image {
    position: relative;
}

.ev-about-image .main-img {
    width: 100%;
    border-radius: 22px;
    object-fit: cover;
}

/* Green Stats Box */
.ev-stats-box {
    position: absolute;
    bottom: -30px;
    left: 30px;
    background: #4CD964;
    color: #fff;
    padding: 25px 35px;
    border-radius: 20px;
    text-align: center;
    box-shadow: 0 5px 25px rgba(0,0,0,0.15);
}

.ev-stats-box h2 {
    margin: 0;
    font-size: 42px;
    font-weight: 700;
}

.ev-stats-box p {
    margin: 0;
    font-size: 14px;
}

/* Right Content */
.ev-about-content .small-title {
    font-size: 15px;
    color: #4CD964;
    font-weight: 600;
}

.ev-about-content h2 {
    font-size: 34px;
    font-weight: 700;
    margin: 15px 0;
}

.ev-about-content p {
    color: #444;
    line-height: 1.6;
    margin-bottom: 20px;
}

/* Features */
.ev-features {
    display: flex;
    gap: 30px;
    margin-bottom: 20px;
}

.feature-item {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.feature-item .icon {
    font-size: 35px;
}

/* Button */
.ev-btn {
    padding: 12px 26px;
    background: #000;
    color: #fff;
    border-radius: 50px;
    display: inline-block;
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
}

/* RESPONSIVE */
@media (max-width: 768px) {
    .ev-features {
        flex-direction: column;
        gap: 20px;
    }

    .ev-stats-box {
        position: static;
        margin-top: 20px;
        width: 200px;
    }

    .ev-about-content h2 {
        font-size: 28px;
    }
}

@media (max-width: 576px) {
    .ev-about-section {
        padding: 40px 0;
    }

    .ev-stats-box {
        width: 100%;
    }

    .ev-about-content {
        text-align: left;
    }
}







.we-think {
    padding: 40px 0;
}

.section-title {
    font-size: 42px;
    font-weight: 800;
    margin-bottom: 40px;
}

/* ---- GRID SYSTEM ---- */
.card-row {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

/* ---- CARD STYLE ---- */
.ev-card {
    background: #fff;
    border-radius: 18px;
    box-shadow: 0 10px 20px rgba(0,0,0,0.08);
    overflow: hidden;
    transition: .3s;
}

.ev-card:hover {
    transform: translateY(-6px);
}

/* IMAGE */
.ev-img img {
    width: 100%;
    height: 250px;
    object-fit: cover;
}

/* CONTENT */
.ev-content {
    padding: 22px;
}

.ev-content .tag {
    color: #30c35f;
    font-size: 13px;
    font-weight: 600;
}

.ev-content h3 {
    margin-top: 5px;
    font-size: 22px;
    font-weight: 700;
}

.ev-content p {
    color: #666;
    font-size: 15px;
    margin-top: 8px;
}

/* ---- RESPONSIVE ---- */
@media (max-width: 992px) {
    .card-row {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 600px) {
    .card-row {
        grid-template-columns: 1fr;
    }
}

 
.heading{
text-align:center;
margin-bottom:60px;
}
.heading .tag{
color:var(--green);
font-size:14px;
font-weight:600;
letter-spacing:.5px;
}
.heading h2{
font-size:42px;
margin:10px 0 0;
font-weight:700;
}
.features{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:60px 30px;
}
.feature{
display:flex;
gap:18px;
align-items:flex-start;
 transition: .3s;
}
.icon1{
width:84px;
height:84px;
border-radius:50%;
background:#fff;
box-shadow:0 10px 30px rgba(0,0,0,.08);
display:flex;
align-items:center;
justify-content:center;
flex-shrink:0;
}
.icon1 img{
width:34px;
height:34px;
}
.feature h4{
margin:0 0 6px;
font-size:18px;
font-weight:600;
}
.feature p{
margin:0;
font-size:14px;
color:var(--gray);
line-height:1.6;
}
.hero-image{
margin-top:80px;
text-align:center;
}
.hero-image img{
max-width:100%;
height:auto;
}

.feature:hover {
    transform: translateY(-8px);
}
@media (max-width:991px){
.features{grid-template-columns:repeat(2,1fr)}
.heading h2{font-size:34px}
}


/* MOBILE – ONE BY ONE */
@media (max-width:767px){
.features{grid-template-columns:1fr !important}
.feature{align-items:flex-start}
}
.heading h2{font-size:34px}
}
@media (max-width:575px){
.features{grid-template-columns:1fr}
.heading h2{font-size:28px}
.section{padding:60px 15px}
}

.ev-section .container-fluid{
  padding-left: 60px;
  padding-right: 60px;
}

/* Mobile only */
@media (max-width: 767px){
  .ev-section .container-fluid{
    padding-left: 5px !important;
    padding-right: 5px !important;
  }

  .ev-section .heading{
    margin: 20px 15px !important;
  }
}

/* Mobile only */
@media (max-width: 767px){
  .heading h2{
     font-size:18px;
  }
   
}