/* Kenson Quiz Tools — front end. All rules scoped to .kqt-wrap. */

.kqt-wrap{
  --kqt-bg:#004646; --kqt-panel:rgba(7,7,7,.38); --kqt-panel-2:rgba(255,255,255,.06);
  --kqt-line:rgba(0,215,216,.18); --kqt-line-strong:rgba(0,215,216,.34);
  --kqt-ink:#F2F7F7; --kqt-dim:#9FBDBD;
  --kqt-gold:#00D7D8; --kqt-gold-soft:#5CE8E9;
  --kqt-sage:#00D7D8; --kqt-rust:#FF7A5C; --kqt-teal:#00D7D8;
  --kqt-mono:"Poppins",sans-serif;
  --kqt-serif:"Syne",sans-serif;
  --kqt-sans:"Poppins",sans-serif;
  max-width:880px; margin:0 auto; padding:26px 24px 40px;
  background:linear-gradient(150deg,#004646 49%,#070707 79%);
  color:var(--kqt-ink); font-family:var(--kqt-sans); line-height:1.5;
  -webkit-font-smoothing:antialiased; box-sizing:border-box; border-radius:6px;
}
.kqt-wrap *,.kqt-wrap *::before,.kqt-wrap *::after{box-sizing:border-box;}

.kqt-wrap.kqt-theme-light{
  --kqt-panel:#FFFFFF; --kqt-panel-2:#EEF7F7;
  --kqt-line:rgba(0,70,70,.14); --kqt-line-strong:rgba(0,70,70,.26);
  --kqt-ink:#07201F; --kqt-dim:#4C6A6A;
  background:linear-gradient(150deg,#F4FBFB 49%,#E6F4F4 79%);
}
.kqt-wrap.kqt-theme-light .kqt-btn,
.kqt-wrap.kqt-theme-light .kqt-nav-btn.kqt-primary{color:#04302F;}

/* masthead */
.kqt-masthead{border-bottom:1px solid var(--kqt-line); padding:0 0 22px;}
.kqt-brand-row{display:flex;align-items:center;gap:12px;margin-bottom:12px;}
.kqt-logo-badge{background:#F5F3EC;padding:5px 12px;border-radius:5px;display:inline-flex;align-items:center;line-height:0;box-shadow:0 3px 14px rgba(0,0,0,0.32);}
.kqt-logo-badge img{display:block;height:28px;width:auto;}
.kqt-brand{font-family:var(--kqt-mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--kqt-gold-soft);}
.kqt-brand span{color:var(--kqt-dim);}
.kqt-wrap .kqt-h1{font-family:var(--kqt-serif);font-weight:500;font-size:clamp(26px,4.2vw,38px);margin:10px 0 6px;
  letter-spacing:-0.01em;color:var(--kqt-ink);line-height:1.2;}
.kqt-subhead{color:var(--kqt-dim);font-size:15px;max-width:62ch;margin:0;}
.kqt-compliance{font-family:var(--kqt-mono);font-size:11px;color:var(--kqt-dim);display:flex;gap:18px;flex-wrap:wrap;margin-top:16px;}
.kqt-compliance span::before{content:"\2713 ";color:var(--kqt-sage);}

.kqt-main{padding-top:30px;}

/* progress + questions */
.kqt-progress-track{height:4px;background:var(--kqt-panel-2);border-radius:2px;margin-bottom:28px;overflow:hidden;}
.kqt-progress-fill{height:100%;background:var(--kqt-gold);width:0;transition:width .35s ease;}

.kqt-q-card{background:var(--kqt-panel);border:1px solid var(--kqt-line);padding:28px;display:none;}
.kqt-q-card.kqt-active{display:block;}
.kqt-q-eyebrow{font-family:var(--kqt-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--kqt-dim);margin-bottom:10px;}
.kqt-q-title{font-family:var(--kqt-serif);font-weight:500;font-size:22px;margin:0 0 22px;max-width:46ch;line-height:1.35;}

.kqt-options{display:flex;flex-direction:column;gap:10px;}
.kqt-option{border:1.5px solid var(--kqt-line-strong);background:var(--kqt-panel-2);padding:14px 16px;border-radius:12px;
  cursor:pointer;transition:border-color .15s,background .15s;display:flex;gap:14px;align-items:center;
  text-align:left;width:100%;color:inherit;font:inherit;}
.kqt-option:hover{border-color:var(--kqt-gold-soft);}
.kqt-option:focus-visible{outline:2px solid var(--kqt-gold-soft);outline-offset:2px;}
.kqt-option.kqt-selected{border-color:var(--kqt-gold);border-width:2px;padding:13px 15px;background:rgba(201,162,39,0.1);}
.kqt-badge{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0;
  font-family:var(--kqt-mono);font-size:13px;font-weight:600;}
.kqt-opt-text{flex:1;min-width:0;}
.kqt-opt-title{display:block;font-weight:600;font-size:14.5px;color:var(--kqt-ink);line-height:1.35;}
.kqt-opt-sub{display:block;font-size:12.5px;color:var(--kqt-dim);margin-top:2px;line-height:1.4;}
.kqt-radio{width:20px;height:20px;border-radius:50%;border:2px solid var(--kqt-dim);flex-shrink:0;position:relative;}
.kqt-option.kqt-selected .kqt-radio{border-color:var(--kqt-gold);}
.kqt-option.kqt-selected .kqt-radio::after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--kqt-gold);}

.kqt-nav-row{display:flex;justify-content:space-between;align-items:center;margin-top:26px;gap:12px;}
.kqt-nav-btn{font:inherit;font-weight:700;font-size:14px;padding:12px 20px;border-radius:2px;cursor:pointer;
  border:1px solid var(--kqt-line-strong);background:transparent;color:var(--kqt-ink);}
.kqt-nav-btn.kqt-primary{background:var(--kqt-gold);color:#04302F;border-color:var(--kqt-gold);}
.kqt-nav-btn.kqt-primary:hover{background:var(--kqt-gold-soft);}
.kqt-nav-btn:disabled{opacity:.35;cursor:not-allowed;}
.kqt-nav-btn[hidden]{display:none;}
.kqt-step-count{font-family:var(--kqt-mono);font-size:12px;color:var(--kqt-dim);}

/* gate */
.kqt-gate{background:var(--kqt-panel);border:1px solid var(--kqt-gold);padding:32px;display:none;text-align:center;}
.kqt-gate.kqt-active{display:block;}
.kqt-loading{display:none;align-items:center;justify-content:center;gap:12px;background:var(--kqt-panel);border:1px solid var(--kqt-line);padding:30px;color:var(--kqt-dim);font-size:14px;text-align:center;}
.kqt-loading.kqt-active{display:flex;}
.kqt-spinner{width:18px;height:18px;border:2px solid var(--kqt-line-strong);border-top-color:var(--kqt-gold);border-radius:50%;animation:kqt-spin .8s linear infinite;flex:0 0 auto;}
@keyframes kqt-spin{to{transform:rotate(360deg);}}
.kqt-wrap .kqt-gate h3{font-family:var(--kqt-serif);font-weight:500;font-size:24px;margin:0 0 10px;color:var(--kqt-ink);}
.kqt-gate p{color:var(--kqt-dim);font-size:14.5px;max-width:48ch;margin:0 auto 22px;}
.kqt-gate-form{display:flex;gap:10px;max-width:420px;margin:0 auto;flex-wrap:wrap;justify-content:center;}
.kqt-wrap input[type=email],.kqt-wrap input[type=text],.kqt-wrap input[type=tel]{
  flex:1;min-width:200px;background:var(--kqt-panel-2);border:1px solid var(--kqt-line-strong);
  color:var(--kqt-ink);padding:13px 14px;font:inherit;font-size:14px;border-radius:2px;}
.kqt-btn{background:var(--kqt-gold);color:#04302F;border:none;font:inherit;font-weight:700;font-size:14px;
  padding:13px 22px;border-radius:2px;cursor:pointer;}
.kqt-btn:hover{background:var(--kqt-gold-soft);}
.kqt-btn:disabled{opacity:.6;cursor:progress;}

.kqt-error{display:none;color:#E08A72;font-size:13px;margin-top:12px;}
.kqt-error.kqt-show{display:block;}

/* result shell */
.kqt-result{background:var(--kqt-panel);border:1px solid var(--kqt-line);padding:34px;display:none;}
.kqt-result.kqt-active{display:block;}
.kqt-seal{width:104px;height:104px;border-radius:50%;border:2px solid var(--kqt-gold);display:flex;align-items:center;
  justify-content:center;text-align:center;margin:0 auto 22px;transform:rotate(-6deg);position:relative;}
.kqt-seal::before{content:"";position:absolute;inset:8px;border:1px dashed var(--kqt-gold-soft);border-radius:50%;}
.kqt-seal span{font-family:var(--kqt-mono);font-size:9px;letter-spacing:.05em;text-transform:uppercase;
  color:var(--kqt-gold-soft);line-height:1.35;padding:0 10px;}
.kqt-result-label{font-family:var(--kqt-serif);font-weight:500;font-size:28px;text-align:center;margin:0 0 4px;}
.kqt-result-score{text-align:center;font-family:var(--kqt-mono);font-size:13px;color:var(--kqt-dim);margin-bottom:24px;}
.kqt-result-text{font-size:15px;max-width:64ch;margin:0 auto 26px;}

/* dimensions: score ring + bars */
.kqt-ring-wrap{text-align:center;margin-bottom:26px;}
.kqt-ring{--pct:0;width:150px;height:150px;border-radius:50%;margin:0 auto 14px;display:flex;align-items:center;justify-content:center;
  background:conic-gradient(var(--kqt-gold) calc(var(--pct)*1%), var(--kqt-panel-2) 0);position:relative;}
.kqt-ring::before{content:"";position:absolute;inset:12px;border-radius:50%;background:var(--kqt-panel);}
.kqt-ring-num{position:relative;font-family:var(--kqt-serif);font-size:38px;font-weight:500;}
.kqt-ring-num sub{font-family:var(--kqt-mono);font-size:12px;color:var(--kqt-dim);vertical-align:baseline;}
.kqt-grade-tag{display:inline-block;font-family:var(--kqt-mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;
  padding:5px 14px;border-radius:14px;background:rgba(111,163,107,.16);color:var(--kqt-sage);border:1px solid rgba(111,163,107,.4);}
.kqt-grade-developing{background:rgba(201,162,39,.16);color:var(--kqt-gold-soft);border-color:rgba(201,162,39,.4);}
.kqt-grade-high-risk{background:rgba(193,85,59,.16);color:var(--kqt-rust);border-color:rgba(193,85,59,.4);}

.kqt-bars{display:flex;flex-direction:column;gap:14px;margin-bottom:26px;}
.kqt-bar-head{display:flex;justify-content:space-between;font-size:13px;margin-bottom:6px;}
.kqt-bar-num{font-family:var(--kqt-mono);color:var(--kqt-dim);}
.kqt-bar-track{height:8px;background:var(--kqt-panel-2);border-radius:4px;overflow:hidden;}
.kqt-bar-fill{height:100%;background:var(--kqt-gold);border-radius:4px;transition:width .5s ease;}

/* insight cards */
.kqt-insights{display:flex;flex-direction:column;gap:12px;margin-bottom:22px;}
.kqt-insights:empty{display:none;}
.kqt-insight{background:var(--kqt-panel-2);border-left:3px solid var(--kqt-gold);padding:14px 16px;border-radius:2px;}
.kqt-wrap .kqt-insight h5{margin:0 0 6px;font-size:14px;font-weight:600;color:var(--kqt-ink);}
.kqt-insight p{margin:0;font-size:13.5px;color:var(--kqt-dim);line-height:1.55;}

/* related */
.kqt-related{border-top:1px solid var(--kqt-line);padding-top:20px;}
.kqt-wrap .kqt-related h4{font-family:var(--kqt-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--kqt-dim);margin:0 0 12px;font-weight:500;}
.kqt-related-list{margin:0;padding-left:20px;font-size:14px;list-style:disc;}
.kqt-related-list li{margin-bottom:6px;}
.kqt-related-list a{color:var(--kqt-gold-soft);text-decoration:underline;}

/* consultation */
.kqt-cta-box{border:1px solid var(--kqt-gold);background:linear-gradient(180deg,rgba(201,162,39,0.07),transparent);
  padding:24px;margin-top:22px;border-radius:2px;}
.kqt-wrap .kqt-cta-box h4{margin:0 0 8px;font-family:var(--kqt-serif);font-weight:500;font-size:17px;color:var(--kqt-ink);
  text-transform:none;letter-spacing:0;}
.kqt-cta-box p{font-size:14px;color:var(--kqt-dim);margin:0 0 16px;}
.kqt-consult-form{margin-top:18px;display:none;flex-direction:column;gap:10px;}
.kqt-consult-form.kqt-show{display:flex;}
.kqt-crow{display:flex;gap:10px;flex-wrap:wrap;}
.kqt-consult-success{display:none;margin-top:14px;color:var(--kqt-sage);font-size:14px;}
.kqt-consult-success.kqt-show{display:block;}

.kqt-restart{text-align:center;margin-top:24px;}
.kqt-restart button{background:none;border:none;color:var(--kqt-dim);font-family:var(--kqt-mono);font-size:12px;
  text-decoration:underline;cursor:pointer;}

/* allocation visualizer */
.kqt-alloc{background:var(--kqt-panel);border:1px solid var(--kqt-line);padding:28px;}
.kqt-alloc-grid{display:flex;gap:30px;flex-wrap:wrap;align-items:flex-start;}
.kqt-pie-col{flex:0 0 220px;text-align:center;}
.kqt-pie{width:200px;height:200px;border-radius:50%;margin:0 auto 12px;position:relative;
  background:conic-gradient(var(--kqt-gold) 0deg 360deg);}
.kqt-pie::after{content:"";position:absolute;inset:26%;border-radius:50%;background:var(--kqt-panel);}
.kqt-total{font-family:var(--kqt-mono);font-size:12px;color:var(--kqt-sage);}
.kqt-sliders{flex:1 1 300px;min-width:260px;display:flex;flex-direction:column;gap:16px;}
.kqt-slider-head{display:flex;justify-content:space-between;align-items:center;font-size:13.5px;margin-bottom:6px;}
.kqt-slider-val{font-family:var(--kqt-mono);color:var(--kqt-gold-soft);}
.kqt-swatch{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:8px;}
.kqt-sliders input[type=range]{width:100%;accent-color:var(--kqt-gold);cursor:pointer;}
.kqt-legend{margin-top:22px;border-top:1px solid var(--kqt-line);padding-top:16px;display:flex;flex-direction:column;gap:8px;}
.kqt-legend-row{display:flex;justify-content:space-between;font-size:13.5px;}
.kqt-legend-pct{font-family:var(--kqt-mono);color:var(--kqt-dim);}
.kqt-alloc-profile{margin-top:24px;border-top:1px solid var(--kqt-line);padding-top:20px;}
.kqt-alloc-profile .kqt-result-label{font-size:22px;text-align:left;}
.kqt-alloc-profile .kqt-result-text{margin:8px 0 0;}
.kqt-engine-allocation .kqt-result{margin-top:20px;}
.kqt-engine-allocation .kqt-result .kqt-result-label,
.kqt-engine-allocation .kqt-result .kqt-result-score,
.kqt-engine-allocation .kqt-result .kqt-result-text,
.kqt-engine-allocation .kqt-seal{display:none;}

/* footer */
.kqt-disclaimer{font-size:11.5px;color:var(--kqt-dim);line-height:1.6;border-top:1px solid var(--kqt-line);
  padding-top:16px;margin-top:30px;}
.kqt-disclaimer strong{color:var(--kqt-ink);}
.kqt-wrap h1,.kqt-wrap h2,.kqt-wrap h3,.kqt-wrap h4,.kqt-wrap h5{font-family:var(--kqt-serif);}
.kqt-footer{text-align:center;color:var(--kqt-dim);font-size:11.5px;font-family:var(--kqt-mono);margin-top:34px;}

@media (max-width:640px){
  .kqt-wrap{padding:20px 16px 32px;}
  .kqt-q-card,.kqt-result,.kqt-gate,.kqt-alloc{padding:20px;}
  .kqt-alloc-grid{gap:20px;}
  .kqt-pie-col{flex:1 1 100%;}
  .kqt-nav-row{flex-wrap:wrap;}
}
