/**
 * Kirti Samvaad - Design Tokens
 * 2026 Modern Edition with 3D Depth, Rich Indian Saffron & Navy Palettes, Mobile Ergonomics
 */

:root {
  /* Exact Brand Color Palette */
  --color-navy-primary: #142B4A;
  --color-navy-deep: #0B1930;
  --color-navy-darker: #060E1A;
  --color-navy-surface: #10233D;
  --color-navy-surface-card: #132742;

  --color-gold: #E9A23B;
  --color-gold-hover: #D88E26;
  --color-gold-light: #F4BE6C;
  --color-gold-tint: rgba(233, 162, 59, 0.12);
  --color-gold-border: rgba(233, 162, 59, 0.35);
  --color-gold-border-subtle: rgba(233, 162, 59, 0.18);
  --color-gold-glow: rgba(233, 162, 59, 0.28);

  --gradient-gold: linear-gradient(135deg, #F8CE7C 0%, #E9A23B 50%, #C98218 100%);
  --gradient-gold-subtle: linear-gradient(135deg, rgba(248, 206, 124, 0.15) 0%, rgba(233, 162, 59, 0.05) 100%);
  --gradient-navy: linear-gradient(180deg, #142B4A 0%, #0B1930 100%);
  --gradient-navy-card: linear-gradient(145deg, rgba(20, 43, 74, 0.95) 0%, rgba(11, 25, 48, 0.98) 100%);
  --gradient-surface: linear-gradient(180deg, #FFFFFF 0%, #F8F6F1 100%);

  --color-offwhite: #F8F6F1;
  --color-white: #FFFFFF;
  --color-surface-elevated: #FFFFFF;
  --color-surface-subtle: #F2EFEB;
  --color-surface-muted: #EBE7DF;

  --color-text-main: #202D42;
  --color-text-muted: #5C6A80;
  --color-text-subtle: #8493A8;
  --color-text-inverse: #FFFFFF;
  --color-text-inverse-muted: #A3B1C6;
  --color-text-gold: #D99B26;

  --color-border-subtle: #E5E7EB;
  --color-border-medium: #D1D5DB;
  --color-border-navy: rgba(255, 255, 255, 0.12);
  --color-border-navy-light: rgba(255, 255, 255, 0.2);

  --color-teal: #258C8C;
  --color-teal-tint: rgba(37, 140, 140, 0.12);
  --color-teal-border: rgba(37, 140, 140, 0.3);

  /* 3D Depth & Glassmorphism */
  --perspective-3d: 1200px;
  --glass-bg: rgba(255, 255, 255, 0.82);
  --glass-bg-hover: rgba(255, 255, 255, 0.94);
  --glass-border: rgba(233, 162, 59, 0.22);
  --glass-shadow: 0 16px 40px -10px rgba(11, 25, 48, 0.08), 0 2px 8px rgba(11, 25, 48, 0.04);
  --glass-shadow-hover: 0 24px 50px -12px rgba(11, 25, 48, 0.16), 0 6px 18px rgba(233, 162, 59, 0.12);

  --navy-glass-bg: rgba(14, 32, 58, 0.88);
  --navy-glass-border: rgba(233, 162, 59, 0.3);

  /* Typography Scales */
  --font-en: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --font-hi: 'Noto Sans Devanagari', 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-family-current: var(--font-en);

  /* Fluid Font Sizes (Optimized for Mobile first) */
  --text-xs: 0.75rem;       /* 12px */
  --text-sm: 0.875rem;      /* 14px */
  --text-base: 1rem;        /* 16px */
  --text-lg: 1.125rem;      /* 18px */
  --text-xl: 1.25rem;       /* 20px */
  --text-2xl: clamp(1.35rem, 3vw, 1.6rem);     /* 22-26px */
  --text-3xl: clamp(1.65rem, 3.5vw, 2.15rem);  /* 26-34px */
  --text-4xl: clamp(2.1rem, 4.5vw, 3rem);      /* 34-48px */
  --text-display: clamp(2.4rem, 6vw, 4rem);    /* 38-64px */

  /* Line Heights */
  --lh-tight: 1.15;
  --lh-snug: 1.32;
  --lh-base: 1.65;
  --lh-relaxed: 1.75;

  /* Font Weights */
  --fw-normal: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-extrabold: 800;

  /* Spacing Scale (8px system) */
  --space-1: 0.25rem;   /* 4px */
  --space-2: 0.5rem;    /* 8px */
  --space-3: 0.75rem;   /* 12px */
  --space-4: 1rem;      /* 16px */
  --space-5: 1.25rem;   /* 20px */
  --space-6: 1.5rem;    /* 24px */
  --space-8: 2rem;      /* 32px */
  --space-10: 2.5rem;   /* 40px */
  --space-12: 3rem;     /* 48px */
  --space-16: 4rem;     /* 64px */
  --space-20: 5rem;     /* 80px */
  --space-24: 6rem;     /* 96px */

  /* Layout Containers */
  --container-max: 1200px;
  --container-wide: 1320px;
  --container-padding: clamp(1rem, 4.5vw, 2.25rem);
  --header-height: 76px;
  --mobile-dock-height: 64px;

  /* Radii */
  --radius-xs: 4px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-full: 9999px;

  /* Refined Elevation Shadows */
  --shadow-subtle: 0 1px 3px rgba(11, 25, 48, 0.05);
  --shadow-card: 0 6px 20px rgba(11, 25, 48, 0.06);
  --shadow-card-hover: 0 16px 36px rgba(11, 25, 48, 0.12);
  --shadow-deep: 0 24px 50px rgba(11, 25, 48, 0.2);
  --shadow-glow: 0 0 30px rgba(233, 162, 59, 0.35);

  /* Transitions */
  --transition-fast: 160ms cubic-bezier(0.16, 1, 0.3, 1);
  --transition-normal: 280ms cubic-bezier(0.16, 1, 0.3, 1);
  --transition-smooth: 450ms cubic-bezier(0.2, 0.8, 0.2, 1);
  --transition-bounce: 500ms cubic-bezier(0.34, 1.56, 0.64, 1);

  /* Z-Index Layers */
  --z-base: 1;
  --z-card: 10;
  --z-dock: 90;
  --z-header: 100;
  --z-drawer: 150;
  --z-overlay: 200;
  --z-modal: 300;
  --z-toast: 400;
}

/* Hindi typography adjustments */
:lang(hi),
.lang-hi {
  --font-family-current: var(--font-hi);
  --lh-base: 1.75;
  --lh-snug: 1.4;
  --lh-tight: 1.25;
}
