@charset "utf-8";
/* 제휴·협력 전용 — 공용 바탕·타이포·문의 영역은 hn-page.css. 색은 --hn-* 토큰만 쓴다.
   ① 왼쪽 제목·오른쪽 설명 ② 종이 바탕 2×2 분야 칸 ③ 잉크 바탕 점선 위 네 단계 ④ 첫 문의 메모 (⑤ 문의는 hn-page.css) */
.hn-partnership em { font-style: normal; color: var(--hn-caramel); word-break: keep-all; }
.hn-partnership .pt-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 32px; max-width: 1440px; margin: 0 auto; }
.hn-partnership .pt-head .ab-h2 { margin-top: 8px; }
.hn-partnership .pt-desc { font-size: 16px; line-height: 1.8; color: var(--hn-ink-700); }
.hn-partnership .pt-link { display: inline-flex; flex: none; align-items: center; gap: 24px; padding-bottom: 4px; border-bottom: 1px solid var(--hn-ink); font-weight: 600; transition: color .3s; }
.hn-partnership .pt-link span { transition: transform .4s var(--hn-ease); }
.hn-partnership .pt-link:hover { color: var(--hn-caramel); }
.hn-partnership .pt-link:hover span { transform: translateX(6px); }

/* ---------- ① 도입 ---------- */
.hn-partnership .pt-intro { padding: 120px var(--ab-gutter) 128px; }
.hn-partnership .pt-intro-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: end; gap: 64px; max-width: 1440px; margin: 0 auto; }
.hn-partnership .pt-title { margin-top: 8px; font-family: var(--hn-serif); font-size: clamp(40px, 4.2vw, 60px); line-height: 1.2; font-weight: 600; letter-spacing: -.05em; color: var(--hn-ink); }
.hn-partnership .pt-intro-desc { justify-self: end; max-width: 30em; font-size: 18px; line-height: 1.8; color: var(--hn-ink-700); }

/* ---------- ② 협업 분야: 2×2 ---------- */
.hn-partnership .pt-partners { background: var(--hn-paper); }
.hn-partnership .pt-grid { display: grid; grid-template-columns: 1fr 1fr; max-width: 1440px; margin: 64px auto 0; border-top: 1px solid var(--hn-ink); border-left: 1px solid var(--hn-ink); } /* 칸을 감싸는 선은 모두 같은 진한 선 */
.hn-partnership .pt-grid li { padding: 44px 48px 48px; border-right: 1px solid var(--hn-ink); border-bottom: 1px solid var(--hn-ink); scroll-margin-top: calc(var(--hn-hd-h, 88px) + 24px); }
.hn-partnership .pt-number { font: italic 500 40px/1 "Lora", serif; color: var(--hn-caramel); }
.hn-partnership .pt-en { margin-top: 28px; font: italic 15px/1.4 "Lora", serif; color: var(--hn-ink-500); }
.hn-partnership .pt-grid h4 { margin-top: 6px; font-size: 26px; line-height: 1.35; font-weight: 600; letter-spacing: -.04em; }
.hn-partnership .pt-grid .pt-desc { margin-top: 16px; max-width: 30em; }

/* 나타나기 — 칸과 선은 제자리에 두고, 칸 안 글만 차례로 떠오른다 */
.fl-reveal-on .hn-partnership .pt-grid[data-fl-reveal] { transition: opacity .9s var(--hn-ease); }
.fl-reveal-on .hn-partnership .pt-grid[data-fl-reveal]:not(.is-in) { transform: none; }
.fl-reveal-on .hn-partnership .pt-grid li > * { opacity: 0; transform: translateY(16px); transition: opacity .8s var(--hn-ease) calc(.15s + var(--d) * .12s), transform .8s var(--hn-ease) calc(.15s + var(--d) * .12s); }
.fl-reveal-on .hn-partnership .pt-grid.is-in li > * { opacity: 1; transform: none; }

