/* ============================================================
   참여하기(join) 섹션 공용 스타일
   ============================================================ */
.join-heading-center { font-size: 20px; font-weight: 800; color: var(--ink); margin: 0 0 14px; line-height: 1.4; text-align: center; }
@media (min-width: 768px) { .join-heading-center { font-size: 25px; } }
.join-body-center { font-size: 14px; line-height: 1.85; color: var(--ink-soft); margin: 0 auto 32px; max-width: 760px; text-align: center; }
@media (min-width: 768px) { .join-body-center { font-size: 15px; } }

/* ---- 4-1 개요 ---- */
.join-intro { max-width: 860px; margin: 0 auto; padding: 40px var(--container-pad); text-align: center; }
@media (min-width: 768px) { .join-intro { padding: 80px var(--container-pad); } }
.join-intro__heading { font-size: 23px; font-weight: 800; color: var(--ink); margin: 0 0 24px; line-height: 1.4; }
@media (min-width: 768px) { .join-intro__heading { font-size: 32px; } }
.join-intro__p { font-size: 14.5px; line-height: 1.85; color: var(--ink-soft); margin: 0 0 20px; }
@media (min-width: 768px) { .join-intro__p { font-size: 15.5px; } }
.join-intro__emphasis { font-size: 15px; font-weight: 700; line-height: 1.8; color: var(--ink); margin: 0; }
@media (min-width: 768px) { .join-intro__emphasis { font-size: 16.5px; } }

.join-gray { background: var(--surface-soft); padding: 40px var(--container-pad); }
@media (min-width: 768px) { .join-gray { padding: 72px var(--container-pad); } }
.join-alt { max-width: var(--container-max); margin: 0 auto; padding: 40px var(--container-pad); text-align: center; }
@media (min-width: 768px) { .join-alt { padding: 72px var(--container-pad); } }

.join-narrow { max-width: 820px; margin: 0 auto; display: flex; flex-direction: column; gap: 18px; }
.join-heading-left { font-size: 21px; font-weight: 800; color: var(--ink); margin: 0; line-height: 1.4; }
@media (min-width: 768px) { .join-heading-left { font-size: 25px; } }
.join-p-left { font-size: 14px; line-height: 1.8; color: var(--ink-soft); margin: 0; }
@media (min-width: 768px) { .join-p-left { font-size: 15px; } }
.join-inline-list { display: flex; flex-wrap: wrap; gap: 10px; }
.join-inline-list__item { font-size: 13px; font-weight: 700; color: var(--blue); background: var(--paper); border: 1px solid var(--hair); border-radius: 20px; padding: 8px 16px; }

.join-flow-row { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; flex-wrap: wrap; }
@media (min-width: 768px) { .join-flow-row { flex-direction: row; gap: 0; } }
.join-flow-item { display: flex; align-items: center; gap: 8px; }
@media (min-width: 768px) { .join-flow-item { gap: 14px; } }
.join-flow-node { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 14px 20px; min-width: auto; }
@media (min-width: 768px) { .join-flow-node { padding: 10px 18px; min-width: 130px; } }
.join-flow-node__label { font-size: 13px; font-weight: 800; color: var(--blue); letter-spacing: 0.03em; white-space: nowrap; }
.join-flow-node__desc { font-size: 12px; color: var(--ink-soft); text-align: center; white-space: nowrap; }
.join-flow-arrow { font-size: 16px; color: oklch(75% 0.02 260); transform: rotate(90deg); }
@media (min-width: 768px) { .join-flow-arrow { transform: none; } }

.join-domain-grid { max-width: 1000px; margin: 0 auto; display: grid; grid-template-columns: 1fr; gap: 24px; }
@media (min-width: 768px) { .join-domain-grid { grid-template-columns: repeat(3,1fr); gap: 4px; } }
.join-domain-item { padding: 20px 0; text-align: center; min-width: 0; }
@media (min-width: 768px) { .join-domain-item { padding: 0 28px; border-left: 1px solid var(--hair); text-align: left; } }
.join-domain-item:first-child { border-left: none; }
.join-domain-en { font-size: 17px; font-weight: 800; color: var(--ink); }
.join-domain-ko { font-size: 13px; font-weight: 700; color: var(--blue); margin: 4px 0 10px; }
.join-domain-desc { font-size: 13px; line-height: 1.7; color: var(--ink-soft); }

