/* ============================================================
   RevHost Design System — Foundations · Trust Refined
   Fintech profesional con calidez · técnico/preciso · bilingüe ES/EN.
   60% ink · 30% cream · 10% mint.

   Source: Claude Design handoff (brand-guidelines/, May 2026).
   This file only declares CSS variables and is safe to load
   globally. Component rules live in editorial.css under the
   `.theme-editorial` body scope.
   ============================================================ */

:root {
  /* -------- Core brand -------- */
  --ink:              #0B1B2E;   /* primary brand · 60% */
  --ink-deep:         #06101C;   /* deeper contrast for hero headers */
  --ink-soft:         #14253C;   /* card-on-ink elevated (alias of carbon) */
  --ink-warm:         #1B2C42;   /* hairline on ink */
  --on-ink:           #F5EFE3;   /* cream on ink */

  /* -------- Accent (sky) -------- *
     Token names keep the "mint" prefix per the design bundle's own
     backwards-compat convention. The value is sky blue, not green.
     No green anywhere in the system. */
  --mint:             #5BA3E0;   /* sky · accent · up-trends · positives · 10% */
  --mint-soft:        #D7E8F5;   /* sky tint for fills / chips */
  --mint-ink:         #1A4773;   /* sky-readable text on cream */
  --on-mint:          #0B1B2E;   /* ink on sky */

  /* Legacy alias — existing templates that read --signal/--gain still work.
     New code should use --mint. */
  --signal:           #5BA3E0;
  --signal-deep:      #1A4773;
  --signal-bright:    #7DB7E8;
  --signal-soft:      #D7E8F5;
  --on-signal:        #0B1B2E;

  /* -------- Surfaces (warm cream system · 30%) -------- */
  --canvas:           #F5EFE3;   /* primary warm background */
  --cream:            #F5EFE3;   /* semantic alias */
  --paper:            #FBF7EE;   /* softer cream · cards on cream */
  --bone:             #EFE7D4;   /* muted cream · panels */
  --mist:             #EFE7D4;   /* legacy alias for bone */
  --fog:              #E2DBC9;   /* hairline-toned surface */
  --carbon:           #14253C;   /* card-on-ink elevated */

  /* -------- Neutrals -------- */
  --slate:            #4A5868;
  --slate-light:      #8A95A3;
  --hair:             #E2DBC9;   /* hairline on cream */
  --hair-dark:        #1B2C42;   /* hairline on ink */
  /* Legacy aliases */
  --steel:            #8A95A3;
  --graphite:         #4A5868;
  --charcoal:         #1B2C42;
  --hairline:         #E2DBC9;
  --hairline-strong:  #C9BFA6;

  /* -------- Functional (delta-only · muted, never alarm) -------- */
  --down:             #E08566;   /* muted coral · down-trends */
  --down-soft:        #F6D6C7;
  --amber:            #E8B958;   /* neutral attention */
  --amber-soft:       #F6E2B7;

  /* Legacy delta aliases — semantics preserved */
  --gain:             #1A4773;   /* sky-ink for legible "gain" text on cream */
  --gain-soft:        #D7E8F5;
  --loss:             #C45A35;   /* down deepened for readable text on cream */
  --loss-soft:        #F6D6C7;
  --warning:          #A8801A;   /* amber deepened for readable text on cream */
  --warning-soft:     #F6E2B7;

  /* -------- Links -------- */
  --link:             #0B1B2E;
  --link-pressed:     #1A4773;

  /* -------- Type families -------- */
  --font-display: 'Geist', 'Inter', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  --font-body:    'Geist', 'Inter', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  --font-mono:    'Geist Mono', 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  /* -------- Radius -------- */
  --radius-none: 0px;
  --radius-xs:   4px;
  --radius-sm:   6px;
  --radius-md:   8px;
  --radius-lg:   12px;
  --radius-xl:   18px;
  --radius-pill: 9999px;

  /* -------- Spacing -------- */
  --space-xxs:     4px;
  --space-xs:      8px;
  --space-sm:     12px;
  --space-md:     16px;
  --space-lg:     24px;
  --space-xl:     32px;
  --space-xxl:    48px;
  --space-xxxl:   64px;
  --space-section: 96px;

  /* -------- Elevation -------- */
  --elev-0: none;
  --elev-1: 0 0 0 1px var(--hair);
  --elev-2: 0 1px 3px rgba(11,27,46,0.05), 0 6px 16px rgba(11,27,46,0.06);
  --elev-3: 0 12px 32px rgba(11,27,46,0.18);
  --elev-icon: 0 8px 24px rgba(11,27,46,0.18), 0 2px 6px rgba(11,27,46,0.08);
}