/* ═══════════════════════════════════════════════════════════
   NECTUS · apply.css
   The submission. Five gates, one screen at a time.
   ═══════════════════════════════════════════════════════════ */

/* ── the three gates (intro) ──────────────────────────────── */
.gates{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1px;background:var(--hair-2);border:1px solid var(--hair-2)}
.gates .card{border:none;background:rgba(12,14,17,.86);min-height:330px}
.gates .card:hover{background:rgba(20,23,27,.9)}

/* ── application shell ────────────────────────────────────── */
.appl{display:grid;grid-template-columns:270px minmax(0,1fr);gap:clamp(24px,4vw,64px);align-items:start}
@media (max-width:940px){.appl{grid-template-columns:1fr}}

/* stepper */
.stepper{position:sticky;top:110px;display:flex;flex-direction:column;gap:2px;border-top:1px solid var(--hair)}
@media (max-width:940px){
  .stepper{position:static;flex-direction:row;overflow-x:auto;border-top:none;border-bottom:1px solid var(--hair);padding-bottom:14px;gap:6px}
  .stepper::-webkit-scrollbar{height:2px}
}
.stp{
  display:flex;align-items:flex-start;gap:14px;padding:16px 4px;border-bottom:1px solid var(--hair-2);
  text-align:left;width:100%;transition:opacity .4s var(--ease);position:relative;
}
.stp[disabled]{opacity:.34;cursor:not-allowed}
.stp-n{
  flex:0 0 auto;width:26px;height:26px;border:1px solid var(--hair);display:grid;place-items:center;
  font-family:var(--mono);font-size:0.73rem;letter-spacing:.06em;color:var(--iron);
  transition:border-color .4s var(--ease),color .4s var(--ease),background .4s var(--ease);
}
.stp-l{display:block;font-family:var(--disp);font-weight:500;font-size:1.16rem;line-height:1.05;text-transform:uppercase;color:var(--mercury);transition:color .4s var(--ease)}
.stp-s{font-family:var(--mono);font-size:0.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--iron);margin-top:5px;display:block}
.stp.on .stp-n{border-color:var(--platinum);color:var(--platinum)}
.stp.on .stp-l{color:var(--platinum)}
.stp.done .stp-n{border-color:rgba(127,184,140,.5);color:var(--live);background:rgba(127,184,140,.08)}
.stp.done .stp-l{color:var(--mercury)}
@media (max-width:940px){
  .stp{flex:0 0 auto;width:auto;border-bottom:none;border:1px solid var(--hair-2);padding:10px 14px;align-items:center}
  .stp-s{display:none}
}

/* panel */
.panel{border:1px solid var(--hair);background:rgba(12,14,17,.86);position:relative;overflow:hidden}
.panel-bar{height:1px;background:var(--hair-2);position:relative}
.panel-bar i{position:absolute;left:0;top:0;height:1px;background:var(--platinum);width:20%;transition:width .7s var(--ease)}
.panel-in{padding:clamp(26px,3.4vw,48px)}
.step{display:none;animation:stepIn .55s var(--ease)}
.step.on{display:block}
@keyframes stepIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
.step-hd{margin-bottom:30px}
.step-hd h2{font-family:var(--disp);font-weight:700;font-size:clamp(2rem,4vw,3.2rem);line-height:.92;text-transform:uppercase;color:var(--platinum);margin-top:12px}
.step-hd p{font-size:.94rem;line-height:1.8;color:var(--mercury);max-width:56ch;margin-top:14px}

.pair{display:grid;grid-template-columns:1fr 1fr;gap:0 clamp(18px,3vw,36px)}
@media (max-width:620px){.pair{grid-template-columns:1fr}}

.actions{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:34px;border-top:1px solid var(--hair);padding-top:24px}
.actions .left{display:flex;gap:8px}

