/* Efeitos da loja (aprovados no teste de 21/10): peça voando até a sacola, bilhete, corações ao favoritar, etiqueta de preço */
/* 4. etiqueta pendurada */
.card:not(.na-tela) .preco{animation:none !important}
.card .preco{position:relative;display:inline-flex;flex-direction:column;align-items:flex-start;gap:1px;margin:18px 0 6px 6px;padding:6px 14px 7px 24px;
  isolation:isolate;transform-origin:11px -20px;animation:etiq-balanca 3.2s ease-in-out infinite;color:#815636;line-height:1.1}
.card:nth-child(3n+1) .preco{animation-delay:-1.1s}.card:nth-child(3n+2) .preco{animation-delay:-2.2s}
.card .preco::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:0 6px 6px 0;
  background:radial-gradient(circle at 11px 50%,transparent 3.5px,#815636 4px 5px,transparent 5.5px),#FBE7A5;
  clip-path:polygon(13px 0,100% 0,100% 100%,13px 100%,0 50%);filter:drop-shadow(0 3px 3px rgba(46,26,28,.18))}
.card .preco::after{content:"";position:absolute;z-index:-2;left:10px;top:-20px;width:2px;height:28px;background:#815636;opacity:.7;border-radius:2px;rotate:-14deg;transform-origin:50% 0}
.card:hover .preco{animation:etiq-mexe .9s ease-out}
.card .preco .parc{font-size:.74rem;font-weight:600;opacity:.8}
@keyframes etiq-balanca{50%{rotate:-4deg}0%,100%{rotate:3deg}}
@keyframes etiq-mexe{0%{rotate:3deg}25%{rotate:-11deg}50%{rotate:7deg}75%{rotate:-3deg}100%{rotate:3deg}}
/* preço antigo riscado à mão */
.preco s,.pd-preco s{text-decoration:none;position:relative;opacity:.65}
.preco s::after,.pd-preco s::after{content:"";position:absolute;left:-3px;right:-3px;top:45%;height:9px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 12' preserveAspectRatio='none'%3E%3Cpath d='M2 8C25 3 55 9 98 3' stroke='%23D1357A' stroke-width='3.2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") 0 0/100% 100%}
/* 1. peça voando: .voo anda no X, .voo-y no Y (arco), .voo-c gira/encolhe */
.voo,.voo-y{position:fixed;z-index:400;pointer-events:none;left:0;top:0}
.voo-y{position:absolute}
.voo-c{overflow:hidden;background:#fff;box-shadow:0 18px 30px -12px rgba(46,26,28,.55);border:3px solid #fff}
.voo-c img,.voo-c svg{display:block;width:100%;height:100%;object-fit:cover}
html.voando #btn-sacola.pulo{animation:none}
#btn-sacola.pousou{animation:pousou .6s cubic-bezier(.3,1.6,.5,1)}
#flut.pousou{animation:pousou-barra .5s cubic-bezier(.3,1.6,.5,1)}
@keyframes pousou{0%{scale:1}22%{scale:1.22 .78}48%{scale:.9 1.14;rotate:-6deg}72%{scale:1.05 .96;rotate:3deg}100%{scale:1}}
@keyframes pousou-barra{0%{scale:1}30%{scale:1.04 .9}65%{scale:.98 1.05}100%{scale:1}}
.badge.conta{animation:conta .5s cubic-bezier(.3,1.8,.5,1)}
@keyframes conta{0%{scale:.2}60%{scale:1.4}100%{scale:1}}
.faisca{position:fixed;z-index:410;pointer-events:none;width:8px;height:8px;margin:-4px 0 0 -4px;border-radius:2px;background:var(--c)}
.faisca.redonda{border-radius:50%}
.faisca.cor{background:none;color:var(--c);width:auto;height:auto;margin:-9px 0 0 -6px;font-size:14px;line-height:1}
.mais1{position:fixed;z-index:410;pointer-events:none;font-weight:800;font-size:.95rem;line-height:1;color:#D1357A;margin:-30px 0 0 6px}
/* 2. bilhete */
.bilhete{position:fixed;z-index:380;right:18px;top:78px;width:min(330px,calc(100vw - 32px));display:grid;grid-template-columns:62px 1fr;gap:10px 12px;align-items:center;
  padding:16px 14px 14px;background:#FEF6ED;color:#815636;border-radius:4px;rotate:-1.5deg;box-shadow:0 18px 34px -16px rgba(46,26,28,.55),0 1px 0 rgba(46,26,28,.08);
  background-image:repeating-linear-gradient(transparent 0 23px,rgba(15,156,146,.13) 23px 24px);opacity:0;translate:0 -14px;transition:opacity .25s,translate .35s cubic-bezier(.3,1.5,.5,1)}
.bilhete.on{opacity:1;translate:0 0}
.bilhete::before{content:"";position:absolute;left:50%;top:-11px;width:84px;height:22px;translate:-50% 0;rotate:3deg;background:rgba(206,234,54,.75);
  clip-path:polygon(3% 0,97% 4%,100% 50%,96% 100%,2% 96%,0 50%)}
.bil-foto{width:62px;height:78px;border-radius:3px;overflow:hidden;background:#fff;border:3px solid #fff;box-shadow:0 4px 10px -4px rgba(46,26,28,.4);rotate:-3deg}
.bil-foto img,.bil-foto svg{display:block;width:100%;height:100%;object-fit:cover}
.bil-txt b{display:block;font:600 1.25rem/1.1 'Caveat',cursive;color:#D1357A;font-size:1.55rem}
.bil-txt span{display:block;font-size:.84rem;line-height:1.3;color:#2E1A1C;margin-top:2px}
.bil-txt small{display:block;font-size:.78rem;opacity:.8;margin-top:1px}
.bil-bts{grid-column:1/-1;display:flex;gap:8px}
.bil-bts button{flex:1;min-height:44px;border-radius:99px;font:inherit;font-weight:800;font-size:.86rem;cursor:pointer;border:2px solid #815636;background:transparent;color:#815636}
.bil-bts .bil-ver{background:#D1357A;border-color:#D1357A;color:#fff;box-shadow:3px 3px 0 #815636}
@media (max-width:760px){.bilhete{right:16px;left:16px;width:auto;top:auto;bottom:calc(84px + env(safe-area-inset-bottom));translate:0 14px}.bilhete.on{translate:0 0}}
@media (prefers-reduced-motion:reduce){.card .preco{animation:none}.bilhete{transition:opacity .2s;translate:none}}
