.ms-solutions-hero {
  min-height: min(58rem, calc(100svh - 5.5rem));
  display: grid;
  align-items: center;
  background:
    radial-gradient(circle at 8% 18%, rgba(25, 197, 232, 0.12), transparent 26rem),
    #030912;
}

.ms-solutions-hero__layout {
  display: grid;
  align-items: center;
  gap: clamp(var(--ms-space-8), 6vw, var(--ms-space-20));
  grid-template-columns: minmax(22rem, 0.9fr) minmax(0, 1.1fr);
}

.ms-solutions-hero__content {
  display: grid;
  gap: var(--ms-space-6);
}

.ms-solutions-hero h1 {
  max-width: 12ch;
  font-size: clamp(3.4rem, 7.6vw, 7.4rem);
}

.ms-solutions-hero h1 span {
  color: var(--ms-color-accent);
}

.ms-solutions-hero__media {
  position: relative;
  min-height: 34rem;
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--ms-color-border-strong);
  border-radius: var(--ms-radius-xl);
  background: var(--ms-color-surface);
  box-shadow: var(--ms-shadow-lg);
}

.ms-solutions-hero__media::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(105deg, rgba(3, 9, 18, 0.36), transparent 58%);
  content: "";
  pointer-events: none;
}

.ms-solutions-hero__media img {
  width: 100%;
  height: 100%;
  min-height: 34rem;
  object-fit: cover;
}

.ms-solutions-paths {
  background: var(--ms-color-bg-elevated);
}

