@import url("../styles.css");

/* Mobile article reading gutters: keep the body within the viewport. */
@media (max-width: 768px) {
  .blog-article {
    padding-left: 16px;
    padding-right: 16px;
  }
}

/* ブログ一覧: 3カード横並び（.blog-cards 統一形式） */
.blog-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:0 0 3.5rem;}
.blog-cards .blog-card{display:block;padding:0;background:#fff;border:1px solid var(--line,#e5e5e5);overflow:hidden;}
.blog-cards .blog-card>a{display:block;color:inherit;text-decoration:none;}
.blog-cards .card-thumb{aspect-ratio:16/9;overflow:hidden;background:#eee;}
.blog-cards .card-thumb img{display:block;width:100%;height:100%;object-fit:cover;}
.blog-cards .card-body{padding:14px 16px 18px;}
.blog-cards .card-body time{display:block;font-size:.75rem;color:#666;margin-bottom:6px;font-family:var(--sans);}
.blog-cards .card-body h3{font-size:1rem;line-height:1.5;margin:0 0 8px;}
.blog-cards .card-body p{font-size:.85rem;line-height:1.7;margin:0;color:#444;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
@media (max-width:960px){.blog-cards{grid-template-columns:repeat(2,1fr);}}
@media (max-width:560px){.blog-cards{grid-template-columns:1fr;}}

/* ニュースコメンタリー記事（blog/template.html）本文の可読性 */
.article-meta {
  margin: -2rem 0 2.5rem;
  color: var(--muted);
  font: 500 .8rem/1.5 var(--sans);
}
.main-content section p + p,
.main-content section p + div,
.main-content section div + p {
  margin-top: 1.1rem;
}
.main-content section h3 {
  margin: 2rem 0 .8rem;
  font-size: 1.15rem;
  line-height: 1.5;
}
.main-content section ul {
  margin: 1rem 0 0;
  padding-left: 1.4rem;
  line-height: 1.8;
}
.main-content .news-source-ref {
  margin-top: 1.2rem;
  font-size: .85rem;
  color: var(--muted);
}
.main-content .amazon-banner {
  margin: 1.2rem 0;
}
.side-nav ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.main-content .share-box .share-button {
  display: inline-block;
  margin: .8rem .6rem 0 0;
  padding: .55rem 1rem;
  border: 1px solid var(--line);
  background: var(--light);
  font: 600 .8rem/1.5 var(--sans);
  text-decoration: none;
}