.equipment-grid {

  display: grid;

  grid-template-columns: repeat(3, 1fr);

  gap: 30px;

}
.entry-content{
  line-height: 36px;
}
.sidebar-post{
      border-radius: 1rem;
    -webkit-box-shadow: 0 0 3rem 0 rgba(23, 116, 196, 0.1);
    box-shadow: 0 0 3rem 0 rgba(23, 116, 196, 0.1);
    padding: 70px;
}
.archive-heading{
  color: #333;
    font-size: 22px;
    line-height: 1.8;
    font-weight: 700;
    margin-bottom: 30px;
    margin-top: 0;
}
.blog-card {

  background: #f8fbff;

  overflow: hidden;

  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);

  display: flex;

  flex-direction: column;

  transition: all 0.3s ease;

}



.blog-card:hover {

  transform: translateY(-5px);

}



.blog-thumb img {

  width: 100%;

  height: 220px;

  object-fit: cover;

}



.blog-content {

  padding: 15px;

}



.blog-date {

  font-size: 14px;

  color: #666;

  margin-bottom: 8px;

}



.blog-title {

  font-weight: 600;

  margin-bottom: 10px;

  display: -webkit-box;

  -webkit-line-clamp: 2; /* số dòng */

  -webkit-box-orient: vertical;

  overflow: hidden;

  text-overflow: ellipsis;

  font-size: 18px;

  line-height: 1.4;

  color: #222;

  text-decoration: none;

  min-height: calc(1.4em * 2); /* giữ chiều cao bằng 2 dòng */

}



.blog-title a {

  text-decoration: none;

  color: #222;

}



.blog-excerpt {

  display: -webkit-box;

  -webkit-line-clamp: 2; /* số dòng muốn hiển thị */

  -webkit-box-orient: vertical;

  overflow: hidden;

  text-overflow: ellipsis;

  font-size: 15px;

  line-height: 1.5;

  color: #555;

  min-height: calc(1.5em * 2); /* đảm bảo chiều cao bằng 2 dòng */

}



.btn-readmore {

  display: inline-block;

  margin-top: 14px;

  padding: 5px 16px;

  border: 1px solid #434343;

  color: #333333;

  border-radius: 5px;

  text-decoration: none;

  transition: 0.3s;

}

.btn-readmore {

  display: inline-block;

  margin-top: 14px;

  padding: 5px 16px;

  border: 1px solid #434343;

  color: #333333;

  border-radius: 5px;

  text-decoration: none;

  position: relative;

  overflow: hidden;

  transition: color 0.3s ease;

  z-index: 1;

}



.btn-readmore::before {

  content: "";

  position: absolute;

  top: 0;

  left: -100%;

  width: 100%;

  height: 100%;

  background: #1774c4; /* màu nền khi hover */

  transition: left 0.3s ease;

  z-index: -1;

}



.btn-readmore:hover {

  color: #fff; /* đổi màu chữ khi hover */

}



.btn-readmore:hover::before {

  left: 0;

}

/* Phân trang */

.pagination-wrap { margin: 30px 0; text-align: center; }

.pagination-wrap ul { display: inline-block; padding: 0; margin: 0; list-style: none; }

.pagination-wrap li { display: inline-block; margin: 0 5px; }

.pagination-wrap a.page-numbers,

.pagination-wrap span.page-numbers {

  display: inline-block;

  padding: 8px 14px;

  border: 1px solid #ddd;

  border-radius: 4px;

  text-decoration: none;

  color: #333;

}

.pagination-wrap a.page-numbers:hover { background: #f5f5f5; border-color: #999; }

.pagination-wrap .current {

  background: #007bff;

  color: #fff;

  border-color: #007bff;

}



/* Single */

.related-posts {

  background: #fff;

  border-radius: 10px;

  padding: 0 20px 20px 10px;

  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);

}

.related-posts h3 {

  font-size: 18px;

  font-weight: bold;

  margin-bottom: 15px;

}

.related-list {

  list-style: none;

  margin: 0;

  padding: 0;

}

.related-item {

  display: flex;

  gap: 15px;

  margin-bottom: 15px;

}

.related-thumb {

  width: 20%;

}

.related-thumb img {

  width: 100%;

  height: 60px;

  object-fit: cover;

  margin-right: 15px;

}

