/* Shared news-card layout for Chinese and English desktop/mobile templates. */
.news #main .inner .group {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px;
  align-items: stretch;
}
.news #main .inner .group .box {
  width: 100%;
  min-width: 0;
  height: auto;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  color: #25332d;
  background: #fff;
  border: 1px solid #e1e5dc;
  border-radius: 18px;
  box-shadow: 0 12px 34px rgba(20, 39, 29, .055);
  transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}
.news #main .inner .group .box:hover {
  border-color: #a6bc76;
  box-shadow: 0 18px 42px rgba(20, 39, 29, .11);
  transform: translateY(-4px);
}
.news #main .inner .group .box .photo { display: none !important; }
.news #main .inner .group .box .clear {
  display: block;
  width: 100%;
  height: auto;
  margin: 0;
  overflow: hidden;
  aspect-ratio: 16 / 10;
}
.news #main .inner .group .box .clear .news-thumb {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  border-radius: 0;
  transition: transform .4s ease;
}
.news #main .inner .group .box:hover .clear .news-thumb { transform: scale(1.035); }
.news #main .inner .group .box .top {
  display: flex;
  align-items: center;
  width: 100%;
  height: auto;
  min-height: 0;
  padding: 24px 26px 0;
  color: #6f8b46;
}
.news #main .inner .group .box .top i { display: none; }
.news #main .inner .group .box .top h3,
.news #main .inner .group .box:hover .top h3 {
  color: #6f8b46;
  font-size: 14px;
  line-height: 1.4;
}
.news #main .inner .group .box .mid {
  width: 100%;
  height: auto;
  min-height: 0;
  padding: 10px 26px 20px;
}
.news #main .inner .group .box .mid h2,
.news #main .inner .group .box:hover .mid h2 {
  color: #223129;
  font-size: clamp(18px, 1.6vw, 23px);
  line-height: 1.4;
  overflow-wrap: anywhere;
}
.news #main .inner .group .box .btm {
  width: 100%;
  height: auto;
  min-height: 64px;
  margin-top: auto;
  padding: 0 26px 22px;
}
.news #main .inner .group .box .btm small,
.news #main .inner .group .box:hover .btm small { color: #7d8780; }
.news #main .inner .group .box .btm .layer-cir { flex: none; }
@media (max-width: 1024px) {
  .news #main .inner .group { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
}
@media (max-width: 767px) {
  .news #main .inner .group { grid-template-columns: 1fr; gap: 20px; }
  .news #main .inner .group .box .clear { width: 100%; margin: 0; aspect-ratio: 16 / 10; }
  .news #main .inner .group .box .clear .news-thumb { width: 100%; height: 100%; aspect-ratio: auto; border-radius: 0; }
  .news #main .inner .group .box .top { padding: 20px 20px 0; }
  .news #main .inner .group .box .mid { padding: 8px 20px 18px; min-height: 0; }
  .news #main .inner .group .box .mid h2 { font-size: 19px; }
  .news #main .inner .group .box .btm { padding: 0 20px 20px; }
}
