/* 사업 허브 공통 템플릿 (2026-11-05)
   aidp-hub · ai-hub · data-hub · cloud-hub · security-hub 다섯 페이지가 같은 구조를 쓴다.
   히어로(feat--split) → SOLUTIONS → CASES → OTHER BUSINESS → 산업에서 찾기(tiles) + CTA.
   카드는 components.css 의 .hubcol 을 그대로 쓰고, 여기서는 열 수와 줄 맞춤만 정한다. */

.biz-hub {
  /* 카드 한 장이 차지하는 행 수 — 아래 .hubcol--* 에서 섹션마다 정한다 */
  --hub-rows: 5;
  --hub-cols: 4;
  --hub-row-gap: var(--sp-8);
  /* 회사소개 · 인사이트 허브(hub-common.css)와 같은 값 */
  --hub-line: var(--text-primary);
  --hub-hover-wash: color-mix(in srgb, var(--c-neutral-900) 6%, transparent);
  --hub-media-radius: var(--radius-lg);
  --hub-other-bg: #fbfaf3; /* 다른 사업 구역 바탕(사용자 지정) */
}

/* 다른 사업 구역: 사례(크림)보다 한 톤 밝은 바탕으로 마무리 */
.biz-hub > #other-business {
  background: var(--hub-other-bg);
}

/* 상단 배너: 판 없이 사진 | 글(공용 .feat), 제목 굵기 한 단계 낮춤, 본문은 보조 글색 */
.biz-hub .feat--split .feat__title {
  font-weight: 700;
  letter-spacing: var(--tracking-heading);
}

/* ── 히어로 이미지: 허브마다 한 장, 기존 사업 이미지 재사용 ── */
.feat--hub-aidp {
  --card-media: url("../../../media/business/cover-data-ai.jpg?v=99f6ee9360c2");
}
.feat--hub-ai {
  --card-media: url("../../../media/business/ai-hub-hero.jpg");
}
.feat--hub-data {
  --card-media: url("../../../media/business/databricks-why-1.jpg");
}
.feat--hub-cloud {
  --card-media: url("../../../media/business/hero-cloud-hub.jpg?v=62bf601bb240");
}
.feat--hub-security {
  --card-media: url("../../../media/business/security-hub-hero.jpg?v=20261106a");
}

/* 히어로 오른쪽 본문은 한 단계 낮은 글색 — 자르기·버튼 위치는 공용 .feat 규칙이 맡는다. */
.biz-hub .feat--split .feat__read {
  color: var(--text-secondary);
}
/* 보조 버튼: 다른 허브와 같은 검정 글씨 + 검정 1px 선, 호버는 옅은 바탕 */
.biz-hub .feat__acts .btn:not(.btn--solid) {
  border-color: var(--hub-line);
  background: transparent;
  color: var(--text-primary);
}
.biz-hub .feat__acts .btn:not(.btn--solid):hover {
  border-color: var(--hub-line);
  background: var(--hub-hover-wash);
}

/* ── 카드 그리드: 열 수 = 카드 수(최대 4) ── */
.biz-hub .hubcol__grid {
  grid-template-columns: repeat(var(--hub-cols), minmax(0, 1fr));
  /* subgrid 를 쓰면 부모 행 간격이 카드 안 줄마다 끼므로, 행 간격은 0 으로 두고 카드 아래 여백으로 준다 */
  row-gap: 0;
  margin-bottom: calc(-1 * var(--hub-row-gap));
}
.biz-hub .hubcol__grid:has(> :last-child:nth-child(1)) {
  --hub-cols: 1;
}
.biz-hub .hubcol__grid:has(> :last-child:nth-child(2)) {
  --hub-cols: 2;
}
.biz-hub .hubcol__grid:has(> :last-child:nth-child(3)) {
  --hub-cols: 3;
}

