.curv-configurator__visual .schraeger-curv-viewer,
.product-unified__demo-stage .schraeger-curv-viewer {
  position: absolute;
  z-index: 1;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  background: transparent;
  opacity: 0;
  pointer-events: none;
  touch-action: pan-y;
  transition: opacity .58s ease-in-out,
              transform .76s cubic-bezier(.22, 1, .36, 1);
}

.curv-configurator__visual > img[data-curv-image] {
  transition: opacity .36s ease, transform .75s cubic-bezier(.2, .7, .2, 1);
}
.product-unified__demo-stage > img[data-product-image] {
  transform: scale(.8);
  transition: opacity .36s ease, transform .75s cubic-bezier(.2, .7, .2, 1);
}

.curv-configurator__visual.is-3d-active > img[data-curv-image],
.product-unified__demo-stage.is-3d-active > img[data-product-image] {
  opacity: 0;
  pointer-events: none;
}

.curv-configurator__visual .schraeger-curv-viewer.is-active,
.product-unified__demo-stage .schraeger-curv-viewer.is-active {
  z-index: 2;
  opacity: 1;
  pointer-events: auto;
  transition: opacity .58s ease-in-out,
              transform .76s cubic-bezier(.22, 1, .36, 1);
}

.curv-configurator__visual-copy,
.product-unified__demo-mark,
.product-unified__demo-caption { z-index: 3; }
.curv-configurator__colors { z-index: 4; }
.schraeger-curv-activate,
.schraeger-curv-hint { z-index: 5; }

.schraeger-curv-activate,
.schraeger-curv-hint {
  position: absolute;
  z-index: 5;
  right: clamp(16px, 2.4vw, 38px);
  bottom: clamp(84px, 6.8vw, 108px);
  max-width: calc(100% - 32px);
  margin: 0;
  padding: 10px 14px;
  border: 1px solid rgba(17, 24, 22, .22);
  border-radius: 999px;
  background: rgba(247, 244, 236, .9);
  color: #182221;
  box-shadow: 0 8px 25px rgba(17, 24, 22, .1);
  font: 650 .72rem/1.25 Manrope, Arial, sans-serif;
  white-space: nowrap;
}

.schraeger-curv-activate {
  cursor: pointer;
  transition: background .25s ease, color .25s ease, transform .25s ease;
}
.schraeger-curv-activate:hover,
.schraeger-curv-activate:focus-visible {
  transform: translateY(-3px);
  background: #111a18;
  color: #f2dfaF;
}

.schraeger-curv-hint[hidden] { display: none; }
.curv-configurator__visual .schraeger-curv-hint { right: clamp(16px, 2.4vw, 38px); }
.product-unified__demo-stage .schraeger-curv-hint {
  right: clamp(20px, 3vw, 66px);
  bottom: clamp(29px, 3vw, 64px);
}

@media (max-width: 700px) {
  .curv-configurator__visual .schraeger-curv-activate,
  .curv-configurator__visual .schraeger-curv-hint {
    right: 12px;
    bottom: 66px;
    padding: 7px 9px;
    font-size: .57rem;
  }
  .product-unified__demo-stage .schraeger-curv-hint {
    right: 16px;
    top: 68px;
    bottom: auto;
    padding: 7px 9px;
    font-size: .57rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .schraeger-curv-activate,
  .curv-configurator__visual .schraeger-curv-viewer,
  .product-unified__demo-stage .schraeger-curv-viewer,
  .curv-configurator__visual > img[data-curv-image],
  .product-unified__demo-stage > img[data-product-image] { transition: none; }
}

/* Align the orbiting view with the existing 2D product cutouts in each stage. */
.curv-configurator__visual .schraeger-curv-viewer {
  transform: translate(2.5%, calc(-2.5% + 8px)) scale(var(--curv-idle-scale-x, .985), var(--curv-idle-scale-y, .906));
}
.product-unified__demo-stage .schraeger-curv-viewer {
  transform: translate(3.5%, calc(-4.5% + 8px)) scale(var(--curv-idle-scale-x, .985), var(--curv-idle-scale-y, .985));
}
.curv-configurator__visual .schraeger-curv-viewer.is-active {
  transform: translate(2.5%, -2.5%) scale(var(--curv-active-scale-x, 1), var(--curv-active-scale-y, .92));
}
.product-unified__demo-stage .schraeger-curv-viewer.is-active {
  transform: translate(3.5%, -4.5%) scale(var(--curv-active-scale-x, 1), var(--curv-active-scale-y, 1));
}

html body.schraeger-global-theme main.product-unified .product-unified__visual .product-unified__visual-bottom a.product-unified__text-link:is(:hover, :focus-visible, :active) {
  transform: none !important;
}

main.product-unified .product-unified__demo-caption strong {
  margin-top: 10px;
  line-height: 1.25;
}

/* Bring the CURV-E controls into the rounded visual language of the site. */
.interactive-products .curv-configurator__visual-copy {
  border: 1px solid rgba(229, 208, 164, .22);
  border-radius: 16px;
}

.interactive-products .curv-configurator__colors {
  border-radius: 999px;
}

.interactive-products .curv-configurator__colors button {
  border-radius: 999px;
  transition: background .25s ease, border-color .25s ease, color .25s ease;
}

.interactive-products .curv-configurator__colors button:hover,
.interactive-products .curv-configurator__colors button:focus-visible {
  border-color: rgba(126, 99, 51, .38);
  background: rgba(17, 26, 24, .1);
}

.interactive-products .curv-configurator__colors button[aria-pressed="true"]:hover,
.interactive-products .curv-configurator__colors button[aria-pressed="true"]:focus-visible {
  background: #111a18;
}

.interactive-products .curv-configurator__colors i {
  border-radius: 50%;
}

.interactive-products .curv-configurator__variants {
  gap: 7px;
}

.interactive-products .curv-configurator__variants button {
  border: 1px solid rgba(17, 24, 22, .14);
  border-radius: 16px;
  background: rgba(255, 255, 255, .3);
  transition: background .25s ease, border-color .25s ease, color .25s ease;
}

.interactive-products .curv-configurator__variants button:hover,
.interactive-products .curv-configurator__variants button:focus-visible {
  border-color: rgba(157, 128, 74, .7);
  background: rgba(225, 205, 163, .28);
}

.interactive-products .curv-configurator__variants button[aria-pressed="true"] {
  border-color: #111a18;
  background: #111a18;
}

.interactive-products .curv-configurator__extra {
  border-radius: 16px;
  transition: background .25s ease, border-color .25s ease;
}

.interactive-products .curv-configurator__accept,
.interactive-products .curv-configurator__result-back {
  border-radius: 999px;
}

@media (prefers-reduced-motion: reduce) {
  .curv-configurator__visual .schraeger-curv-viewer.is-active,
  .product-unified__demo-stage .schraeger-curv-viewer.is-active { transition: none; }
}
