/* ===== ホーム専用：最新ブロックを統一サイズで ===== */
:root{
  --card-bg:#fff;
  --ink:#3e3a2f;
  --muted:#6b6b6b;
  --beige:#f3efe7;
  --brand:#7d6e57;
}

main{ max-width:1080px; margin:24px auto; padding:0 16px; }

.card{
  background:var(--card-bg);
  border-radius:16px;
  box-shadow:0 4px 12px rgba(0,0,0,0.06);
}

.lead .inner{ padding:24px 18px; }
.lead .inner.center{ text-align:center; }
.lead h1{ margin:0 0 8px; }

.blocks-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));
  gap:24px;
  margin-top:24px;
}

/* ブロックの統一高さと構成 */
.block{
  display:flex;
  flex-direction:column;
  height: 420px;            /* ← 高さを統一 */
}
.block .inner{
  padding:18px;
  display:flex;
  flex-direction:column;
  flex:1;
  min-height:0;            /* 子要素の overflow を効かせる */
}
.block h2{
  font-size:1.1rem;
  margin:0 0 10px;
  border-bottom:2px solid #d8d2c4;
  padding-bottom:4px;
}
/*
  index.html の最新ブロックは、本文領域が .content ではなく
  #blk-gallery / #blk-activity / #blk-post に入る構造のため、
  こちらにも「はみ出し防止」を適用する。
*/
.block .content,
#blk-gallery,
#blk-activity,
#blk-post{
  flex:1;                 /* コンテンツ領域を可変に */
  overflow:hidden;        /* 溢れを隠す */
  min-height:0;
}

.block p{ margin:0; color:var(--ink); line-height:1.6; word-break:break-word; }
.block .muted{ color:var(--muted); }

/* 長文はカード内に収める（見切れ防止） */
#blk-gallery p:last-child,
#blk-activity p:last-child,
#blk-post p:last-child{
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:5;   /* PCでの最大行数 */
  overflow:hidden;
}

#blk-activity h3,
#blk-post h3{ margin:0 0 6px; font-size:1rem; }
#blk-post a{ color:#1f4e79; text-decoration:none; }
#blk-post a:hover{ text-decoration:underline; }

.block .cta{ margin-top:12px; }
.button{
  background:var(--brand);
  color:#fff;
  padding:8px 14px;
  border-radius:8px;
  text-decoration:none;
  display:inline-block;
  font-size:.9rem;
}
.button:hover{ background:#a18b6d; }

/* 画像の比率統一 */
.block img{
  width:100%;
  height:180px;
  /* 画像が切れないように（noteの表示に近い） */
  object-fit:contain;
  background: #efe9de;
  border-radius:12px;
  margin-bottom:10px;
}

/* ナビの軽い統一（既存style.cssと競合しないよう最小限） */
.site-header{ display:flex; justify-content:space-between; align-items:center; padding:10px 16px; background:#fff; border-bottom:1px solid #e9e4da; position:sticky; top:0; z-index:100; }
.logo img{ height:36px; width:auto; display:block; }
.nav-menu{ display:flex; gap:14px; flex-wrap:wrap; }
.nav-menu a{ color:var(--ink); text-decoration:none; font-weight:600; padding:6px 8px; border-radius:8px; }
.nav-menu a[aria-current="page"], .nav-menu a:hover{ background:var(--beige); }

footer{ text-align:center; margin:28px 0 10px; color:var(--muted); }

@media (max-width: 768px){
  .block{ height:auto; } /* スマホは自動高さ */
}