/* ===== CARD ===== */
.services-card {
  max-width: 420px;
  padding: 24px;
  border-radius: 26px;
  background: linear-gradient(
    135deg,
    rgba(255,255,255,0.08),
    rgba(255,255,255,0.02)
  );
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border: 1px solid rgba(255,255,255,0.08);
}

/* ===== LIST ===== */
.services-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.services-list li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 18px 6px;
  font-size: 18px;
  font-weight: 500;
  color: #ffffff;
  border-bottom: 1px solid rgba(255,255,255,0.12);
  transition: all 0.3s ease;
}

.services-list li:last-child {
  border-bottom: none;
}

.services-list li:hover {
  transform: translateX(6px);
}

/* ARrow */
.services-list .arrow {
  width: 30px;
  height: 30px;
  background: #9EFF00;      /* 🔵 CHANGE BLUE HERE */
  border-radius: 6px;

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

  transition: all 0.3s ease;
  position: relative;
}

/* Arrow shape */
.services-list .arrow::before {
  content: "➜";            /* TEXT ARROW, NOT EMOJI */
  color: #000000;          /* arrow color */
  font-size: 16px;
  transform: rotate(-45deg);
}


.services-list li:hover .arrow {
  background: #a855f7;     
  transform: rotate(45deg);
}
/* ===== SERVICES HEADING ===== */
.services-list li.services-heading {
  justify-content: center !important;
  font-size: 26px;
  font-weight: 600;
  letter-spacing: 0.7px;
  color: #ffffff;

  border-bottom: 1px solid rgba(255,255,255,0.2);
  cursor: default;
}

/* Remove hover movement */
.services-heading:hover {
  transform: none;
}

/* Remove arrow spacing if any */
.services-heading .arrow {
  display: none;
}
/* Make link full width */
.services-list li a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  text-decoration: none;
  color: inherit;
  padding: 18px 6px;
}

/* Remove double padding */
.services-list li {
  padding: 0;
}

/* Hover animation stays same */
.services-list li:hover {
  transform: translateX(6px);
}








    .process-wrapper {
  position: relative;
  max-width: 1200px;
  margin: auto;
  padding: 40px 20px;
}

