/* ========================================
   News Archive Page
   ======================================== */
.news-section { padding: 80px 0; }

.news-filter { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 40px; }
.news-filter__btn {
  padding: 6px 20px; font-size: 12px; letter-spacing: 0.1em;
  border: 1px solid var(--color-border); border-radius: 100px;
  background: transparent; cursor: pointer; transition: all 0.3s ease;
  font-family: var(--font-sans); color: var(--color-text);
}
.news-filter__btn:hover,
.news-filter__btn.is-active { background: var(--color-primary); color: #fff; border-color: var(--color-primary); opacity: 1; }

.news-list-full { border-top: 1px solid var(--color-border); }

.news-list-item {
  display: block; padding: 28px 0;
  border-bottom: 1px solid var(--color-border);
  transition: background 0.3s ease, padding 0.3s ease;
  color: var(--color-text);
}

.news-list-item:hover { background: var(--color-bg-light); padding-left: 20px; padding-right: 20px; opacity: 1; }

.news-list-item__meta { display: flex; align-items: center; gap: 16px; margin-bottom: 8px; }
.news-list-item__date { font-family: var(--font-en); font-size: 13px; color: var(--color-text-light); letter-spacing: 0.1em; }
.news-list-item__cat { font-size: 10px; letter-spacing: 0.1em; padding: 3px 12px; border: 1px solid var(--color-primary); color: var(--color-primary); border-radius: 100px; }
.news-list-item__title { font-size: 15px; font-weight: 500; letter-spacing: 0.05em; }
.news-list-item__excerpt { font-size: 13px; color: var(--color-text-light); margin-top: 6px; line-height: 1.8; }

.pagination { display: flex; justify-content: center; gap: 8px; margin-top: 60px; }
.pagination .page-numbers {
  display: flex; align-items: center; justify-content: center;
  width: 40px; height: 40px; border-radius: 50%;
  font-family: var(--font-en); font-size: 14px;
  border: 1px solid var(--color-border); transition: all 0.3s ease; color: var(--color-text);
}
.pagination .current { background: var(--color-primary); color: #fff; border-color: var(--color-primary); }
.pagination a.page-numbers:hover { opacity: 1; background: var(--color-bg-light); }

/* ========================================
   Single Post
   ======================================== */
.single-main { padding: 80px 0; }

.single-article { max-width: 900px; margin: 0 auto; }

.single-header { margin-bottom: 48px; }

.single-meta { display: flex; align-items: center; gap: 16px; margin-bottom: 16px; }

.single-date {
  font-family: var(--font-en); font-size: 13px;
  color: var(--color-text-light); letter-spacing: 0.1em;
}

.single-cat {
  font-size: 10px; letter-spacing: 0.1em;
  padding: 3px 12px; border: 1px solid var(--color-primary);
  color: var(--color-primary); border-radius: 100px;
}

.single-title {
  font-family: var(--font-serif); font-size: clamp(20px, 2.5vw, 28px);
  font-weight: 400; line-height: 1.8; letter-spacing: 0.1em;
}

.single-thumbnail {
  margin-bottom: 48px; border-radius: 12px; overflow: hidden;
}

.single-thumbnail img { width: 100%; height: auto; }

.single-content {
  font-size: 15px; line-height: 2.2; color: var(--color-text);
}

.single-content p { margin-bottom: 1.6em; }
.single-content h2 { font-family: var(--font-serif); font-size: 22px; margin: 2em 0 1em; padding-bottom: 0.5em; border-bottom: 1px solid var(--color-border); }
.single-content h3 { font-family: var(--font-serif); font-size: 18px; margin: 1.8em 0 0.8em; }
.single-content img { border-radius: 8px; margin: 2em 0; }
.single-content ul, .single-content ol { padding-left: 2em; margin-bottom: 1.6em; }
.single-content li { margin-bottom: 0.5em; }

.single-nav {
  display: flex; justify-content: space-between; gap: 24px;
  margin-top: 80px; padding-top: 40px; border-top: 1px solid var(--color-border);
}

.single-nav__prev,
.single-nav__next {
  display: flex; flex-direction: column; gap: 8px;
  font-size: 13px; max-width: 45%; color: var(--color-text);
}

.single-nav__next { align-items: flex-end; text-align: right; }

.single-nav__label { font-family: var(--font-en); font-size: 11px; letter-spacing: 0.15em; color: var(--color-text-light); }

.single-nav__title { font-size: 14px; line-height: 1.6; }

.single-back { margin-top: 48px; text-align: center; }