:root {
  /* Base Colors */
  --background: #fdfcff;
  --foreground: #272331;
  --card: #ffffff;
  --card-foreground: #272331;
  --primary: #5229b1; 
  --primary-foreground: #faf9ff;
  --secondary: #f4f3fa;
  --secondary-foreground: #383445;
  --muted: #f4f3fa;
  --muted-foreground: #797385;
  --border: #e9e7f1;
  --coral: #e26742;
  --coral-foreground: #fff9f6;
  --mint: #3db8b0;
  --mint-foreground: #ffffff;
  --gold: #dfa234;
  --gold-foreground: #ffffff;
  --accent: #d23bd2;
  --accent-foreground: #ffffff;
  
  /* Gradients */
  --gradient-hero: linear-gradient(135deg, #5229b1 0%, #a438d9 50%, #e26742 100%);
  --gradient-primary: linear-gradient(135deg, #5229b1, #9635d9);
  --gradient-coral: linear-gradient(135deg, #e26742, #ed8f75);
  --gradient-mint: linear-gradient(135deg, #3db8b0, #73cfc9);
  --gradient-card: linear-gradient(180deg, #ffffff, #faf9ff);
  
  /* Typography */
  --font-display: 'Space Grotesk', ui-sans-serif, system-ui, sans-serif;
  --font-sans: 'Inter', ui-sans-serif, system-ui, sans-serif;
  
  /* Shadows */
  --shadow-sm: 0 1px 2px 0 rgba(45, 41, 55, 0.05);
  --shadow-md: 0 4px 12px -2px rgba(45, 41, 55, 0.08);
  --shadow-lg: 0 20px 40px -12px rgba(45, 41, 55, 0.15);
  --shadow-glow: 0 20px 60px -10px rgba(164, 56, 217, 0.4);
  
  /* Transitions */
  --transition-smooth: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

body {
  background-color: var(--background);
  color: var(--foreground);
  font-family: var(--font-sans);
  -webkit-font-smoothing: antialiased;
  scroll-behavior: smooth;
}

h1, h2, h3, h4, h5, .font-display {
  font-family: var(--font-display);
  letter-spacing: -0.02em;
}

/* Background Utilities */
.bg-gradient-hero { background-image: var(--gradient-hero) !important; }
.bg-gradient-primary { background-image: var(--gradient-primary) !important; }
.bg-gradient-coral { background-image: var(--gradient-coral) !important; }
.bg-gradient-mint { background-image: var(--gradient-mint) !important; }
.bg-gradient-card { background-image: var(--gradient-card) !important; }
.bg-card { background-color: var(--card) !important; }
.bg-secondary { background-color: var(--secondary) !important; }
.bg-primary { background-color: var(--primary) !important; }
.bg-coral { background-color: var(--coral) !important; }
.bg-mint { background-color: var(--mint) !important; }
.bg-gold { background-color: var(--gold) !important; }
.bg-accent { background-color: var(--accent) !important; }

/* Text Utilities */
.text-gradient {
  background: var(--gradient-primary);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.text-gradient-coral {
  background: var(--gradient-coral);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.text-primary { color: var(--primary) !important; }
.text-primary-foreground { color: var(--primary-foreground) !important; }
.text-coral { color: var(--coral) !important; }
.text-coral-foreground { color: var(--coral-foreground) !important; }
.text-mint-foreground { color: var(--mint-foreground) !important; }
.text-gold-foreground { color: var(--gold-foreground) !important; }
.text-accent-foreground { color: var(--accent-foreground) !important; }
.text-muted-foreground { color: var(--muted-foreground) !important; }
.text-secondary-foreground { color: var(--secondary-foreground) !important; }

/* Border Utilities */
.border-border { border-color: var(--border) !important; }

/* Shadow Utilities */
.shadow-glow { box-shadow: var(--shadow-glow) !important; }
.shadow-elegant { box-shadow: var(--shadow-lg) !important; }

/* Border Radius */
.rounded-xl { border-radius: 0.75rem !important; }
.rounded-2xl { border-radius: 1rem !important; }
.rounded-3xl { border-radius: 1.5rem !important; }
.rounded-full { border-radius: 9999px !important; }

/* Custom Components */
.header-nav a {
  color: var(--muted-foreground);
  text-decoration: none;
  transition: var(--transition-smooth);
}
.header-nav a:hover { color: var(--foreground); }

.btn-gradient {
  background: var(--gradient-primary);
  color: var(--primary-foreground);
  border: none;
  box-shadow: var(--shadow-glow);
  transition: var(--transition-smooth);
}
.btn-gradient:hover {
  opacity: 0.95;
  color: var(--primary-foreground);
}
.btn-outline-custom {
  border: 1px solid var(--border);
  color: var(--foreground);
  background: transparent;
  transition: var(--transition-smooth);
}
.btn-outline-custom:hover {
  background: var(--secondary);
}

.step-icon {
  width: 2.25rem; height: 2.25rem;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%; font-size: 0.875rem; font-weight: 600;
  transition: var(--transition-smooth);
  flex: none;
}
.step-icon.active {
  border: 1px solid var(--primary);
  background-color: var(--primary);
  color: var(--primary-foreground);
  box-shadow: var(--shadow-glow);
}
.step-icon.done {
  border: 1px solid var(--mint);
  background-color: var(--mint);
  color: var(--card);
}
.step-icon.pending {
  border: 1px solid var(--border);
  background-color: var(--card);
  color: var(--muted-foreground);
}

.pass-card {
  cursor: pointer;
  transition: var(--transition-smooth);
}
.pass-card:hover { transform: translateY(-2px); }

.program-card {
  border: 1px solid var(--border);
  background: var(--card);
  border-radius: 1rem;
  padding: 1.25rem;
  cursor: pointer;
  transition: var(--transition-smooth);
}
.program-card:hover {
  transform: translateY(-2px);
  border-color: rgba(82, 41, 177, 0.4);
  box-shadow: var(--shadow-lg);
}
.program-card .select-icon {
  transform: translateX(0);
  transition: var(--transition-smooth);
}
.program-card:hover .select-icon {
  transform: translateX(2px);
}

.form-control {
  height: 2.75rem;
  border-color: var(--border);
  font-size: 0.875rem;
}
.form-control:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 0.15rem rgba(82, 41, 177, 0.15);
}
.icon-input-wrapper { position: relative; }
.icon-input-wrapper i {
  position: absolute; left: 0.75rem; top: 50%;
  transform: translateY(-50%); color: var(--muted-foreground);
  font-size: 0.875rem; pointer-events: none;
}
.icon-input-wrapper .form-control { padding-left: 2.25rem; }

.form-check-input:checked {
  background-color: var(--primary);
  border-color: var(--primary);
}
.form-check-input:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 0.15rem rgba(82, 41, 177, 0.15);
}

/* Container sizing to match max-w-5xl */
.max-w-5xl { max-width: 64rem; margin-inline: auto; }
.max-w-3xl { max-width: 48rem; margin-inline: auto; }
.max-w-2xl { max-width: 42rem; margin-inline: auto; }
.max-w-xl { max-width: 36rem; margin-inline: auto; }

/* Accordion */
.accordion-button:not(.collapsed) {
  background-color: var(--card);
  color: var(--primary);
  box-shadow: none;
}
.accordion-button {
  background-color: var(--card);
  color: var(--foreground);
  font-weight: 600;
  font-family: var(--font-display);
}
.accordion-button:focus {
  box-shadow: none;
  border-color: rgba(0,0,0,.125);
}
.accordion-item {
  background-color: var(--card);
  border-color: var(--border);
}
.accordion-body {
  color: var(--muted-foreground);
}

/* Utilities for hover */
.transition-smooth { transition: var(--transition-smooth); }
.hover-translate-y-1:hover { transform: translateY(-0.25rem); }