/* banner css */

.banner-text {
    font-family: 'Kumbh Sans', sans-serif;
    color: #BD9191;
}

.banner-title {
    font-family: 'Afacad', sans-serif;
}

.medium-screen-title {
    font-family: 'Afacad', sans-serif;
}

.banner-section {
  background: url('./infrastructureimage/infra-banner.png') center/cover no-repeat;
  height: 300px;
  width: 100%;
  position: relative;
  display: flex;
  align-items: center;
  overflow: hidden; /* ensures absolute image doesn't spill out */
  top: 82px;
}

.inner-image {

    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    background: url('./infrastructureimage/inner-img.png') no-repeat;
    width: 100%;
    height: 100%;
    background-size: contain;
    z-index: 0;


}

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

.banner-title,
.banner-text {
  color: #fff;
}



@media (max-width: 768px) {
  .banner-section {
    background: url('./infrastructureimage/lg-banner.png') center/cover no-repeat;
    height: 100px; /* adjust if needed */
  }

 .inner-image {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%); /* perfect centering */
  background: url('./infrastructureimage/lg-inner-img.png') no-repeat center center;
  background-size: contain;
  width: 100%;
  height: 80%;
  display: block;
  z-index: 0;
}
 .banner-content {
    text-align: center;
  }
  .banner-title{
    font-size: 30px;
  }

  .banner-text{
    font-size: 15px;
  }

}



@media (min-width: 2000px) {
  .banner-section {
   background: url('./infrastructureimage/lg-banner.png') center/cover no-repeat;
    height: 400px; /* adjust if needed */
  }

 .inner-image {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%); /* perfect centering */
   background: url('./infrastructureimage/lg-inner-img.png') no-repeat center center;
  background-size: contain;
  width: 100%;
  height: 60%;
  display: block;
  z-index: 0;
}
 .banner-content {
    text-align: center;
  }
  .banner-title{
    font-size: 70px;
  }

  .banner-text{
    font-size: 25px;
  }

}

    .breadcrumb a {
      color: white;
      opacity: 0.8;
      text-decoration: none;
    }
    .breadcrumb a:hover {
      opacity: 1;
      text-decoration: underline;
    }
    .breadcrumb-item.active {
      color: white;
      opacity: 1;
    }

    /* fabric */
    .section-title {
      font-weight: 700;
      font-size: 30px;
      color: #302F2F;
    }
    .description {
      font-size: 0.875rem;
      color: #606060;
      max-width: 900px;
      margin: 0 auto 3rem auto;
    }
    .card {
      border: none;
      box-shadow: 0 4px 15px rgb(0 0 0 / 0.1);
      border-radius: 0px;
    }
    .card-img-top {
   
      max-height: 160px;
      object-fit: cover;
    }
.label {
  position: absolute;
  bottom: 10px;   /* keeps it near bottom */
  left: 50%;      /* center horizontally */
  transform: translateX(-50%);
  background-color: #e92c2c;
  color: white;
  padding: 8px 30px;
  font-weight: 700;
  border-radius: 2px;
  font-size: 1rem;
font-family: 'Afacad', sans-serif;
  white-space: nowrap;
  text-align: center;
  width: 140px;  /* fixed width for uniform size */
}

    .highlight {
      font-weight: 700;
      color: #e92c2c;
    }
    .card-body {
      font-size: 16px;
      color: #606060;
      text-align: justify;
      font-family: 'Afacad', sans-serif;

    }
    .position-relative {
      position: relative;
    }

    /* Make only the top two columns' cards equal height and full height */
.fabric-development .row > .col-md-6 {
  display: flex;
}

.fabric-development .row > .col-md-6 .card {
  display: flex;
  flex-direction: column;
  height: 100%;
}

/* Let card body grow to fill height */
.fabric-development .row > .col-md-6 .card-body {
  flex-grow: 1;
}

/* Positioning for labels */
.fabric-development .label {
  position: absolute;
  bottom: -20px;
  background-color: #e92c2c;
  color: white;
  padding: 8px 30px;
  font-weight: bold;
  border-radius: 2px;
  font-size: 1rem;
 font-family: 'Afacad', sans-serif;
  white-space: nowrap;
  text-align: center;
  width: 140px; /* fixed width for all labels */
}



/* For the third card, label centered horizontally */
.fabric-development > .card .label {
  left: 50%;
  transform: translateX(-50%);
}

/* Keep third card normal size (no flex applied) */
.fabric-development > .card {
  margin-top: 1.5rem;
  border-radius: 6px;
  box-shadow: 0 4px 15px rgb(0 0 0 / 0.1);
  overflow: hidden;
}


/* detailing */
 .detail-section__header {
      text-align: center;
      margin-bottom: 25px;
      font-family: 'Afacad', sans-serif;
    }
    .detail-section__title {
      font-weight: 600;
      font-size: 30px;
      margin-bottom: 10px;
      font-family: 'Afacad', sans-serif;
       color: #302F2F;
    }
    .detail-section__description {
      font-size: 16px;
      color: #606060;
      margin-bottom: 40px;
      max-width: 700px;
      margin-left: auto;
      margin-right: auto;
      font-family: 'Afacad', sans-serif;
    }
    .detail-section__column {
      padding: 0 15px;
      margin-bottom: 30px;
    }
    .detail-section__image {
      width: 100%;
      height: auto;
      object-fit: cover;
      margin-bottom: 15px;
      border-radius: 3px;
    }
    .detail-section__subtitle {
      font-weight: 600;
      font-size: 25px;
      margin-bottom: 12px;
      font-family: 'Afacad', sans-serif;
      color: #302F2F;
      text-align: center;
    }
    .detail-section__text {
      font-size: 16px;
      color: #606060;
      line-height: 1.5;
      text-align: justify;
      font-family: 'Afacad', sans-serif;
    }
    /* production */
      .production-heading-bg {
      background-color: #fdebed; /* pink */
      padding: 50px 0 200px 0;
      text-align: center;
    }

    /* Content inside container */
    .production-heading-bg .container {
      max-width: 720px;
    }

    .production-title {
      font-weight: 700;
      font-size: 1.8rem;
      margin-bottom: 10px;
      color: #222;
      
    }

    .production-subtitle {
      font-size: 1rem;
      color: #555;
      line-height: 1.4;
    }

    /* Cards below with white background */
    .production-cards-wrapper {
      background-color: #fff;
      padding: 40px 15px 60px 15px;
    }

 .process-card {
  padding: 0;
  transition: transform 0.3s ease;
  height: 100%;
}
.process-card:hover {
  transform: translateY(-5px);
}
   

.process-card{
border: 2px solid transparent; /* set transparent border first */
  border-radius: 5px;
  background: 
    linear-gradient(#fff, #fff) padding-box,   /* inner background */
    linear-gradient(to bottom, #FFC4C4, #FFFFFF) border-box;
      box-shadow: 0 4px 6px rgba(0, 0, 0, 0.15);
  padding: 10px;

}



.process-card img {
      width: 100%;
   
      object-fit: cover;
      padding: 15px;
    }

    .process-card-body {
      padding: 20px;
    }

    .process-title {
      font-weight: 700;
      margin-bottom: 15px;
      text-align: center;
      color: #302F2F;
      font-size: 22px;
    }

    .process-text {
      font-size: 0.9rem;
      color: #606060;
      line-height: 1.5;
    }

    .highlight-keyword {
      color: #EF3030;
      font-weight: 700;
    }