/* 仕分けエージェント 製品ページ固有のスタイル */

/* 製品テーマカラー */
:root{
  --bs-primary:#173A5E;
  --bs-link-color:#173A5E;

  --prism-cta:#173A5E;
  --prism-cta-hover:#143150;
  --prism-accent:#6495ED;
  --prism-accent-bg:#EAF2FA;
  --prism-accent2:#B85A12;

  /* ファーストビューの色 */
  --prism-hero-bg:#173A5E;
  --prism-hero-shade:#081626;
  --prism-hero-ray-1:#C4D9F2;
  --prism-hero-ray-2:#FFFFFF;
  --prism-hero-label:#EAF2FA;
  --prism-hero-badge-a-bg:#EAF2FA;
  --prism-hero-badge-a-fg:#173A5E;
  --prism-hero-badge-b-bg:#B85A12;
  --prism-hero-badge-b-fg:#FFFFFF;
}

html,body{ overflow-x:hidden; }
html{ scroll-behavior:smooth; }
.prism-container{ max-width:1180px; }

/* フォーカスリング */
a:focus-visible, button:focus-visible, summary:focus-visible, .prism-btn:focus-visible{
  outline:3px solid var(--prism-cta); outline-offset:2px;
}

/* 色帯上のボタン */
.sa-band a:focus-visible, .sa-dl a:focus-visible{ outline-color:var(--prism-base); }

/* 見出しの改行（文節単位） */
.sa-label{ word-break:auto-phrase; overflow-wrap:anywhere; }
.sa-acc--more{ margin-top:32px; }

.sa-crumb{ padding:20px 0 24px; }
.sa-crumb .prism-breadcrumb{ margin:0; }

/* Pain & Solution */
.sa-pain-list{ display:grid; grid-template-columns:1fr; gap:24px; }
@media (min-width:768px){
  .sa-pain-list{ grid-template-columns:repeat(3,1fr); align-items:stretch; }
}
.sa-pain-card{ background:var(--prism-base); border:1px solid var(--prism-rule); border-radius:12px; padding:32px; }
.sa-pain-card h3{ font-size:var(--fs-18); }
.sa-label{ font-size:var(--fs-16); font-weight:700; color:var(--prism-ink-sub); margin-bottom:12px; display:block; }
.sa-solve{ margin-top:24px; padding-top:24px; border-top:1px solid var(--prism-rule); }
.sa-solve .sa-label{ color:var(--prism-cta); }
.sa-pain-close{ margin-top:48px; text-align:center; font-size:var(--fs-24); font-weight:700; line-height:1.6; color:var(--prism-cta); }
@media (max-width:767.98px){ .sa-pain-close{ font-size:var(--fs-20); margin-top:40px; } }

/* 折り畳み */
.sa-acc{ border-top:1px solid var(--prism-rule); }
.sa-acc:last-child{ border-bottom:1px solid var(--prism-rule); }
.sa-acc > summary{ list-style:none; cursor:pointer; min-height:44px; padding:12px 40px 12px 0; position:relative; font-weight:700; line-height:1.6; }
.sa-acc > summary::-webkit-details-marker{ display:none; }
.sa-acc > summary::after{
  content:"+"; position:absolute; right:4px; top:50%; transform:translateY(-50%);
  width:28px; height:28px; border:1px solid var(--prism-rule); border-radius:50%;
  display:flex; align-items:center; justify-content:center; color:var(--prism-cta); font-weight:700; line-height:1;
}
.sa-acc[open] > summary::after{ content:"−"; }
.sa-acc__body{ padding:4px 0 20px; }
.sa-acc__body > * + *{ margin-top:12px; }
.sa-list{ margin:0; padding-left:1.4em; }
.sa-list li + li{ margin-top:6px; }

