/* About 固有 */
.about-id { display: flex; align-items: center; gap: 24px; margin-top: 16px; }
.about-id .avatar { width: 112px; height: 112px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
.about-id h1 { margin-top: 0; }
.about-id .role { margin-top: 8px; font-size: 13px; color: var(--note); line-height: 1.7; }
.about-lead { margin-top: 48px; }
@media (max-width: 560px) {
  .about-id { gap: 16px; }
  .about-id .avatar { width: 80px; height: 80px; }
}

/* 絵と文章を並べ、どちらも隠さずに見せる。4つの場面は灰の地のまま、上に細い墨の線で区切る（黒い面は最後の相談の帯と足元だけ・docs/世界観と決まり.md） */
.sec.about-scene { padding-block: clamp(64px, 7.5vw, 96px); border-top: 1px solid var(--rule); }
.about-scene-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr);
  gap: clamp(32px, 4vw, 48px);
  align-items: center;
}
.about-art { min-width: 0; }
.about-art .ph { aspect-ratio: 3 / 2; }
.about-art .section-image { width: 100%; height: 100%; object-fit: cover; }
.about-copy { min-width: 0; }
.about-copy .h2 { font-size: clamp(26px, 2.55vw, 34px); }
.about-copy .body { margin-top: 24px; }
.about-copy .body + .body { margin-top: 16px; }
.about-off .section-image { object-position: center 55%; }
@media (max-width: 900px) {
  .about-scene-grid { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .about-art .ph { aspect-ratio: 16 / 9; }
  .about-copy .h2 { font-size: clamp(26px, 4vw, 34px); }
}