/* Entrada (única): bolsa de pruebas a la izquierda, formulario a la derecha */
#buy { position: relative; display: grid; grid-template-columns: minmax(0, 360px) 1fr; gap: 48px; align-items: start; }
#buy > .bag { rotate: -1.5deg; }
.price { font-size: 2.4rem; font-weight: 800; color: var(--text); }
.bag ul { padding-left: 18px; color: var(--muted); margin-top: 8px; }
/* Entradas como bolsas de pruebas */
.bag { position: relative; overflow: hidden; padding-top: 0; background: linear-gradient(160deg, #ffffff12, #ffffff04 45%, #ffffff0b); border-color: #ffffff26; }
.bag::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(115deg, transparent 30%, #ffffff10 38%, transparent 46%); }
.seal { margin: 0 -24px 20px; padding: 8px 0 12px; background: #c81e1e; color: #fff; font-size: .68rem; font-weight: 800; letter-spacing: .3em; text-transform: uppercase; text-align: center; position: relative; }
.seal::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 5px; background: repeating-linear-gradient(90deg, #00000055 0 2px, transparent 2px 5px); }
.tag { display: grid; grid-template-columns: 1fr auto; gap: 2px 8px; background: #f1ede3; color: #333; font-family: "Special Elite", monospace; font-size: .78rem; padding: 10px 14px 6px; rotate: -1.5deg; margin-bottom: 16px; box-shadow: 0 4px 12px #0006; }
.tag small { grid-column: 1 / -1; border-top: 1px dashed #0003; padding-top: 6px; margin-top: 4px; }
.tag h3 { grid-column: 1 / -1; margin: 0; font: 400 1.5rem/1.2 "Permanent Marker", cursive; color: #1a1a1a; }
.buy { display: grid; gap: 16px; }
.total { font-size: 1.2rem; margin-top: 8px; }
.total b { color: var(--orange); font-size: 1.6rem; }
.note { color: var(--muted); font-size: .85rem; }
.stamp { position: fixed; left: 50%; top: 50%; z-index: 60; pointer-events: none; opacity: 0; translate: -50% -50%; rotate: -12deg;
  font-family: "Special Elite", monospace; font-size: clamp(2.2rem, 8vw, 4.5rem); text-transform: uppercase; color: #e11d2e; text-align: center; line-height: 1;
  border: 6px double #e11d2e; border-radius: 10px; padding: 14px 28px; background: #0b0a0fcc; white-space: nowrap;
  -webkit-mask: radial-gradient(circle at 30% 40%, #000 60%, #000c 75%, #0008); }
.stamp small { display: block; font-size: .3em; letter-spacing: .2em; margin-top: 8px; }
.stamp.on { animation: stamp .45s cubic-bezier(.2, 1.6, .4, 1) forwards; }
@keyframes stamp { from { opacity: 0; scale: 3; } to { opacity: 1; scale: 1; } }

@media (prefers-reduced-motion: reduce) { .stamp.on { animation: none; opacity: 1; } }

@media (max-width: 640px) {
  #buy { grid-template-columns: 1fr; gap: 36px; }
  #buy > .bag { rotate: 0deg; }
  #buy button[type=submit] { width: 100%; padding: 16px; }
}

/* Panel de pago por Bizum (aparece al reservar) */
.pay { display: grid; gap: 16px; border: 1px dashed var(--orange); border-radius: var(--radius); padding: 24px; background: #ff7a1a0d; }
.pay h3 { font-size: 1.3rem; }
.pay dl { display: grid; gap: 10px; }
.pay dl div { display: flex; justify-content: space-between; align-items: center; gap: 12px; border-bottom: 1px solid var(--line); padding-bottom: 10px; }
.pay dt { color: var(--muted); font-size: .9rem; }
.pay dd { margin: 0; display: flex; align-items: center; gap: 10px; font-weight: 800; font-size: 1.15rem; }
.pay dd b { font-family: "Special Elite", monospace; color: var(--orange); letter-spacing: .05em; }
.pay dd button { background: var(--card); color: var(--text); border: 1px solid var(--line); border-radius: 8px; padding: 6px 10px; font: 600 .8rem Inter, sans-serif; cursor: pointer; }
.pay-warn { color: var(--orange); font-weight: 600; font-size: .9rem; }
.pay .btn { text-align: center; }
.mine { font-size: .9rem; color: var(--muted); }
.mine a { color: var(--orange); }
.pay .btn:disabled, #buy button:disabled { opacity: .6; cursor: wait; }