/* Shared styles for Citadel Trust Bank */
:root {
  --navy-50: #f0f4f8;
  --navy-100: #d9e2ec;
  --navy-200: #bcccdc;
  --navy-300: #9fb3c8;
  --navy-400: #829ab1;
  --navy-500: #627d98;
  --navy-600: #486581;
  --navy-700: #334e68;
  --navy-800: #243b53;
  --navy-900: #102a43;
  --navy-950: #0a1929;
  --gold-400: #e3b04b;
  --gold-500: #d4a017;
  --gold-600: #b8860b;
}

/* Custom scrollbar */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #f1f5f9; }
::-webkit-scrollbar-thumb { background: #486581; border-radius: 4px; }

/* Mega menu */
.mega-menu {
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s;
}
.group:hover .mega-menu,
.mega-menu:hover {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

/* Mobile menu */
.mobile-menu {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.35s ease;
}
.mobile-menu.open {
  max-height: 2000px;
}
.mobile-submenu {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
}
.mobile-submenu.open {
  max-height: 800px;
}

/* Sticky header */
header.scrolled {
  box-shadow: 0 4px 20px -4px rgba(16, 42, 67, 0.12);
}

/* Product cards */
.product-card {
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.product-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 20px 40px -12px rgba(16, 42, 67, 0.15);
}

/* Image placeholder */
.img-placeholder {
  background: linear-gradient(135deg, #f0f4f8 0%, #d9e2ec 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
}
.img-placeholder::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(45deg, transparent 40%, rgba(255,255,255,0.4) 50%, transparent 60%);
  background-size: 200% 200%;
  animation: shimmer 2.5s infinite;
}
@keyframes shimmer {
  0% { background-position: 100% 100%; }
  100% { background-position: -100% -100%; }
}
.img-placeholder .placeholder-content {
  position: relative;
  z-index: 1;
  text-align: center;
  color: #627d98;
}

/* Feature image frames */
.feature-img {
  border-radius: 1rem;
  overflow: hidden;
  box-shadow: 0 25px 50px -12px rgba(16, 42, 67, 0.15);
}

/* Content sections */
.content-section {
  scroll-margin-top: 100px;
}