@import url('../yoga/style.css');

/* ===== Pilates Article Template v1: 導入文（gymtre v1にはない、Pilates記事固有のH1直後の導入テキスト） ===== */
.article-intro {
  font-size: 14px;
  line-height: 1.75;
  color: #4A5A6A;
  margin: 0 0 20px;
}

/* ===== Pilates Article Template v1（/gymtre/chest/incline-barbell-bench-press/・/gymtre/chest/cable-fly/ の.gt-*をSOTとして移植）
   .rel-slider/.article-card等のRelated共通CSSは import chain（pilates/style.css -> yoga/style.css -> gymtre/style.css）で
   既にgymtre/style.cssから提供されているため、ここでは重複定義しない。
   .gt-*/.disclaimerはgymtre/style.css側に存在しない記事詳細専用CSSのため、Pilates記事共通としてここに集約する
   （gymtre記事自体は個別記事ごとにこのCSSをinline <style>で複製する方式のままであり、本ファイルはPilates専用の重複回避）。 */
.gt-box { background: #EEF6FB; border: 1px solid #DCEAF3; border-radius: 14px; padding: 14px 12px 14px; margin-bottom: 16px; }
.article-section h2.gt-h2 { display: flex; align-items: center; gap: 10px; border-left: 0; padding-left: 0; margin-bottom: 12px; font-size: 18px; font-weight: 900; color: #0F2B4D; }
.gt-ico { flex: 0 0 34px; width: 34px; height: 34px; border-radius: 50%; background: #17A2B8; color: #fff; display: inline-flex; align-items: center; justify-content: center; }
.gt-ico--warn { background: #F26B1D; }
.gt-steps-section.gt-box { background: #EFF6FF; border-color: #BFDBFE; }
.gt-steps-section .gt-h2 { color: #1E3A8A; }
.gt-steps-section .gt-ico { background: #2563EB; }
.gt-points-section.gt-box { background: #F0FDF4; border-color: #BBF7D0; }
.gt-points-section .gt-h2 { color: #14532D; }
.gt-points-section .gt-ico { background: #15803D; }
.gt-problems-section.gt-box { background: #FFF7ED; border-color: #FED7AA; }
.gt-h2--warn { color: #9A3412; }
/* ===== Pilates固有：呼吸と動作のポイント（新規1系統・淡い紫系）。gymtre側には存在しないPilates専用sectionのため既存色と衝突しない ===== */
.gt-breath-section.gt-box { background: #F5F3FF; border-color: #DDD6FE; }
.gt-breath-section .gt-h2 { color: #4C1D95; }
.gt-breath-section .gt-ico { background: #7C3AED; }
.gt-muscle-grid { display: grid; grid-template-columns: 1fr; gap: 12px; }
.gt-mcards { list-style: none; display: grid; grid-template-columns: 1fr; gap: 8px; }
.gt-mcard { display: grid; grid-template-columns: 104px 1fr; gap: 10px; align-items: center; background: #fff; border: 1px solid #E3ECF3; border-radius: 10px; padding: 8px; min-width: 0; }
.gt-mimg { width: 104px; height: auto; aspect-ratio: 3 / 2; object-fit: cover; object-position: center 50%; border-radius: 8px; background: #fff; }
.gt-mbody { min-width: 0; }
.gt-mhead { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; }
.gt-mno { flex: 0 0 22px; width: 22px; height: 22px; border-radius: 50%; background: #9AA8B5; color: #fff; font-size: 12px; font-weight: 900; display: inline-flex; align-items: center; justify-content: center; }
.gt-mcard--main .gt-mno { background: #17A2B8; }
.gt-mtitle { display: flex; flex-direction: column; line-height: 1.3; min-width: 0; }
.gt-role { font-size: 11px; font-weight: 800; color: #5B6B7A; }
.gt-mcard--main .gt-role { color: #0F8CA0; }
.gt-muscle-name { font-size: 14px; font-weight: 900; color: #0F2B4D; }
.article-section p.gt-mdesc { font-size: 12px; line-height: 1.6; color: #4A5A6A; }
.article-section p.gt-muscle-desc { font-size: 13px; line-height: 1.75; color: #333; margin-top: 12px; }
.gt-carousel { position: relative; }
.article-section ol.gt-steps { list-style: none; padding: 2px 2px 8px; margin: 0; display: flex; flex-direction: row; gap: 10px; overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scrollbar-width: none; cursor: grab; user-select: none; -webkit-user-select: none; }
.article-section ol.gt-steps:active { cursor: grabbing; }
.gt-steps img { -webkit-user-drag: none; }
.article-section ol.gt-steps::-webkit-scrollbar { display: none; }
.gt-step { flex: 0 0 calc(100% - 44px); scroll-snap-align: start; min-width: 0; background: #fff; border: 1px solid #E3ECF3; border-radius: 10px; padding: 10px 10px 12px; }
.gt-step-no { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 50%; background: #2563EB; color: #fff; font-size: 13px; font-weight: 900; margin-bottom: 8px; }
.gt-step-title { font-size: 13px; font-weight: 900; line-height: 1.4; margin-bottom: 6px; color: #0F2B4D; }
.article-section p.gt-step-text { font-size: 11.5px; line-height: 1.65; color: #4A5A6A; }
.gt-dots { display: flex; justify-content: center; gap: 6px; margin-top: 4px; min-height: 8px; }
.gt-dot { width: 7px; height: 7px; border-radius: 50%; background: #C9D6E0; padding: 0; border: 0; }
.gt-dot.is-active { background: #2563EB; }
.gt-two { display: block; }
.gt-points { list-style: none; display: flex; flex-direction: column; background: #fff; border: 1px solid #E3ECF3; border-radius: 10px; padding: 4px 12px; }
.gt-points li { position: relative; padding: 9px 0 9px 30px; border-bottom: 1px solid #EEF2F6; }
.gt-points li:last-child { border-bottom: 0; }
.gt-points li::before { content: '\2713'; position: absolute; left: 0; top: 10px; width: 20px; height: 20px; border-radius: 50%; background: #15803D; color: #fff; font-size: 12px; font-weight: 900; display: flex; align-items: center; justify-content: center; line-height: 1; }
.gt-point-title { display: block; font-size: 13.5px; font-weight: 900; line-height: 1.4; color: #0F2B4D; margin-bottom: 2px; }
.gt-point-text { font-size: 12.5px; line-height: 1.55; color: #333; margin: 0; }
.article-section ol.gt-problems { list-style: none; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.gt-problem { display: flex; gap: 10px; align-items: center; background: #fff; border: 1px solid #E3ECF3; border-radius: 10px; padding: 10px 12px; }
.gt-problem-no { flex: 0 0 24px; width: 24px; height: 24px; border-radius: 50%; background: #F26B1D; color: #fff; font-size: 13px; font-weight: 900; display: inline-flex; align-items: center; justify-content: center; }
.gt-problem-body { flex: 1; min-width: 0; }
.gt-problem-title { font-size: 13.5px; font-weight: 900; line-height: 1.45; margin-bottom: 2px; color: #0F2B4D; }
.article-section p.gt-problem-text { font-size: 12px; line-height: 1.6; color: #5A6876; }
@media (min-width: 768px) {
  .gt-box { padding: 18px 14px 18px; }
  .article-section h2.gt-h2 { font-size: 20px; }
  .gt-mcards { grid-template-columns: repeat(3, 1fr); gap: 10px; }
  .gt-mcards--2 { grid-template-columns: repeat(2, 1fr); }
  .gt-mcard { grid-template-columns: 1fr; gap: 8px; align-items: start; padding: 10px; }
  .gt-mimg { width: 100%; aspect-ratio: 16 / 10; }
  .gt-muscle-name { font-size: 15px; }
  .article-section p.gt-mdesc { font-size: 12.5px; }
  .article-section p.gt-muscle-desc { font-size: 14px; }
  .gt-step { flex: 0 0 calc((100% - 30px) / 4.3); padding: 12px 12px 14px; }
  .gt-step-title { font-size: 14px; }
  .article-section p.gt-step-text { font-size: 12.5px; }
  .gt-point-title { font-size: 14px; }
  .gt-point-text { font-size: 13px; }
  .gt-problem-title { font-size: 14px; }
  .article-section p.gt-problem-text { font-size: 12.5px; }
}
@media (min-width: 960px) {
  .gt-two { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; align-items: stretch; }
  .gt-two .gt-box { margin-bottom: 16px; }
}
.disclaimer { background: #FFFBEB; border: 1px solid #FDE68A; border-radius: 8px; padding: 12px 14px; display: flex; gap: 10px; align-items: flex-start; margin-bottom: 20px; }
.disc-icon { flex-shrink: 0; width: 28px; height: 28px; border-radius: 50%; background: #F59E0B; display: flex; align-items: center; justify-content: center; font-size: 14px; color: #fff; font-weight: 900; line-height: 1; margin-top: 1px; }
.disc-label { font-size: 11px; font-weight: 800; color: #92400E; letter-spacing: .04em; margin-bottom: 4px; display: block; }
.disclaimer p { font-size: 12px; line-height: 1.75; color: #1a1a1a; }
