:root {
  --color-navy-dark: #0b1526;
  --color-navy: #15284f;
  --color-navy-light: #1e3a6e;
  --color-gold: #c59b3f;
  --color-gold-light: #dfb75c;
  --color-gold-dark: #9f792b;
  --color-bg-soft: #f8fafc;
}

body {
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  color: #1e293b;
  background-color: #f8fafc;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-track {
  background: #f1f5f9;
}
::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #94a3b8;
}

/* Brand Gradients & Accents */
.bg-navy-gradient {
  background: linear-gradient(135deg, #0b1526 0%, #15284f 60%, #1c3563 100%);
}

.bg-gold-gradient {
  background: linear-gradient(135deg, #dfb75c 0%, #c59b3f 50%, #a47d2b 100%);
}

.text-gold {
  color: var(--color-gold);
}

.border-gold {
  border-color: var(--color-gold);
}

.gold-shadow {
  box-shadow: 0 10px 25px -5px rgba(197, 155, 63, 0.25);
}

.navy-shadow {
  box-shadow: 0 10px 30px -5px rgba(21, 40, 79, 0.2);
}

/* Glassmorphism */
.glass-header {
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.glass-card {
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(226, 232, 240, 0.8);
}

/* Badges */
.badge-gold {
  background-color: #fef9c3;
  color: #854d0e;
  border: 1px solid #fde047;
}

.badge-navy {
  background-color: #e0e7ff;
  color: #3730a3;
  border: 1px solid #c7d2fe;
}

.badge-green {
  background-color: #dcfce7;
  color: #166534;
  border: 1px solid #bbf7d0;
}

/* Animation utilities */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}

.animate-fade-in {
  animation: fadeIn 0.25s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

/* Modal and Drawer transitions */
.drawer-backdrop {
  transition: opacity 0.3s ease;
}

.drawer-panel {
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Card hover animation */
.product-card {
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}

.product-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 15px 30px -5px rgba(21, 40, 79, 0.12);
}

/* Floating BCV rate pill */
.bcv-pulse {
  animation: pulseRate 2.5s infinite;
}

@keyframes pulseRate {
  0% { transform: scale(1); }
  50% { transform: scale(1.03); }
  100% { transform: scale(1); }
}
