/* Preview only: an open path with guidance, not a wall of limits. */
#root .principle.bc-stance-layout {
  display:grid; grid-template-columns:minmax(0,1.35fr) minmax(270px,.85fr);
  gap:26px clamp(36px,5vw,76px); align-items:center;
}
#root .principle.bc-stance-layout > .kicker { grid-column:1/-1; margin:0; }
#root .principle.bc-stance-layout > div { grid-column:1; min-width:0; }
#root .principle.bc-stance-layout h2 {
  max-width:760px; font-size:clamp(38px,4vw,60px); line-height:1.1;
  margin:0 0 25px; letter-spacing:-.035em;
}
#root .principle.bc-stance-layout > div > p { max-width:690px; font-size:16px; line-height:1.7; margin:0; }
#root .principle.bc-stance-layout > .principle-mark { display:none; }
#root .principle.bc-stance-layout > .bc-stance-graphic {
  grid-column:2; align-self:center; position:relative; z-index:1;
  width:100%; max-width:490px; justify-self:center; margin:0; padding:0;
  border:0; background:none; box-shadow:none;
}
.bc-stance-graphic > svg { display:block; width:100%; height:auto; overflow:visible; fill:none; stroke-linecap:round; stroke-linejoin:round; }
.bc-stance-graphic .bc-stance-corridor { fill:var(--bc-visual-accent); opacity:.10; stroke:none; }
.bc-stance-graphic .bc-stance-rail { fill:none; stroke:var(--bc-visual-accent); stroke-width:1.5; opacity:.68; }
.bc-stance-graphic .bc-stance-route { fill:none; stroke:var(--bc-visual-ink); stroke-width:2.5; }
.bc-stance-graphic .bc-stance-arrow { fill:none; stroke:var(--bc-visual-ink); stroke-width:2.5; }
.bc-stance-graphic .bc-stance-origin { fill:var(--bc-visual-ink); stroke:none; }
.bc-stance-graphic .bc-stance-joint { fill:var(--bc-visual-ink); stroke:none; }
.bc-stance-graphic .bc-stance-alternative { fill:none; stroke:var(--bc-visual-accent); stroke-width:1.4; stroke-dasharray:3 7; opacity:.66; }
.bc-stance-graphic .bc-stance-topography { fill:none; stroke:var(--bc-visual-accent); stroke-width:1; opacity:.14; }
.bc-stance-graphic .bc-stance-tick { fill:none; stroke:var(--bc-visual-accent); stroke-width:1.5; opacity:.65; }
.bc-stance-graphic .bc-stance-leader { fill:none; stroke:var(--bc-visual-accent); stroke-width:1; opacity:.65; }
.bc-stance-graphic .bc-stance-label { fill:var(--bc-visual-ink); stroke:none; font:500 16px var(--ui-font); letter-spacing:.015em; }
.bc-stance-graphic .bc-stance-destination { text-anchor:end; }
#root .bc-stance-graphic > figcaption {
  margin:8px 0 0; padding:0; border:0; color:var(--bc-visual-ink);
  font:500 13px/1.45 var(--ui-font); letter-spacing:.03em; text-align:center;
}
@media(min-width:701px) and (max-width:1050px) {
  #root .principle.bc-stance-layout { grid-template-columns:minmax(0,1fr); gap:28px; }
  #root .principle.bc-stance-layout > div { grid-column:1; }
  #root .principle.bc-stance-layout h2 { font-size:clamp(40px,5vw,54px); }
  #root .principle.bc-stance-layout > .bc-stance-graphic { grid-column:1; max-width:390px; }
}
@media(max-width:700px) {
  #root .bc-stance-graphic { display:none!important; }
}
@media(prefers-reduced-motion:reduce) {
  .bc-stance-graphic, .bc-stance-graphic * { animation:none!important; transition:none!important; }
}
