/* ============================================================================
   Annual Contract Assessment Scorecard - page styles (loaded after style.css).
   Input: maturity option pills per question. Results: dark diagnostic panel
   with a blooming 4-axis radar, count-up /48, level badge, and section bars.
   Class names are page-scoped (aq-/ladder/abar) to avoid cross-page collisions.
   ============================================================================ */

/* ---- Input: questions ---- */
.aq-scale-note{font-size:12.5px;color:var(--muted);line-height:1.55;margin:0 0 18px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 14px}
.aq-scale-note strong{color:var(--ink)}
.aq{padding:13px 0;border-top:1px solid var(--hair)}
.aq:first-of-type{border-top:0}
.aq-prompt{font-size:14px;font-weight:600;color:var(--ink);line-height:1.4;margin:0 0 9px}
.aq-num{color:var(--faint);font-weight:700;margin-right:6px;font-variant-numeric:tabular-nums}
.aq-opts{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:7px}
.aq-opt{position:relative;display:flex;align-items:center;gap:9px;border:1.5px solid var(--line);border-radius:10px;padding:9px 11px;cursor:pointer;background:#fff;transition:border-color .15s,background .15s}
.aq-opt:hover{border-color:#CBD4DC}
.aq-opt input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.aq-opt .pt{flex:none;width:24px;height:24px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;background:#EDF0F3;color:var(--muted);font-variant-numeric:tabular-nums;transition:all .15s}
.aq-opt .lab{flex:1;font-size:12.5px;color:var(--ink);line-height:1.3}
.aq-opt.sel{border-color:var(--blue);background:#F4FAFE}
.aq-opt.sel .pt{background:var(--blue);color:#fff}
.aq-opt input:focus-visible ~ .pt{outline:2px solid var(--blue);outline-offset:2px}

/* ---- Results: maturity ladder (dark, reuses .monitor base) ----
   Four ascending steps (worst -> best). Steps you have climbed past light up in
   sequence with the count-up; your level lands with a glow and a pulsing pin. */
.ladder{display:flex;align-items:flex-end;gap:8px;margin:18px 2px 4px}
.lstep{flex:1;display:flex;flex-direction:column;align-items:center;min-width:0}
.lblock{
  width:100%;border-radius:10px 10px 4px 4px;position:relative;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.10);
  display:flex;align-items:flex-start;justify-content:center;padding-top:8px;
  font-size:10.5px;font-weight:800;color:#7E93A6;font-variant-numeric:tabular-nums;
  transform:translateY(8px);
  transition:background .5s ease,transform .5s ease,box-shadow .5s ease,color .5s ease,border-color .5s ease;
}
.armed .lstep.lit .lblock{transform:none;color:#0B1620;border-color:transparent}
.lstep .pin{
  position:absolute;top:-15px;left:50%;margin-left:-5px;width:10px;height:10px;border-radius:50%;
  opacity:0;transition:opacity .45s ease;
}
.armed .lstep.here .pin{opacity:1;animation:beat 1.4s ease-in-out infinite}
.armed .lstep.here .lblock{box-shadow:0 10px 34px -8px rgba(255,255,255,.25)}
.ltitle{
  font-size:9.5px;line-height:1.25;text-align:center;margin-top:8px;min-height:24px;
  letter-spacing:.04em;text-transform:uppercase;font-weight:700;color:#7E93A6;
  transition:color .5s ease;
}
.armed .lstep.lit .ltitle{color:#fff}

.alevel-row{display:flex;align-items:center;justify-content:center;gap:12px;margin:14px 0 4px;flex-wrap:wrap}
.alevel-pill{
  display:inline-flex;align-items:center;gap:8px;border-radius:999px;padding:7px 16px;
  font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
  border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.07);color:#fff;position:relative;
}
.alevel-pill .dot{width:8px;height:8px;border-radius:50%;animation:beat 1.4s ease-in-out infinite}
.aband-title{font-family:var(--serif);font-size:24px;font-weight:700;text-align:center;line-height:1.15}
.aband-desc{font-size:13.5px;color:#B9C6D2;text-align:center;line-height:1.55;margin:8px 6px 0}
.aaction{
  margin:16px 4px 2px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.05);
  border-radius:13px;padding:13px 15px;text-align:left;
}
.aaction .lbl{font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#7E93A6;margin-bottom:5px}
.aaction .txt{font-size:13.5px;color:#fff;line-height:1.5}

/* Score cluster inside the panel */
.ascore{display:flex;flex-direction:column;align-items:center;margin-top:6px}
.ascore .n{font-size:56px;font-weight:800;line-height:1;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.ascore .cap{font-size:10px;letter-spacing:.16em;color:#7E93A6;margin-top:6px;text-transform:uppercase}

/* ---- Section breakdown bars (light) ---- */
.abreak{margin-top:22px}
.abreak h3{font-family:var(--serif);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--crimson);margin:0 4px 12px;font-weight:700}
.abar{background:#fff;border:1px solid var(--line);border-radius:12px;padding:13px 15px;box-shadow:0 1px 2px rgba(20,32,40,.05);margin-bottom:10px;opacity:0;transform:translateY(12px);transition:opacity .5s ease,transform .5s ease}
.armed .abar{opacity:1;transform:none}
.abar .row{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.abar .nm{font-size:13.5px;font-weight:600;color:var(--ink)}
.abar .val{font-size:13px;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--ink)}
.abar .val .max{color:var(--faint);font-weight:600}
.abar .abar-track{position:relative;height:10px;background:#EDF0F3;border-radius:6px;overflow:hidden;margin-top:9px}
.abar .abar-fill{height:100%;border-radius:6px;transform:scaleX(0);transform-origin:left;transition:transform .6s cubic-bezier(.4,0,.2,1)}
.armed .abar .abar-fill{transform:scaleX(1)}
.abar .skip{font-size:11.5px;font-weight:700;color:var(--faint);text-transform:uppercase;letter-spacing:.04em}
