/* NAUKRI INDIA — 인도 팔레트(사프란·네이비·아이보리·메헨디 그린) + luxx 미니홈피 프레임 이식 */
:root {
  --saffron: #E2801A; --saffron-deep: #B85E08; --saffron-soft: #FDEBD3;
  --navy: #123C69; --navy-deep: #0A2342;
  --green: #1B7A3D;
  --bg: #FDF9F2; --panel: #FFFFFF; --text: #2B2118; --muted: #8A7A6A;
  --line: rgba(43,33,24,.12);
  --gold-grad: linear-gradient(135deg,#B85E08,#F8C377,#E2801A,#FFE3B8,#B85E08);
  --r-card: 12px; --r-pill: 50px;
  --serif: 'Merriweather', Georgia, serif;
  --sans: 'DM Sans', 'Noto Sans KR', system-ui, sans-serif;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
body { background: var(--bg); color: var(--text); font-family: var(--sans); font-size: 15px; line-height: 1.6; }
a { color: inherit; text-decoration: none; }
.nk-wrap { max-width: 1180px; margin: 0 auto; padding: 0 20px; }

/* 상단바 — 네이비 위 사프란 로고 */
.nk-top { background: var(--navy-deep); color: #F5EFE4; position: sticky; top: 0; z-index: 50; box-shadow: 0 2px 14px rgba(10,35,66,.25); }
.nk-topin { display: flex; align-items: center; gap: 26px; height: 62px; }
.nk-logo { font-family: var(--serif); font-weight: 900; font-size: 21px; letter-spacing: .04em;
  background: var(--gold-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.nk-logo span { font-size: 11px; letter-spacing: .3em; display: block; margin-top: -6px; color: #C9B896; -webkit-text-fill-color: #C9B896; }
.nk-nav { display: flex; gap: 20px; flex: 1; font-size: 14px; }
.nk-nav a { color: rgba(245,239,228,.82); padding: 6px 2px; }
.nk-nav a:hover { color: #F8C377; }
.nk-auth { display: flex; gap: 8px; }
.nk-btn { display: inline-flex; align-items: center; gap: 6px; padding: 8px 16px; border-radius: var(--r-pill);
  font-size: 13px; font-weight: 700; cursor: pointer; border: none; font-family: var(--sans); }
.nk-btn-fill { background: var(--gold-grad); color: var(--navy-deep); box-shadow: 0 4px 16px rgba(226,128,26,.35); }
.nk-btn-fill:hover { filter: brightness(1.05); }
.nk-btn-line { border: 1px solid rgba(248,195,119,.5); color: #F8C377; background: transparent; }
.nk-btn-ghost { background: rgba(248,195,119,.12); color: #F8C377; }
main .nk-btn-line, main .nk-btn-ghost { color: var(--saffron-deep); border-color: rgba(226,128,26,.45); }

.nk-main { padding: 26px 20px 60px; }
h1 { font-family: var(--serif); font-size: 26px; color: var(--navy-deep); margin-bottom: 6px; }
.nk-sub { color: var(--muted); font-size: 13px; margin-bottom: 20px; }
h2 { font-size: 13px; text-transform: uppercase; letter-spacing: .18em; color: var(--saffron-deep); margin: 26px 0 12px; }
h3 { font-family: var(--serif); font-size: 17px; color: var(--navy-deep); margin-bottom: 10px; }

/* 히어로 */
.nk-hero { background: linear-gradient(135deg, var(--navy-deep), var(--navy) 60%, #1B5A8A); color: #F5EFE4;
  border-radius: 16px; padding: 44px 40px; margin-bottom: 26px; position: relative; overflow: hidden; }
.nk-hero::after { content: ''; position: absolute; right: -60px; top: -60px; width: 260px; height: 260px;
  border-radius: 50%; background: radial-gradient(circle, rgba(226,128,26,.35), transparent 70%); }
.nk-hero h1 { color: #FFF; font-size: 32px; }
.nk-hero h1 em { font-style: normal; background: var(--gold-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.nk-hero p { color: rgba(245,239,228,.8); margin: 8px 0 18px; }
.nk-chips { display: flex; gap: 8px; flex-wrap: wrap; }
.nk-chip { padding: 8px 18px; border-radius: var(--r-pill); background: rgba(255,255,255,.1);
  border: 1px solid rgba(248,195,119,.35); color: #F8C377; font-size: 13px; font-weight: 700; }
.nk-chip:hover, .nk-chip.on { background: var(--gold-grad); color: var(--navy-deep); }

/* 카드/그리드 */
.nk-card { background: var(--panel); border: 1px solid var(--line); border-radius: var(--r-card);
  padding: 20px; box-shadow: 0 4px 18px rgba(43,33,24,.05); margin-bottom: 16px; }
.nk-grid { display: grid; gap: 16px; }
.nk-grid-2 { grid-template-columns: 1fr 1fr; }
.nk-grid-3 { grid-template-columns: repeat(3, 1fr); }
.nk-grid-side { grid-template-columns: 1fr 370px; align-items: start; }
@media (max-width: 900px) { .nk-grid-2, .nk-grid-3, .nk-grid-side { grid-template-columns: 1fr; } .nk-nav { display: none; } }

/* 공고/업체 카드 */
.nk-job { display: block; padding: 16px 18px; border: 1px solid var(--line); border-radius: var(--r-card);
  background: var(--panel); transition: .18s; margin-bottom: 10px; }
.nk-job:hover { border-color: var(--saffron); box-shadow: 0 8px 22px rgba(226,128,26,.14); transform: translateY(-2px); }
.nk-job-title { font-weight: 700; font-size: 16px; color: var(--navy-deep); }
.nk-job-meta { display: flex; gap: 12px; flex-wrap: wrap; color: var(--muted); font-size: 12.5px; margin-top: 5px; }
.nk-salary { color: var(--green); font-weight: 700; }
.nk-badge { display: inline-block; padding: 3px 11px; border-radius: var(--r-pill); font-size: 11px; font-weight: 700;
  background: var(--saffron-soft); color: var(--saffron-deep); border: 1px solid rgba(226,128,26,.3); }
.nk-badge.navy { background: rgba(18,60,105,.08); color: var(--navy); border-color: rgba(18,60,105,.25); }
.nk-badge.green { background: rgba(27,122,61,.09); color: var(--green); border-color: rgba(27,122,61,.3); }
.nk-dist { color: var(--navy); font-weight: 700; }

/* 필터 폼 */
.nk-filter { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin-bottom: 18px; }
.nk-filter select, .nk-filter input[type=text] { padding: 10px 14px; border: 1px solid var(--line); border-radius: 8px;
  background: #FFF; font-size: 14px; font-family: var(--sans); min-width: 150px; }
.nk-filter select:focus, .nk-filter input:focus { outline: none; border-color: var(--saffron); box-shadow: 0 0 0 3px rgba(226,128,26,.15); }

/* 지도 */
#nk-map { width: 100%; height: 420px; border-radius: var(--r-card); border: 1px solid var(--line); }

/* 육각 레이더 */
.nk-hexcard { text-align: center; }
.nk-hexhead { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; }
.nk-hexwrap { display: flex; justify-content: center; }
.nk-hexnote { font-size: 11.5px; color: var(--muted); margin-top: 6px; }
.nk-rateform { display: flex; flex-direction: column; gap: 8px; }
.nk-axis { display: grid; grid-template-columns: 88px 1fr 26px; align-items: center; gap: 10px; font-size: 13px; }
.nk-axis input[type=range] { accent-color: var(--saffron); }
.nk-axis output { font-weight: 700; color: var(--saffron-deep); text-align: right; }
.nk-rateform input[type=text] { padding: 9px 12px; border: 1px solid var(--line); border-radius: 8px; }
.nk-empty { color: var(--muted); text-align: center; padding: 18px 0; }

/* ============ 미니홈피 — luxx .mh-window 싸이월드 프레임 이식 ============ */
.mh-stage { display: flex; justify-content: center; padding: 10px 0 30px; }
.mh-window { width: 100%; max-width: 980px; background: var(--mh-panel, #FFF); border-radius: 14px;
  border: 1px solid var(--mh-line, var(--line)); box-shadow: 0 18px 60px rgba(20,15,8,.18); overflow: hidden; }
.mh-titlebar { display: flex; align-items: center; gap: 8px; padding: 11px 16px;
  background: var(--mh-accent, var(--saffron)); color: #FFF; }
.mh-dots { display: flex; gap: 6px; }
.mh-dots i { width: 11px; height: 11px; border-radius: 50%; display: block; }
.mh-dots i:nth-child(1){ background:#FF5F57; } .mh-dots i:nth-child(2){ background:#FEBC2E; } .mh-dots i:nth-child(3){ background:#28C840; }
.mh-titlebar .mh-name { flex: 1; text-align: center; font-weight: 700; font-size: 14px; letter-spacing: .04em; }
.mh-counter { font-size: 11px; font-family: var(--sans); opacity: .92; }
.mh-counter b { color: #FFE3B8; }
.mh-body { display: grid; grid-template-columns: 240px 1fr 48px; min-height: 520px; background: var(--mh-bg, #FDF6EC); }
.mh-left { padding: 20px 16px; border-right: 1px solid var(--mh-line, var(--line)); }
.mh-avatar { width: 92px; height: 92px; border-radius: 50%; margin: 0 auto 10px; display: flex; align-items: center; justify-content: center;
  background: var(--gold-grad); color: var(--navy-deep); font-size: 34px; font-weight: 900; font-family: var(--serif); }
.mh-left h2 { text-transform: none; letter-spacing: 0; text-align: center; color: var(--mh-text, var(--text)); font-size: 17px; font-family: var(--serif); margin: 0 0 2px; }
.mh-left .mh-intro { font-size: 12.5px; color: var(--mh-muted, var(--muted)); text-align: center; margin-bottom: 14px; white-space: pre-line; }
.mh-stats { display: grid; grid-template-columns: 1fr 1fr 1fr; text-align: center; border-top: 1px solid var(--mh-line, var(--line));
  border-bottom: 1px solid var(--mh-line, var(--line)); padding: 10px 0; margin-bottom: 12px; }
.mh-stats b { display: block; font-size: 16px; color: var(--mh-accent, var(--saffron-deep)); }
.mh-stats span { font-size: 11px; color: var(--mh-muted, var(--muted)); }
.mh-main { padding: 20px 22px; overflow: auto; }
.mh-tabs { display: flex; flex-direction: column; background: var(--mh-panel, #FFF); border-left: 1px solid var(--mh-line, var(--line)); }
.mh-tabs a { writing-mode: vertical-rl; padding: 16px 13px; font-size: 12px; font-weight: 700; letter-spacing: .18em;
  color: var(--mh-muted, var(--muted)); border-bottom: 1px solid var(--mh-line, var(--line)); }
.mh-tabs a.on { background: var(--mh-accent, var(--saffron)); color: #FFF; }
.mh-guest-item { padding: 11px 4px; border-bottom: 1px dashed var(--mh-line, var(--line)); font-size: 13.5px; color: var(--mh-text, var(--text)); }
.mh-guest-item .who { font-weight: 700; color: var(--mh-accent, var(--saffron-deep)); margin-right: 8px; }
.mh-guest-item .when { font-size: 11px; color: var(--mh-muted, var(--muted)); margin-left: 8px; }
.mh-guest-form { display: flex; gap: 8px; margin-top: 12px; }
.mh-guest-form input[type=text] { flex: 1; padding: 10px 12px; border: 1px solid var(--mh-line, var(--line)); border-radius: 8px; background: var(--mh-panel, #FFF); color: var(--mh-text, var(--text)); }
.mh-skinbar { display: flex; gap: 6px; justify-content: center; margin-top: 12px; }
.mh-skinbar a { width: 20px; height: 20px; border-radius: 50%; border: 2px solid rgba(0,0,0,.15); }
.mh-section-title { font-size: 12px; text-transform: uppercase; letter-spacing: .16em; color: var(--mh-accent, var(--saffron-deep)); margin: 18px 0 8px; font-weight: 700; }
@media (max-width: 760px) {
  .mh-body { grid-template-columns: 1fr; }
  .mh-tabs { flex-direction: row; border-left: none; border-top: 1px solid var(--mh-line, var(--line)); }
  .mh-tabs a { writing-mode: horizontal-tb; flex: 1; text-align: center; }
}

/* 테이블 */
.nk-table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.nk-table th { text-align: left; font-size: 11px; text-transform: uppercase; letter-spacing: .08em; color: var(--muted);
  padding: 8px 10px; border-bottom: 1px solid var(--line); }
.nk-table td { padding: 10px; border-bottom: 1px solid rgba(43,33,24,.06); }

.nk-foot { background: var(--navy-deep); color: rgba(245,239,228,.75); padding: 26px 0; font-size: 13px; }
.nk-foot .nk-foot-sub { font-size: 11.5px; color: rgba(245,239,228,.45); margin-top: 6px; }