/* 홈 히어로 아래 세 절(2026-10-26 기획 13절 1 — 활용 방법 intro.html 에서 옮김): / 01 업무로 시작(#usage) · / 02 AI에게 맡기기(#ai) · / 03 AI가 읽는 순서와 파일(#files).
 * 세 절은 홈 본문의 틀 div.wrap.home-flow 안에 있어 절에 .wrap 을 겹쳐 걸지 않는다. 절마다의 규칙은 제 파일에 있다 — / 01 목록 assets/work-list.css·
 * 아이콘 work-icons.css·위 인포그래픽 work-pick.css, / 02 kg-prompt.css, / 03 주소 설명 그림 I1 intro-trace.css·주소와 파일 목록 kg-files.css
 * (세 층 그림·소방 지식 그래프 상황판은 2026-10-26 기획 13절 4 로 인천소방 AX 로 — home-scene.css·knowledge-graph.css).
 * 여기에는 세 절이 함께 쓰는 절 머리(.shead)·/ 02 이름표·/ 03 틀만 둔다(그 아래 두 카드 줄 .ir-* 는 2026-10-27 운영자 지시로 지웠다) — assets/intro.css 에서 글자 그대로 옮겼다.
 * 색은 토큰만(theme-ratchet 0), 섬이 아니라 라이트에서는 라이트 토큰으로 그린다. 클래스 이름(intro-ai·intro-files)은 처음 자리(활용 방법)에서 왔다.
 * 규칙: .claude/rules/hubs/site-shell.md '홈 아래 세 절' */
/* 세 절의 틀 — 바닥글 앞 여백(맨 아래 상황판은 2026-10-26 기획 13절 4 로 인천소방 AX 로) */
.home-flow{padding-bottom:120px}

/* ===== 섹션 헤더 ===== */
.shead{display:flex;align-items:flex-end;justify-content:space-between;margin:120px 0 40px;flex-wrap:wrap;gap:14px}
.shead .ix{font-family:"Space Grotesk";font-size:13px;color:var(--txt-dim);letter-spacing:.12em;margin-bottom:12px;display:block}
.shead h2{font-size:clamp(30px,4.5vw,46px);font-weight:700;letter-spacing:-.02em;line-height:1.05;font-family:"Space Grotesk"}
.shead h2 .it{font-family:"Instrument Serif";font-style:italic;font-weight:400;padding-right:.1em}
.shead p{font-size:14px;color:var(--txt-dim);max-width:300px;text-align:right}

/* ===== / 02 — AI에게 맡기기(section#ai.hs-section — 규칙은 assets/kg-prompt.css) · / 03 — AI가 읽는 순서와 파일(section#files — 주소 설명 그림 I1 은 assets/intro-trace.css, 파일 목록은 assets/kg-files.css) =====
 * 2026-10-26 운영자 지시로 옛 소방 지식 그래프 페이지의 프롬프트 절·'AI에게 주는 주소' 절을 활용 방법으로, 같은 날 홈으로 옮겼다.
 * / 02 의 이름표(.hs-label)는 다른 절 이름표(.shead .ix)와 같은 글꼴·크기로 맞춘다. */
.intro-ai .hs-label{font:400 13px "Space Grotesk",var(--font-sans);letter-spacing:.12em}
.intro-files{scroll-margin-top:96px}
.intro-files .shead{margin-top:104px}


@media (max-width:900px){
  .shead p{text-align:left}
}