/* ============================================================
   サービス一覧 セクション03: HOW TO CHOOSE (3つの問い)
   Figma: 307:227 / 1440 x 1024 / コンテンツ 1100px
   ============================================================ */

.nv-svc-choose{
  --nv-latin:'Montserrat', var(--nv-font);
  background:#F5F9FD;
  padding:88px 0;
}

/* --- 見出し (中央) --- */
.nv-svc-choose__head{
  text-align:center;
  margin-bottom:48px;
}
.nv-svc-choose__eyebrow{
  margin:0;
  font-family:var(--nv-latin);
  font-style:italic;
  font-weight:600;
  font-size:16px;
  letter-spacing:.1em;
  color:var(--nv-main);
}
.nv-svc-choose__title{
  margin:14px 0 0;
  font-size:34px;
  font-weight:700;
  line-height:1.5;
  letter-spacing:.04em;
  color:var(--nv-text);
}
.nv-svc-choose__sub{
  margin:14px 0 0;
  font-size:15px;
  font-weight:500;
  letter-spacing:.04em;
  color:#5B6B7E;
}

/* --- 質問行 --- */
.nv-svc-choose__rows{
  display:flex;
  flex-direction:column;
  gap:24px;
}
.nv-svc-choose__row{
  display:flex;
  align-items:center;
  gap:40px;
  padding:28px 40px;
  background:var(--nv-white);
  border:1px solid #E5EFFA;
  border-radius:12px;
  box-shadow:0 8px 24px rgba(31,58,95,.05);
}
.nv-svc-choose__q{
  flex:0 0 360px;
  display:flex;
  align-items:center;
  gap:16px;
}
.nv-svc-choose__q-badge{
  flex:0 0 48px;
  width:48px;
  height:48px;
  border-radius:12px;
  background:var(--nv-main);
  color:var(--nv-white);
  font-family:var(--nv-latin);
  font-weight:700;
  font-size:18px;
  letter-spacing:.02em;
  display:flex;
  align-items:center;
  justify-content:center;
}
.nv-svc-choose__q-text{
  font-size:20px;
  font-weight:700;
  line-height:1.45;
  letter-spacing:.04em;
  color:var(--nv-text);
}

.nv-svc-choose__answers{
  flex:1 1 auto;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
}
.nv-svc-choose__answer{
  padding:16px 22px;
  border:1px solid #D9D9D9;
  border-radius:10px;
  background:var(--nv-white);
}
.nv-svc-choose__answer--pos{
  border-color:var(--nv-main);
  background:#F4F8FF;
}
.nv-svc-choose__answer-cond{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:15px;
  font-weight:700;
  letter-spacing:.04em;
  color:var(--nv-text);
}
.nv-svc-choose__answer-cond svg{ flex:0 0 auto; }
/* 代替パスのアイコン切替 (PC=空円 / SP=塗りチェック)。既定は PC 表示。 */
.nv-svc-choose__ico{ display:inline-flex; align-items:center; }
.nv-svc-choose__ico--sp{ display:none; }
.nv-svc-choose__answer-result{
  margin-top:10px;
  display:flex;
  align-items:center;
  gap:8px;
  font-size:15px;
  font-weight:700;
  letter-spacing:.04em;
  color:var(--nv-main);
}
.nv-svc-choose__answer:not(.nv-svc-choose__answer--pos) .nv-svc-choose__answer-result{
  color:#5B6B7E;
}
.nv-svc-choose__answer-result svg{ flex:0 0 auto; }

/* --- レスポンシブ --- */
@media (max-width:1024px){
  .nv-svc-choose{ padding:64px 0; }
  .nv-svc-choose__title{ font-size:28px; }
  .nv-svc-choose__row{ gap:28px; padding:24px 28px; }
  .nv-svc-choose__q{ flex-basis:300px; }
  .nv-svc-choose__q-text{ font-size:18px; }
  .nv-svc-choose__answers{ gap:16px; }
}

@media (max-width:767px){
  /* Figma SP 695:27261 実測 (390x1044): 地 #F1F2F4 / eyebrow y40 / cards y213~ / gap16 */
  .nv-svc-choose{ background:#F1F2F4; padding:40px 0; }
  .nv-svc-choose__head{ margin-bottom:24px; }
  /* エボは直立 (Montserrat SemiBold 15) */
  .nv-svc-choose__eyebrow{ font-size:15px; font-style:normal; letter-spacing:.04em; }
  .nv-svc-choose__title{ font-size:24px; }
  /* サブは本文ネイビー・左寄せ (Figma SP) */
  .nv-svc-choose__sub{ font-size:15px; font-weight:400; color:var(--nv-text); text-align:left; }
  .nv-svc-choose__rows{ gap:16px; }

  .nv-svc-choose__row{
    flex-direction:column;
    align-items:stretch;
    gap:8px;
    padding:16px;
    border-radius:8px;
    border-left:6px solid var(--nv-main);   /* 左の青アクセントバー */
  }
  .nv-svc-choose__q{ flex-basis:auto; gap:8px; }
  /* Q バッジ 40x40: 淡い青の丸 + 青文字 (Figma SP) */
  .nv-svc-choose__q-badge{
    flex-basis:40px;
    width:40px;
    height:40px;
    border-radius:50%;
    background:#EAF2FB;
    color:var(--nv-main);
  }
  .nv-svc-choose__q-text{ font-size:18px; line-height:1.5; }

  .nv-svc-choose__answers{ grid-template-columns:1fr; gap:8px; }
  .nv-svc-choose__answer{
    padding:12px;
    border-width:2px;
    border-radius:4px;
  }
  /* 回答は左右分岐で優劣をつけず、両方フラットに中央寄せ (Figma SP) */
  .nv-svc-choose__answer--pos{ border-color:#D9D9D9; background:var(--nv-white); }
  .nv-svc-choose__answer-cond{ justify-content:center; font-size:18px; font-weight:700; }
  .nv-svc-choose__answer-result{ justify-content:center; margin-top:4px; font-size:16px; font-weight:400; color:var(--nv-text); }
  /* 結果テキストは本文ネイビー・矢印だけ青 (両分岐共通) */
  .nv-svc-choose__answer:not(.nv-svc-choose__answer--pos) .nv-svc-choose__answer-result{ color:var(--nv-text); }
  .nv-svc-choose__answer-result svg{ color:var(--nv-main); }
  .nv-svc-choose__ico--pc{ display:none; }
  .nv-svc-choose__ico--sp{ display:inline-flex; }
}
