/* =========================================================
   ブログ（一覧・記事）
   ブランディングページと同じ配色・書体を使う。
   記事本文は「貼り付けただけ」で整うよう、見出し・段落・リスト・
   画像・引用・表のすべてにスタイルを当てている。
   ========================================================= */

/* ---------- 一覧（ブログ・カテゴリー・検索結果） ---------- */
.kk-listing{ padding-top:calc(72px + clamp(56px,8vw,110px)); }

.posts{
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:clamp(20px,2.6vw,32px);
  margin-top:clamp(40px,5vw,64px);
}

.pcard{ margin:0; }
.pcard__link{
  display:flex; flex-direction:column; height:100%;
  background:var(--white); border:1px solid var(--line); border-radius:6px;
  overflow:hidden; text-decoration:none; color:inherit;
  transition:transform .5s var(--ease), box-shadow .5s var(--ease), border-color .5s;
}
.pcard__link:hover{
  transform:translateY(-5px);
  box-shadow:0 24px 48px -28px rgba(10,26,47,.45);
  border-color:rgba(10,26,47,.22);
}

.pcard__thumb{
  position:relative; aspect-ratio:16/10; background:var(--ink);
  display:flex; align-items:center; justify-content:center; overflow:hidden;
}
.pcard__thumb img{ width:100%; height:100%; object-fit:cover; }
.pcard__thumb-fallback{
  font-family:var(--font-en); font-size:2.4rem; font-weight:300;
  color:rgba(227,197,97,.45); letter-spacing:.1em;
}

.pcard__body{ padding:clamp(20px,2.4vw,26px); display:flex; flex-direction:column; flex:1; }
.pcard__meta{
  display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  margin:0 0 12px; font-family:var(--font-en);
  font-size:.72rem; letter-spacing:.14em; color:var(--text-muted);
}
.pcard__cat{
  font-family:var(--font-ja); font-size:.68rem; letter-spacing:.08em;
  color:var(--gold); border:1px solid rgba(201,162,39,.45);
  border-radius:999px; padding:3px 10px;
}
.pcard__title{
  font-family:var(--font-min); font-size:1.05rem; font-weight:600;
  letter-spacing:.04em; line-height:1.65; margin:0 0 12px;
}
.pcard__excerpt{
  margin:0 0 18px; font-size:.84rem; line-height:1.95; color:var(--text-muted);
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
}
.pcard__more{
  margin-top:auto; font-style:normal; font-family:var(--font-en);
  font-size:.68rem; letter-spacing:.14em; color:var(--ink); opacity:.55;
  transition:opacity .4s;
}
.pcard__link:hover .pcard__more{ opacity:1; }

.kk-empty{ margin-top:40px; color:var(--text-muted); }
.kk-backlink{ margin-top:clamp(40px,5vw,60px); font-size:.84rem; letter-spacing:.06em; }
.kk-backlink a{ color:var(--text-muted); }
.kk-backlink a:hover{ color:var(--ink); }

