/* Three different sequences, sharing only Featherply's existing color/font tokens.
   Operational workflow: shallow desktop ribbon; unfilled mobile timeline.
   Technical method: editorial columns, then stacked prose.
   Commercial engagement: compact desktop chevrons; compact mobile steps.
   All clipped geometry is decorative and is enabled only at desktop widths. */

/* Operational workflow — the application views carry the visual detail. */
.sp-journey.workflow-ribbon { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;isolation:isolate; }
.workflow-ribbon__stage { --ribbon-surface:#edf2f6;--ribbon-ink:var(--ink);display:flex;flex-direction:column;min-width:0;position:relative; }
.workflow-ribbon__stage:nth-child(2) { --ribbon-surface:#d4dfe7; }
.workflow-ribbon__stage:nth-child(3) { --ribbon-surface:var(--blue); }
.workflow-ribbon__stage:nth-child(4) { --ribbon-surface:#687580;--ribbon-ink:#fff; }
.workflow-ribbon__heading { position:relative;isolation:isolate;display:flex;align-items:center;gap:.55rem;min-height:3.25rem;padding:.65rem .7rem .65rem 1.35rem; }
.workflow-ribbon__stage:first-child .workflow-ribbon__heading { padding-left:.85rem; }
.workflow-ribbon__stage:last-child .workflow-ribbon__heading { padding-right:1.35rem; }
.workflow-ribbon__number { flex-shrink:0;color:var(--ribbon-ink);font:700 1.15rem/1.2 var(--font-display); }
.workflow-ribbon .workflow-ribbon__label { margin:0;color:var(--ribbon-ink);font:400 .78rem/1.4 var(--font-display);letter-spacing:.025em;text-transform:uppercase;overflow-wrap:break-word;min-width:0;flex:1; }
.workflow-ribbon .sp-mini-app { margin:.85rem .6rem 0;min-width:0;flex:1; }
.workflow-ribbon > li:first-child .sp-mini-app { margin-left:0; }
.workflow-ribbon > li:last-child .sp-mini-app { margin-right:0; }
.workflow-ribbon .sp-scene-caption { margin-inline:.6rem;font-size:.78rem;font-weight:400;color:#566a79; }
.workflow-ribbon > li:first-child .sp-scene-caption { margin-left:0; }
.workflow-ribbon .sp-mini-lines div { flex-wrap:wrap;gap:.25rem 1rem; }
.workflow-ribbon .sp-mini-lines dd { margin-left:auto; }

/* Workbook handling — no stage fills or polygon headers at any viewport. */
.editorial-process { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 2rem;list-style:none;padding:0;margin:0 0 1.5rem; }
.editorial-process__stage { min-width:0;border-top:1px solid var(--blue);padding-top:1rem; }
.editorial-process__heading { display:grid;align-content:start;gap:.65rem; }
.editorial-process__number { color:var(--sp-slate);font:700 1.35rem/1.2 var(--font-display); }
.editorial-process .editorial-process__title { margin:0;color:var(--ink);font:700 1.15rem/1.4 var(--font-display);max-width:25ch; }
.editorial-process__content { min-width:0;padding-top:.9rem; }
.editorial-process .editorial-process__content p { font-size:.88rem;line-height:1.8; }
.editorial-process .sp-workbook-map { gap:.4rem; }
.editorial-process .sp-validation { gap:.45rem;flex-wrap:wrap; }
.editorial-process .sp-validation > span { padding:.55rem .65rem; }
.editorial-process .sp-validation svg { width:1.75rem; }

/* Phased engagement — the only substantial chevrons, and desktop only. */
.sp-engagement { margin:1.5rem 0;border-bottom:1px solid var(--line);padding-bottom:1.2rem; }
.sp-engagement figcaption { margin-top:.9rem;font:700 .9rem/1.6 var(--font-prose);color:var(--ink); }
.engagement-flow { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;list-style:none;padding:0;margin:0;isolation:isolate; }
.engagement-flow__stage { --phase-surface:var(--blue);--phase-ink:var(--ink);position:relative;display:grid;grid-template-rows:1fr auto;min-width:0; }
.engagement-flow__stage--primary { --phase-surface:#304551;--phase-ink:var(--text-on-dark); }
.engagement-flow__stage:nth-child(3) { --phase-surface:#e3eaf0; }
.engagement-flow__phase { position:relative;isolation:isolate;display:flex;flex-direction:column;align-items:flex-start;gap:.55rem;padding:1.25rem 1rem 1.25rem 2.4rem;min-height:11rem;color:var(--phase-ink); }
.engagement-flow__stage:first-child .engagement-flow__phase { padding-left:1.25rem; }
.engagement-flow__stage:last-child .engagement-flow__phase { padding-right:2.4rem; }
.engagement-flow__number { font:700 1.6rem/1 var(--font-display);color:var(--dark-line); }
.engagement-flow__stage--primary .engagement-flow__number { color:var(--blue); }
.engagement-flow__label { font:400 .74rem/1.45 var(--font-display);letter-spacing:.035em;text-transform:uppercase;margin-bottom:.65rem;color:var(--phase-ink); }
.engagement-flow__title { font:700 1rem/1.4 var(--font-display);color:var(--phase-ink); }
.engagement-flow__detail { font:.85rem/1.55 var(--font-prose);color:var(--phase-ink); }
.engagement-flow__commitment { display:flex;align-items:center;justify-content:center;gap:.45rem;min-height:1.8rem;padding:.45rem 1rem 0;color:var(--dark-line);font:700 .67rem/1.5 var(--font-display);letter-spacing:.08em;text-transform:uppercase; }
.engagement-flow__commitment::before { content:"";width:0;height:0;border-inline:.3rem solid transparent;border-top:.4rem solid currentColor; }

/* Desktop geometry is separate for the small operational ribbon and phase graphic. */
@media (min-width:62.001rem) {
 .workflow-ribbon__heading::before { content:"";position:absolute;inset:0 -.45rem 0 0;z-index:-1;background:var(--ribbon-surface);clip-path:polygon(0 0,calc(100% - .65rem) 0,100% 50%,calc(100% - .65rem) 100%,0 100%,.65rem 50%); }
 .workflow-ribbon__stage:first-child .workflow-ribbon__heading::before { clip-path:polygon(0 0,calc(100% - .65rem) 0,100% 50%,calc(100% - .65rem) 100%,0 100%); }
 .workflow-ribbon__stage:last-child .workflow-ribbon__heading::before { right:0; }
 .engagement-flow__phase::before { content:"";position:absolute;inset:0 -1.15rem 0 0;z-index:-1;background:var(--phase-surface);clip-path:polygon(0 0,calc(100% - 1.4rem) 0,100% 50%,calc(100% - 1.4rem) 100%,0 100%,1.4rem 50%); }
 .engagement-flow__stage:first-child .engagement-flow__phase::before { clip-path:polygon(0 0,calc(100% - 1.4rem) 0,100% 50%,calc(100% - 1.4rem) 100%,0 100%); }
 .engagement-flow__stage:last-child .engagement-flow__phase::before { right:0; }
 @supports (grid-template-rows:subgrid) {
  .workflow-ribbon > .workflow-ribbon__stage { display:grid;grid-template-rows:subgrid;grid-row:span 3; }
  .editorial-process > .editorial-process__stage { display:grid;grid-template-rows:subgrid;grid-row:span 2; }
 }
}
@media (max-width:62rem) {
 /* A timeline without colored banners. The rule and squares carry continuation. */
 .sp-journey.workflow-ribbon { grid-template-columns:minmax(0,1fr); }
 .workflow-ribbon > .workflow-ribbon__stage { border-left:1px solid var(--blue-deep);padding:0 0 2rem 1.25rem; }
 .workflow-ribbon > .workflow-ribbon__stage:last-child { padding-bottom:0; }
 .workflow-ribbon__stage::before { content:"";position:absolute;left:-.25rem;top:.4rem;width:.45rem;height:.45rem;background:#fff;border:1px solid var(--sp-slate); }
 .workflow-ribbon .workflow-ribbon__heading,
 .workflow-ribbon__stage:first-child .workflow-ribbon__heading,
 .workflow-ribbon__stage:last-child .workflow-ribbon__heading { padding:0;min-height:0;gap:.65rem;align-items:baseline; }
 .workflow-ribbon .workflow-ribbon__number { color:var(--sp-slate); }
 .workflow-ribbon .workflow-ribbon__label { color:var(--ink);font-size:.85rem; }
 .workflow-ribbon .sp-mini-app,
 .workflow-ribbon > li:first-child .sp-mini-app,
 .workflow-ribbon > li:last-child .sp-mini-app { margin:.8rem 0 0; }
 .workflow-ribbon .sp-scene-caption { margin-inline:0;min-height:0; }
 /* Full-width technical prose with quiet rules between stages. */
 .editorial-process { grid-template-columns:minmax(0,1fr);gap:1.75rem; }
 .editorial-process__heading { grid-template-columns:minmax(1.8rem,max-content) minmax(0,1fr);gap:.6rem;align-items:baseline; }
 .editorial-process .editorial-process__title { max-width:none; }
 .editorial-process .editorial-process__content p { font-size:.94rem; }
 /* Compact commitment sequence: no fills, polygons, or fixed minimum height. */
 .engagement-flow { grid-template-columns:minmax(0,1fr); }
 .engagement-flow > .engagement-flow__stage { display:block;border-left:1px solid var(--blue-deep);padding:0 0 1.5rem 1.1rem; }
 .engagement-flow > .engagement-flow__stage:last-child { padding-bottom:0; }
 .engagement-flow__stage::before { content:"";position:absolute;left:-.2rem;top:.4rem;width:.35rem;height:.35rem;background:var(--sp-slate); }
 .engagement-flow .engagement-flow__phase,
 .engagement-flow__stage:first-child .engagement-flow__phase,
 .engagement-flow__stage:last-child .engagement-flow__phase { display:grid;grid-template-columns:minmax(1.7rem,max-content) minmax(0,1fr);gap:.3rem .65rem;padding:0;min-height:0;color:var(--ink); }
 .engagement-flow .engagement-flow__number { grid-column:1;grid-row:1/span 3;font-size:1.15rem;line-height:1.2;color:var(--sp-slate); }
 .engagement-flow .engagement-flow__label,
 .engagement-flow .engagement-flow__title,
 .engagement-flow .engagement-flow__detail { grid-column:2;margin:0;color:var(--ink); }
 .engagement-flow .engagement-flow__label { font-size:.76rem; }
 .engagement-flow .engagement-flow__commitment { min-height:0;justify-content:flex-start;margin:.6rem 0 0 2.35rem;padding:0; }
}
@media (forced-colors:active) {
 .workflow-ribbon__heading,.engagement-flow__phase { outline:1px solid CanvasText;outline-offset:-1px; }
 .workflow-ribbon__stage,.workflow-ribbon__stage:nth-child(4) { --ribbon-ink:CanvasText; }
 .engagement-flow__stage { --phase-ink:CanvasText; }
 .workflow-ribbon__heading::before,.engagement-flow__phase::before { background:Canvas; }
}

/* Detailed workflow software views. The surrounding editorial treatment stays Featherply. */
.spreadsheet-page .sp-record-thread { display:flex;align-items:center;gap:1rem;margin:0 0 1.35rem;padding-block:.35rem;font:700 .76rem/1.6 var(--font-display);color:var(--sp-slate);text-align:center; }
.sp-record-thread::before,.sp-record-thread::after { content:'';height:1px;flex:1;background:var(--line); }
.sp-record-thread > span { max-width:100%; }
.workflow-ribbon .sp-mini-app { display:flex;flex-direction:column;box-shadow:none;border-color:#cad5de; }
.workflow-ribbon .sp-app-bar { justify-content:flex-start;gap:.55rem;background:#fafcfd;border-bottom:1px solid #e1e8ee;color:#5c6e7c;font:.78rem/1.5 var(--font-prose);padding:.8rem 1rem; }
.workflow-ribbon .sp-app-bar > span { color:#5c6e7c;border-left:1px solid #cad5de;padding-left:.55rem; }
.workflow-ribbon .sp-mini-body { display:flex;flex-direction:column;flex:1;padding:1rem; }
.workflow-ribbon .sp-record-summary { display:flex;justify-content:space-between;flex-wrap:wrap;gap:.25rem .5rem;margin:0 0 1rem;color:#425d73;font:.76rem/1.5 var(--font-prose);min-height:1.5em; }
.workflow-ribbon .sp-record-summary strong { font-weight:500; }
.workflow-ribbon .sp-view-status { margin:0 0 .9rem;padding:.75rem .7rem;min-height:3rem;background:#f0f4f7;color:#203c54;border-radius:2px;font:600 1.3rem/1.3 var(--font-prose);letter-spacing:-.035em; }
.workflow-ribbon__stage:nth-child(4) .sp-view-status { background:#eaf1f7; }
.workflow-ribbon .sp-view-status--pending { background:#fcf4df;color:#365366; }
.workflow-ribbon .sp-view-status--approved { background:#e5f3ee;color:#22564e; }
.workflow-ribbon .sp-view-status--task { background:#e5eff8;color:#275b85; }
.sp-view-calculation { width:100%;border-collapse:collapse;font:.78rem/1.55 var(--font-prose);color:#526a7d; }
.sp-view-calculation th,.sp-view-calculation td { padding:.65rem .1rem;border-bottom:1px solid #e0e7ed;text-align:left;font-weight:400; }
.sp-view-calculation td:last-child { text-align:right; }
.sp-view-calculation tr:last-child th,.sp-view-calculation tr:last-child td { color:#203c54;font-weight:650;padding-block:.85rem; }
.workflow-ribbon .sp-view-detail { margin:.8rem 0 0;font-size:.74rem;color:#526a7d; }
.sp-view-facts { margin:0 0 .75rem;font:.77rem/1.6 var(--font-prose);color:#526a7d; }
.sp-view-facts > div { display:flex;flex-wrap:wrap;justify-content:space-between;gap:.2rem .6rem;padding:.65rem 0;border-bottom:1px solid #e0e7ed; }
.sp-view-facts dt { min-width:0; }
.sp-view-facts dd { margin:0 0 0 auto;text-align:right; }
.sp-view-fact-strong { font-weight:650;color:#203c54; }
.workflow-ribbon .sp-view-task { font:650 .94rem/1.5 var(--font-prose);color:#203c54;margin:0;padding:0 0 .8rem;border-bottom:1px solid #e0e7ed; }
.workflow-ribbon .sp-mini-note { margin: auto 0 0;padding-top:1.25rem;border:0;font-size:.73rem;line-height:1.55;color:#526a7d; }
.sp-view-report { margin:0;font:.8rem/1.6 var(--font-prose);color:#425d73; }
.sp-view-report > div { display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.3rem .4rem;padding:.2rem 0 1.1rem; }
.sp-view-report dt span { display:block;font-size:.68rem;color:#526a7d; }
.sp-view-report dd { margin:0;color:#203c54;font-weight:650; }
.sp-view-report > div::after { content:'';grid-column:1/-1;display:block;height:.65rem;border-radius:2px;background:#eef3f7;box-shadow:inset 0 0 0 1px #e8eef3; }
.sp-view-report > div::before { content:'';grid-column:1/-1;grid-row:2;align-self:center;display:block;height:.65rem;width:66.1376%;background:#6d9e96;border-radius:2px;z-index:1; }
.sp-view-report > div:nth-child(2)::before { width:33.8624%;background:#bfccd9; }
.sp-view-report > div::after { grid-row:2; }
.workflow-ribbon .sp-report-total { color:#203c54;border-block:1px solid #e0e7ed;padding:.8rem 0;margin:0 0 1rem;font-size:.88rem; }
@media(max-width:62rem) {
 .workflow-ribbon .sp-mini-body { padding:1rem; }
 .workflow-ribbon .sp-record-summary { font-size:.85rem; }
 .workflow-ribbon .sp-view-status { font-size:1.4rem; }
 .sp-view-facts,.sp-view-calculation,.sp-view-report { font-size:.85rem; }
 .workflow-ribbon .sp-mini-note { margin-top:.5rem;font-size:.8rem; }
}
@media(forced-colors:active) {
 .workflow-ribbon .sp-view-status { border:1px solid CanvasText; }
 .sp-view-report > div::before { background:CanvasText; }
 .sp-view-report > div::after { border:1px solid CanvasText; }
}

/* Discovery establishes scope; each subsequent phase is the client's decision. */
.sp-phase-intro { border-top:1px solid var(--line);padding-top:1.25rem;margin-top:1.5rem; }
.spreadsheet-page .sp-phase-intro h3 { font:700 clamp(1.3rem,2vw,1.7rem)/1.3 var(--font-display);margin:0 0 .65rem; }
.spreadsheet-page .sp-phase-intro p { margin:0;font-size:.94rem; }
.sp-engagement { margin:1.5rem 0 1rem; }
.sp-engagement figcaption { margin-top:1.3rem;font:700 .9rem/1.6 var(--font-display);color:#344b5b; }
.engagement-flow__stage--primary .engagement-flow__number { color:#e3ebf1; }
.spreadsheet-page .sp-phase-reassurance { font-size:.8rem;line-height:1.7;margin:0 0 1rem; }
@media(max-width:62rem) {
 .engagement-flow .engagement-flow__number { color:var(--sp-slate); }
}

/* Supporting reassurance and scope stay below the process in visual priority. */
.spreadsheet-page .sp-phase-reassurance,.spreadsheet-page .sp-stay { color:#526674; }
.sp-phase-reassurance strong,.sp-stay strong { font-weight:500; }
.sp-phase-reassurance a { color:inherit; }
.spreadsheet-page .sp-breadth p,.sp-breadth ul { font-size:.74rem;font-weight:400;color:#5d6f7c; }

/* Workbook method: readable explanations, concrete diagrams, quiet detail. */
.editorial-process .editorial-process__title { max-width:none; }
.editorial-process__number { font-size:1.6rem; }
.editorial-process .method-lead { margin:0;color:#526674;font-size:.94rem;line-height:1.7; }
.editorial-process__content { display:grid;gap:1.25rem;align-content:start; }
.method-artifact { min-width:0;color:#405b70;align-self:center; }
.editorial-process .sp-method-detail { margin:0;font-size:.78rem;line-height:1.75;color:#526674; }
.editorial-process .method-takeaway { margin:0;border-top:1px solid var(--blue);padding-top:1rem;font-size:.8rem;line-height:1.65;color:#526674; }
.workbook-map { position:relative;display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.55fr);gap:2.1rem;align-items:center; }
.workbook-map__source,.workbook-map__destinations li { background:#fff;border:1px solid var(--blue);padding:.65rem .7rem;font-size:.8rem; }
.workbook-map__source { position:relative;color:var(--ink);text-align:center;padding:1.15rem .5rem; }
.workbook-map::before { content:'';position:absolute;width:1.05rem;height:1px;background:var(--blue-deep);left:calc((100% - 2.1rem) * .85 / 2.4);top:50%; }
.workbook-map__destinations { list-style:none;padding:0;margin:0;display:grid;gap:.3rem; }
.workbook-map__destinations li { position:relative; }
.workbook-map__destinations li::before { content:'';position:absolute;right:100%;top:50%;width:1.05rem;border-top:1px solid var(--blue-deep); }
.workbook-map__destinations li::after { content:'';position:absolute;left:-1.05rem;top:calc(-.3rem - 1px);height:calc(100% + .3rem + 2px);border-left:1px solid var(--blue-deep); }
.workbook-map__destinations li:first-child::after { top:50%;height:calc(50% + .3rem + 1px); }
.workbook-map__destinations li:last-child::after { height:calc(50% + .3rem + 1px); }
.method-comparison { display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:.6rem;align-items:center; }
.method-comparison > span:not(.method-arrow) { padding:.8rem .65rem;background:#fff;border:1px solid var(--blue);font-size:.78rem; }
.method-comparison strong { display:block;font:700 1.65rem/1.4 var(--font-display);color:var(--ink); }
.method-arrow { font-size:1.5rem; }
.method-checks ul { list-style:none;padding:0;margin:1rem 0 0;border-top:1px solid var(--line); }
.method-checks li { padding:.45rem .65rem;border-bottom:1px solid var(--line);font-size:.8rem; }
.editorial-process .method-checks .sp-caption { margin:.35rem 0 0;font-size:.7rem;line-height:1.6; }
.method-cutover ol { list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.85rem; }
.method-cutover li { position:relative;background:#fff;border:1px solid var(--blue);padding:.8rem .25rem;min-height:5.5rem;display:flex;align-items:center;justify-content:center;text-align:center;font-size:.78rem; }
.method-cutover li + li::before { content:'';position:absolute;right:calc(100% + .225rem);width:.5rem;height:.5rem;border-top:1px solid var(--blue-deep);border-right:1px solid var(--blue-deep);transform:rotate(45deg); }
@media(min-width:62.001rem) {
 @supports(grid-template-rows:subgrid) {
  .editorial-process > .editorial-process__stage { grid-row:span 5;grid-template-rows:subgrid; }
  .editorial-process__content { grid-row:span 4;grid-template-rows:subgrid; }
 }
}
@media(max-width:62rem) {
 .editorial-process__content { padding-top:1rem; }
 .method-artifact { width:100%;max-width:32rem; }
 .method-cutover ol { grid-template-columns:minmax(0,1fr);gap:1rem; }
 .method-cutover li { min-height:0;padding:.7rem 1rem;justify-content:flex-start;font-size:.8rem; }
 .method-cutover li + li::before { right:auto;left:1rem;top:-.8rem;transform:rotate(135deg); }
}