/* Features（Bento Grid） */
.sa-bento{ display:grid; grid-template-columns:1fr; gap:16px; }
@media (min-width:768px){
  .sa-bento{ grid-template-columns:repeat(2,1fr); }
  .sa-tile--full, .sa-tile--photo{ grid-column:span 2; }
}
@media (min-width:992px){
  .sa-bento{ grid-template-columns:repeat(4,1fr); }
  .sa-bento .sa-tile--photo{ grid-column:span 4; display:grid; grid-template-columns:2fr 3fr; column-gap:48px; align-content:start; }
  .sa-bento .sa-tile--photo > :not(.sa-chart){ grid-column:1; }
  .sa-bento .sa-tile--photo > .sa-badge{ justify-self:start; }
  .sa-bento .sa-tile--photo > .sa-chart{ grid-column:2; grid-row:1 / span 4; margin-top:0; }
  .sa-tile--full{ grid-column:span 4; }
}
.sa-tile{
  position:relative; overflow:hidden; display:flex; flex-direction:column;
  background:var(--prism-base-alt); border:1px solid var(--prism-rule); border-radius:12px; padding:28px;
  transition:box-shadow .2s ease-out, transform .2s ease-out;
}
.sa-tile > *{ position:relative; }
.sa-tile:hover{ box-shadow:0 8px 20px rgba(51,51,51,.08); transform:translateY(-2px); }
@media (prefers-reduced-motion: reduce){
  .sa-tile{ transition:none; }
  .sa-tile:hover{ transform:none; }
  html{ scroll-behavior:auto; }
}
.sa-tile h3{ margin-bottom:8px; }
.sa-tile > p{ color:var(--prism-ink-sub); }
.sa-tile .sa-acc{ margin-top:auto; }
.sa-tile > p + .sa-acc{ margin-top:20px; }
.sa-icon{
  width:48px; height:48px; flex:0 0 auto; margin-bottom:16px;
  display:flex; align-items:center; justify-content:center;
  border:1px solid var(--prism-rule); border-radius:10px; background:var(--prism-base); color:var(--prism-cta); font-size:22px;
}
.sa-tile--photo{ background:var(--prism-base); border-color:var(--prism-cta); }
.sa-tile--photo h3{ font-size:var(--fs-24); }
.sa-tile--photo /* 仕組みの図解 */
.sa-chart{ margin:24px 0 0; }
.sa-chart__cap{ font-size:var(--fs-16); font-weight:700; color:var(--prism-ink-sub); margin-bottom:16px; }
.sa-flow, .sa-flow ol, .sa-folders{ list-style:none; margin:0; padding:0; }
.sa-flow{ position:relative; }
.sa-flow::before{ content:""; position:absolute; z-index:0; left:19px; top:20px; bottom:20px; width:2px; background:var(--prism-rule); }
.sa-step{ position:relative; z-index:1; display:grid; grid-template-columns:40px 1fr; column-gap:16px; align-items:start; }
.sa-flow > li + li, .sa-group ol > li + li{ margin-top:20px; }
.sa-step__no{
  width:40px; height:40px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background:var(--prism-base); border:2px solid var(--prism-cta); color:var(--prism-cta);
  font-size:var(--fs-16); font-weight:700; line-height:1; font-variant-numeric:tabular-nums;
}
.sa-step__title{ font-weight:700; line-height:1.6; padding-top:7px; }
.sa-step__sub{ color:var(--prism-ink-sub); line-height:1.7; margin-top:2px; }
/* 自動で実行する範囲 */
.sa-group{ position:relative; z-index:1; margin-left:-12px; padding:16px 16px 20px 12px; background:var(--prism-accent-bg); border-radius:16px; }
.sa-group::before{ content:""; position:absolute; left:31px; top:0; bottom:0; width:2px; background:var(--prism-accent); }
.sa-group__label{ position:relative; margin:0 0 16px 56px; font-weight:700; color:var(--prism-cta); line-height:1.5; }
.sa-group__label small{ display:block; font-size:var(--fs-16); font-weight:400; color:var(--prism-ink-sub); }
.sa-group .sa-step__no{ background:var(--prism-cta); color:var(--prism-base); }
/* フォルダ */
.sa-folders{ display:flex; flex-wrap:wrap; gap:16px 8px; margin-top:20px; }
.sa-folder{
  position:relative; flex:1 1 88px; padding:8px 10px 10px; background:var(--prism-base);
  border:1px solid var(--prism-rule); border-radius:0 6px 6px 6px; line-height:1.5;
}
.sa-folder::before{
  content:""; position:absolute; left:-1px; top:-8px; width:44%; height:8px;
  background:var(--prism-base); border:1px solid var(--prism-rule); border-bottom:none; border-radius:6px 6px 0 0;
}
.sa-folder__name{ display:block; font-weight:700; white-space:nowrap; }
.sa-folder__to{ display:block; color:var(--prism-ink-sub); white-space:nowrap; }
.sa-folder.is-main{ border-color:var(--prism-cta); }
.sa-folder.is-main::before{ border-color:var(--prism-cta); }
.sa-folder.is-main .sa-folder__name, .sa-folder.is-main .sa-folder__to{ color:var(--prism-cta); }
.sa-flow__note{ margin-top:10px; color:var(--prism-ink-sub); }
/* ゴール */
.sa-step--goal .sa-step__no{ background:var(--prism-accent2); border-color:var(--prism-accent2); color:var(--prism-base); }
.sa-step--goal .sa-step__title{ padding-top:7px; color:var(--prism-accent2); }
.sa-badge{
  display:inline-block; padding:2px 12px; border-radius:999px; background:var(--prism-accent2); color:var(--prism-base);
  font-size:var(--fs-16); font-weight:700; line-height:1.6; margin-bottom:12px; align-self:flex-start;
}

