:root{
  --ssoi-primary:#0B2B5B;
  --ssoi-accent:#2F80ED;
  --ssoi-font-base:16px;
  --ssoi-heading-fs: 1.0em;
  --ssoi-input-label-fs: .9em;
  --ssoi-kpi-label-fs: .78em;
  --ssoi-kpi-value-fs: 1.18em;
  --ssoi-breakdown-fs: .82em;
  --ssoi-brand-fs: 1.05em;
  --ssoi-title-fs: .82em;
}
.ssoi-wrap{
  font-family: inherit;
  font-size: var(--ssoi-font-base);
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0,0,0,.08);
  background: #fff;
}
.ssoi-header{
  display:flex;
  gap:14px;
  align-items:center;
  padding:16px 18px;
  background: linear-gradient(135deg, var(--ssoi-primary), #000);
  color:#fff;
}
.ssoi-logo{
  height:48px;
  width:auto;
  border-radius: 12px;
  background: rgba(255,255,255,.08);
  padding: 6px;
}
.ssoi-brand{ font-weight: 850; font-size: 1.15em; line-height: 1.1; }
.ssoi-sub{ opacity: .92; font-size: .88em; }

.ssoi-grid{
  display:grid;
  grid-template-columns: 1fr;
  gap:14px;
  padding: 14px;
}
@media (min-width: 860px){
  .ssoi-grid{ grid-template-columns: 1fr 1fr; }
}

.ssoi-card{
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 16px;
  padding: 14px;
  background: #fff;
}
.ssoi-card h3{
  margin: 0 0 10px 0;
  font-size: var(--ssoi-heading-fs);
  font-weight: 850;
  color: var(--ssoi-primary);
}
.ssoi-card label{
  display:block;
  margin: 10px 0 6px 0;
  font-weight: 650;
  font-size: var(--ssoi-input-label-fs);
  color: rgba(0,0,0,.78);
}
.ssoi-req{ color: var(--ssoi-accent); font-weight: 900; }

.ssoi-input{
  box-sizing: border-box;
  min-height: 44px;
  width: 100%;
  border: 1px solid rgba(0,0,0,.15);
  border-radius: 12px;
  padding: 11px 12px;
  font-size: .98em;
  outline: none;
  background: #fff;
}
.ssoi-input:focus{
  border-color: var(--ssoi-accent);
  box-shadow: 0 0 0 3px rgba(47,128,237,.18);
}

.ssoi-btn{
  margin-top: 12px;
  width: 100%;
  border: 0;
  border-radius: 12px;
  padding: 12px 14px;
  background: var(--ssoi-accent);
  color: #fff;
  font-weight: 850;
  cursor: pointer;
  font-size: 1em;
}
.ssoi-btn:hover{ filter: brightness(.96); }

.ssoi-note{ margin-top: 10px; font-size: .85em; opacity: .8; }

.ssoi-kpis{
  display:grid;
  grid-template-columns: 1fr;
  gap:10px;
  margin-top: 8px;
}
@media (min-width: 520px){
  .ssoi-kpis{ grid-template-columns: 1fr 1fr 1fr; }
}
.ssoi-kpi{
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 14px;
  padding: 10px 12px;
  background: rgba(0,0,0,.02);
}
.ssoi-kpi-label{ font-size: var(--ssoi-kpi-label-fs); opacity: .75; margin-bottom: 4px; }
.ssoi-kpi-value{ font-size: var(--ssoi-kpi-value-fs); font-weight: 900; color: var(--ssoi-primary); }

.ssoi-decision{
  font-size: .95em;
  font-weight: 900;
  padding: 7px 10px;
  border-radius: 999px;
  display: inline-block;
  border: 1px solid rgba(0,0,0,.10);
  background: rgba(0,0,0,.03);
}
.ssoi-decision.pass{ background: rgba(46, 204, 113, .16); color: #1f8f4d; }
.ssoi-decision.fail{ background: rgba(231, 76, 60, .14); color: #a92f25; }
.ssoi-decision.need{ background: rgba(241, 196, 15, .14); color: #7a5c00; }

.ssoi-breakdown{ margin-top: 12px; border-top: 1px solid rgba(0,0,0,.08); padding-top: 10px; }
.ssoi-breakdown h4{ margin: 0 0 8px 0; font-size: .9em; font-weight: 850; color: var(--ssoi-primary); }
.ssoi-row{
  display:flex;
  justify-content: space-between;
  gap: 12px;
  padding: 6px 0;
  font-size: var(--ssoi-breakdown-fs);
  opacity: .88;
  border-bottom: 1px dashed rgba(0,0,0,.10);
}
.ssoi-row:last-child{ border-bottom: 0; }
.ssoi-disclaimer{ margin-top: 10px; font-size: calc(var(--ssoi-breakdown-fs) * 1.15); opacity: .75; }


/* Actions */
.ssoi-actions{
  display:flex;
  gap:10px;
  flex-wrap: wrap;
  margin-top: 12px;
}
.ssoi-btn--secondary{
  background: transparent;
  color: var(--ssoi-primary);
  border: 1px solid rgba(0,0,0,.18);
}
.ssoi-btn--secondary:hover{ background: rgba(0,0,0,.03); }

/* Errors */
.ssoi-error{
  border-color: rgba(231, 76, 60, .55) !important;
  box-shadow: 0 0 0 3px rgba(231, 76, 60, .12) !important;
}

/* Results redesign */
.ssoi-results{
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 16px;
  padding: 12px;
  background: rgba(0,0,0,.01);
}
.ssoi-result-row{
  display:flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 6px;
  border-bottom: 1px dashed rgba(0,0,0,.12);
}
.ssoi-result-row:last-of-type{ border-bottom: 0; }
.ssoi-result-label{
  font-weight: 700;
  opacity: .80;
  font-size: var(--ssoi-kpi-label-fs);
}
.ssoi-result-value{
  font-weight: 900;
  color: var(--ssoi-primary);
  font-size: var(--ssoi-kpi-value-fs);
}
.ssoi-criteria{
  margin-top: 10px;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,.10);
  background: rgba(0,0,0,.02);
  font-size: .9em;
}
.ssoi-criteria-value.pass{ color: #1f8f4d; font-weight: 900; }
.ssoi-criteria-value.fail{ color: #a92f25; font-weight: 900; }
.ssoi-criteria-value.need{ color: #7a5c00; font-weight: 900; }

/* Print styles (save as PDF via browser) */
.ssoi-print{ display:none; }
@media print{
  body *{ visibility: hidden !important; }
  .ssoi-wrap{ box-shadow:none; border:0; }
  .ssoi-wrap, .ssoi-wrap *{ visibility: visible !important; }
  .ssoi-actions, .ssoi-alert, .ssoi-note{ display:none !important; }
  .ssoi-print{ display:block !important; }
  .ssoi-grid{ display:none !important; }
  .ssoi-header{ background: #fff !important; color:#000 !important; border-bottom: 2px solid #000940; }

  .ssoi-print-header{ display:flex; justify-content:space-between; align-items:flex-start; gap:20px; margin: 10px 0 16px; }
  .ssoi-print-brand{ display:flex; gap:12px; align-items:center; }
  .ssoi-print-logo{ height:46px; width:auto; }
  .ssoi-print-title{ font-size: 18px; font-weight: 900; }
  .ssoi-print-sub{ font-size: 12px; opacity:.8; }
  .ssoi-print-meta{ font-size: 12px; text-align:right; }

  .ssoi-print-grid{ display:grid; grid-template-columns: 1fr 1fr; gap:14px; }
  .ssoi-print-card{ border:1px solid rgba(0,0,0,.18); border-radius: 12px; padding:12px; }
  .ssoi-print-card h4{ margin:0 0 10px 0; font-size: 14px; }
  .ssoi-print-row{ display:flex; justify-content:space-between; padding:6px 0; border-bottom:1px dashed rgba(0,0,0,.2); font-size: 12px; }
  .ssoi-print-row:last-child{ border-bottom:0; }
  .ssoi-print-footer{ margin-top: 14px; font-size: 11px; opacity:.8; }
}



input.ssoi-input[type="text"]{
  -webkit-appearance: none;
  appearance: none;
  box-sizing: border-box;
  height: 44px;
  line-height: 44px;
  padding: 0 14px;
}

/* Header layout */
.ssoi-header-inner{
  display:flex;
  align-items:center;
  gap: 14px;
}
.ssoi-header-logo{
  height: 42px;
  width: auto;
  display:block;
}
.ssoi-header-text{ display:flex; flex-direction:column; gap: 2px; }
.ssoi-brand{ font-size: var(--ssoi-brand-fs); }
.ssoi-title{ font-size: var(--ssoi-title-fs); opacity: .9; }


