/* One editorial layout shared by the capability and design-response explorers. */
.material-page .mf-editorial-explorer{display:grid;grid-template-columns:minmax(180px,24fr) minmax(0,76fr);gap:24px;align-items:start}
.material-page .mf-editorial-explorer>:is(.mf-capability-nav,.mf-build-nav){grid-column:1;grid-row:1;display:grid;grid-template-columns:1fr;gap:8px;margin:0}
.material-page .mf-editorial-explorer>:is(.mf-capability-detail,.mf-build-panel){grid-column:2;grid-row:1;min-width:0}

.material-page .mf-editorial-explorer>:is(.mf-capability-nav,.mf-build-nav) button{border:1px solid transparent;min-height:86px;padding:16px 24px;text-transform:none;background:transparent}
.material-page .mf-editorial-explorer>:is(.mf-capability-nav,.mf-build-nav) button[aria-selected=true]{border-color:var(--border-subtle);background:color-mix(in srgb,var(--color-peacock) 6%,var(--surface-page))}
.material-page .mf-editorial-explorer>.mf-build-panel{display:grid;grid-template-columns:minmax(0,60fr) minmax(0,40fr);gap:16px 24px;align-items:start;grid-template-rows:auto 1fr}




.material-page .mf-editorial-explorer .mf-build-main{display:contents}
.material-page .mf-editorial-explorer .mf-build-story{grid-column:2;grid-row:1}
.material-page .mf-editorial-explorer .mf-build-main>:not(.mf-build-story){grid-column:1;min-width:0;margin-top:0}
.material-page .mf-editorial-explorer .mf-build-main>:nth-child(2){grid-row:1/4}
.material-page .mf-editorial-explorer .mf-build-decision{grid-column:2;grid-row:2/5;border:0;padding:0}

.material-page .mf-editorial-explorer :is(.mf-capability-story header p,.mf-capability-reasons li){font-size:15px;line-height:1.55}
@media(max-width:1100px){
 .material-page .mf-editorial-explorer>.mf-build-panel{grid-template-columns:1fr}
 .material-page .mf-editorial-explorer :is(.mf-capability-media,.mf-capability-story,.mf-capability-reasons,.mf-build-story,.mf-build-decision),.material-page .mf-editorial-explorer .mf-build-main>:nth-child(n){grid-column:1;grid-row:auto}
 .material-page .mf-editorial-explorer .mf-build-main>:nth-child(2){grid-row:1}
}
@media(max-width:700px){
 .material-page .mf-editorial-explorer{grid-template-columns:1fr}
 .material-page .mf-editorial-explorer>:is(.mf-capability-nav,.mf-build-nav){grid-column:1;grid-row:1;grid-template-columns:1fr 1fr}
 .material-page .mf-editorial-explorer>:is(.mf-capability-detail,.mf-build-panel){grid-column:1;grid-row:2}
 
 .material-page .mf-editorial-explorer>:is(.mf-capability-nav,.mf-build-nav) button{padding:12px;min-height:88px}
}

.material-page .mf-editorial-explorer button :is(strong,span,small){text-transform:none;letter-spacing:normal}

/* The capability selector owns its state control and EAM context. */












.material-page .mf-intro-backlog{display:block}
.material-page .mf-intro-backlog .mf-backlog-number{display:block;border:0;padding:0}
.material-page .mf-intro-backlog .mf-backlog-number>strong{font:800 38px/1.1 var(--font-display);display:block}
.material-page .mf-intro-backlog p{margin-top:20px;font-size:14px;line-height:1.5}


.material-page .mf-intro-backlog{border-top:0;border-right:0;border-bottom:0;background:transparent;padding-block:0}

