:root {
  --tr-navy: #0c1224;
  --tr-cyan: #22d3ee;
  --tr-green: #10b981;
  --tr-muted: #94a3b8;
}

html {
  scroll-behavior: smooth;
}

@keyframes tr-fade-up {
  from {
    opacity: 0;
    transform: translateY(18px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.animate-fade-up {
  animation: tr-fade-up 0.7s ease-out forwards;
}

.delay-100 {
  animation-delay: 0.1s;
  opacity: 0;
}

.delay-200 {
  animation-delay: 0.2s;
  opacity: 0;
}

.cart-panel {
  transform: translateX(100%);
  transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

.cart-panel.open {
  transform: translateX(0);
}

.overlay {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}

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

.service-card {
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.service-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 22px 50px rgba(8, 47, 73, 0.35);
}

.cookie-banner {
  transform: translateY(120%);
  transition: transform 0.45s cubic-bezier(0.4, 0, 0.2, 1);
}

.cookie-banner.show {
  transform: translateY(0);
}
