/* ============================================================
   WordPress 投稿本文（the_content 出力）用タイポグラフィ
   .article-body 配下に投稿エディタの見出し/段落/画像/リスト/引用が入ります。
   配色はテーマパレットに合わせています。
   ============================================================ */
.article-body > * + * { margin-top: 1.5rem; }
.article-body > *:first-child { margin-top: 0; }

.article-body h2 {
  font-family: 'Noto Serif JP', serif;
  font-weight: 700;
  font-size: 1.375rem;
  line-height: 1.6;
  color: rgb(68 65 54);
  padding-top: .5rem;
}
.article-body h3 {
  font-family: 'Noto Serif JP', serif;
  font-weight: 700;
  font-size: 1.15rem;
  line-height: 1.6;
  color: rgb(68 65 54);
}
@media (min-width:1024px){
  .article-body h2 { font-size: 1.5rem; }
  .article-body h3 { font-size: 1.25rem; }
}

.article-body p { line-height: 2; }
.article-body a { color: rgb(209 92 22); text-decoration: underline; }
.article-body a:hover { opacity: .8; }
.article-body strong { color: rgb(68 65 54); font-weight: 700; }

.article-body ul { list-style: disc; padding-left: 1.5rem; }
.article-body ol { list-style: decimal; padding-left: 1.5rem; }
.article-body li { margin-top: .5rem; line-height: 1.9; }

.article-body img { border-radius: .75rem; height: auto; max-width: 100%; }
.article-body figure { margin: 2rem 0; }
.article-body figure img { width: 100%; }
.article-body figcaption { font-size: .75rem; color: rgb(165 157 114); text-align: center; margin-top: .5rem; }

.article-body blockquote { background: rgb(254 247 238); border-radius: 1rem; padding: 1.5rem; }
@media (min-width:1024px){ .article-body blockquote { padding: 2rem; } }
.article-body blockquote p { line-height: 1.8; }
.article-body blockquote cite { display: block; font-style: normal; font-size: .875rem; color: rgb(165 157 114); margin-top: .75rem; }

.article-body table { width: 100%; border-collapse: collapse; }
.article-body th, .article-body td { border: 1px solid rgb(211 207 184); padding: .5rem .75rem; text-align: left; }

/* ============================================================
   お問い合わせ（Contact Form 7）— ダークな #contact セクションに合わせる
   ※ Tailwind の bg-white/5 等は CF7 の class: トークンで付けられないため
     共通クラス .cea-field / .cea-submit を CSS で定義。
   ============================================================ */
.cea-contact .wpcf7 { margin: 0; }
.cea-contact form > * + * { margin-top: 1.5rem; }

.cea-contact .cea-field {
  width: 100%;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: .5rem;
  padding: .75rem 1rem;
  font-size: .875rem;
  color: #fff;
  transition: border-color .2s;
}
.cea-contact textarea.cea-field { resize: none; min-height: 8rem; }
.cea-contact select.cea-field option { background: rgb(68 65 54); color: #fff; }
.cea-contact .cea-field::placeholder { color: rgb(148 140 100); }
.cea-contact .cea-field:focus { outline: none; border-color: rgb(212 168 67); }

.cea-contact .cea-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  padding: .875rem 2rem;
  background: rgb(212 168 67);
  color: rgb(68 65 54);
  font-weight: 700;
  font-size: .875rem;
  border: 0;
  border-radius: 9999px;
  cursor: pointer;
  transition: transform .2s, box-shadow .2s, background-color .2s;
}
.cea-contact .cea-submit:hover {
  background: rgba(212,168,67,.9);
  transform: translateY(-2px);
  box-shadow: 0 10px 15px -3px rgba(212,168,67,.25);
}
.cea-contact .cea-submit:disabled { opacity: .6; cursor: default; transform: none; box-shadow: none; }

/* CF7 のメッセージ・スピナー */
.cea-contact .wpcf7-spinner { margin: .75rem auto 0; }
.cea-contact .wpcf7-response-output { margin: 1rem 0 0 !important; border-radius: .5rem; font-size: .8125rem; color: #fff; }
.cea-contact .wpcf7-not-valid-tip { color: #ffb4a8; font-size: .75rem; margin-top: .25rem; }
.cea-contact .cea-field.wpcf7-not-valid { border-color: #ff8a73; }