/* Pelican Loyalty v2.14.1: kiosk spacing, safe-area and motion refinement. */

.kiosk-header {
  padding-top: calc(18px + env(safe-area-inset-top));
  padding-right: max(clamp(18px, 4vw, 44px), env(safe-area-inset-right));
  padding-left: max(clamp(18px, 4vw, 44px), env(safe-area-inset-left));
  border-bottom: 0 !important;
}

.kiosk-open-home > .kiosk-open-hero .lead {
  margin-top: clamp(22px, 2.2vw, 28px);
}

.kiosk-open-home > .kiosk-open-hero .actions {
  margin-top: clamp(30px, 3vw, 38px);
}

.kiosk-speed-note {
  margin-top: clamp(20px, 2vw, 26px);
}

/* Keep the card still between turns. The previous float and turn both wrote
   to transform, which caused the visible jump at the start and end. */
.kiosk-stampcard-object {
  animation: none !important;
  transform: rotateX(var(--tilt-x, 0deg)) rotateY(var(--tilt-y, 0deg)) rotate(1.2deg);
  transform-origin: 50% 50%;
  backface-visibility: visible;
}

.kiosk-stampcard-visual.is-axis-turning .kiosk-stampcard-object {
  animation: kioskStampcardVerticalTurn 1.9s cubic-bezier(.45, .02, .2, 1) both !important;
  will-change: transform;
}

@keyframes kioskStampcardVerticalTurn {
  0% {
    transform: rotateX(0deg) rotateY(0deg) rotate(1.2deg) scale(1);
  }
  11% {
    transform: rotateX(0deg) rotateY(-9deg) rotate(1.2deg) scale(1.018);
  }
  46% {
    transform: rotateX(0deg) rotateY(184deg) rotate(.5deg) scale(.976);
  }
  75% {
    transform: rotateX(0deg) rotateY(347deg) rotate(1deg) scale(1.012);
  }
  89% {
    transform: rotateX(0deg) rotateY(363deg) rotate(1.2deg) scale(.998);
  }
  100% {
    transform: rotateX(0deg) rotateY(360deg) rotate(1.2deg) scale(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  .kiosk-stampcard-visual.is-axis-turning .kiosk-stampcard-object {
    animation: none !important;
  }
}