/**
 * reporter.css  v20260622
 * ─────────────────────────────────────────────────────────────
 * NWS-004 기자 프로필 / NWS-005 기자 신청 / NWS-006 Newsroom 운영정보
 * 공용 스타일시트 (Newsroom v3)
 *
 * Requires: mws-tokens.css, mws-layout.css, util-bar-auth.css, news.css
 * 접두사 규칙:
 *   rp-*   → reporter-profile (NWS-004)
 *   ra-*   → reporter-apply   (NWS-005)
 *   ni-*   → news-info        (NWS-006)
 *
 * SSOT 감사:
 *   ✅ g-* 클래스 재정의 없음
 *   ✅ 하드코딩 색상 없음 — var() + 폴백
 *   ✅ --mw 통일 (--max-w 미사용)
 *   ✅ backdrop-filter 미사용
 * ─────────────────────────────────────────────────────────────
 */

/* ═══════════════════════════════════════════════════════════════
   § 0. 공통 레이아웃 래퍼
═══════════════════════════════════════════════════════════════ */
.rp-page,
.ra-page,
.ni-page {
  background: var(--bg, #fafaf8);
  min-height: 100vh;
}

.rp-inner,
.ra-inner,
.ni-inner {
  max-width: var(--mw, 1280px);
  margin: 0 auto;
  padding: 0 16px;   /* 모바일 기본 */
}
@media (min-width: 768px) {
  .rp-inner, .ra-inner, .ni-inner { padding: 0 24px; }
}

/* ─── 등급 뱃지 공용 (5등급) ─────────────────────────────── */
.rp-grade-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 14px;
  white-space: nowrap;
}
/* 훈련기자 (grade=1) */
.rp-grade-badge[data-grade="1"] {
  background: var(--border, #eaecef);
  color: var(--text-tertiary, #8a94a6);
}
/* 수습기자 (grade=2) */
.rp-grade-badge[data-grade="2"] {
  background: var(--mint-pale, #FAFEFD);
  color: var(--mint-dark, #228E84);
  border: 1px solid var(--mint, #81D8D0);
}
/* 정기자 (grade=3) */
.rp-grade-badge[data-grade="3"] {
  background: var(--mint-light, #C0EDE9);
  color: var(--mint-dark, #228E84);
  border: 1px solid var(--mint-dark, #228E84);
}
/* 편집기자 (grade=4) */
.rp-grade-badge[data-grade="4"] {
  background: var(--gold-light, #fef9ec);
  color: var(--gold, #c19a3a);
  border: 1px solid var(--gold-border, #f0d070);
}
/* 선임기자 (grade=5) */
.rp-grade-badge[data-grade="5"] {
  background: linear-gradient(135deg, var(--gold-light, #fef9ec), var(--mint-pale, #FFFAF2));
  color: var(--gold, #c19a3a);
  border: 1px solid var(--gold-border, #f0d070);
  box-shadow: 0 1px 4px rgba(193,154,58,.2);
}

/* ═══════════════════════════════════════════════════════════════
   § 1. NWS-004 기자 프로필 — rp-*
═══════════════════════════════════════════════════════════════ */

/* ① 히어로 섹션 */
.rp-hero {
  background: linear-gradient(160deg, var(--mint-pale, #FFFAF2) 0%, var(--nws-white, #ffffff) 60%);
  border-bottom: 1px solid var(--border, #eaecef);
  padding: 24px 0 20px;   /* 모바일 기본 */
}
@media (min-width: 768px) { .rp-hero { padding: 40px 0 32px; } }
.rp-hero-inner {
  max-width: var(--mw, 1280px);
  margin: 0 auto;
  padding: 0 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 20px;
}
@media (min-width: 768px) { .rp-hero-inner { padding: 0 24px; } }
@media (min-width: 1024px) {
  .rp-hero-inner { flex-direction: row; align-items: flex-start; text-align: left; gap: 32px; }
}
.rp-avatar-wrap {
  position: relative;
  flex-shrink: 0;
}
.rp-avatar {
  width: 88px;    /* 모바일 기본 */
  height: 88px;
  border-radius: 50%;
  object-fit: cover;
  border: 3px solid var(--mint, #CEB588);
  background: var(--mint-pale, #FAFEFD);
  display: block;
}
.rp-avatar-grade {
  position: absolute;
  bottom: 4px;
  right: 4px;
}

.rp-hero-body { flex: 1; min-width: 0; }
.rp-hero-name {
  font-size: clamp(20px, 4vw, 26px);
  font-weight: 900;
  color: var(--text-primary, #1a1c1e);
  margin-bottom: 6px;
  letter-spacing: -.02em;
}
.rp-hero-specialty {
  font-size: 14px;
  color: var(--text-secondary, #4a5568);
  margin-bottom: 14px;
}
.rp-hero-stats {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  justify-content: center;
  margin-bottom: 16px;
}
@media (min-width: 1024px) {
  .rp-hero-stats   { gap: 20px; justify-content: flex-start; }
  .rp-hero-actions { justify-content: flex-start; }
  .rp-avatar       { width: 120px; height: 120px; }
}
.rp-stat-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}
.rp-stat-num {
  font-size: 18px;   /* 모바일 기본 */
  font-weight: 900;
  color: var(--mint-dark, #228E84);
  line-height: 1;
}
.rp-stat-label {
  font-size: 11px;
  color: var(--text-tertiary, #8a94a6);
  white-space: nowrap;
}
.rp-stat-item.warning .rp-stat-num { color: var(--news-red, #e23434); }
.rp-stat-item.gold    .rp-stat-num { color: var(--gold, #c19a3a); }

/* 팔로우 버튼 영역 */
.rp-hero-actions { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; }
.rp-follow-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 18px;
  border-radius: 20px;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  border: 2px solid var(--mint-dark, #A8884E);
  background: var(--mint-dark, #A8884E);
  color: var(--nws-white, #ffffff);
  transition: background .15s, color .15s;
  font-family: inherit;
}
.rp-follow-btn:hover { background: var(--mint, #CEB588); border-color: var(--mint, #CEB588); }
.rp-follow-btn.following {
  background: var(--nws-white, #ffffff);
  color: var(--mint-dark, #228E84);
}
.rp-follow-btn.following:hover {
  background: var(--news-red-bg, rgba(226,52,52,.08));
  border-color: var(--news-red, #e23434);
  color: var(--news-red, #e23434);
}
.rp-share-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  border-radius: 20px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  border: 1px solid var(--border, #eaecef);
  background: none;
  color: var(--text-secondary, #4a5568);
  transition: border-color .15s;
  font-family: inherit;
}
.rp-share-btn:hover { border-color: var(--mint, #CEB588); color: var(--mint-dark, #228E84); }

/* ② 서약서 버전 배지 */
.rp-ethics-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 11px;
  padding: 3px 8px;
  border-radius: 3px;
  background: var(--violet-lt, #f5f3ff);
  color: var(--violet, #7c3aed);
  border: 1px solid var(--violet, #7c3aed);
  font-weight: 600;
}

/* ③ 2단 레이아웃 */
.rp-layout {
  display: grid;
  grid-template-columns: 1fr;    /* 모바일: 단일 열 */
  gap: 24px;
  max-width: var(--mw, 1280px);
  margin: 0 auto;
  padding: 20px 16px 40px;
}
.rp-main { min-width: 0; order: 1; }
.rp-side  { min-width: 0; order: 2; }
@media (min-width: 768px)  { .rp-layout { padding: 28px 24px 48px; gap: 28px; } }
@media (min-width: 1024px) {
  .rp-layout { grid-template-columns: 1fr 300px; gap: 36px; padding: 36px 24px 60px; }
  .rp-main { order: unset; } .rp-side { order: unset; }
}

/* ④ 기사 탭 */
.rp-tabs {
  display: flex;
  gap: 0;
  border-bottom: 2px solid var(--border, #eaecef);
  margin-bottom: 24px;
}
.rp-tab {
  padding: 10px 18px;
  font-size: 14px;
  font-weight: 600;
  color: var(--text-tertiary, #8a94a6);
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
  cursor: pointer;
  transition: color .15s, border-color .15s;
  font-family: inherit;
  white-space: nowrap;
}
.rp-tab:hover { color: var(--text-primary, #1a1c1e); }
.rp-tab.active {
  color: var(--mint-dark, #228E84);
  border-bottom-color: var(--mint-dark, #228E84);
}
.rp-tab-panel { display: none; }
.rp-tab-panel.active { display: block; }

/* ⑤ 기사 카드 (프로필 내 기사 목록) */
.rp-article-list { display: flex; flex-direction: column; gap: 0; }
.rp-article-item {
  display: flex;
  gap: 14px;
  padding: 14px 0;
  border-bottom: 1px solid var(--border, #eaecef);
  text-decoration: none;
  transition: background .1s;
  border-radius: 4px;
}
.rp-article-item:last-child { border-bottom: none; }
.rp-article-item:hover { background: var(--mint-pale, #FAFEFD); padding-left: 8px; padding-right: 8px; margin: 0 -8px; }
.rp-article-thumb {
  width: 88px;
  height: 62px;
  border-radius: 6px;
  object-fit: cover;
  flex-shrink: 0;
  background: var(--mint-pale, #FAFEFD);
}
.rp-article-body { flex: 1; min-width: 0; }
.rp-article-cat  { font-size: 11px; color: var(--mint-dark, #228E84); font-weight: 700; margin-bottom: 4px; }
.rp-article-title {
  font-size: 14px;
  font-weight: 600;
  color: var(--text-primary, #1a1c1e);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-height: 1.4;
  margin-bottom: 6px;
}
.rp-article-meta { font-size: 12px; color: var(--text-tertiary, #8a94a6); display: flex; gap: 8px; flex-wrap: wrap; }

/* ⑥ 사이드 위젯 공용 */
.rp-side-widget {
  background: var(--nws-white, #ffffff);
  border: 1px solid var(--border, #eaecef);
  border-radius: var(--radius, 8px);
  padding: 18px;
  margin-bottom: 20px;
}
.rp-side-widget-title {
  font-size: 14px;
  font-weight: 800;
  color: var(--text-primary, #1a1c1e);
  margin-bottom: 14px;
  padding-bottom: 10px;
  border-bottom: 2px solid var(--mint, #CEB588);
}

/* ⑦ 정정 이력 위젯 */
.rp-correction-list { list-style: none; padding: 0; margin: 0; }
.rp-correction-item {
  padding: 8px 0;
  border-bottom: 1px solid var(--border, #eaecef);
  font-size: 13px;
}
.rp-correction-item:last-child { border-bottom: none; }
.rp-correction-zero {
  font-size: 13px;
  color: var(--mint-dark, #228E84);
  font-weight: 700;
  text-align: center;
  padding: 12px 0;
}

/* ═══════════════════════════════════════════════════════════════
   § 2. NWS-005 기자 신청 — ra-*
═══════════════════════════════════════════════════════════════ */

.ra-hero {
  background: linear-gradient(160deg, var(--mint-pale, #FFFAF2) 0%, var(--violet-lt, #f5f3ff) 100%);
  border-bottom: 1px solid var(--border, #eaecef);
  padding: 48px 24px;
  text-align: center;
}
.ra-hero-title {
  font-size: clamp(24px, 3vw, 36px);
  font-weight: 900;
  color: var(--text-primary, #1a1c1e);
  margin-bottom: 10px;
  letter-spacing: -.02em;
}
.ra-hero-sub {
  font-size: 15px;
  color: var(--text-secondary, #4a5568);
  line-height: 1.6;
  max-width: 540px;
  margin: 0 auto 24px;
}

/* 5등급 흐름도 */
.ra-grade-flow {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  flex-wrap: wrap;
  margin: 0 auto;
  max-width: 640px;
}
.ra-grade-step {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
  padding: 10px 12px;  /* 모바일 기본 */
  background: var(--nws-white, #ffffff);
  border: 1px solid var(--border, #eaecef);
  border-radius: var(--radius, 8px);
  min-width: 80px;     /* 모바일 기본 */
  text-align: center;
}
@media (min-width: 768px) { .ra-grade-step { padding: 14px 18px; min-width: 100px; } }
.ra-grade-step-num {
  font-size: 11px;
  font-weight: 700;
  color: var(--text-tertiary, #8a94a6);
}
.ra-grade-step-name {
  font-size: 13px;
  font-weight: 700;
  color: var(--text-primary, #1a1c1e);
}
.ra-grade-step-desc {
  font-size: 11px;
  color: var(--text-tertiary, #8a94a6);
  line-height: 1.4;
}
.ra-grade-arrow {
  font-size: 18px;
  color: var(--mint-dark, #228E84);
  padding: 0 4px;
  flex-shrink: 0;
}

/* 신청 2단 레이아웃 */
.ra-layout {
  display: grid;
  grid-template-columns: 1fr;    /* 모바일: 단일 열 */
  gap: 24px;
  max-width: var(--mw, 1280px);
  margin: 0 auto;
  padding: 20px 12px 40px;
}
.ra-main { min-width: 0; order: 1; }
.ra-side  { min-width: 0; order: 2; }
@media (min-width: 768px)  { .ra-layout { padding: 28px 24px 48px; gap: 28px; } }
@media (min-width: 1024px) {
  .ra-layout { grid-template-columns: 1fr 360px; gap: 36px; padding: 36px 24px 60px; }
  .ra-main { order: unset; } .ra-side { order: unset; }
}

/* 섹션 카드 */
.ra-card {
  background: var(--nws-white, #ffffff);
  border: 1px solid var(--border, #eaecef);
  border-radius: var(--radius, 8px);
  padding: 18px;    /* 모바일 기본 */
  margin-bottom: 20px;
}
@media (min-width: 768px) { .ra-card { padding: 28px; } }
.ra-card-title {
  font-size: 17px;
  font-weight: 800;
  color: var(--text-primary, #1a1c1e);
  margin-bottom: 6px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.ra-card-desc {
  font-size: 13px;
  color: var(--text-secondary, #4a5568);
  line-height: 1.6;
  margin-bottom: 20px;
}

/* 서약서 본문 박스 */
.ra-ethics-box {
  background: var(--bg, #fafaf8);
  border: 1px solid var(--border, #eaecef);
  border-radius: 6px;
  padding: 20px;
  max-height: 340px;
  overflow-y: auto;
  font-size: 13px;
  line-height: 1.8;
  color: var(--text-secondary, #4a5568);
  margin-bottom: 16px;
  scroll-behavior: smooth;
}
.ra-ethics-box::-webkit-scrollbar { width: 4px; }
.ra-ethics-box::-webkit-scrollbar-thumb { background: var(--border, #eaecef); border-radius: 2px; }
.ra-ethics-box h3 {
  font-size: 14px;
  font-weight: 800;
  color: var(--text-primary, #1a1c1e);
  margin: 1.2em 0 .4em;
}
.ra-ethics-box h3:first-child { margin-top: 0; }
.ra-ethics-box p { margin-bottom: .8em; }
.ra-ethics-box ol, .ra-ethics-box ul { padding-left: 1.4em; margin-bottom: .8em; }
.ra-ethics-box li { margin-bottom: .3em; }

/* 서약서 스크롤 완료 표시 */
.ra-ethics-scroll-indicator {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: var(--text-tertiary, #8a94a6);
  margin-bottom: 14px;
  transition: color .2s;
}
.ra-ethics-scroll-indicator.done { color: var(--mint-dark, #228E84); }
.ra-ethics-scroll-indicator i { font-size: 14px; }

/* 체크박스 + 라벨 */
.ra-check-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 12px;
}
.ra-check-row input[type="checkbox"] {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  margin-top: 2px;
  accent-color: var(--mint-dark, #228E84);
  cursor: pointer;
}
.ra-check-label {
  font-size: 14px;
  color: var(--text-primary, #1a1c1e);
  line-height: 1.5;
  cursor: pointer;
}
.ra-check-label strong { color: var(--news-red, #e23434); }

/* 전자서명 입력 */
.ra-sign-wrap {
  margin-top: 20px;
}
.ra-sign-label {
  font-size: 13px;
  font-weight: 700;
  color: var(--text-primary, #1a1c1e);
  margin-bottom: 6px;
  display: block;
}
.ra-sign-input {
  width: 100%;
  padding: 10px 14px;
  border: 1px solid var(--border, #eaecef);
  border-radius: var(--radius, 8px);
  font-size: 14px;
  color: var(--text-primary, #1a1c1e);
  background: var(--nws-white, #ffffff);
  font-family: inherit;
  transition: border-color .15s;
}
.ra-sign-input:focus {
  outline: none;
  border-color: var(--mint-dark, #228E84);
  box-shadow: 0 0 0 3px rgba(168,136,78,.15);
}
.ra-sign-input.error { border-color: var(--news-red, #e23434); }
.ra-sign-hint {
  font-size: 12px;
  color: var(--text-tertiary, #8a94a6);
  margin-top: 5px;
}

/* 폼 입력 그룹 */
.ra-field-group {
  margin-bottom: 18px;
}
.ra-field-label {
  display: block;
  font-size: 13px;
  font-weight: 700;
  color: var(--text-primary, #1a1c1e);
  margin-bottom: 6px;
}
.ra-field-label .required {
  color: var(--news-red, #e23434);
  margin-left: 2px;
}
.ra-field-input,
.ra-field-select,
.ra-field-textarea {
  width: 100%;
  padding: 10px 14px;
  border: 1px solid var(--border, #eaecef);
  border-radius: var(--radius, 8px);
  font-size: 14px;
  color: var(--text-primary, #1a1c1e);
  background: var(--nws-white, #ffffff);
  font-family: inherit;
  transition: border-color .15s;
  box-sizing: border-box;
}
.ra-field-input:focus,
.ra-field-select:focus,
.ra-field-textarea:focus {
  outline: none;
  border-color: var(--mint-dark, #228E84);
  box-shadow: 0 0 0 3px rgba(168,136,78,.15);
}
.ra-field-input.error,
.ra-field-textarea.error { border-color: var(--news-red, #e23434); }
.ra-field-textarea { min-height: 100px; resize: vertical; }
.ra-field-error {
  font-size: 12px;
  color: var(--news-red, #e23434);
  margin-top: 4px;
  display: none;
}
.ra-field-error.show { display: block; }
.ra-field-hint { font-size: 12px; color: var(--text-tertiary, #8a94a6); margin-top: 4px; }

/* 제출 버튼 */
.ra-submit-btn {
  display: block;
  width: 100%;
  padding: 14px;
  background: var(--mint-dark, #A8884E);
  color: var(--nws-white, #ffffff);
  border: none;
  border-radius: var(--radius, 8px);
  font-size: 16px;
  font-weight: 800;
  font-family: inherit;
  cursor: pointer;
  transition: background .15s, opacity .15s;
  letter-spacing: -.01em;
}
.ra-submit-btn:hover { background: var(--mint, #CEB588); }
.ra-submit-btn:disabled {
  opacity: .5;
  cursor: not-allowed;
}
.ra-submit-btn:disabled:hover { background: var(--mint-dark, #A8884E); }

/* 진행 완료 안내 */
.ra-complete-box {
  background: var(--mint-pale, #FAFEFD);
  border: 1px solid var(--mint, #81D8D0);
  border-radius: var(--radius, 8px);
  padding: 28px;
  text-align: center;
  display: none;
}
.ra-complete-box.show { display: block; }
.ra-complete-icon { font-size: 40px; margin-bottom: 12px; }
.ra-complete-title {
  font-size: 20px;
  font-weight: 900;
  color: var(--text-primary, #1a1c1e);
  margin-bottom: 8px;
}
.ra-complete-desc {
  font-size: 14px;
  color: var(--text-secondary, #4a5568);
  line-height: 1.6;
  margin-bottom: 20px;
}
.ra-complete-back {
  display: inline-block;
  padding: 10px 24px;
  background: var(--mint-dark, #A8884E);
  color: var(--nws-white, #ffffff);
  border-radius: 20px;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  transition: background .15s;
}
.ra-complete-back:hover { background: var(--mint, #CEB588); }

/* 사이드 안내 카드 */
.ra-side-card {
  background: var(--nws-white, #ffffff);
  border: 1px solid var(--border, #eaecef);
  border-radius: var(--radius, 8px);
  padding: 20px;
  margin-bottom: 16px;
}
.ra-side-card-title {
  font-size: 14px;
  font-weight: 800;
  color: var(--text-primary, #1a1c1e);
  margin-bottom: 12px;
  padding-bottom: 10px;
  border-bottom: 2px solid var(--mint, #CEB588);
  display: flex;
  align-items: center;
  gap: 6px;
}
.ra-benefit-list { list-style: none; padding: 0; margin: 0; }
.ra-benefit-item {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  padding: 7px 0;
  font-size: 13px;
  color: var(--text-secondary, #4a5568);
  border-bottom: 1px solid var(--border, #eaecef);
  line-height: 1.5;
}
.ra-benefit-item:last-child { border-bottom: none; }
.ra-benefit-item i { color: var(--mint-dark, #228E84); font-size: 14px; margin-top: 1px; flex-shrink: 0; }

/* ═══════════════════════════════════════════════════════════════
   § 3. NWS-006 Newsroom 운영정보 — ni-*
═══════════════════════════════════════════════════════════════ */

/* 히어로 */
.ni-hero {
  background: var(--news-ticker-bg, #1a2830);
  color: var(--nws-white, #ffffff);
  padding: 56px 24px 44px;
  text-align: center;
}
.ni-hero-eyebrow {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .1em;
  color: var(--news-ticker-text, #e0f7f5);
  margin-bottom: 10px;
  text-transform: uppercase;
}
.ni-hero-title {
  font-size: clamp(26px, 3vw, 40px);
  font-weight: 900;
  margin-bottom: 12px;
  letter-spacing: -.02em;
}
.ni-hero-sub {
  font-size: 14px;
  color: rgba(255,255,255,.7);
  max-width: 480px;
  margin: 0 auto;
  line-height: 1.7;
}

/* anchor 탭 네비게이션 */
.ni-tab-nav {
  background: var(--nws-white, #ffffff);
  border-bottom: 2px solid var(--border, #eaecef);
  position: sticky;
  top: 64px;
  z-index: 90;
}
.ni-tab-nav-inner {
  max-width: var(--mw, 1280px);
  margin: 0 auto;
  padding: 0 12px;  /* 모바일 기본 */
  display: flex;
  gap: 0;
  overflow-x: auto;
  scrollbar-width: none;
}
.ni-tab-nav-inner::-webkit-scrollbar { display: none; }
.ni-tab-nav-link {
  padding: 12px 18px;
  font-size: 14px;
  font-weight: 600;
  color: var(--text-tertiary, #8a94a6);
  text-decoration: none;
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
  white-space: nowrap;
  transition: color .15s, border-color .15s;
}
.ni-tab-nav-link:hover { color: var(--text-primary, #1a1c1e); }
.ni-tab-nav-link.active {
  color: var(--mint-dark, #228E84);
  border-bottom-color: var(--mint-dark, #228E84);
}

/* 섹션 공통 */
.ni-section {
  padding: 32px 0;   /* 모바일 기본 */
  border-bottom: 1px solid var(--border, #eaecef);
  scroll-margin-top: 108px; /* sticky nav 오프셋 */
}
.ni-section:last-child { border-bottom: none; }
.ni-section-inner {
  max-width: var(--mw, 1280px);
  margin: 0 auto;
  padding: 0 16px;   /* 모바일 기본 */
}
@media (min-width: 768px) {
  .ni-section       { padding: 48px 0; }
  .ni-section-inner { padding: 0 24px; }
  .ni-chief-avatar  { width: 100px; height: 100px; }
  .rp-stat-num      { font-size: 22px; }
}
.ni-section-title {
  font-size: 22px;
  font-weight: 900;
  color: var(--text-primary, #1a1c1e);
  margin-bottom: 6px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.ni-section-desc {
  font-size: 14px;
  color: var(--text-secondary, #4a5568);
  line-height: 1.6;
  margin-bottom: 28px;
  max-width: 640px;
}

/* 편집장 카드 (운영정보) */
.ni-chief-card {
  display: flex;
  flex-direction: column;  /* 모바일: 세로 */
  align-items: center;
  text-align: center;
  gap: 16px;
  padding: 18px;           /* 모바일 기본 */
  background: var(--mint-pale, #FAFEFD);
  border: 1px solid var(--mint, #81D8D0);
  border-radius: var(--radius, 8px);
  margin-bottom: 24px;
}
@media (min-width: 768px) {
  .ni-chief-card { flex-direction: row; align-items: flex-start; text-align: left; gap: 24px; padding: 28px; }
  .ni-chief-contact { justify-content: flex-start; }
}
.ni-chief-avatar {
  width: 72px;    /* 모바일 기본 */
  height: 72px;
  border-radius: 50%;
  object-fit: cover;
  border: 3px solid var(--mint, #CEB588);
  background: var(--nws-white, #ffffff);
  flex-shrink: 0;
}
.ni-chief-body { flex: 1; min-width: 0; }
.ni-chief-role {
  font-size: 11px;
  font-weight: 700;
  color: var(--mint-dark, #228E84);
  letter-spacing: .05em;
  text-transform: uppercase;
  margin-bottom: 4px;
}
.ni-chief-name {
  font-size: 22px;
  font-weight: 900;
  color: var(--text-primary, #1a1c1e);
  margin-bottom: 6px;
}
.ni-chief-bio {
  font-size: 13px;
  color: var(--text-secondary, #4a5568);
  line-height: 1.7;
  margin-bottom: 12px;
}
.ni-chief-contact {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: center;  /* 모바일 기본 */
}
.ni-chief-contact a {
  font-size: 12px;
  color: var(--mint-dark, #228E84);
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 4px;
}
.ni-chief-contact a:hover { text-decoration: underline; }

/* 서약서 전문 박스 */
.ni-ethics-box {
  background: var(--bg, #fafaf8);
  border: 1px solid var(--border, #eaecef);
  border-radius: var(--radius, 8px);
  padding: 24px 28px;
  font-size: 13px;
  line-height: 1.85;
  color: var(--text-secondary, #4a5568);
  max-height: 500px;
  overflow-y: auto;
}
.ni-ethics-box::-webkit-scrollbar { width: 4px; }
.ni-ethics-box::-webkit-scrollbar-thumb { background: var(--border, #eaecef); border-radius: 2px; }
.ni-ethics-box h3 {
  font-size: 15px;
  font-weight: 800;
  color: var(--text-primary, #1a1c1e);
  margin: 1.4em 0 .5em;
}
.ni-ethics-box h3:first-child { margin-top: 0; }
.ni-ethics-box p { margin-bottom: .9em; }
.ni-ethics-box ol, .ni-ethics-box ul { padding-left: 1.5em; margin-bottom: .9em; }
.ni-ethics-box li { margin-bottom: .3em; }

/* 정책 비교 카드 그리드 */
.ni-policy-grid {
  display: grid;
  grid-template-columns: 1fr;   /* 모바일: 단일 열 */
  gap: 16px;
  margin-bottom: 24px;
}
@media (min-width: 768px) { .ni-policy-grid { grid-template-columns: repeat(2, 1fr); } }
.ni-policy-card {
  padding: 20px;
  border-radius: var(--radius, 8px);
  border: 1px solid var(--border, #eaecef);
  background: var(--nws-white, #ffffff);
}
.ni-policy-card.partner {
  border-color: var(--gold-border, #f0d070);
  background: var(--gold-light, #fef9ec);
}
.ni-policy-card-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .04em;
  margin-bottom: 6px;
  color: var(--text-tertiary, #8a94a6);
}
.ni-policy-card.partner .ni-policy-card-label { color: var(--gold, #c19a3a); }
.ni-policy-card-title {
  font-size: 15px;
  font-weight: 800;
  color: var(--text-primary, #1a1c1e);
  margin-bottom: 8px;
}
.ni-policy-card-list {
  list-style: none;
  padding: 0;
  margin: 0;
  font-size: 13px;
  color: var(--text-secondary, #4a5568);
  line-height: 1.6;
}
.ni-policy-card-list li { padding: 3px 0; display: flex; gap: 6px; }
.ni-policy-card-list li::before { content: "•"; color: var(--mint-dark, #228E84); flex-shrink: 0; }
.ni-policy-card.partner .ni-policy-card-list li::before { color: var(--gold, #c19a3a); }

/* 정정 요청 안내 박스 */
.ni-correction-box {
  background: var(--news-red-bg, rgba(226,52,52,.08));
  border: 1px solid var(--news-red-border, rgba(226,52,52,.25));
  border-radius: var(--radius, 8px);
  padding: 24px 28px;
}
.ni-correction-box h3 {
  font-size: 16px;
  font-weight: 800;
  color: var(--news-red, #e23434);
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  gap: 7px;
}
.ni-correction-box p {
  font-size: 14px;
  color: var(--text-primary, #1a1c1e);
  line-height: 1.7;
  margin-bottom: 14px;
}
.ni-correction-mail {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  background: var(--news-red, #e23434);
  color: var(--nws-white, #ffffff);
  border-radius: 20px;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
  transition: background .15s;
}
.ni-correction-mail:hover { background: var(--news-red-dark, #b02020); }

/* ═══════════════════════════════════════════════════════════════
   § 4. 반응형 업그레이드 노트 (Mobile-First v20260622)
   ※ max-width 미디어 쿼리 삭제 → 각 구성요소 기본값 + min-width 오버라이드로 이동:
     • .rp-layout / .rp-hero / .rp-hero-inner  → §1 ①③ + 768/1024px 미디어
     • .ra-layout / .ra-grade-step / .ra-card  → §2 + 768px 미디어
     • .ni-section / .ni-section-inner         → §3 + 768px 미디어
     • .ni-chief-card / .ni-policy-grid        → §3 + 768px 미디어
═══════════════════════════════════════════════════════════════ */
@media (min-width: 1280px) {
  .rp-layout, .ra-layout { padding-bottom: 72px; }
}

/* ═══════════════════════════════════════════════════════════════
   § 5. 언속성 보조 클래스 (NWS-003/004/005 inline style 대체)
   v20260622 신규 추가
═══════════════════════════════════════════════════════════════ */
/* 이름행 flex 래퍼 */
.rp-hero-name-row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 4px;
  justify-content: center;
}
@media (min-width: 1024px) { .rp-hero-name-row { justify-content: flex-start; } }

/* 수치 색상 헬퍼 */
.rp-stat-mint { color: var(--mint-dark, #228E84); }
.rp-stat-gold { color: var(--gold, #c19a3a); }
.rp-stat-red  { color: var(--news-red, #e23434); }

/* 카테고리 진체 색상 */
.rp-cat-violet { color: var(--violet, #7c3aed); }

/* 승인배지 그기 조정 */
.nwd-approved-badge.badge-sm { font-size: 11px; }

/* 기사 더 보기 버튼 */
.rp-load-more-btn {
  display: block;
  width: fit-content;
  margin: 24px auto 0;
  padding: 10px 28px;
  border: 1px solid var(--border, #eaecef);
  border-radius: 20px;
  background: none;
  font-size: 14px;
  font-weight: 600;
  color: var(--text-secondary, #4a5568);
  cursor: pointer;
  font-family: inherit;
  transition: border-color .15s, color .15s;
}
.rp-load-more-btn:hover {
  border-color: var(--mint-dark, #228E84);
  color: var(--mint-dark, #228E84);
}

/* ni-* 연락처 박스 */
.ni-contact-box {
  padding: 20px;
  background: var(--bg, #fafaf8);
  border: 1px solid var(--border, #eaecef);
  border-radius: var(--radius, 8px);
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  align-items: center;
}
@media (min-width: 768px) { .ni-contact-box { padding: 20px 24px; } }
.ni-contact-label {
  font-size: 12px;
  font-weight: 700;
  color: var(--text-tertiary, #8a94a6);
  margin-bottom: 4px;
}
.ni-contact-link {
  font-size: 14px;
  font-weight: 700;
  color: var(--mint-dark, #228E84);
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 5px;
}
.ni-contact-link:hover { text-decoration: underline; }
.ni-contact-cta { margin-left: auto; }
.ni-contact-cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 10px 20px;
  background: var(--mint-dark, #A8884E);
  color: var(--nws-white, #ffffff);
  border-radius: 20px;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  transition: background .15s;
}
.ni-contact-cta-btn:hover { background: var(--mint, #CEB588); }

/* ni-* 소제목 */
.ni-sub-heading {
  font-size: 16px;
  font-weight: 800;
  color: var(--text-primary, #1a1c1e);
  margin: 0 0 16px;
}
.ni-sub-heading-sm {
  font-size: 15px;
  font-weight: 800;
  color: var(--text-primary, #1a1c1e);
  margin: 0 0 14px;
}

/* ni-* 편집장 메타 dl */
.ni-chief-dl {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 4px 14px;
  font-size: 13px;
  color: var(--text-secondary, #4a5568);
  margin-bottom: 14px;
}
.ni-chief-dl dt {
  font-weight: 700;
  color: var(--text-tertiary, #8a94a6);
  white-space: nowrap;
}
.ni-chief-dl dd { margin: 0; }

/* ni-* 팀 구성 그리드 */
.ni-team-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}
@media (min-width: 480px) { .ni-team-grid { grid-template-columns: repeat(3, 1fr); } }

.ni-team-card {
  padding: 16px;
  background: var(--nws-white, #ffffff);
  border: 1px solid var(--border, #eaecef);
  border-radius: var(--radius, 8px);
}
.ni-team-card-role {
  font-size: 12px;
  font-weight: 700;
  color: var(--text-tertiary, #8a94a6);
  margin-bottom: 4px;
}
.ni-team-card-name {
  font-size: 14px;
  font-weight: 700;
  color: var(--text-primary, #1a1c1e);
  margin-bottom: 2px;
}
.ni-team-card-desc {
  font-size: 12px;
  color: var(--text-secondary, #4a5568);
}

/* ni-* 서약서 서명 현황 카드 그리드 */
.ni-sign-grid {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  margin-top: 16px;
}
.ni-sign-card {
  flex: 1;
  min-width: 160px;
  padding: 16px 20px;
  background: var(--nws-white, #ffffff);
  border: 1px solid var(--border, #eaecef);
  border-radius: var(--radius, 8px);
}
.ni-sign-card.accent {
  background: var(--mint-pale, #FAFEFD);
  border-color: var(--mint, #CEB588);
}
.ni-sign-card-label {
  font-size: 12px;
  font-weight: 700;
  color: var(--text-tertiary, #8a94a6);
  margin-bottom: 4px;
}
.ni-sign-card.accent .ni-sign-card-label { color: var(--mint-dark, #228E84); }
.ni-sign-card-num {
  font-size: 22px;
  font-weight: 900;
  color: var(--text-primary, #1a1c1e);
  margin-bottom: 2px;
}
.ni-sign-card-desc {
  font-size: 12px;
  color: var(--text-secondary, #4a5568);
}

/* ni-* 서약서 footer 노트 */
.ni-ethics-footer {
  margin-top: 1.6em;
  padding-top: 1em;
  border-top: 1px solid var(--border, #eaecef);
  font-size: 12px;
  color: var(--text-tertiary, #8a94a6);
}

/* ni-* 레이블 뱃지 (광고·PARTNER 정책 예시) */
.ni-label-row {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 24px;
}
.ni-label-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 12px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 700;
}
.ni-label-chip.editorial {
  background: var(--mint-pale, #FAFEFD);
  border: 1px solid var(--mint, #81D8D0);
  color: var(--mint-dark, #228E84);
}
.ni-label-chip.analysis {
  background: var(--violet-lt, #f5f0ff);
  border: 1px solid rgba(139,92,246,.3);
  color: var(--violet, #7c3aed);
}
.ni-label-chip.column {
  background: rgba(249,250,251,1);
  border: 1px solid var(--border, #eaecef);
  color: var(--text-secondary, #4a5568);
}
.ni-label-chip.partner {
  background: var(--gold-light, #fef9ec);
  border: 1px solid var(--gold-border, #f0d070);
  color: var(--gold, #c19a3a);
}
.ni-label-chip.ad {
  background: var(--news-red-bg, rgba(226,52,52,.08));
  border: 1px solid rgba(226,52,52,.25);
  color: var(--news-red, #e23434);
}

/* ni-* 기자 신청 CTA 박스 */
.ni-apply-cta-box {
  margin-top: 24px;
  padding: 24px 28px;
  background: linear-gradient(135deg, var(--mint-pale, #FFFAF2), var(--nws-white, #ffffff));
  border: 1px solid var(--mint, #81D8D0);
  border-radius: var(--radius, 8px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
}
.ni-apply-cta-title {
  font-size: 16px;
  font-weight: 900;
  color: var(--text-primary, #1a1c1e);
  margin-bottom: 6px;
}
.ni-apply-cta-desc {
  font-size: 13px;
  color: var(--text-secondary, #4a5568);
  line-height: 1.6;
}
.ni-apply-cta-btn {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 24px;
  background: var(--mint-dark, #A8884E);
  color: var(--nws-white, #ffffff);
  border-radius: 24px;
  font-size: 15px;
  font-weight: 800;
  text-decoration: none;
  white-space: nowrap;
  transition: background .15s;
}
.ni-apply-cta-btn:hover { background: var(--mint, #CEB588); }

/* ni-* 광고 문의 박스 */
.ni-ad-box {
  padding: 20px 24px;
  background: var(--gold-light, #fef9ec);
  border: 1px solid var(--gold-border, #f0d070);
  border-radius: var(--radius, 8px);
}
.ni-ad-box-title {
  font-size: 14px;
  font-weight: 700;
  color: var(--gold, #c19a3a);
  margin-bottom: 6px;
}
.ni-ad-box-desc {
  font-size: 13px;
  color: var(--text-secondary, #4a5568);
  margin-bottom: 10px;
  line-height: 1.7;
}
.ni-ad-box-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 700;
  color: var(--gold, #c19a3a);
  text-decoration: none;
}
.ni-ad-box-link:hover { text-decoration: underline; }

/* ra-* 비로그인 안내 박스 */
.ra-login-notice {
  background: rgba(226,52,52,.06);
  border: 1px solid rgba(226,52,52,.2);
  border-radius: var(--radius, 8px);
  padding: 18px 20px;
  margin-bottom: 20px;
}
.ra-login-notice-title {
  font-size: 14px;
  color: var(--news-red, #e23434);
  font-weight: 700;
  margin-bottom: 8px;
}
.ra-login-notice-desc {
  font-size: 13px;
  color: var(--text-secondary, #4a5568);
  margin-bottom: 14px;
}
.ra-login-btn {
  display: inline-block;
  padding: 9px 20px;
  background: var(--mint-dark, #A8884E);
  color: var(--nws-white, #ffffff);
  border-radius: 20px;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
  transition: background .15s;
}
.ra-login-btn:hover { background: var(--mint, #CEB588); }

/* ra-* 힌트 텍스트 */
.ra-hint-text {
  font-size: 11px;
  color: var(--text-tertiary, #8a94a6);
  margin-top: 4px;
}
.ra-optional-label {
  font-size: 11px;
  font-weight: 400;
  color: var(--text-tertiary, #8a94a6);
}
/* 특수 아이콘 색상 헬퍼 (reporter 진영) */
.ic-gold   { color: var(--gold, #c19a3a); }
.ic-violet { color: var(--violet, #7c3aed); }

/* ── ra-complete-box (신청 완료 화면) ── */
.ra-complete-box           { text-align:center; padding:48px 24px; }
.ra-complete-icon          { font-size:52px; margin-bottom:16px; }
.ra-complete-title         { font-size:24px; font-weight:900; color:var(--text-primary,#1a1c1e); margin-bottom:10px; }
.ra-complete-desc          { font-size:15px; color:var(--text-secondary,#4a5568); line-height:1.7; margin-bottom:24px; }
.ra-complete-actions       { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
.ra-complete-btn-primary   { padding:11px 24px; background:var(--mint-dark,#A8884E); color:var(--nws-white,#fff); border-radius:8px; font-size:14px; font-weight:700; text-decoration:none; }
.ra-complete-btn-secondary { padding:11px 24px; border:1px solid var(--border,#eaecef); color:var(--text-secondary,#4a5568); border-radius:8px; font-size:14px; font-weight:600; text-decoration:none; }

/* ── ra-submit-hint ── */
.ra-submit-hint { font-size:12px; color:var(--text-tertiary,#8a94a6); text-align:center; margin-top:8px; }

/* ── ra-sign-required ── */
.ra-sign-required { color:var(--news-red,#e23434); margin-left:2px; }

/* ── ra-ethics-footer (서약서 하단 메타) ── */
.ra-ethics-meta { margin-top:1.6em; font-size:12px; color:var(--text-tertiary,#8a94a6); }

/* ── ra-benefit-list (기자 혜택 사이드바) ── */
.ra-benefit-list    { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:12px; }
.ra-benefit-item    { display:flex; gap:10px; align-items:flex-start; font-size:13px; }
.ra-benefit-check   { color:var(--mint-dark,#A8884E); font-size:16px; flex-shrink:0; }
.ra-benefit-title   { font-weight:700; color:var(--text-primary,#1a1c1e); }
.ra-benefit-desc    { color:var(--text-secondary,#4a5568); font-size:12px; margin:2px 0 0; }

/* ── ra-grade-list (등급 안내 사이드바) ── */
.ra-grade-list      { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:8px; }
.ra-grade-item      { display:flex; align-items:center; gap:8px; font-size:12px; }
.ra-grade-desc      { color:var(--text-secondary,#4a5568); }
.rp-grade-badge.badge-sidebar { min-width:70px; justify-content:center; font-size:11px; }

/* ── ra-faq-list (자주 묻는 질문 사이드바) ── */
.ra-faq-list        { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:12px; }
.ra-faq-item        { font-size:13px; }
.ra-faq-q           { font-weight:700; color:var(--text-primary,#1a1c1e); }
.ra-faq-a           { color:var(--text-secondary,#4a5568); margin:4px 0 0; line-height:1.6; }
.ra-faq-more        { display:inline-block; margin-top:14px; font-size:12px; color:var(--mint-dark,#A8884E); text-decoration:none; font-weight:600; }

/* ═══════════════════════════════════════════════════════════════
   § 6. prefers-reduced-motion
═══════════════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
  .rp-follow-btn,
  .rp-share-btn,
  .rp-article-item,
  .ra-submit-btn,
  .ra-field-input,
  .ra-field-textarea,
  .ni-tab-nav-link,
  .ni-correction-mail { transition: none; }
}