/* NIWS — forgeanewera.com (2026-09-29 개편 · 미니멀 정리)
   디자인 근거: NIWS 명함 v15~v22 (DREAM_LOG 2026-09-13) — "빛과 그림자, 그리고 암흑만".
   규칙: 순수 검정 바탕 · 흑과 백 · 선과 면만(그라데이션·명암 조작 없음) · 넓은 자간 대문자 · 회색 3단(196/150/118).
   명함의 흉상 이미지는 쓰지 않는다(대리님 지시). 상징 = 북쪽 삼각형 + 분 눈금 호 + 사다리꼴 빛의 면.
   미니멀 디테일(대리님 지시 "미니멀한 디테일로 채워라"): 장식은 걷어내되 가는 선·작은 기호로 화면을 채운다 —
   나침반 링(프로필 12점 모티프 + 분 눈금), 사양 줄(설립·거점·좌표·단계), 구획 번호와 끝까지 이어지는 가는 선,
   원칙 선 아이콘, 페이지 가장자리 가는 세로선, 바닥 메타 줄. 움직임 없음.
   법적 요건 유지: 상법 시행령 제6조 제3항 — 공고는 초기화면에서 쉽게 찾을 수 있어야 함 → 스플래시·애니메이션 없음, 헤더에 '공고' 상시 노출. */

:root {
  --bg:    #000000;
  --ink:   #ffffff;
  --g1:    #c4c4c4;  /* 196 — 본문 */
  --g2:    #969696;  /* 150 — 보조 */
  --g3:    #767676;  /* 118 — 캡션·눈금 (검정 대비 4.6:1) */
  --line:  #2a2a2a;
  --max:   1040px;
  --mono:  ui-monospace, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
  --hair:  #151515;
  --sans:  "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans KR", "Malgun Gothic", sans-serif;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--bg); color: var(--g1);
  font-family: var(--sans); font-size: 16px; line-height: 1.8;
  -webkit-font-smoothing: antialiased; word-break: keep-all;
}
a { color: var(--ink); text-decoration: none; border-bottom: 1px solid var(--g3); }
a:hover { border-bottom-color: var(--ink); }
.wrap { max-width: var(--max); margin: 0 auto; padding: 0 24px; }

/* 헤더 — 선 없이 여백만 */
header { position: sticky; top: 0; z-index: 10; background: var(--bg); }
.hd { display: flex; align-items: center; justify-content: space-between; height: 72px; gap: 16px; }
.brand { display: flex; align-items: center; gap: 10px; border: 0; color: var(--ink);
  font-weight: 500; letter-spacing: .36em; font-size: 13px; }
.brand svg { width: 10px; height: 10px; }
nav ul { list-style: none; margin: 0; padding: 0; display: flex; gap: 32px; }
nav a { border: 0; color: var(--g3); font-size: 13px; letter-spacing: .06em; }
nav a:hover, nav a[aria-current="page"] { color: var(--ink); }

/* 첫 화면 — 삼각형 하나, 이름, 한 줄 */
.hero .inner { padding-top: 22vh; padding-bottom: 20vh; }
.mark { display: block; width: 12px; height: 12px; margin: 0 0 40px; }
.eyebrow { display: none; }
.hero h1 { margin: 0; color: var(--ink); font-weight: 300; font-size: clamp(44px, 8vw, 96px);
  letter-spacing: .32em; line-height: 1; }
.slogan { margin: 28px 0 0; color: var(--g3); font-size: 11px; letter-spacing: .46em; text-transform: uppercase; font-weight: 400; }
.lead { margin: 72px 0 0; color: var(--g1); font-size: clamp(17px, 2vw, 19px); font-weight: 400; line-height: 1.6; max-width: 560px; }
.lead + p { margin: 12px 0 0; max-width: 560px; }

/* 구획 — 선 대신 여백 */
section { padding: 112px 0; }
.hero + section { padding-top: 32px; }
.label { color: var(--g3); font-size: 11px; letter-spacing: .42em; text-transform: uppercase; margin: 0 0 14px; }
h2 { margin: 0 0 48px; color: var(--ink); font-size: 22px; font-weight: 400; letter-spacing: -.005em; }
h3 { margin: 0 0 10px; color: var(--ink); font-size: 16px; font-weight: 500; }
.grid3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 56px; }
.grid3 > div { padding: 0; }
.grid3 .n { display: block; color: var(--g3); font-size: 11px; letter-spacing: .3em; margin-bottom: 20px; }
.grid3 p { margin: 0; font-size: 15px; color: var(--g2); }
.list { list-style: none; margin: 0; padding: 0; }
.list li { display: grid; grid-template-columns: 200px 1fr; gap: 24px; padding: 0 0 36px; }
.list li b { color: var(--ink); font-weight: 500; }
.list li span { color: var(--g2); }
.note { color: var(--g3); font-size: 13px; margin-top: 8px; }

