/* Tran Group color tokens. Base hexes first, semantic aliases below. */
:root {
  /* Brand & accent */
  --tg-sage: #ACBDA1;
  --tg-sage-active: #8FA382;
  --tg-sage-disabled: #E5EAE2;
  --tg-tan: #C49963;
  --tg-charcoal: #191919;

  /* Surface */
  --tg-canvas: #ffffff;
  --tg-surface-soft: #f7f7f7;
  --tg-surface-strong: #f2f2f2;

  /* Hairlines & borders */
  --tg-hairline: #dddddd;
  --tg-hairline-soft: #ebebeb;
  --tg-border-strong: #c1c1c1;

  /* Text */
  --tg-ink: #191919;
  --tg-body: #3f3f3f;
  --tg-muted: #6a6a6a;
  --tg-muted-soft: #929292;
  --tg-on-primary: #191919;
  --tg-on-dark: #ffffff;

  /* Semantic */
  --tg-error: #b42318;
  --tg-error-hover: #912018;
  --tg-legal-link: #2563eb;
  --tg-star: #191919;
  --tg-scrim: rgba(0, 0, 0, 0.5);

  /* --- Semantic aliases --- */
  --tg-primary: var(--tg-sage);
  --tg-primary-active: var(--tg-sage-active);
  --tg-primary-disabled: var(--tg-sage-disabled);

  --tg-text-heading: var(--tg-ink);
  --tg-text-body: var(--tg-body);
  --tg-text-muted: var(--tg-muted);
  --tg-text-on-primary: var(--tg-on-primary);
  --tg-text-on-dark: var(--tg-on-dark);
  --tg-link: var(--tg-ink);
  --tg-link-hover: var(--tg-charcoal);

  --tg-surface-page: var(--tg-canvas);
  --tg-surface-card: var(--tg-canvas);
  --tg-surface-sunken: var(--tg-surface-soft);
  --tg-surface-icon: var(--tg-surface-strong);

  --tg-border-default: var(--tg-hairline);
  --tg-border-subtle: var(--tg-hairline-soft);
  --tg-border-focus: var(--tg-ink);
}

/* --- Luxury real-estate brand layer (from the live Tran Group × eXp site) ---
   Gold is the primary marketing voltage; charcoal/navy carry the cinematic
   darks; cream is the editorial light floor; slate is body copy on cream; sage
   is reduced to a tint (stats band, logo). */
:root {
  --tg-gold: #C49963;            /* primary CTA / accent / display italic */
  --tg-gold-hover: #b0854f;
  --tg-gold-soft: #EFE6D6;       /* pale gold chip fill (score numbers) */
  --tg-navy: #131A22;            /* dark section / seller card */
  --tg-navy-soft: #1C2530;       /* raised surface on navy */
  --tg-cream: #F4F1EA;           /* editorial light section floor */
  --tg-cream-soft: #FBFAF6;      /* card fill on cream */
  --tg-slate: #5A6673;           /* body copy on cream/light */
  --tg-slate-soft: #8A93A0;      /* muted slate */
  --tg-sage-band: #DCE4D5;       /* pale sage stats-ticker background */
  --tg-up: #4F7A4F;              /* positive market delta */
  --tg-down: #B4443A;            /* negative market delta */
  --tg-on-gold: #ffffff;         /* text on gold CTAs */

  /* Marketing semantic aliases */
  --tg-accent: var(--tg-gold);
  --tg-accent-hover: var(--tg-gold-hover);
  --tg-surface-dark: var(--tg-navy);
  --tg-surface-cream: var(--tg-cream);
  --tg-text-slate: var(--tg-slate);
  --tg-text-display: var(--tg-ink);
}