/* ---------- ③ 진행 절차: 잉크 바탕, 점을 이은 한 줄 ---------- */
.hn-partnership .pt-process { color: var(--hn-paper); background: var(--hn-ink); }
.hn-partnership .pt-process .ab-h2 { color: var(--hn-paper); }
.hn-partnership .pt-process em, .hn-partnership .pt-process .ab-deco { color: var(--hn-amber); }
.hn-partnership .pt-steps { position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 40px; max-width: 1440px; margin: 56px auto 0; padding-top: 36px; }
.hn-partnership .pt-steps::before { content: ""; position: absolute; top: 5px; left: 0; right: 0; height: 1px; background: #5b4e44; transform-origin: left; }
.hn-partnership .pt-steps li { position: relative; }
.hn-partnership .pt-steps li::before { content: ""; position: absolute; top: -36px; left: 0; width: 11px; height: 11px; border: 1.5px solid var(--hn-amber); border-radius: 50%; background: var(--hn-ink); }
.hn-partnership .pt-step-no { display: block; font: italic 500 22px/1 "Lora", serif; color: var(--hn-amber); }
.hn-partnership .pt-steps h4 { margin-top: 12px; font-size: 22px; line-height: 1.4; font-weight: 600; letter-spacing: -.038em; color: var(--hn-paper); }
.hn-partnership .pt-steps p { margin-top: 8px; font-size: 15px; line-height: 1.75; color: var(--hn-ink-100); }
.fl-reveal-on .hn-partnership .pt-steps[data-fl-reveal]:not(.is-in) { opacity: 1; transform: none; }
.fl-reveal-on .hn-partnership .pt-steps::before { transform: scaleX(0); transition: transform 1.4s var(--hn-ease) .1s; }
.fl-reveal-on .hn-partnership .pt-steps.is-in::before { transform: none; }
.fl-reveal-on .hn-partnership .pt-steps li { opacity: 0; transform: translateY(20px); transition: opacity .8s var(--hn-ease) calc(.2s + var(--d) * .25s), transform .8s var(--hn-ease) calc(.2s + var(--d) * .25s); }
.fl-reveal-on .hn-partnership .pt-steps.is-in li { opacity: 1; transform: none; }

/* ---------- ④ 첫 문의 메모 ---------- */
.hn-partnership .pt-prepare { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 96px; align-items: start; }
.hn-partnership .pt-prepare > div { max-width: 1440px; }
.hn-partnership .pt-prepare .ab-h2 { margin-top: 8px; }
.hn-partnership .pt-prepare .pt-desc { margin-top: 24px; font-size: 17px; }
.hn-partnership .pt-checklist { border-top: 1px solid var(--hn-ink-200); }
.hn-partnership .pt-checklist > div { position: relative; padding: 24px 0 24px 40px; border-bottom: 1px solid var(--hn-ink-200); }
.hn-partnership .pt-checklist > div::before { content: ""; position: absolute; left: 6px; top: 31px; width: 7px; height: 12px; border-right: 1.5px solid var(--hn-caramel); border-bottom: 1.5px solid var(--hn-caramel); transform: rotate(45deg); }
.hn-partnership .pt-checklist dt { font-size: 20px; font-weight: 600; letter-spacing: -.035em; }
.hn-partnership .pt-checklist dd { margin-top: 8px; font-size: 16px; line-height: 1.75; color: var(--hn-ink-700); }

@media (min-width: 1280px) {
 .hn-partnership .pt-steps p { white-space: nowrap; } /* 넓은 화면에서는 설명을 한 줄로 */
}
@media (max-width: 1024px) {
 .hn-partnership .pt-intro { padding-top: 96px; padding-bottom: 104px; }
 .hn-partnership .pt-intro-head { grid-template-columns: 1fr; gap: 32px; }
 .hn-partnership .pt-intro-desc { justify-self: start; }
 .hn-partnership .pt-steps { grid-template-columns: 1fr 1fr; row-gap: 56px; }
 .hn-partnership .pt-steps::before { display: none; }
 .hn-partnership .pt-steps li::before { top: -24px; }
 .hn-partnership .pt-steps { padding-top: 24px; }
 .hn-partnership .pt-prepare { grid-template-columns: 1fr; gap: 48px; }
}
@media (max-width: 767px) {
 .hn-partnership .pt-intro { padding-top: 72px; padding-bottom: 80px; }
 .hn-partnership .pt-title { font-size: 34px; }
 .hn-partnership .pt-intro-desc { font-size: 15px; }
 .hn-partnership .pt-head { flex-direction: column; align-items: flex-start; gap: 24px; }
 .hn-partnership .pt-grid { grid-template-columns: 1fr; margin-top: 40px; }
 .hn-partnership .pt-grid li { padding: 32px 24px 36px; }
 .hn-partnership .pt-number { font-size: 30px; }
 .hn-partnership .pt-en { margin-top: 18px; font-size: 14px; }
 .hn-partnership .pt-grid h4 { font-size: 22px; }
 .hn-partnership .pt-desc { font-size: 15px; }
 .hn-partnership .pt-steps { grid-template-columns: 1fr; gap: 0; margin-top: 48px; padding: 0 0 0 36px; }
 .hn-partnership .pt-steps li { padding-bottom: 32px; }
 .hn-partnership .pt-steps li::before { top: 4px; left: -36px; }
 .hn-partnership .pt-steps li:not(:last-child)::after { content: ""; position: absolute; left: -31px; top: 18px; bottom: 0; width: 1px; background: #5b4e44; }
 .hn-partnership .pt-steps h4 { margin-top: 10px; font-size: 19px; }
 .hn-partnership .pt-steps p { font-size: 14px; }
 .hn-partnership .pt-checklist > div { padding-left: 32px; }
 .hn-partnership .pt-checklist dt { font-size: 18px; }
 .hn-partnership .pt-checklist dd { font-size: 15px; }
}
@media (prefers-reduced-motion: reduce) {
 .hn-partnership .pt-steps::before, .hn-partnership .pt-steps li, .hn-partnership .pt-grid li > * { transform: none !important; opacity: 1 !important; transition: none !important; }
}
