/* Rexum.Alo - Design tokens
   Base: Rexum brand kit (E:\rexum\assets\brand-tokens.css)
   Elevated to premium B2B SaaS (Linear / Soft-Structuralism). */

:root {
  /* Brand palette (Rexum) */
  --rex-green:      #0E2B22;
  --rex-green-600:  #15382C;
  --rex-green-700:  #0A211A;
  --rex-green-50:   #E7EFEA;
  --rex-black:      #111111;
  --rex-gold:       #C8A24D;
  --rex-gold-600:   #765B18;
  --rex-gold-50:    #F7F0DF;
  --rex-slate:      #2C3E50;
  --rex-cream:      #F2EFE6;
  --rex-cream-2:    #EAE6D8;
  --rex-white:      #FFFDF7;

  /* Semantic */
  --bg:             var(--rex-cream);
  --bg-soft:        var(--rex-cream-2);
  --surface:        var(--rex-white);
  --surface-2:      #F8F5EC;
  --ink:            #1B1A15;
  --ink-2:          #5F5C50;
  --ink-3:          #6B685F;
  --line:           #DCD6C6;
  --line-strong:    #C9C2AE;
  --accent:         var(--rex-gold);
  --accent-strong:  var(--rex-gold-600);
  --brand:          var(--rex-green);
  --brand-ink:      var(--rex-cream);

  /* Status (never color-only) */
  --success:        #1F6547;
  --success-bg:     #E4F2EA;
  --warning:        #7A4B00;
  --warning-bg:     #FBEFDA;
  --danger:         #A22B26;
  --danger-bg:      #FBE5E3;
  --info:           #2C5F8A;
  --info-bg:        #E4EEF5;

  /* Typography */
  --font-display: 'Raleway', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-body: 'Montserrat', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-mono: 'SFMono-Regular', ui-monospace, 'Cascadia Mono', Consolas, monospace;

  /* Type scale */
  --fs-hero:  44px;
  --fs-1:      34px;
  --fs-2:      24px;
  --fs-3:      18px;
  --fs-body:   15px;
  --fs-small:  13px;
  --fs-meta:   12px;
  --lh-tight: 1.15;
  --lh-body:  1.6;

  /* Space (4px base) */
  --sp-1:  4px; --sp-2:  8px;  --sp-3:  12px; --sp-4:  16px;
  --sp-5:  24px; --sp-6:  32px; --sp-7:  48px; --sp-8:  64px;

  /* Shape */
  --r-sm:   8px;  --r-md:  12px; --r-lg:  16px; --r-xl:  24px;
  --r-pill: 999px;

  /* Elevation */
  --shadow-1: 0 1px 2px rgba(17,17,17,.06), 0 1px 4px rgba(17,17,17,.05);
  --shadow-2: 0 4px 12px rgba(17,17,17,.08), 0 2px 4px rgba(17,17,17,.04);
  --shadow-3: 0 12px 32px rgba(17,17,17,.14), 0 4px 10px rgba(17,17,17,.08);

  /* Layout */
  --max-site: 1180px;
  --max-app:  1280px;
  --sidebar-w: 252px;
  --topbar-h: 60px;

  /* Motion */
  --t-fast: 180ms cubic-bezier(.32,.72,0,1);
  --t-med:  240ms cubic-bezier(.25,.6,.3,1);
}

@media (max-width: 767px) {
  :root {
    --fs-hero: 32px; --fs-1: 26px; --fs-2: 20px; --fs-3: 16px;
  }
}

/* Dark - brand-led */
.dark {
  --bg: var(--rex-green-700);
  --bg-soft: var(--rex-green-600);
  --surface: #102F26;
  --surface-2: #0E2B22;
  --ink: var(--rex-cream);
  --ink-2: #B9B4A0;
  --ink-3: #8A877B;
  --line: rgba(242,239,230,.14);
  --line-strong: rgba(242,239,230,.26);
}

@media (prefers-reduced-motion: reduce) {
  * { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}