/**
 * Koladiya Theme: Centralized Design Tokens & CSS Custom Properties
 * Single Source of Truth for Sitewide Typography, Spacing, and Geometry
 *
 * @package Koladiya_Theme
 */

:root {
  /* ============================================
     1. BRAND & SURFACE PALETTE
  ============================================ */
  --ki-blue: #0A347F;
  --ki-blue-mid: #1549B0;
  --ki-blue-bright: #2563EB;
  --ki-blue-cyan: #06B6D4;
  --ki-blue-tint: #EEF3FF;
  --ki-cyan-tint: #ECFEFF;

  /* Industrial Obsidian & Ink Surfaces */
  --ki-black: #040506;
  --ki-ink: #0A0C10;
  --ki-ink-card: #0D111A;
  --ki-ink-surface: #111624;

  /* Semantic Functional Accents */
  --ki-emerald: #10B981;
  --ki-emerald-glow: rgba(16, 185, 129, 0.25);
  --ki-amber: #F59E0B;
  --ki-purple: #A855F7;
  --ki-white: #FFFFFF;

  /* Neutrals & Scale */
  --ki-g800: #1C1F26;
  --ki-g700: #2D3139;
  --ki-g600: #4A5261;
  --ki-g500: #64748B;
  --ki-g400: #94A3B8;
  --ki-g300: #CBD5E1;
  --ki-g200: #E2E8F0;
  --ki-g100: #F1F5F9;
  --ki-g50: #F8FAFC;

  /* Borders & Hairlines */
  --ki-border-light: rgba(0, 0, 0, 0.08);
  --ki-border-mid: rgba(0, 0, 0, 0.12);
  --ki-border-dark: rgba(255, 255, 255, 0.08);
  --ki-border-dark-highlight: rgba(255, 255, 255, 0.16);

  /* Shadows */
  --ki-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.05);
  --ki-shadow-md: 0 4px 16px -2px rgba(0, 0, 0, 0.08);
  --ki-shadow-lg: 0 12px 36px -4px rgba(0, 0, 0, 0.12);
  --ki-shadow-card: 0 4px 20px -2px rgba(0, 0, 0, 0.05);
  --ki-shadow-card-hover: 0 16px 36px -6px rgba(0, 0, 0, 0.12);

  /* Shared Gradients */
  --ki-gradient-hero: linear-gradient(120deg, #FFFFFF 0%, #93C5FD 28%, #38BDF8 55%, #A78BFA 78%, #F472B6 100%);
  --ki-gradient-blue: linear-gradient(135deg, #0A347F 0%, #2563EB 55%, #06B6D4 100%);
  --ki-gradient-purple: linear-gradient(135deg, #6B21A8 0%, #A855F7 60%, #EC4899 100%);
  --ki-gradient-emerald: linear-gradient(135deg, #065F46 0%, #10B981 60%, #34D399 100%);

  /* ============================================
     2. SECTION SPACING & CONTAINER RHYTHM
     (Single point of control for all section spacing)
  ============================================ */
  --ki-section-py: clamp(64px, 7vw, 96px);
  --ki-section-px: clamp(16px, 3vw, 32px);
  --ki-section-gap: clamp(32px, 4vw, 56px);

  --ki-container-width: 1440px;
  --ki-container-narrow: 960px;
  --ki-container-prose: 780px;

  /* Gap Tokens */
  --ki-gap-xs: 8px;
  --ki-gap-sm: 16px;
  --ki-gap-md: 24px;
  --ki-gap-lg: clamp(32px, 3.5vw, 48px);
  --ki-gap-xl: clamp(48px, 5vw, 64px);

  /* ============================================
     3. TYPOGRAPHY SCALE & WEIGHT TOKENS
     (Change here -> Updates entire website)
  ============================================ */
  --ki-font-body: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --ki-font-heading: 'Plus Jakarta Sans', 'Inter', sans-serif;
  --ki-font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;

  /* Hero Display Headline */
  --ki-fs-hero: clamp(36px, 5vw, 62px);
  --ki-lh-hero: 1.05;
  --ki-fw-hero: 900;
  --ki-ls-hero: -0.045em;

  /* Section Headings (H2) - Sitewide Uniform */
  --ki-fs-h2: clamp(26px, 3vw, 40px);
  --ki-lh-h2: 1.12;
  --ki-fw-h2: 800;
  --ki-ls-h2: -0.035em;

  /* Subheadings (H3) / Split Headings */
  --ki-fs-h3: clamp(20px, 2.2vw, 28px);
  --ki-lh-h3: 1.25;
  --ki-fw-h3: 750;
  --ki-ls-h3: -0.025em;

  /* Card Headings (H4) */
  --ki-fs-h4: 18px;
  --ki-lh-h4: 1.35;
  --ki-fw-h4: 700;

  /* Section Intro / Lead Paragraph */
  --ki-fs-lead: clamp(14.5px, 1.15vw, 16px);
  --ki-lh-lead: 1.65;
  --ki-fw-lead: 400;

  /* Body & Paragraph Text */
  --ki-fs-body: 15px;
  --ki-lh-body: 1.6;

  /* Micro / Secondary Text */
  --ki-fs-sm: 13.5px;
  --ki-lh-sm: 1.55;

  /* Metadata / Code / Badge Text */
  --ki-fs-xs: 11.5px;
  --ki-lh-xs: 1.4;

  /* ============================================
     4. GEOMETRY & CARD RADIUS TOKENS
  ============================================ */
  --ki-radius-sm: 6px;
  --ki-radius-md: 10px;
  --ki-radius-lg: 16px;
  --ki-radius-xl: 24px;
  --ki-radius-pill: 9999px;

  --ki-card-pad: clamp(20px, 2.4vw, 32px);
  --ki-card-radius: 16px;
  --ki-card-bg: #FFFFFF;
  --ki-card-border: 1px solid var(--ki-border-light);

  --ki-card-dark-bg: var(--ki-ink-card);
  --ki-card-dark-border: 1px solid var(--ki-border-dark);

  /* Precision Chamfers */
  --ki-chamfer-card: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 0 100%);
  --ki-chamfer-cta: polygon(0 0, calc(100% - 24px) 0, 100% 24px, 100% 100%, 0 100%);
  --ki-chamfer-badge: polygon(6px 0%, 100% 0%, calc(100% - 6px) 100%, 0% 100%);

  /* Animation Easings */
  --ki-ease-apple: cubic-bezier(0.16, 1, 0.3, 1);
  --ki-ease-out: cubic-bezier(0, 0, 0.2, 1);
}