/* ============================================================
   SCC — Color tokens
   Source: Brand Guideline Sheet 1.2 (Color Palette)
   SCC Red #EF4140 · SCC Green #25592D · SCC Off White #F5F5F5
   ============================================================ */
:root {
  /* ---- Brand core (from guideline) ---- */
  --scc-red:        #EF4140;   /* RGB 239,65,64  — primary */
  --scc-green:      #25592D;   /* RGB 37,89,45   — primary */
  --scc-off-white:  #F5F5F5;   /* RGB 245,245,245 */

  /* ---- Red ramp (derived from #EF4140 for UI states) ---- */
  --scc-red-50:   #FDECEC;
  --scc-red-100:  #FBD5D5;
  --scc-red-200:  #F7AEAD;
  --scc-red-300:  #F38280;
  --scc-red-400:  #F16261;
  --scc-red-500:  #EF4140;   /* = --scc-red */
  --scc-red-600:  #D62F2E;   /* hover */
  --scc-red-700:  #B22322;   /* active / press */
  --scc-red-800:  #8C1B1A;
  --scc-red-900:  #5E1211;

  /* ---- Green ramp (derived from #25592D) ---- */
  --scc-green-50:   #EAF1EB;
  --scc-green-100:  #CADBCD;
  --scc-green-200:  #97B79C;
  --scc-green-300:  #5E8966;
  --scc-green-400:  #3A7044;
  --scc-green-500:  #25592D;   /* = --scc-green */
  --scc-green-600:  #1F4A26;
  --scc-green-700:  #173A1D;
  --scc-green-800:  #102A15;
  --scc-green-900:  #0A1B0D;

  /* ---- Gold (VIP badge / price capsule — premium accent) ---- */
  --scc-gold:       #D4A02A;
  --scc-gold-light: #F2D27A;
  --scc-gold-dark:  #9C7016;

  /* ---- Neutrals (warm-leaning grey, anchored on off-white) ---- */
  --scc-ink:      #1A1614;   /* near-black headings */
  --scc-neutral-900: #2B2522;
  --scc-neutral-800: #3D3835;
  --scc-neutral-700: #57514D;
  --scc-neutral-600: #756E69;
  --scc-neutral-500: #97908B;
  --scc-neutral-400: #BDB6B1;
  --scc-neutral-300: #DBD6D2;
  --scc-neutral-200: #EAE6E2;
  --scc-neutral-100: #F2EFEC;
  --scc-neutral-50:  #F8F6F4;
  --scc-white:    #FFFFFF;

  /* ---- Secondary gradient palette (guideline accents) ---- */
  --scc-accent-pink:   #D63772;
  --scc-accent-violet: #685390;
  --scc-accent-mauve:  #A3478E;
  --scc-accent-blue:   #3B527B;
  --scc-accent-slate:  #2F4858;

  /* ---- Semantic aliases ---- */
  --color-primary:        var(--scc-red);
  --color-primary-hover:  var(--scc-red-600);
  --color-primary-active: var(--scc-red-700);
  --color-secondary:        var(--scc-green);
  --color-secondary-hover:  var(--scc-green-600);
  --color-secondary-active: var(--scc-green-700);

  --color-success: var(--scc-green-500);
  --color-warning: var(--scc-gold);
  --color-danger:  var(--scc-red-600);
  --color-info:    var(--scc-accent-blue);

  /* Text */
  --text-strong:   var(--scc-ink);
  --text-body:     var(--scc-neutral-800);
  --text-muted:    var(--scc-neutral-600);
  --text-faint:    var(--scc-neutral-500);
  --text-on-red:   #FFFFFF;
  --text-on-green: #FFFFFF;
  --text-on-gold:  var(--scc-green-700);
  --text-brand:    var(--scc-green);   /* wordmark / labels sit in green */

  /* Surfaces */
  --surface-page:    var(--scc-off-white);
  --surface-card:    var(--scc-white);
  --surface-sunken:  var(--scc-neutral-100);
  --surface-inverse: var(--scc-green-700);
  --surface-red:     var(--scc-red);
  --surface-green:   var(--scc-green);

  /* Borders & lines */
  --border-subtle:  var(--scc-neutral-200);
  --border-default: var(--scc-neutral-300);
  --border-strong:  var(--scc-neutral-400);
  --border-brand:   var(--scc-red);
  --hairline-red:   var(--scc-red);   /* the thin red underline under "SCC" */

  /* Focus */
  --focus-ring: color-mix(in srgb, var(--scc-red) 45%, transparent);
}