/* The guided story exercise, scoped to Resources. */
.brief-wrap { max-width: 900px; }
.brief-heading { max-width: 760px; margin-bottom: 30px; }
.brief-heading h2 { font-size: clamp(34px, 5.4vw, 58px); line-height: 1.04; font-weight: 900; letter-spacing: -.045em; margin: 10px 0 20px; }
.brief-heading .lede { font-size: clamp(18px, 2.2vw, 22px); line-height: 1.6; margin-bottom: 16px; }
.brief-heading p, .brief-wrap p { line-height: 1.75; }
.brief-example { padding: clamp(24px, 4vw, 36px); border: 1px solid #eedbcf; border-radius: 18px; background: #fff8f2; }
.brief-example h3 { font-size: clamp(20px, 2.5vw, 25px); line-height: 1.4; margin: 10px 0 20px; max-width: 670px; }
.brief-example p { margin: 0 0 14px; max-width: 700px; }
.brief-example .fine { text-align: left; margin-bottom: 0; font-size: 13px; }
.brief-start { margin: 28px 0; display: flex; align-items: center; flex-wrap: wrap; gap: 14px 22px; }
.brief-start p { font-size: 14px; max-width: 300px; margin: 0; }
.brief-progress { margin-bottom: 24px; padding-bottom: 16px; border-bottom: 1px solid var(--line-soft); }
.brief-progress ol { list-style: none; padding: 0; margin: 0 0 12px; display: flex; flex-wrap: wrap; gap: 10px 24px; }
.brief-progress li { font: 600 13px/1.5 var(--display); color: #767676; }
.brief-progress li[aria-current="step"] { color: var(--green-dark); text-decoration: underline; text-underline-offset: 6px; text-decoration-thickness: 2px; }
.brief-save { font-size: 12px; margin: 0; color: var(--ink); }
.brief-form { padding: clamp(22px, 4vw, 36px); border-radius: 18px; border: 1px solid var(--line-soft); background: white; }
.brief-form h3, .brief-result > h3 { font-size: clamp(26px, 3.8vw, 36px); line-height: 1.2; letter-spacing: -.035em; margin: 10px 0 20px; scroll-margin-top: 110px; }
.brief-form p { margin-bottom: 18px; }
.brief-form .f { margin: 24px 0; }
.brief-wrap label { display: block; font-weight: 600; line-height: 1.5; margin-bottom: 9px; }
.brief-wrap input:not([type="radio"]):not([type="checkbox"]), .brief-wrap textarea, .brief-wrap select { display: block; width: 100%; min-width: 0; font: 400 16px/1.6 var(--text); color: var(--ink); background: #fff; border: 1px solid #c5d0c7; border-radius: 10px; padding: 12px 14px; box-sizing: border-box; }
.brief-wrap select { min-height: 50px; padding-right: 30px; }
.brief-wrap textarea { resize: vertical; min-height: 88px; }
.brief-wrap input:focus-visible, .brief-wrap textarea:focus-visible, .brief-wrap select:focus-visible, .brief-wrap button:focus-visible, .brief-wrap summary:focus-visible { outline: 3px solid var(--green); outline-offset: 3px; }
.brief-wrap ::placeholder { color: #777; opacity: 1; }
.brief-choice { border: 0; padding: 0; margin: 24px 0; }
.brief-choice legend { font-weight: 600; margin-bottom: 12px; }
.brief-choice label { display: inline-flex; align-items: center; gap: 9px; margin: 0 12px 10px 0; padding: 12px 15px; border: 1px solid #c5d0c7; border-radius: 9px; font-size: 14px; font-weight: 500; cursor: pointer; min-height: 44px; box-sizing: border-box; }
.brief-choice label:has(input:checked) { border-color: var(--green); background: #eff8f1; }
.brief-choice input { accent-color: var(--green); width: 17px; height: 17px; }
.brief-wrap .field-hint { font-size: 13px; font-weight: 400; line-height: 1.7; margin: 8px 0 0; }
.brief-help, .brief-feedback { padding: 18px 0; border-block: 1px solid var(--line-soft); margin: 22px 0; }
.brief-help summary, .brief-feedback summary, .brief-copy-fallback summary { min-height: 44px; display: list-item; padding: 10px 0; cursor: pointer; font-weight: 600; line-height: 1.5; color: var(--green-dark); }
.brief-help p { margin: 12px 0 0; font-size: 14px; }
.brief-memory { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0; }
.brief-memory button { min-height: 44px; padding: 10px 12px; border: 1px solid #c5d0c7; border-radius: 8px; color: var(--ink); background: #f8faf8; font: 500 13px/1.5 var(--text); cursor: pointer; }
.brief-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 12px 20px; margin-top: 28px; }
.brief-text-button { border: 0; background: transparent; color: var(--green-dark); font: 600 14px/1.5 var(--text); text-decoration: underline; text-underline-offset: 4px; padding: 12px 0; min-height: 44px; cursor: pointer; }
.brief-review { padding: 24px; margin: 24px 0; border-radius: 12px; background: #f1f7f2; }
.brief-review h4 { font-size: 15px; margin: 20px 0 6px; }
.brief-review p { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 15px; margin: 0 0 10px; }
.brief-review .eyebrow { font-size: 11px; }
.brief-result-intro { max-width: 650px; margin-bottom: 24px; }
.brief-paper { padding: clamp(24px, 4vw, 40px); border: 1px solid #cbd7ce; background: white; border-radius: 16px; box-shadow: 0 6px 24px #11331c08; }
.brief-paper-label { color: var(--green-dark); font: 700 21px/1.5 var(--display); padding-bottom: 22px; margin: 0 0 24px; border-bottom: 2px solid var(--green); }
.brief-paper-label span { color: var(--ink); font: 400 13px/1.5 var(--text); }
.brief-paper dl { margin: 0; }
.brief-paper dl > div { margin-bottom: 25px; break-inside: avoid; }
.brief-paper dt, .brief-feedback-compare h4 { font-size: 13px; font-weight: 700; color: var(--green-dark); margin: 0 0 6px; }
.brief-paper dd, .brief-feedback-compare p { margin: 0; font-size: 16px; line-height: 1.8; white-space: pre-wrap; overflow-wrap: anywhere; }
.brief-next { background: #f1f7f2; border-radius: 10px; padding: 22px; break-inside: avoid; }
.brief-next h4 { font-size: 17px; margin: 0 0 8px; }
.brief-next p { margin: 0; font-size: 15px; }
.brief-wrap .brief-paper-credit { font-size: 11px; line-height: 1.7; margin: 25px 0 0; padding-top: 18px; border-top: 1px solid var(--line-soft); }
.brief-status { font-size: 14px; color: var(--green-dark); margin: 12px 0; min-height: 1em; }
.brief-feedback { margin: 30px 0; }
.brief-feedback > p { max-width: 680px; margin: 12px 0 20px; }
.brief-feedback-compare { padding: 22px; background: #f7f8f6; border-radius: 10px; }
.brief-feedback-compare .f { margin-top: 24px; }
.brief-privacy { margin-top: 30px; padding-top: 20px; border-top: 1px solid var(--line-soft); }
.brief-privacy > p { font-size: 12px; line-height: 1.7; max-width: 650px; margin: 0; }
.brief-clear-confirm { padding: 18px; background: #fff8f2; border-radius: 10px; }
.brief-clear-confirm p { margin-bottom: 12px; font-size: 14px; }
.brief-clear-confirm button { margin-right: 16px; }
.brief-copy-fallback textarea { min-height: 260px; }
.brief-noscript { margin-top: 24px; padding: 24px; border: 1px solid var(--line-soft); }
.no-js .brief-start { display: none; }
.brief-section [hidden] { display: none !important; }
@media (max-width: 600px) {
  .brief-choice label { display: flex; margin-right: 0; }
  .brief-actions { align-items: flex-start; gap: 8px 18px; }
  .brief-actions .btn { max-width: 100%; white-space: normal; }
  .brief-wrap select { font-size: 16px; }
  .brief-paper { border-radius: 10px; }
}
@media print {
  .brief-print-ready .hdr,
  .brief-print-ready main > section:not(.brief-section),
  .brief-print-ready .cta-band,
  .brief-print-ready .ftr,
  .brief-print-ready .mbar,
  .brief-print-ready .brief-heading,
  .brief-print-ready .brief-intro,
  .brief-print-ready .brief-work,
  .brief-print-ready .brief-privacy,
  .brief-print-ready .brief-result > .eyebrow,
  .brief-print-ready .brief-result > h3,
  .brief-print-ready .brief-result-intro,
  .brief-print-ready .brief-actions,
  .brief-print-ready .brief-status,
  .brief-print-ready .brief-copy-fallback,
  .brief-print-ready .brief-feedback,
  .brief-print-ready .brief-paths { display: none !important; }
  .brief-print-ready .brief-section { padding: 0 !important; background: white !important; }
  .brief-print-ready .brief-wrap { max-width: none; width: 100%; padding: 0; }
  .brief-print-ready .brief-paper { box-shadow: none; border: 0; padding: 0; border-radius: 0; }
  .brief-print-ready .brief-paper dd { font-size: 11pt; }
  .brief-print-ready .brief-paper dl > div { break-inside: avoid; }
}

.brief-paths { margin-top: 38px; }
.brief-paths > h3 { font-size: clamp(26px, 3.8vw, 34px); line-height: 1.25; margin: 10px 0 24px; }
.brief-path-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.brief-path { display: flex; flex-direction: column; padding: 24px; border: 1px solid #cbd7ce; border-radius: 14px; background: #fff; min-width: 0; }
.brief-path h4 { font-size: 20px; line-height: 1.35; margin: 0 0 14px; }
.brief-path > p { font-size: 14px; margin: 0 0 22px; }
.brief-path .btn { margin-top: auto; min-height: 48px; white-space: normal; text-align: center; font-size: 13px; }
.brief-path--session { background: #edf8ef; border-color: #c4deca; }
.brief-path .fine { font-size: 11px; line-height: 1.7; text-align: left; margin: 14px 0 0; }
@media (max-width: 760px) { .brief-path-grid { grid-template-columns: 1fr; } }
