.ml-about--v2 .mla-cradle {
  position: relative;
  display: grid;
  grid-template-columns: minmax(280px,.72fr) minmax(0,1.28fr);
  gap: clamp(42px,6vw,100px);
  align-items: center;
  min-height: 760px;
  padding-top: clamp(88px,10vw,148px);
  padding-bottom: clamp(88px,10vw,148px);
  overflow: hidden;
  background:
    linear-gradient(rgba(97,194,200,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(97,194,200,.055) 1px,transparent 1px),
    #0d2530;
  background-size: 48px 48px;
  color: #fff;
  border-top: 1px solid rgba(255,255,255,.12);
  border-bottom: 1px solid rgba(255,255,255,.12);
}

.ml-about--v2 .mla-cradle::before {
  content: "02";
  position: absolute;
  left: -1.8vw;
  bottom: -7vw;
  color: rgba(255,255,255,.025);
  font: 700 clamp(220px,30vw,520px)/.75 "IBM Plex Mono",monospace;
  pointer-events: none;
}

.mla-cradle__copy { position: relative; z-index: 2; }
body .ml-site.ml-about--v2 .mla-cradle__copy h2 {
  max-width: 610px;
  margin: 0 0 28px;
  color: #fff;
  font-size: clamp(48px,5.5vw,86px);
  line-height: .94;
  letter-spacing: -.055em;
}
body .ml-site.ml-about--v2 .mla-cradle__copy h2 em { color: #ffb300; font-style: normal; }
.mla-cradle__copy > p {
  max-width: 510px;
  margin: 0;
  color: rgba(255,255,255,.68);
  font-size: clamp(17px,1.35vw,21px);
  line-height: 1.58;
}
.mla-cradle__instruction {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 42px;
  color: rgba(255,255,255,.78);
  font: 600 11px/1 "IBM Plex Mono",monospace;
  letter-spacing: .1em;
}
.mla-cradle__instruction i {
  width: 28px;
  height: 1px;
  background: #ffb300;
  box-shadow: 8px 0 0 rgba(255,179,0,.34);
}

.mla-cradle__machine {
  position: relative;
  min-width: 0;
  border: 1px solid rgba(151,205,211,.24);
  background: rgba(6,24,32,.42);
  box-shadow: 0 30px 80px rgba(0,0,0,.14);
  touch-action: none;
  user-select: none;
}
.mla-cradle__readout {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 52px;
  padding: 0 18px;
  border-bottom: 1px solid rgba(151,205,211,.18);
  color: rgba(255,255,255,.68);
  font: 600 9px/1 "IBM Plex Mono",monospace;
  letter-spacing: .1em;
}
.mla-cradle__readout b { color: #ffb300; }
.mla-cradle__readout b::after {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-left: 8px;
  border-radius: 50%;
  background: currentColor;
  box-shadow: 0 0 0 4px rgba(255,179,0,.08);
}

.mla-cradle__svg { display: block; width: 100%; height: auto; overflow: visible; }
.mla-cradle__beam,
.mla-cradle__string,
.mla-cradle__ticks path {
  fill: none;
  stroke: rgba(177,221,225,.52);
  stroke-width: 1.25;
  vector-effect: non-scaling-stroke;
}
.mla-cradle__ticks path { stroke: rgba(177,221,225,.18); }
.mla-cradle__pendulum { transform-origin: 0 0; }
.mla-cradle__bob circle {
  fill: url(#mla-ball-gradient);
  stroke: rgba(177,221,225,.72);
  stroke-width: 1.7;
  vector-effect: non-scaling-stroke;
  filter: url(#mla-ball-shadow);
}
.mla-cradle__bob text {
  fill: #f7f7f3;
  font: 600 34px/1 "IBM Plex Mono",monospace;
  pointer-events: none;
}
.mla-cradle__pendulum { cursor: grab; outline: none; }
.mla-cradle__pendulum.is-dragging { cursor: grabbing; }
.mla-cradle__pendulum:focus-visible .mla-cradle__bob circle {
  stroke: #fff;
  stroke-width: 3;
}
.mla-cradle__pendulum:hover .mla-cradle__bob circle,
.mla-cradle__pendulum.is-dragging .mla-cradle__bob circle {
  fill: url(#mla-ball-active);
  stroke: #ffd66f;
}
.mla-cradle__pendulum:hover .mla-cradle__bob text,
.mla-cradle__pendulum.is-dragging .mla-cradle__bob text { fill: #10232d; }
.mla-cradle__trajectory {
  fill: none;
  stroke: rgba(255,179,0,.35);
  stroke-width: 1.3;
  stroke-dasharray: 4 8;
  vector-effect: non-scaling-stroke;
  pointer-events: none;
}
.mla-cradle__drag-label {
  fill: rgba(255,179,0,.68);
  font: 600 9px/1 "IBM Plex Mono",monospace;
  letter-spacing: .12em;
}
.mla-cradle__pendulum.is-hit .mla-cradle__bob circle {
  fill: url(#mla-ball-active);
  stroke: #ffb300;
  stroke-width: 3;
  filter: url(#mla-ball-shadow) drop-shadow(0 0 9px rgba(255,179,0,.7));
}
.mla-cradle__pendulum.is-hit .mla-cradle__bob text { fill: #ffb300; }
.mla-cradle__pendulum.is-wave .mla-cradle__bob circle {
  stroke: #ffb300;
  stroke-width: 2.6;
  filter: url(#mla-ball-shadow) drop-shadow(0 0 7px rgba(255,179,0,.62));
}
.mla-cradle__pendulum.is-wave .mla-cradle__bob text { fill: #fff3c7; }

.mla-cradle__response {
  position: absolute;
  left: 20px;
  right: 20px;
  bottom: 46px;
  display: flex;
  justify-content: space-between;
  gap: 20px;
  padding-top: 14px;
  border-top: 1px solid rgba(151,205,211,.16);
  color: rgba(255,255,255,.38);
  font: 600 9px/1.35 "IBM Plex Mono",monospace;
  letter-spacing: .08em;
  transition: color .35s ease;
}
.mla-cradle__response strong { color: inherit; font-weight: 600; }
.mla-cradle__machine[data-cradle-state="response"] .mla-cradle__response { color: #ffb300; }
.mla-cradle__legend {
  display: grid;
  grid-template-columns: auto 1fr auto 1fr auto 1fr auto 1fr auto;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 0 18px;
  border-top: 1px solid rgba(151,205,211,.18);
  color: rgba(255,255,255,.42);
  font: 500 8px/1 "IBM Plex Mono",monospace;
  letter-spacing: .08em;
}
.mla-cradle__legend i { height: 1px; background: rgba(151,205,211,.18); }

/* Keep the capability titles legible on the dark laboratory section. */
body .ml-site.ml-about--v2 .mla-capabilities__intro h2,
body .ml-site.ml-about--v2 .mla-capabilities__list h3 {
  color: #f7f7f3 !important;
  opacity: 1;
}

/* The kinetic model is the hero visual: one statement, one interaction, one block. */
.ml-about--v2 .mla-hero__cradle {
  position: relative;
  z-index: 1;
  align-self: center;
  width: 100%;
  min-height: 0;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 48%,rgba(97,194,200,.08),transparent 48%),
    rgba(6,24,32,.42);
}
@media (min-width: 1051px) {
  .ml-about--v2 .mla-hero {
    grid-template-columns: minmax(0,1fr) minmax(520px,1fr);
    gap: clamp(32px,4vw,68px);
  }
  .ml-about--v2 .mla-hero__cradle { transform: scale(1.035); transform-origin: center right; }
}
.ml-about--v2 .mla-hero__cradle::before {
  content: "06";
  position: absolute;
  right: 18px;
  top: 64px;
  color: rgba(247,247,243,.025);
  font: 700 clamp(100px,10vw,176px)/1 "IBM Plex Mono",monospace;
  pointer-events: none;
}
.ml-about--v2 .mla-hero__cradle .mla-cradle__svg {
  aspect-ratio: 2 / 1;
  min-height: 0;
}

@media (max-width: 1050px) {
  .ml-about--v2 .mla-cradle { grid-template-columns: 1fr; min-height: 0; }
  .mla-cradle__copy { display: grid; grid-template-columns: 1fr 1fr; gap: 0 32px; align-items: end; }
  .mla-cradle__copy .ml-eyebrow { grid-column: 1 / -1; }
  .mla-cradle__copy h2 { margin-bottom: 0; }
  .mla-cradle__instruction { grid-column: 2; margin-top: 20px; }
  .ml-about--v2 .mla-hero__cradle { width: min(100%,860px); justify-self: center; }
}

@media (max-width: 680px) {
  .ml-about--v2 .mla-cradle { padding-top: 72px; padding-bottom: 72px; gap: 38px; }
  .mla-cradle__copy { display: block; }
  body .ml-site.ml-about--v2 .mla-cradle__copy h2 { font-size: 50px; margin-bottom: 22px; }
  .mla-cradle__instruction { margin-top: 28px; }
  .mla-cradle__machine { margin-inline: -10px; }
  .mla-cradle__readout { padding-inline: 12px; font-size: 8px; }
  .mla-cradle__svg { min-height: 330px; object-fit: cover; object-position: center; }
  .mla-cradle__response { left: 12px; right: 12px; bottom: 43px; font-size: 7px; }
  .mla-cradle__legend { padding-inline: 10px; gap: 5px; font-size: 6px; }
  .ml-about--v2 .mla-hero__cradle { margin-inline: 0; }
  .ml-about--v2 .mla-hero__cradle .mla-cradle__svg {
    min-height: 280px;
    aspect-ratio: auto;
    object-fit: cover;
    object-position: center;
  }
  .ml-about--v2 .mla-hero__cradle .mla-cradle__readout span { max-width: 68%; line-height: 1.35; }
}

@media (prefers-reduced-motion: reduce) {
  .mla-cradle__pendulum,
  .mla-cradle__bob,
  .mla-cradle__response { transition: none !important; animation: none !important; }
  .mla-cradle__instruction span { font-size: 0; }
  .mla-cradle__instruction span::after { content: "SISTEMA CINÉTICO"; font-size: 11px; }
  .mla-cradle__pendulum { cursor: default; }
}