/* Blog — archive + single */
.nt-blog-hero { position: relative; overflow: hidden; padding-top: calc(72px + var(--nt-space-2xl)); }

.nt-blog-filters {
  display: flex; flex-wrap: wrap; gap: 10px; margin-top: 32px;
}
.nt-blog-filter {
  padding: 8px 18px; border-radius: 99px;
  font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  background: rgba(255,255,255,0.06); color: var(--nt-grey-300);
  border: var(--nt-border); cursor: none;
  transition: all var(--nt-trans);
}
.nt-blog-filter:hover,
.nt-blog-filter--on {
  background: rgba(26,157,217,0.12); color: var(--nt-azur);
  border-color: rgba(26,157,217,0.3);
}

.nt-blog-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
@media (max-width: 900px) { .nt-blog-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 580px) { .nt-blog-grid { grid-template-columns: 1fr; } }

/* Pagination */
.nt-pagination { display: flex; justify-content: center; gap: 8px; }
.nt-pagination .page-numbers {
  padding: 10px 16px; border-radius: var(--nt-radius);
  background: var(--nt-dark-2); border: var(--nt-border);
  font-size: 13px; color: var(--nt-grey-300); cursor: none;
  transition: all var(--nt-trans);
}
.nt-pagination .page-numbers:hover,
.nt-pagination .current {
  background: rgba(26,157,217,0.12); color: var(--nt-azur);
  border-color: rgba(26,157,217,0.3);
}

/* Single article body */
.nt-article-body {
  max-width: 720px; margin: 0 auto;
  font-size: 17px; line-height: 1.8; color: var(--nt-grey-100);
}
.nt-article-body h2 { font-size: 26px; font-weight: 700; margin: 48px 0 16px; }
.nt-article-body h3 { font-size: 20px; font-weight: 700; margin: 36px 0 12px; }
.nt-article-body p  { margin-bottom: 20px; }
.nt-article-body strong { color: var(--nt-white); }
.nt-article-body a  { color: var(--nt-azur); text-decoration: underline; text-underline-offset: 3px; }
.nt-article-body blockquote {
  border-left: 3px solid var(--nt-azur);
  padding: 16px 24px; margin: 28px 0;
  background: rgba(26,157,217,0.06); border-radius: 0 var(--nt-radius) var(--nt-radius) 0;
  font-style: italic; color: var(--nt-grey-100);
}
.nt-article-body img {
  border-radius: var(--nt-radius); margin: 28px 0; width: 100%;
}
.nt-article-body ul, .nt-article-body ol {
  margin-left: 24px; margin-bottom: 20px;
  list-style: disc; color: var(--nt-grey-300);
}
.nt-article-body li { margin-bottom: 8px; }