/* ============================================================
   IHR — Color tokens
   Brand: deep navy + metallic gold on warm cream/ivory.
   Derived from the IHR logo (navy ground, gold mark) and the
   navy/gold/cream/slate reference palette.
   ============================================================ */

:root {
  /* ---- Navy (primary brand ground) ---- */
  --navy-950: #0A1325;
  --navy-900: #0E1B33;   /* deepest — logo ground bottom */
  --navy-800: #13233F;   /* primary brand navy */
  --navy-700: #1B3157;
  --navy-600: #244070;
  --navy-500: #2F5089;
  --navy-400: #4D6FA8;
  --navy-300: #8499BC;
  --navy-200: #B9C5D8;
  --navy-100: #DFE5EF;
  --navy-50:  #F0F3F8;

  /* ---- Gold (metallic accent) ---- */
  --gold-900: #6E5118;
  --gold-800: #8C6A21;
  --gold-700: #A9832C;
  --gold-600: #BF9636;   /* deep gold (press) */
  --gold-500: #C9A24B;   /* primary gold */
  --gold-400: #D6B466;   /* hover */
  --gold-300: #E3CA8C;
  --gold-200: #EEDCB3;
  --gold-100: #F6ECD6;
  --gold-50:  #FBF6EC;
  /* metallic sheen for fills/text (logo gradient) */
  --gold-gradient: linear-gradient(150deg, #E8C97A 0%, #C9A24B 42%, #A9832C 100%);  /* @kind color */
  --gold-gradient-text: linear-gradient(180deg, #E6C778 0%, #C9A24B 55%, #B08A30 100%);  /* @kind color */

  /* ---- Cream / Ivory (warm light surfaces) ---- */
  --cream-50:  #FCFAF5;
  --cream-100: #F7F2E8;   /* primary page cream */
  --cream-200: #EFE8D9;
  --cream-300: #E4DAC4;
  --ivory:     #FAF7F0;

  /* ---- Slate (cool dark neutral, charcoal) ---- */
  --slate-900: #161D23;
  --slate-800: #1E2A33;   /* deep slate (alt dark ground) */
  --slate-700: #2C3A45;
  --slate-600: #45555F;
  --slate-500: #647079;
  --slate-400: #8C969D;
  --slate-300: #B6BdC2;
  --slate-200: #D7DBDE;
  --slate-100: #ECEEF0;

  --white: #FFFFFF;
  --black: #0A0E14;

  /* ---- Semantic: status ---- */
  --success-600: #2E7D52;
  --success-500: #3A9A66;
  --success-100: #E1F0E8;
  --warning-600: #B8842A;
  --warning-500: #D89F3A;
  --warning-100: #F8EED6;
  --danger-600:  #B23B33;
  --danger-500:  #CF4B42;
  --danger-100:  #F8E2E0;

  /* ============================================================
     Semantic aliases — reference these in components/UI kits
     ============================================================ */

  /* Surfaces */
  --surface-page:        var(--cream-100);   /* default warm page */
  --surface-page-alt:    var(--cream-200);
  --surface-card:        var(--white);
  --surface-card-alt:    var(--cream-50);
  --surface-dark:        var(--navy-800);    /* navy section ground */
  --surface-dark-deep:   var(--navy-900);
  --surface-dark-alt:    var(--slate-800);   /* slate section ground */
  --surface-overlay:     rgba(14, 27, 51, 0.62);

  /* Text */
  --text-strong:    var(--navy-900);   /* headings on light */
  --text-body:      var(--slate-700);  /* body on light */
  --text-muted:     var(--slate-500);  /* secondary on light */
  --text-faint:     var(--slate-400);
  --text-on-dark:        rgba(255,255,255,0.94);
  --text-on-dark-muted:  rgba(255,255,255,0.66);
  --text-gold:      var(--gold-600);
  --text-inverse:   var(--white);

  /* Brand */
  --brand-primary:   var(--navy-800);
  --brand-accent:    var(--gold-500);
  --brand-accent-ink: var(--gold-700);

  /* Lines / borders */
  --border-subtle:  rgba(14, 27, 51, 0.10);
  --border-default: rgba(14, 27, 51, 0.16);
  --border-strong:  rgba(14, 27, 51, 0.28);
  --border-on-dark: rgba(255,255,255,0.14);
  --border-gold:    rgba(201, 162, 75, 0.55);

  /* Focus */
  --focus-ring: rgba(201, 162, 75, 0.55);
}