/* Give the simulator introduction a clear heading hierarchy without changing the tool. */
.intro #page-title,
.is-embedded .embed-intro #embed-title {
  max-width: 25ch;
  margin: 0 0 22px;
  color: var(--ink, #173a3d);
  font-size: clamp(40px, 4vw, 48px);
  font-weight: 700;
  line-height: 1.08;
  letter-spacing: -1.35px;
  text-wrap: balance;
}

@media (max-width: 600px) {
  .intro #page-title,
  .is-embedded .embed-intro #embed-title {
    max-width: 25ch;
    margin-bottom: 18px;
    font-size: 30px;
    line-height: 1.12;
    letter-spacing: -.7px;
  }
}

/* Align both columns and keep scenario context with the input assumptions. */
.workspace > .results {padding-top:0!important}
.results > .result-gate {margin:0 0 24px}
.simulation-notes {margin-top:18px}
.simulation-notes .illustrative {font-size:11px;font-weight:400;line-height:1.5;max-width:100%}
.simulation-notes .scenario-label {margin:10px 0 0;font-size:11px}
@media (min-width:1101px) {
  .results > .result-gate .lead-entry {grid-template-columns:minmax(0,1fr) auto}
}

/* Match the parent section's grid and give both panels an equal heading level. */
.is-embedded main {max-width:none;padding:0 0 12px}
.is-embedded .workspace {grid-template-columns:minmax(0,.85fr) minmax(0,1.35fr);gap:28px}
.is-embedded .assumptions,.is-embedded .result-gate {padding:26px 24px}
.result-gate>.section-heading {margin:0 0 14px;align-items:center}
.result-gate .section-heading h3,.section-heading h2 {font-size:24px;line-height:1.25;font-weight:600;letter-spacing:-.6px;margin:0}
.result-gate>p {font-size:13px;line-height:1.65}
.is-embedded .lead-entry {grid-template-columns:1fr}
@media(max-width:850px) {
  .is-embedded .workspace {grid-template-columns:1fr;gap:28px}
}
@media(max-width:520px) {
  .is-embedded .assumptions,.is-embedded .result-gate {padding:22px 16px}
  .result-gate .section-heading h3,.section-heading h2 {font-size:22px}
}