.ms-solutions-paths__grid {
  display: grid;
  gap: var(--ms-space-5);
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ms-solution-path {
  display: grid;
  min-height: 28rem;
  overflow: hidden;
  border: 1px solid var(--ms-color-border);
  border-radius: var(--ms-radius-lg);
  background: var(--ms-color-surface);
  grid-template-columns: minmax(10rem, 0.82fr) minmax(0, 1.18fr);
}

.ms-solution-path img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ms-solution-path > div {
  display: grid;
  align-content: end;
  gap: var(--ms-space-4);
  padding: clamp(var(--ms-space-6), 3vw, var(--ms-space-10));
}

.ms-solution-path > div > span,
.ms-solutions-method__steps > li > span {
  color: var(--ms-color-accent);
  font-family: var(--ms-font-utility);
  font-size: var(--ms-text-xs);
  font-weight: 800;
  letter-spacing: 0.12em;
}

.ms-solutions-method {
  background:
    linear-gradient(110deg, rgba(37, 99, 235, 0.12), transparent 54%),
    #030912;
}

.ms-solutions-method__layout {
  display: grid;
  gap: clamp(var(--ms-space-10), 7vw, var(--ms-space-24));
  grid-template-columns: minmax(18rem, 0.76fr) minmax(0, 1.24fr);
}

.ms-solutions-method__layout > header {
  display: grid;
  align-content: start;
  gap: var(--ms-space-5);
}

.ms-solutions-method__steps {
  display: grid;
  margin: 0;
  list-style: none;
}

.ms-solutions-method__steps li {
  display: grid;
  gap: var(--ms-space-6);
  padding: var(--ms-space-6) 0;
  border-top: 1px solid var(--ms-color-border);
  grid-template-columns: 3rem minmax(0, 1fr);
}

.ms-solutions-method__steps li > div {
  display: grid;
  gap: var(--ms-space-2);
}

.ms-solutions-contexts__grid {
  display: grid;
  overflow: hidden;
  border: 1px solid var(--ms-color-border);
  border-radius: var(--ms-radius-lg);
  background: var(--ms-color-border);
  gap: 1px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.ms-solutions-contexts__grid article {
  display: grid;
  min-height: 15rem;
  align-content: end;
  gap: var(--ms-space-3);
  padding: clamp(var(--ms-space-5), 2.4vw, var(--ms-space-8));
  background:
    radial-gradient(circle at 85% 10%, rgba(25, 197, 232, 0.1), transparent 9rem),
    var(--ms-color-surface);
}

.ms-solutions-contexts__grid strong {
  color: var(--ms-color-text);
  font-size: var(--ms-text-lg);
}

.ms-solutions-cta {
  padding-block-start: 0;
  background: var(--ms-color-bg-elevated);
}

.ms-solutions-cta .ms-container {
  display: grid;
  align-items: center;
  gap: var(--ms-space-8);
  padding: clamp(var(--ms-space-6), 5vw, var(--ms-space-12));
  border: 1px solid var(--ms-color-border-strong);
  border-radius: var(--ms-radius-lg);
  background:
    radial-gradient(circle at 88% 110%, rgba(25, 197, 232, 0.13), transparent 18rem),
    rgba(8, 23, 45, 0.92);
  grid-template-columns: minmax(0, 1fr) auto;
}

.ms-solutions-cta .ms-container > div:first-child {
  display: grid;
  max-width: 52rem;
  gap: var(--ms-space-4);
}

@media (max-width: 72rem) {
  .ms-solutions-contexts__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 64rem) {
  .ms-solutions-hero__layout,
  .ms-solutions-method__layout {
    grid-template-columns: 1fr;
  }

  .ms-solutions-hero__content {
    order: 1;
  }

  .ms-solutions-hero__media {
    order: 2;
  }

  .ms-solutions-paths__grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 48rem) {
  .ms-solutions-hero {
    min-height: 0;
  }

  .ms-solutions-hero h1 {
    font-size: clamp(2.75rem, 15vw, 4.6rem);
  }

  .ms-solutions-hero__media,
  .ms-solutions-hero__media img {
    min-height: 18rem;
  }

  .ms-solution-path {
    min-height: 0;
    grid-template-columns: 1fr;
  }

  .ms-solution-path img {
    aspect-ratio: 16 / 9;
  }

  .ms-solutions-contexts__grid {
    grid-template-columns: 1fr;
  }

  .ms-solutions-contexts__grid article {
    min-height: 10rem;
  }

  .ms-solutions-cta .ms-container {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 20rem) {
  .ms-solutions-method__steps li {
    gap: var(--ms-space-3);
    grid-template-columns: 2rem minmax(0, 1fr);
  }
}

@media (forced-colors: active) {
  .ms-solutions-hero__media,
  .ms-solution-path,
  .ms-solutions-contexts__grid,
  .ms-solutions-cta .ms-container {
    border: 1px solid CanvasText;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ms-solutions-hero *,
  .ms-solutions-paths *,
  .ms-solutions-method *,
  .ms-solutions-contexts *,
  .ms-solutions-cta * {
    scroll-behavior: auto;
    transition: none;
  }
}

/* R1 solution detail system */
.ms-solution-detail-hero {
  min-height: min(52rem, calc(100svh - 5.5rem));
  display: grid;
  align-items: center;
  background:
    radial-gradient(circle at 12% 18%, rgba(25, 197, 232, 0.14), transparent 24rem),
    linear-gradient(135deg, #030912 0%, #07182d 100%);
}

.ms-solution-detail-hero__layout {
  display: grid;
  align-items: center;
  gap: clamp(var(--ms-space-8), 6vw, var(--ms-space-20));
  grid-template-columns: minmax(22rem, 0.88fr) minmax(0, 1.12fr);
}

.ms-solution-detail-hero__content { display: grid; gap: var(--ms-space-6); }
.ms-solution-detail-hero h1 {
  max-width: 13ch;
  font-size: clamp(3.25rem, 6.8vw, 6.8rem);
  hyphens: none;
  overflow-wrap: normal;
  word-break: normal;
}
.ms-solution-detail-hero h1 span { color: var(--ms-color-accent); }
.ms-solution-detail-hero__media {
  position: relative;
  min-height: 32rem;
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--ms-color-border-strong);
  border-radius: var(--ms-radius-xl);
  background: var(--ms-color-surface);
  box-shadow: var(--ms-shadow-lg);
}
.ms-solution-detail-hero__media::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(115deg, rgba(3, 9, 18, 0.16), transparent 58%), linear-gradient(0deg, rgba(3, 9, 18, 0.42), transparent 34%);
  content: "";
  pointer-events: none;
}
.ms-solution-detail-hero__media img { width: 100%; height: 100%; min-height: 32rem; object-fit: cover; }
.ms-solution-detail-framework { background: var(--ms-color-bg-elevated); }
.ms-solution-detail-framework__grid {
  display: grid;
  overflow: hidden;
  border: 1px solid var(--ms-color-border);
  border-radius: var(--ms-radius-lg);
  background: var(--ms-color-border);
  gap: 1px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.ms-solution-detail-framework__grid article {
  display: grid;
  min-height: 18rem;
  align-content: end;
  gap: var(--ms-space-4);
  padding: clamp(var(--ms-space-6), 4vw, var(--ms-space-12));
  background: radial-gradient(circle at 92% 8%, rgba(25, 197, 232, 0.11), transparent 11rem), var(--ms-color-surface);
}
.ms-solution-detail-framework__grid article > span {
  color: var(--ms-color-accent);
  font-family: var(--ms-font-utility);
  font-size: var(--ms-text-xs);
  font-weight: 800;
  letter-spacing: 0.12em;
}
.ms-solution-detail-process {
  display: grid;
  align-items: start;
  gap: clamp(var(--ms-space-8), 5vw, var(--ms-space-16));
  margin-top: clamp(var(--ms-space-12), 7vw, var(--ms-space-24));
  padding: clamp(var(--ms-space-6), 5vw, var(--ms-space-12));
  border: 1px solid var(--ms-color-border-strong);
  border-radius: var(--ms-radius-lg);
  background: linear-gradient(120deg, rgba(37, 99, 235, 0.14), rgba(8, 23, 45, 0.92));
  grid-template-columns: minmax(15rem, 0.7fr) minmax(0, 1.3fr);
}
.ms-solution-detail-process > div { display: grid; gap: var(--ms-space-3); }
.ms-solution-detail-process ol { display: grid; margin: 0; padding: 0; list-style: none; }
.ms-solution-detail-process li { display: grid; gap: var(--ms-space-2); padding: var(--ms-space-4) 0; border-top: 1px solid var(--ms-color-border); }
.ms-solution-detail-process li strong { color: var(--ms-color-text); }
.ms-solution-detail-process li span { color: var(--ms-color-text-muted); }
.ms-solution-detail-faq { background: #030912; }
.ms-solution-detail-faq__layout {
  display: grid;
  align-items: start;
  gap: clamp(var(--ms-space-10), 7vw, var(--ms-space-24));
  grid-template-columns: minmax(0, 1.2fr) minmax(20rem, 0.8fr);
}
.ms-solution-detail-faq__layout > div:first-child { display: grid; gap: var(--ms-space-6); }
.ms-solution-detail-faq__items { display: grid; border-top: 1px solid var(--ms-color-border); }
.ms-solution-detail-faq details { padding: var(--ms-space-5) 0; border-bottom: 1px solid var(--ms-color-border); }
.ms-solution-detail-faq summary { color: var(--ms-color-text); cursor: pointer; font-size: var(--ms-text-lg); font-weight: 750; }
.ms-solution-detail-faq details p { max-width: 60ch; margin-top: var(--ms-space-3); }
.ms-solution-detail-cta {
  position: sticky;
  top: 7rem;
  display: grid;
  gap: var(--ms-space-5);
  padding: clamp(var(--ms-space-6), 4vw, var(--ms-space-10));
  border: 1px solid var(--ms-color-border-strong);
  border-radius: var(--ms-radius-xl);
  background: radial-gradient(circle at 100% 100%, rgba(25, 197, 232, 0.16), transparent 15rem), var(--ms-color-surface);
  box-shadow: var(--ms-shadow-md);
}
.ms-solutions-contexts__grid article { position: relative; }
.ms-solutions-contexts__grid article > a { position: absolute; inset: 0; border-radius: inherit; }
.ms-solutions-contexts__grid article > a:focus-visible { outline: 3px solid var(--ms-color-focus); outline-offset: -4px; }

@media (max-width: 64rem) {
  .ms-solution-detail-hero__layout,
  .ms-solution-detail-process,
  .ms-solution-detail-faq__layout { grid-template-columns: 1fr; }
  .ms-solution-detail-hero__content { order: 1; }
  .ms-solution-detail-hero__media { order: 2; }
  .ms-solution-detail-cta { position: static; }
}
@media (max-width: 48rem) {
  .ms-solution-detail-hero { min-height: 0; }
  .ms-solution-detail-hero h1 {
    max-width: none;
    font-size: clamp(2.5rem, 11vw, 3.5rem);
  }
  .ms-solution-detail-hero__media,
  .ms-solution-detail-hero__media img { min-height: 18rem; }
  .ms-solution-detail-framework__grid { grid-template-columns: 1fr; }
  .ms-solution-detail-framework__grid article { min-height: 13rem; }
}
@media (max-width: 20rem) {
  .ms-solution-detail-hero h1 { font-size: 2.25rem; }
  .ms-solution-detail-framework__grid article,
  .ms-solution-detail-process,
  .ms-solution-detail-cta { padding-inline: var(--ms-space-4); }
}
@media (forced-colors: active) {
  .ms-solution-detail-hero__media,
  .ms-solution-detail-framework__grid,
  .ms-solution-detail-process,
  .ms-solution-detail-cta { border: 1px solid CanvasText; }
}
@media (prefers-reduced-motion: reduce) {
  .ms-solution-detail-hero *,
  .ms-solution-detail-framework *,
  .ms-solution-detail-faq * { scroll-behavior: auto; transition: none; }
}

/* R1.1 visual normalization — signal-led, consultative density. */
.ms-solutions-hero {
  min-height: clamp(38rem, 68vh, 48rem);
}

.ms-solutions-hero h1 {
  max-width: 11ch;
  font-size: clamp(3rem, 5.2vw, 5.5rem);
  line-height: 0.98;
}

.ms-solutions-hero__media,
.ms-solutions-hero__media img {
  min-height: 26rem;
}

.ms-solutions-paths__grid article {
  min-height: 21rem;
}

.ms-solutions-contexts__grid article {
  min-height: 10rem;
  padding: clamp(1.4rem, 2.5vw, 2.25rem);
}

.ms-solution-detail-hero {
  min-height: clamp(36rem, 64vh, 45rem);
}

.ms-solution-detail-hero h1 {
  max-width: 15ch;
  font-size: clamp(2.8rem, 4.6vw, 4.7rem);
  line-height: 1;
}

.ms-solution-detail-hero__media,
.ms-solution-detail-hero__media img {
  min-height: 25rem;
}

.ms-solution-detail-framework__grid article {
  min-height: 12rem;
  padding: clamp(1.5rem, 3vw, 2.5rem);
}

.ms-solution-detail-process {
  gap: clamp(1.75rem, 4vw, 3.5rem);
  margin-top: clamp(2.5rem, 5vw, 4rem);
  padding: clamp(1.5rem, 3.5vw, 2.5rem);
}

@media (max-width: 48rem) {
  .ms-solutions-hero h1 {
    max-width: 12ch;
    font-size: clamp(2.4rem, 10.5vw, 3.35rem);
    line-height: 1.02;
  }

  .ms-solutions-hero__media,
  .ms-solutions-hero__media img,
  .ms-solution-detail-hero__media,
  .ms-solution-detail-hero__media img {
    min-height: 15rem;
  }

  .ms-solutions-paths__grid article,
  .ms-solutions-contexts__grid article,
  .ms-solution-detail-framework__grid article {
    min-height: 0;
  }

  .ms-solution-detail-hero h1 {
    max-width: 14ch;
    font-size: clamp(2.3rem, 9.4vw, 3.1rem);
    line-height: 1.03;
  }
}
