/* Personal recruiting introduction. Uses the established cobalt/ink/paper world. */
body:has(.hero-personal){background:var(--paper)}
.hero-personal{position:relative;width:100%;max-width:none;padding:76px 0 0;background:var(--signal-cobalt);color:var(--on-dark);overflow:hidden;isolation:isolate}
.hero-personal::before{display:none}
.hero-personal::after{content:"MeJn";position:absolute;right:-.035em;top:-.09em;font-family:var(--font-disp);font-size:clamp(200px,37vw,670px);font-weight:700;line-height:1;letter-spacing:-.055em;color:color-mix(in srgb,var(--on-dark) 5%,transparent);pointer-events:none;z-index:-1}
.hero-personal .hero-layout{grid-template-columns:minmax(0,1.08fr) minmax(0,1fr);gap:46px;align-items:center;min-height:600px;padding-bottom:42px}
.hero-personal .hero-copy{padding:0;position:relative;z-index:3}
.hero-person{display:flex;align-items:baseline;gap:23px;margin-bottom:29px;flex-wrap:wrap}
.hero-person>strong{font-size:35px;font-weight:700;letter-spacing:-.025em;line-height:1.3}
.hero-person>strong>span{font-family:var(--font-disp);font-size:16px;margin-left:12px;letter-spacing:0;font-weight:500}
.hero-person>span{font-size:14px;color:var(--on-dark)}
.hero-person i{opacity:.65;padding:0 6px}
.hero-personal .hero-title{font-size:clamp(43px,4.55vw,70px);line-height:1.27;letter-spacing:-.035em;max-width:none;color:var(--on-dark);font-weight:700}
.hero-personal .hero-title>.motion-line,.hero-personal .hero-title>[data-track-only]>.motion-line{white-space:nowrap}
.hero-personal .hero-lead{font-size:16px;line-height:1.9;max-width:35em;margin-top:27px;color:var(--on-dark)}
.hero-personal .hero-lead>span{display:block}
html[data-track=pm] .hero-personal .hero-lead>[data-track-only=fde],html[data-track=fde] .hero-personal .hero-lead>[data-track-only=pm]{display:none}
.hero-personal .hero-actions{margin-top:29px;gap:14px}
.hero-personal .button{min-height:52px;padding:15px 22px;font-size:14px}
.hero-personal .button-primary{color:var(--signal-cobalt);background:var(--on-dark);border-color:var(--on-dark)}
.hero-personal .button-primary:hover{color:var(--ink);background:var(--surface)}
.hero-personal .button-secondary{color:var(--on-dark);border-color:color-mix(in srgb,var(--on-dark) 65%,transparent);background:transparent}
.hero-personal .button-secondary:hover{background:color-mix(in srgb,var(--on-dark) 12%,transparent);border-color:var(--on-dark)}
.hero-proofline{display:flex;flex-wrap:wrap;gap:9px 22px;margin-top:25px;font-size:12px;color:var(--on-dark)}
.hero-proofline span{display:inline-flex;align-items:center;gap:8px}
.hero-proofline span::before{content:"";width:4px;height:4px;border-radius:50%;background:currentColor}
.hero-art{position:relative;height:590px;min-width:0;perspective:1500px;z-index:2}
.responsibility-scene{position:relative;height:465px;transform-style:flat}
.responsibility-route{position:absolute;width:100%;height:100%;overflow:visible;inset:0}
.responsibility-route path{fill:none;stroke-width:2}
.responsibility-route .hero-signal-base{stroke:color-mix(in srgb,var(--on-dark) 28%,transparent)}
.responsibility-route .hero-signal-run{stroke:var(--on-dark);stroke-linecap:round}
.scene-plane{position:absolute;display:flex;flex-direction:column;padding:26px 29px;border-radius:22px;transform-origin:center;box-shadow:0 24px 32px -24px color-mix(in srgb,var(--ink) 65%,transparent);background:var(--paper);color:var(--ink);overflow:hidden}
.scene-plane::after{content:"";position:absolute;inset:0;border-radius:inherit;border:1px solid color-mix(in srgb,var(--on-dark) 45%,transparent);pointer-events:none}
.plane-code{font-size:12px;color:var(--signal);font-weight:500;margin-bottom:9px}
.scene-plane strong{font-size:25px;line-height:1.35;font-weight:700;letter-spacing:-.02em;white-space:nowrap}
.scene-plane>span{font-size:12px;margin-top:10px;color:var(--ink-2)}
.plane-icon{position:absolute;right:24px;top:24px;width:19px;height:19px;color:var(--signal)}
.plane-decide{width:72%;left:1%;top:10px;transform:rotate(-7deg) rotateY(10deg)}
.plane-build{width:75%;left:24%;top:136px;background:var(--ink);color:var(--on-dark);transform:rotate(6deg) rotateY(-8deg)}
.plane-build .plane-code,.plane-build .plane-icon,.plane-build>span{color:var(--on-dark)}
.plane-verify{width:68%;left:8%;top:267px;transform:rotate(-5deg) rotateY(6deg)}
.hero-personal .proof-deck{position:absolute;bottom:-7px;left:20%;right:0;margin:0;perspective:none;z-index:5}
.hero-personal .deck-perspective{transform:none!important}
.hero-personal .proof-console{padding:19px 22px 17px;background:var(--surface);color:var(--ink);border-radius:23px;transform:none;box-shadow:0 27px 42px -25px color-mix(in srgb,var(--ink) 65%,transparent)}
.hero-personal .console-bar{min-height:26px;padding:0;margin-bottom:9px}
.hero-personal .console-title{color:var(--ink);font-family:var(--font-cn);font-size:13px;letter-spacing:0;font-weight:500}
.hero-personal .console-status{color:var(--signal);font-size:10px}
.hero-personal .console-status::before{background:var(--signal)}
.hero-personal .scene-replay{color:var(--ink-2);font-size:10px;min-height:32px;border-color:var(--line);padding:6px 9px;margin-left:12px}
.hero-personal .proof-caption{display:grid;gap:5px;padding:0}
.hero-personal .proof-caption>span{color:var(--signal);font-size:11px;font-family:var(--font-cn);margin:0}
.hero-personal .proof-caption h2{font-size:20px;line-height:1.5;color:var(--ink);font-weight:700}
.hero-personal .proof-caption p{display:none;color:var(--ink-2);font-size:12px;line-height:1.8}
.hero-personal .proof-screen{position:absolute;right:100%;bottom:17px;width:120px;height:82px;margin-right:15px;border:0;border-radius:13px;background:var(--surface);box-shadow:0 17px 30px -18px var(--ink);transform:rotate(-5deg);overflow:visible}
.hero-personal .proof-screen img{width:120px;height:82px;aspect-ratio:auto;object-fit:cover;object-position:left top;border-radius:13px}
.hero-proof-toggle{position:absolute;inset:0;background:color-mix(in srgb,var(--ink) 70%,transparent);color:var(--on-dark);border-radius:13px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:5px;font-size:10px;min-height:44px}
.hero-proof-toggle .ic{width:17px;height:17px}
.hero-personal .proof-selector{padding:10px 0 0;gap:6px}
.hero-personal .proof-selector button{color:var(--ink-2);border-color:var(--line);min-height:36px;padding:8px 11px;font-size:10px}
.hero-personal .proof-selector button[aria-pressed=true]{color:var(--on-dark);background:var(--ink);border-color:var(--ink)}
.hero-personal .proof-links{color:var(--ink-2);padding:10px 0 0;font-size:10px;justify-content:space-between;gap:14px}
.hero-personal .proof-links a{color:var(--signal);font-weight:500;white-space:nowrap}
/* The built artifact occupies the middle stage; the surrounding planes name my responsibility. */
.hero-personal{padding-top:42px}
.hero-personal .hero-layout{padding-bottom:34px}
.hero-art{height:658px}
.scene-plane{padding:20px 27px}
.plane-decide{top:0;width:77%}
.plane-verify{top:521px;left:10%;width:73%}
.hero-personal .proof-deck{top:151px;left:13%;right:0;bottom:auto}
.hero-personal .proof-console{padding:17px 20px 16px;background:var(--ink);color:var(--on-dark);transform:rotate(3deg)}
.hero-personal .console-bar{min-height:44px;margin-bottom:10px;gap:8px}
.hero-personal .console-title{color:var(--on-dark);font-size:12px}
.hero-personal .scene-replay{min-height:44px;color:var(--on-dark);border-color:var(--dark-line);margin-left:0}
.hero-personal .proof-screen{display:block!important;position:relative;inset:auto;width:100%;height:168px;margin:0;transform:none;overflow:hidden;border-radius:14px;box-shadow:none}
.hero-personal .proof-screen img{width:100%;height:168px;object-fit:cover;object-position:center 31%;border-radius:14px}
.hero-proof-toggle{position:static;inset:auto;display:inline-flex;flex-direction:row;gap:5px;min-height:44px;padding:7px 9px;margin-left:auto;font-size:10px;background:transparent;color:var(--on-dark);border:1px solid var(--dark-line);border-radius:var(--radius-pill);white-space:nowrap}
.hero-proof-toggle .ic{width:13px;height:13px}
.hero-personal .proof-caption{padding-top:11px}
.hero-personal .proof-caption>span{color:var(--on-dark-muted)}
.hero-personal .proof-caption h2{color:var(--on-dark);font-size:19px;line-height:1.5}
.hero-personal .proof-selector button{min-height:36px;color:var(--on-dark-muted);border-color:var(--dark-line)}
.hero-personal .proof-selector button:hover{background:var(--dark-panel);color:var(--on-dark)}
.hero-personal .proof-selector button[aria-pressed=true]{background:var(--paper);border-color:var(--paper);color:var(--ink)}
.hero-personal .proof-links,.hero-personal .proof-links a{color:var(--on-dark-muted)}
html[data-hero-in-view=true] .track-controls button:not([aria-pressed=true]):hover{background:color-mix(in srgb,var(--on-dark) 8%,transparent);color:var(--on-dark)}
html[data-hero-in-view=true] .site-header a:focus-visible,html[data-hero-in-view=true] .site-header button:focus-visible{outline:3px solid var(--on-dark);outline-offset:4px}
.hero-personal .media-view{display:none}
.hero-bottom{display:flex;justify-content:space-between;align-items:center;gap:20px;min-height:82px;border-top:1px solid color-mix(in srgb,var(--on-dark) 25%,transparent);font-size:12px;color:var(--on-dark)}
.hero-bottom a{display:inline-flex;align-items:center;gap:9px;min-height:44px}
.hero-bottom .ic{width:14px;height:14px}
html[data-hero-in-view=true] .site-header{max-width:none;padding-left:max(var(--gutter),calc((100% - 1360px)/2 + var(--gutter)));padding-right:max(var(--gutter),calc((100% - 1360px)/2 + var(--gutter)));background:var(--signal-cobalt);color:var(--on-dark);box-shadow:none;border-radius:0;border-color:transparent}
html[data-hero-in-view=true] .site-header .brand-name,html[data-hero-in-view=true] .site-header .brand-name small,html[data-hero-in-view=true] .site-header .brand-symbol,html[data-hero-in-view=true] .site-nav,html[data-hero-in-view=true] .resume-link{color:var(--on-dark)}
html[data-hero-in-view=true] .track-controls{border-color:color-mix(in srgb,var(--on-dark) 55%,transparent)}
html[data-hero-in-view=true] .track-controls button{color:var(--on-dark)}
html[data-hero-in-view=true] .track-controls button[aria-pressed=true]{background:var(--on-dark);color:var(--signal-cobalt)}
html[data-hero-in-view=true] .site-nav a::after{background:var(--on-dark)}
.hero-personal a:focus-visible,.hero-personal button:focus-visible{outline:3px solid var(--on-dark);outline-offset:4px}
.hero-personal .proof-console button:focus-visible{outline-color:var(--signal-cobalt)}
@media(min-width:1600px){.hero-personal .hero-layout{min-height:680px}.hero-personal{padding-top:62px}.hero-personal .hero-title{font-size:76px}.hero-art{height:640px}.responsibility-scene{height:500px}}
@media(max-width:1100px){.hero-personal{padding-top:48px}.hero-personal .hero-layout{gap:22px;grid-template-columns:1.03fr 1fr;min-height:570px}.hero-personal .hero-title{font-size:clamp(39px,4.6vw,51px)}.hero-person{gap:12px;margin-bottom:22px}.hero-person>strong{font-size:30px}.hero-personal .hero-lead{font-size:14px}.hero-art{height:560px}.scene-plane{padding:22px}.scene-plane strong{font-size:21px}.plane-icon{right:17px;top:18px}.hero-personal .proof-deck{left:10%}.hero-personal .proof-screen{display:none}.hero-personal .proof-console{padding:17px}.hero-personal .proof-caption h2{font-size:18px}.hero-personal .proof-links>span{display:none}.hero-proofline{font-size:11px;gap:8px 12px}}
@media(max-width:760px){.hero-personal{padding-top:33px}.hero-personal .hero-layout{display:block;padding-bottom:30px}.hero-person{margin-bottom:23px;gap:15px}.hero-person>strong{font-size:32px}.hero-person>span{font-size:12px}.hero-personal .hero-title{font-size:clamp(38px,7.8vw,58px)}.hero-personal .hero-lead{margin-top:23px;font-size:14px}.hero-personal .hero-actions{margin-top:24px}.hero-personal .button{min-height:48px;padding:13px 19px;font-size:13px}.hero-proofline{margin-top:20px}.hero-art{height:575px;max-width:560px;margin:40px auto 0}.hero-personal .proof-deck{left:18%}.hero-personal .proof-screen{display:block;width:100px;height:75px;margin-right:11px}.hero-personal .proof-screen img{width:100px;height:75px}.hero-bottom{font-size:11px;min-height:75px}.hero-bottom p{max-width:20em}}
@media(max-width:440px){.hero-personal .hero-title{font-size:clamp(34px,9.7vw,41px);line-height:1.28}.hero-personal .hero-lead{font-size:13px}.hero-personal .hero-lead br{display:none}.hero-person{gap:13px}.hero-person>strong{font-size:30px}.hero-person>strong>span{font-size:13px;margin-left:8px}.hero-art{height:570px;margin-top:38px}.scene-plane{padding:20px 21px}.scene-plane strong{font-size:20px}.plane-code,.scene-plane>span{font-size:11px}.plane-decide{width:81%;left:0}.plane-build{width:83%;left:16%;top:147px}.plane-verify{width:80%;left:0;top:292px}.hero-personal .proof-deck{left:0;right:0;bottom:0}.hero-personal .proof-screen{display:none}.hero-personal .proof-selector button{min-height:40px}.hero-personal .proof-caption h2{font-size:18px}.hero-bottom p{max-width:15em}.hero-bottom a{white-space:nowrap}}
@media(prefers-reduced-motion:reduce){.hero-personal *, .hero-personal *::before,.hero-personal *::after{transition:none!important;animation:none!important}}
@media(max-width:1100px){.hero-art{height:625px}.hero-personal .proof-deck{left:7%;top:142px}.hero-personal .proof-console{padding:14px 16px}.plane-verify{top:510px}.hero-personal .proof-caption h2{font-size:17px}.hero-personal .console-title{font-size:11px}.hero-personal .console-bar{gap:6px;flex-wrap:wrap}.hero-personal .proof-screen,.hero-personal .proof-screen img{height:152px}}
@media(max-width:760px){.hero-art{height:420px;max-width:510px;margin-top:32px}.responsibility-scene{display:none}.hero-personal .proof-deck{top:0;left:0;right:0}.hero-personal .proof-console{transform:none;padding:17px 19px}.hero-personal .proof-screen,.hero-personal .proof-screen img{width:100%;height:185px}.hero-personal .console-bar{flex-wrap:nowrap}.hero-personal .proof-caption h2{font-size:19px}.hero-personal .proof-links>span{display:inline}}
@media(max-width:440px){.hero-art{height:430px;margin-top:29px}.hero-personal .proof-caption h2{font-size:18px}.hero-personal .proof-selector button{min-height:40px}.hero-personal .proof-console{padding:14px 17px}.hero-personal .hero-bottom{font-size:10px}}
.hero-personal .proof-console button:focus-visible{outline:3px solid var(--on-dark);outline-offset:3px}