.voices-section { background: #e8e4d9; overflow: hidden; }
.voices-heading { display: flex; align-items: end; justify-content: space-between; gap: 30px; margin-bottom: 38px; }
.voices-heading h2 { margin-bottom: 14px; }
.voices-heading > div > p:last-child { font-size: 13px; }
.voices-controls { display: flex; align-items: center; gap: 11px; flex-shrink: 0; }
.voices-controls[hidden] { display: none; }
.voices-controls button {
  width: 48px; height: 48px; border: 1px solid #82927c; border-radius: 50%;
  background: #f6f3eb; color: #354335; font-size: 19px; cursor: pointer;
}
.voices-controls button:hover { background: #dfe5d8; }
.voices-controls button[aria-disabled="true"] { opacity: .36; cursor: default; }
.voices-position { min-width: 62px; text-align: center; font: 12px Georgia, serif; }
.voices-track {
  display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 44px) / 3);
  gap: 22px; overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain;
  scrollbar-width: thin; scrollbar-color: #82927c transparent; padding: 8px 5px 16px;
}
.voice-card {
  position: relative; min-width: 0; padding: 9px; background: #fffefa;
  border: 1px solid #abb7a3; border-radius: 130px 130px 20px 20px;
  box-shadow: inset 0 0 0 7px #f1efe7, 0 10px 25px #3543350a;
  scroll-snap-align: start;
}
.voice-card::after {
  content: "＊"; position: absolute; right: 24px; top: 22px; z-index: 1;
  width: 34px; height: 34px; border-radius: 50%; background: #e3e8db;
  display: grid; place-items: center; color: #6d7d66; font-size: 18px;
}
.voice-image { margin: 0; aspect-ratio: .92; border-radius: 121px 121px 10px 10px; overflow: hidden; background: #e6e4de; }
.voice-image img { display: block; width: 100%; height: 100%; object-fit: contain; }
.voice-copy { padding: 25px 20px 24px; }
.voice-copy > span { font: 10px Georgia, serif; color: #637759; letter-spacing: .13em; }
.voice-copy h3 { margin: 11px 0 14px; font-size: 21px; }
.voice-copy p { font-size: 12px; line-height: 2; }
.voices-note { margin-top: 17px; font-size: 10px; color: #606959; }
.voices-track:focus-visible, .voices-controls button:focus-visible { outline: 3px solid #926632; outline-offset: 4px; }
@media (max-width: 960px) {
  .voices-track { grid-auto-columns: calc((100% - 22px) / 2); }
}
@media (max-width: 640px) {
  .voices-heading { display: block; margin-bottom: 25px; }
  .voices-heading h2 { font-size: 28px; }
  .voices-controls { justify-content: flex-end; margin-top: 23px; }
  .voices-track { grid-auto-columns: 88%; gap: 15px; padding-inline: 2px; }
  .voice-card { border-radius: 105px 105px 18px 18px; }
  .voice-image { border-radius: 97px 97px 8px 8px; }
  .voice-copy { padding: 22px 17px; }
}
@media print {
  .voices-track { grid-auto-flow: row; grid-template-columns: repeat(3,1fr); overflow: visible; }
  .voices-controls { display: none; }
}