/* ページ送り */
.pagination,
.navigation.pagination{ margin-top:clamp(48px,6vw,72px); }
.nav-links{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; justify-content:center; }
.page-numbers{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:40px; height:40px; padding:0 12px;
  border:1px solid var(--line); border-radius:4px; background:var(--white);
  font-family:var(--font-en); font-size:.8rem; letter-spacing:.06em;
  transition:background .3s, color .3s, border-color .3s;
}
.page-numbers:hover{ border-color:var(--ink); }
.page-numbers.current{ background:var(--ink); color:#fff; border-color:var(--ink); }
.page-numbers.dots{ border:0; background:none; min-width:24px; }
.screen-reader-text{
  position:absolute !important; width:1px; height:1px; overflow:hidden;
  clip:rect(1px,1px,1px,1px); white-space:nowrap;
}

/* ---------- 記事ページ ---------- */
.kk-post{ background:var(--paper); }

.kk-post__head{
  background:var(--ink); color:#fff;
  padding:calc(72px + clamp(56px,7vw,96px)) 0 clamp(44px,5vw,64px);
}
.kk-post__meta{
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  margin:0 0 20px; font-family:var(--font-en);
  font-size:.74rem; letter-spacing:.16em; color:rgba(234,240,247,.7);
}
.kk-post__cat{
  font-family:var(--font-ja); font-size:.72rem; letter-spacing:.08em;
  color:var(--gold-soft); border:1px solid rgba(227,197,97,.5);
  border-radius:999px; padding:4px 12px;
}
.kk-post__cat:hover{ background:var(--gold-soft); color:var(--ink); }
.kk-post__title{
  font-family:var(--font-min); font-weight:600;
  font-size:clamp(1.5rem,3.2vw,2.3rem); line-height:1.6; letter-spacing:.03em;
  margin:0; max-width:24em;
}

.kk-post__hero{ margin:0; background:var(--ink); }
.kk-post__hero .wrap{ padding-bottom:0; }
.kk-post__hero img{
  width:100%; max-width:860px; margin:0 auto;
  border-radius:4px; transform:translateY(clamp(-64px,-5vw,-32px));
  box-shadow:0 30px 60px -30px rgba(0,0,0,.6);
}

.kk-post__body{ padding:clamp(48px,6vw,80px) 0 clamp(40px,5vw,64px); }
.kk-post__body > .wrap{ max-width:820px; }

/* ===== 貼り付けた本文のスタイル ===== */
.kk-post__body :where(h2,h3,h4,h5,h6){
  font-family:var(--font-min); font-weight:600; letter-spacing:.03em; color:var(--text);
}
.kk-post__body h2{
  font-size:clamp(1.25rem,2.4vw,1.6rem); line-height:1.6;
  margin:2.6em 0 .9em; padding-bottom:.5em;
  border-bottom:1px solid var(--line);
}
.kk-post__body h3{
  font-size:clamp(1.08rem,2vw,1.3rem); line-height:1.65;
  margin:2.2em 0 .8em; padding-left:.65em;
  border-left:3px solid var(--gold);
}
.kk-post__body h4{ font-size:1.02rem; line-height:1.7; margin:1.9em 0 .7em; }
.kk-post__body h5,
.kk-post__body h6{ font-size:.95rem; margin:1.7em 0 .6em; }
.kk-post__body > :first-child{ margin-top:0; }

.kk-post__body p{ margin:0 0 1.75em; font-size:1rem; line-height:2.1; }

.kk-post__body a{
  color:var(--ink-3); text-decoration:underline;
  text-underline-offset:.25em; text-decoration-thickness:1px;
  text-decoration-color:rgba(27,58,95,.4);
  transition:color .3s, text-decoration-color .3s;
}
.kk-post__body a:hover{ color:var(--gold); text-decoration-color:var(--gold); }

.kk-post__body strong,
.kk-post__body b{ font-weight:700; }
.kk-post__body em{ font-style:italic; }
.kk-post__body mark{ background:linear-gradient(transparent 62%, rgba(201,162,39,.38) 62%); padding:0 .1em; }

.kk-post__body ul,
.kk-post__body ol{ margin:0 0 1.75em; padding-left:1.6em; }
.kk-post__body ul{ list-style:disc; }
.kk-post__body ol{ list-style:decimal; }
.kk-post__body li{ margin-bottom:.6em; line-height:2; }
.kk-post__body li::marker{ color:var(--gold); }
.kk-post__body li > ul,
.kk-post__body li > ol{ margin:.6em 0 0; }

.kk-post__body blockquote{
  margin:0 0 1.9em; padding:clamp(18px,2.4vw,26px) clamp(20px,3vw,32px);
  background:var(--paper-2); border-left:3px solid var(--gold);
  border-radius:0 4px 4px 0; font-style:normal;
}
.kk-post__body blockquote p:last-child{ margin-bottom:0; }
.kk-post__body blockquote cite{ display:block; margin-top:.8em; font-size:.82rem; color:var(--text-muted); font-style:normal; }

.kk-post__body img{ height:auto; border-radius:4px; }
.kk-post__body figure{ margin:0 0 2em; }
.kk-post__body figure img{ width:100%; }
.kk-post__body figcaption{
  margin-top:.7em; font-size:.78rem; color:var(--text-muted);
  line-height:1.8; text-align:center;
}
.kk-post__body .alignleft{ float:left; margin:.4em 1.6em 1.2em 0; max-width:50%; }
.kk-post__body .alignright{ float:right; margin:.4em 0 1.2em 1.6em; max-width:50%; }
.kk-post__body .aligncenter{ margin-inline:auto; }
.kk-post__body .alignwide,
.kk-post__body .alignfull{ margin-inline:auto; }

.kk-post__body hr{
  border:0; height:1px; background:var(--line);
  margin:clamp(40px,5vw,64px) 0;
}

.kk-post__body code{
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:.88em; background:var(--paper-2);
  padding:.15em .45em; border-radius:3px;
}
.kk-post__body pre{
  margin:0 0 1.9em; padding:clamp(16px,2.4vw,24px);
  background:var(--ink); color:#EAF0F7; border-radius:6px;
  overflow-x:auto; font-size:.85rem; line-height:1.8;
}
.kk-post__body pre code{ background:none; padding:0; color:inherit; }

.kk-post__body table{
  width:100%; border-collapse:collapse; margin:0 0 2em;
  font-size:.9rem; display:block; overflow-x:auto;
}
.kk-post__body th,
.kk-post__body td{
  border:1px solid var(--line); padding:12px 14px;
  text-align:left; line-height:1.8; vertical-align:top;
}
.kk-post__body th{ background:var(--paper-2); font-weight:500; white-space:nowrap; }

.kk-post__body iframe,
.kk-post__body video{ max-width:100%; border-radius:4px; }
.kk-post__body .wp-block-embed__wrapper{ position:relative; }

.kk-post__pages{ margin-top:2em; font-size:.85rem; letter-spacing:.06em; }

/* ---------- 記事下 ---------- */
.kk-post__foot{ padding-bottom:clamp(56px,7vw,88px); }
.kk-post__foot > .wrap{ max-width:820px; }
.kk-post__tags{ margin:0 0 32px; font-size:.78rem; letter-spacing:.06em; }
.kk-post__tags a{
  display:inline-block; margin:0 6px 6px 0; padding:4px 12px;
  border:1px solid var(--line); border-radius:999px; color:var(--text-muted);
}
.kk-post__tags a:hover{ border-color:var(--ink); color:var(--ink); }

.kk-post__nav{
  display:grid; grid-template-columns:1fr 1fr; gap:clamp(16px,3vw,32px);
  padding-top:clamp(28px,3.5vw,40px); border-top:1px solid var(--line);
}
.kk-post__nav-item span{
  display:block; font-family:var(--font-en); font-size:.66rem;
  letter-spacing:.2em; color:var(--gold); margin-bottom:8px;
}
.kk-post__nav-item a{
  font-family:var(--font-min); font-size:.95rem; line-height:1.7;
  letter-spacing:.03em;
}
.kk-post__nav-item a:hover{ color:var(--ink-3); }
.kk-post__nav-item--next{ text-align:right; }

.kk-post__cta{ text-align:center; }
.kk-post__cta .lead{ margin-inline:auto; }
.kk-post__cta .btns{ justify-content:center; margin-top:34px; }

/* ---------- レスポンシブ ---------- */
@media (max-width:1000px){
  .posts{ grid-template-columns:1fr 1fr; }
}
@media (max-width:760px){
  .posts{ grid-template-columns:1fr; }
  .kk-post__nav{ grid-template-columns:1fr; }
  .kk-post__nav-item--next{ text-align:left; }
  .kk-post__body .alignleft,
  .kk-post__body .alignright{ float:none; margin:0 0 1.5em; max-width:100%; }
}