/* =========================================================
   Rudra Global — Design Tokens (2026)
   ========================================================= */
:root {
  /* Brand */
  --rg-navy: #0a1628;
  --rg-navy-soft: #12263f;
  --rg-blue: #0056b3;
  --rg-blue-deep: #003d82;
  --rg-cyan: #00b4d8;
  --rg-orange: #ff6b35;
  --rg-orange-soft: #ff8c42;

  /* Surfaces */
  --bg-primary: #ffffff;
  --bg-secondary: #f5f7fb;
  --bg-tertiary: #eef2f8;
  --bg-elevated: rgba(255, 255, 255, 0.72);
  --bg-glass: rgba(255, 255, 255, 0.65);
  --bg-glass-dark: rgba(10, 22, 40, 0.72);

  /* Text */
  --text-primary: #0f1c2e;
  --text-secondary: #5b6b7f;
  --text-tertiary: #8a97a8;
  --text-inverse: #ffffff;

  /* Borders & shadows */
  --border-color: rgba(15, 28, 46, 0.08);
  --border-strong: rgba(15, 28, 46, 0.14);
  --shadow-sm: 0 2px 10px rgba(10, 22, 40, 0.06);
  --shadow-md: 0 8px 28px rgba(10, 22, 40, 0.08);
  --shadow-lg: 0 18px 48px rgba(10, 22, 40, 0.12);
  --shadow-xl: 0 28px 64px rgba(10, 22, 40, 0.16);
  --shadow-glow: 0 12px 40px rgba(0, 86, 179, 0.25);

  /* Gradients */
  --gradient-primary: linear-gradient(135deg, var(--rg-blue) 0%, var(--rg-cyan) 100%);
  --gradient-secondary: linear-gradient(135deg, var(--rg-orange) 0%, var(--rg-orange-soft) 100%);
  --gradient-mesh: radial-gradient(ellipse at 20% 20%, rgba(0, 180, 216, 0.18), transparent 50%),
    radial-gradient(ellipse at 80% 0%, rgba(0, 86, 179, 0.16), transparent 45%),
    radial-gradient(ellipse at 50% 100%, rgba(255, 107, 53, 0.1), transparent 50%);
  --gradient-hero-1: linear-gradient(135deg, rgba(10, 22, 40, 0.82) 0%, rgba(0, 86, 179, 0.55) 100%);
  --gradient-hero-2: linear-gradient(135deg, rgba(10, 22, 40, 0.78) 0%, rgba(0, 61, 130, 0.6) 100%);
  --gradient-hero-3: linear-gradient(135deg, rgba(10, 22, 40, 0.8) 0%, rgba(0, 180, 216, 0.45) 100%);
  --gradient-hero-4: linear-gradient(135deg, rgba(10, 22, 40, 0.82) 0%, rgba(34, 120, 80, 0.5) 100%);

  /* Legacy aliases (keep existing CSS working) */
  --primary: var(--rg-blue);
  --primary-dark: var(--rg-blue-deep);
  --primary-light: #4d88ff;
  --secondary: var(--rg-orange);
  --accent: var(--rg-cyan);
  --success: #22c55e;
  --warning: #f59e0b;
  --danger: #ef4444;
  --shadow-color: rgba(10, 22, 40, 0.1);

  /* Typography */
  --font-display: "Manrope", system-ui, sans-serif;
  --font-primary: "Plus Jakarta Sans", system-ui, sans-serif;
  --font-secondary: "Manrope", system-ui, sans-serif;
  --font-body: "Plus Jakarta Sans", system-ui, sans-serif;
  --lh-tight: 1.15;
  --lh-snug: 1.35;
  --lh-body: 1.7;
  --tracking-tight: -0.02em;
  --tracking-wide: 0.08em;

  /* Spacing */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-8: 3rem;
  --space-10: 4rem;
  --space-12: 5rem;
  /* Compact section rhythm — gap is owned by premium.css --section-gap */
  --section-padding: 40px 0;
  --section-pad-y: 40px;
  --section-gap: 40px;
  --section-header-mb: 1.75rem;
  --section-content-mt: 0;
  --container-max-width: 1200px;
  --header-h: 78px;

  /* Radius */
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-xl: 32px;
  --radius-pill: 999px;

  /* Motion */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-soft: cubic-bezier(0.4, 0, 0.2, 1);
  --transition-fast: 0.25s var(--ease-soft);
  --transition-medium: 0.45s var(--ease-out);
  --transition-slow: 0.8s var(--ease-out);

  /* Z-index */
  --z-nav: 1000;
  --z-progress: 1100;
  --z-cursor: 1200;
  --z-overlay: 1300;
  --z-preloader: 1400;
}

/* Force brand light experience (disable OS dark flips fighting corporate look) */
@media (prefers-color-scheme: dark) {
  :root {
    --bg-primary: #ffffff;
    --bg-secondary: #f5f7fb;
    --bg-tertiary: #eef2f8;
    --text-primary: #0f1c2e;
    --text-secondary: #5b6b7f;
    --text-tertiary: #8a97a8;
    --border-color: rgba(15, 28, 46, 0.08);
  }
}