/* Comparison */
.prism-table tbody th{ font-weight:700; background:var(--prism-base-alt); white-space:nowrap; }
@media (max-width:767.98px){
  .prism-table tbody th{ white-space:normal; min-width:8em; }
}
.prism-table tbody td:nth-child(2){ background:var(--prism-accent-bg); border-left:2px solid var(--prism-cta); border-right:2px solid var(--prism-cta); }
.prism-table tbody tr:last-child td:nth-child(2){ border-bottom:2px solid var(--prism-cta); }
.prism-table thead th.is-own{ border-left:2px solid var(--prism-cta); border-right:2px solid var(--prism-cta); border-top:2px solid var(--prism-cta); }

/* CTA（資料ダウンロード） */
.sa-dl{ background:var(--prism-cta); color:var(--prism-base); border-radius:16px; padding:56px 40px; text-align:center; }
.sa-dl h2{ color:var(--prism-base); }
.sa-dl p{ margin-top:16px; color:var(--prism-base); }
.sa-dl .prism-btn{ margin-top:32px; }
@media (max-width:767.98px){ .sa-dl{ padding:40px 20px; } }

/* Pricing */
.sa-price{ max-width:720px; }
.sa-price .prism-price-card{ flex:0 1 360px; }
.sa-price-note{ margin-top:16px; color:var(--prism-ink-sub); }

/* Specs */
.sa-specs{ display:grid; grid-template-columns:1fr; gap:16px; }
@media (min-width:768px){ .sa-specs{ grid-template-columns:repeat(2,1fr); } }
.sa-spec{ background:var(--prism-base); border:1px solid var(--prism-rule); border-radius:12px; padding:28px; }
.sa-spec h3{ margin-bottom:12px; }
.sa-spec ul{ margin:0; padding-left:1.2em; }
.sa-spec li + li{ margin-top:6px; }

/* FAQ */
.sa-faq-group + .sa-faq-group{ margin-top:40px; }
.sa-faq-group h3{ font-size:var(--fs-20); margin-bottom:12px; }
.sa-faq .sa-acc > summary{ padding-left:40px; }
.sa-faq .sa-acc > summary::before{
  content:"Q"; position:absolute; left:0; top:12px; width:28px; height:28px; border-radius:50%;
  background:var(--prism-cta); color:var(--prism-base); display:flex; align-items:center; justify-content:center; font-size:var(--fs-16); line-height:1;
}
.sa-faq .sa-acc__body{ padding-left:40px; }

/* Footer CTA */
.sa-band{ background:var(--prism-cta); color:var(--prism-base); padding:72px 0; text-align:center; }
.sa-band h2{ color:var(--prism-base); }
.sa-band p{ margin-top:16px; }
.sa-foot-actions{ display:flex; justify-content:center; gap:16px; flex-wrap:wrap; margin-top:32px; }
.sa-foot-actions .prism-btn{ padding:20px 48px; font-size:var(--fs-20); }
.sa-foot-info{ padding:56px 0; }
.sa-related{ margin-bottom:32px; }
.sa-related-label{ font-weight:700; margin-bottom:8px; }
.sa-related ul{ list-style:none; margin:0; padding:0; }
.sa-company p{ color:var(--prism-ink-sub); }
.sa-company p + p{ margin-top:4px; }
.sa-company .sa-date{ margin-top:16px; }