/* ── checkboxes ───────────────────────────────────────────── */
.checks{display:flex;flex-direction:column;gap:2px;border-top:1px solid var(--hair)}
.check{display:flex;gap:16px;align-items:flex-start;padding:18px 0;border-bottom:1px solid var(--hair-2);cursor:pointer}
.check input{position:absolute;opacity:0;width:0;height:0}
.check-bx{
  flex:0 0 auto;width:20px;height:20px;border:1px solid var(--hair-lit);margin-top:2px;
  display:grid;place-items:center;transition:border-color .3s var(--ease),background .3s var(--ease);
}
.check-bx svg{width:11px;height:11px;stroke:var(--void);stroke-width:2;fill:none;opacity:0;transition:opacity .2s var(--ease)}
.check input:checked + .check-bx{background:var(--platinum);border-color:var(--platinum)}
.check input:checked + .check-bx svg{opacity:1}
.check input:focus-visible + .check-bx{outline:1px solid var(--platinum);outline-offset:3px}
.check-tx{font-size:.92rem;line-height:1.7;color:var(--mercury)}
.check input:checked ~ .check-tx{color:var(--platinum)}
.check-tx b{display:block;font-family:var(--mono);font-size:0.73rem;letter-spacing:.2em;text-transform:uppercase;color:var(--iron);margin-bottom:6px;font-weight:400}

/* ── evidence dropzone ────────────────────────────────────── */
.dz{
  border:1px dashed var(--hair-lit);padding:44px 26px;text-align:center;cursor:pointer;width:100%;
  background:rgba(20,23,27,.42);transition:border-color .35s var(--ease),background .35s var(--ease);
}
.dz:hover,.dz.hot{border-color:var(--platinum);background:rgba(221,227,233,.04)}
.dz-ic{width:42px;height:42px;border:1px solid var(--hair);display:grid;place-items:center;margin:0 auto 16px}
.dz-ic svg{width:16px;height:16px;stroke:var(--mercury);fill:none;stroke-width:1.1}
.dz-t{font-family:var(--disp);font-weight:500;font-size:1.5rem;text-transform:uppercase;color:var(--platinum)}
.dz-s{font-family:var(--mono);font-size:0.75rem;letter-spacing:.2em;text-transform:uppercase;color:var(--iron);margin-top:9px}

.evid{display:grid;grid-template-columns:190px minmax(0,1fr);gap:22px;border:1px solid var(--hair);background:rgba(20,23,27,.5);padding:18px}
@media (max-width:620px){.evid{grid-template-columns:1fr}}
.evid-th{aspect-ratio:16/10;background:var(--graphite);border:1px solid var(--hair-2);position:relative;overflow:hidden;display:grid;place-items:center}
.evid-th img{width:100%;height:100%;object-fit:cover}
.evid-th .ph{font-family:var(--mono);font-size:0.7rem;letter-spacing:.2em;color:var(--steel);text-transform:uppercase}
.evid-th .dur{position:absolute;right:6px;bottom:6px;background:rgba(7,8,10,.86);padding:3px 6px;font-family:var(--mono);font-size:0.7rem;letter-spacing:.1em;color:var(--platinum);font-variant-numeric:tabular-nums}
.evid-meta{display:flex;flex-direction:column;gap:0}
.evid-meta .r{display:flex;justify-content:space-between;gap:16px;padding:8px 0;border-bottom:1px solid var(--hair-2);font-family:var(--mono);font-size:0.78rem;letter-spacing:.12em;text-transform:uppercase}
.evid-meta .r dt{color:var(--iron)}
.evid-meta .r dd{color:var(--mercury);text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:24ch}
.evid-meta .r dd.ok{color:var(--live)}
.evid-meta .r dd.no{color:var(--deny)}
.evid-acts{display:flex;gap:8px;margin-top:14px}

.prog{height:1px;background:var(--hair);margin-top:18px;overflow:hidden}
.prog i{display:block;height:1px;width:0;background:var(--live)}

