/* ============================================================
 * sf-stimes.css — SUNDAY TIMES（CPT sunday-times）
 *   - アーカイブ一覧（表紙サムネのカードグリッド）
 *   - 個別ページ（メタ + 本文 PDF ファイルブロック + 戻るリンク）
 *
 * ブランドヘッダー（.event-page-header）の共通定義は sf-components.css に集約（Step 10-9 パス1b）。
 * archive 固有の meta / single 縮小のみ sf-archive.css に残る。
 * 本ファイルは sf-archive に依存して後読みされるため、トークン
 * （--c-orange / --c-navy）は :root（sf-archive.css 定義）を利用する。
 * 全セレクタは body の .sf-archive-page スコープ配下（sf-archive-header.php が付与）。
 * ============================================================ */

/* ============================================================
 * アーカイブ一覧 — 表紙カードグリッド
 * ============================================================ */
.sf-archive-page .sf-stimes-archive {
  max-width: 1120px;
  margin: 0 auto;
  /* 下余白はページャー（.c-pagination の margin:3em）が担う＝BLOG/NEWS と同じ。
   * 独自に下 padding を足すと二重になり余白が広くなるため 0。 */
  padding: clamp(40px, 5vw, 72px) 24px 0;
}

.sf-archive-page .sf-stimes-grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: clamp(24px, 3vw, 40px) clamp(20px, 2.4vw, 32px);
}

.sf-archive-page .sf-stimes-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  text-decoration: none;
  color: inherit;
}

/* 表紙（A4縦 ≒ 1 : 1.414） */
.sf-archive-page .sf-stimes-card__cover {
  position: relative;
  display: block;
  aspect-ratio: 1 / 1.414;
  background: #eef1f5;
  border: 1px solid #e3e7ec;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 6px 18px rgba(30, 47, 77, 0.08);
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s ease;
}
.sf-archive-page .sf-stimes-card__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.sf-archive-page .sf-stimes-card__noimg {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 12px;
  text-align: center;
  font-family: "Oswald", sans-serif;
  font-size: 14px;
  letter-spacing: 0.12em;
  color: #aeb6c1;
}
.sf-archive-page .sf-stimes-card:hover .sf-stimes-card__cover {
  transform: translateY(-4px);
  box-shadow: 0 14px 30px rgba(30, 47, 77, 0.16);
}

/* タグ（表紙右上） */
.sf-archive-page .sf-stimes-card__tag {
  position: absolute;
  top: 10px;
  left: 10px;
  padding: 4px 10px;
  font-family: "Oswald", sans-serif;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.06em;
  line-height: 1;
  color: #fff;
  background: var(--c-orange);
  border-radius: 4px;
}

/* カード下部テキスト */
.sf-archive-page .sf-stimes-card__body {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 14px 4px 0;
}
.sf-archive-page .sf-stimes-card__meta {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 4px 12px;
}
.sf-archive-page .sf-stimes-card__vol {
  /* 英字=Oswald（現状維持）／日本語はサイトデフォルト(Noto Sans JP)へフォールバック・bold */
  font-family: "Oswald", "Noto Sans JP", "Hiragino Sans", sans-serif;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--c-orange);
}
.sf-archive-page .sf-stimes-card__date {
  font-size: 12px;
  color: #8a93a0;
}
.sf-archive-page .sf-stimes-card__title {
  font-size: 14.5px;
  font-weight: 700;
  line-height: 1.55;
  color: var(--c-navy);
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  transition: color 0.2s ease;
}
.sf-archive-page .sf-stimes-card:hover .sf-stimes-card__title {
  color: var(--c-orange);
}

.sf-archive-page .sf-stimes-archive__empty {
  padding: 64px 0;
  text-align: center;
  color: #8a93a0;
}

/* ============================================================
 * 個別ページ — メタ + 本文（PDF ファイルブロック） + 戻る
 * ============================================================ */
/* 記事ラッパー/本文は BLOG・NEWS と同じ .l-mainContent__inner / .post_content を使用。
 * 幅・本文タイポグラフィ（見出し等）は SWELL 側に委譲し、ここでは号メタ・PDF・戻るのみ定義。 */