/* Reference composition: wide introduction, sidebar aligned to the explanation. */
.material-page #mf-opportunity .mf-opportunity-intro{grid-template-columns:minmax(0,62fr) minmax(0,38fr);align-items:stretch;margin-bottom:24px}
.material-page #mf-opportunity .mf-intro-backlog{border-left:1px solid var(--border-subtle);padding:12px 0 0 28px;margin:0;align-self:stretch}
.material-page #mf-opportunity .mf-intro-backlog p{font-size:15px;line-height:1.5;color:var(--text-secondary)}
.material-page #mf-opportunity .mf-intro-backlog .mf-backlog-number>span{display:block;font-size:12px;margin-top:4px}
.material-page #mf-opportunity .mf-editorial-explorer{column-gap:16px}



.material-page #mf-opportunity .mf-capability-nav-text strong{font-size:20px;line-height:1.25}
.material-page #mf-opportunity .mf-capability-nav-text small{font-size:14px;line-height:1.5}








.material-page #mf-opportunity .mf-capability-view--before :is(.mf-capability-media,.mf-state-art){background:transparent;border:0}
@media(max-width:1100px){.material-page #mf-opportunity .mf-opportunity-intro{grid-template-columns:1fr}.material-page #mf-opportunity .mf-intro-backlog{border-left:0;border-top:1px solid var(--border-subtle);padding:20px 0 0}.material-page #mf-opportunity .mf-capability-nav-text strong{font-size:17px}}
@media(max-width:700px){.material-page #mf-opportunity .mf-capability-nav-text strong{font-size:19px}}

/* VP20: Interactive Evidence Module.
   Header: primary introduction + optional backlog callout (above).
   Body: controls rail + full-width evidence canvas.
   Footer: three balanced, state-aware interpretation areas.
   Do not change other Material Flow explorers through these rules. */
.material-page #mf-opportunity .mf-editorial-explorer.t-evidence-module {
  display: grid;
  grid-template-columns: minmax(210px, 25fr) minmax(0, 37fr) minmax(0, 38fr);
  grid-template-rows: auto auto;
  column-gap: clamp(20px, 2vw, 36px);
  row-gap: clamp(26px, 3vw, 44px);
  align-items: stretch;
}
/* The state-aware panel wrappers remain in the DOM and retain JS tab/visibility behavior.
   display:contents exposes only the active state to the common layout grid. */
.material-page #mf-opportunity .mf-capability-panel:not([hidden]), .material-page #mf-opportunity .mf-capability-view:not([hidden]){
  display: contents;
}


/* Three insight blocks occupy one contiguous footer row, each with content-led height. */








/* Responsive sequence retains header → controls → evidence → implications. */
@media (max-width: 1100px) {
  .material-page #mf-opportunity .mf-editorial-explorer.t-evidence-module {
    grid-template-columns: minmax(180px, 32fr) minmax(0, 68fr);
    row-gap: 24px;
  }
  
  
  
  
}
@media (max-width: 700px) {
  .material-page #mf-opportunity .mf-editorial-explorer.t-evidence-module {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 22px;
  }
  
  
  
  
  
}

/* Visual audit: self-balancing evidence footer; original state controls and evidence unaffected */






