/* ===== セラピスト詳細ページ ===== */
.therapist-single {
  background: var(--color-white);
}

.therapist-single__inner {
  max-width: calc(1100px + 2 * var(--container-padding));
  margin: 0 auto;
  padding: 0 var(--container-padding);
}

/* タイトル */
.therapist-single__title {
  font-family: var(--font-mincho);
  font-weight: 500;
  font-size: clamp(26px, calc(21.24px + 1.40vw), 32px);
  color: var(--color-primary);
  text-align: center;
  margin: 0;
  padding: clamp(32px, 5vw, 80px) var(--container-padding) clamp(20px, 2.5vw, 36px);
}

@media (min-width: 769px) {
  .therapist-single__title {
    font-size: clamp(44px, calc(32.00px + 1.56vw), 62px);
    padding-bottom: clamp(56px, 6vw, 96px);
  }
}

/* プロフィール（白背景） */
.therapist-single__profile {
  background: var(--color-white);
  padding: 0 0 clamp(40px, 6vw, 80px);
}

.therapist-single__header {
  display: grid;
  grid-template-columns: 35.5% 1fr;
  column-gap: 6.5%;
  align-items: center;
  max-width: 1100px;
  margin: 0 auto;
}

.therapist-single__photo {
  grid-column: 1;
  grid-row: 1;
  width: 100%;
  max-width: 150px;
  aspect-ratio: 11 / 15;
  overflow: hidden;
  background: var(--color-bg-gray);
  position: relative;
  justify-self: center;
}

.therapist-single__info {
  grid-column: 2;
  grid-row: 1;
  width: 100%;
  text-align: center;
}


.therapist-single__photo img,
.therapist-single__photo-placeholder {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
}

.therapist-single__photo img {
  object-fit: cover;
  object-position: center top;
}

