/* Unlimited Credit Coaching — Color tokens
   Extracted from the marketing site + brand collateral.
   Palette is a navy → blue → sky ramp with neutral grays. */
:root {
  /* ---- Base palette ---- */
  --white:      #ffffff;

  /* Navy (hero, dark cards, footer) */
  --navy-975:   #06122e;  /* current-site hero / process / footer (deepest) */
  --navy-950:   #0b1e45;  /* legacy footer bar */
  --navy-900:   #10275c;  /* dark cards, primary brand */
  --navy-800:   #16357a;  /* hero gradient mid */
  --navy-700:   #1d4894;  /* hero gradient top */

  /* Brand blue (logo wordmark + chart mark) */
  --brand-blue: #2e6bc6;
  --blue-500:   #1c7fc4;  /* accent highlight (logo bars) */

  /* Sky (light-blue buttons, tinted section, dot patterns) */
  --sky-500:    #7fa9c4;
  --sky-400:    #a9c6da;  /* light button + tinted section bg */
  --sky-300:    #bcd4e2;
  --sky-200:    #cfe0ec;

  /* Neutrals */
  --gray-900:   #1a1d24;  /* headings, near-black */
  --gray-700:   #3b414c;
  --gray-600:   #5b6470;  /* body copy */
  --gray-400:   #9aa1ac;  /* muted / placeholder */
  --gray-300:   #c9ced6;  /* input borders */
  --gray-200:   #e4e7ec;  /* subtle borders / dividers */
  --gray-100:   #f4f5f7;  /* off-white section bg */

  /* Feedback */
  --success-500: #22a45d;
  --success-100: #e4f4ea;
  --whatsapp:    #25d366;
  --star:        #f5a623;  /* testimonial rating stars */

  /* ---- Semantic aliases ---- */
  --text-heading:  var(--gray-900);
  --text-body:     var(--gray-600);
  --text-muted:    var(--gray-400);
  --text-inverse:  var(--white);
  --text-on-dark:  #d6def0;   /* body copy inside navy cards */
  --text-accent:   var(--brand-blue);

  --surface-page:        var(--white);
  --surface-muted:       var(--gray-100);
  --surface-section-sky: var(--sky-400);
  --surface-card:        var(--white);
  --surface-card-dark:   var(--navy-900);
  --surface-footer:      var(--navy-950);

  --brand-primary:   var(--navy-900);
  --brand-secondary: var(--sky-400);
  --brand-accent:    var(--brand-blue);

  --border-subtle: var(--gray-200);
  --border-input:  var(--gray-300);
  --border-accent: var(--navy-900);

  /* Hero / dark background gradient */
  --gradient-hero: linear-gradient(160deg, var(--navy-700) 0%, var(--navy-900) 60%, var(--navy-950) 100%);
  --gradient-card-dark: linear-gradient(150deg, var(--navy-800) 0%, var(--navy-900) 100%);

  /* Button colors */
  --btn-primary-bg:      var(--navy-900);
  --btn-primary-text:    var(--white);
  --btn-primary-hover:   var(--navy-800);
  --btn-secondary-bg:    var(--sky-400);
  --btn-secondary-text:  var(--white);
  --btn-secondary-hover: var(--sky-500);
  --btn-light-bg:        var(--white);
  --btn-light-text:      var(--navy-900);
}