/* ============================================================
   Realty ONE Group West — Color Tokens
   Brand: GOLD + BLACK + WHITE (the three primary brand colors)
   ============================================================ */
:root {
  /* ---- Brand primaries ---- */
  --rog-gold:        #C7AA5F;   /* RealtyONEGroup Gold (sampled from mark) */
  --rog-gold-deep:   #AD8F46;   /* pressed / hover-dark gold */
  --rog-gold-bright: #D8BE7C;   /* hover-light / highlights */
  --rog-gold-tint:   #EFE5CB;   /* soft fill / chips */
  --rog-gold-pale:   #F8F2E3;   /* page wash / subtle surface */

  --rog-black:       #111111;   /* brand ink (near-black) */
  --rog-true-black:  #000000;   /* logo lockups, pure contrast */
  --rog-white:       #FFFFFF;

  /* ---- Warm neutral ramp (paper → charcoal) ---- */
  --warm-50:   #FAF8F3;
  --warm-100:  #F2EEE5;
  --warm-200:  #E6E0D3;
  --warm-300:  #D0C8B6;
  --warm-400:  #ABA28D;
  --warm-500:  #837A68;
  --warm-600:  #5E5749;
  --warm-700:  #423D32;
  --warm-800:  #2A2620;
  --warm-900:  #1A1712;

  /* ---- Semantic status (muted, editorial) ---- */
  --status-success: #4F7A4E;
  --status-success-bg: #EAF1E9;
  --status-warning: #C7882F;
  --status-warning-bg: #F8EEDA;
  --status-danger:  #B23A2E;
  --status-danger-bg:  #F6E4E1;
  --status-info:    #3E6C8F;
  --status-info-bg:    #E3ECF2;

  /* ============================================================
     Semantic aliases — use these in components
     ============================================================ */
  --brand:            var(--rog-gold);
  --brand-deep:       var(--rog-gold-deep);
  --brand-bright:     var(--rog-gold-bright);
  --brand-contrast:   var(--rog-black);   /* text/icon on gold */
  --ink:              var(--rog-black);

  --text-primary:     var(--rog-black);
  --text-secondary:   var(--warm-600);
  --text-muted:       var(--warm-500);
  --text-on-dark:     var(--rog-white);
  --text-on-brand:    var(--rog-black);
  --text-link:        var(--rog-gold-deep);

  --surface-page:     var(--rog-white);
  --surface-card:     var(--rog-white);
  --surface-subtle:   var(--warm-50);
  --surface-wash:     var(--rog-gold-pale);
  --surface-dark:     var(--rog-black);
  --surface-dark-2:   var(--warm-900);

  --border:           var(--warm-200);
  --border-strong:    var(--warm-300);
  --border-dark:      var(--warm-700);
  --border-brand:     var(--rog-gold);

  --focus-ring:       color-mix(in srgb, var(--rog-gold) 55%, transparent);
}
