/* ---------------------------------------------------------------------------
   scan-skin.css — brand skin for the scan questionnaire.
   The wizard's markup and logic are carried over from the live /scan page
   unchanged; this file only restyles it. Class names here are the wizard's,
   not ours. Nothing in here affects submission.
--------------------------------------------------------------------------- */

.scan-shell{background:var(--navy-deep);padding-block:72px 96px;min-height:60vh}
.scan-shell .grid12{width:100%;max-width:760px;margin-inline:auto;padding-inline:22px}

.scan-card{
  background:rgba(4,37,63,.72);border:1px solid rgba(166,194,210,.2);border-radius:16px;
  padding:30px 30px 32px;margin-top:22px;
}
.scan-card.hidden,.hidden{display:none}

.eyebrow{
  font-family:var(--sans);font-size:10.5px;font-weight:800;letter-spacing:.18em;
  text-transform:uppercase;color:var(--gold);
}

/* progress */
.wiz-track{height:3px;background:rgba(166,194,210,.18);border-radius:999px;overflow:hidden;margin-bottom:22px}
.wiz-fill{height:100%;background:var(--gold);transition:width .3s ease}
.wiz-step-label{font-size:10.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--mist)}

/* the question */
.wiz-q{
  font-family:var(--cond);font-size:clamp(28px,4vw,42px);font-weight:800;line-height:1.02;
  color:#fff;margin:14px 0 0;letter-spacing:0;
}
.wiz-help{margin:12px 0 0;font-size:15px;line-height:1.6;color:var(--mist);text-wrap:pretty}
.wiz-body{margin-top:22px}

.wiz-body input,.wiz-body select,.wiz-body textarea{
  width:100%;appearance:none;border:2px solid rgba(166,194,210,.4);background:#02182A;color:#fff;
  font-family:var(--sans);font-size:16px;padding:13px 14px;border-radius:0;
}
.wiz-body input::placeholder{color:#6F8FA2}
.wiz-body input:focus,.wiz-body select:focus,.wiz-body textarea:focus{outline:none;border-color:var(--teal)}
.wiz-body select option{background:#02182A;color:#fff}
.wiz-body label{display:block;font-size:11px;font-weight:800;letter-spacing:.14em;
  text-transform:uppercase;color:var(--mist);margin-bottom:7px}

.wiz-nav{display:flex;gap:10px;align-items:center;margin-top:24px;flex-wrap:wrap}
.wiz-nav button{
  appearance:none;cursor:pointer;font-family:var(--sans);font-size:11px;font-weight:800;
  letter-spacing:.14em;text-transform:uppercase;padding:13px 22px;border-radius:0;
  border:2px solid var(--gold);background:var(--gold);color:var(--navy);
}
.wiz-nav button:hover{background:transparent;color:var(--gold)}
.wiz-nav button[disabled]{opacity:.45;cursor:not-allowed}
.wiz-nav button.ghost,.wiz-nav button.back{background:transparent;color:var(--mist);border-color:rgba(166,194,210,.4)}
.wiz-nav button.ghost:hover,.wiz-nav button.back:hover{color:#fff;border-color:#fff}
.wiz-nav button:focus-visible{outline:2px solid var(--teal);outline-offset:3px}

.error{margin-top:12px;font-size:13.5px;color:#FFB4C0}

/* waiting state */
.wiz-loading{display:flex;align-items:center;gap:12px;color:var(--mist);font-size:14px;margin-top:18px}
.star svg{width:22px;height:22px;fill:var(--gold)}
.star.sm svg{width:13px;height:13px;fill:var(--teal)}
/* Step 8 must visibly move while scan-intake runs (~30s) so it never reads as stuck. */
.wiz-loading .star{display:inline-flex;animation:wiz-twinkle 1.6s ease-in-out infinite}
.wiz-loading .star.sm{animation-duration:1.1s;animation-delay:-.5s}
.wiz-loading .wiz-status{display:block;min-height:1.4em;transition:opacity .25s ease}
.wiz-loading .wiz-status.fade{opacity:0}
.wiz-loading .wiz-elapsed{display:block;margin-top:4px;font-size:12px;color:rgba(166,194,210,.7);font-variant-numeric:tabular-nums}
.wiz-track.busy{position:relative}
.wiz-track.busy .wiz-fill{opacity:.35}
.wiz-track.busy::after{content:"";position:absolute;top:0;left:-34%;width:34%;height:100%;border-radius:999px;background:var(--gold);animation:wiz-sweep 1.4s ease-in-out infinite}
@keyframes wiz-twinkle{0%,100%{transform:scale(.8) rotate(0deg);opacity:.5}50%{transform:scale(1.15) rotate(18deg);opacity:1}}
@keyframes wiz-sweep{0%{left:-34%}100%{left:100%}}
@media (prefers-reduced-motion:reduce){
  .wiz-loading .star,.wiz-track.busy::after{animation:none}
  .wiz-track.busy::after{left:0;width:100%;opacity:.4}
}

/* the prompt preview */
.prompts-intro{font-size:15px;line-height:1.6;color:var(--mist);margin:0 0 18px}
.pgroup{margin-top:16px}
.pgroup-h{font-size:10px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;
  color:var(--teal);margin-bottom:8px}
.pitem{
  font-size:14px;line-height:1.5;color:#CFE2EC;padding:10px 12px;margin-bottom:6px;
  background:rgba(2,24,39,.6);border-left:2px solid rgba(239,170,54,.5);
}

/* the finish */
.success-h{font-family:var(--cond);font-size:clamp(30px,4.4vw,48px);font-weight:800;
  line-height:1;color:#fff;margin:10px 0 0}
.success-deck{font-size:16px;line-height:1.6;color:var(--mist);margin:14px 0 0}
.success-meta{font-size:12.5px;color:#7F9DB0;margin-top:16px}

@media (max-width:620px){
  .scan-card{padding:24px 20px 26px}
  .wiz-nav button{flex:1 1 100%;text-align:center}
}

/* the orientation line under the wizard, first step only */
.beta-note{
  margin-top:22px;padding-top:16px;border-top:1px solid rgba(166,194,210,.18);
  font-size:13px;line-height:1.65;color:#8FAEBF;
}
.beta-note a{color:var(--gold);text-decoration:none;border-bottom:1px solid rgba(239,170,54,.45)}
.beta-note a:hover{color:#fff;border-color:#fff}
