/* about.css — ABOUT ページ専用スキン（骨格は styles.css / sub-page.css） */

/* 代表者名・肩書き */
.representative-name-group {
  margin-bottom: 24px;
}

.ja-name {
  font-size: 24px;
  letter-spacing: 0.2em;
  font-weight: 600;
  margin-bottom: 6px;
}

.en-name {
  font-size: 20px;
  font-weight: 600;
  letter-spacing: 0.1em;
}

.representative-role {
  font-size: 1.2rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  color: var(--ink-on-white-muted);
}

.concept-body {
  font-size: 1rem;
  line-height: 2;
  margin-bottom: 40px;
}

.photo-frame {
  aspect-ratio: 4 / 5;
  background: #000;
  box-shadow: 0 30px 60px rgba(0, 0, 0, 0.2);
  overflow: hidden;
}

.photo-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: grayscale(10%);
}

/*
 * MEMBERS テーブル:
 * sub-page の .detail-table は通常 th|td の2列だが、
 * ここでは th=写真、td×3=プロフィールを「左1・右3行」のグリッドにする。
 */
.members-table tr {
  display: grid;
  grid-template-columns: 12% 88%;
  grid-template-rows: repeat(3, auto);
  align-items: start;
  align-content: start;
  padding: 32px 0;
}

.members-table th {
  grid-row: 1 / span 3; /* 3行分の高さにわたって写真列を占有 */
  align-self: center;
  width: auto;
  padding: 0;
}

.members-table th img {
  display: block;
  width: min(96px, 100%);
  aspect-ratio: 1;
  object-fit: cover;
  border-radius: 10px;
  box-shadow: 0 10px 24px rgba(10, 10, 10, 0.12);
}

.members-table td {
  grid-column: 2;
  padding: 0 0 0 24px;
  line-height: 1.7;
}

.members-table td + td {
  margin-top: 2px;
}

.members-table td:first-of-type {
  color: var(--ink-on-white);
  font-size: 1.05rem;
  font-weight: 700;
}

.members-table td:last-of-type {
  margin-top: 6px;
  font-size: 0.88rem;
}

.en-name-member {
  font-size: 0.9rem;
  font-weight: 600;
  letter-spacing: 0.1em;
}

@media (max-width: 768px) {
  /* sub-page のスマホ用テーブル指定は :not(.members-table) なので、ここでは通常の上書きで足りる */
  .members-table tr {
    grid-template-columns: 20% 80%;
    gap: 0;
    padding: 20px 0;
  }

  .members-table th img {
    width: min(72px, 100%);
  }

  .members-table td {
    padding-left: 14px;
  }
}