/* Tecno Banner by Tecnoambassador - animaciones de entrada (front y vista previa del back office) */
.tb-banner.tb-pre { opacity: 0; }

.tb-in {
  animation-duration: .9s;
  animation-fill-mode: both;
  animation-timing-function: cubic-bezier(.22, 1, .36, 1);
}
[data-entrance="fade"].tb-in       { animation-name: tb-k-fade; }
[data-entrance="fadeup"].tb-in     { animation-name: tb-k-fadeup; }
[data-entrance="fadedown"].tb-in   { animation-name: tb-k-fadedown; }
[data-entrance="zoom"].tb-in       { animation-name: tb-k-zoom; }
[data-entrance="bounce"].tb-in     { animation-name: tb-k-bounce; animation-duration: 1.1s; animation-timing-function: ease-out; }
[data-entrance="flip"].tb-in       { animation-name: tb-k-flip; }
[data-entrance="slideleft"].tb-in  { animation-name: tb-k-slideleft; }
[data-entrance="slideright"].tb-in { animation-name: tb-k-slideright; }
[data-entrance="blur"].tb-in       { animation-name: tb-k-blur; }

@keyframes tb-k-fade      { from { opacity: 0; } to { opacity: 1; } }
@keyframes tb-k-fadeup    { from { opacity: 0; transform: translateY(40px); } to { opacity: 1; transform: none; } }
@keyframes tb-k-fadedown  { from { opacity: 0; transform: translateY(-40px); } to { opacity: 1; transform: none; } }
@keyframes tb-k-zoom      { from { opacity: 0; transform: scale(.85); } to { opacity: 1; transform: none; } }
@keyframes tb-k-bounce {
  0%   { opacity: 0; transform: translateY(-70px); }
  35%  { opacity: 1; transform: translateY(16px); }
  55%  { transform: translateY(-9px); }
  75%  { transform: translateY(4px); }
  90%  { transform: translateY(-2px); }
  100% { opacity: 1; transform: none; }
}
@keyframes tb-k-flip      { from { opacity: 0; transform: perspective(900px) rotateX(-60deg); } to { opacity: 1; transform: none; } }
@keyframes tb-k-slideleft { from { opacity: 0; transform: translateX(-80px); } to { opacity: 1; transform: none; } }
@keyframes tb-k-slideright{ from { opacity: 0; transform: translateX(80px); } to { opacity: 1; transform: none; } }
@keyframes tb-k-blur      { from { opacity: 0; filter: blur(14px); transform: scale(1.04); } to { opacity: 1; filter: blur(0); transform: none; } }

@media (prefers-reduced-motion: reduce) {
  .tb-banner.tb-pre { opacity: 1; }
  .tb-in { animation: none !important; }
}
