/* Second Service Readiness Assessment — scoped styles */
.ss-survey, .ss-survey * { box-sizing: border-box; }
.ss-survey {
  --ss-green-700: #00543c;
  --ss-green-900: #012b21;
  --ss-gold-500: #fdbb30;
  --ss-cream: #fff7df;
  --ss-ink: #13251f;
  --ss-line: #d8cfaa;
  --ss-risk: #8f2e2e;
  color: var(--ss-ink);
  font-family: "Inter", "Segoe UI", system-ui, sans-serif;
  line-height: 1.55;
  margin: 1.5rem 0;
}
.ss-survey h2, .ss-survey h3, .ss-survey h4 {
  font-family: "Source Serif 4", Georgia, serif;
  color: var(--ss-green-900);
  margin: 0.4rem 0 0.75rem;
  line-height: 1.2;
}
.ss-survey h2 { font-size: clamp(1.5rem, 2.6vw, 2rem); }
.ss-survey h3 { font-size: 1.2rem; }
.ss-survey h4 { font-size: 1rem; color: var(--ss-green-700); }
.ss-survey p { margin: 0 0 0.7rem; }
.ss-eyebrow {
  margin: 0; font-size: 0.78rem; text-transform: uppercase;
  letter-spacing: 0.08em; color: var(--ss-green-700); font-weight: 800;
}

.ss-survey-shell {
  background: linear-gradient(135deg, #fff, var(--ss-cream));
  border: 1px solid rgba(0, 84, 60, 0.18);
  border-radius: 22px;
  padding: 1.35rem;
  margin-top: 1rem;
}
.ss-profile-panel, .ss-test-panel { max-width: 860px; margin: 0 auto; }
.ss-hidden { display: none !important; }

.ss-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.7rem;
}
.ss-survey label { display: grid; gap: 0.3rem; font-weight: 600; }
.ss-survey input, .ss-survey select, .ss-survey textarea {
  width: 100%; border: 1px solid var(--ss-line); border-radius: 9px;
  padding: 0.6rem 0.7rem; font: inherit; background: #fff;
}
.ss-consent-card {
  grid-template-columns: auto 1fr; align-items: start;
  gap: 0.85rem; margin: 1rem 0; padding: 1rem;
  border: 2px solid rgba(0, 84, 60, 0.22);
  border-radius: 16px; background: #fff;
}
.ss-consent-check {
  width: 24px; height: 24px; accent-color: var(--ss-green-700); margin-top: 0.15rem;
}
.ss-form-error {
  border: 1px solid #dca7a7; border-radius: 12px; padding: 0.7rem;
  background: #fff3f3; color: #701f1f; font-weight: 700;
}

.ss-btn {
  display: inline-block; border-radius: 10px; text-decoration: none;
  font-weight: 700; padding: 0.72rem 1rem; border: 1px solid transparent;
  cursor: pointer; font: inherit; transition: transform 0.2s ease;
}
.ss-btn:hover { transform: translateY(-2px); }
.ss-btn-primary {
  background: var(--ss-gold-500); color: #063829;
  box-shadow: 0 12px 30px rgba(253, 187, 48, 0.3);
}
.ss-btn-ghost {
  border-color: var(--ss-green-700); color: var(--ss-green-700); background: #fff;
}

.ss-survey-step-header {
  display: flex; justify-content: space-between; gap: 1rem; align-items: start;
}
.ss-category-pill {
  display: inline-block; width: fit-content;
  border-radius: 999px; padding: 0.28rem 0.7rem;
  background: var(--ss-cream); color: var(--ss-green-700);
  border: 1px solid rgba(0, 84, 60, 0.22);
  font-size: 0.78rem; font-weight: 800;
}
.ss-progress-wrap { margin: 0.7rem 0 1rem; }
.ss-progress {
  width: 100%; height: 10px; border-radius: 999px;
  overflow: hidden; background: #e7ecf2;
}
.ss-progress > span {
  display: block; height: 100%;
  background: linear-gradient(90deg, var(--ss-green-700), var(--ss-gold-500));
}

.ss-question {
  border: 1px solid var(--ss-line); border-radius: 18px;
  padding: 1.1rem; margin-bottom: 0.75rem; background: #fff;
}
.ss-question h4 { margin-top: 0.4rem; color: var(--ss-ink); }
.ss-question-options {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.55rem; margin-top: 0.55rem;
}
.ss-question-options label {
  border: 1px solid var(--ss-line); border-radius: 999px;
  text-align: center; padding: 0.82rem 0.6rem;
  font-size: 1rem; background: #fff; cursor: pointer; font-weight: 800;
  transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease;
}
.ss-question-options label:hover { transform: translateY(-2px); border-color: var(--ss-gold-500); }
.ss-question-options label:has(input:checked) {
  border-color: var(--ss-green-700); background: var(--ss-green-700); color: #fff;
}
.ss-survey-actions {
  display: flex; gap: 0.6rem; flex-wrap: wrap; justify-content: space-between;
  margin-top: 1rem;
}

.ss-result-grid {
  display: grid; grid-template-columns: 1.1fr 1fr; gap: 1rem; margin-top: 1rem;
}
.ss-metric-card {
  border: 1px solid var(--ss-line); border-radius: 16px;
  padding: 1rem; background: #fff; margin-top: 1rem;
}
.ss-meter {
  height: 8px; border-radius: 999px; overflow: hidden;
  background: #e5eaf0; margin-top: 0.35rem;
}
.ss-meter span {
  height: 100%; display: block;
  background: linear-gradient(90deg, var(--ss-green-700), var(--ss-gold-500));
}
.ss-tag {
  display: inline-block; border-radius: 999px;
  padding: 0.2rem 0.6rem; font-size: 0.75rem; font-weight: 700;
}
.ss-tag-strong { background: #dcefe8; color: #195342; }
.ss-tag-solid { background: #e4ebf3; color: #1c3d62; }
.ss-tag-needs { background: #f8ead2; color: #7b4f13; }
.ss-tag-critical { background: #f8d9d9; color: #7f2525; }

.ss-signal-grid {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.9rem;
}
.ss-signal-card {
  border: 1px solid var(--ss-line); border-radius: 16px;
  padding: 1rem; background: #fff;
}
.ss-signal-strength { border-left: 6px solid var(--ss-green-700); }
.ss-signal-gap, .ss-signal-priority { border-left: 6px solid var(--ss-gold-500); }
.ss-signal-risk { border-left: 6px solid var(--ss-risk); background: #fff7f4; }

.ss-action-plan ol { margin: 0; padding-left: 1.25rem; }
.ss-action-plan li { margin: 0.65rem 0; }

.ss-warning {
  border: 1px solid #dca7a7; background: #fff3f3;
  color: #701f1f; border-radius: 12px; padding: 0.75rem;
}

@media (max-width: 700px) {
  .ss-form-grid, .ss-result-grid, .ss-signal-grid, .ss-question-options {
    grid-template-columns: 1fr;
  }
  .ss-survey-step-header { display: block; }
}