:root{
    /* Brand Primary - Blue theme */
  --primary-50: #E1ECFF;
  --primary-100: #C3D9FF;
  --primary-200: #A3C5FF;
  --primary-300: #82AFFD;
  --primary-400: #5C96F9;
  --primary-500: #2C71E8;
  --primary-600: #0A4BBB;
  --primary-700: #023792;
  --primary-800: #00286B;
  --primary-900: #001A46;
  --primary-1000: #000D23;
  --primary: #0A4BBB;

  /* secondary - Golden/Amber */
  --secondary-50: #FFF4E1;
  --secondary-100: #FFE9C3;
  --secondary-200: #FFDDA3;
  --secondary-300: #FDD082;
  --secondary-400: #F9BF5C;
  --secondary-500: #E8A32C;
  --secondary-600: #BB7A0A;
  --secondary-700: #925D02;
  --secondary-800: #6B4400;
  --secondary-900: #462D00;
  --secondary-1000: #231600;
  --secondary: #E8A32C;

  /* Backgrounds and Surfaces */
  --background: #F9FAFB;
  --foreground: #0F172A;
  --card: #ffffff;
  --muted-foreground: #6b7280;
  --border: #d1d5db;
  --input: #ffffff;
  --destructive: #e11d48;
  --color-success: #16a34a;

  /* footer */
  --footer-bg: #64748B;

  /* Additional surface colors */
  --surface-card: #FFFFFF;
  --surface-input: #FFFFFF;
  --border-subtle: #E5E7EB;

  /* Text colors */
  --text-primary: #0F172A;
  --text-secondary: #64748B;
  --text-muted: #a3c5ff;

  /* Semantic colors */
  --color-success: #216B4E;
  --color-warning: #C48A2D;
  --color-error: #CA433A;
  --color-info: #3b82f6;

  /* Shadows */
  --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
  --shadow-lg: -2px 3px 6px 0px rgba(0, 0, 0, 0.35);
  --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1);

  /* Border radius */
  --radius-xs: 2px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-full: 999px;

  /* Spacing */
  --space-0: 0;
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;

  /* Typography — next/font vars registradas en layout.tsx, con fallback al nombre crudo */
  --font-family-display: var(--font-lora), Lora, serif;
  --font-family-base: var(--font-instrument-sans), 'Instrument Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-family-accent: var(--font-raleway), Raleway, sans-serif;

  /* Effects */
  --blur-sm: blur(30px);
  --blur-md: blur(50px);
  --blur-lg: blur(80px);

  /* Gradients */
  --gradient-primary: linear-gradient(135deg, #0A4BBB 0%, #2C71E8 100%);
  --gradient-overlay-header: rgba(255, 244, 225, 0.3);
  --gradient-overlay-hero: rgba(10, 75, 187, 0.15);
}

body{
  font-family: var(--font-family-base);
  color: var(--text-primary);
  background-color: var(--background);
}

.font-primary {
  font-family: var(--font-family-display);
}

.font-secondary {
  font-family: var(--font-family-accent);
}