/* ============================================================================
   ivaMind Technologies — Color & Type Foundations
   Palette derived from the ivaMind wordmark: deep navy ink + electric-blue
   gradient "M". Premium, AI-native, generous white space. Never hardcode a
   hex outside this file — always reference a var.
   Typeface: Plus Jakarta Sans (bundled locally in /assets/fonts).
   ============================================================================ */

/* ---- Webfonts (local .ttf) ---- */
@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('../assets/fonts/PlusJakartaSans-Regular.ttf') format('truetype');
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('../assets/fonts/PlusJakartaSans-Medium.ttf') format('truetype');
  font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('../assets/fonts/PlusJakartaSans-SemiBold.ttf') format('truetype');
  font-weight: 600; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('../assets/fonts/PlusJakartaSans-Bold.ttf') format('truetype');
  font-weight: 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('../assets/fonts/PlusJakartaSans-ExtraBold.ttf') format('truetype');
  font-weight: 800; font-style: normal; font-display: swap;
}

:root {
  /* ============================ COLOR ============================ */
  /* — Ink (matches the "iva"/"ind" letters) — */
  --ink-900:     #0C1626;   /* near-black; dark section backgrounds */
  --ink-800:     #101D33;
  --ink:         #16243B;   /* primary text */

  /* — Brand (electric blue; the gradient "M") — */
  --brand:       #1E6CE6;   /* primary actions, links (gradient start) */
  --brand-bright:#3D9BFF;   /* gradient end / glow */
  --brand-deep:  #154FB0;   /* pressed / on-tint */
  --brand-50:    #EAF2FE;   /* light tint backgrounds */
  --brand-100:   #D4E6FD;
  --brand-grad:  linear-gradient(135deg, #1E6CE6 0%, #3D9BFF 100%);
  --brand-grad-soft: linear-gradient(135deg, #1E6CE6 0%, #6D5DF6 100%);

  /* — Violet spark: second accent — "intelligence" visuals + roadmap future — */
  --violet:      #6D5DF6;
  --violet-bright:#8B7DFF;
  --violet-50:   #EEEBFE;
  --violet-grad: linear-gradient(135deg, #6D5DF6 0%, #8B7DFF 100%);

  /* — Warm coral: the third color — energy, highlights, human warmth — */
  --accent:      #FF6B4A;   /* warm coral — breaks the all-blue field */
  --accent-bright:#FF8A63;
  --accent-deep: #E8502E;   /* pressed / on-tint */
  --accent-50:   #FFF1EC;   /* light tint backgrounds */
  --accent-100:  #FFE1D7;
  --accent-grad: linear-gradient(135deg, #FF6B4A 0%, #FF8A63 100%);

  /* — Neutrals / surfaces — */
  --bg:          #FFFFFF;   /* page background */
  --surface:     #F7F9FC;   /* cards, raised sections */
  --subtle:      #EEF2F8;   /* quiet fills, chips */

  /* — Text — */
  --fg1:         #16243B;   /* titles, primary */
  --fg2:         #5B677A;   /* body, secondary */
  --fg3:         #98A2B3;   /* captions, hints */
  --on-dark-1:   #F4F7FC;   /* primary text on dark */
  --on-dark-2:   #A9B6CC;   /* secondary text on dark */

  /* — Lines — */
  --border:      #E6EAF0;
  --border-dark: rgba(255,255,255,0.10);

  /* — Semantic — */
  --success:     #1A9B4B;
  --warning:     #D4930A;

  /* ============================ TYPE ============================ */
  --font-sans: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  --fs-display: clamp(2.5rem, 1.2rem + 5.4vw, 4.75rem); /* hero */
  --fs-h1:      clamp(2rem, 1.2rem + 3vw, 3rem);        /* section titles */
  --fs-h2:      clamp(1.5rem, 1.1rem + 1.6vw, 2.125rem);
  --fs-h3:      1.3125rem;   /* 21px card titles */
  --fs-lead:    clamp(1.0625rem, 1rem + 0.4vw, 1.3125rem);
  --fs-body:    1.0625rem;   /* 17px */
  --fs-sm:      0.9375rem;   /* 15px */
  --fs-label:   0.8125rem;   /* 13px */
  --fs-overline:0.75rem;     /* 12px */

  /* ============================ SPACE / RADIUS / SHADOW ============================ */
  --maxw:       1160px;
  --radius-sm:  10px;
  --radius:     16px;
  --radius-lg:  24px;
  --radius-xl:  32px;

  --shadow-sm:  0 1px 2px rgba(16,29,51,0.06), 0 1px 3px rgba(16,29,51,0.04);
  --shadow:     0 8px 24px rgba(16,29,51,0.08);
  --shadow-lg:  0 24px 60px rgba(16,29,51,0.14);
  --shadow-brand: 0 16px 50px rgba(30,108,230,0.28);

  --ease:       cubic-bezier(0.22, 1, 0.36, 1);
}