/* Rose Bronze R3 — window-scroll procedure stack, progressively enhanced on mobile. */
@media (max-width: 767px) {
  /* The supplied photographs stay intact: reveal the full façade logo and cabin. */
  .space-gallery .space-photo:nth-child(2),
  .space-gallery .space-photo:nth-child(3) {
    height: auto;
    min-height: 0;
    aspect-ratio: auto;
    background: var(--color-sand-warm);
  }

  .space-gallery .space-photo:nth-child(2) img,
  .space-gallery .space-photo:nth-child(3) img {
    width: 100%;
    height: auto;
    object-fit: contain;
    object-position: center;
    transform: none;
  }
}

@media (max-width: 767px) and (prefers-reduced-motion: no-preference) {
  .services-grid.procedures-stack-active {
    display: block;
    isolation: isolate;
    overflow: visible;
    padding-bottom: 1rem;
  }

  /* Real flow content gives the final sticky card room to settle before release. */
  .services-grid.procedures-stack-active::after {
    content: "";
    display: block;
    height: calc(var(--stack-step) + 1rem);
  }

  .procedures-stack-active .service-card,
  .procedures-stack-active .service-card.featured {
    display: flex;
    position: sticky;
    top: calc(var(--stack-top) + var(--stack-index) * var(--stack-step));
    z-index: calc(var(--stack-index) + 1);
    min-height: var(--stack-card-height);
    height: auto;
    margin: 0;
    flex-direction: column;
    background: var(--color-sand-card);
    border: 1px solid rgba(158, 107, 90, .28);
    border-radius: 16px;
    box-shadow: 0 8px 22px rgba(36, 28, 26, .11);
    transform-origin: 50% 0;
    transition: none;
    will-change: transform;
  }

  .procedures-stack-active .service-card + .service-card {
    margin-top: 4.5rem;
  }

  .procedures-stack-active .service-card > .service-title {
    display: flex;
    align-items: center;
    min-height: var(--stack-step);
    margin: 0;
    padding: .55rem 1rem;
    border-bottom: 1px solid var(--color-border);
    color: var(--color-terracotta-dark);
    font-size: 1.08rem;
    font-weight: 600;
    line-height: 1.25;
    background: var(--color-sand-bg);
  }

  .procedures-stack-active .service-image-box,
  .procedures-stack-active .service-card.featured .service-image-box {
    width: 100%;
    height: clamp(155px, calc(var(--stack-card-height) * .42), 240px);
    min-height: 0;
    flex: 0 0 auto;
  }

  .procedures-stack-active .service-image-box img,
  .procedures-stack-active .service-card:hover .service-image-box img {
    transform: none;
  }

  .procedures-stack-active .service-card:first-child .service-image-box img {
    object-position: center 36%;
  }

  .procedures-stack-active .service-body {
    flex: 1 0 auto;
    padding: 1rem;
  }

  .procedures-stack-active .service-desc {
    margin-bottom: 1rem;
    font-size: 1rem;
    line-height: 1.5;
  }

  .procedures-stack-active .service-btn {
    width: 100%;
    min-height: 44px;
    padding: .75rem 1rem;
    touch-action: manipulation;
  }

  .procedures-stack-active .service-card[data-stack-covered="true"] {
    border-color: rgba(158, 107, 90, .4);
  }
}