/* Visual audit: Material Flow conclusion, explicit three-column editorial composition */
.mf-build-explorer.va-mf-conclusion{display:grid;grid-template-columns:minmax(230px,.29fr) minmax(0,.71fr);align-items:start;column-gap:24px}
.mf-build-explorer.va-mf-conclusion>.mf-build-nav{grid-column:1;grid-row:1 / span 3;min-width:0}
.mf-build-explorer.va-mf-conclusion>.mf-build-panel{grid-column:2;grid-row:1;min-width:0}
.mf-build-explorer.va-mf-conclusion>.mf-build-panel[hidden]{display:none!important}
.mf-build-explorer.va-mf-conclusion .va-mf-conclusion-panel:not([hidden]) {display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:24px;align-items:start}
.mf-build-explorer.va-mf-conclusion .mf-build-main,.mf-build-explorer.va-mf-conclusion .mf-build-decision{min-width:0;max-width:none}
.mf-build-explorer.va-mf-conclusion .mf-build-story{margin:0 0 12px}
.mf-build-explorer.va-mf-conclusion .mf-build-decision{margin:0;padding-left:22px;border-left:1px solid #d0dbe1}
@media(max-width:1150px){.mf-build-explorer.va-mf-conclusion .va-mf-conclusion-panel:not([hidden]){grid-template-columns:1fr}.mf-build-explorer.va-mf-conclusion .mf-build-decision{padding:20px 0 0;border-left:0;border-top:1px solid #d0dbe1}}
@media(max-width:760px){.mf-build-explorer.va-mf-conclusion{grid-template-columns:1fr}.mf-build-explorer.va-mf-conclusion>.mf-build-nav,.mf-build-explorer.va-mf-conclusion>.mf-build-panel{grid-column:1;grid-row:auto}}


/* Material Flow, four Before / Future comparisons. Scoped, fluid, editorial. */
#mf-opportunity .mf-pair-explorer{display:grid;grid-template-columns:minmax(216px,23%) minmax(0,1fr);gap:clamp(24px,2.8vw,48px);align-items:start;margin-top:24px;max-width:none;width:100%;}
#mf-opportunity .mf-pair-selector{display:flex;flex-direction:column;gap:4px;position:relative;min-width:0;border-top:1px solid var(--line,#d8dddc);padding-top:8px;}
#mf-opportunity .mf-pair-topic{appearance:none;border:0;border-left:3px solid transparent;background:transparent;display:flex;align-items:center;text-align:left;gap:12px;min-height:58px;width:100%;color:var(--ink,#0c2033);padding:12px 10px;font:inherit;font-size:14px;line-height:1.35;cursor:pointer;transition:background-color .1s ease;}

#mf-opportunity .mf-pair-topic svg{width:19px;height:19px;display:block;}
#mf-opportunity .mf-pair-topic[aria-selected="true"]{border-left-color:#1b7989;background:#e8f1f0;font-weight:700;}
#mf-opportunity .mf-pair-topic:hover{background:#f1f5f4;}
#mf-opportunity .mf-pair-topic:focus-visible{outline:3px solid #08788f;outline-offset:2px;}
#mf-opportunity .mf-pair-comparison{min-width:0;outline:none;}
#mf-opportunity .mf-pair-overview{margin-bottom:16px;}
#mf-opportunity .mf-pair-title{font-size:clamp(22px,2vw,30px);line-height:1.2;letter-spacing:-.025em;margin:0 0 4px;color:#112a3c;font-weight:730;}
#mf-opportunity .mf-pair-description{margin:0;color:#536579;font-size:15px;line-height:1.5;}
#mf-opportunity .mf-pair-columns{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0;}
#mf-opportunity .mf-pair-state{min-width:0;display:flex;flex-direction:column;gap:0;padding:0 22px 0 0;}
#mf-opportunity .mf-pair-state--future{border-left:1px solid #dae0df;padding:0 0 0 22px;}
#mf-opportunity .mf-pair-label{margin:0 0 8px;color:#6d561f;text-transform:uppercase;letter-spacing:.12em;font-size:12px;font-weight:800;}
#mf-opportunity .mf-pair-state h4{margin:0;color:#102a3b;font-size:clamp(16px,1.2vw,19px);line-height:1.35;font-weight:740;}
#mf-opportunity .mf-pair-state-description{margin:8px 0 4px;font-size:14px;line-height:1.5;color:#536579;max-width:57ch;}
#mf-opportunity .mf-pair-art{display:block;position:relative;width:100%;height:auto;min-height:0;padding:0;border:0;background:transparent;color:inherit;margin:8px 0 8px;text-align:right;}
#mf-opportunity .mf-pair-art img{display:block;width:100%;height:auto;max-width:100%;object-fit:contain;object-position:center center;border:0;filter:none;background:transparent;}
#mf-opportunity .mf-pair-takeaway{margin:4px 0 0;font-size:14px;line-height:1.55;color:#364d5f;max-width:57ch;}
@media(max-width:1150px){#mf-opportunity .mf-pair-explorer{grid-template-columns:minmax(190px,28%) minmax(0,1fr);gap:24px;}#mf-opportunity .mf-pair-columns{grid-template-columns:minmax(0,1fr);gap:26px;}#mf-opportunity .mf-pair-state{padding:0;}#mf-opportunity .mf-pair-state--future{border-left:0;border-top:1px solid #dce2e1;padding:22px 0 0;}#mf-opportunity .mf-pair-state h4{min-height:0;}#mf-opportunity .mf-pair-art img{max-width:750px;margin:auto;}}
@media(max-width:760px){#mf-opportunity .mf-pair-explorer{display:block;margin-top:20px;}#mf-opportunity .mf-pair-selector{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin-bottom:24px;padding-top:8px;}#mf-opportunity .mf-pair-topic{min-height:54px;font-size:13px;padding:9px 8px;}#mf-opportunity .mf-pair-overview{margin-bottom:20px;}}

/* Material Flow comparison images use transparent, caption-free artwork.
   Their Before / Future labels, headings, descriptions, and takeaways are live HTML. */
#mf-opportunity .mf-pair-art {margin:18px 0 12px;min-height:0;}
#mf-opportunity .mf-pair-art img {display:block;width:100%;height:auto;object-fit:contain;object-position:top center;max-height:none;}
/* Material Flow / Local customizations & support: source-art + live editorial data. */
.material-page #mf-build-panel-2.mf-build-panel--customization{display:block;min-width:0;}
.material-page #mf-build-panel-2[hidden]{display:none!important;}
.material-page .mf-customization-layout{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:16px 20px;align-items:start;min-width:0;}
.material-page .mf-customization-network{margin:0;min-width:0;display:flex;align-items:center;justify-content:center;align-self:stretch;}
.material-page .mf-customization-network img{display:block;width:100%;height:auto;object-fit:contain;object-position:center;max-width:none;max-height:none;}
.material-page .mf-customization-rules{display:grid;gap:0;min-width:0;}
.material-page .mf-customization-spec{min-width:0;border:0;border-radius:0;padding:0;background:transparent;}
.material-page .mf-customization-spec + .mf-customization-spec{border-top:1px solid #d9dddc;margin-top:16px;padding-top:16px;}
.material-page .mf-customization-spec__heading{display:flex;align-items:center;gap:14px;margin:0 0 13px;}
.material-page .mf-customization-spec__heading>svg{width:37px;height:37px;flex:0 0 37px;stroke:#0b2035;stroke-width:2.25;stroke-linejoin:round;stroke-linecap:round;fill:none;}
.material-page .mf-customization-spec__heading h3{font:750 clamp(18px,1.25vw,23px)/1.16 var(--font-display);letter-spacing:-.03em;margin:0 0 3px;color:var(--text-primary);}
.material-page .mf-customization-spec__heading p{font:400 13px/1.4 var(--font-body);margin:0;color:var(--text-secondary);}
.material-page .mf-customization-table{width:100%;border-collapse:collapse;table-layout:fixed;font-family:var(--font-body);background:transparent;}
.material-page .mf-customization-table th,.material-page .mf-customization-table td{border:1px solid #dce0e0;padding:9px 11px;text-align:left;vertical-align:middle;}
.material-page .mf-customization-table thead th{text-transform:uppercase;font:750 11px/1.25 var(--font-body);letter-spacing:.045em;color:#0b2035;background:rgba(18,48,69,.018);}
.material-page .mf-customization-table thead th:first-child{width:40%;}
.material-page .mf-customization-table tbody th{font:700 13px/1.3 var(--font-body);color:var(--text-primary);}
.material-page .mf-customization-table tbody td{font:400 12px/1.42 var(--font-body);color:var(--text-secondary);}
.material-page .mf-customization-element{display:flex;align-items:center;gap:8px;}
.material-page .mf-customization-element svg{width:21px;height:21px;flex:0 0 21px;fill:none;stroke:#0b2035;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;}
.material-page .mf-customization-bottom{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;min-width:0;align-items:stretch;border:0;border-radius:0;overflow:visible;}
.material-page .mf-customization-thesis,.material-page .mf-customization-result{border:0;border-radius:0;min-width:0;padding:0;}
.material-page .mf-customization-thesis{padding-right:20px;}
.material-page .mf-customization-result{border-left:1px solid #d9dddc;padding-left:20px;}
.material-page .mf-customization-thesis,.material-page .mf-customization-result{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:10px;}
.material-page .mf-customization-thesis h3{margin:0;font:750 clamp(20px,1.5vw,28px)/1.12 var(--font-display);letter-spacing:-.03em;color:var(--text-primary);}
.material-page .mf-customization-thesis h3 em{font-style:normal;color:var(--color-gold-ink,#9a711c);}
.material-page .mf-customization-thesis p{margin:0;font:400 13px/1.5 var(--font-body);color:var(--text-secondary);}



.material-page .mf-customization-result h3{margin:0;font:750 clamp(20px,1.5vw,28px)/1.12 var(--font-display);color:var(--text-primary);letter-spacing:-.03em;}
.material-page .mf-customization-result p{margin:0;font:400 13px/1.5 var(--font-body);color:var(--text-secondary);}
@media(max-width:1550px){
  .material-page .mf-customization-layout{grid-template-columns:minmax(0,1fr);}
  .material-page .mf-customization-network{max-width:960px;margin:0 auto;}
  .material-page .mf-customization-rules{grid-template-columns:repeat(2,minmax(0,1fr));}
  .material-page .mf-customization-spec:first-child{padding-right:18px;}
  .material-page .mf-customization-spec + .mf-customization-spec{border-top:0;border-left:1px solid #d9dddc;margin-top:0;padding-top:0;padding-left:18px;}
}
@media(max-width:900px){
  .material-page .mf-customization-rules{grid-template-columns:minmax(0,1fr);}
  .material-page .mf-customization-spec:first-child{padding-right:0;}
  .material-page .mf-customization-spec + .mf-customization-spec{border-left:0;border-top:1px solid #d9dddc;margin-top:16px;padding-top:16px;padding-left:0;}
  .material-page .mf-customization-bottom{grid-template-columns:minmax(0,1fr);}
  .material-page .mf-customization-thesis{padding-right:0;}
  .material-page .mf-customization-result{border-left:0;border-top:1px solid #d9dddc;margin-top:16px;padding:16px 0 0;}

}
@media(max-width:600px){
  .material-page .mf-customization-layout{gap:18px;}
  .material-page .mf-customization-rules{gap:0;}
  .material-page .mf-customization-spec{padding:0;}
  .material-page .mf-customization-spec__heading{gap:9px;}
  .material-page .mf-customization-spec__heading>svg{width:30px;height:30px;flex-basis:30px;}
  .material-page .mf-customization-table th,.material-page .mf-customization-table td{padding:8px 7px;}
  .material-page .mf-customization-table tbody td{font-size:11px;}
  .material-page .mf-customization-thesis{padding:0;}
  .material-page .mf-customization-result{padding:16px 0 0;}



}
/* Give the three design-response tabs their full content width at intermediate sizes.
   Without this the existing left rail squeezes the new live comparison tables. */
@media(max-width:1250px){
  .material-page #mf-experience .mf-build-explorer.va-mf-conclusion{grid-template-columns:minmax(0,1fr);row-gap:20px;}
  .material-page #mf-experience .mf-build-explorer.va-mf-conclusion>.mf-build-nav,
  .material-page #mf-experience .mf-build-explorer.va-mf-conclusion>.mf-build-panel{grid-column:1;grid-row:auto;}
  .material-page #mf-experience .mf-build-explorer.va-mf-conclusion>.mf-build-nav{grid-template-columns:repeat(3,minmax(0,1fr));}
}
@media(max-width:760px){
  .material-page #mf-experience .mf-build-explorer.va-mf-conclusion>.mf-build-nav{grid-template-columns:minmax(0,1fr);}
}


/* Incremental Changes: text / original evidence / revised evidence.
   The operating-state comparison UI was superseded by the two supplied
   interface screenshots; other design-response tabs remain unchanged. */
.material-page #mf-experience #mf-build-panel-0.va-mf-conclusion-panel:not([hidden]) {
  display:block;
}
.material-page #mf-experience #mf-build-panel-0 .mf-incremental-grid {
  display:grid;
  grid-template-columns:minmax(255px,.88fr) repeat(2,minmax(0,1fr));
  gap:clamp(16px,2vw,32px);
  align-items:start;
}
.material-page #mf-build-panel-0 .mf-incremental-copy,
.material-page #mf-build-panel-0 .mf-incremental-evidence {min-width:0;margin:0;}
.material-page #mf-build-panel-0 .mf-incremental-copy h3 {
  font-size:clamp(22px,1.8vw,29px);
  line-height:1.24; letter-spacing:-.027em;
  color:#152f41; margin:0 0 12px;
}
.material-page #mf-build-panel-0 .mf-incremental-copy p {
  margin:0; line-height:1.52;
}
.material-page #mf-build-panel-0 .mf-incremental-points {margin-top:clamp(20px,2.3vw,34px);}
.material-page #mf-build-panel-0 .mf-incremental-point {
  padding:14px 0; border-top:1px solid #d0dbe1;
}
.material-page #mf-build-panel-0 .mf-incremental-point h4 {
  font-size:clamp(14px,1vw,16px); line-height:1.3;
  color:#152f41; font-weight:700; margin:0 0 6px;
}
.material-page #mf-build-panel-0 .mf-incremental-evidence figcaption {
  display:block; margin:0 0 12px; padding-top:9px;
  border-top:1px solid #aebec3;
  color:#243d4b; font:700 12px/1.35 var(--font-body);
  letter-spacing:.08em; text-transform:uppercase;
}
.material-page #mf-build-panel-0 .mf-incremental-evidence img {
  display:block;width:100%;height:auto;max-width:100%;
  object-fit:contain;object-position:top center;
}
@media(max-width:1360px) {
  .material-page #mf-experience #mf-build-panel-0 .mf-incremental-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
    row-gap:26px;
  }
  .material-page #mf-build-panel-0 .mf-incremental-copy {grid-column:1/-1;display:block;}
  .material-page #mf-build-panel-0 .mf-incremental-lede {max-width:76ch;}
  .material-page #mf-build-panel-0 .mf-incremental-points {
    display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
    gap:20px; margin-top:20px;
  }
}
@media(max-width:690px) {
  .material-page #mf-experience #mf-build-panel-0 .mf-incremental-grid {grid-template-columns:minmax(0,1fr);gap:22px;}
  .material-page #mf-build-panel-0 .mf-incremental-copy {display:block;grid-column:1;}
  .material-page #mf-build-panel-0 .mf-incremental-points {display:block;margin-top:24px;}
  .material-page #mf-build-panel-0 .mf-incremental-evidence {width:100%;}
}

/* Material Flow Before / Future evidence: true 70% image width, centered in
   its own column, without retaining the original frame height. Only these
   editorial illustrations are resized; live interfaces are excluded. */
.material-page #mf-opportunity .mf-pair-columns > .mf-pair-state {
  align-items:center;
  text-align:center;
}
.material-page #mf-opportunity .mf-pair-state > :is(.mf-pair-label,h4,.mf-pair-state-description,.mf-pair-takeaway) {
  text-align:center;
  margin-left:auto;
  margin-right:auto;
}
.material-page #mf-opportunity .mf-pair-state > .mf-pair-art {
  box-sizing:border-box;
  flex:none;
  width:70%; max-width:70%; height:auto; min-height:0;
  margin:18px auto 12px; padding:0; border:0;
  background:transparent;
}
.material-page #mf-opportunity .mf-pair-state > .mf-pair-art > img {
  display:block; width:100%; max-width:100%; height:auto;
  max-height:none; margin:0 auto; object-fit:contain; object-position:center;
}

/* Shared assets only: balance two illustrations with different aspect ratios.
   Both source files are 673px tall, but Before is 905px wide and Future
   is 1083px wide. 64% / 77% gives nearly identical displayed heights;
   other Shared Foundation tabs keep their current 70% scale. */
.material-page #mf-opportunity .mf-pair-explorer[data-mf-topic="shared"] .mf-pair-state--before > .mf-pair-art {
  width:64%; max-width:64%;
}
.material-page #mf-opportunity .mf-pair-explorer[data-mf-topic="shared"] .mf-pair-state--future > .mf-pair-art {
  width:77%; max-width:77%;
}
/* The absent redundant overview is removed from HTML and the tab script. */
.material-page #mf-experience .mf-customization-network {
  width:70%; height:auto; max-width:none; align-self:start;
  margin:0 auto; padding:0; border:0; display:block;
}
.material-page #mf-experience .mf-customization-network img {
  width:100%; max-width:100%; height:auto; max-height:none;
  display:block; object-fit:contain; object-position:center;
}

