/* ============================================================
   inmind Marketing — COLOR TOKENS
   Derived from the brand wordmark: a cyan → indigo gradient.
   Sampled anchors: cyan #00AEEF · indigo #2E3192 · ink #0E1320
   ============================================================ */
:root {
  /* ---- Brand anchors ---- */
  --brand-cyan:   #00AEEF;  /* the "i" dot — bright, energetic, digital */
  --brand-blue:   #1763C4;  /* gradient midpoint — royal, trustworthy   */
  --brand-indigo: #2E3192;  /* end of wordmark — deep, strategic        */
  --brand-ink:    #0E1320;  /* "MARKETING" near-black                   */

  /* ---- Signature gradients ---- */
  --gradient-brand:  linear-gradient(90deg, #00AEEF 0%, #1763C4 52%, #2E3192 100%); /* @kind color */
  --gradient-brand-diagonal: linear-gradient(135deg, #00AEEF 0%, #1763C4 50%, #2E3192 100%); /* @kind color */
  --gradient-brand-soft: linear-gradient(135deg, #E6F7FE 0%, #ECEDF7 100%); /* @kind color */
  --gradient-ink:    linear-gradient(160deg, #1A2150 0%, #0E1320 100%); /* @kind color */

  /* ---- Cyan scale ---- */
  --cyan-50:  #E6F7FE;
  --cyan-100: #C2ECFD;
  --cyan-200: #8FDDFB;
  --cyan-300: #54CAF6;
  --cyan-400: #1FB9F1;
  --cyan-500: #00AEEF;
  --cyan-600: #0090CC;
  --cyan-700: #0073A3;
  --cyan-800: #075C82;
  --cyan-900: #0C4A68;

  /* ---- Indigo scale ---- */
  --indigo-50:  #ECEDF7;
  --indigo-100: #D4D5EE;
  --indigo-200: #A8AADD;
  --indigo-300: #7C7FC9;
  --indigo-400: #5558B2;
  --indigo-500: #3C3FA1;
  --indigo-600: #2E3192;
  --indigo-700: #272A7B;
  --indigo-800: #20235E;
  --indigo-900: #181A45;

  /* ---- Neutrals (cool, faintly blue-tinted to sit with the brand) ---- */
  --gray-0:   #FFFFFF;
  --gray-50:  #F6F8FB;
  --gray-100: #EEF1F6;
  --gray-200: #E1E6EE;
  --gray-300: #CBD2DE;
  --gray-400: #9AA4B6;
  --gray-500: #6B7689;
  --gray-600: #4C5567;
  --gray-700: #353D4D;
  --gray-800: #232A37;
  --gray-900: #0E1320;

  /* ---- Festive accents (events · invitations · party décor vertical) ----
     Use sparingly — the brand voice is blue. These add warmth ONLY on
     celebration-facing surfaces (toppers, stickers, digital invites). */
  --festive-magenta: #E8398B;
  --festive-gold:    #FFC03A;

  /* ---- Semantic feedback ---- */
  --success-500: #16B26A;  --success-50: #E5F7EE;
  --warning-500: #F5A524;  --warning-50: #FEF3E2;
  --danger-500:  #F0445B;  --danger-50:  #FEEAEC;
  --info-500:    #00AEEF;  --info-50:    #E6F7FE;

  /* ============================================================
     SEMANTIC ALIASES — reference these in product CSS, not the raw scales
     ============================================================ */
  --brand-primary:   var(--indigo-600);  /* solid brand for UI chrome, links */
  --brand-primary-hover: var(--indigo-700);
  --brand-accent:    var(--cyan-500);     /* highlights, focus, active dots   */
  --brand-accent-hover: var(--cyan-600);

  /* Text */
  --text-strong:  var(--gray-900);
  --text-body:    var(--gray-700);
  --text-muted:   var(--gray-500);
  --text-subtle:  var(--gray-400);
  --text-on-brand: #FFFFFF;
  --text-link:    var(--indigo-600);
  --text-link-hover: var(--cyan-600);

  /* Surfaces */
  --surface-page:    #FFFFFF;
  --surface-subtle:  var(--gray-50);
  --surface-card:    #FFFFFF;
  --surface-muted:   var(--gray-100);
  --surface-inverse: var(--gray-900);
  --surface-brand:   var(--indigo-600);
  --surface-accent-soft: var(--cyan-50);
  --surface-brand-soft:  var(--indigo-50);

  /* Borders */
  --border:        var(--gray-200);
  --border-strong: var(--gray-300);
  --border-brand:  var(--indigo-200);
  --border-accent: var(--cyan-300);

  /* Focus */
  --focus-ring: 0 0 0 3px rgba(0, 174, 239, 0.40);
}