/* Journal — article + listing pages */
.art { max-width: 760px; margin: 0 auto; padding: 40px 20px 60px; }
.art-cat {
  color: var(--leaf-deep); font-size: .78rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .14em; margin-bottom: 8px;
}
.art-title { font-size: clamp(1.7rem, 4vw, 2.6rem); line-height: 1.12; margin-bottom: 10px; }
.art-meta { color: var(--ink-soft); font-size: .85rem; margin-bottom: 22px; }
.art-hero { margin: 0 0 26px; }
.art-hero img {
  width: 100%; max-height: 430px; object-fit: cover; border-radius: 16px;
  box-shadow: 0 10px 30px rgba(45,53,39,.14);
}
.art-hero figcaption { color: var(--ink-soft); font-size: .74rem; margin-top: 7px; text-align: right; }
.art-body { font-size: 1.04rem; }
.art-body p { margin-bottom: 18px; }
.art-body h2 {
  font-size: 1.35rem; margin: 30px 0 12px; color: var(--leaf-deep);
}
.art-body ul { margin: 0 0 18px 22px; }
.art-body li { margin-bottom: 6px; }
.art-body a { color: var(--leaf-deep); }
.art-cta {
  margin: 36px 0 10px; padding: 22px 24px;
  background: var(--leaf-soft); border: 1px solid var(--line); border-radius: 14px;
  display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap;
}
.art-cta p { margin: 0; color: var(--ink); }
.art-back { margin-top: 26px; font-size: .9rem; }
.art-back a { text-decoration: none; font-weight: 600; }

/* listing */
.jindex { max-width: 1060px; margin: 0 auto; padding: 40px 20px 60px; }
.jindex h1 { font-size: clamp(1.8rem, 4vw, 2.6rem); margin-bottom: 6px; }
.jsec { font-size: 1.25rem; margin: 34px 0 14px; color: var(--leaf-deep); }
.jgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.jcard {
  display: flex; flex-direction: column;
  background: var(--card); border: 1px solid var(--line); border-radius: 14px;
  overflow: hidden; text-decoration: none; color: var(--ink);
  box-shadow: 0 2px 10px rgba(45,53,39,.05);
  transition: box-shadow .2s, transform .2s;
}
.jcard:hover { transform: translateY(-2px); box-shadow: 0 10px 26px rgba(45,53,39,.13); }
.jcard img { width: 100%; height: 150px; object-fit: cover; }
.jc-body { display: flex; flex-direction: column; gap: 5px; padding: 13px 15px 16px; }
.jc-title { font-weight: 600; font-size: .95rem; line-height: 1.3; }
.jc-ex { color: var(--ink-soft); font-size: .82rem; line-height: 1.4; }

@media (max-width: 860px) { .jgrid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .jgrid { grid-template-columns: 1fr; } }