/* =========================================================
   ひかり訪問看護 — サービス詳細ページスタイル
   ========================================================= */

/* ─── Arkhe コンテナ無効化（全幅レイアウト） ─── */
.page-template-page-service .l-content__body {
  max-width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  display: block !important;
}

/* ─── フェードアップアニメーション ─── */
.fade-up { opacity: 0; transform: translateY(24px); transition: opacity .55s ease, transform .55s ease }
.fade-up.is-visible { opacity: 1; transform: none }

/* ─── サービス概要 ─── */
.sv-overview {
  padding: clamp(64px, 9vw, 120px) var(--gutter);
  background: var(--paper);
}
.sv-overview__lead {
  font-family: var(--serif); font-size: clamp(20px, 2.4vw, 28px);
  line-height: 2; letter-spacing: .06em; color: var(--green-900);
  font-weight: 500; max-width: 840px;
}
.sv-overview__body {
  margin-top: 32px; font-size: 15px; line-height: 2.2;
  color: var(--ink-2); max-width: 760px; letter-spacing: .04em;
}
.sv-overview__body p { margin-bottom: 1.6em }
.sv-overview__body p:last-child { margin-bottom: 0 }

/* ─── 対象となる方 ─── */
.sv-target {
  padding: clamp(64px, 9vw, 120px) var(--gutter);
  background: var(--cream);
}
.sv-target__grid {
  display: grid; grid-template-columns: repeat(2, 1fr);
  gap: 16px; margin-top: 0;
}
.sv-target__item {
  background: var(--paper); padding: 28px 32px;
  display: flex; align-items: flex-start; gap: 18px;
  border: 1px solid rgba(139,111,71,.1); border-radius: 12px;
}
.sv-target__item-icon {
  width: 44px; height: 44px; border-radius: 50%;
  background: var(--green-50); color: var(--green-700);
  display: flex; align-items: center; justify-content: center;
  flex: 0 0 auto;
}
.sv-target__item-icon svg { width: 22px; height: 22px }
.sv-target__item-text { font-family: var(--serif); font-size: 16px; letter-spacing: .04em; line-height: 1.75; color: var(--ink); font-weight: 500 }
.sv-target__item-sub  { display: block; font-family: var(--sans); font-size: 13px; color: var(--ink-3); margin-top: 4px; font-weight: 400; letter-spacing: .02em }

/* ─── ご利用の流れ ─── */
.sv-flow {
  padding: clamp(64px, 9vw, 120px) var(--gutter);
  background: var(--paper);
}
.sv-flow__steps {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 0; position: relative; margin-top: 0;
}
.sv-flow__steps::before {
  content: ""; position: absolute;
  top: 40px; left: calc(100% / 6); right: calc(100% / 6);
  height: 1px; background: var(--line-2); z-index: 0;
}
.sv-flow__step {
  display: flex; flex-direction: column; align-items: center;
  text-align: center; padding: 0 24px; position: relative; z-index: 1;
}
.sv-flow__step-num {
  width: 80px; height: 80px; border-radius: 50%;
  background: var(--green-700); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--latin); font-size: 22px; font-weight: 500;
  letter-spacing: .08em; font-style: italic;
  box-shadow: 0 8px 24px -8px rgba(31,77,58,.45);
  margin-bottom: 24px;
}
.sv-flow__step-title {
  font-family: var(--serif); font-size: 18px; font-weight: 500;
  letter-spacing: .06em; color: var(--green-900); margin-bottom: 12px;
}
.sv-flow__step-body { font-size: 14px; line-height: 2; color: var(--ink-2); letter-spacing: .04em }
.sv-flow__note {
  margin-top: 48px; padding: 24px 28px;
  background: var(--green-50); border-left: 3px solid var(--green-700);
  font-size: 14px; line-height: 2; color: var(--ink-2); letter-spacing: .04em;
}

/* ─── よくある質問 ─── */
.sv-faq {
  padding: clamp(64px, 9vw, 120px) var(--gutter);
  background: var(--cream);
}
.sv-faq__list { display: flex; flex-direction: column; gap: 0; border-top: 1px solid var(--line-2) }
.sv-faq__item { border-bottom: 1px solid var(--line-2) }
.sv-faq__q {
  display: flex; align-items: flex-start; gap: 18px; padding: 24px 4px;
  cursor: pointer; user-select: none;
  font-family: var(--serif); font-size: 17px; font-weight: 500;
  letter-spacing: .04em; color: var(--ink); line-height: 1.7;
  list-style: none; transition: color .2s;
}
.sv-faq__q:hover { color: var(--green-700) }
.sv-faq__q-icon {
  flex: 0 0 32px; height: 32px; border-radius: 50%;
  background: var(--green-700); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--latin); font-size: 14px; font-weight: 500;
  margin-top: 2px; letter-spacing: 0;
}
.sv-faq__q-text { flex: 1 }
.sv-faq__q-arrow {
  flex: 0 0 20px; width: 20px; height: 20px;
  border-right: 1px solid var(--ink-3); border-bottom: 1px solid var(--ink-3);
  transform: rotate(45deg); margin-top: 6px; margin-right: 4px;
  transition: transform .3s ease;
}
.sv-faq__item.open .sv-faq__q-arrow { transform: rotate(-135deg); margin-top: 12px }
.sv-faq__a {
  display: grid; grid-template-rows: 0fr;
  transition: grid-template-rows .35s ease;
}
.sv-faq__item.open .sv-faq__a { grid-template-rows: 1fr }
.sv-faq__a-inner {
  overflow: hidden;
  padding: 0 4px 0 50px;
}
.sv-faq__item.open .sv-faq__a-inner { padding-bottom: 28px }
.sv-faq__a-inner p {
  font-size: 15px; line-height: 2.1; color: var(--ink-2);
  letter-spacing: .04em; margin: 0;
}

/* ─── 関連サービス ─── */
.sv-related {
  padding: clamp(64px, 9vw, 120px) var(--gutter);
  background: var(--paper);
}
.sv-related__grid {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 1px; background: var(--line-2); border: 1px solid var(--line-2);
}
.sv-related__card {
  background: var(--paper); padding: 32px 28px;
  display: flex; flex-direction: column; gap: 14px;
  transition: background .3s;
}
.sv-related__card:hover { background: #fff }
.sv-related__num { font-family: var(--latin); font-style: italic; font-size: 11px; letter-spacing: .2em; color: var(--brown-500) }
.sv-related__card h3 {
  font-family: var(--serif); font-weight: 500; font-size: 19px;
  letter-spacing: .06em; margin: 0; color: var(--green-900); line-height: 1.5;
}
.sv-related__card h3 .en {
  display: block; font-family: var(--latin); font-style: italic;
  font-size: 10px; letter-spacing: .22em; color: var(--brown-500);
  margin-top: 5px; font-weight: 400;
}
.sv-related__card p { font-size: 13px; line-height: 1.9; color: var(--ink-3); margin: 0; letter-spacing: .03em }
.sv-related__link {
  margin-top: auto; font-family: var(--serif); font-size: 13px;
  letter-spacing: .1em; color: var(--green-700); font-weight: 500;
}

/* ─── レスポンシブ ─── */
@media (max-width: 900px) {
  .sv-flow__steps  { grid-template-columns: 1fr; gap: 40px }
  .sv-flow__steps::before { display: none }
  .sv-related__grid { grid-template-columns: 1fr }
}
@media (max-width: 680px) {
  .sv-target__grid { grid-template-columns: 1fr }
  .sv-faq__q       { font-size: 15px; padding: 20px 4px }
  .sv-faq__a-inner { padding-left: 42px }
}