/* Logistics → Contact overlaps the two real sticky stages. Logistics keeps
   its complete frame for a dedicated reading hold, then its green benefits
   band hands its geometry to the real Contact advantages band. */
.scene--logistics.has-logistics-contact-transition {
  --logistics-contact-reserved-distance: 0px;
  --logistics-contact-source-background-opacity: 1;
  z-index: 9;
  min-height: calc(
    120svh
    + var(--products-logistics-transition-distance, 0px)
    + var(--logistics-contact-reserved-distance)
  );
}

.scene--contact.has-logistics-contact-transition {
  --logistics-contact-reserved-distance: 0px;
  --logistics-contact-overlap-distance: 0px;
  --logistics-contact-background-opacity: 0;
  z-index: 8;
  min-height: calc(
    120svh
    + var(--logistics-contact-reserved-distance)
  );
  margin-top: calc(0px - var(--logistics-contact-overlap-distance));
  background: transparent;
  isolation: isolate;
}

.scene--logistics.has-products-logistics-transition.has-logistics-contact-transition
  .logistics__stage::before {
  opacity: min(
    var(--products-logistics-background-opacity, 1),
    var(--logistics-contact-source-background-opacity)
  );
}

.scene--contact.has-logistics-contact-transition .contact__stage::before {
  position: absolute;
  z-index: 0;
  inset: 0;
  content: "";
  background:
    linear-gradient(rgb(36 53 43 / 3.5%) 0.0625rem, transparent 0.0625rem),
    linear-gradient(90deg, rgb(36 53 43 / 3.5%) 0.0625rem, transparent 0.0625rem),
    radial-gradient(circle at 52% 18%, rgb(201 164 92 / 12%), transparent 32rem),
    var(--bg-primary);
  background-size: 9.25rem 9.25rem, 9.25rem 9.25rem, auto, auto;
  opacity: var(--logistics-contact-background-opacity);
  pointer-events: none;
  will-change: opacity;
}

.scene--contact.has-logistics-contact-transition .contact__layout {
  z-index: 1;
}

/* While Products → Logistics owns the shared Logistics composition, keep the
   downstream scene out of the paint without mutating its timeline-owned
   children. Removing this gate restores even an unchanged Contact endpoint. */
.scene--contact.has-logistics-contact-transition.is-logistics-contact-upstream-concealed
  .contact__stage {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.scene--logistics.has-logistics-contact-transition .logistics__hero,
.scene--logistics.has-logistics-contact-transition .logistics__coverage,
.scene--logistics.has-logistics-contact-transition .logistics__benefits,
.scene--contact.has-logistics-contact-transition .contact__intro,
.scene--contact.has-logistics-contact-transition .contact__console,
.scene--contact.has-logistics-contact-transition .contact__advantages {
  will-change: opacity, transform;
}

.scene--logistics.has-logistics-contact-transition .logistics__hero,
.scene--logistics.has-logistics-contact-transition .logistics__coverage {
  will-change: opacity, transform, clip-path;
}

@media (max-width: 48rem) {
  .scene--logistics.has-logistics-contact-transition {
    min-height: calc(
      112svh
      + var(--products-logistics-transition-distance, 0px)
      + var(--logistics-contact-reserved-distance)
    );
  }

  .scene--contact.has-logistics-contact-transition {
    min-height: calc(
      112svh
      + var(--logistics-contact-reserved-distance)
    );
  }

  .scene--contact.has-logistics-contact-transition .contact__stage::before {
    background-size: 5rem 5rem, 5rem 5rem, auto, auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  .scene--logistics.has-logistics-contact-transition,
  .scene--contact.has-logistics-contact-transition {
    --logistics-contact-reserved-distance: 0px;
    --logistics-contact-overlap-distance: 0px;
    --logistics-contact-source-background-opacity: 1;
    --logistics-contact-background-opacity: 1;
    z-index: auto;
    min-height: 100svh;
    margin-top: 0;
  }

  .scene--contact.has-logistics-contact-transition {
    background:
      linear-gradient(rgb(36 53 43 / 3.5%) 0.0625rem, transparent 0.0625rem),
      linear-gradient(90deg, rgb(36 53 43 / 3.5%) 0.0625rem, transparent 0.0625rem),
      radial-gradient(circle at 52% 18%, rgb(201 164 92 / 12%), transparent 32rem),
      var(--bg-primary);
    background-size: 9.25rem 9.25rem, 9.25rem 9.25rem, auto, auto;
    isolation: auto;
  }

  .scene--contact.has-logistics-contact-transition .contact__stage::before {
    display: none;
  }

  .scene--logistics.has-logistics-contact-transition .logistics__hero,
  .scene--logistics.has-logistics-contact-transition .logistics__coverage,
  .scene--logistics.has-logistics-contact-transition .logistics__benefits,
  .scene--contact.has-logistics-contact-transition .contact__intro,
  .scene--contact.has-logistics-contact-transition .contact__console,
  .scene--contact.has-logistics-contact-transition .contact__advantages {
    will-change: auto;
  }
}