.join-case { display: grid; grid-template-columns: 1fr; gap: 20px; align-items: center; max-width: 1100px; margin: 0 auto; padding: 32px 0; border-top: 1px solid var(--hair); text-align: left; }
@media (min-width: 1080px) { .join-case { grid-template-columns: 0.9fr 1.1fr; gap: 40px; padding: 48px 0; } }
.join-case:first-of-type { border-top: none; }
.join-case__photo { width: 100%; aspect-ratio: 4/3; }
.join-case__label { font-size: 12px; font-weight: 700; color: var(--coral); letter-spacing: 0.06em; }
.join-case__title { font-size: 19px; font-weight: 800; color: var(--ink); margin: 0; }
@media (min-width: 768px) { .join-case__title { font-size: 22px; } }
.join-case__title-en { font-size: 14px; font-weight: 500; color: var(--ink-soft); margin-left: 8px; }
.join-case__body { font-size: 13.5px; line-height: 1.8; color: var(--ink-soft); margin: 0; }
.join-case__question { font-size: 14.5px; font-weight: 700; color: var(--ink); margin: 6px 0 0; border-left: 3px solid var(--coral); padding-left: 14px; }

.join-archive-grid { max-width: 1000px; margin: 0 auto; display: grid; grid-template-columns: 1fr; gap: 0 40px; }
@media (min-width: 768px) { .join-archive-grid { grid-template-columns: repeat(2,1fr); } }
.join-archive-row { display: flex; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--hair); align-items: baseline; }
.join-archive-year { font-size: 13px; font-weight: 800; color: var(--blue); min-width: 90px; }
.join-archive-topic { font-size: 13.5px; font-weight: 700; color: var(--ink); }
.join-archive-topic-ko { font-size: 12.5px; font-weight: 500; color: var(--ink-soft); margin-left: 6px; }

/* 6단계 타임라인은 공용 .step-track(css/components.css)로 이동 */

.join-criteria-grid { max-width: 1000px; margin: 0 auto; display: grid; grid-template-columns: 1fr; gap: 24px; }
@media (min-width: 768px) { .join-criteria-grid { grid-template-columns: repeat(3,1fr); gap: 4px; } }
.join-criteria-item { padding: 20px 0; text-align: center; min-width: 0; }
@media (min-width: 768px) { .join-criteria-item { padding: 0 28px; border-left: 1px solid var(--hair); text-align: left; } }
.join-criteria-item:first-child { border-left: none; }
.join-criteria-en { font-size: 17px; font-weight: 800; color: var(--ink); }
.join-criteria-ko { font-size: 13px; font-weight: 700; color: var(--blue); margin: 4px 0 10px; }
.join-criteria-desc { font-size: 13px; line-height: 1.7; color: var(--ink-soft); }

.join-notice { max-width: 820px; margin: 0 auto; padding: 40px var(--container-pad) 0; border-top: 1px solid var(--hair); text-align: center; }
@media (min-width: 768px) { .join-notice { padding: 64px var(--container-pad) 0; } }
.join-notice__heading { font-size: 17px; font-weight: 800; color: var(--ink); margin: 0 0 12px; }
@media (min-width: 768px) { .join-notice__heading { font-size: 19px; } }
.join-notice__body { font-size: 12.5px; line-height: 1.8; color: var(--ink-soft); margin: 0; }

