.blog-search {
    border-radius: 72px;
    background-image: url('images/blogs/search.png');
    background-repeat: no-repeat;
    background-position: 98% 59%;
    background-size: 2%;
    margin-top: 57px;
    height: 60px;
}
.blog-search::placeholder{
  font-size: 24px;
  font-family: 'Nunito Sans',sans-serif;
  color: #000000;
  opacity: 0.5;
  transform: translate(07px , 02px);
  
}
.blog-section{
  background-image: url('images/blogs/Group 162.png');
  background-position: center top;
background-size: 23% 72%;
  background-repeat: no-repeat;
}

.background-image-blog{
  background-image: linear-gradient(357deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.36) 65.18%),
  url('images/blogs/banner.png');

  height: max-content;
  z-index: 9999;
  position: relative;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-color: white;



}
.blog-thumbnail-img{
    border-top-left-radius: 33px;
    border-top-right-radius: 33px;
    width: 98%;
}
.blog-card{
    border: none;
    align-items: center;
}
.blog-card-body{
       border-bottom-left-radius: 33px;
    border-bottom-right-radius: 33px;
    box-shadow: 0px 173px 48px 0px rgba(0, 0, 0, 0),
    0px 111px 44px 0px rgba(0, 0, 0, 0.02),
    0px 62px 37px 0px rgba(0, 0, 0, 0.07),
    0px 28px 28px 0px rgba(0, 0, 0, 0.12),
    0px 7px 15px 0px rgba(0, 0, 0, 0.13);
    WIDTH: 100%;
       padding-left: 30px;
    padding-right: 30px;
}
.blog-title{
    font-family: 'Nunito Sans', sans-serif;
 font-size: 20px;
 font-weight: 700;
 color: #545454;
}
.blog-excerpt{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 14x;
    font-weight: 500;
    color: #545454;
 
 
}
.arrow-blog{
    display: flex;
    width: 100%;
    justify-content: end;
}
.search-arrow{
    margin-right: -2%;
}
.blog-search{
     box-shadow: 67px 61px 25px 0px rgba(0, 0, 0, 0),
    43px 39px 23px 0px rgba(0, 0, 0, 0.01),
    24px 22px 20px 0px rgba(0, 0, 0, 0.05),
    11px 10px 15px 0px rgba(0, 0, 0, 0.09),
    3px 2px 8px 0px rgba(0, 0, 0, 0.10);
}
.blog-row{
    padding-bottom: 150px;
}
.blog-line{
    width: 380px;
}
.inner-blog-date{
    font-family: 'tenor sans', sans-serif;
    font-size: 24px;
    color: #ffffff;
    padding: 25px 0px;
    margin: 0;
}
.inner-blog-text{
  font-size: 67px;
  color: white;
  display: flex;
  justify-content: center;
  flex-direction: column;
  text-align: center;
  position: relative;
  padding-top: 360px;
}
.toc-container {
    background-image: url('images/blogs/TOC.png');
    padding-top: 60px;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    height: fit-content;
    width: 400px;
    border-bottom-left-radius: 33px;
    border-bottom-right-radius: 33px;
}
.toc-heading{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 24px;
background-color: #ffffff;
    color: #000000;
    padding: 24px 35px;
    width: max-content;
    border-radius: 79px;
    width: 372px;
    box-shadow: 67px 61px 25px 0px rgba(0, 0, 0, 0),
    43px 39px 23px 0px rgba(0, 0, 0, 0.01),
    24px 22px 20px 0px rgba(0, 0, 0, 0.05),
    11px 10px 15px 0px rgba(0, 0, 0, 0.09),
    3px 2px 8px 0px rgba(0, 0, 0, 0.10);
margin-left: -35px;

}
.toc-list li a{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 17px;
    color: #545454;
 font-weight: bold;
}
.toc-list li{
    padding:5px 0 5px 0;
}
.toc-row{
    padding-bottom:40px;
    justify-content: space-evenly;
}
.toc-img{
    width: 100%;
    justify-content: end;
    display: flex;
}
.blog-content p ,.samarpan-help p,.blog-content ul li{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 22px;
    padding-bottom: 5px;
    color: #545454;
}
.blog-content h3, .samarpan-help h3,.blog-content h2, .samarpan-help h2{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 32px;
    color: #545454;
    font-weight: bolder;
    padding-bottom: 5px;
    padding-top:40px;
}
.blog-container{
    padding-left: 110px;

}
.side-blog-panel,.side-panel-card{
    background-color: #E6F4F4;
}
.side-panel-card{
    border: none;
    padding-left: 30px;
        padding-top: 50px;
}
.side-blog-title{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 16px;
    color: #545454;
    font-weight: bold;
}
.side-blog-list li{
    padding-top: 40px;
}
.blog-btn{
    font-family: 'nunito sans', sans-serif;
    font-size: 24px;
    color: #000000;
    padding: 10px 32px;
    border-radius: 53px;
    border: 2px solid #00978D;
    font-weight: 600;
}
.blog-faq-text{
       font-family: 'Nunito Sans', sans-serif;
    font-size: 32px;
    color: #545454;
    font-weight: bolder;
    padding-bottom: 5px;
}
.blog-faqs{
    padding-top: 150px;
}
.blog-faq-section{
    padding-right: 40px;
}
.samarpan-help{
    padding-top: 100px;
    padding-right: 80px;
      padding-bottom: 100px;
}
@media (max-width: 768px) {
    .toc-row{
    padding-bottom:40px;
    justify-content: flex-start;
}
    .inner-blog-text{
  font-size: 24px;
  padding-bottom: 10px;
  padding-top: 390px;
  padding-left: 35px;
  padding-right: 35px;

}
.background-image-blog {
  background-image: linear-gradient(357deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.36) 65.18%),
  url('images/blogs/Group.png');
  z-index: 9999;
  position: relative;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-position: center;
  flex-direction: column;
}
.toc-heading{
    font-size: 12px;
    width: 218px;
}
.toc-list li a{
    font-size: 13px;
}
.mob-blog-img{
    width: 277px;
}
.blog-container{
    padding-left: 30px;
    padding-right: 22px;
}
.toc-container {
    background-image: url('images/blogs/TOC.png');
    padding-top: 60px;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    height: fit-content;
    width: 245px;
    border-bottom-left-radius: 33px;
    border-bottom-right-radius: 33px;
}
.blog-img-mob-right{
    justify-content: end;
    display:flex;
}
.blog-content p, .samarpan-help p, .blog-content ul li{
    font-size: 12px;
}
.blog-content h3, .samarpan-help h3,.blog-content h2, .samarpan-help h2{
    font-size: 15px;
    padding-top:10px;
}
.blog-faq-section{
    padding-right: 0px;

}
.blog-faqs{
    padding-top: 70px;
}
.samarpan-help{
    padding-right: 0px;
    padding-top: 65px;
}
.blog-btn{
    font-size: 13px;

}



