/* Njob Business — page styles (design reference: design_handoff_njob_website) */
/* ---- 페이지 인덱스 ---- */
  .jump{margin-top:34px; display:grid; grid-template-columns:repeat(3,1fr); gap:12px;}
  .jump a{display:flex; flex-direction:column; gap:6px; padding:22px 24px; border-radius:18px;
    background:var(--surface); border:1px solid rgba(30,29,28,.06); transition:transform .18s var(--ease), border-color .18s;}
  .jump a:hover{transform:translateY(-2px); border-color:var(--line-2);}
  .jump .no{font-size:11.5px; font-weight:800; color:var(--amber-deep);}
  .jump .nm{font-size:21px; font-weight:800; letter-spacing:-0.035em;}
  .jump .ds{font-size:13.5px; color:var(--ink-mute); line-height:1.55; word-break:keep-all;}

  /* ---- 흐름도 ---- */
  .flow{display:grid; grid-template-columns:repeat(4,1fr); border-top:2px solid var(--ink); margin-top:8px;}
  .fl{padding:26px 22px 30px 0; border-right:1px solid var(--line); margin-right:22px;
    display:flex; flex-direction:column;}
  .fl:last-child{border-right:none; margin-right:0; padding-right:0;}
  .fl .st{font-size:11.5px; font-weight:800; color:var(--amber-deep);}
  .fl h4{margin-top:26px; font-size:20px; font-weight:800; letter-spacing:-0.03em; line-height:1.25;}
  .fl p{margin-top:10px; font-size:13.5px; line-height:1.62; color:var(--ink-2); word-break:keep-all;}
  .fl .who{margin-top:auto; padding-top:18px; font-size:12.5px; font-weight:700; color:var(--ink-mute);}

  /* ---- 부문 상세 ---- */
  .area-band{padding:86px 0; border-top:1px solid var(--line);}
  .area-band#corporate{border-top:none;}
  .area-band.a2{background:var(--bg-2);}
  .area-in{display:grid; grid-template-columns:400px 1fr; gap:64px; align-items:start;}
  .area-in.flip{grid-template-columns:1fr 400px;}
  .area-in.flip .area-lead{order:2;}
  .area-in.flip .area-body{order:1;}
  .area-lead .badge{display:inline-flex; align-items:center; gap:8px; font-size:12px; font-weight:800;
    padding:7px 12px; border-radius:999px; background:var(--amber-wash); color:var(--amber-deep);}
  .area-band.a2 .area-lead .badge{background:var(--teal-wash); color:var(--teal-deep);}
  .area-lead h2{margin-top:20px; font-size:46px; line-height:1.12; font-weight:800;
    letter-spacing:-0.042em; word-break:keep-all;}
  .area-lead .en{font-size:13px; font-weight:700; color:var(--ink-mute); margin-top:8px;}
  .area-lead p{margin-top:18px; font-size:16px; line-height:1.75; color:var(--ink-2); word-break:keep-all;}
  .area-lead p b{color:var(--ink); font-weight:700;}
  .area-lead .meta{margin-top:24px; display:flex; flex-direction:column; gap:0;}
  .area-lead .meta div{display:flex; justify-content:space-between; padding:11px 0;
    border-top:1px solid var(--line); font-size:13.5px;}
  .area-lead .meta div:last-child{border-bottom:1px solid var(--line);}
  .area-lead .meta dt{color:var(--ink-mute); font-weight:600;}
  .area-lead .meta dd{font-weight:700;}

  /* ---- 계열사 · 인재진단연구소 링크 카드 ---- */
  .lead-site{margin-top:24px; display:block; background:var(--surface);
    border:1px solid var(--line); border-radius:18px; padding:19px 24px 20px;
    transition:transform .2s var(--ease), border-color .2s, box-shadow .24s var(--ease);}
  .lead-site:hover{transform:translateY(-2px); border-color:var(--line-2);
    box-shadow:0 18px 34px -24px rgba(30,29,28,.42);}
  .lead-site .hd{display:flex; align-items:baseline; justify-content:space-between; gap:14px;}
  .lead-site .ar{font-size:14px; color:var(--line-2); transition:color .18s, transform .2s var(--ease);}
  .lead-site:hover .ar{color:var(--amber); transform:translate(3px,-3px);}
  .lead-site .nm{font-size:22px; font-weight:800; letter-spacing:-0.035em;}
  .lead-site .dm{margin-top:5px; font-size:14px; font-weight:700; color:var(--ink-mute);}
  .lead-site .dm .mono{font-size:14.5px; color:var(--amber-deep);
    border-bottom:1.5px solid transparent; transition:border-color .18s;}
  .lead-site:hover .dm .mono{border-color:var(--amber);}

  .svc{display:grid; grid-template-columns:1fr 1fr; gap:0 40px;}
  .svc-item{padding:20px 0; border-top:1px solid var(--line);}
  .svc-item .t{font-size:17px; font-weight:700; letter-spacing:-0.028em; word-break:keep-all;}
  .svc-item .t em{font-style:normal; font-size:12.5px; font-weight:700; color:var(--ink-mute); margin-left:7px;}
  .svc-item .d{margin-top:7px; font-size:13.5px; line-height:1.6; color:var(--ink-2); word-break:keep-all;}
  .svc-item .tags{margin-top:11px; display:flex; flex-wrap:wrap; gap:6px;}
  .svc-item .tags span{font-size:11.5px; font-weight:600; color:var(--ink-2); background:var(--bg-2); padding:5px 9px; border-radius:6px;}

  /* ---- 솔루션 ---- */
  .solutions{background:var(--ink); color:#fff;}
  .sol-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px;}
  .sol{background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.11); border-radius:24px;
    overflow:hidden; display:flex; flex-direction:column; transition:background .2s, transform .2s;}
  .sol:hover{background:rgba(255,255,255,.085); transform:translateY(-3px);}
  .sol .shot{background:var(--shot); padding:18px; border-bottom:1px solid rgba(255,255,255,.1);}
  .sol .shot img{border-radius:10px; width:100%; box-shadow:0 14px 26px -16px rgba(0,0,0,.5);}
  .sol .b{padding:24px 24px 28px; display:flex; flex-direction:column; flex:1;}
  .sol .tag{display:inline-flex; align-items:center; gap:7px; font-size:11.5px; font-weight:800;
    padding:6px 11px; border-radius:999px; width:max-content; background:rgba(237,141,9,.18); color:var(--amber);}
  .sol .tag.ai{background:rgba(101,181,214,.2); color:var(--teal);}
  .sol h3{margin-top:15px; font-size:23px; font-weight:800; letter-spacing:-0.035em;}
  .sol .en{font-size:12px; font-weight:700; color:rgba(255,255,255,.45); margin-top:3px;}
  .sol p{margin-top:12px; font-size:14.5px; line-height:1.68; color:rgba(255,255,255,.75); word-break:keep-all;}
  .sol .feat{margin-top:auto; padding-top:18px; display:flex; flex-wrap:wrap; gap:6px;}
  .sol .feat span{font-size:11.5px; font-weight:600; color:rgba(255,255,255,.8);
    background:rgba(255,255,255,.08); padding:6px 10px; border-radius:7px;}

  /* ---- 클라이언트 ---- */
  .cli-block + .cli-block{margin-top:44px; padding-top:40px; border-top:1px solid var(--line);}
  .cli-hd{display:flex; justify-content:space-between; align-items:baseline; margin-bottom:20px;}
  .cli-hd h3{font-size:19px; font-weight:800; letter-spacing:-0.03em;}
  .cli-hd .cnt{font-size:13px; color:var(--ink-mute); font-weight:600;}
  .logo-wall{display:grid; grid-template-columns:repeat(6,1fr); gap:10px;}
  .logo-wall .lg{background:var(--surface); border:1px solid rgba(30,29,28,.06); border-radius:12px;
    min-height:62px; display:grid; place-items:center; text-align:center; padding:10px;
    font-size:13.5px; font-weight:700; color:var(--ink-2); letter-spacing:-0.02em;}
  .caselist{margin-top:22px; display:grid; grid-template-columns:repeat(3,1fr); gap:12px;}
  .case{background:var(--surface); border:1px solid rgba(30,29,28,.06); border-radius:16px; padding:20px 22px;}
  .case .uni{font-size:16.5px; font-weight:800; letter-spacing:-0.025em;}
  .case .sys{margin-top:6px; font-size:13.5px; color:var(--ink-2); line-height:1.55; word-break:keep-all;}
  .case .aw{margin-top:12px; display:inline-block; font-size:11.5px; font-weight:800; color:#fff;
    background:var(--teal-deep); padding:5px 9px; border-radius:6px;}

  @media (max-width:1180px){
    .area-in, .area-in.flip{grid-template-columns:1fr; gap:36px;}
    .area-in.flip .area-lead{order:0;}
    .area-in.flip .area-body{order:1;}
    .sol-grid{grid-template-columns:repeat(2,1fr);}
    .flow{grid-template-columns:repeat(2,1fr); row-gap:26px;}
    .fl:nth-child(2n){border-right:none; margin-right:0; padding-right:0;}
    .logo-wall{grid-template-columns:repeat(4,1fr);}
  }
  @media (max-width:1024px){
    .area-band{padding:64px 0;}
    .area-lead h2{font-size:36px;}
    .jump{grid-template-columns:1fr;}
    .caselist{grid-template-columns:repeat(2,1fr);}
  }
  @media (max-width:760px){
    .svc{grid-template-columns:1fr; gap:0;}
    .sol-grid{grid-template-columns:1fr;}
    .flow{grid-template-columns:1fr;}
    .fl{border-right:none; margin-right:0; padding-right:0; padding-bottom:22px;
      border-bottom:1px solid var(--line);}
    .fl h4{margin-top:14px;}
    .logo-wall{grid-template-columns:repeat(2,1fr);}
    .caselist{grid-template-columns:1fr;}
  }