/* Vertex vision & mission: three-column desktop, readable responsive copy.
   Loaded after the legacy vision styles; SVG and its animations are preserved. */
.vision-grid {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,.78fr) minmax(0,1fr);
  grid-template-areas:
    "heading heading heading"
    "vision visual mission";
  column-gap:clamp(20px,2.5vw,38px);
  row-gap:clamp(25px,3vw,42px);
  align-items:start;
  direction:ltr;
}
.vision-grid>.vision-heading {grid-area:heading;min-width:0;margin:0}
.vision-grid>.vision-statement {grid-area:vision}
.vision-grid>.vision-visual {
  grid-area:visual;
  display:flex;
  justify-content:center;
  align-items:center;
  align-self:center;
  min-width:0;
  padding:0;
}
.vision-grid>.mission-statement {grid-area:mission; width:100%; margin-left:auto; text-align:right}
.vision-grid>.vision-panel {
  min-width:0;
  max-width:100%;
  padding:0;
  overflow-wrap:break-word;
}
.vision-grid>.vision-panel h3 {
  color:var(--text);
  font-size:clamp(22px,2vw,28px);
  line-height:1.3;
  letter-spacing:-.025em;
  margin:0 0 22px;
  font-weight:700;
}
.vision-grid>.vision-panel p {
  color:var(--text-muted);
  font-size:clamp(14px,1.12vw,15.5px);
  line-height:1.76;
  margin:0 0 16px;
}
.vision-grid>.vision-panel p:first-of-type {color:var(--text)}
.vision-grid>.vision-panel p:last-child {margin-bottom:0}
.vision-grid .diagram-vision {
  width:100%!important;
  max-width:300px;
  height:auto;
}
html[dir="rtl"] .vision-grid>.vision-panel {
  direction:rtl;
  text-align:right;
}
html[dir="rtl"] .vision-grid>.vision-heading {
  direction:rtl;
  text-align:right;
}
@media(max-width:1030px) {
  .vision-grid {
    grid-template-columns:minmax(0,1fr);
    grid-template-areas:"heading" "vision" "visual" "mission";
    row-gap:32px;
    column-gap:0;
  }
  .vision-grid>.vision-panel {max-width:68ch}
  .vision-grid>.vision-visual {width:100%;margin:0;justify-content:center}
  .vision-grid .diagram-vision {max-width:290px}
}
@media(max-width:600px) {
  .vision-grid {row-gap:26px}
  .vision-grid>.vision-panel h3 {font-size:23px;margin-bottom:16px}
  .vision-grid>.vision-panel p {font-size:14.5px;line-height:1.72;margin-bottom:14px}
  .vision-grid .diagram-vision {max-width:255px}
}
