/* ==========================================================================
   smartNsales — visual tokens.

   The palette the site is moving to: neutral-first, navy and graphite for
   structure, one blue as the functional accent, purple retired.

   These are the reference values. Existing stylesheets still carry literal
   hex, and were shifted onto this palette by a global mapping rather than a
   rewrite; new work should use the variables so the literals can be retired
   file by file.
   ========================================================================== */

:root {
  /* Ink — headings, primary text, dark surfaces */
  --sns-ink-900: #101828;   /* near-black navy: primary CTA, dark sections */
  --sns-ink-800: #111827;
  --sns-ink-700: #172033;
  --sns-ink-600: #1D2939;   /* cards on dark */

  /* Graphite — secondary text, icons */
  --sns-grey-700: #374151;
  --sns-grey-600: #475569;
  --sns-grey-500: #667085;

  /* Cool grey — borders, muted text, dividers */
  --sns-grey-400: #98A2B3;
  --sns-grey-300: #CBD5E1;
  --sns-grey-200: #D9E0E8;
  --sns-grey-100: #E4E9EF;

  /* Light surfaces */
  --sns-surface-1: #FFFFFF;
  --sns-surface-2: #FAFBFC;
  --sns-surface-3: #F7F9FB;
  --sns-surface-4: #F4F6F8;

  /* Accent — the one colour that carries meaning */
  --sns-blue-700: #1D4ED8;
  --sns-blue-600: #2563EB;   /* primary accent */
  --sns-blue-500: #3B82F6;
  --sns-blue-200: #BFD4F2;
  --sns-blue-100: #EAF2FF;
  --sns-steel:    #7C91AC;   /* very subtle steel-blue */

  /* Brand — the logo keeps its pink; it is a mark, not a UI colour */
  --sns-brand: #FC057C;

  /* Status, kept restrained */
  --sns-ok: #047857;
  --sns-warn: #B45309;
  --sns-risk: #BE123C;

  /* Borders and shadows — separation, not decoration */
  --sns-border: rgba(15, 23, 42, 0.08);
  --sns-border-strong: rgba(15, 23, 42, 0.14);
  --sns-shadow-sm: 0 1px 2px rgba(16, 24, 40, 0.04);
  --sns-shadow-md: 0 4px 14px rgba(16, 24, 40, 0.06);
  --sns-shadow-lg: 0 12px 32px rgba(16, 24, 40, 0.08);

  /* Materials — chrome read as light on a surface, never as an effect */
  --sns-chrome-light: linear-gradient(180deg, #FFFFFF 0%, #F4F6F8 100%);
  --sns-chrome-metal: linear-gradient(135deg, #F8FAFC 0%, #DDE3EA 52%, #FFFFFF 100%);
  --sns-chrome-dark: linear-gradient(160deg, #101828 0%, #1D2939 62%, #374151 100%);

  /* Radii — tighter than the previous marketing-bubble rounding */
  --sns-radius-sm: 8px;
  --sns-radius-md: 12px;
  --sns-radius-lg: 16px;
}