/* ==============================
   Three Reasons Page（Figma 153:2156）
   背景 #fff3e4、白カード内にタイトル＋3ブロック
   ============================== */

/* ページ全体の背景（Figma: ReasonsPage bg #fff3e4） */
.three-reasons-page {
  background-color: var(--color-bg-warm);
  min-height: 100vh;
}

/* コンテナ：上下パディング、中央寄せ（Figma: ReasonstContainer） */
.three-reasons-container {
  padding: 48px var(--container-pad-sp) 64px;
}

@media (min-width: 768px) {
  .three-reasons-container {
    padding: 80px var(--container-pad-pc) 120px;
  }
}

/* 白カード（Figma: ReasonsSection）
   white, rounded 16px, padding 64px, max-width 1280px, gap 60px */
.three-reasons-section {
  max-width: 1280px;
  margin-inline: auto;
  background-color: var(--color-white);
  border-radius: var(--radius-lg);
  padding: var(--space-6);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-8);
  box-shadow: 0 2px 16px rgba(0, 0, 0, 0.06);
}

@media (min-width: 768px) {
  .three-reasons-section {
    padding: var(--container-pad-pc);
    gap: 60px;
  }
}

/* ページタイトル（Figma: 153:2159）
   Tsunagi Gothic Black, 40px, #ffa54c, text-center */
.three-reasons-section__title {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: var(--text-2xl);
  color: var(--color-primary);
  text-align: center;
  line-height: 1.4;
  width: 100%;
}

@media (min-width: 768px) {
  .three-reasons-section__title {
    font-size: var(--text-3xl);
  }
}

/* 理由リスト（Figma: ReasonList） */
.three-reasons-list {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: var(--space-8);
}

@media (min-width: 768px) {
  .three-reasons-list {
    gap: 60px;
  }
}

/* カード1本（Figma: ArticleCard） */
.three-reasons-card {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
  width: 100%;
}

/* セクションタイトルエリア（Figma: SectionTitleArea） */
.three-reasons-card__title-area {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  width: 100%;
}

/* タイトル行：アイコン + テキスト（Figma: SectionTitleRow） */
.three-reasons-card__title-row {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  width: 100%;
}

.three-reasons-card__title-icon {
  flex-shrink: 0;
  width: 48px;
  height: auto;
  object-fit: contain;
}

@media (min-width: 768px) {
  .three-reasons-card__title-icon {
    width: 60px;
    height: 47px;
  }
}

/* タイトル文言（Figma: Zen Maru Gothic Bold, 24px, #4b4b4b, tracking 1.2px） */
.three-reasons-card__title-text {
  flex: 1;
  min-width: 0;
  font-family: var(--font-base);
  font-weight: 700;
  font-size: var(--text-lg);
  color: var(--color-text);
  line-height: 1.4;
  letter-spacing: 0.05em;
}

@media (min-width: 768px) {
  .three-reasons-card__title-text {
    font-size: var(--text-xl);
    letter-spacing: 1.2px;
  }
}

/* 区切り線（オレンジ） */
.three-reasons-card__divider {
  width: 100%;
  height: 2px;
  background-color: var(--color-primary);
  border-radius: 1px;
}

/* 本文＋画像エリア（Figma: ArticleContentArea） */
.three-reasons-card__content {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
  width: 100%;
}

@media (min-width: 768px) {
  .three-reasons-card__content {
    flex-direction: row;
    align-items: flex-start;
    gap: var(--space-6);
  }
}

/* 本文（Figma: Zen Maru Gothic Medium, 16px, #4b4b4b, leading 1.8） */
.three-reasons-card__body {
  flex: 1;
  min-width: 0;
}

.three-reasons-card__body p {
  font-family: var(--font-base);
  font-weight: 500;
  font-size: var(--text-md);
  color: var(--color-text);
  line-height: 1.8;
  margin-bottom: 1em;
}

.three-reasons-card__body p:last-child {
  margin-bottom: 0;
}


/* 画像（Figma: ThumbnailImage 300x225） */
.three-reasons-card__img-wrap {
  flex-shrink: 0;
  width: 100%;
  max-width: 300px;
  aspect-ratio: 300 / 225;
  border-radius: var(--radius-md);
  overflow: hidden;
  background-color: var(--color-placeholder);
}

@media (min-width: 768px) {
  .three-reasons-card__img-wrap {
    width: 300px;
  }
}

.three-reasons-card__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
