/*
 * P-SIX Theme — blog.css
 * 海楽日記・お知らせ（アーカイブ / 個別記事）
 */

/* Posts grid (archive) */
.posts { padding: 100px 60px; }
.diary-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; max-width: 1200px; margin: 0 auto; }
.diary-card { text-decoration: none; color: inherit; transition: transform .3s; }
.diary-card:hover { transform: translateY(-4px); }
.diary-thumb { aspect-ratio: 3/2; border-radius: 2px; overflow: hidden; }
.diary-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s; }
.diary-card:hover .diary-thumb img { transform: scale(1.05); }
.diary-ct { padding: 16px 4px 0; }
.diary-date { font-family: 'DM Sans', sans-serif; font-size: 11px; color: var(--mist); letter-spacing: 1px; }
.diary-title { font-size: 14px; font-weight: 500; color: var(--ink); line-height: 1.7; margin-top: 6px; }

/* Pagination */
.pagination .nav-links { display: flex; gap: 8px; justify-content: center; }
.pagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border: 1px solid var(--pearl); font-size: 13px; color: var(--steel); text-decoration: none; transition: all .3s; }
.pagination .page-numbers.current,
.pagination .page-numbers:hover { background: var(--sea); color: var(--white); border-color: var(--sea); }

/* Single post */
.single-post a { color: var(--sea); }
.single-post img { max-width: 100%; height: auto; border-radius: 4px; }
.post-body h2 { font-size: 22px; font-weight: 600; margin: 48px 0 16px; color: var(--ink); }
.post-body h3 { font-size: 18px; font-weight: 600; margin: 36px 0 12px; color: var(--ink); }
.post-body p { margin-bottom: 24px; }
.post-body ul, .post-body ol { margin: 0 0 24px 24px; color: var(--steel); }
.post-body li { line-height: 2; }
.post-nav a { color: var(--sea); text-decoration: none; }
.post-nav a:hover { text-decoration: underline; }

/* ═══ RESPONSIVE ═══ */
@media (max-width: 1024px) {
  .diary-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 768px) {
  .posts { padding: 60px 24px; }
  .diary-grid { grid-template-columns: 1fr; }
}