/* ── signature pad ────────────────────────────────────────── */
.pad-hood{border:1px solid var(--hair);background:rgba(20,23,27,.45);position:relative}
.pad{display:block;width:100%;height:170px;touch-action:none;cursor:crosshair}
.pad-line{position:absolute;left:24px;right:24px;bottom:42px;height:1px;background:var(--hair);pointer-events:none}
.pad-ph{position:absolute;left:24px;bottom:20px;font-family:var(--mono);font-size:0.72rem;letter-spacing:.22em;text-transform:uppercase;color:var(--steel);pointer-events:none;transition:opacity .3s var(--ease)}
.pad-hood.inked .pad-ph{opacity:0}
.pad-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;border-top:1px solid var(--hair-2)}

/* ── review ───────────────────────────────────────────────── */
.review{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--hair-2);border:1px solid var(--hair-2)}
@media (max-width:620px){.review{grid-template-columns:1fr}}
.rv-cell{background:rgba(12,14,17,.9);padding:18px 20px}
.rv-cell dt{font-family:var(--mono);font-size:0.7rem;letter-spacing:.22em;text-transform:uppercase;color:var(--iron)}
.rv-cell dd{font-family:var(--disp);font-weight:500;font-size:1.35rem;line-height:1.1;text-transform:uppercase;color:var(--platinum);margin-top:8px;word-break:break-word}
.rv-cell dd.sm{font-family:var(--body);font-size:.9rem;font-weight:300;text-transform:none;color:var(--mercury);line-height:1.6}
.rv-cell.bad{background:rgba(180,105,107,.07)}
.rv-cell.bad dd{color:var(--deny)}

.verdict{display:flex;align-items:center;gap:16px;border:1px solid var(--hair);padding:18px 20px;margin-top:22px}
.verdict.ok{border-color:rgba(127,184,140,.4);background:rgba(127,184,140,.05)}
.verdict.no{border-color:rgba(194,167,107,.4);background:rgba(194,167,107,.05)}
.verdict-ic{width:34px;height:34px;border:1px solid currentColor;display:grid;place-items:center;flex:0 0 auto}
.verdict-ic svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:1.4}
.verdict.ok{color:var(--live)}
.verdict.no{color:var(--hold)}
.verdict p{font-family:var(--mono);font-size:0.81rem;letter-spacing:.14em;text-transform:uppercase;line-height:1.9;color:var(--mercury)}
.verdict p b{color:currentColor;font-weight:400}

/* ── receipt ──────────────────────────────────────────────── */
.receipt{display:none;text-align:center;padding:clamp(30px,5vw,64px) 0}
.receipt.on{display:block;animation:stepIn .7s var(--ease)}
.receipt-mk{width:56px;height:64px;fill:var(--platinum);margin:0 auto 24px;opacity:.85}
.receipt h2{font-family:var(--disp);font-weight:700;font-size:clamp(2.4rem,5.4vw,4rem);line-height:.9;text-transform:uppercase;color:var(--platinum)}
.receipt .ref{
  font-family:var(--mono);font-size:1.1rem;letter-spacing:.34em;color:var(--platinum);
  border:1px solid var(--hair-lit);padding:14px 22px;display:inline-block;margin:24px 0 6px;
}
.receipt p{font-size:.94rem;line-height:1.8;color:var(--mercury);max-width:48ch;margin:16px auto 0}
.receipt-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:1px;background:var(--hair-2);border:1px solid var(--hair-2);margin-top:34px;text-align:left}
.receipt-acts{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:32px}

/* ── autosave crumb ───────────────────────────────────────── */
.crumb{font-family:var(--mono);font-size:0.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--steel);display:flex;align-items:center;gap:8px}
.crumb i{width:4px;height:4px;border-radius:50%;background:var(--steel);font-style:normal;transition:background .4s var(--ease)}
.crumb.saved i{background:var(--live)}