/* 탈북민 스피치 코칭(/nk-coaching) 전용 — 1차 리디자인 시안 voicecheck-nk 의 페이지 CSS (대담함은 한 곳: 첫 화면의 계단).
   교육 과정 공통(시안 _kit) 가운데 이 화면이 쓰는 것만 앞에 옮겼다. 모바일 덜어내기는 site.css 공통. */
main h2, main h3 { text-wrap: balance; }
main p, main li { text-wrap: pretty; }
.nk-head { background: linear-gradient(180deg, var(--mist), var(--white) 560px); }
.nk-head .lede { max-width: 34em; }
.btn-kakao { gap: 8px; background: #FEE500; color: #191919; }
@media (hover: hover) { .btn-kakao:hover { background: #F5DC00; } }
.btn-kakao svg { flex: none; }
.go-links { margin-top: 24px; display: flex; flex-wrap: wrap; gap: 4px 24px; font-size: var(--fs-s); }
.go-links .link { display: inline-block; padding: 10px 0; margin: -10px 0; }

.org-acts { margin-top: 30px; display: flex; flex-wrap: wrap; gap: 10px; }

/* 탈북민 스피치 코칭 — 대담함은 한 곳: 첫 화면의 계단 */
.nk-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(40px, 5vw, 80px); align-items: end; }
.nk-head h1 span { display: block; }
.nk-head .actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 34px; }
.nk-head .terms { margin-top: 22px; font-size: var(--fs-s); color: var(--slate); max-width: 30em; }

.stairs h2 { font-size: var(--fs-s); font-weight: 650; color: var(--ink-2); letter-spacing: -.01em; }
.su { margin-top: 14px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; align-items: end; }
.su li { min-height: calc(150px + var(--h) * 62px); padding: 22px 22px 24px; border-radius: 22px; background: var(--tint); }
.su li:nth-child(2) { background: var(--peri-soft); }
.su li:nth-child(3) { background: var(--cobalt); color: #fff; }
.su h3, .ground h3 { font-size: var(--fs-l); line-height: 1.35; font-weight: 700; letter-spacing: -.035em; text-wrap: balance; }
.su p, .ground p { margin-top: 8px; font-size: var(--fs-s); line-height: 1.6; color: var(--ink-2); }
.su li:nth-child(3) p { color: rgba(255, 255, 255, .86); }
.ground { margin-top: 10px; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 16px; padding: 20px 22px; border-radius: 22px; background: var(--white); box-shadow: inset 0 0 0 1px var(--line); }
.ground p { margin-top: 0; }

/* 해 온 일 */
.rec { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: clamp(40px, 6vw, 96px); align-items: start; }
.rec .lede { margin-top: 14px; }
.rec .nums { margin-top: 36px; }
.rec .nums strong { min-width: 2.6em; }
.rec .go-links { margin-top: 32px; }
.rec-list { border-top: 1px solid var(--line); }
.rec-list li { display: grid; grid-template-columns: 4em minmax(0, 1fr) auto; gap: 4px 20px; padding: 20px 0; border-bottom: 1px solid var(--line-2); align-items: baseline; }
.rec-list time { font-weight: 650; font-variant-numeric: tabular-nums; }
.rec-list b { display: block; font-weight: 650; letter-spacing: -.025em; }
.rec-list span { display: block; font-size: var(--fs-s); color: var(--slate); }
.rec-list em { font-style: normal; font-size: var(--fs-xs); font-weight: 650; color: var(--ink-2); text-align: right; }

/* 기관 교육 문의 */
.org { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(40px, 6vw, 96px); align-items: start; }
.org .lede { margin-top: 14px; }
.org .personal { margin-top: 26px; padding-top: 20px; border-top: 1px solid var(--line); font-size: var(--fs-s); color: var(--ink-2); max-width: 30em; }
.org .personal .link { margin-left: 4px; }
.org-steps { display: grid; gap: 0; }
.org-steps li { display: grid; grid-template-columns: 42px minmax(0, 1fr); column-gap: 20px; position: relative; padding-bottom: 32px; }
.org-steps li:not(:last-child)::before { content: ""; position: absolute; left: 20px; top: 46px; bottom: 6px; width: 2px; background: var(--peri-soft); }
.org-steps .n { width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; background: var(--white); box-shadow: inset 0 0 0 2px var(--peri-soft); font-weight: 650; color: var(--cobalt); }
.org-steps h3 { margin-top: 7px; font-size: var(--fs-l); font-weight: 700; letter-spacing: -.03em; }
.org-steps p { margin-top: 6px; font-size: var(--fs-s); color: var(--ink-2); line-height: 1.7; }

@media (max-width: 1080px) { .nk-grid { grid-template-columns: minmax(0, 1fr); } .stairs { max-width: 720px; } .su li { min-height: calc(96px + var(--h) * 52px); } }
@media (max-width: 860px) { .rec, .org { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 640px) {
    .su { grid-template-columns: minmax(0, 1fr); gap: 8px; }
    .su li { min-height: 0; width: calc(64% + var(--h) * 12%); padding: 18px 20px 20px; }
    .su h3, .ground h3 { font-size: var(--fs-m); }
    .ground { display: block; }
    .ground p { margin-top: 6px; }
    .nk-head .actions .btn, .org-acts .btn { width: 100%; }
    .rec-list li { grid-template-columns: 3.4em minmax(0, 1fr); }
    .rec-list em { grid-column: 2; text-align: left; }
}
/* 모바일 덜어내기 */
@media (max-width: 760px) {
    .nk-head .actions { margin-top: 28px; }
    .nk-head .actions .btn-quiet { width: auto; height: 44px; padding: 0 2px; background: none; box-shadow: none; color: var(--cobalt); font-size: var(--fs-s); text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 5px; }
    .nk-head .terms { margin-top: 12px; }
    .rec .nums { display: flex; gap: 28px; margin-top: 24px; }
    .rec .nums div { display: grid; gap: 0; }
    .rec .nums strong { min-width: 0; font-size: var(--fs-xl); line-height: 1.2; }
    .rec .go-links { margin-top: 20px; }
    .rec-list li { padding: 14px 0; row-gap: 2px; }
    .org-acts { margin-top: 24px; }
    .org .personal { margin-top: 18px; padding-top: 16px; }
    .org-steps li { padding-bottom: 18px; align-items: center; }
    .org-steps li:not(:last-child)::before { top: 44px; bottom: -2px; }
    .org-steps h3 { margin-top: 0; font-size: var(--fs-m); }
    .org-steps p { display: none; }
}
