/* Student voices and the school introduction's link to this page. */
.voices-page { --voice-ink:#144955; --voice-muted:#64777c; --voice-line:#dce8e8; }
.voices-page .voices-hero { height:auto; min-height:380px; padding:165px 24px 75px; gap:15px; background:linear-gradient(120deg,rgba(16,58,67,.84),rgba(40,106,110,.58)),url('../images/DSC00222.jpg') center 46% / cover; }
.voices-page .voices-hero .voices-eyebrow { margin:0; font-size:12px; letter-spacing:.22em; font-weight:600; }
.voices-page .voices-hero h1 { font-family:var(--font-body); font-size:clamp(34px,4.5vw,56px); line-height:1.35; letter-spacing:.04em; text-wrap:wrap; }
html[data-lang="en"] .voices-page .voices-hero h1 { font-family:var(--font-en); letter-spacing:.02em; }
.voices-page .voices-section { max-width:1440px; margin:0 auto; padding-top:70px; padding-bottom:90px; }
.voices-intro { text-align:center; max-width:800px; margin:0 auto 44px; }
.voices-intro h2 { font-size:clamp(22px,2.6vw,32px); color:var(--voice-ink); font-weight:700; line-height:1.55; margin-bottom:18px; }
.voices-intro > p { margin:0; line-height:1.9; }
.voices-intro .voices-language-note { margin-top:10px; font-size:13px; color:var(--voice-muted); }
.voices-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; align-items:start; }
.voice-card { min-width:0; padding:30px 32px; border:1px solid var(--voice-line); border-radius:20px; background:#fff; box-shadow:0 5px 20px rgba(20,73,85,.035); scroll-margin-top:120px; }
.voice-person { display:flex; align-items:center; gap:22px; margin-bottom:24px; }
.voice-portrait { width:104px; height:132px; flex:0 0 104px; border-radius:14px; overflow:hidden; background:#edf5f4; }
.voice-portrait img { width:100%; height:100%; object-fit:cover; object-position:center 45%; }
.voice-monogram { display:grid; place-items:center; height:100%; font-family:var(--font-en); font-size:36px; color:#6f9c9e; font-weight:600; letter-spacing:0; }
.voice-person-info { min-width:0; }
.voice-person-info h3 { color:var(--voice-ink); font-size:20px; font-weight:700; line-height:1.5; overflow-wrap:break-word; }
.voice-person-info .voice-latin-name { font-family:var(--font-en); font-size:14px; letter-spacing:.03em; color:var(--voice-muted); margin:3px 0 0; }
.voice-person-info .voice-country { display:inline-block; padding:3px 10px; margin:10px 0 0; border-radius:5px; background:#eef6f5; color:var(--voice-ink); font-size:12px; font-weight:500; line-height:1.7; }
.voices-page .voice-comment { margin:0; padding:0; border:0; font-style:normal; font-size:16px; line-height:1.95; color:#34454a; }
html body .voices-page .voice-comment p { margin:0 0 1em; text-align:left; text-align-last:auto; text-justify:none; letter-spacing:0; word-spacing:normal; word-break:normal; overflow-wrap:break-word; text-wrap:wrap; hyphens:none; line-height:1.95; }
.voice-comment:lang(en) { font-family:"Noto Sans JP",sans-serif; }
.voice-comment:lang(zh-Hans) { font-family:"Noto Sans SC",sans-serif; }
.voice-comment > p:last-child,.voice-remainder > p:last-child { margin-bottom:0; }
.voice-more { border-top:1px solid #e6eeee; margin-top:22px; padding-top:14px; }
.voice-more > summary { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:5px 0; color:var(--voice-ink); font-size:14px; font-weight:700; cursor:pointer; list-style:none; }
.voice-more > summary::-webkit-details-marker { display:none; }
.voice-more > summary:hover { color:#237b83; }
.voice-more > summary:focus-visible { outline:3px solid #d49a45; outline-offset:5px; border-radius:3px; }
.voice-more-icon { width:24px; height:24px; display:grid; place-items:center; flex-shrink:0; border:1px solid #c9dedd; border-radius:50%; font-weight:400; line-height:1; }
.voice-more-icon::before { content:'＋'; }
.voice-more[open] .voice-more-icon::before { content:'−'; }
.voice-more:not([open]) .voice-when-open,.voice-more[open] .voice-when-closed { display:none; }
.voice-remainder { padding-top:18px; }
.voices-cta { padding-top:0; padding-bottom:90px; }
.voices-cta-inner { max-width:1180px; margin:0 auto; padding:48px 30px; background:#e8f3f1; border:1px solid #d6e7e3; border-radius:22px; text-align:center; }
.voices-cta-inner .voices-eyebrow { color:#41767b; font-family:var(--font-en); font-size:12px; letter-spacing:.18em; font-weight:600; margin:0 0 14px; }
.voices-cta-inner h2 { font-size:clamp(24px,3vw,32px); color:var(--voice-ink); line-height:1.55; margin:0 0 16px; }
.voices-cta-inner > p { line-height:1.9; }
.voices-cta-actions { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:24px; margin-top:28px; }
.voices-course-link { color:var(--voice-ink); text-decoration:underline; text-underline-offset:5px; font-weight:700; }
.voices-teaser { padding-top:60px; padding-bottom:60px; }
.voices-teaser-inner { max-width:1000px; margin:0 auto; padding:42px 30px; text-align:center; background:#edf6f4; border:1px solid #d9e8e4; border-radius:20px; }
.voices-teaser .sec-title { margin-bottom:22px; font-size:clamp(25px,3vw,34px); }
.voices-teaser .sec-title::after { margin-top:16px; }
.voices-teaser p { margin:0 0 24px; line-height:1.9; }
@media (max-width:800px) {
  .voices-grid { grid-template-columns:1fr; max-width:640px; margin:0 auto; gap:22px; }
  .voices-page .voices-section { padding-top:48px; padding-bottom:60px; }
  .voices-cta { padding-bottom:60px; }
}
@media (max-width:600px) {
  .voices-page .voices-hero { min-height:310px; padding:145px 20px 60px; border-radius:0 0 26px 26px; }
  .voices-page .voices-hero h1 { font-size:clamp(29px,8.5vw,38px); }
  .voices-page .voices-section { padding-left:16px; padding-right:16px; }
  .voices-intro { margin-bottom:30px; }
  .voices-intro h2 { font-size:22px; }
  .voices-intro > p { font-size:15px; }
  .voices-intro .voices-language-note { font-size:12px; }
  .voice-card { padding:24px 20px; border-radius:16px; }
  .voice-person { gap:17px; margin-bottom:22px; }
  .voice-portrait { width:88px; height:112px; flex-basis:88px; border-radius:11px; }
  .voice-person-info h3 { font-size:18px; }
  .voices-page .voice-comment { font-size:15px; }
  .voice-person-info .voice-country { padding:3px 8px; }
  .voices-cta-inner { padding:32px 20px; }
  .voices-cta-inner h2 { font-size:24px; }
  .voices-cta-actions { flex-direction:column; gap:20px; }
  .voices-teaser { padding-top:35px; padding-bottom:35px; }
  .voices-teaser-inner { padding:30px 20px; }
}