/* Vertical line (desktop) */
.process-line { position: absolute; left: 37px; top: 0; bottom: 0; width: 1.6px; background: linear-gradient(#ff3d81, transparent); }

/* Process item */
.process-item {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 32px;
  margin-bottom: 40px;
}

/* Icon */
.process-icon {
  width: 40px;
  height: 40px;
  background: #9EFF00;
  color: #000;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 18px;
  flex-shrink: 0;
  z-index: 2;
}

/* Card */
.process-card {
  background: rgba(255, 255, 255, 0.06);
  backdrop-filter: blur(14px);
  border: 1px solid #7A3D8F;
  padding: 18px;
  border-radius: 18px;
  max-width: 460px;
  color: #fff;
}

.process-card .step {
  font-size: 12px;
  color: #ff3d81;
  letter-spacing: 1px;
}

.process-card h3 {
  margin: 8px 0;
  font-size: 20px;
}

.process-card p {
  font-size: 14px;
  line-height: 1.6;
  color: #ccc;
}

/* ========================= */
/* 📱 MOBILE (≤ 768px) */
/* ========================= */
@media (max-width: 768px) {

  .process-wrapper {
    padding: 30px 16px;
  }

  /* Remove vertical line */
  .process-line {
    display: none;
  }

  .process-item {
    flex-direction: column;
    gap: 14px;
    margin-bottom: 30px;
    text-align: center;
  }

  .process-icon {
    margin-left: 6px;
     margin-right: auto;
  }

  .process-card {
    max-width: 100%;
    padding: 16px;
     text-align: center;
  }

  .process-card h3 {
    font-size: 18px;
  }

  .process-card p {
    font-size: 15px;
  }
}

/* ========================= */
/* 📱 SMALL MOBILE (≤ 480px) */
/* ========================= */
@media (max-width: 480px) {

  .process-icon {
    width: 36px;
    height: 36px;
    font-size: 16px;
  }

  .process-card {
    border-radius: 14px;
  }

  .process-card h3 {
    font-size: 20px;
  }
}










.main-con {
 background:#02010100;
 font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
 padding: 40px 20px;
 min-height: 100vh;
 }

 .container {
     
 /*max-width: 1400px;*/
 /*margin: 0 auto;*/
 /*display: grid;*/
 /*grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));*/
 /*gap: 30px;*/
  max-width: 1400px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr); /* Force 3 cards per row */
  gap: 30px;

 }

 .card {
 background: rgba(30, 30, 30, 0.4);
 backdrop-filter: blur(20px);
 -webkit-backdrop-filter: blur(20px);
 border-radius: 20px;
 padding: 40px 20px;
 position: relative;
 overflow: hidden;
 transition: transform 0.3s ease, box-shadow 0.3s ease;
 border: 1px solid rgba(255, 255, 255, 0.1);
 }

 .card::before {
 content: '';
 position: absolute;
 top: -50%;
 right: -50%;
 width: 200%;
 height: 200%;
 background: radial-gradient(circle, rgba(255, 255, 255, 0.03) 0%, transparent 70%);
 pointer-events: none;
 }

 .card:hover {
 transform: translateY(-5px);
 box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
   border-color: #A855F7;
 }

 /* Gradient overlays for each card */
 .card:nth-child(1)::after,
 .card:nth-child(2)::after,
 .card:nth-child(3)::after,
 .card:nth-child(4)::after,
 .card:nth-child(5)::after,
 .card:nth-child(6)::after {
 content: '';
 position: absolute;
 top: 0;
 right: 0;
 width: 250px;
 height: 250px;
 border-radius: 50%;
 filter: blur(80px);
 opacity: 0.4;
 pointer-events: none;
 }

 .card:nth-child(1)::after {
 background: radial-gradient(circle, #d946ef 0%, transparent 70%);
 }

 .card:nth-child(2)::after {
 background: radial-gradient(circle, #f97316 0%, transparent 70%);
 }

 .card:nth-child(3)::after {
 background: radial-gradient(circle, #8b5cf6 0%, transparent 70%);
 }

 .card:nth-child(4)::after {
 background: radial-gradient(circle, #06b6d4 0%, transparent 70%);
 }

 .card:nth-child(5)::after {
 background: radial-gradient(circle, #f59e0b 0%, transparent 70%);
 }

 .card:nth-child(6)::after {
 background: radial-gradient(circle, #a855f7 0%, transparent 70%);
 }

 .icon-wrapper {
 width: 60px;
  height: 60px;
  background: rgba(255, 255, 255, 0.05);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 25px;
  border: 1px solid #8B4A9E;
  position: relative;
  z-index: 1;
  overflow: hidden;
 }

 .icon-wrapper img {
  width: 60%;
  height: 100%;
  object-fit: contain;
  display: block;
   filter: brightness(0) saturate(100%) invert(72%) sepia(95%)
          saturate(600%) hue-rotate(40deg) brightness(105%) contrast(105%);
}
  transition: transform 0.3s ease, filter 0.3s ease;
}


 .card-content {
 position: relative;
 z-index: 1;
 }

 .card h3 {
 color: #ffffff;
 font-size: 22px;
 font-weight: 600;
 margin-bottom: 15px;
 line-height: 1.3;
 }

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

 @media (max-width: 768px) {
 .container {
 grid-template-columns: 1fr;
 }
 }
 .card h3 a {
  color: #ffffff;
  
}

.card h3 a:hover {
  color: #A855F7;
  text-decoration: none;
}
/* ===== Center content only on tablet & mobile ===== */
@media (max-width: 768px) {

  .card-content {
    text-align: center;
  }

  .icon-wrapper {
    margin-left: auto;
    margin-right: auto;
  }

}




/*Process  css*/

/* Main wrapper */
.process-wrapper{
  position: relative;
  max-width: 1200px;
  margin: auto;
  padding: 40px 20px;
}

/* Vertical line */
.process-wrapper .process-line{
  position: absolute;
  left: 37px;
  top: 0;
  bottom: 0;
  width: 1.6px;
  background: linear-gradient(#ff3d81, transparent);
}

/* Process item */
.process-wrapper .process-item{
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 32px;
  margin-bottom: 40px;
}

/* Icon */
.process-wrapper .process-icon{
  width: 40px;
  height: 40px;
  background: #9EFF00;
  color: #000;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 18px;
  flex-shrink: 0;
  z-index: 2;
}

/* Card */
.process-wrapper .process-card{
  background: rgba(255,255,255,0.06);
  backdrop-filter: blur(14px);
  border: 1px solid #7A3D8F;
  padding: 18px;
  border-radius: 18px;
  max-width: 460px;
  color: #fff;
}

.process-wrapper .process-card .step{
  font-size: 12px;
  color: #ff3d81;
  letter-spacing: 1px;
}

.process-wrapper .process-card h3{
  margin: 8px 0;
  font-size: 20px;
}

.process-wrapper .process-card p{
  font-size: 14px;
  line-height: 1.6;
  color: #ccc;
}

/* Mobile */
@media(max-width:768px){

  .process-wrapper{
    padding:30px 16px;
  }

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

  .process-wrapper .process-item{
    flex-direction:column;
    gap:14px;
    margin-bottom:30px;
    text-align:center;
  }

  .process-wrapper .process-icon{
    margin-left:6px;
    margin-right:auto;
  }

  .process-wrapper .process-card{
    max-width:100%;
    padding:16px;
    text-align:center;
  }

  .process-wrapper .process-card h3{
    font-size:18px;
  }

  .process-wrapper .process-card p{
    font-size:15px;
  }
}

/* Small mobile */
@media(max-width:480px){

  .process-wrapper .process-icon{
    width:36px;
    height:36px;
    font-size:16px;
  }

  .process-wrapper .process-card{
    border-radius:14px;
  }

  .process-wrapper .process-card h3{
    font-size:20px;
  }
}


/*cards  service name */
/* Main Wrapper */
.industry-grid-wrapper{
  max-width:1400px;
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:30px;
}

/* Card */
.industry-grid-wrapper .card{
  background:rgba(30,30,30,.4);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  border-radius:20px;
  padding:40px 20px;
  position:relative;
  overflow:hidden;
  transition:transform .3s ease, box-shadow .3s ease;
  border:1px solid rgba(255,255,255,.1);
}

.industry-grid-wrapper .card::before{
  content:'';
  position:absolute;
  top:-50%;
  right:-50%;
  width:200%;
  height:200%;
  background:radial-gradient(circle,rgba(255,255,255,.03)0%,transparent 70%);
  pointer-events:none;
}

.industry-grid-wrapper .card:hover{
  transform:translateY(-5px);
  box-shadow:0 20px 40px rgba(0,0,0,.3);
  border-color:#A855F7;
}

/* Gradient */
.industry-grid-wrapper .card:nth-child(1)::after,
.industry-grid-wrapper .card:nth-child(2)::after,
.industry-grid-wrapper .card:nth-child(3)::after,
.industry-grid-wrapper .card:nth-child(4)::after,
.industry-grid-wrapper .card:nth-child(5)::after,
.industry-grid-wrapper .card:nth-child(6)::after{
  content:'';
  position:absolute;
  top:0;
  right:0;
  width:250px;
  height:250px;
  border-radius:50%;
  filter:blur(80px);
  opacity:.4;
  pointer-events:none;
}

/* Icon */
.industry-grid-wrapper .icon-wrapper{
  width:60px;
  height:60px;
  background:rgba(255,255,255,.05);
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:25px;
  border:1px solid #8B4A9E;
  position:relative;
  z-index:1;
  overflow:hidden;
}

.industry-grid-wrapper .icon-wrapper img{
  width:60%;
  height:100%;
  object-fit:contain;
  display:block;
  filter:brightness(0) saturate(100%) invert(72%) sepia(95%)
  saturate(600%) hue-rotate(40deg) brightness(105%) contrast(105%);
}

/* Content */
.industry-grid-wrapper .card-content{
  position:relative;
  z-index:1;
}

.industry-grid-wrapper .card h3{
  color:#fff;
  font-size:22px;
  font-weight:600;
  margin-bottom:15px;
  line-height:1.3;
}

.industry-grid-wrapper .card p{
  color:#a8a9c0;
  font-size:15px;
  line-height:1.6;
}

.industry-grid-wrapper .card h3 a{
  color:#fff;
}

.industry-grid-wrapper .card h3 a:hover{
  color:#A855F7;
  text-decoration:none;
}

/* Tablet & Mobile */
@media(max-width:768px){

  .industry-grid-wrapper{
    grid-template-columns:1fr;
  }

  .industry-grid-wrapper .card-content{
    text-align:center;
  }

  .industry-grid-wrapper .icon-wrapper{
    margin-left:auto;
    margin-right:auto;
  }
}