/* KMS 홈페이지 — 홈 페이지 전용 (FINAL_spec §4.3 히어로 + 홈 섹션 그리드) */

/* ---------- Hero ---------- */
.hero{position:relative;min-height:100svh;background:var(--navy-900);color:var(--on-dark);display:flex;align-items:flex-end;overflow:hidden;isolation:isolate}
/* 히어로 사진은 담배 카톤이 프레임에 들어오지 않도록 원본을 다시 잘라 구웠다(§6 라벨 판독 불가 게이트).
   object-position 오프셋은 이미지 비율(4:3)보다 가로로 긴 뷰포트에서 cover 가 세로만 잘라내 무력화되므로 쓰지 않고,
   공통 .hero-media img 의 50% 45% 를 그대로 쓴다. */
.hero .wrap{position:relative;width:100%;padding-top:calc(var(--header-h) + var(--s5) + var(--s3));padding-bottom:var(--s5)}   /* 160px(모바일) / 172px(≥1024): 헤더 높이 토큰 연동 */
@media (min-width:1024px){.hero .wrap{padding-bottom:var(--s6)}}
.hero-grid{display:grid;gap:var(--s4)}
@media (min-width:1024px){.hero-grid{grid-template-columns:8fr 4fr;align-items:end;gap:var(--s5)}}
.hero .eyebrow{margin-bottom:var(--s3)}
@media (min-width:768px){.hero .eyebrow::before{width:40px}}
@media (max-width:479px){.hero .eyebrow{font-size:11px;letter-spacing:.14em}}
.hero-display{display:block;font-family:var(--serif);font-weight:500;font-size:var(--fs-display-xl);line-height:.98;letter-spacing:-.02em;color:#fff}
.hero-display em{font-style:italic;font-weight:400;color:rgba(255,255,255,.8)}
.hero-h1{margin-top:var(--s3);font-size:var(--fs-h1-kr);font-weight:800;letter-spacing:-.025em;line-height:1.35;color:#fff}
.hero-h1:lang(en){font-family:var(--serif);font-weight:600;font-size:clamp(28px,3.2vw,44px);line-height:1.15;letter-spacing:-.015em}
.hero-sub{max-width:44ch;font-size:16px;line-height:1.8;color:var(--on-dark-2);text-wrap:pretty}
@media (min-width:1024px){.hero-sub{font-size:17px}}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:var(--s3)}

/* Why · Business · Organization 분할은 공용 .split(.is-75/.has-figure) 사용 — components.css */