.related-info {

  width: 80%;

}

.related-info a {

  display: -webkit-box;

  -webkit-line-clamp: 2; /* số dòng tối đa */

  -webkit-box-orient: vertical;

  overflow: hidden;

  text-overflow: ellipsis;

  font-size: 14px;

  line-height: 1.4;

  color: #333;

  text-decoration: none;

  min-height: calc(1.4em * 2); /* giữ chiều cao đều cho 2 dòng */

}



.related-info a:hover {

  color: #0073aa; /* màu khi hover */

}

/* các nút chuyển tiếp */

.post-navigation {

  margin-top: 25px;

  border-top: 1px solid #eee;

  padding-top: 15px;

}

.post-navigation > div{

  margin-top: 20px;

}

.post-navigation a {



  margin-bottom: 8px;

  color: #333;

  text-decoration: none;

  transition: all 0.3s ease;

  display: flex;

  align-items: center;

  width: 100%;

}



.post-navigation a:hover {

  border-color: #0073aa;

  color: #0073aa;

}



.post-navigation span.icon {

  margin-right: 6px;

}

.post-navigation span{

  border: 1px solid #ccc;

  border-radius: 50%;

  padding: 5px;

  width: 30px;

  height: 30px;

  display: flex;

  justify-content: center;

  align-items: center;

}



/* ===== Slider Tổng ===== */

.featured-slider {

  position: relative;

  width: 100%;

  max-width: 1200px;

  margin: 40px auto;

  overflow: hidden;

  background: #fff;

  box-shadow: 0 4px 16px rgba(0,0,0,0.08);

  padding: 20px 0;

}



/* ===== Từng item (swiper-slide) ===== */

.featured-item {

  display: flex;

  align-items: center;

  flex-shrink: 0;

  width: 100%;

  padding: 20px;

  gap: 30px;

}



/* Ảnh */

.featured-thumb {

  flex: 0 0 50%;

  height: 400px;

  overflow: hidden;

}

.featured-thumb img {

  width: 100%;

  height: 100%;

  object-fit: cover;

  display: block;

}



/* Nội dung */

.featured-content {

  flex: 1;

}

.featured-content .blog-date {

  font-size: 14px;

  color: #888;

  margin-bottom: 10px;

}

.featured-content .blog-title {

  font-size: 20px;

  font-weight: 600;

  margin-bottom: 12px;

}

.featured-content .blog-title a {

  text-decoration: none;

  color: #222;

  transition: color 0.3s;

}

.featured-content .blog-title a:hover {

  color: #0066cc;

}

.featured-content .blog-excerpt {

  font-size: 15px;

  line-height: 1.6;

  color: #555;

}



/* ===== Nút điều hướng ===== */

.featured-button-prev,

.featured-button-next {

  position: absolute;

  bottom: -50px;

  width: 40px;

  height: 40px;

  border-radius: 50%;

  border: 1px solid #ccc;

  display: flex;

  align-items: center;

  justify-content: center;

  background: #fff;

  cursor: pointer;

  transition: all 0.3s;

  z-index: 10;

}

.featured-button-prev:hover,

.featured-button-next:hover {

  background: #0066cc;

  color: #fff;

  border-color: #0066cc;

}

.featured-button-prev { left: 45%; }

.featured-button-next { right: 45%; }



/* ===== Pagination ===== */

.featured-pagination {

  position: absolute;

  bottom: -45px;

  left: 0;

  right: 0;

  text-align: center;

}

.featured-pagination .swiper-pagination-bullet {

  background: #ccc;

  opacity: 1;

}

.featured-pagination .swiper-pagination-bullet-active {

  background: #0066cc;

}



/* ===== Responsive ===== */

@media (max-width: 768px) {

  .featured-item {

    flex-direction: column;

    gap: 20px;

    padding: 15px;

  }

  .featured-thumb {

    flex: 0 0 auto;

    width: 100%;

  }

  .featured-content {

    text-align: left;

    width: 100%;

  }

  .featured-button-prev { left: 30%; }

  .featured-button-next { right: 30%; }

}



/* Responsive */

@media (max-width: 991px) {

  .equipment-grid {

    grid-template-columns: repeat(2, 1fr);

  }

}



@media (max-width: 575px) {

  .equipment-grid {

    grid-template-columns: 1fr;

  }

}