/* Subpage Hero 4J — "connected" presentation. Scoped to .subpage-hero-4j--connected; default 4J output is unaffected. */
.subpage-hero-4j--connected .subpage-hero-4j__content { align-items: center; }
.subpage-hero-4j--connected .subpage-hero-4j__content--graphic { width: 100%; min-width: 0; }
.subpage-hero-4j--connected .subpage-hero-4j__connected { width: 100%; min-width: 0; }
.subpage-hero-4j--connected .subpage-hero-4j__art { position: relative; width: 100%; max-width: 560px; aspect-ratio: 1 / .82; margin-left: auto; }
.subpage-hero-4j--connected .subpage-hero-4j__sq { position: absolute; border-radius: 24px; }
.subpage-hero-4j--connected .subpage-hero-4j__sq--lg { inset: 8% 14% 8% 14%; background: #688079; }
.subpage-hero-4j--connected .subpage-hero-4j__sq--a { width: 18%; aspect-ratio: 1; left: 4%; top: 18%; background: #829992; border-radius: 18px; }
.subpage-hero-4j--connected .subpage-hero-4j__sq--b { width: 14%; aspect-ratio: 1; right: 6%; bottom: 10%; background: #829992; border-radius: 16px; }
.subpage-hero-4j--connected .subpage-hero-4j__link-track { position: absolute; left: 6%; right: 6%; top: 46%; border-top: 2px solid #fff; }
.subpage-hero-4j--connected .subpage-hero-4j__link-track::before,
.subpage-hero-4j--connected .subpage-hero-4j__link-track::after { content: ""; position: absolute; top: -6px; width: 10px; height: 10px; border-radius: 50%; background: #fff; }
.subpage-hero-4j--connected .subpage-hero-4j__link-track::before { left: 0; }
.subpage-hero-4j--connected .subpage-hero-4j__link-track::after { right: 0; }
.subpage-hero-4j--connected .subpage-hero-4j__tile { position: absolute; top: 46%; display: grid; place-items: center; width: 34%; aspect-ratio: 1; transform: translateY(-50%); border-radius: 22px; background: #fff; box-shadow: 0 18px 40px rgb(0 0 0 / 18%); }
.subpage-hero-4j--connected .subpage-hero-4j__tile--primary { left: 10%; }
.subpage-hero-4j--connected .subpage-hero-4j__tile--primary img { width: 72%; height: auto; }
.subpage-hero-4j--connected .subpage-hero-4j__tile--partner { right: 10%; }
.subpage-hero-4j--connected .subpage-hero-4j__partner { position: absolute; inset: 0; display: grid; place-items: center; opacity: 0; transform: scale(.92); transition: opacity .5s ease, transform .5s ease; }
.subpage-hero-4j--connected .subpage-hero-4j__partner.is-on { opacity: 1; transform: none; }
.subpage-hero-4j--connected .subpage-hero-4j__partner img { width: 46%; height: 46%; object-fit: contain; }
@media (max-width: 900px) { .subpage-hero-4j--connected .subpage-hero-4j__art { margin: 24px auto 0; } }
@media (prefers-reduced-motion: reduce) { .subpage-hero-4j--connected .subpage-hero-4j__partner { transition: none; } }
/* Text leads when stacked; two columns from 1024px (default 4J switches at 1139px). */
.subpage-hero-4j--connected .subpage-hero-4j__content--text { order: 1; text-align: left; }
.subpage-hero-4j--connected .subpage-hero-4j__content--graphic { order: 2; }
@media (min-width: 1024px) and (max-width: 1138px) {
  .subpage-hero-4j--connected .subpage-hero-4j__content { grid-template-columns: 1.1fr 1fr; gap: 48px; }
}