/* 사실 표 — 가는 선 하나만 */
table.facts { width: 100%; border-collapse: collapse; }
.facts th, .facts td { text-align: left; padding: 14px 0; border-bottom: 1px solid #141414; vertical-align: top; font-size: 15px; }
.facts th { width: 180px; color: var(--g3); font-weight: 400; padding-right: 24px; }
.facts td { color: var(--g1); }
ol.purpose { columns: 2; column-gap: 56px; margin: 0; padding-left: 1.6em; color: var(--g2); font-size: 14px; }
ol.purpose li { break-inside: avoid; padding: 3px 0; }

/* 공고 */
.empty { padding: 0; color: var(--g2); }
.notice-cta { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; flex-wrap: wrap; }
.btn { display: inline-block; border: 0; border-bottom: 1px solid var(--ink); color: var(--ink); padding: 0 0 4px; font-size: 13px; letter-spacing: .14em; }
.btn:hover { color: var(--g1); border-bottom-color: var(--g1); background: none; }

/* 바닥 */
footer { padding: 64px 0 72px; color: var(--g3); font-size: 12px; }
footer .co { color: var(--g3); letter-spacing: .3em; font-size: 11px; margin: 0 0 10px; }
footer p { margin: 2px 0; }

@media (max-width: 760px) {
  .hd { height: 60px; }
  nav ul { gap: 18px; }
  nav a { font-size: 13px; letter-spacing: .02em; }
  .hero .inner { padding-top: 14vh; padding-bottom: 12vh; }
  .hero h1 { letter-spacing: .24em; }
  .slogan { font-size: 10px; letter-spacing: .28em; }
  .lead { margin-top: 48px; }
  section { padding: 72px 0; }
  .grid3 { grid-template-columns: 1fr; gap: 40px; }
  .list li { grid-template-columns: 1fr; gap: 6px; padding-bottom: 28px; }
  .facts th { width: 108px; }
  ol.purpose { columns: 1; }
}

/* ── 미니멀 디테일 ── */
/* 페이지 가장자리 가는 세로선(본문 폭 기준) */
body::before, body::after { content: ""; position: fixed; top: 0; bottom: 0; width: 1px; background: var(--hair); pointer-events: none; z-index: 0; }
body::before { left: calc(50% - var(--max) / 2); }
body::after  { left: calc(50% + var(--max) / 2 - 1px); }
header, main, footer { position: relative; z-index: 1; }
header::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px;
  background: linear-gradient(90deg, transparent, var(--hair) 20%, var(--hair) 80%, transparent); }

/* 첫 화면 나침반 링 */
.hero .inner { position: relative; }
.ring { position: absolute; right: 8px; top: 50%; width: min(420px, 38vw); transform: translateY(-50%); }
.ring text { fill: #767676; font: 500 11px var(--mono); letter-spacing: .1em; }

/* 사양 줄 */
.spec { display: grid; grid-template-columns: repeat(4, auto); justify-content: start; gap: 0; margin: 56px 0 0; padding: 0; }
.spec > div { padding: 0 28px; border-left: 1px solid #222; }
.spec > div:first-child { padding-left: 0; border-left: 0; }
.spec dt { color: var(--g3); font: 400 10px var(--mono); letter-spacing: .24em; text-transform: uppercase; margin: 0 0 6px; }
.spec dd { margin: 0; color: var(--g1); font: 400 13px var(--mono); letter-spacing: .04em; }

/* 구획 라벨: 번호 · 이름 · 끝까지 이어지는 선 · 개수 */
.label { display: flex; align-items: center; gap: 14px; }
.label::after { content: ""; flex: 1; height: 1px; background: var(--hair); order: 2; }
.label .idx { color: var(--ink); font-family: var(--mono); letter-spacing: .1em; }
.label .cnt { order: 3; font-family: var(--mono); letter-spacing: .1em; }
.label .cnt::before { content: "/ "; }

/* 원칙 아이콘 */
.grid3 .ico { display: block; width: 28px; height: 28px; margin: 0 0 22px; opacity: .9; }
.grid3 > div { border-top: 1px solid var(--hair); padding-top: 28px; }

/* 사업 항목 기호 */
.list li { border-top: 1px solid var(--hair); padding-top: 22px; }
.list li b i { display: inline-block; width: 22px; color: var(--g3); font: normal 400 11px var(--mono); letter-spacing: .1em; }

/* 바닥 메타 줄 */
.ft-meta { display: flex; flex-wrap: wrap; gap: 8px 28px; align-items: center; margin-top: 36px; padding-top: 20px;
  border-top: 1px solid var(--hair); font: 400 10px var(--mono); letter-spacing: .2em; text-transform: uppercase; color: var(--g3); }
.ft-meta span:first-child { display: inline-flex; align-items: center; gap: 8px; flex: 1; }
.ft-meta svg { width: 8px; height: 8px; }
.ft-meta a { border: 0; color: var(--g2); }
.ft-meta a:hover { color: var(--ink); }

@media (max-width: 1100px) { body::before, body::after { display: none; } }
@media (max-width: 900px) {
  .ring { position: relative; right: auto; top: auto; transform: none; display: block; width: 220px; margin: 0 0 32px -12px; }
  .hero .inner { padding-top: 8vh; }
  .mark { display: none; }
}
@media (max-width: 760px) {
  .spec { grid-template-columns: repeat(2, auto); row-gap: 20px; }
  .spec > div:nth-child(3) { padding-left: 0; border-left: 0; }
}
.notice-cta > div:first-child { flex: 1; min-width: 260px; }
.hero .mark { display: none; }
section { padding: 96px 0; }
@media (max-width: 760px) { section { padding: 64px 0; } }