.proposal-service-card:not(.proposal-service-card--apps) > img {
  background:
    radial-gradient(circle at 78% 18%, rgba(99, 228, 236, .2), transparent 34%),
    linear-gradient(145deg, var(--navy-soft), var(--navy-deep));
  object-fit: contain;
}

[data-proposal][data-layout="image-first"] .proposal-service-card:not(.proposal-service-card--apps) > img {
  object-fit: contain;
}

.proposal-service-card--apps {
  grid-column: 1 / -1;
  justify-self: center;
  width: calc(50% - 8px);
}

.proposal-service-apps-visual {
  position: relative;
  display: grid;
  width: 100%;
  aspect-ratio: 1.55 / 1;
  place-items: center;
  overflow: hidden;
  background:
    radial-gradient(circle at 78% 18%, rgba(99, 228, 236, .2), transparent 34%),
    linear-gradient(145deg, var(--navy-soft), var(--navy-deep));
}

.proposal-service-apps-visual::before,
.proposal-service-apps-visual::after {
  position: absolute;
  width: 42%;
  aspect-ratio: 1;
  border: 1px solid rgba(99, 228, 236, .14);
  border-radius: 50%;
  content: "";
}

.proposal-service-apps-visual::before { top: -25%; right: -8%; }
.proposal-service-apps-visual::after { bottom: -45%; left: -14%; width: 55%; }

.proposal-service-apps-visual img {
  position: relative;
  z-index: 1;
  display: block;
  width: min(80%, 470px);
  height: auto;
  max-height: 92%;
  object-fit: contain;
}

[data-proposal][data-layout="image-first"] .proposal-service-card--apps {
  grid-column: 4 / span 6;
  width: auto;
}

[data-proposal][data-layout="image-first"] .proposal-service-card--apps .proposal-service-apps-visual {
  grid-area: image;
  height: 100%;
  min-height: 330px;
  aspect-ratio: auto;
}

@media (max-width: 900px) {
  .proposal-service-card--apps { width: 100%; }

  [data-proposal][data-layout="image-first"] .proposal-service-card--apps {
    grid-column: span 2;
    width: calc(50% - 9px);
  }

  [data-proposal][data-layout="image-first"] .proposal-service-card--apps .proposal-service-apps-visual {
    height: auto;
    min-height: 0;
    aspect-ratio: 1.45 / 1;
  }
}

@media (max-width: 560px) {
  .proposal-service-card--apps { grid-column: 1 / -1; width: 100%; }

  [data-proposal][data-layout="image-first"] .proposal-service-card--apps {
    grid-column: span 1;
    width: 100%;
  }

  [data-proposal][data-layout="image-first"] .proposal-service-card--apps .proposal-service-apps-visual {
    aspect-ratio: 1.28 / 1;
  }
}
