/* Driven VC — Color tokens
 * Palette from the brand board (Paleta de colores):
 *   Ink   #1B1D1F   Teal  #12B5BF   White #FFFFFF
 *   Navy  #003366   Coral #CF5254
 * Driven is mostly monochrome (ink on white, white on ink) with TEAL as the
 * single brand accent. Navy is reserved for dark "event" surfaces; coral is a
 * rare alert/highlight. Use accent sparingly — conviction, not volume.
 */
:root {
  /* ---- Base palette ---- */
  --ink:        #1B1D1F;   /* near-black, primary text & dark surfaces */
  --ink-900:    #121315;
  --ink-700:    #2C2F33;
  --ink-500:    #595E66;   /* muted text */
  --ink-300:    #9AA0A8;   /* disabled / hint text */
  --ink-150:    #D7DBE0;   /* borders */
  --ink-80:     #ECEEF1;   /* hairlines, track fills */
  --paper:      #F4F4F2;   /* off-white page background */
  --white:      #FFFFFF;

  --teal:       #12B5BF;   /* PRIMARY ACCENT */
  --teal-600:   #0E97A0;   /* hover / pressed accent */
  --teal-300:   #6FD4DA;   /* tints */
  --teal-100:   #DBF3F4;   /* accent wash */

  --navy:       #003366;   /* dark event/feature surfaces */
  --navy-800:   #06294B;
  --navy-700:   #0A3B66;

  --coral:      #CF5254;   /* alerts, the rare emphatic mark */
  --coral-600:  #B5403F;
  --coral-100:  #F8E2E2;

  /* ---- Semantic aliases ---- */
  --text-strong:    var(--ink);
  --text-body:      var(--ink-700);
  --text-muted:     var(--ink-500);
  --text-hint:      var(--ink-300);
  --text-inverse:   var(--white);
  --text-accent:    var(--teal-600);

  --surface-page:   var(--paper);
  --surface-card:   var(--white);
  --surface-sunken: var(--ink-80);
  --surface-ink:    var(--ink);     /* dark section */
  --surface-navy:   var(--navy);    /* event / summit section */
  --surface-accent: var(--teal);

  --border-subtle:  var(--ink-80);
  --border-default: var(--ink-150);
  --border-strong:  var(--ink);

  --accent:         var(--teal);
  --accent-hover:   var(--teal-600);
  --accent-wash:    var(--teal-100);

  --focus-ring:     var(--teal);

  --danger:         var(--coral);
  --danger-hover:   var(--coral-600);
  --danger-wash:    var(--coral-100);
}
