/* ============================================================
   TERVAKU.COM — Animations & Utilities
   ============================================================ */

/* Pulse animation for badge dots */
@keyframes pulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.15); opacity: .7; }
}

/* Float for decorative elements */
@keyframes float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-12px); }
}

/* Shimmer for skeletons */
@keyframes shimmer {
  0% { background-position: -600px 0; }
  100% { background-position: 600px 0; }
}

/* Spin for loaders */
@keyframes spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

/* Slide-in from right */
@keyframes slideInRight {
  from { transform: translateX(60px); opacity: 0; }
  to { transform: translateX(0); opacity: 1; }
}

/* Counter pulse */
@keyframes counterPulse {
  0% { transform: scale(1); }
  50% { transform: scale(1.08); }
  100% { transform: scale(1); }
}

/* Hero badge pulse dot */
.live-dot {
  display: inline-block;
  width: 8px; height: 8px;
  background: var(--green-accent);
  border-radius: 50%;
  animation: pulse 2s infinite;
}

/* Float utility */
.float-anim { animation: float 4s ease-in-out infinite; }

/* Stagger delays for grids */
.stagger-1 { transition-delay: 0.05s; }
.stagger-2 { transition-delay: 0.10s; }
.stagger-3 { transition-delay: 0.15s; }
.stagger-4 { transition-delay: 0.20s; }
.stagger-5 { transition-delay: 0.25s; }
.stagger-6 { transition-delay: 0.30s; }

/* Divider styles */
.divider-green {
  width: 56px; height: 3px;
  background: linear-gradient(90deg, var(--green-accent), var(--gold));
  border-radius: 2px;
  margin: .8rem 0;
}

.divider-center {
  margin-left: auto;
  margin-right: auto;
}

/* Text utilities */
.text-green  { color: var(--green-mid); }
.text-accent { color: var(--green-accent); }
.text-gold   { color: var(--gold); }
.text-white  { color: var(--white); }
.text-gray   { color: var(--gray-mid); }

/* Background utilities */
.bg-platinum { background: var(--platinum); }
.bg-green    { background: var(--green-deep); }
.bg-white    { background: var(--white); }

/* Spacing helpers */
.mt-1 { margin-top: .5rem; }
.mt-2 { margin-top: 1rem; }
.mt-3 { margin-top: 1.5rem; }
.mt-4 { margin-top: 2rem; }
.mb-1 { margin-bottom: .5rem; }
.mb-2 { margin-bottom: 1rem; }
.mb-3 { margin-bottom: 1.5rem; }
.mb-4 { margin-bottom: 2rem; }

/* Flex utilities */
.flex       { display: flex; }
.flex-center { display: flex; align-items: center; justify-content: center; }
.gap-1 { gap: .5rem; }
.gap-2 { gap: 1rem; }

/* Hero scroll arrow bounce */
@keyframes bounce {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(8px); }
}

.scroll-arrow {
  position: absolute;
  bottom: 2.5rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 5;
  color: rgba(255,255,255,.55);
  font-size: 1.4rem;
  animation: bounce 2s ease-in-out infinite;
  cursor: pointer;
}

/* Overlay for mobile nav */
.nav-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.45);
  z-index: 999;
  opacity: 0;
  pointer-events: none;
  transition: opacity .3s ease;
}

.nav-overlay.show {
  opacity: 1;
  pointer-events: auto;
}

/* Notification toast */
.toast {
  position: fixed;
  bottom: 100px; right: 32px;
  background: var(--green-deep);
  color: var(--white);
  padding: .9rem 1.5rem;
  border-radius: var(--radius-md);
  font-size: .88rem;
  font-weight: 500;
  box-shadow: var(--shadow-lg);
  display: flex;
  align-items: center;
  gap: .6rem;
  z-index: 9999;
  transform: translateX(120%);
  transition: transform .4s cubic-bezier(.4,0,.2,1);
  max-width: 320px;
}

.toast.show { transform: translateX(0); }
.toast i { color: var(--green-accent); }

/* Horizontal divider */
hr.section-hr {
  border: none;
  height: 1px;
  background: var(--gray-light);
  margin: 2rem 0;
}

/* Skip link for accessibility */
.skip-link {
  position: absolute;
  top: -100px;
  left: 0;
  background: var(--green-deep);
  color: var(--white);
  padding: .5rem 1rem;
  z-index: 9999;
  transition: top .2s;
  font-size: .9rem;
}

.skip-link:focus { top: 0; }

/* Print styles */
@media print {
  .site-header,
  .site-footer,
  .cookie-banner,
  .back-to-top { display: none !important; }
  body { font-size: 12pt; }
}