.join-cta { background: var(--blue-deep); padding: 48px 20px; display: flex; flex-direction: column; align-items: center; gap: 16px; text-align: center; }
@media (min-width: 768px) { .join-cta { padding: 80px; } }
.join-cta__heading { font-size: 19px; font-weight: 800; color: var(--paper); margin: 0; max-width: 640px; }
@media (min-width: 768px) { .join-cta__heading { font-size: 24px; } }
.join-cta__sub { font-size: 14px; color: oklch(82% 0.02 255); margin: 0; max-width: 600px; }
.join-cta__row { display: flex; flex-direction: column; gap: 14px; margin-top: 8px; }
@media (min-width: 768px) { .join-cta__row { flex-direction: row; flex-wrap: wrap; justify-content: center; max-width: 900px; } }
.join-cta__btn-primary { display: inline-block; background: var(--coral); color: var(--paper); font-size: 14.5px; font-weight: 700; padding: 13px 22px; border-radius: 4px; }
.join-cta__btn-secondary { display: inline-block; background: transparent; border: 1px solid oklch(60% 0.02 255); color: var(--paper); font-size: 14.5px; font-weight: 700; padding: 13px 22px; border-radius: 4px; }

/* ---- 4-2 coach intro sections ---- */
.join-eyebrow { font-size: 12.5px; font-weight: 700; color: var(--coral); letter-spacing: 0.08em; display: block; margin-bottom: 14px; text-align: center; }
.join-emphasis-blue { font-size: 16px; font-weight: 800; color: var(--blue); line-height: 1.6; margin: 20px auto 0; text-align: center; }
@media (min-width: 768px) { .join-emphasis-blue { font-size: 19px; } }

