/* ===========================
   COMMITMENT Section - SP Styles
   COMMITMENTセクション SP専用スタイル
   適用条件: 959px以下
   =========================== */

/* グリッドレイアウト - SP調整 */
  .ptlCommitHero__grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  
  .ptlCommit-grid .cmt-cards,
  .ptlCommit .cards {
    grid-template-columns: 1fr;
  }
  
  #section-commitment-tiles .ptlNavHero__grid {
    grid-template-columns: 1fr;
  }

/* SP: カードのガラス調背景（issues/PC版と同じ設定） */
#section-commitment .ptlCommitHero__btn {
  background: rgba(255, 255, 255, 0.25);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.12);
  padding: 16px;
  margin-left: auto;
  margin-right: auto;
}

/* SP: カードテキストを白色+シャドウに（半透明背景用） */
#section-commitment .ptlCommitHero__boxTitle {
  color: #fff;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.6);
  font-size: clamp(14px, 3.6vw, 16px);
  font-weight: 600;
}

#section-commitment .ptlCommitHero__boxDesc {
  color: #fff;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.6);
  font-size: clamp(14px, 3.6vw, 16px);
  font-weight: 500;
  line-height: 1.65;
}

/* セクション余白 - style.css (SP section)で統一管理 */
  body #section-commitment {
    margin-bottom: 60px !important;
  }

/* SP: 画像を横長に */
#section-commitment .ptlCommitHero__icon svg,
#section-commitment .ptlCommitHero__icon img {
  aspect-ratio: 16 / 9 !important;
}