:root { font-family: 'Vazirmatn', system-ui, sans-serif; }
* { box-sizing: border-box; }
body { -webkit-font-smoothing: antialiased; }

.skeleton {
  background: linear-gradient(90deg, #eef2f7 25%, #e2e8f0 37%, #eef2f7 63%);
  background-size: 400% 100%;
  animation: skeleton-loading 1.4s ease infinite;
}
@keyframes skeleton-loading {
  0% { background-position: 100% 50%; }
  100% { background-position: 0 50%; }
}

::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 8px; }
::-webkit-scrollbar-track { background: transparent; }

.status-badge { display:inline-flex; align-items:center; gap:.35rem; padding:.25rem .65rem; border-radius:9999px; font-size:.75rem; font-weight:600; }

.fade-in { animation: fadeIn .25s ease; }
@keyframes fadeIn { from { opacity:0; transform: translateY(4px);} to { opacity:1; transform:none; } }

input:focus, select:focus, textarea:focus { outline: none; box-shadow: 0 0 0 3px rgba(37,99,235,.15); border-color:#2563eb; }

.card-hover { transition: box-shadow .15s ease, transform .15s ease; }
.card-hover:hover { box-shadow: 0 8px 24px rgba(15,23,42,.08); transform: translateY(-1px); }

/* Landing hero motion image (Ken Burns zoom + pan) */
.hero-kenburns {
  background-size: cover;
  background-position: center;
  animation: kenburns 22s ease-in-out infinite alternate;
  will-change: transform;
}
@keyframes kenburns {
  0%   { transform: scale(1) translate(0, 0); }
  50%  { transform: scale(1.12) translate(-1.5%, -1%); }
  100% { transform: scale(1.05) translate(1.5%, 1%); }
}
.hero-shine {
  background: linear-gradient(120deg, transparent 20%, rgba(255,255,255,.10) 45%, transparent 60%);
  background-size: 250% 250%;
  animation: heroShine 8s ease-in-out infinite;
  mix-blend-mode: overlay;
  pointer-events: none;
}
@keyframes heroShine {
  0%   { background-position: 0% 0%; }
  50%  { background-position: 100% 100%; }
  100% { background-position: 0% 0%; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-kenburns, .hero-shine { animation: none; }
}
