/* Full library images, without a framed control strip. */
.hero-gallery {
  position:relative;
  width:100%;
  min-width:0;
  align-self:center;
  border:0;
  border-radius:16px;
  overflow:hidden;
  background:transparent;
  box-shadow:0 18px 48px rgba(0,0,0,.16);
}
.gallery-stage { display:grid; aspect-ratio:1004 / 768; position:relative; overflow:hidden; }
.gallery-slide { grid-area:1 / 1; display:block; width:100%; height:100%; object-fit:contain; opacity:0; transition:opacity 650ms ease; }
.gallery-slide.is-active { opacity:1; }
.gallery-arrow {
  position:absolute;
  top:50%;
  z-index:2;
  display:grid;
  place-items:center;
  width:44px;
  height:44px;
  padding:0;
  border:0;
  border-radius:50%;
  color:var(--text);
  background:color-mix(in srgb,var(--bg) 82%,transparent);
  backdrop-filter:blur(8px);
  cursor:pointer;
  opacity:0;
  pointer-events:none;
  transform:translateY(-50%);
  transition:opacity 180ms ease,background-color 180ms ease;
}
.gallery-prev { left:12px; }
.gallery-next { right:12px; }
.gallery-arrow svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.hero-gallery:hover .gallery-arrow,
.hero-gallery:focus-within .gallery-arrow { opacity:1; pointer-events:auto; }
.gallery-arrow:hover { background:var(--surface-hover); }
.gallery-arrow:active { background:var(--surface2); }
.gallery-arrow:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.gallery-status { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
/* The hero and product introduction share one uninterrupted background. */
.connections { border-top:0; min-height:0; overflow:hidden; }
.connections-layout { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:64px; align-items:center; }
.connections-copy h2 { margin:0 0 24px; max-width:12em; text-wrap:balance; }
.connections-copy p { color:var(--sub); line-height:1.8; max-width:38ch; margin:0 0 28px; }
.connections .platform-map { width:100%; max-width:760px; justify-self:end; margin:0; transform:none; }

@media(max-width:1100px) {
  .connections-layout { grid-template-columns:1fr; gap:36px; }
  .connections .platform-map { justify-self:center; }
  .connections-copy { max-width:650px; }
}
@media(max-width:899px) { .hero-gallery { max-width:620px; margin-inline:auto; } }
@media(max-width:600px) {
  .hero-gallery { border-radius:12px; }
  .gallery-prev { left:8px; }
  .gallery-next { right:8px; }
  .connections-layout { gap:28px; }
}
@media(hover:none), (pointer:coarse) { .gallery-arrow { opacity:1; pointer-events:auto; } }
@media(prefers-reduced-motion:reduce) { .gallery-slide,.gallery-arrow { transition:none!important; } }