/* ✅ Hide default scrollbar */
.blog-carousel {
  scrollbar-width: none; 
  -ms-overflow-style: none;
}
.blog-carousel::-webkit-scrollbar {
  display: none;
}

/* ✅ Carousel cards */
.blog-carousel-container {
  width: 100%;
  overflow: hidden;
  position: relative;
  display: flex;
  flex-direction: column;
 background: #E6F4F4;
 margin-bottom: 50px;
}

.blog-carousel {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  gap: 15px;
  padding: 0 10px;
  padding-top: 25px;
}

.blog-card {
  flex: 0 0 60%;

  border-radius: 15px;
  border: none;
  scroll-snap-align: start;
  text-align: center;
}

.blog-thumbnail-img {
    width: 99%;
    height: 292px;
    object-fit: cover;
    border-radius: 33px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}
.blog-arrow{
    width: 100%;
    height: 2px;
}

.mob-blog-card{
    margin-top: 70px;
}
.blog-card-body{
    box-shadow: 0px 173px 48px 0px rgba(0, 0, 0, 0), 
    -1px 4px 44px 0px rgba(0, 0, 0, 0.02),
     -7px 5px 37px 0px rgba(0, 0, 0, 0.07),
      2px 16px 28px 0px rgba(0, 0, 0, 0.12), 
    0px 7px 15px 0px rgba(0, 0, 0, 0.13);
}
.blog-card p {
  font-size: 10px;
  margin: 10px 0;
  font-weight: bold;
  color: #545454;

}

/* ✅ Thin Line Slider */
.slider-bar {
  position: relative;
  width: 100%;        /* Adjust to your preference */
  height: 6px;
  margin: 12px auto 0;
}

.slider-line {
  width: 100%;
  height: 3px;
  background-color: #00978D; /* ✅ Thin line color */
  border-radius: 2px;
}

.slider-thumb {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 60px;  /* Adjust based on your thumb image */
  height: 18px; /* Adjust based on your thumb image */
  transition: left 0.3s ease;
  pointer-events: none;
}
.blog-line{
    width: 209px;
}

.inner-blog-date{
    font-size: 13px;
    padding: 10px 0;
}

}

