@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,400;0,600;0,700;0,900;1,400;1,600&family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&display=swap');

:root {
  --color-natwest-purple: #4A154B;
  --color-natwest-deep: #320C33;
  --color-royal-violet: #5A287D;
  --color-electric-magenta: #DE0059;
  --color-magenta-hover: #F01A6E;
  --color-obsidian: #0D0614;
  --color-midnight: #160B24;
  --color-card-surface: #1E1030;
  --color-card-border: rgba(255, 255, 255, 0.08);
  --color-consulting-gold: #D4AF37;
  --color-azure-blue: #0078D4;

  --rag-green: #10B981;
  --rag-green-bg: rgba(16, 185, 129, 0.12);
  --rag-green-border: rgba(16, 185, 129, 0.35);

  --rag-amber: #F59E0B;
  --rag-amber-bg: rgba(245, 158, 11, 0.12);
  --rag-amber-border: rgba(245, 158, 11, 0.35);

  --rag-red: #EF4444;
  --rag-red-bg: rgba(239, 68, 68, 0.14);
  --rag-red-border: rgba(239, 68, 68, 0.4);

  --rag-unknown: #8B5CF6;
  --rag-unknown-bg: rgba(139, 92, 246, 0.12);
  --rag-unknown-border: rgba(139, 92, 246, 0.35);

  --font-serif: 'Playfair Display', Georgia, serif;
  --font-sans: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono: 'JetBrains Mono', monospace;
}

* {
  box-sizing: border-box;
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-sans);
  background-color: var(--color-obsidian);
  color: #E2E8F0;
  overflow-x: hidden;
  selection-background-color: var(--color-electric-magenta);
  selection-color: #FFFFFF;
}

::selection {
  background: var(--color-electric-magenta);
  color: #FFFFFF;
}

/* Luxury Editorial Typography */
.font-serif {
  font-family: var(--font-serif);
}

.font-sans {
  font-family: var(--font-sans);
}

.font-mono {
  font-family: var(--font-mono);
}

/* Editorial Heading Styles */
.editorial-title {
  font-family: var(--font-serif);
  letter-spacing: -0.025em;
  line-height: 1.15;
}

.executive-gradient-text {
  background: linear-gradient(135deg, #FFFFFF 20%, #E9D5FF 60%, #DE0059 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.gold-gradient-text {
  background: linear-gradient(135deg, #FDE68A 0%, #D4AF37 50%, #B45309 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.purple-gradient-text {
  background: linear-gradient(135deg, #C084FC 0%, #DE0059 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* Glassmorphism Cards */
.executive-card {
  background: rgba(30, 16, 48, 0.65);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: 0 20px 40px -15px rgba(0, 0, 0, 0.5), 0 0 1px 1px rgba(126, 34, 206, 0.15);
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.executive-card:hover {
  border-color: rgba(222, 0, 89, 0.35);
  box-shadow: 0 25px 50px -12px rgba(74, 21, 75, 0.35), 0 0 20px rgba(222, 0, 89, 0.15);
  transform: translateY(-2px);
}

/* High-End Buttons */
.btn-natwest-primary {
  background: linear-gradient(135deg, var(--color-natwest-purple) 0%, var(--color-royal-violet) 50%, var(--color-electric-magenta) 100%);
  color: #FFFFFF;
  font-weight: 600;
  letter-spacing: 0.01em;
  padding: 0.75rem 1.5rem;
  border-radius: 9999px;
  box-shadow: 0 10px 25px -5px rgba(222, 0, 89, 0.4), inset 0 1px 1px rgba(255, 255, 255, 0.2);
  transition: all 0.25s ease;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.btn-natwest-primary:hover {
  background: linear-gradient(135deg, var(--color-royal-violet) 0%, var(--color-electric-magenta) 100%);
  box-shadow: 0 14px 30px -4px rgba(222, 0, 89, 0.6);
  transform: translateY(-1px) scale(1.01);
}

.btn-executive-ghost {
  background: rgba(255, 255, 255, 0.04);
  color: #E2E8F0;
  border: 1px solid rgba(255, 255, 255, 0.12);
  font-weight: 500;
  padding: 0.75rem 1.5rem;
  border-radius: 9999px;
  backdrop-filter: blur(12px);
  transition: all 0.25s ease;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.btn-executive-ghost:hover {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(222, 0, 89, 0.4);
  color: #FFFFFF;
}

/* RAG Badges */
.badge-rag-green {
  background-color: var(--rag-green-bg);
  border: 1px solid var(--rag-green-border);
  color: #34D399;
}

.badge-rag-amber {
  background-color: var(--rag-amber-bg);
  border: 1px solid var(--rag-amber-border);
  color: #FBBF24;
}

.badge-rag-red {
  background-color: var(--rag-red-bg);
  border: 1px solid var(--rag-red-border);
  color: #F87171;
}

.badge-rag-unknown {
  background-color: var(--rag-unknown-bg);
  border: 1px solid var(--rag-unknown-border);
  color: #A78BFA;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: var(--color-obsidian);
}

::-webkit-scrollbar-thumb {
  background: #3B1C54;
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--color-royal-violet);
}

/* Shimmer and Pulse animations */
@keyframes softPulse {
  0%, 100% { opacity: 0.8; transform: scale(1); }
  50% { opacity: 1; transform: scale(1.02); }
}

.animate-soft-pulse {
  animation: softPulse 4s infinite ease-in-out;
}

/* Dot grid background */
.bg-grid-pattern {
  background-image: radial-gradient(rgba(222, 0, 89, 0.12) 1px, transparent 1px);
  background-size: 32px 32px;
}

/* Nav Blur */
.header-glass {
  background: rgba(13, 6, 20, 0.82);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}