/* 求人ページ（/jobs/*）。トップのスライドとは別の、縦に読むだけの文書のページ */
:root{--bg:#101110;--ink:#f2f0e8;--muted:#a8aaa0;--line:#363831;--orange:#ff642e;--gutter:clamp(20px,5.5vw,96px);color-scheme:dark}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Hiragino Sans","Noto Sans JP","Noto Sans CJK JP","Yu Gothic UI",sans-serif;line-height:1.85;font-size:15px}
a{color:inherit}
.job-header{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px var(--gutter);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:800;font-size:22px;letter-spacing:-.02em}
.brand small{display:block;font-size:10px;font-weight:400;color:var(--muted);letter-spacing:.08em;line-height:1.2}
.back{font-size:13px;color:var(--muted)}
.job{max-width:760px;margin:0 auto;padding:48px var(--gutter) 96px}
.eyebrow{font:12px/1.6 Consolas,"SFMono-Regular",monospace;color:var(--orange);letter-spacing:.06em;margin:0}
h1{font-size:clamp(28px,4.4vw,44px);line-height:1.3;letter-spacing:-.04em;margin:10px 0 12px;text-wrap:balance}
.salary{font-size:18px;font-weight:700;margin:0 0 32px;color:var(--orange)}
section{border-top:1px solid var(--line);padding:26px 0 6px}
h2{font-size:18px;margin:0 0 12px}
p{margin:0 0 12px}
.lead{font-size:17px}
ul{margin:0 0 14px;padding-left:1.2em}
li{margin:4px 0}
.terms{display:grid;grid-template-columns:7em 1fr;gap:10px 16px;margin:0 0 16px}
.terms dt{color:var(--muted)}
.terms dd{margin:0}
.button{display:inline-flex;gap:24px;align-items:center;justify-content:space-between;background:var(--orange);color:#101110;font-weight:700;text-decoration:none;padding:14px 22px;margin:4px 0 18px}
.others ul{list-style:none;padding:0}
.others a{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--line);text-decoration:none}
.others a span{color:var(--orange)}
.job-footer{display:flex;flex-wrap:wrap;gap:8px 24px;align-items:center;padding:24px var(--gutter) 96px;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}
.job-footer p{margin:0}
.job-footer nav{display:flex;gap:18px}
@media (max-width:520px){.terms{grid-template-columns:1fr;gap:2px}.terms dd{margin-bottom:10px}.back{font-size:12px}}
/* ── 上部の立体の場面 ── */
.job{max-width:1120px}
.job>section{max-width:760px;margin-left:auto;margin-right:auto}
.job-hero{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:32px;align-items:center;margin-bottom:36px;--sink:0;perspective:1200px}
.job-hero-copy{transform:translateZ(calc(var(--sink)*-160px));opacity:calc(1 - var(--sink)*.6)}
.hero-lead{font-size:17px;color:#d8d6cc;max-width:30em}
.job-scene{position:relative;height:clamp(340px,40vw,480px);perspective:900px;--rx:0deg;--ry:0deg;--mx:0px;--my:0px;transform:translateY(calc(var(--sink)*60px)) rotateX(calc(var(--sink)*18deg))}
.scene-ring{position:absolute;inset:14% 4%;border:1px solid #5c6150;border-radius:50%;transform:rotateX(66deg) rotateZ(var(--ry))}
.scene-ring+.scene-ring{inset:28% 18%;border-color:var(--orange);opacity:.7;transform:rotateX(66deg) rotateZ(calc(var(--ry)*-1.6))}
.scene-floor{position:absolute;z-index:1;left:10%;right:10%;bottom:4%;height:30%;background:radial-gradient(closest-side,#ff642e33,#ff642e00);transform:rotateX(70deg)}
.job-scene .avatar-still,.job-scene .vrm-canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;z-index:3}
.job-scene .vrm-canvas{z-index:4;cursor:grab}
.job-scene.has-vrm .avatar-still{display:none}
.scene-chips{list-style:none;margin:0;padding:0;position:absolute;inset:0;z-index:6;pointer-events:none}
.scene-chips li{position:absolute;font-size:12px;padding:5px 11px;border:1px solid #5c6150;background:#161814e6;border-radius:999px;white-space:nowrap;transform:translate(calc(var(--mx)*var(--k,1)),calc(var(--my)*var(--k,1)))}
.scene-chips li:nth-child(1){left:0;top:12%;--k:-.8;border-color:var(--orange);color:var(--orange)}
.scene-chips li:nth-child(2){right:0;top:22%;--k:.9}
.scene-chips li:nth-child(3){left:2%;bottom:30%;--k:.6}
.scene-chips li:nth-child(4){right:4%;bottom:18%;--k:-.7}
.scene-chips li:nth-child(5){left:30%;bottom:2%;--k:1.1}
/* ── 仕事の札 ── */
.duty-cards{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;perspective:900px;margin:18px 0}
.duty-cards li{position:relative;padding:16px 16px 18px;border:1px solid var(--line);background:linear-gradient(160deg,#1b1d18,#131411);min-height:96px;margin:0}
.duty-cards .num{display:block;font:11px Consolas,monospace;color:var(--orange);margin-bottom:6px}
.tilt{--rx:0deg;--ry:0deg;transform:rotateX(var(--rx)) rotateY(var(--ry));transition:transform .25s ease,border-color .25s,box-shadow .25s}
.tilt:hover{border-color:var(--orange);box-shadow:0 18px 40px #0008,0 0 0 1px #ff642e33}
.spec{border:1px solid var(--line);padding:26px 24px 10px;background:linear-gradient(160deg,#181a15,#121310)}
/* ── 動き（script が job-enhanced を付けたときだけ） ── */
.job-enhanced .reveal{transition:transform .9s cubic-bezier(.16,1,.3,1),opacity .9s}
.job-enhanced .job .reveal:not(.is-in){opacity:0;transform:translate3d(0,40px,-220px) rotateX(14deg)}
.job-enhanced .job{perspective:1400px}
.job-enhanced .glyph{display:inline-block;animation:assemble .9s backwards;animation-delay:calc(var(--i)*22ms)}
@keyframes assemble{from{opacity:0;transform:translate3d(0,.6em,-120px) rotateX(70deg)}}
.job-enhanced .scene-chips li{animation:chip-float 5.5s ease-in-out infinite}
.job-enhanced .scene-chips li:nth-child(2n){animation-delay:-2.7s}
@keyframes chip-float{50%{translate:0 -8px}}
#walker{position:fixed;inset:0;width:100%;height:100%;z-index:15;pointer-events:none;opacity:0;transition:opacity .9s ease}
#walker.is-ready{opacity:1}
@media (max-width:760px){.job-hero{grid-template-columns:1fr}.job-scene{height:300px}.scene-chips li{font-size:11px}}
@media (prefers-reduced-motion: reduce){*{animation:none!important;transition:none!important}.job-hero-copy,.job-scene{transform:none!important;opacity:1!important}#walker{display:none}}
.glyph-group{display:inline-block;white-space:nowrap}