.join-eligible-grid { max-width: var(--container-max); margin: 0 auto; display: grid; grid-template-columns: 1fr; gap: 20px; }
@media (min-width: 768px) { .join-eligible-grid { grid-template-columns: repeat(3,1fr); } }
.join-eligible-item { background: var(--paper); border: 1px solid var(--hair); border-radius: 6px; padding: 24px; text-align: left; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.join-eligible-num { font-size: 13px; font-weight: 800; color: var(--blue); }
.join-eligible-title { font-size: 16px; font-weight: 800; color: var(--ink); }
.join-eligible-desc { font-size: 13px; line-height: 1.7; color: var(--ink-soft); }

.join-role-list { max-width: 820px; margin: 0 auto; display: flex; flex-direction: column; text-align: left; }
.join-role-row { display: flex; gap: 18px; padding: 20px 0; border-bottom: 1px solid var(--hair); }
.join-role-num { font-size: 13px; font-weight: 800; color: var(--blue); min-width: 28px; }
.join-role-title { font-size: 15.5px; font-weight: 800; color: var(--ink); }
.join-role-desc { font-size: 13.5px; line-height: 1.7; color: var(--ink-soft); }

.join-schedule-row { max-width: 760px; margin: 0 auto 36px; display: flex; flex-direction: column; gap: 12px; justify-content: center; }
@media (min-width: 768px) { .join-schedule-row { flex-direction: row; gap: 32px; } }
.join-schedule-item { display: flex; flex-direction: column; gap: 4px; text-align: center; }
.join-schedule-label { font-size: 11px; font-weight: 700; color: oklch(60% 0.02 260); text-transform: uppercase; letter-spacing: 0.05em; }
.join-schedule-value { font-size: 15px; font-weight: 700; color: var(--ink); }
.join-training-grid { max-width: var(--container-max); margin: 0 auto; display: grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 768px) { .join-training-grid { grid-template-columns: repeat(2,1fr); } }
@media (min-width: 1080px) { .join-training-grid { grid-template-columns: repeat(4,1fr); } }
.join-training-card { background: var(--paper); border: 1px solid var(--hair); border-radius: 6px; padding: 22px; display: flex; flex-direction: column; gap: 8px; text-align: left; min-width: 0; }
.join-training-num { font-size: 12px; font-weight: 800; color: var(--blue); }
.join-training-title { font-size: 14.5px; font-weight: 800; color: var(--ink); }
.join-training-desc { font-size: 12.5px; line-height: 1.65; color: var(--ink-soft); }

.join-process-row { max-width: var(--container-max); margin: 0 auto; display: grid; grid-template-columns: 1fr; gap: 16px; text-align: left; }
@media (min-width: 768px) { .join-process-row { grid-template-columns: repeat(2,1fr); } }
@media (min-width: 1080px) { .join-process-row { grid-template-columns: repeat(5,1fr); } }
.join-process-node { border-top: 3px solid var(--blue); padding-top: 14px; display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.join-process-num { font-size: 12px; font-weight: 800; color: var(--blue); }
.join-process-title { font-size: 14.5px; font-weight: 800; color: var(--ink); }
.join-process-desc { font-size: 12.5px; line-height: 1.6; color: var(--ink-soft); }

/* ---- 4-3 / 4-4 simple layouts ---- */
.join-simple { max-width: var(--container-max); margin: 0 auto; padding: 40px var(--container-pad); }
@media (min-width: 768px) { .join-simple { padding: 80px var(--container-pad); } }
.join-simple__grid { display: grid; grid-template-columns: 1fr; gap: 28px; align-items: center; }
@media (min-width: 1080px) { .join-simple__grid { grid-template-columns: 1.1fr 1fr; gap: 48px; } }
.join-simple__grid--single { grid-template-columns: 1fr; }
.join-simple__text { display: flex; flex-direction: column; gap: 18px; }
.join-simple__heading { font-size: 21px; font-weight: 800; color: var(--ink); margin: 0; line-height: 1.4; }
@media (min-width: 768px) { .join-simple__heading { font-size: 26px; } }
.join-simple__body { font-size: 14.5px; line-height: 1.8; color: var(--ink-soft); margin: 0; }
@media (min-width: 768px) { .join-simple__body { font-size: 15.5px; } }
.join-gallery-col { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.join-gallery-large { width: 100%; aspect-ratio: 4/3; }
.join-gallery-row { display: flex; gap: 8px; }
.join-gallery-small { flex: 1; aspect-ratio: 1/1; min-width: 0; }

/* ---- 4-5 partner page ---- */
.partner-intro { max-width: 760px; margin: 0 auto; padding: 32px var(--container-pad) 24px; text-align: center; }
@media (min-width: 768px) { .partner-intro { padding: 56px var(--container-pad) 32px; } }
.partner-intro__eyebrow { font-size: 13px; font-weight: 700; color: var(--blue); letter-spacing: 0.05em; display: block; margin-bottom: 14px; }
.partner-intro__text { font-size: 15px; font-weight: 600; color: var(--ink); line-height: 1.7; margin: 0; }
@media (min-width: 768px) { .partner-intro__text { font-size: 17px; } }

.partner-why-grid { max-width: var(--container-max); margin: 0 auto; display: grid; grid-template-columns: 1fr; gap: 28px; align-items: start; }
@media (min-width: 1080px) { .partner-why-grid { grid-template-columns: 1.1fr 1fr; gap: 48px; } }
.partner-why-text { display: flex; flex-direction: column; gap: 14px; }
.partner-value-col { display: flex; flex-direction: column; gap: 4px; }
.partner-value-item { padding: 18px 0; border-bottom: 1px solid var(--hair); display: flex; flex-direction: column; gap: 6px; }
.partner-value-num { font-size: 12px; font-weight: 800; color: var(--blue); }
.partner-value-title { font-size: 15.5px; font-weight: 800; color: var(--ink); }
.partner-value-desc { font-size: 13px; line-height: 1.65; color: var(--ink-soft); }

.partner-ways-list { max-width: 820px; margin: 0 auto; display: flex; flex-direction: column; text-align: left; }

.partner-cta-transition { background: var(--blue-deep); padding: 48px 20px; display: flex; flex-direction: column; align-items: center; gap: 14px; text-align: center; }
@media (min-width: 768px) { .partner-cta-transition { padding: 72px; } }
.partner-cta-transition__heading { font-size: 19px; font-weight: 800; color: var(--paper); margin: 0; max-width: 680px; }
@media (min-width: 768px) { .partner-cta-transition__heading { font-size: 24px; } }
.partner-cta-transition__body { font-size: 14px; color: oklch(82% 0.02 255); margin: 0; max-width: 580px; }