/* Approved editorial refinement. Original structure and palette remain. */
.hero-image-label {
  right: auto;
  width: fit-content;
  max-width: calc(100% - 56px);
  padding: 12px 15px;
  gap: 12px;
  background: #20362AC9;
  border: 1px solid #B6E2C138;
  border-radius: 5px 22px 5px 5px;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  box-shadow: 0 5px 18px #14251B24;
}
.hero-image-label .label-arrow { margin-left: 20px; }

/* A single, slower signal keeps the photograph and message in the foreground. */
html.motion-interactive .network-signal.signal-branch,
html.motion-interactive .network-signal.signal-return,
html.motion-interactive .network-halo {
  display: none;
}
html.motion-interactive .network-signal.signal-trunk {
  animation-duration: 10500ms;
  stroke-width: 2.2;
  opacity: .8;
}

/* More precise surface feedback; typography, content and bento geometry stay. */
.solution-card::after {
  inset: 0 auto 0 0;
  width: 2px;
  height: 100%;
  background: var(--prado);
  transform: scaleY(0);
  transform-origin: left top;
  transition: transform 550ms var(--motion-ease);
}
.solution-card:nth-child(1)::after,
.solution-accent::after { background: var(--menta); }
.button > span,
.text-link > span { transition: translate 350ms var(--motion-ease); }

@media (hover: hover) and (pointer: fine) {
  html.motion-interactive:not(.motion-paused) .solution-card:hover {
    translate: 0 -3px;
    box-shadow: 0 14px 28px #2C353E0D;
  }
  html.motion-interactive:not(.motion-paused) .solution-card:hover::before {
    transform: scale(1.06) rotate(-2deg);
    opacity: .5;
  }
  html.motion-interactive:not(.motion-paused) .solution-card:hover::after {
    transform: scaleY(1);
  }
  html:not(.motion-paused) .button:hover > span,
  html:not(.motion-paused) .text-link:hover > span { translate: 3px -3px; }
}

/* This dot uses exactly the same elapsed time as the existing stage progress. */
.timeline-route .route-pulse { display: none; }
.timeline-route .route-signal-dot {
  display: none;
  fill: var(--arandano);
  stroke: var(--perla);
  stroke-width: 1.8;
  transform: translate(28px, 157px);
}
.method-timeline.is-ready .route-signal-dot { display: block; }

@media (max-width: 760px) {
  .hero-image-label { max-width: calc(100% - 44px); padding: 10px 12px; }
  .hero-image-label .label-arrow { margin-left: 9px; }
}
html.motion-paused .solution-card::after { transform: scaleY(0); }
html.motion-paused :is(.button > span, .text-link > span) { translate: none; }
@media (prefers-reduced-motion: reduce) {
  .solution-card::after { transform: scaleY(0); }
  .button > span, .text-link > span { transition: none; translate: none; }
}