/* Only keep CSS used on this page */
          .CatInformation {
            width: 550px;
          }
          .swiper-button-prev, .swiper-button-next {
            color: #444;
          }
          .imgCat {
            width: 400px;
            height: 400px;
            background-repeat: no-repeat, repeat;
            background-size: cover;
          }
          #carouselExampleIndicators {
            height: auto;
          }
          #carouselExampleIndicators img {
            object-fit: contain;
            width: 100%;
            height: auto;
          }
          .image-text-container {
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 20px auto;
            max-width: 90%;
          }
          .image-text-container img {
            width: 60%;
            height: auto;
            border-radius: 10px;
            margin-right: 20px;
          }
          .image-text-container .text-content {
            flex: 1;
            font-size: 18px;
            line-height: 1.6;
          }
          .accordion-button {
            background-color: rgb(135, 225, 255);
            color: #393939;
          }
          .accordion-button:not(.collapsed) {
            background-color: rgb(0, 191, 255);
            color: #000000;
          }
          .accordion-body {
            background-color: #f7fafc;
            color: #222;
          }
          .accordion-item {
            border-radius: 10px;
            margin-bottom: 10px;
            overflow: hidden;
          }
          /* here */
          #custom-slider {
  min-height: 850px;
  height: 850px;
  background: #fff;
  position: relative;
  max-width: 80vw;
  width: 80vw;
  margin: 30px auto;
  border: 3px solid red;
  border-radius: 12px;
  padding: 18px 18px 32px 18px;
  overflow: hidden;
  box-sizing: border-box;
}
          #custom-slider .slider-slide {
            transition: opacity 0.6s cubic-bezier(.4,0,.2,1), transform 0.6s cubic-bezier(.4,0,.2,1);
            opacity: 0;
            transform: translateX(60px);
            position: absolute;
            width: 100%;
            left: 0;
            top: 0;
            background: white;
            box-shadow: 0 8px 32px 0 rgba(0,0,0,0.08);
            border-radius: 12px;
            padding: 10px 0;
            display: flex;
            align-items: center;
            gap: 48px; /* slightly more gap for bigger images */
            pointer-events: none;
            min-height: 850px;
            z-index: 1;
            visibility: hidden;
          }
          #custom-slider .slider-slide.active,
          #custom-slider .slider-slide.slide-in-left,
          #custom-slider .slider-slide.slide-in-right,
          #custom-slider .slider-slide.slide-out-left,
          #custom-slider .slider-slide.slide-out-right,
          #custom-slider .slider-slide.slide-in-left.animate,
          #custom-slider .slider-slide.slide-in-right.animate {
            visibility: visible;
          }
          #custom-slider .slider-slide.active {
            opacity: 1;
            transform: translateX(0);
            position: relative;
            z-index: 2;
            pointer-events: auto;
          }
          #custom-slider .slider-slide.slide-out-left {
            opacity: 1;
            transform: translateX(-100%);
            z-index: 2;
            pointer-events: none;
            transition: opacity 0.6s cubic-bezier(.4,0,.2,1), transform 0.6s cubic-bezier(.4,0,.2,1);
          }
          #custom-slider .slider-slide.slide-in-right {
            opacity: 1;
            transform: translateX(100%);
            z-index: 3;
            pointer-events: none;
            transition: none;
          }
          #custom-slider .slider-slide.slide-in-right.animate {
            transition: opacity 0.6s cubic-bezier(.4,0,.2,1), transform 0.6s cubic-bezier(.4,0,.2,1);
            transform: translateX(0);
            opacity: 1;
            pointer-events: auto;
          }
          #custom-slider .slider-slide.slide-out-right {
            opacity: 1;
            transform: translateX(100%);
            z-index: 2;
            pointer-events: none;
            transition: opacity 0.6s cubic-bezier(.4,0,.2,1), transform 0.6s cubic-bezier(.4,0,.2,1);
          }
          #custom-slider .slider-slide.slide-in-left {
            opacity: 1;
            transform: translateX(-100%);
            z-index: 3;
            pointer-events: none;
            transition: none;
          }
          #custom-slider .slider-slide.slide-in-left.animate {
            transition: opacity 0.6s cubic-bezier(.4,0,.2,1), transform 0.6s cubic-bezier(.4,0,.2,1);
            transform: translateX(0);
            opacity: 1;
            pointer-events: auto;
          }
          #custom-slider .slider-img-col {
            flex: 1;
            text-align: center;
            display: flex;
            flex-direction: column;
            align-items: center;
            min-height: 320px;
            justify-content: center;
            padding: 0 8px;
          }
          #custom-slider .slider-img-col img {
            width: 100%;
            max-width: 750px;
            max-height: 750px;
            height: auto;
            border-radius: 12px;
            box-shadow: 0 2px 8px 0 rgba(0,0,0,0.06);
            background: #f8f9fa;
            object-fit: contain;
            margin: 0 auto;
          }
          #custom-slider .slider-text-col {
            flex: 1.2;
            text-align: center;
            min-width: 140px;
            padding: 0 5%;
            min-height: 180px;
            display: flex;
            flex-direction: column;
            justify-content: center;
            text-align: center;
            align-items: center;
            justify-content: center;
            display: flex;
            flex-direction: column;
            padding-top: 0;
            padding-bottom: 0;
            margin-top: -32px; /* Move text up a little */
          }
          #custom-slider .slider-title {
            font-size: 1.2rem;
            font-weight: bold;
            margin-bottom: 10px;
            color: #007bff;
            letter-spacing: 0.5px;
          }
          #custom-slider .slider-desc {
            font-size: 1.05rem;
            color: #222;
            line-height: 1.5;
          }
          #custom-slider .carousel-control-prev,
          #custom-slider .carousel-control-next {
            width: 38px;
            height: 38px;
            top: 50%;
            transform: translateY(-50%);
            opacity: 0.85;
            background: #fff;
            border-radius: 50%;
            border: 1.5px solid #000000;
            box-shadow: 0 1px 4px 0 rgba(0,0,0,0.07);
            transition: background 0.2s, border 0.2s;
            position: absolute;
            z-index: 10;
            display: flex;
            align-items: center;
            justify-content: center;
          }
          #custom-slider .carousel-control-prev:hover,
          #custom-slider .carousel-control-next:hover {
            background: #ffeaea;
            border-color: #c0392b;
          }
          #custom-slider .carousel-control-prev-icon,
          #custom-slider .carousel-control-next-icon {
            width: 1.5rem;
            height: 1.5rem;
          }
          @media (max-width: 1024px) {
            #custom-slider {
              max-width: 98vw;
              width: 98vw;
              margin: 12px auto;
              padding: 10px 2vw 16px 2vw;
              border-width: 2px;
              border-color: #007bff;
            }
            #custom-slider .slider-slide,
            #custom-slider .slider-slide.active {
              flex-direction: column;
              gap: 12px;
              padding: 0;
              border-radius: 10px;
              box-shadow: 0 4px 16px 0 #b90e0e17;
              padding: 8px 2vw;
            }
            #custom-slider .slider-img-col img {
              max-width: 99vw;
              max-height: 500px;
              border-radius: 10px;
              border-width: 1.5px;
            }
            #custom-slider .slider-img-col {
              min-height: 180px;
              padding: 0;
            }
            #custom-slider .slider-text-col {
              min-height: 80px;
              padding: 0 2vw;
              border-radius: 8px;
              padding: 12px 2vw;
              text-align: center;
              align-items: center;
              justify-content: center;
              display: flex;
              flex-direction: column;
              margin-top: -18px; /* Move text up a little on smaller screens */
            }
            #custom-slider .carousel-control-prev,
            #custom-slider .carousel-control-next {
              width: 32px;
              height: 32px;
              border-width: 1px;
            }
          }
          @media (max-width: 600px) {
            #custom-slider {
              min-height: 0;
              padding: 4px 0 8px 0;
              border-width: 1px;
              border-color: #e74c3c;
              border-radius: 10px;
            }
            #custom-slider .slider-slide,
            #custom-slider .slider-slide.active {
              padding: 4px 0;
              border-radius: 8px;
            }
            #custom-slider .slider-img-col img {
              max-width: 100vw;
              max-height: 320px;
              border-radius: 8px;
              border-width: 1px;
            }
            #custom-slider .slider-title {
              font-size: 1rem;
            }
            #custom-slider .slider-desc {
              font-size: 0.95rem;
            }
          }
          .slider-desc-long.collapsed {
            max-height: none;
            overflow: visible;
            position: relative;
            transition: max-height 0.3s;
          }
          /* Only show vertical scrollbar and limit height on 1024px or below */
          @media (max-width: 1024px) {
            .slider-desc-long.collapsed {
              max-height: 110px;
              overflow-y: auto;
              scrollbar-width: thin;
              scrollbar-color: #007bff #f0f0f0;
            }
            .slider-desc-long.collapsed::-webkit-scrollbar {
              width: 7px;
            }
            .slider-desc-long.collapsed::-webkit-scrollbar-thumb {
              background: #007bff;
              border-radius: 6px;
            }
            .slider-desc-long.collapsed::-webkit-scrollbar-track {
              background: #f0f0f0;
              border-radius: 6px;
            }
          }
          /* .read-more-btn {
            margin-top: 8px;
            background: #007bff;
            color: #fff;
            border: none;
            border-radius: 18px;
            padding: 6px 18px;
            font-size: 1rem;
            cursor: pointer;
            transition: background 0.2s;
            display: none; /* Hide by default 
          }*/
          .read-more-btn:hover {
            background: #0056b3;
          } */
          .slider-desc-long.expanded {
            max-height: 1000px;
            overflow: visible;
            transition: max-height 0.3s;
          }
          .slider-desc-long.expanded::after {
            display: none;
          }
          /* @media (max-width: 1024px) {
            .read-more-btn {
              display: inline-block; 
            }
          } */

    /* <!-- Carousel Start --> */

      /* Essential layout for custom slider */
      #custom-slider {
        position: relative;
        width: 80vw;
        max-width: 80vw;
        min-height: 650px;
        margin: 30px auto;
        border: 2px solid #000000;
        border-radius: 12px;
        background: #fff;
        padding: 0px;
        overflow: hidden;
        box-sizing: border-box;
        display: block;
      }
      .slider-track {
        position: relative;
        width: 100%;
        height: 100%;
      }
      .slider-slide {
        position: absolute;
        width: 100%;
        left: 0;
        top: 0;
        display: flex;
        align-items: center;
        gap: 48px; /* slightly more gap for bigger images */
        opacity: 0;
        transform: translateX(60px);
        transition: opacity 0.6s cubic-bezier(.4,0,.2,1), transform 0.6s cubic-bezier(.4,0,.2,1);
        background: #fff;
        border-radius: 12px;
        box-shadow: 0 8px 32px 0 rgba(0,0,0,0.08);
        padding: 10px 0;
        min-height: 600px;
        z-index: 1;
        pointer-events: none;
        visibility: hidden;
      }
      .slider-slide.active {
        opacity: 1;
        transform: translateX(0);
        position: relative;
        z-index: 2;
        pointer-events: auto;
        visibility: visible;
      }
      .slider-slide.slide-in-left,
      .slider-slide.slide-in-right,
      .slider-slide.slide-out-left,
      .slider-slide.slide-out-right,
      .slider-slide.slide-in-left.animate,
      .slider-slide.slide-in-right.animate {
        visibility: visible;
      }
      .slider-slide.slide-out-left {
        opacity: 1;
        transform: translateX(-100%);
        transition: opacity 0.6s, transform 0.6s;
      }
      .slider-slide.slide-in-right {
        opacity: 1;
        transform: translateX(100%);
        transition: none;
      }
      .slider-slide.slide-in-right.animate {
        transform: translateX(0);
        opacity: 1;
        transition: opacity 0.6s, transform 0.6s;
        pointer-events: auto;
      }
      .slider-slide.slide-out-right {
        opacity: 1;
        transform: translateX(100%);
        transition: opacity 0.6s, transform 0.6s;
      }
      .slider-slide.slide-in-left {
        opacity: 1;
        transform: translateX(-100%);
        transition: none;
      }
      .slider-slide.slide-in-left.animate {
        transform: translateX(0);
        opacity: 1;
        transition: opacity 0.6s, transform 0.6s;
        pointer-events: auto;
      }
      .slider-img-col {
        flex: 1;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        min-height: 320px;
        padding: 0 8px;
        text-align: center;
      }
      .slider-img {
        width: 100%;
        max-width: 750px;
        max-height: 750px;
        height: auto;
        border-radius: 12px;
        box-shadow: 0 2px 8px 0 rgba(0,0,0,0.06);
        background: #f8f9fa;
        object-fit: contain;
        margin: 0 auto;
      }
      .slider-text-col {
        flex: 1.2;
        min-width: 140px;
        padding: 0 12px;
        min-height: 180px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        text-align: center;
        align-items: center;
        justify-content: center;
        display: flex;
        flex-direction: column;
        padding-top: 0;
        padding-bottom: 0;
        margin-top: -32px; /* Move text up a little */
      }
      .slider-title {
        font-size: 1.2rem;
        font-weight: bold;
        margin-bottom: 10px;
        color: #007bff;
        letter-spacing: 0.5px;
      }
      .slider-desc {
        font-size: 1.05rem;
        color: #222;
        line-height: 1.5;
      }
      .slider-control {
        width: 38px;
        height: 38px;
        top: 50%;
        transform: translateY(-50%);
        opacity: 0.85;
        background: #fff;
        border-radius: 50%;
        /* border: 1.5px solid #e74c3c; */
        box-shadow: 0 1px 4px 0 rgba(0,0,0,0.07);
        transition: background 0.2s, border 0.2s;
        position: absolute;
        z-index: 10;
        display: flex;
        align-items: center;
        justify-content: center;
      }
      .slider-control:hover {
        background: #ffeaea;
        border-color: #c0392b;
      }
      .slider-control-prev { left: 10px; }
      .slider-control-next { right: 10px; }
      .slider-control-icon {
        width: 1.5rem;
        height: 1.5rem;
      }
      /* Responsive */
      @media (max-width: 1024px) {
        #custom-slider {
          max-width: 98vw;
          width: 98vw;
          margin: 12px auto;
          padding: 10px 2vw 16px 2vw;
          border-width: 2px;
          border-color: #007bff;
        }
        #custom-slider .slider-slide,
        #custom-slider .slider-slide.active {
          flex-direction: column;
          gap: 12px;
          padding: 0;
          border-radius: 10px;
          box-shadow: 0 4px 16px 0 rgba(0,0,0,0.09);
          padding: 8px 2vw;
        }
        #custom-slider .slider-img {
          max-width: 99vw;
          max-height: 500px;
        }
        #custom-slider .slider-img-col {
          min-height: 180px;
          padding: 0;
        }
        #custom-slider .slider-text-col {
          min-height: 80px;
          padding: 0 2vw;
          border-radius: 8px;
          padding: 12px 2vw;
          text-align: center;
          align-items: center;
          justify-content: center;
          display: flex;
          flex-direction: column;
          margin-top: -18px; /* Move text up a little on smaller screens */
        }
        .slider-control {
          width: 32px;
          height: 32px;
          border-width: 1px;
        }
      }
      @media (max-width: 600px) {
        #custom-slider {
          min-height: 0;
          padding: 4px 0 8px 0;
          border-width: 1px;
          border-color: #e74c3c;
          border-radius: 10px;
        }
        #custom-slider .slider-slide,
        #custom-slider .slider-slide.active {
          padding: 4px 0;
          border-radius: 8px;
        }
        #custom-slider .slider-img {
          max-width: 100vw;
          max-height: 320px;
          border-radius: 8px;
          border-width: 1px;
        }
        #custom-slider .slider-title {
          font-size: 1rem;
        }
        #custom-slider .slider-desc {
          font-size: 0.95rem;
        }
      }