/**
 * JFHANY Web - 個別記事ページ共通スタイル
 *
 * 全 CPT の single テンプレートで共有するレイアウト。
 * 投稿タイプ固有のスタイルは各 CSS（events.css, experts.css 等）で上書き。
 *
 * @package jfhany-web
 */

/* ==========================================================================
   ページレイアウト
   ========================================================================== */

.jfhany-single {
  padding-top: var(--jfhany-space-2xl);
  padding-bottom: var(--jfhany-space-3xl);
}

/* ==========================================================================
   ヘッダー（タイトル・バッジ等）
   ========================================================================== */

.jfhany-single__header {
  margin-bottom: var(--jfhany-space-2xl);
}

.jfhany-single__title {
  font-family: var(--jfhany-font-heading);
  font-size: var(--jfhany-font-size-3xl);
  font-weight: 700;
  line-height: 1.3;
  color: var(--jfhany-color-primary);
  margin: var(--jfhany-space-sm) 0 var(--jfhany-space-xl);
}

/* ==========================================================================
   サムネイル
   ========================================================================== */

.jfhany-single__thumbnail {
  margin-bottom: var(--jfhany-space-2xl);
}

.jfhany-single__thumbnail img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--jfhany-border-radius);
}

/* ==========================================================================
   本文コンテンツ
   ========================================================================== */

.jfhany-single__content {
  max-width: 800px;
  font-size: var(--jfhany-font-size-base);
  line-height: var(--jfhany-line-height-base);
  color: var(--jfhany-color-text);
}

.jfhany-single__content p {
  margin-bottom: var(--jfhany-space-lg);
}

.jfhany-single__content img {
  max-width: 100%;
  height: auto;
}

.c-single-featured-image {
  display: block;
  margin-block-end: var(--jfhany-space-lg);
}

/* ==========================================================================
   レスポンシブ
   ========================================================================== */

@media (max-width: 768px) {
  .jfhany-single__title {
    font-size: var(--jfhany-font-size-xl);
  }
}