/* ========================================
   安心サポート宣言（Figma 2159:189・2026-07-31 全面更新）
   ⚠️背景が紺→白に変更。文字色も反転（ESTIMATE=青／タイトル=紺）
   カードは白地＋青1px枠＋青のオフセット影
   ======================================== */

.pledge {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 32px; /* 2026-08-11 Figma 2989:953（旧24px） */
  position: relative;
  padding: 56px 16px 40px; /* 2026-08-01ユーザー指定：上56px（旧40） */
  /* 背景（2026-08-11 Figma 2989:953 fills・配色変更）：
     [上] GRADIENT_LINEAR #1E7FC2 0% → #1E7FC2(a40) 100%（上→下）
     [下] IMAGE 青空(ヒーローと同一hash) CROP＝幅いっぱい・縦中央クロップ
     ※旧「白地＋水面テクスチャ25%」から差し替え */
  background:
    linear-gradient(180deg, #1E7FC2 0%, rgba(30, 127, 194, 0.4) 100%),
    url("../../images/s01_hero/sky-bg.webp") center / cover no-repeat;
  overflow: hidden;
  text-align: center;
}
.pledge > * { position: relative; z-index: 1; }
/* スタッフ写真（Figma 2886:142・2026-07-31追加）＝絶対配置で右上に重ねる */
.pledge-staff {
  position: absolute;
  /* Figma 2886:142（2026-08-01再取得）：y25.63・見出し(y48)の22.4px上＝カード上端に約6pxかぶり。
     上パディングをFigma48→56pxにしたぶん相対位置を保って +8px（25.6+8=33.6） */
  top: 33.6px;
  right: 17px; /* Figma x293 → 390-293-79.97=17 */
  z-index: 0;
  width: 79.97px;
  height: auto;
  opacity: 0.95; /* Figma fillOpacity */
  pointer-events: none;
}

/* CHECK!リボン（Figma 2914:170・2026-08-01追加）＝左上に絶対配置・全体を-8度skew */
.pledge-check {
  position: absolute;
  top: 24px;
  left: -4px; /* Figma X=-4（左へ少しはみ出し・はみ出し分はoverflow hiddenで切れる） */
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 20px; /* 2026-08-01ユーザー指定：左右20（上下6は維持・位置は変えない） */
  background: #43AEBC; /* 2026-08-11 Figma 2989:968（旧コーラル#FF6B5C） */
  border: 2px solid #fff; /* Figma stroke OUTSIDE 2px */
  color: #fff;
  font-family: var(--font-en);
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 16px; /* Figma実測（テキスト高16＝枠28-p12） */
  transform: skewX(-8deg);
}

.pledge-heading { display: flex; flex-direction: column; align-items: center; gap: 3px; }
.pledge-en {
  font-size: 16px;
  line-height: 19px; /* 2026-08-11 Figma 2989:956 実測（旧16px） */
  font-weight: 700;
  color: #8FCFD7; /* 2026-08-11 Figma 2989:956（旧--c-primary） */
}
.pledge-title {
  font-size: 24px; /* 2026-08-11 Figma 2989:957（旧28px） */
  line-height: 29px; /* Figma実測 高さ29px */
  font-weight: 700;
  /* 2026-08-11 Figma 2989:957：白文字＋#43AEBCのオフセット影（旧：紺文字＋白フチ4px） */
  color: #fff;
  text-shadow: 2px 3px 0 #43AEBC; /* DROP_SHADOW(2,3 blur0) */
}
.pledge-cards {
  display: flex;
  flex-direction: column;
  gap: 12px; /* Figma 2159:193（2026-07-31・旧20） */
  width: 100%;
}
.pledge-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 12px; /* 統一 2026-07-31（旧14） */
  /* 2026-08-11 Figma 2989:959：枠・影とも #8FCFD7、影は2px3px（旧：--c-primary・4px4px） */
  border: 1px solid #8FCFD7;
  border-radius: 4px;
  background: #fff;
  box-shadow: 2px 3px 0 #8FCFD7; /* DROP_SHADOW(2,3 blur0) */
}
.pledge-card-title {
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -0.06em;
  line-height: 24px; /* Figma 2159:195（未指定でbody継承の1.6＝32pxになり間隔が広がっていた） */
  color: var(--c-navy);
  transform: skewX(-8deg); /* 2026-07-31ユーザー指定 */
}
.pledge-card-sub {
  font-size: 12px;
  font-weight: 400; /* Figma Regular */
  line-height: 14px; /* Figma 2159:196（旧：body継承1.6＝19.2px） */
  color: var(--c-slate);
}
