/* ============================================================
   更新履歴 (changelog.html) — screen-specific styles
   共通トークン・共通コンポーネント(service-nav/header/footer/
   page-heading/breadcrumb/cta/btn)は css/style.css を参照。
   ============================================================ */
.changelog { background: #fff; padding: 100px 0; }
.changelog__container {
  width: 1000px;
  max-width: 100%;
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  gap: 48px;
}

.changelog__version { display: flex; flex-direction: column; gap: 16px; width: 100%; }
.changelog__version-head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--border-default);
}
.changelog__version-num {
  font-family: var(--font-nimbus);
  font-weight: 700;
  font-size: 24px;
  line-height: 1.5;
  color: var(--text-primary);
}
.changelog__version-date {
  font-family: var(--font-nimbus);
  font-size: 16px;
  line-height: 1.5;
  color: var(--text-secondary);
}

.changelog__list { display: flex; flex-direction: column; padding-left: 16px; }
.changelog__list li {
  display: flex;
  align-items: center;
  gap: 5px;
  padding-left: 20px;
  font-size: 16px;
  line-height: 2;
  color: var(--text-primary);
  position: relative;
}
.changelog__list li::before {
  content: '';
  position: absolute;
  left: 5px;
  top: 13px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background-color: var(--text-primary);
}

@media (max-width: 1040px) {
  .changelog__container { width: 100%; padding-inline: 24px; }
}

@media (max-width: 768px) {
  /* ---- Breadcrumb配置（Figma SP実測: 更新履歴本体の後・CTA前に配置される。
     デスクトップ（page-heading直後）と異なる並び順）----
     既存の .breadcrumb クラス・HTML構造・位置は変更せず、bodyをflex化して
     orderのみで視覚上の並び順を変更する（デスクトップ表示・DOM順は不変）。 */
  body { display: flex; flex-direction: column; }
  .breadcrumb { order: 1; }
  .cta { order: 2; }
  .footer { order: 2; }

  /* ---- changelog (更新履歴本体) ---- */
  .changelog { padding: 64px 0; }
  .changelog__container {
    width: 100%;
    padding-inline: clamp(16px, 3.4vw, 24px);
    gap: 32px;
  }

  .changelog__version { gap: 8px; }
  .changelog__version-head { padding-bottom: 8px; }
  .changelog__version-num { font-size: 20px; }
  .changelog__version-date { font-size: 15px; }

  .changelog__list { padding-left: 0; }
  .changelog__list li { align-items: flex-start; word-break: break-all; }

  .changelog__divider { padding: 20px 0; }
}