/* ご供養者さまのご感想：一覧カード */

.voice-page {
 padding-bottom: clamp(64px, 7vw, 110px);
}

.voice-page__grid {
 display: grid;
 grid-template-columns: minmax(0, 1fr);
 gap: clamp(24px, 2.5vw, 40px);
 align-items: stretch;
}

.voice-page-card {
 width: auto;
 min-width: 0;
 height: 100%;
 flex-basis: auto;
}

.voice-page-card__title {
 position: relative;
 margin-bottom: 0;
 padding: 0 0 16px;
 color: var(--color-brand-gold-dark);
 font-size: var(--font-size-24);
 font-weight: var(--font-weight-bold);
 line-height: 1.55;
}

.voice-page-card__title::after {
 content: '';
 position: absolute;
 left: 0;
 bottom: 0;
 width: 72px;
 height: 3px;
 border-radius: 999px;
 background: var(--color-accent-pink);
}

.voice-page-card__body {
 flex: 1;
 margin-top: 20px;
 color: #4d5053;
 font-size: var(--font-size-18);
 line-height: 1.9;
}

.voice-page-card__body > :first-child {
 margin-top: 0;
}

.voice-page-card__body > :last-child {
 margin-bottom: 0;
}

.voice-page-card__comment {
 margin-top: 24px;
 padding: 18px;
 font-size: var(--font-size-16);
 line-height: 1.8;
}

.voice-page-card__comment .home-voice-card__comment-label {
 font-size: var(--font-size-18);
}

.voice-page-card__comment p:not(.home-voice-card__comment-label) {
 display: block;
 overflow: visible;
 -webkit-box-orient: initial;
 -webkit-line-clamp: unset;
}

.voice-page__empty {
 margin: 0;
 padding: 28px;
 border: 1px solid var(--color-brand-gold-border);
 border-radius: 20px;
 background: var(--color-white);
 font-size: var(--font-size-18);
 text-align: center;
}

.voice-pagination {
 margin-top: clamp(38px, 4vw, 64px);
}

.voice-pagination ul.page-numbers {
 display: flex;
 flex-wrap: wrap;
 align-items: center;
 justify-content: center;
 gap: 10px;
 margin: 0;
 padding: 0;
 list-style: none;
}

.voice-pagination ul.page-numbers li {
 margin: 0;
}

.voice-pagination a.page-numbers,
.voice-pagination span.page-numbers {
 box-sizing: border-box;
 display: inline-flex;
 min-width: 48px;
 min-height: 48px;
 align-items: center;
 justify-content: center;
 gap: 8px;
 padding: 8px 14px;
 border: 2px solid var(--color-accent-pink-border);
 border-radius: 999px;
 background: var(--color-white);
 color: var(--color-accent-pink-dark);
 font-size: var(--font-size-16);
 font-weight: var(--font-weight-bold);
 line-height: 1;
 text-decoration: none;
 transition: background-color .25s ease, border-color .25s ease, color .25s ease;
}

.voice-pagination span.page-numbers.current,
.voice-pagination a.page-numbers:hover {
 border-color: var(--color-accent-pink);
 background: var(--color-accent-pink);
 color: var(--color-white);
}

.voice-pagination a.page-numbers:focus-visible {
 outline: 3px solid var(--color-focus);
 outline-offset: 4px;
}

.voice-pagination .prev,
.voice-pagination .next {
 padding-inline: 20px;
}

/* ご供養者さまの声：詳細カード */
.voice-single {
 padding-bottom: clamp(64px, 7vw, 110px);
}

.voice-single__card {
 height: auto;
}

.voice-single__meta {
 margin-top: 0;
}

.voice-single__body {
 margin-top: 22px;
}

.voice-single__comment {
 margin-bottom: 0;
}

.voice-single__actions {
 display: flex;
 justify-content: center;
 margin-top: clamp(24px, 3vw, 38px);
}

.voice-single__back {
 display: inline-flex;
 min-height: 52px;
 align-items: center;
 justify-content: center;
 gap: 10px;
 padding: 10px 24px;
 border: 2px solid var(--color-accent-pink-border);
 border-radius: 999px;
 background: var(--color-white);
 color: var(--color-accent-pink-dark);
 font-size: var(--font-size-16);
 font-weight: var(--font-weight-bold);
 text-decoration: none;
 transition: background-color .25s ease, border-color .25s ease, color .25s ease;
}

.voice-single__back:hover {
 border-color: var(--color-accent-pink);
 background: var(--color-accent-pink);
 color: var(--color-white);
}

.voice-single__back:focus-visible {
 outline: 3px solid var(--color-focus);
 outline-offset: 4px;
}

@media (max-width: 767px) {
 .voice-page__grid {
  grid-template-columns: minmax(0, 1fr);
  gap: 20px;
 }

 .voice-page-card {
  height: auto;
  padding: 22px 18px;
 }

 .voice-page-card__title {
  font-size: var(--font-size-21);
 }

 .voice-page-card__body,
 .voice-page-card__comment {
  font-size: var(--font-size-16);
 }

 .voice-pagination ul.page-numbers {
  gap: 7px;
 }

 .voice-pagination a.page-numbers,
 .voice-pagination span.page-numbers {
  min-width: 42px;
  min-height: 42px;
  padding: 7px 11px;
  font-size: var(--font-size-14);
 }

 .voice-pagination .prev,
 .voice-pagination .next {
  padding-inline: 14px;
 }

 .voice-single__back {
  box-sizing: border-box;
  width: 100%;
 }
}