/* Atorni /about — 소개 페이지 표면.
 * 정본 = _design/outbox/20260802_new_site_migration/site/about.html <style>
 * 격리: 전 선택자 `.site` 하위.
 * 마케팅 표면은 본문 17px/1.6 (법률 문서 표면 16px/1.75 와 다르다) → `.site-mkt` 로 분리.
 */

.site.site-mkt { font-size: 17px; line-height: 1.6; }
.site .s-sec { padding: 76px 0; }
.site .s-lede { font-size: 18.5px; color: var(--s-ink-70); max-width: 56ch; margin-top: 22px; }
.site .s-mkt-h1 { font-size: clamp(44px, 8.6vw, 80px); letter-spacing: -.015em; line-height: 1.05; }
.site .s-mkt-h2 { font-size: clamp(30px, 4.6vw, 44px); letter-spacing: -.015em; line-height: 1.05; }

/* ── 히어로 ──────────────────────────────────────────── */
.site .s-ahero { padding: 76px 0 0; background: var(--s-mist); }
.site .s-ahero h1 { margin-top: 20px; max-width: 15ch; }
.site .s-ahero .s-btn { margin-top: 32px; }
.site .s-band { margin-top: 60px; aspect-ratio: 3/1; overflow: hidden; }
.site .s-band img { width: 100%; height: 100%; object-fit: cover; }
.site .s-credit { font-size: 11.5px; color: var(--s-ink-45); padding: 10px 0 0; }

/* ── 2열 본문 ────────────────────────────────────────── */
.site .s-split { display: grid; gap: 30px; }
.site .s-split h2 { max-width: 15ch; }
.site .s-split .s-body p { color: var(--s-ink-70); max-width: 58ch; }
.site .s-split .s-body p + p { margin-top: 20px; }
@media (min-width: 920px) {
  .site .s-split { grid-template-columns: .85fr 1.15fr; gap: 60px; }
  .site .s-split .s-body { padding-top: 14px; }
}

/* ── 사람 ────────────────────────────────────────────── */
.site .s-people { display: grid; gap: 34px; margin-top: 40px; }
.site .s-pcard {
  position: relative; aspect-ratio: 4/5; border-radius: 10px;
  overflow: hidden; background: #EDEBE4;
}
.site .s-pcard img { width: 100%; height: 100%; object-fit: cover; }
.site .s-plabel {
  position: absolute; left: 0; right: 0; bottom: 0; padding: 26px 22px 22px;
  background: linear-gradient(to top, rgba(10,14,18,.88), rgba(10,14,18,.45) 55%, rgba(10,14,18,0));
}
.site .s-pname {
  font-family: var(--s-serif); font-size: clamp(26px, 2.6vw, 32px);
  color: #fff; letter-spacing: -.02em; line-height: 1.05;
}
.site .s-prole { font-size: 13.5px; color: rgba(255,255,255,.82); margin-top: 6px; }
.site .s-person p { color: var(--s-ink-70); margin-top: 18px; font-size: 15.5px; }
/* [착수 16단계] 실제 인원 2명(Kim Tae-woong·Jillian Sale)뿐이라 3열이면 3번째 칸이 빈다.
 *   데스크톱 2열로 맞춰 빈 칸 제거 + 카드 폭 회복. max-width 로 2열이 지나치게 넓어지지 않게.
 *   (DOM/데이터 불변 — grid column 만. 인원이 3명이 되면 grid 정책 재검토.) */
@media (min-width: 820px) {
  .site .s-people { grid-template-columns: repeat(2, 1fr); gap: 34px; max-width: 820px; }
}

/* ── Casebook ────────────────────────────────────────── */
.site .s-case { background: var(--s-sage); }
.site .s-tm { font-size: .55em; vertical-align: super; line-height: 0; }

/* ── 사무실 ──────────────────────────────────────────── */
.site .s-office { background: var(--s-ink); color: #C4CBD1; padding: 0; }
.site .s-office h2 { color: #fff; }
.site .s-office .s-addr {
  font-family: var(--s-serif); font-size: clamp(22px, 3vw, 30px);
  color: #fff; line-height: 1.3; max-width: 20ch; margin-top: 22px;
}
.site .s-office .s-meta { margin-top: 20px; font-size: 15px; color: #8C959C; }
.site .s-office .s-meta a { color: #C4CBD1; }
.site .s-office-grid { display: grid; }
.site .s-office-text { padding: 66px 0; }
.site .s-office-inner { width: 100%; max-width: 590px; margin: 0 auto; padding: 0 20px; }
.site .s-office-pic { overflow: hidden; aspect-ratio: 4/3; }
.site .s-office-pic img { width: 100%; height: 100%; object-fit: cover; }
@media (min-width: 920px) {
  .site .s-office-grid { grid-template-columns: 1.9fr 1.1fr; align-items: stretch; }
  .site .s-office-text { display: flex; align-items: center; padding: 78px 0; }
  .site .s-office-inner { margin: 0 0 0 auto; padding: 0 60px 0 20px; max-width: 700px; }
  .site .s-office-pic { aspect-ratio: auto; min-height: 100%; max-height: 420px; }
}

/* ── 최종 CTA ────────────────────────────────────────── */
.site .s-final { background: var(--s-forest); text-align: center; }
.site .s-final h2 { color: #fff; max-width: 18ch; margin: 0 auto; }
.site .s-final p { color: #AFC6BB; margin-top: 16px; }
.site .s-final .s-btn { margin-top: 28px; }