/* Approved vision mockup, scoped to avoid affecting other website sections. */
#vision {
  padding: 90px 0 0;
  overflow: clip;
  background: #09151d;
  color: #f0f2f3;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  scroll-margin-top: 76px;
}
/* Use the shared page gutters with the section's compact maximum width. */
.mcv-vision {
  container-type: inline-size;
  position: relative;
  isolation: isolate;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 48.982% minmax(0, 1fr);
  background:
    radial-gradient(ellipse at 43% 49%, rgba(22, 40, 49, .21), transparent 74%),
    #09151d;
  max-width: 950px;
}
/* Fit the approved composition's outer edges inside the shared content width. */
.mcv-satellite {
  position: absolute;
  z-index: 0;
  left: 34.879%;
  top: 6.98%;
  width: 65.121%;
  height: 82.15%;
  margin: 0;
  overflow: hidden;
  border: max(1px, .10cqw) solid rgba(157, 171, 164, .28);
  border-radius: 2.05cqw;
  background: #182523;
  box-shadow: 0 1.6cqw 2.9cqw rgba(0, 0, 0, .28);
}
.mcv-satellite img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.mcv-satellite::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  box-shadow: inset 0 0 0 max(1px, .05cqw) rgba(226, 238, 231, .06);
  background: rgba(4, 14, 20, .045);
}
.mcv-glass {
  position: relative;
  grid-column: 1;
  z-index: 1;
  left: 0;
  top: auto;
  width: 100%;
  min-height: 44.68cqw;
  margin-block: 6.6cqw 3.3cqw;
  padding: 3.80cqw 2.98cqw 3.10cqw;
  overflow: hidden;
  border: max(1px, .11cqw) solid rgba(118, 151, 166, .33);
  border-radius: 1.86cqw;
  background:
    linear-gradient(180deg, rgba(82, 103, 119, .065), transparent 92%, rgba(3, 16, 25, .20)),
    linear-gradient(112deg, rgba(8, 21, 30, .92) 0%, rgba(9, 22, 31, .88) 75%, rgba(22, 34, 43, .79) 100%);
  -webkit-backdrop-filter: blur(0.4cqw) saturate(.55);
  backdrop-filter: blur(0.4cqw) saturate(.55);
  box-shadow:
    0 1.45cqw 3.7cqw rgba(0, 0, 0, .37),
    inset 0 .05cqw 0 rgba(220, 236, 243, .035);
}
.mcv-intro {
  margin: 0;
  font-size: 1.655cqw;
  font-weight: 400;
  line-height: 1.42;
  letter-spacing: -.025cqw;
  color: #eef0f2;
}
.mcv-steps {
  position: relative;
  margin: 3.30cqw 0 0 .34cqw;
  padding: 0;
  list-style: none;
}
.mcv-steps::before {
  content: "";
  position: absolute;
  top: .13cqw;
  bottom: .16cqw;
  left: 4.43cqw;
  width: max(1px, .10cqw);
  background: rgba(121, 158, 172, .28);
}
.mcv-step {
  position: relative;
  display: grid;
  grid-template-columns: 2.35cqw .78cqw minmax(0, 1fr);
  column-gap: 1.77cqw;
  min-height: 8.69cqw;
}
.mcv-step:last-child { min-height: 0; }
.mcv-number {
  padding-top: .15cqw;
  color: #a8c7c3;
  font-size: 1.24cqw;
  line-height: 1.3;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
}
.mcv-dot {
  position: relative;
  z-index: 1;
  width: .78cqw;
  height: .78cqw;
  margin-top: .53cqw;
  border-radius: 50%;
  background: #89a9ae;
  box-shadow: 0 0 .15cqw rgba(157, 201, 203, .16);
}
.mcv-step-copy { padding-left: .36cqw; }
.mcv-step h2 {
  margin: 0 0 .40cqw;
  color: #f2f3f4;
  font-size: 1.56cqw;
  line-height: 1.25;
  font-weight: 500;
  letter-spacing: -.025cqw;
}
.mcv-step p {
  margin: 0;
  color: #aabcc8;
  font-size: 1.34cqw;
  line-height: 1.42;
  font-weight: 400;
  letter-spacing: -.014cqw;
}
/* Share a row on narrow screens: image on the left, glass offset to the right. */
@media (max-width: 900px) {
  .mcv-vision { grid-template-columns: minmax(0, 1fr); min-height: 0; padding: 28px 0 32px; }
  .mcv-satellite { position: relative; grid-area: 1 / 1; align-self: start; inset: auto; width: 86%; height: clamp(300px, 80cqw, 560px); border-radius: 22px; }
  .mcv-glass { grid-area: 1 / 1; align-self: start; inset: auto; width: 86%; height: auto; min-height: 0; margin: 64px 0 0 auto; padding: 24px clamp(18px, 3.3vw, 26px) 28px; border-radius: 22px; -webkit-backdrop-filter: blur(8px) saturate(.55); backdrop-filter: blur(8px) saturate(.55); }
  .mcv-intro { font-size: clamp(15px, 2.6vw, 20px); line-height: 1.5; letter-spacing: -.2px; }
  .mcv-reference-break { display: none; }
  .mcv-steps { margin: 28px 0 0; }
  .mcv-steps::before { left: 34px; top: 6px; bottom: 3px; width: 1px; }
  .mcv-step { grid-template-columns: 20px 8px minmax(0, 1fr); column-gap: 10px; min-height: 0; padding-bottom: 24px; }
  .mcv-step:last-child { padding-bottom: 0; }
  .mcv-number { padding-top: 3px; font-size: 12px; }
  .mcv-dot { width: 8px; height: 8px; margin-top: 7px; }
  .mcv-step-copy { padding-left: 0; }
  .mcv-step h2 { margin-bottom: 7px; font-size: 18px; letter-spacing: -.3px; }
  .mcv-step p { font-size: clamp(14px, 2.1vw, 16px); line-height: 1.5; letter-spacing: -.1px; }
}
