.recruiting-page-hero { padding:10px 0 58px; }
.recruiting-hero-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0; align-items:center; }
.recruiting-hero-copy { min-width:0; }
.page-hero h1.recruiting-hero-title { max-width:none; font-size:clamp(49px,calc(4.5vw + 1px),57px); line-height:1.08; letter-spacing:-.035em; }
.recruiting-hero-title span { display:block; white-space:nowrap; }
.recruiting-hero-copy .page-lead { max-width:570px; }

.recruiting-hero-visual { position:relative; min-height:540px; overflow:hidden; cursor:crosshair; touch-action:pan-y; isolation:isolate; }
.recruiting-hero-visual::before { content:""; position:absolute; inset:0; z-index:-2; opacity:.28; background-image:radial-gradient(#8390a4 .65px,transparent .65px); background-size:22px 22px; mask-image:linear-gradient(90deg,transparent,#000 12%,#000 100%); }
.recruiting-hero-visual::after { content:""; position:absolute; left:50%; top:10%; bottom:7%; z-index:-1; border-left:1px dashed rgba(91,105,128,.19); }
.rec-scene { position:absolute; left:50%; top:50%; width:620px; height:520px; transform:translate(-50%,-50%) scale(.88); transform-origin:center; }
.rec-item { position:absolute; z-index:4; will-change:transform; }
.rec-drift { animation:rec-drift var(--rec-speed,7s) ease-in-out infinite alternate; animation-delay:var(--rec-delay,0s); }
.rec-drift-1 { --rec-speed:8.4s; --rec-delay:-2s; --rec-r1:-1.1deg; --rec-r2:.5deg; }
.rec-drift-2 { --rec-speed:7.1s; --rec-delay:-4s; --rec-r1:.8deg; --rec-r2:-.5deg; }
.rec-drift-3 { --rec-speed:6.8s; --rec-delay:-1s; --rec-r1:.3deg; --rec-r2:1deg; }
.rec-drift-4 { --rec-speed:9.2s; --rec-delay:-4s; }
@keyframes rec-drift { from { transform:translate3d(-3px,-4px,0) rotate(var(--rec-r1,-.5deg)); } to { transform:translate3d(5px,6px,0) rotate(var(--rec-r2,.7deg)); } }

.rec-card { position:relative; width:194px; min-height:204px; overflow:hidden; border:1px solid rgba(255,255,255,.9); border-radius:5px; background:#fff; box-shadow:0 14px 38px rgba(25,37,57,.13),0 2px 5px rgba(25,37,57,.06); }
.rec-card::after { content:""; position:absolute; inset:0; border-radius:inherit; box-shadow:inset 0 0 0 1px rgba(16,23,35,.035); pointer-events:none; }
.rec-card p { margin:0; padding:10px 11px 11px; color:#263044; font:700 10px/1.3 var(--font-mono); letter-spacing:.06em; text-transform:uppercase; }
.rec-card p span { display:block; margin-top:4px; color:#8a93a3; font-size:9px; font-weight:500; line-height:1.4; }
.rec-graphic { position:relative; height:110px; overflow:hidden; }
.rec-graphic::after { content:""; position:absolute; inset:0; opacity:.5; background-image:radial-gradient(rgba(50,72,111,.24) .6px,transparent .6px); background-size:10px 10px; mask-image:linear-gradient(135deg,#000,transparent 72%); }
.rec-area-1 { top:28px; left:7px; }
.rec-area-2 { top:28px; left:213px; }
.rec-area-3 { top:28px; right:7px; }

.rec-role { display:grid; place-items:center; background:linear-gradient(145deg,#eaf1ff,#f8faff); }
.rec-role-sheet { position:relative; z-index:2; width:88px; height:78px; padding:12px 11px; border:1px solid #d7e0f1; border-radius:5px; background:#fff; box-shadow:0 8px 18px rgba(37,65,112,.1); }
.rec-role-sheet::before { content:"ROLE"; display:block; margin-bottom:8px; color:#496189; font:800 9px/1 var(--font-mono); letter-spacing:.08em; }
.rec-role-sheet i { display:block; height:4px; margin-top:7px; border-radius:3px; background:#c4d2ec; }
.rec-role-sheet i:nth-child(1) { width:84%; }
.rec-role-sheet i:nth-child(2) { width:62%; background:#87a8ed; }
.rec-role-sheet i:nth-child(3) { width:74%; background:var(--accent); }
.rec-role-badge { position:absolute; z-index:3; display:grid; place-items:center; width:38px; height:27px; border:1px solid #dce4f3; border-radius:5px; color:#496189; background:#fff; box-shadow:0 5px 12px rgba(37,65,112,.09); font:800 9px/1 var(--font-mono); }
.rec-rb1 { left:15px; top:17px; }
.rec-rb2 { right:14px; bottom:13px; color:#fff; background:var(--accent); }

.rec-search { background:linear-gradient(145deg,#fff3df,#fffbf2); }
.rec-person { position:absolute; z-index:2; width:43px; height:43px; border:1px solid #ead9b7; border-radius:50%; background:#fff; box-shadow:0 6px 14px rgba(110,79,26,.08); }
.rec-person::before { content:""; position:absolute; left:50%; top:8px; width:11px; height:11px; border-radius:50%; background:#e1ac4a; transform:translateX(-50%); }
.rec-person::after { content:""; position:absolute; left:50%; bottom:7px; width:22px; height:12px; border-radius:12px 12px 5px 5px; background:#f4d393; transform:translateX(-50%); }
.rec-p1 { left:16px; top:16px; }
.rec-p2 { left:50%; bottom:10px; transform:translateX(-50%); }
.rec-p3 { right:16px; top:16px; }
.rec-search-ring { position:absolute; z-index:4; left:50%; top:44%; width:50px; height:50px; border:4px solid #d98918; border-radius:50%; background:rgba(255,255,255,.25); transform:translate(-50%,-50%); box-shadow:0 0 0 5px rgba(217,137,24,.07); }
.rec-search-ring::after { content:""; position:absolute; right:-16px; bottom:-10px; width:24px; height:5px; border-radius:4px; background:#d98918; transform:rotate(45deg); }

.rec-evaluation { background:linear-gradient(145deg,#eaf8f4,#f7fcfa); }
.rec-score-list { position:absolute; z-index:2; left:22px; right:22px; top:17px; display:grid; gap:11px; }
.rec-score { display:grid; grid-template-columns:37px 1fr 16px; gap:6px; align-items:center; color:#39705d; font:800 9px/1 var(--font-mono); }
.rec-score-track { height:7px; overflow:hidden; border-radius:5px; background:#d9eee6; }
.rec-score-track i { display:block; width:var(--w); height:100%; border-radius:inherit; background:#57b18d; transform-origin:left; animation:rec-score 2.8s ease-in-out infinite alternate; animation-delay:var(--d); }
.rec-score b { width:16px; height:16px; display:grid; place-items:center; border-radius:50%; color:#fff; background:#2ba977; font-size:9px; }
@keyframes rec-score { from { transform:scaleX(.82); opacity:.72; } to { transform:scaleX(1); opacity:1; } }

.rec-decision { top:318px; left:50%; transform:translateX(-50%); }
.rec-decision-panel { width:500px; padding:14px 17px 15px; border:1px solid rgba(45,62,89,.16); border-radius:6px; background:rgba(255,255,255,.97); box-shadow:0 18px 48px rgba(22,37,62,.14); }
.rec-decision-title { margin-bottom:10px; padding-bottom:9px; border-bottom:1px solid #e7eaf0; color:#263044; font:700 9px/1 var(--font-mono); letter-spacing:.09em; text-transform:uppercase; }
.rec-candidates { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; }
.rec-candidate { position:relative; min-height:72px; display:grid; grid-template-columns:34px 1fr; gap:8px; align-items:center; padding:8px; border:1px solid #e2e7ef; border-radius:5px; background:#fafbfc; }
.rec-candidate.is-selected { border-color:#87a8ed; background:#f2f6ff; box-shadow:inset 0 0 0 1px rgba(37,95,230,.12); }
.rec-avatar { position:relative; width:34px; height:34px; border-radius:50%; background:#e6ebf4; }
.rec-avatar::before { content:""; position:absolute; left:50%; top:6px; width:9px; height:9px; border-radius:50%; background:#8a99b2; transform:translateX(-50%); }
.rec-avatar::after { content:""; position:absolute; left:50%; bottom:5px; width:19px; height:11px; border-radius:11px 11px 5px 5px; background:#aeb9cb; transform:translateX(-50%); }
.is-selected .rec-avatar { background:#dfe9ff; }
.is-selected .rec-avatar::before { background:#4f79d4; }
.is-selected .rec-avatar::after { background:var(--accent); }
.rec-candidate small { display:block; color:#8b94a4; font:600 9px/1.25 var(--font-mono); letter-spacing:.04em; text-transform:uppercase; }
.rec-candidate strong { display:block; margin-top:3px; color:#263044; font-size:13px; line-height:1; }
.rec-candidate em { position:absolute; right:5px; top:4px; padding:2px 4px; border-radius:3px; color:#fff; background:var(--accent); font:normal 700 8px/1 var(--font-mono); text-transform:uppercase; }
.rec-decision-notes { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; margin-top:8px; }
.rec-decision-notes span { color:#758095; font:600 9px/1.25 var(--font-mono); text-align:center; text-transform:uppercase; }

.rec-flow { position:absolute; z-index:1; height:1px; background:linear-gradient(90deg,transparent,rgba(102,116,139,.34) 15%,rgba(102,116,139,.34) 85%,transparent); transform-origin:left center; }
.rec-flow::after { content:""; position:absolute; left:12%; top:-2px; width:5px; height:5px; border-radius:50%; background:var(--accent); box-shadow:0 0 0 5px rgba(37,95,230,.08); animation:rec-signal 3.6s ease-in-out infinite; animation-delay:var(--rec-flow-delay,0s); }
@keyframes rec-signal { 0% { left:12%; opacity:0; } 18% { opacity:1; } 82% { opacity:1; } 100% { left:86%; opacity:0; } }
.rec-flow-1 { top:236px; left:104px; width:121px; transform:rotate(42deg); --rec-flow-delay:-.5s; }
.rec-flow-2 { top:236px; left:310px; width:82px; transform:rotate(90deg); --rec-flow-delay:-1.6s; }
.rec-flow-3 { top:236px; left:516px; width:121px; transform:rotate(138deg); --rec-flow-delay:-2.4s; }
.rec-orbit { position:absolute; z-index:0; left:50%; top:49%; width:520px; height:300px; border:1px solid rgba(37,95,230,.08); border-radius:50%; transform:translate(-50%,-50%) rotate(-8deg); }
.rec-orbit::before { content:""; position:absolute; inset:34px 72px; border:1px solid rgba(37,95,230,.06); border-radius:inherit; }

@media (max-width:1100px) {
  .recruiting-hero-grid { grid-template-columns:1fr; gap:32px; }
  .recruiting-hero-copy { max-width:760px; }
  .recruiting-hero-visual { min-height:520px; }
  .rec-scene { transform:translate(-50%,-50%) scale(.94); }
}

@media (max-width:720px) {
  .recruiting-page-hero { padding:10px 0 42px; }
  .page-hero h1.recruiting-hero-title { font-size:clamp(38px,10.5vw,48px); }
  .recruiting-hero-title span { white-space:normal; }
  .recruiting-hero-grid { gap:22px; }
}

@media (prefers-reduced-motion:reduce) {
  .rec-drift,.rec-flow::after,.rec-score-track i { animation:none !important; }
}