.sf-archive-page .sf-stimes-single__head {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px 18px;
  margin-bottom: clamp(28px, 4vw, 44px);
  padding-bottom: 18px;
  border-bottom: 1px solid rgba(30, 47, 77, 0.14);
}
.sf-archive-page .sf-stimes-single__vol {
  /* 英字=Oswald（現状維持）／日本語はサイトデフォルト(Noto Sans JP)へフォールバック・bold */
  font-family: "Oswald", "Noto Sans JP", "Hiragino Sans", sans-serif;
  font-size: 22px;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--c-orange);
}
.sf-archive-page .sf-stimes-single__date {
  font-size: 14px;
  color: #46505f;
}
.sf-archive-page .sf-stimes-single__tag {
  padding: 4px 12px;
  font-family: "Oswald", sans-serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.06em;
  line-height: 1;
  color: #fff;
  background: var(--c-navy);
  border-radius: 4px;
}

/* 本文の色・行間・見出し等は SWELL の .post_content に委譲（BLOG・NEWS と統一）。
 * ここでは PDF（WP ファイルブロック）の埋め込み高さ確保のみ独自に定義する。 */
.sf-archive-page .sf-stimes-single__body .wp-block-file__embed {
  width: 100%;
  min-height: 80vh;
  border: 1px solid #e3e7ec;
  border-radius: 8px;
}

/* ── ACF 新方式：誌面画像（そのまま表示）＋ PDF ダウンロードボタン ── */
.sf-archive-page .sf-stimes-single__media {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(28px, 4vw, 44px);
}
.sf-archive-page .sf-stimes-single__figure {
  margin: 0;
  width: 100%;
  text-align: center;
}
.sf-archive-page .sf-stimes-single__image {
  max-width: 100%;
  height: auto;
  border: 1px solid #e3e7ec;
  border-radius: 8px;
  box-shadow: 0 6px 18px rgba(30, 47, 77, 0.08);
}
.sf-archive-page .sf-stimes-single__dl {
  text-align: center;
}
.sf-archive-page .sf-stimes-single__dl-btn {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-height: 54px;
  padding: 0 32px;
  border-radius: 999px;
  background: var(--c-orange);
  color: #fff;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-decoration: none;
  transition: background 0.25s ease, transform 0.25s ease;
}
.sf-archive-page .sf-stimes-single__dl-btn:hover {
  background: var(--c-navy);
  transform: translateY(-2px);
}
.sf-archive-page .sf-stimes-single__dl-icon {
  width: 12px;
  height: 16px;
  background: currentColor;
  /* 下向き矢印（ダウンロード） */
  clip-path: polygon(35% 0, 65% 0, 65% 55%, 100% 55%, 50% 100%, 0 55%, 35% 55%);
}

/* 戻るリンク（single-recruit と同デザイン） */
.sf-archive-page .sf-stimes-single__back {
  margin-top: clamp(40px, 6vw, 72px);
  text-align: center;
}
.sf-archive-page .sf-stimes-single__back a {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-height: 54px;
  padding: 0 32px;
  border-radius: 999px;
  background: var(--c-navy);
  color: #fff;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-decoration: none;
  transition: background 0.25s ease, transform 0.25s ease;
}
.sf-archive-page .sf-stimes-single__back a:hover {
  background: var(--c-orange);
  transform: translateY(-2px);
}
.sf-archive-page .sf-stimes-single__back-arrow {
  width: 18px;
  height: 8px;
  background: currentColor;
  /* 左向き矢印（一覧へ戻る） */
  clip-path: polygon(0 50%, 40% 0, 40% 35%, 100% 35%, 100% 65%, 40% 65%, 40% 100%);
}

/* ── SP ── */
@media (max-width: 767px) {
  .sf-archive-page .sf-stimes-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 22px 16px;
  }
  .sf-archive-page .sf-stimes-card__title {
    font-size: 13px;
  }
  .sf-archive-page .sf-stimes-single__body .wp-block-file__embed {
    min-height: 60vh;
  }
}
