/* 2 Blades Meat Company — "The Grade Stamp" (companion to motion.js) */
.stamp-veil {
  position: fixed; inset: 0; z-index: 90; pointer-events: none;
  background: radial-gradient(110% 90% at 50% 34%, #FBF4E3 0%, #F6EEDD 58%, #EBDCBC 100%);
  display: flex; align-items: center; justify-content: center;
  transition: opacity .7s ease, transform .7s ease;
}
.stamp-veil.stamp-lift { opacity: 0; transform: translateY(-2.5%); }
.stamp-stage { text-align: center; }
.stamp-hit { opacity: 0; transform: scale(2.3) rotate(-16deg); }
.stamp-veil.stamp-down .stamp-hit { animation: stamp-slam .55s cubic-bezier(.2,.9,.3,1) .15s forwards; }
@keyframes stamp-slam {
  0% { opacity: 0; transform: scale(2.3) rotate(-16deg); }
  55% { opacity: 1; transform: scale(.94) rotate(-8deg); }
  75% { transform: scale(1.04) rotate(-8.6deg); }
  100% { opacity: .94; transform: scale(1) rotate(-8deg); }
}
.stamp-caption {
  margin-top: 16px; font-family: 'Oswald', sans-serif; font-weight: 600;
  text-transform: uppercase; letter-spacing: .22em; font-size: 1rem; color: #2B2320;
  opacity: 0; animation: stamp-cap .8s ease .8s forwards;
}
@keyframes stamp-cap { to { opacity: .85; } }

.site-header { position: relative; }
.stamp-charm {
  position: absolute; left: 10px; top: 100%; z-index: 60;
  width: 40px; height: 40px; padding: 0; background: none; border: 0; cursor: pointer;
  transform: rotate(-8deg); opacity: .92;
  filter: drop-shadow(0 3px 4px rgba(43,35,32,.3));
}
.stamp-charm svg { display: block; }
.stamp-charm.slamming { animation: charm-slam .6s cubic-bezier(.2,.9,.3,1) 1; }
@keyframes charm-slam {
  0% { transform: rotate(-8deg) scale(1); }
  35% { transform: rotate(-13deg) scale(1.28); }
  60% { transform: rotate(-6deg) scale(.94); }
  100% { transform: rotate(-8deg) scale(1); }
}

.order-stamp {
  display: inline-block; margin: 12px auto 2px; padding: 6px 16px;
  border: 3px solid #A31621; border-radius: 6px; color: #A31621;
  font-family: 'Oswald', sans-serif; font-weight: 700; text-transform: uppercase;
  letter-spacing: .18em; font-size: 1rem; transform: rotate(-7deg);
  animation: stamp-slam .5s cubic-bezier(.2,.9,.3,1) 1;
}
#order-success { text-align: center; }

@media (prefers-reduced-motion: reduce) {
  .stamp-hit, .stamp-caption, .stamp-charm.slamming, .order-stamp { animation: none; }
  .stamp-hit { opacity: .94; transform: rotate(-8deg); }
  .stamp-caption { opacity: .85; }
}