/* Manav for Hiring: prospect landing.
   Builds on ../bank/assets/landing.css (same family: ledger theme, one violet accent,
   green/red only for verdicts). This file adds the hiring-only pieces. */

/* avatars: one face = one person */
.av{--z:40px;width:var(--z);height:var(--z);border-radius:50%;display:inline-grid;place-items:center;flex:none;font:600 calc(var(--z)*.36)/1 var(--font);letter-spacing:-.02em}
.av.real{background:var(--ac);color:#fff}
.av.other{background:#3D4350;color:#fff}
.av .i{font-size:calc(var(--z)*.5)}

/* hero: call node */
.call{position:relative;display:grid;place-items:center;height:92px;border-radius:10px;background:var(--tx);overflow:hidden}
.call .av{--z:46px;transition:transform .35s var(--ease)}
.call .av.swap{animation:pop .45s var(--ease-spring) both}
.call-lbl{position:absolute;left:8px;bottom:6px;font:500 11.5px/1 var(--mono);color:#C9CED8}
.code{display:grid;grid-template-columns:repeat(8,1fr);gap:2px;width:72px;margin:2px auto 0;padding:6px;border-radius:8px;background:var(--bg);border:1px solid var(--line)}
.code i{aspect-ratio:1;border-radius:1px;background:var(--tx);transition:opacity .25s}
.code-cap{font:400 12px/1.3 var(--font);color:var(--tx2);text-align:center}
.ph-ver{display:inline-flex;align-items:center;justify-content:center;gap:5px;font:600 13px/1.2 var(--font);color:var(--ac3)}
.ph-ver .i{font-size:15px}
.node .nh span{overflow:hidden;text-overflow:ellipsis}

/* attack scenes */
.pair{display:flex;align-items:center;gap:16px}
.pair .av{--z:58px}
.neq{font:600 30px/1 var(--font);color:var(--rd)}
.go-anim .pair .av.other{animation:pop .5s var(--ease-spring) .5s both}
.lap{display:flex;flex-direction:column;align-items:center}
.lap-scr{width:150px;height:78px;border-radius:8px 8px 2px 2px;background:var(--tx);display:flex;align-items:center;justify-content:center;gap:10px}
.lap-scr .av{--z:38px}
.lap-lock{display:inline-flex;align-items:center;gap:5px;font:600 12px/1 var(--font);color:#FFB3B8}
.lap-lock .i{font-size:15px}
.lap-base{width:176px;height:8px;border-radius:0 0 8px 8px;background:var(--bdr-hover)}
.go-anim .lap-lock{animation:pop .45s var(--ease-spring) .7s both}
.mail{display:flex;align-items:center;gap:8px}
.mail .mi{position:relative;width:48px;height:48px;border-radius:12px;display:grid;place-items:center;background:var(--s1);border:1px solid var(--bdr);font-size:26px;color:var(--tx)}
.mail .mi.no{color:var(--rd);border-color:var(--rd-l);background:var(--rd-s)}
.mail .x{position:absolute;right:-7px;bottom:-7px;font-size:18px;color:var(--rd);background:var(--s1);border-radius:50%;line-height:0}
.mail .dash{width:20px;border-top:2px dashed var(--bdr-hover)}
.go-anim .mail .mi:nth-child(3){animation:slide-x .7s var(--ease) .2s both}
.go-anim .mail .mi.no{animation:pop .45s var(--ease-spring) .9s both}
@keyframes slide-x{from{transform:translateX(-40px);opacity:0}to{transform:none;opacity:1}}

/* passport (VMS illustration) */
.vms{padding:18px 20px}
.vrow{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;padding:14px 0;border-top:1px dashed var(--line)}
.vrow .av{--z:40px}
.vwho b{display:block;font:600 15px/1.3 var(--font);color:var(--tx)}
.vwho small{font:400 13px/1.3 var(--font);color:var(--tx2)}
.vpass{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap;padding:8px 12px;border-radius:999px;background:var(--gr-s);border:1px solid var(--gr-l);color:var(--gr);font:600 13px/1 var(--font)}
.vpass small{font:500 12px/1 var(--mono);color:var(--gr);opacity:.85}
.vpass.none{background:var(--s2);border-color:var(--bdr);color:var(--tx2)}
.vrow.dim{opacity:.75}
.vms.in .vrow:not(.dim) .vpass{animation:pop .5s var(--ease-spring) .5s both}
@media(max-width:560px){.vrow{grid-template-columns:auto 1fr}.vpass{grid-column:2;justify-self:start}}

/* limits disclosure */
.lim{margin-top:28px;border:1px solid var(--bdr);border-radius:var(--pr);background:var(--s1)}
.lim summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:12px;padding:16px 20px}
.lim summary::-webkit-details-marker{display:none}
.lim summary>.i{font-size:24px;color:var(--ac)}
.lim summary b{display:block;font:600 16px/1.3 var(--font);color:var(--tx)}
.lim summary small{font:400 14px/1.4 var(--font);color:var(--tx2)}
.lim summary::after{content:"+";margin-left:auto;font:400 24px/1 var(--font);color:var(--tx2)}
.lim[open] summary::after{content:"\2212"}
.lim ul{list-style:none;margin:0;padding:4px 20px 20px;display:grid;grid-template-columns:1fr 1fr;gap:14px 28px}
.lim li{display:flex;gap:10px;font:400 14px/1.5 var(--font);color:var(--tx2)}
.lim li .i{font-size:18px;margin-top:2px;color:var(--ac)}
.lim li.w .i{color:var(--warn)}
.lim li b{color:var(--tx)}
.lim li a{color:var(--ac3)}
@media(max-width:760px){.lim ul{grid-template-columns:1fr}}

/* mobile hero tightening */
@media(max-width:600px){
  .call{height:120px}.call .av{--z:60px}
  .code{width:96px}
}

/* round-9 additions */
.at .scene{margin-top:0}
@media(min-width:961px){.hero{grid-template-columns:minmax(0,4.4fr) minmax(0,7fr)}}
.ref{position:absolute;top:6px;left:8px;display:inline-flex;align-items:center;gap:5px}
.ref .av{--z:22px}
.ref small{font:500 11px/1 var(--mono);color:#C9CED8}
.callneq{position:absolute;left:50%;top:50%;margin:-11px 0 0 -46px;font:600 20px/1 var(--font);color:#FF8A91;opacity:0;transition:opacity .3s}
.call.neq .callneq{opacity:1}
.rcv{display:inline-flex;align-items:center;gap:6px;align-self:flex-start;font:500 12px/1.2 var(--font);color:var(--ac3);background:var(--ac-soft);border:1px solid var(--ac-line);padding:5px 8px;border-radius:999px}
.rcv .i{font-size:14px}
.chk li{font-size:14px}
.vs3{display:grid;grid-template-columns:1fr 1fr 1.2fr;gap:12px;margin-top:28px}
.vs3 div{display:grid;grid-template-columns:auto 1fr;column-gap:12px;align-items:center;padding:16px 18px;border:1px solid var(--bdr);border-radius:var(--pr);background:var(--s1)}
.vs3 .i{grid-row:span 2;font-size:26px;color:var(--tx2)}
.vs3 b{font:600 16px/1.2 var(--font);color:var(--tx)}
.vs3 span{font:400 14px/1.4 var(--font);color:var(--tx2)}
.vs3 .us{background:var(--tx);border-color:var(--tx)}
.vs3 .us .i{color:#B4ABFF}.vs3 .us b{color:#fff}.vs3 .us span{color:#D2D6DE}
@media(max-width:820px){.vs3{grid-template-columns:1fr}}
.std a{font:500 13px/1 var(--font);color:var(--tx2);padding:8px 12px;border-radius:999px;border:1px solid var(--bdr);background:var(--s1);text-decoration:none}
.std a:hover{border-color:var(--ac-line);color:var(--ac3)}
.close .bill{font:400 13px/1.3 var(--font);color:#C9CED8}
.mail .mi .mav{position:absolute;left:-8px;top:-8px;--z:22px;box-shadow:0 0 0 2px var(--s1)}
.mail .mi.no .av{--z:30px}
@media(max-width:600px){
  .flow>.node{align-self:start}
  .call{height:84px}.call .av{--z:44px}
  .code,.code-cap{display:none}
  .stage-v .phone{padding:14px 10px 10px}
}

/* round-10 */
.ref .av{--z:34px}
.ref small{font:500 13px/1 var(--font)}
.callneq{opacity:1;margin:-12px 0 0 -52px;font-size:24px}
.call:not(.neq) .callneq{color:#7FE0A8}
.call-lbl,.ph-to,.vpass small{font-size:13px}
.vpass small{opacity:1}
.aud{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}
.aud div{display:flex;gap:10px;align-items:center;font:400 15px/1.4 var(--font);color:var(--tx2);padding:12px 16px;border-radius:12px;background:var(--ac-soft)}
.aud .i{font-size:22px;color:var(--ac);flex:none}
.aud b{color:var(--tx)}
@media(max-width:820px){.aud{grid-template-columns:1fr}}
.numsec .nums{margin-top:28px}
.regs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0;padding:4px 20px 14px}
.regs em{font:600 13px/1 var(--font);font-style:normal;color:var(--tx);margin-right:4px}
.regs span{font:500 13px/1.2 var(--font);color:var(--tx2);padding:7px 11px;border-radius:999px;border:1px solid var(--bdr);background:var(--bg)}
#nPhone{justify-content:flex-start}
@media(max-width:600px){
  .code{display:grid;width:76px}
  .stage-v .phone{max-width:180px;margin:0 auto;min-height:210px;justify-content:center}
  .steps li{height:auto;padding-bottom:6px;font:500 12px/1 var(--font)}
  .steps li .i{display:none}
  .gx{grid-template-columns:1fr 1fr}
  .gx .g{padding:16px 12px 16px 0}
  .gx .g:nth-child(2n){padding-left:12px;border-left:1px solid var(--line)}
  .gx .g span{font-size:13px}
}

/* round-10b: call tile as a side-by-side comparison */
.call{display:flex;align-items:center;justify-content:center;gap:10px;height:100px;padding-bottom:14px;box-sizing:border-box}
.ref{position:static;flex-direction:column;gap:4px}
.ref .av{--z:30px;opacity:.85}
.ref small{font:500 11px/1 var(--mono);color:#C9CED8}
.callneq{position:static;margin:0;font-size:22px}
.call .av#callAv{--z:44px}
@media(min-width:961px){.hero .hcta{flex-wrap:nowrap}.hero .hcta a{padding:0 18px}}

/* round-11 */
.ref .av{--z:36px;opacity:1}
.ref small{font:500 12px/1 var(--font)}
.callneq{color:#C9CED8}
.call.eq .callneq{color:#7FE0A8}
.call.neq .callneq{color:#FF8A91}
.call:not(.neq) .callneq{color:#C9CED8}
.call.eq .callneq{color:#7FE0A8}
.stage-v .cap{min-height:2.8em;font:600 19px/1.4 var(--font)}
.mpair{display:none;align-items:center;gap:8px}
.mpair .av{--z:30px}
.mneq{font:600 20px/1 var(--font);color:var(--tx2)}
.mneq.ne{color:var(--rd)}.mneq.eq{color:var(--gr)}
.atk{grid-template-columns:repeat(3,minmax(0,1fr))}
.at h3{margin-top:auto}
.at .go{margin-top:0}
.atsm{font:400 14px/1.4 var(--font);color:var(--tx2);margin-top:-8px}
.clock.small{font-size:16px}
.vs3 span{white-space:normal}
.close .early{font:500 14px/1.4 var(--font);color:#E6E8EC;margin:16px 0 0}
.still .rv{transition:none;opacity:1;transform:none}
@media(max-width:820px){
  .vs3{grid-template-columns:repeat(3,1fr);gap:8px}
  .vs3 div{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:12px}
  .vs3 span{display:none}
  .vs3 b{font-size:14px}
}
@media(max-width:600px){
  .hero{display:flex;flex-direction:column}
  .hero .hcopy{order:1}.hero .hcta{order:2;margin-top:4px}.hero .stage-v{order:3}
  .mpair{display:flex}
  .stage-v .phone{min-height:0}
  .flow{min-height:auto}
  .steps{display:flex;justify-content:center;gap:8px;margin:0 0 10px}
  .steps li{width:8px;height:8px;padding:0;border:0;border-radius:50%;background:var(--bdr);font-size:0;overflow:hidden}
  #stage[data-step="0"] .steps li[data-s="0"],#stage[data-step="1"] .steps li[data-s="1"],#stage[data-step="2"] .steps li[data-s="2"]{background:var(--ac)}
  .stage-v .cap{font-size:16px;min-height:2.8em}
}

/* round-12 */
.atk{grid-template-columns:1.25fr 1fr 1fr}
@media(min-width:901px){.atk{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:900px){.atk{grid-template-columns:1fr}}
@media(max-width:600px){.sb{height:96px}}
.hnote{flex-basis:100%;font:500 14px/1.4 var(--font);color:var(--tx2)}
.eyebrow{font:600 13px/1 var(--font);color:var(--ac3);margin:0 0 10px;text-transform:uppercase;letter-spacing:.06em}
@media(min-width:961px){#nPhone{justify-content:center}}
@media(max-width:820px){.vs3{grid-template-columns:1fr;gap:8px}.vs3 div{display:grid;padding:12px 14px}.vs3 span{display:block;font-size:13px}}
#race .nums{margin-top:30px}
.regs+.regs{padding-top:0}
@media(max-width:600px){.hnote{text-align:center}}
@media(min-width:961px){.hero .hcta{flex-wrap:wrap}.hnote{margin-top:2px}}
@media(min-width:961px){.hero{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}}

/* round-13 */
.call{gap:14px;padding-bottom:0}
.ref .av,.call .av#callAv{--z:44px}
.ref small{font:500 12px/1 var(--font);color:#C9CED8}
.callneq{font:700 24px/1 var(--font);margin-top:-16px}
.chk li,.verdict{white-space:nowrap}
.at{display:grid;grid-template-rows:auto 1fr auto auto auto;row-gap:12px}
.at h3{margin-top:4px}
.atsm{margin-top:-6px}.atsm a{color:var(--ac3)}
.lap-scr{gap:8px}.lap-scr .lref{--z:30px}.lap-scr .lneq{font-size:22px}
@media(max-width:600px){.ref .av,.call .av#callAv{--z:40px}}
.ref small{white-space:nowrap}
.chk li{white-space:normal}
.lap-scr{width:210px}.lap-base{width:236px}
.at h3{align-self:end}
@media(min-width:601px){.call{gap:8px}.ref .av,.call .av#callAv{--z:40px}}

/* round-14 */
.at{grid-template-rows:auto auto auto 1fr}
.at h3{align-self:start}
.at .go{align-self:end}
.atsm{min-height:2.8em}
.chk li.na{color:var(--tx2)}
.face .fav{position:absolute;--z:30px;font-size:11px;opacity:0;transition:opacity .3s}
.face.scan .fav,.face.done .fav,.face.no .fav{opacity:1}
.face.scan .fico,.face.done .fico,.face.no .fico{opacity:0}
.face .fico{display:grid;transition:opacity .3s}
@media(max-width:600px){.hero .stage-v{align-self:stretch;width:auto;box-sizing:border-box}}

/* deepfake scenario */
.av.fake{position:relative;animation:glitch-av 1.6s steps(2) infinite;box-shadow:-2px 0 0 rgba(255,80,120,.75),2px 0 0 rgba(80,220,255,.75)}
.av.fake::after{content:"AI";position:absolute;right:-6px;top:-6px;font:700 9px/1 var(--font);letter-spacing:.04em;color:#fff;background:#D63B6B;border-radius:999px;padding:3px 5px;box-shadow:0 0 0 2px var(--tx)}
@keyframes glitch-av{0%,86%,100%{transform:none;filter:none}88%{transform:translate(-2px,1px);filter:hue-rotate(40deg)}92%{transform:translate(2px,-1px)}96%{transform:translate(-1px,0);filter:hue-rotate(-30deg)}}
.still .av.fake{animation:none}
.dfk{display:flex;align-items:center;gap:14px}
.dfk .vid{position:relative;width:96px;height:72px;border-radius:10px;background:var(--tx);display:grid;place-items:center}
.dfk .vid .av{--z:42px}
.dfk .vid em{position:absolute;left:6px;bottom:4px;font:500 10px/1 var(--mono);font-style:normal;color:#C9CED8}
.dfk .vid .av.fake::after{box-shadow:0 0 0 2px var(--tx)}
.dfk .mi{position:relative;width:52px;height:52px;border-radius:12px;display:grid;place-items:center;font-size:28px;color:var(--rd);border:1px solid var(--rd-l);background:var(--rd-s)}
.dfk .x{position:absolute;right:-7px;bottom:-7px;font-size:18px;color:var(--rd);background:var(--s1);border-radius:50%;line-height:0}
.go-anim .dfk .mi{animation:pop .45s var(--ease-spring) .7s both}
@media(max-width:600px){
  .tabs{grid-template-columns:repeat(4,1fr)!important}
  .tabs button{font-size:12px!important;padding:10px 4px!important}
}