/* 카드 안 줄 맞춤: 같은 줄 카드의 분류·제목·설명·기술·이미지가 같은 선에서 시작하도록 subgrid */
.biz-hub .hubcol--sol {
  --hub-rows: 5; /* 선 · 분류 · 제목 · 설명 · 이미지 */
}
.biz-hub .hubcol--case {
  --hub-rows: 5; /* 선 · 고객/분야 · 제목 · 요약 · 사용 기술 */
}
.biz-hub .hubcol--rel {
  --hub-rows: 3; /* 선 · 제목 · 설명 */
}
.biz-hub .hubcol__item {
  display: grid;
  grid-row: span var(--hub-rows);
  grid-template-rows: subgrid;
  row-gap: 0;
  padding-bottom: var(--hub-row-gap);
}
.biz-hub .hubcol__desc {
  text-wrap: balance;
}
.biz-hub .hubcol__art {
  border-radius: var(--hub-media-radius);
}
.biz-hub .hubcol__grid:has(> :last-child:nth-child(1)) .hubcol__desc {
  max-inline-size: var(--measure);
}

/* 사례 카드의 사용 기술 줄 */
.hubcol__tech {
  align-self: start;
  font-size: var(--fs-label);
  font-weight: 600;
  line-height: var(--lh-body);
  letter-spacing: var(--tracking-label);
  color: var(--text-secondary);
}

/* 섹션 제목(칩)은 h2 로 올렸으므로 h2 기본값이 칩 모양을 바꾸지 않게 고정 */
.biz-hub h2.hubcol__label {
  text-wrap: nowrap;
}

/* 산업에서 찾기 아래 CTA 간격(business-hub.css 에서 옮김) */
.biz-hub .section--stone .cta-row {
  margin-top: var(--sp-7);
}

/* ── 제품 카드 이미지: 같은 제품은 어느 허브에서나 같은 그림 ── */
.biz-art--adp {
  --card-media: url("../../../media/business/ai-hub-adp.jpg");
}
.biz-art--agent {
  --card-media: url("../../../media/business/ai-hub-agent.jpg");
}
.biz-art--guardian {
  --card-media: url("../../../media/product/sapie-guardian/cover.jpg?v=99f6ee9360c2");
}
.biz-art--lake {
  --card-media: url("../../../media/business/cover-data-platform.jpg?v=99f6ee9360c2");
}
.biz-art--databricks {
  --card-media: url("../../../media/business/cover-databricks-v2-end.jpg?v=20261106a");
}
.biz-art--starburst {
  --card-media: url("../../../media/business/cover-starburst.jpg?v=99f6ee9360c2");
}
.biz-art--sailpoint {
  --card-media: url("../../../media/business/cover-identity.jpg?v=99f6ee9360c2");
}
.biz-art--aws {
  --card-media: url("../../../media/business/cover-cloud.jpg?v=99f6ee9360c2");
}
.biz-art--redhat {
  --card-media: url("../../../media/business/cover-redhat.jpg?v=99f6ee9360c2");
}
.biz-art--fitcloud {
  --card-media: url("../../../media/product/fitcloud/cover.jpg?v=99f6ee9360c2");
}

/* ── 반응형 ── */
/* 4개 이상 그리드는 1200 미만에서 2열 — 좁은 4열로 제목이 두 줄로 갈리지 않게(hub-common.css 와 같은 경계) */
@media (max-width: 1199px) {
  .biz-hub .hubcol__grid:has(> :nth-child(4)) {
    --hub-cols: 2;
  }
}
@media (max-width: 1080px) {
  .biz-hub {
    --hub-row-gap: var(--sp-7);
  }
}
@media (max-width: 860px) {
  .biz-hub .hubcol__grid:has(> :last-child:nth-child(3)) {
    --hub-cols: 1;
  }
  /* 모바일 글자 하한: 사용 기술 줄 · 산업 타일 설명은 정보라 13px 이상(산업 페이지 타일과 같은 값) */
  .biz-hub .hubcol__tech,
  .biz-hub a.tile .tile__desc {
    font-size: var(--fs-2xs);
  }
}
@media (max-width: 640px) {
  /* 한 열 목록일 때 관련 사업은 짧은 링크 목록이라 간격을 좁힌다 */
  .biz-hub .hubcol--rel {
    --hub-row-gap: var(--sp-4);
  }
  .biz-hub .hubcol__grid,
  .biz-hub .hubcol__grid:has(> :last-child:nth-child(2)),
  .biz-hub .hubcol__grid:has(> :nth-child(4)) {
    --hub-cols: 1;
  }
}