.intro { display: grid; align-items: center; gap: 8%; padding-top: 54px; padding-bottom: var(--section-gap); }
.intro-a { grid-template-columns: 1.35fr .85fr; }
.intro-kicker { color: var(--muted); font-size: 14px; line-height: 1.5; margin-bottom: 26px; }
.intro h1 { font-size: clamp(48px, 5.5vw, 82px); font-weight: 450; letter-spacing: -.06em; line-height: 1.04; }
.intro h1 span { color: #aaa; }
.intro-description { color: var(--muted); font-size: 17px; line-height: 1.65; max-width: 510px; margin-top: 28px; }
.intro .pill { margin-top: 30px; }
.portrait { width: 100%; margin: 0; }
.portrait-frame { aspect-ratio: 4 / 5; background: #262724; overflow: hidden; position: relative; display: grid; place-items: center; }
.portrait-frame svg { width: 80%; height: 85%; position: absolute; bottom: 0; fill: #454741; }
.portrait-frame > span { z-index: 1; font-size: 13px; background: #171717; padding: 8px 12px; border-radius: 20px; align-self: end; margin-bottom: 24px; color: #ddd; }
.portrait figcaption { font-size: 12px; color: #999; margin-top: 12px; }
.intro-b { grid-template-columns: 1fr 250px; gap: 7%; }
.intro-b h1 { font-size: clamp(48px,6.5vw,98px); }
.intro-b .portrait-frame { aspect-ratio: 1; border-radius: 50%; }
.intro-b .portrait-frame svg { width: 86%; height: 96%; }
.intro-b .portrait figcaption { text-align: center; }
.intro-bottom { display: flex; align-items: end; gap: 32px; }
.intro-bottom .pill { white-space: nowrap; flex-shrink: 0; }
.intro-c { grid-template-columns: .85fr 1.15fr; gap: 11%; }
.intro-c .portrait-frame { aspect-ratio: 1 / 1.12; }
.intro-c .intro-lead { font-size: clamp(30px,3.2vw,48px); letter-spacing: -.04em; line-height: 1.18; margin-top: 25px; color: #b4b4b4; }
.intro-c .intro-description { font-size: 16px; max-width: 450px; }
.concept-review .ways-light { gap: 8%; }
.ways-light .way { background: none; padding: 26px 0 0; border-top: 1px solid #454545; }
.ways-light .way h2 { font-size: clamp(26px,2.6vw,38px); max-width: 470px; }
.ways-light .way-copy { max-width: 510px; font-size: 16px; }
.expertise-option { padding-top: var(--section-gap); padding-bottom: 0; }
.expertise-option > h2, .face-copy h2 { font-size: clamp(38px,4vw,60px); line-height: 1.08; font-weight: 450; letter-spacing: -.055em; margin-bottom: 46px; }
.capability h3 { font-size: clamp(20px,1.8vw,27px); letter-spacing: -.035em; line-height: 1.25; }
.capability p { margin-top: 9px; color: var(--muted); font-size: 15px; line-height: 1.55; }
.cap-groups { display: grid; grid-template-columns: repeat(3,1fr); gap: 6%; }
.group-label { font-size: 14px; font-weight: 500; letter-spacing: 0; color: #bbb; border-top: 1px solid #454545; padding-top: 18px; margin-bottom: 34px; }
.cap-group .capability + .capability { margin-top: 30px; }
.cap-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 34px 7%; }
.cap-numbered { display: grid; grid-template-columns: 24px 1fr; gap: 20px; }
.cap-number { font-size: 12px; color: #888; padding-top: 5px; }
.expertise-c { display: grid; grid-template-columns: .8fr 1.2fr; gap: 9%; }
.expertise-c > h2 { max-width: 330px; }
.cap-rows .capability { display: grid; grid-template-columns: 1fr 1.15fr; gap: 24px; padding: 20px 0; border-top: 1px solid var(--line); align-items: baseline; }
.cap-rows .capability:first-child { padding-top: 0; border-top: 0; }
.cap-rows .capability:last-child { padding-bottom: 0; }
.cap-rows .capability h3 { font-size: 21px; }
.cap-rows .capability p { margin: 0; font-size: 14px; }
@media(max-width:1000px) {
  .intro-b { grid-template-columns: 1fr 190px; }
  .intro-bottom { display: block; }
  .intro h1 { font-size: 58px; }
  .expertise-c { grid-template-columns: 1fr 1.6fr; gap: 5%; }
  .cap-rows .capability { display: block; }
  .cap-rows .capability p { margin-top: 8px; }
}
@media(max-width:700px) {
  .intro { display: flex; flex-direction: column; align-items: stretch; gap: 38px; padding-top: 32px; }
  .intro h1 { font-size: clamp(44px,9vw,62px); }
  .intro-kicker { font-size: 13px; margin-bottom: 20px; }
  .intro-description { font-size: 16px; margin-top: 23px; }
  .intro .portrait { max-width: 360px; }
  .intro-a .portrait-frame { aspect-ratio: 4 / 3; }
  .intro-b .portrait { max-width: 200px; }
  .intro-c .intro-copy { order: -1; }
  .intro-c .portrait-frame { aspect-ratio: 4 / 3; }
  .intro-c .intro-lead { font-size: 34px; }
  .ways-light .way { margin-bottom: 30px; }
  .ways-light .way:last-child { margin-bottom: 0; }
  .ways-light .way h2 { font-size: 30px; }
  .expertise-option > h2, .face-copy h2 { font-size: 39px; margin-bottom: 34px; }
  .cap-groups, .cap-grid { grid-template-columns: 1fr; gap: 38px; }
  .group-label { margin-bottom: 22px; }
  .cap-group .capability + .capability { margin-top: 22px; }
  .cap-grid { gap: 26px; }
  .expertise-c { display: block; }
  .cap-rows .capability { display: grid; grid-template-columns: 1fr 1.1fr; gap: 16px; }
  .cap-rows .capability h3 { font-size: 19px; }
  .cap-rows .capability p { margin-top: 0; }
}
@media(max-width:380px) {
  .cap-rows .capability { display: block; }
  .cap-rows .capability p { margin-top: 8px; }
}

.capability[id] { scroll-margin-top: calc(var(--header-height) + 24px); }

.face-section { display: grid; grid-template-columns: minmax(0, 620px) minmax(0, 440px); gap: clamp(32px, 5vw, 80px); padding-block: var(--section-gap); align-items: start; }
.face-section + .expertise-option { padding-top: 0; }
.face-copy h2 { max-width: 620px; margin-bottom: 28px; }
.face-copy p { max-width: 620px; font-size: 17px; line-height: 1.65; color: var(--muted); }
.face-copy p + p { margin-top: 20px; }
.face-portrait { margin: 0; min-width: 0; }
.face-photo-placeholder { aspect-ratio: 1; display: grid; place-items: center; background: #18232c; border-radius: 5px; color: #b8c8d3; font-size: 14px; }
.face-portrait img { display: block; width: 100%; aspect-ratio: 1; object-fit: cover; object-position: center 35%; border-radius: 5px; }
@media(max-width:1000px) {
  .face-section { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 32px; }
}
@media(max-width:700px) {
  .face-section { display: block; }
  .face-copy h2 { max-width: 620px; margin-bottom: 24px; }
  .face-copy p { max-width: 620px; font-size: 16px; }
  .face-portrait { width: min(100%, 340px); margin-top: 32px; }
}

.face-split { display: grid; grid-template-columns: minmax(0, 1fr) 380px; align-items: start; gap: clamp(48px, 8vw, 128px); text-align: left; }
.face-split .face-portrait { width: min(100%, 380px); margin: 0; justify-self: end; }
@media(max-width:1000px) {
  .face-split { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 32px; }
}
@media(max-width:700px) {
  .face-split { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .face-split .face-portrait { width: min(100%, 300px); justify-self: start; }
}