/* 전공별 AI 전망 페이지. careers/career.css 위에 얹는 확장 스타일 */
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.crumbs { display: flex; gap: 8px; margin-bottom: 18px; font: 600 10px var(--mono); color: var(--muted); }
.crumbs a { text-decoration: underline; }
.crumbs em { font-style: normal; color: var(--ink); }
.major-hero h1 { font-size: clamp(44px, 7vw, 92px); }
.lookup { position: relative; margin-top: 34px; max-width: 620px; border-bottom: 2px solid var(--ink); }
.lookup input { width: 100%; padding: 14px 4px; border: 0; outline: 0; background: transparent; font: 600 22px var(--sans); }
.lookup input::placeholder { color: #aaa89f; }
.lookup input:focus-visible { box-shadow: 0 3px 0 var(--blue); }
.lookup-results { position: absolute; left: 0; right: 0; top: calc(100% + 2px); z-index: 20; margin: 0; padding: 0; list-style: none; background: var(--paper); border: 1.5px solid var(--ink); box-shadow: 8px 8px 0 var(--ink); }
.lookup-results li a { display: grid; grid-template-columns: 1fr auto auto; gap: 12px; align-items: center; padding: 12px 14px; border-bottom: 1px solid var(--line); font-size: 14px; }
.lookup-results li:last-child a { border-bottom: 0; }
.lookup-results li a:hover, .lookup-results li a:focus-visible { background: var(--lime); outline: 0; }
.lookup-results strong { font-weight: 700; }
.lookup-results small { color: var(--muted); font: 600 10px var(--mono); }
.lookup-results b { font: 700 15px var(--mono); }
.lookup-results .empty { padding: 14px; font-size: 13px; color: var(--muted); }
.lookup-hint { margin-top: 12px; font-size: 12px; color: var(--muted); }
.lookup-hint a { text-decoration: underline; color: var(--blue); }

.scoreboard { display: grid; grid-template-columns: .9fr 1.1fr; gap: 28px; align-items: stretch; }
.score-card { padding: 26px; color: white; background: var(--ink); box-shadow: 10px 10px 0 var(--lime); display: flex; flex-direction: column; }
.score-card > span { font: 600 9px var(--mono); color: var(--lime); letter-spacing: .08em; }
.score-card strong { margin: 16px 0 8px; font: 700 clamp(64px, 9vw, 104px)/1 var(--display); letter-spacing: -.06em; }
.score-card strong small { font: 600 16px var(--mono); color: #aaa; margin-left: 6px; letter-spacing: 0; }
.score-card p { margin: 14px 0 0; color: rgba(255,255,255,.78); font-size: 13px; line-height: 1.75; }
.score-card > small { margin-top: auto; padding-top: 18px; font: 600 10px var(--mono); color: #aaa; }
.tier { display: inline-block; width: max-content; padding: 5px 9px; font: 700 10px var(--mono); font-style: normal; border: 1px solid currentColor; }
.tier-확장형 { color: var(--lime); }
.tier-전환형 { color: #ffd166; }
.tier-재설계형 { color: var(--orange); }
.rank-item .tier, .major-grid .tier, .lookup-results .tier { color: var(--ink); background: var(--paper); }
.rank-item .tier-확장형, .major-grid .tier-확장형, .lookup-results .tier-확장형 { background: var(--lime); }
.rank-item .tier-전환형, .major-grid .tier-전환형, .lookup-results .tier-전환형 { background: #ffe6a3; }
.rank-item .tier-재설계형, .major-grid .tier-재설계형, .lookup-results .tier-재설계형 { background: #ffd2c6; }
.meters { display: flex; flex-direction: column; justify-content: center; gap: 18px; padding: 8px 0; }
.meter { display: grid; grid-template-columns: 130px 52px 1fr; grid-template-areas: "label value bar" "note note note"; align-items: center; column-gap: 14px; }
.meter span { grid-area: label; font-size: 13px; font-weight: 700; }
.meter strong { grid-area: value; font: 700 22px var(--mono); text-align: right; }
.meter i { grid-area: bar; display: block; height: 10px; background: rgba(21,21,21,.1); }
.meter i b { display: block; height: 100%; background: var(--ink); }
.meter:nth-child(2) i b { background: var(--blue); }
.meter:nth-child(3) i b { background: var(--orange); }
.meter small { grid-area: note; margin-top: 5px; font-size: 11px; color: var(--muted); }

.task-split { display: grid; grid-template-columns: 1fr 1fr; margin-top: 60px; border: 1.5px solid var(--ink); }
.task-split > div { padding: 22px 24px 26px; }
.task-split > div + div { border-left: 1.5px solid var(--ink); }
.task-split .staying { background: var(--lime); }
.task-split span { font: 600 10px var(--mono); letter-spacing: .06em; }
.task-split ul { margin: 16px 0 0; padding-left: 18px; font-size: 14px; line-height: 1.8; }
.path-intro { max-width: 620px; margin: -8px 0 26px; }
.next-roles { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--ink); }
.next-role { display: flex; flex-direction: column; min-height: 230px; padding: 22px 22px 24px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); transition: .18s; }
.next-role:last-child { border-right: 0; }
.next-role:hover { background: var(--ink); color: white; transform: translateY(-4px); }
.next-role span { font: 600 10px var(--mono); color: var(--orange); }
.next-role strong { margin: 26px 0 10px; font: 700 24px var(--display); letter-spacing: -.04em; }
.next-role p { margin: 0; font-size: 12px; line-height: 1.7; color: inherit; opacity: .8; }
.next-role small { margin-top: auto; padding-top: 16px; font-size: 11px; opacity: .75; }
.mission-card { margin-top: 60px; padding: 28px; background: var(--blue); color: white; box-shadow: 9px 9px 0 var(--orange); display: grid; grid-template-columns: 1fr auto; gap: 24px; align-items: center; }
.mission-card span { grid-column: 1 / -1; font: 600 9px var(--mono); color: var(--lime); letter-spacing: .08em; }
.mission-card p { margin: 0; font-size: 18px; font-weight: 700; line-height: 1.6; letter-spacing: -.02em; }
.mission-card a { padding: 14px 18px; background: var(--lime); color: var(--ink); font-weight: 900; white-space: nowrap; }
.share-bar { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 34px; }
.share-bar a, .share-bar button { padding: 10px 14px; border: 1px solid var(--ink); background: transparent; font: 700 11px var(--mono); cursor: pointer; color: var(--ink); }
.share-bar a:hover, .share-bar button:hover { background: var(--ink); color: white; }
.siblings { margin-top: 70px; }
.siblings h3 { margin: 0 0 16px; font: 700 26px var(--display); letter-spacing: -.04em; }
.sibling-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.sibling-list a { display: flex; justify-content: space-between; align-items: center; padding: 14px 16px; border: 1px solid var(--ink); font-size: 14px; }
.sibling-list a:hover { background: var(--lime); }
.sibling-list a span { font: 700 18px var(--mono); }
.sibling-list a span small { font-size: 10px; color: var(--muted); }
.sibling-list .all-link { grid-column: 1 / -1; justify-content: center; background: var(--ink); color: white; font-weight: 900; }

.rank-boards { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.rank-board { padding: 22px; border: 1.5px solid var(--ink); box-shadow: 8px 8px 0 var(--orange); background: var(--paper); counter-reset: rank; }
.rank-board.human { box-shadow: 8px 8px 0 var(--lime); }
.rank-board > span { font: 700 13px var(--mono); }
.rank-board > p { margin: 8px 0 16px; font-size: 12px; color: var(--muted); }
.rank-item { display: grid; grid-template-columns: 1fr auto auto; gap: 12px; align-items: center; padding: 11px 0; border-top: 1px solid var(--line); font-size: 14px; counter-increment: rank; }
.rank-item strong::before { content: counter(rank, decimal-leading-zero) " "; font: 600 10px var(--mono); color: var(--muted); margin-right: 6px; }
.rank-item:hover strong { text-decoration: underline; }
.rank-item span { font: 700 17px var(--mono); }
.rank-item span small { font-size: 9px; color: var(--muted); font-weight: 600; }
.atlas-note { margin: 48px 0 20px; padding: 18px 20px; border-left: 4px solid var(--blue); background: rgba(49,85,255,.06); font-size: 13px; line-height: 1.8; }
.major-group { margin-top: 44px; }
.major-group h3 { display: flex; align-items: baseline; gap: 10px; margin: 0 0 12px; font: 700 24px var(--display); letter-spacing: -.04em; }
.major-group h3 small { font: 600 10px var(--mono); color: var(--muted); }
.major-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--ink); }
.major-grid a { display: grid; grid-template-columns: 1fr auto; grid-template-areas: "name score" "tier score"; align-items: center; row-gap: 8px; padding: 14px 16px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.major-grid a:nth-child(3n) { border-right: 0; }
.major-grid a:hover { background: var(--lime); }
.major-grid strong { grid-area: name; font-size: 14px; }
.major-grid span { grid-area: score; font: 700 22px var(--mono); }
.major-grid span small { font-size: 9px; color: var(--muted); }
.major-grid .tier { grid-area: tier; }

@media (max-width: 760px) {
  .scoreboard, .task-split, .rank-boards, .sibling-list, .major-grid, .next-roles { grid-template-columns: 1fr; }
  .task-split > div + div { border-left: 0; border-top: 1.5px solid var(--ink); }
  .next-role { border-right: 0; }
  .major-grid a { border-right: 0; }
  .mission-card { grid-template-columns: 1fr; }
  .meter { grid-template-columns: 1fr 52px; grid-template-areas: "label value" "bar bar" "note note"; }
  .lookup input { font-size: 18px; }
  .career-header nav a:nth-child(2) { display: none; }
}