/* Main Tool for Automated Flow: editorial text beside the supplied Routeweaver
   screenshot. Mirror Incremental Changes typography; keep UI evidence inspectable. */
.material-page #mf-experience #mf-build-panel-1.va-mf-conclusion-panel:not([hidden]) {
  display:block;
}
.material-page #mf-experience #mf-build-panel-1 .mf-prototype-grid {
  display:grid;
  grid-template-columns:minmax(310px,.88fr) minmax(0,1.32fr);
  gap:clamp(20px,2.2vw,36px);
  align-items:start;
}
.material-page #mf-build-panel-1 .mf-prototype-copy,
.material-page #mf-build-panel-1 .mf-prototype-evidence{min-width:0;margin:0;}
.material-page #mf-build-panel-1 .mf-prototype-copy h3 {
  font-size:clamp(22px,1.8vw,29px);
  line-height:1.24;letter-spacing:-.027em;
  color:#152f41;margin:0 0 12px;
}
.material-page #mf-build-panel-1 .mf-prototype-copy p{margin:0;line-height:1.52;}
.material-page #mf-build-panel-1 .mf-prototype-points{margin-top:clamp(20px,2.3vw,34px);}
.material-page #mf-build-panel-1 .mf-prototype-point{padding:14px 0;border-top:1px solid #d0dbe1;}
.material-page #mf-build-panel-1 .mf-prototype-point h4 {
  font-size:clamp(14px,1vw,16px);line-height:1.3;
  color:#152f41;font-weight:700;margin:0 0 6px;
}
.material-page #mf-build-panel-1 .mf-prototype-evidence>a{display:block;width:100%;}
.material-page #mf-build-panel-1 .mf-prototype-evidence img {
  display:block;width:100%;max-width:100%;height:auto;
  object-fit:contain;object-position:top center;
}
.material-page #mf-build-panel-1 .mf-prototype-evidence figcaption {
  margin:12px 0 0;font-size:13px;line-height:1.5;color:#667988;
}
@media(max-width:1120px){
  .material-page #mf-experience #mf-build-panel-1 .mf-prototype-grid {
    grid-template-columns:minmax(0,1fr);
    gap:24px;
  }
  .material-page #mf-build-panel-1 .mf-prototype-lede{max-width:76ch;}
  .material-page #mf-build-panel-1 .mf-prototype-points {
    display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:20px;
  }
}
@media(max-width:690px){
  .material-page #mf-build-panel-1 .mf-prototype-points{display:block;margin-top:24px;}
}

/* Balance the two column gutters so artwork is centered against each column,
   not shifted by its former single-sided padding. */
.material-page #mf-opportunity .mf-pair-columns > .mf-pair-state {
  padding-left:11px;
  padding-right:11px;
}
@media(max-width:760px) {
  .material-page #mf-opportunity .mf-pair-columns > .mf-pair-state {
    padding-left:0;
    padding-right:0;
  }
}
