/* Chapter 09 overview only; the Core Journey subsection retains its existing presentation. */
#core-business-flow.business-flow-reference { padding-block: 0; }
.flow-reference-overview { position: relative; isolation: isolate; overflow: hidden; color: #0a142b; background: radial-gradient(ellipse at 78% 18%, #eaf5ff, transparent 65%), linear-gradient(120deg, #f8fbff, #f0f7ff 65%, #f7fbff); }
.flow-reference-overview .flow-atmosphere { position: absolute; z-index: -1; width: 100%; height: 100%; inset: 0; pointer-events: none; }
.flow-reference-overview .flow-reference-shell { width: 100%; max-width: 2000px; margin-inline: auto; padding: clamp(34px, 2.4vw, 48px) clamp(32px, 5vw, 100px) 24px; }
.flow-reference-overview .flow-reference-header { position: relative; }
.flow-reference-overview .section-label { margin-bottom: 18px; color: #526eaa; font-size: 13px; letter-spacing: .1em; }
.flow-reference-overview h2 { max-width: none; width: 83%; font-size: clamp(36px, 3.25vw, 65px); line-height: 1.33; font-weight: 700; letter-spacing: -.025em; text-wrap: initial; }
.flow-reference-overview .flow-reference-intro { max-width: 1120px; margin-top: 17px; color: #59729d; font-size: clamp(16px, 1.13vw, 21px); line-height: 1.7; }
.flow-reference-overview .flow-reference-note { position: absolute; top: 6px; right: 0; text-align: right; color: #5273b4; font-size: 13px; line-height: 1.85; letter-spacing: .15em; }
.flow-reference-overview .flow-reference-note span { display: block; width: 32px; height: 1px; margin: 17px 0 0 auto; background: #526da6; }
.flow-reference-overview .flow-reference-note i { display: block; margin: 44px -12px 0 0; color: #85a9e8; font-family: 'Segoe Print', 'Comic Sans MS', cursive; font-size: 22px; line-height: 1.2; letter-spacing: 0; transform: rotate(-12deg); }
.flow-reference-overview .flow-reference-stages { --flow-gap: clamp(20px, 2.2vw, 44px); display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: var(--flow-gap); margin-top: 32px; }
.flow-reference-overview .flow-reference-stage { position: relative; isolation: isolate; min-width: 0; padding: 0 17px 19px; }
.flow-reference-overview .flow-reference-stage::before { content: ''; position: absolute; z-index: -1; top: 96px; left: -10px; right: -10px; bottom: 0; border: 1px solid #ffffffeb; border-radius: 20px; background: linear-gradient(135deg, #ffffffa6, #ffffff40); }
.flow-reference-overview .flow-stage-label { min-height: 46px; }
.flow-reference-overview .flow-stage-label > span { display: block; color: #2c67eb; font-size: 16px; line-height: 1.4; font-weight: 500; }
.flow-reference-overview .flow-stage-label p { color: #536fa6; font-size: 12px; line-height: 1.6; letter-spacing: .03em; }
.flow-reference-overview .flow-stage-icon { position: relative; z-index: 1; display: grid; place-items: center; width: 76px; height: 76px; margin-top: 2px; border: 1px solid #fff; border-radius: 50%; color: #3073ff; background: linear-gradient(130deg, #fbfdff, #edf6ff); box-shadow: 0 0 0 1px #d4e5ff, 0 8px 16px #aecdfa29; }
.flow-reference-overview .flow-stage-icon svg { width: 36px; height: 36px; }
.flow-reference-overview .flow-stage-arrow { position: absolute; top: 86px; left: 111px; width: calc(100% - 102px + var(--flow-gap)); height: 1px; background: #8ab0ff; }
.flow-reference-overview .flow-stage-arrow::after { content: ''; position: absolute; right: 0; top: -4px; width: 7px; height: 7px; border-top: 2px solid #3273ff; border-right: 2px solid #3273ff; transform: rotate(45deg); }
.flow-reference-overview .flow-reference-stage h3 { position: relative; margin-top: 19px; font-size: clamp(16px, 1.08vw, 21px); font-weight: 500; line-height: 1.6; text-wrap: initial; }
.flow-reference-overview .flow-stage-terms { margin-top: 10px; color: #5b73a1; font-size: clamp(14px, .95vw, 18px); line-height: 1.45; }
.flow-reference-overview .flow-review-gate::before { top: -14px; border-color: #6697ff; background: linear-gradient(135deg, #ffffff55, #dbebffb0); box-shadow: inset 0 0 0 3px #ffffff70, 0 10px 25px #b6d6fc30; }
.flow-reference-overview .flow-review-gate .flow-stage-label > span { color: #2462e2; font-size: 23px; line-height: 1.12; }
.flow-reference-overview .flow-gate-label { margin-top: 8px; padding-top: 7px; border-top: 1px solid #c0d5f7; color: #496eae; font-size: 10px; letter-spacing: .05em; line-height: 1.5; }
.flow-reference-overview .flow-business-objects { display: flex; align-items: center; gap: 28px; margin-top: 25px; padding-block: 19px; border-top: 1px solid #cfdef1; border-bottom: 1px solid #cfdef1; }
.flow-reference-overview .flow-business-objects h3 { flex: 0 0 auto; color: #234d9a; font-size: 12px; letter-spacing: .045em; line-height: 1.6; }
.flow-reference-overview .flow-business-objects ol { display: flex; flex: 1; align-items: center; gap: 32px; min-width: 0; }
.flow-reference-overview .flow-business-objects li { position: relative; flex: 1 1 auto; min-width: 0; padding: 8px 13px; border: 1px solid #aecbfd; border-radius: 999px; color: #284e8d; background: #f8fbff99; box-shadow: inset 0 0 0 2px #fff; font-size: 12px; line-height: 1.55; text-align: center; white-space: nowrap; }
.flow-reference-overview .flow-business-objects li:not(:last-child)::after { content: '→'; position: absolute; right: -26px; top: 50%; transform: translateY(-50%); color: #3b78f8; font-size: 20px; }
.flow-reference-overview .flow-reference-outcomes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; padding-block: 24px; border-bottom: 1px solid #cfdef1; }
.flow-reference-overview .flow-reference-outcomes li { display: flex; align-items: start; gap: 20px; min-width: 0; }
.flow-reference-overview .flow-reference-outcomes li + li { border-left: 1px solid #cadbf2; padding-left: 32px; }
.flow-reference-overview .flow-outcome-icon { flex: 0 0 auto; display: grid; place-items: center; width: 62px; height: 62px; color: #3d7cf8; border: 1px solid #fff; border-radius: 15px; background: #e5f0ff; }
.flow-reference-overview .flow-outcome-icon svg { width: 27px; height: 27px; }
.flow-reference-overview .flow-reference-outcomes li > div { min-width: 0; }
.flow-reference-overview .flow-reference-outcomes p:first-child { color: #5574ac; font-size: 10px; line-height: 1.6; letter-spacing: .05em; }
.flow-reference-overview .flow-reference-outcomes h3 { margin-top: 3px; font-size: 17px; font-weight: 500; line-height: 1.5; }
.flow-reference-overview .flow-reference-outcomes p:last-child { margin-top: 6px; color: #59729d; font-size: 13px; line-height: 1.6; }
.flow-reference-overview .flow-reference-conclusion { margin-top: 16px; text-align: center; color: #20395e; font-size: 16px; line-height: 1.7; }
@media (max-width: 1500px) {
 .flow-reference-overview .flow-reference-stage { padding-inline: 9px; }
 .flow-reference-overview .flow-stage-arrow { left: 101px; width: calc(100% - 96px + var(--flow-gap)); }
 .flow-reference-overview .flow-business-objects { gap: 20px; }
 .flow-reference-overview .flow-business-objects ol { gap: 24px; }
 .flow-reference-overview .flow-business-objects li { font-size: 11px; padding-inline: 8px; }
 .flow-reference-overview .flow-business-objects li:not(:last-child)::after { right: -21px; }
 .flow-reference-overview .flow-reference-outcomes { gap: 20px; }
 .flow-reference-overview .flow-reference-outcomes li + li { padding-left: 20px; }
 .flow-reference-overview .flow-reference-outcomes li { gap: 13px; }
}
@media (max-width: 1150px) {
 .flow-reference-overview .flow-reference-shell { padding: 38px 32px 30px; }
 .flow-reference-overview h2 { width: 100%; font-size: clamp(34px, 4.2vw, 48px); }
 .flow-reference-overview .flow-reference-note { display: none; }
 .flow-reference-overview .flow-desktop-break { display: none; }
 .flow-reference-overview .flow-reference-stages { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 36px; margin-top: 34px; }
 .flow-reference-overview .flow-reference-stage { padding-inline: 18px; }
 .flow-reference-overview .flow-reference-stage h3 { font-size: 19px; }
 .flow-reference-overview .flow-stage-terms { font-size: 16px; }
 .flow-reference-overview .flow-stage-arrow { left: 110px; width: calc(100% - 104px + 36px); }
 .flow-reference-overview .flow-reference-stage:nth-child(3) .flow-stage-arrow { display: none; }
 .flow-reference-overview .flow-business-objects { display: block; }
 .flow-reference-overview .flow-business-objects ol { flex-wrap: wrap; justify-content: start; gap: 14px 30px; margin-top: 16px; }
 .flow-reference-overview .flow-business-objects li { flex: 0 1 auto; font-size: 12px; padding-inline: 16px; }
 .flow-reference-overview .flow-business-objects li:not(:last-child)::after { right: -25px; }
 .flow-reference-overview .flow-reference-outcomes { gap: 16px; }
 .flow-reference-overview .flow-reference-outcomes li { display: block; }
 .flow-reference-overview .flow-outcome-icon { width: 52px; height: 52px; margin-bottom: 14px; }
}
@media (max-width: 700px) {
 .flow-reference-overview .flow-reference-shell { padding: 30px 20px 26px; }
 .flow-reference-overview h2 { font-size: clamp(28px, 7.4vw, 40px); line-height: 1.45; }
 .flow-reference-overview .section-label { font-size: 11px; }
 .flow-reference-overview .flow-reference-intro { font-size: 15px; line-height: 1.85; }
 .flow-reference-overview .flow-reference-stages { grid-template-columns: 1fr; gap: 38px; margin-top: 34px; }
 .flow-reference-overview .flow-reference-stage { display: grid; grid-template-columns: 62px minmax(0, 1fr); column-gap: 18px; padding: 19px 18px; }
 .flow-reference-overview .flow-reference-stage::before { inset: 0; border-radius: 16px; }
 .flow-reference-overview .flow-stage-label { grid-column: 1; grid-row: 1; min-height: 0; }
 .flow-reference-overview .flow-stage-label > span { font-size: 18px; }
 .flow-reference-overview .flow-stage-label p { font-size: 10px; }
 .flow-reference-overview .flow-stage-icon { grid-column: 1; grid-row: 2; width: 55px; height: 55px; margin-top: 14px; }
 .flow-reference-overview .flow-stage-icon svg { width: 28px; height: 28px; }
 .flow-reference-overview .flow-reference-stage h3 { grid-column: 2; grid-row: 1; margin: 0; font-size: 18px; }
 .flow-reference-overview .flow-stage-terms { grid-column: 2; grid-row: 2; margin-top: 10px; font-size: 15px; }
 .flow-reference-overview .flow-gate-label { grid-column: 2; font-size: 9px; }
 .flow-reference-overview .flow-stage-arrow, .flow-reference-overview .flow-reference-stage:nth-child(3) .flow-stage-arrow { display: block; top: auto; bottom: -28px; left: 45px; width: 1px; height: 18px; }
 .flow-reference-overview .flow-stage-arrow::after { top: auto; bottom: 0; right: -3px; transform: rotate(135deg); }
 .flow-reference-overview .flow-business-objects { margin-top: 30px; }
 .flow-reference-overview .flow-business-objects ol { display: grid; grid-template-columns: minmax(0, 1fr); gap: 26px; margin-top: 18px; }
 .flow-reference-overview .flow-business-objects li { justify-self: center; min-width: 70%; font-size: 13px; }
 .flow-reference-overview .flow-business-objects li:not(:last-child)::after { content: '↓'; right: auto; left: 50%; top: auto; bottom: -27px; transform: translateX(-50%); }
 .flow-reference-overview .flow-reference-outcomes { grid-template-columns: 1fr; gap: 20px; }
 .flow-reference-overview .flow-reference-outcomes li { display: flex; gap: 16px; }
 .flow-reference-overview .flow-reference-outcomes li + li { border-left: 0; padding-left: 0; }
 .flow-reference-overview .flow-outcome-icon { width: 52px; height: 58px; margin: 0; }
 .flow-reference-overview .flow-reference-outcomes p:last-child { font-size: 14px; }
 .flow-reference-overview .flow-reference-conclusion { font-size: 15px; text-align: left; line-height: 1.8; }
 .flow-reference-overview .flow-atmosphere { opacity: .5; }
}
