/* Preserve the original screenshot proportions at every viewport width. */
.hero-screen img,
.showcase-image img,
.windows-visual img {
  width: 100%;
  height: auto;
}
.windows-visual .screenshot { width: 100%; }

/* Keep the complete dashboard inside the hero instead of clipping its right edge. */
.hero-screen {
  width: 100%;
  transform: perspective(1200px) rotateY(-3deg) rotateZ(-2deg);
}
.hero-screen:hover {
  transform: perspective(1200px) rotateY(-1deg) rotateZ(-1deg);
}
.floating-bottom { right: 0; }

.software-maker {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
  padding: 34px 6% 42px;
  border-top: 1px solid var(--line);
}
.software-maker p { margin: 0; color: var(--muted); font-size: 14px; }
.software-maker a {
  display: block;
  width: min(340px, 100%);
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  transition: transform .2s;
}
.software-maker a:hover { transform: translateY(-3px); }
.software-maker img { width: 100%; height: auto; }

@media (max-width: 760px) {
  .hero-screen { transform: rotate(-2deg); }
  .hero-screen:hover { transform: rotate(-1deg); }
  .floating-bottom { right: -6px; }
}