/* extracted-inline-styles */
/* layouts/article/list.html */
body:has(.article-list) #main { background: #f8f8f8; }
body:has(.article-list) main.template-page { padding-top: 60px; padding-bottom: 60px; }
.article-page-title { margin: 0 0 34px; font-size: 34px; line-height: 1.3; color: #111827; font-weight: 700; }
.article-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 40px; }
.article-card {
  overflow: hidden;
  transition: transform .3s;
}
.article-card:hover { transform: translateY(-2px); }
.article-img {
  height: 190px; overflow: hidden; background: #e8eef5; border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
}
.article-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; border-radius: 8px; }
.article-card:hover .article-img img { transform: scale(1.05); }
.article-img-placeholder { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: #e8eef5; border-radius: 8px; }
.article-body { padding: 18px 0; }
.article-body h2 {
  font-size: 16px; color: #131d3c; line-height: 1.5; margin: 0 0 8px;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.article-summary {
  margin: 0;
  color: #666;
  font-size: 14px;
  line-height: 1.7;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.article-body a { text-decoration: none; color: inherit; }
.article-card a:hover { text-decoration: none; }
.article-body a:hover h2 { color: #00dc8c; }
.kv_pagination { display: flex; justify-content: center; gap: 6px; margin-top: 40px; flex-wrap: wrap; }
.kv_pagination a, .kv_pagination span {
  padding: 8px 15px; border: 1px solid #ddd; border-radius: 4px;
  text-decoration: none; color: #555; font-size: 14px; transition: all .2s;
}
.kv_pagination a:hover { border-color: #00dc8c; color: #00dc8c; }
.kv_pagination a.current {
  border-color: #00dc8c; background: #00dc8c; color: #fff;
}
.kv_pagination span { border: none; color: #999; }
@media (max-width: 768px) {
  .article-list { grid-template-columns: 1fr; }
  body:has(.article-list) main.template-page { padding-top: 30px; padding-bottom: 30px; }
}

/* layouts/article/single.html */
.article-detail-wrap { max-width: 800px; margin: 0 auto; padding: 30px; }
.news-content img { max-width: 100%; height: auto; border-radius: 4px; margin: 10px 0; }
.news-content p { margin-bottom: 10px; }