/* Carimbo com ilustração animada (padrão nível A, 06/11/2026). Troque as variáveis pelos tokens do cliente.
   Estrutura: <li data-carimbo style="--i:0"><span class="carimbo-il"><svg class="il il-x">…</svg></span>…</li>
   Classes postas pelo carimbo.js: .viva (item na tela: anima), .carimbou (entrada), .carimbado (trava: estado final). */
:root { --carimbo-fundo: #EEF6F7; --carimbo-traco: rgba(0,0,0,.45); --carimbo-anel: rgba(0,0,0,.2); --carimbo-papel: #fff; --carimbo-tam: 100px; --il-tam: 74px; }
.carimbo-il { display: grid; place-items: center; width: var(--carimbo-tam); height: var(--carimbo-tam); border-radius: 50%; overflow: hidden;
  background: var(--carimbo-fundo); border: 2px dashed var(--carimbo-traco); rotate: -6deg;
  box-shadow: inset 0 0 0 5px var(--carimbo-papel), inset 0 0 0 6.5px var(--carimbo-anel); }
[data-carimbo]:nth-child(even) .carimbo-il { rotate: 5deg; }
.carimbou .carimbo-il { animation: carimba .55s cubic-bezier(.3,1.6,.5,1) both; animation-delay: calc(var(--i, 0) * 140ms); }
.carimbado .carimbo-il { animation: none; }
@keyframes carimba { 0% { scale: 1.6; opacity: 0; } 60% { scale: .92; opacity: 1; } 100% { scale: 1; } }
.il { width: var(--il-tam); height: var(--il-tam); overflow: visible; }
.il * { animation-play-state: paused !important; }
.viva .il * { animation-play-state: running !important; }
@media (prefers-reduced-motion: reduce) {
  .il *, .carimbou .carimbo-il { animation: none !important; }
}