/* ============================================================
   page-hub.css — D1 Hub page layout (additive scaffolding)
   ------------------------------------------------------------
   적용 대상 (8 페이지):
     /products/        /solutions/        /industries/
     /cases/           /resources/        /company/
     /contact/         /careers/
   ------------------------------------------------------------
   원칙: 인라인 CSS가 우선. 본 파일은 비어있는 부분만 채움.
   body.tier-hub 스코프로 다른 tier에 새지 않게 격리.
   ============================================================ */

/* --- 허브 페이지 공통 컨테이너 fallback -------------------- */
body.tier-hub .wrap,
body.tier-hub .container,
body.tier-hub .inner{
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 28px;
}

/* --- 허브 히어로 fallback (제품/솔루션/산업 등 카테고리 진입) */
body.tier-hub .hub-hero,
body.tier-hub .hero{
  padding: clamp(72px, 8vw, 128px) 0 clamp(48px, 5vw, 80px);
}

body.tier-hub .hub-hero h1,
body.tier-hub .hero h1{
  letter-spacing: -0.02em;
}

/* --- 허브 카드 그리드 fallback ----------------------------- */
body.tier-hub .card-grid,
body.tier-hub .hub-grid{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 20px;
}

/* --- 카드 fallback (인라인이 있으면 무시됨) --------------- */
body.tier-hub .card{
  display: flex;
  flex-direction: column;
}

/* --- 허브 섹션 세로 리듬 fallback ------------------------- */
body.tier-hub main > section{
  padding: clamp(56px, 6vw, 96px) 0;
}

/* --- TOC / 카테고리 네비 fallback ------------------------- */
body.tier-hub .toc,
body.tier-hub .category-nav{
  position: sticky;
  top: 88px;
  align-self: start;
}

/* --- 허브 페이지 페이지네이션/CTA 영역 -------------------- */
body.tier-hub .hub-cta{
  padding: clamp(56px, 6vw, 88px) 0;
  text-align: center;
}

/* --- 반응형 보정 ----------------------------------------- */
@media (max-width: 768px){
  body.tier-hub .card-grid,
  body.tier-hub .hub-grid{
    grid-template-columns: 1fr;
    gap: 16px;
  }
  body.tier-hub .toc,
  body.tier-hub .category-nav{
    position: static;
  }
}