.therapist-single__photo-placeholder {
  background: linear-gradient(135deg, #EFE4F5 0%, #F7CEED 100%);
}

.therapist-single__name {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  margin: 0 0 clamp(12px, 2vw, 20px);
}

.therapist-single__location {
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: clamp(13px, calc(10.62px + 0.70vw), 16px);
  color: var(--color-primary);
}

.therapist-single__location-link {
  color: inherit;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;
}

.therapist-single__name-text {
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: clamp(15px, calc(12.62px + 0.70vw), 18px);
  color: var(--color-text);
}

.therapist-single__meta {
  display: grid;
  grid-template-columns: 1fr;
  justify-content: start;
  gap: clamp(2px, 0.4vw, 6px);
  margin: 0 0 clamp(16px, 2.5vw, 28px);
  font-family: var(--font-sans);
  font-weight: 400;
  font-size: clamp(13px, calc(10.62px + 0.70vw), 16px);
  line-height: 1.5;
  color: var(--color-text);
}

.therapist-single__meta-item {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0;
  margin: 0;
}

/* 項目・内容は途中で割らず、1行に入りきらない場合は内容を項目の下へ丸ごと送る */
.therapist-single__meta dt,
.therapist-single__meta dd {
  margin: 0;
  font-weight: inherit;
  white-space: nowrap;
}

/* 区切りの「／」は項目側（上）に付ける。折り返しても内容だけが下へ回る */
.therapist-single__meta dt::after {
  content: "／";
}

.therapist-single__stars {
  color: var(--color-secondary);
  letter-spacing: 0.05em;
}

.therapist-single__comment {
  grid-column: 1 / -1;
  grid-row: 2;
  width: 100%;
  font-family: var(--font-sans);
  font-weight: 400;
  font-size: clamp(12px, calc(10.41px + 0.47vw), 14px);
  line-height: 1.6;
  color: var(--color-text);
  margin: clamp(20px, 3vw, 40px) 0 0;
  padding-top: clamp(16px, 2vw, 24px);
  border-top: 1px solid #D3D3D3;
  text-align: left;
}

/* ご予約はコチラ CTA（Amazon購入ボタンと同デザイン） */
.therapist-single__cta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.4em;
  width: 100%;
  max-width: 180px;
  aspect-ratio: 180 / 35;
  margin: clamp(24px, 5vw, 32px) 0 0;
  background: linear-gradient(92.46deg, var(--color-white) 0%, var(--color-white) 50%, #FFFFB6 53%, var(--color-secondary) 72%);
  background-size: 350% 100%;
  background-position: 0% 0%;
  background-repeat: no-repeat;
  border: 2px solid var(--color-secondary);
  border-radius: 100px;
  color: var(--color-secondary);
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: 14px;
  text-decoration: none;
  transition: background-position 0.5s ease, color 0.3s ease;
}

.therapist-single__cta:hover {
  background-position: 100% 0%;
  color: var(--color-white);
}

.therapist-single__cta-icon {
  display: inline-block;
  width: 1em;
  height: 1em;
  background-color: currentColor;
  -webkit-mask-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'/%3E%3Cpolyline points='15 3 21 3 21 9'/%3E%3Cline x1='10' y1='14' x2='21' y2='3'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'/%3E%3Cpolyline points='15 3 21 3 21 9'/%3E%3Cline x1='10' y1='14' x2='21' y2='3'/%3E%3C/svg%3E");
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
}

/* PC: 写真左 + 情報右 */
@media (min-width: 769px) {
  .therapist-single__header {
    grid-template-columns: 31.82% 1fr;
    align-items: start;
  }

  .therapist-single__photo {
    grid-row: 1 / span 2;
    align-self: start;
    aspect-ratio: 4 / 5;
    max-width: none;
  }

  .therapist-single__info {
    text-align: left;
  }

  .therapist-single__comment {
    grid-column: 2;
    grid-row: 2;
    margin-top: clamp(16px, 2vw, 24px);
  }

  .therapist-single__name {
    flex-direction: row;
    align-items: baseline;
    gap: clamp(20px, calc(11.98px + 1.04vw), 32px);
    flex-wrap: wrap;
  }

  .therapist-single__location {
    font-size: clamp(16px, calc(10.66px + 0.69vw), 24px);
  }

  .therapist-single__name-text {
    font-size: clamp(18px, calc(11.32px + 0.87vw), 28px);
  }

  .therapist-single__meta {
    grid-template-columns: repeat(2, max-content);
    justify-content: start;
    column-gap: clamp(24px, calc(13.31px + 1.39vw), 40px);
    font-size: clamp(14px, calc(10.00px + 0.52vw), 20px);
  }

  .therapist-single__comment {
    font-size: clamp(14px, calc(10.00px + 0.52vw), 20px);
  }

  .therapist-single__cta {
    max-width: clamp(245px, calc(174.84px + 9.12vw), 350px);
    aspect-ratio: 350 / 80;
    margin: clamp(28px, 3.5vw, 56px) 0 0;
    font-size: clamp(20px, calc(14.66px + 0.70vw), 28px);
  }
}

/* 詳細リスト（グラデーション背景） */
.therapist-single__detail {
  background: linear-gradient(137.69deg, #FDFAFF 4.92%, #FFF7FD 122.42%);
  padding: clamp(32px, 5vw, 64px) 0 clamp(40px, 6vw, 80px);
}

.therapist-single__list {
  margin: 0 auto;
  padding: 0;
  max-width: 1100px;
}

.therapist-single__list-item {
  padding: clamp(12px, 1.8vw, 20px) 0;
  border-bottom: 1px solid #D3D3D3;
}

.therapist-single__list-item:last-child {
  border-bottom: none;
}

.therapist-single__list dt {
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: clamp(13px, calc(10.62px + 0.70vw), 16px);
  color: var(--color-primary);
  margin: 0 0 4px;
}

.therapist-single__list dd {
  font-family: var(--font-sans);
  font-weight: 400;
  font-size: clamp(13px, calc(10.62px + 0.70vw), 16px);
  line-height: 1.7;
  color: var(--color-text);
  margin: 0;
}

@media (min-width: 769px) {
  .therapist-single__list dt,
  .therapist-single__list dd {
    font-size: clamp(16px, calc(10.66px + 0.69vw), 24px);
  }
}

/* 戻るボタン */
.therapist-single__back {
  background: linear-gradient(137.69deg, #FDFAFF 4.92%, #FFF7FD 122.42%);
  padding: clamp(40px, 6vw, 80px) var(--container-padding);
  text-align: center;
}

/* 上に詳細・お客様の声がある場合は、それらの下余白で足りるため上パディングを打ち消す */
.therapist-single__detail + .therapist-single__back,
.therapist-voices + .therapist-single__back {
  padding-top: 0;
}

.therapist-single__back-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  background: linear-gradient(92.46deg, var(--color-white) 0%, var(--color-white) 50%, #FFEAFA 53%, var(--color-primary) 72%);
  background-size: 350% 100%;
  background-position: 0% 0%;
  background-repeat: no-repeat;
  color: var(--color-primary);
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: clamp(14px, calc(11.62px + 0.70vw), 16px);
  width: 100%;
  max-width: 340px;
  height: clamp(50px, 6vw, 64px);
  border: 2px solid var(--color-primary);
  border-radius: 100px;
  text-decoration: none;
  transition: background-position 0.5s ease, color 0.3s ease;
}

.therapist-single__back-link:hover {
  background-position: 100% 0%;
  color: var(--color-white);
}

/* 戻るボタン矢印（CSS描画） */
.therapist-single__back-arrow {
  position: relative;
  display: inline-block;
  width: 18px;
  height: 12px;
}

.therapist-single__back-arrow::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: calc(50% - 1px);
  height: 2px;
  background: currentColor;
}

.therapist-single__back-arrow::before {
  content: "";
  position: absolute;
  right: 0;
  top: calc(50% - 1px);
  width: 9px;
  height: 2px;
  background: currentColor;
  transform: rotate(40deg);
  transform-origin: 100% 50%;
}

/* ===== セラピスト詳細ページ：お客様のお声セクション ===== */
.therapist-voices {
  background: linear-gradient(137.69deg, #FDFAFF 4.92%, #FFF7FD 122.42%);
  padding: clamp(40px, 6vw, 80px) 0;
}

.therapist-voices__inner {
  max-width: calc(1100px + 2 * var(--container-padding));
  margin: 0 auto;
  padding: 0 var(--container-padding);
}

.therapist-voices__title {
  font-family: var(--font-mincho);
  font-weight: 500;
  font-size: clamp(22px, calc(17.23px + 1.40vw), 28px);
  color: var(--color-primary);
  text-align: center;
  margin: 0 0 clamp(28px, 4vw, 56px);
  line-height: 1.5;
}

.therapist-voices__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: clamp(20px, 3vw, 40px);
}

.therapist-voices__list-item {
  margin: 0;
}

/* ページネーション（お客様のお声アーカイブと同デザイン） */
.therapist-voices__pagination {
  margin-top: clamp(32px, 5vw, 56px);
}

.therapist-voices__pagination .page-numbers {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(8px, 1.5vw, 16px);
  flex-wrap: wrap;
}

.therapist-voices__pagination .page-numbers li {
  margin: 0;
}

.therapist-voices__pagination .page-numbers > li > a,
.therapist-voices__pagination .page-numbers > li > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 32px;
  height: 32px;
  font-family: 'Inter', sans-serif;
  font-weight: 400;
  font-size: clamp(15px, calc(12.62px + 0.70vw), 18px);
  color: var(--color-text);
  text-decoration: none;
}

.therapist-voices__pagination .page-numbers > li > span.current {
  width: clamp(20px, calc(4.11px + 4.67vw), 40px);
  height: clamp(20px, calc(4.11px + 4.67vw), 40px);
  min-width: 0;
  background: linear-gradient(137.69deg, #C8A7E9 4.92%, #E1A4D1 122.42%);
  border-radius: 50%;
  color: var(--color-white);
  font-weight: 500;
}

.therapist-voices__pagination .dots {
  color: var(--color-text);
}

.therapist-voices__pagination .page-numbers > li > a.prev,
.therapist-voices__pagination .page-numbers > li > a.next {
  width: clamp(20px, calc(4.11px + 4.67vw), 40px);
  height: clamp(20px, calc(4.11px + 4.67vw), 40px);
  min-width: 0;
  padding: 0;
  border-radius: 50%;
  transition: opacity 0.3s ease;
}

.therapist-voices__pagination .prev {
  background: var(--color-primary);
}

.therapist-voices__pagination .next {
  background: var(--color-white);
}

.therapist-voices__pagination .prev:hover,
.therapist-voices__pagination .next:hover {
  opacity: 0.85;
}

.therapist-voices__pagination-arrow {
  display: inline-block;
  width: clamp(14px, calc(7.64px + 1.87vw), 22px);
  height: clamp(14px, calc(7.64px + 1.87vw), 22px);
  background: currentColor;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
}

.therapist-voices__pagination-arrow--prev {
  -webkit-mask-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='15 18 9 12 15 6'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='15 18 9 12 15 6'/%3E%3C/svg%3E");
}

.therapist-voices__pagination-arrow--next {
  -webkit-mask-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 18 15 12 9 6'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 18 15 12 9 6'/%3E%3C/svg%3E");
}

.therapist-voices__pagination .prev .therapist-voices__pagination-arrow {
  background: var(--color-white);
}

.therapist-voices__pagination .next .therapist-voices__pagination-arrow {
  background: #D3D3D3;
}

@media (min-width: 769px) {
  .therapist-voices__title {
    font-size: clamp(28px, calc(13.30px + 1.91vw), 50px);
    margin-bottom: clamp(48px, 5vw, 80px);
  }
}
