/* ============================================================
   Visto Turbo — Design tokens (espelho de astro-site/src/styles/global.css)
   Mantido em sincronia manual: se os tokens do site mudarem, atualizar aqui.
   ============================================================ */

:root {
  /* --- COLORS --- */
  --vt-red:        #b42236;
  --vt-red-600:    #9c1d2f;
  --vt-red-700:    #841825;
  --vt-red-100:    #f7e3e6;

  --vt-indigo:     #3c3b6f;
  --vt-blue:       #2c2c6d;
  --vt-navy:       #17152c;
  --vt-navy-800:   #211f3d;

  --vt-white:      #ffffff;
  --vt-paper:      #f6f6f9;
  --vt-gray-100:   #ececed;
  --vt-gray-200:   #d9d9e0;
  --vt-gray-400:   #9a9aae;
  --vt-gray-600:   #5a5a6e;
  --vt-ink:        #17152c;

  --brand-primary:        var(--vt-red);
  --brand-primary-hover:  var(--vt-red-600);
  --brand-secondary:      var(--vt-indigo);
  --brand-accent:         var(--vt-blue);

  --surface-page:    var(--vt-paper);
  --surface-card:    var(--vt-white);
  --surface-dark:    var(--vt-navy);
  --surface-dark-2:  var(--vt-navy-800);
  --surface-tint:    var(--vt-red-100);

  --text-heading:    var(--vt-navy);
  --text-body:       var(--vt-gray-600);
  --text-muted:      var(--vt-gray-400);
  --text-on-dark:    var(--vt-white);
  --text-on-primary: var(--vt-white);
  --text-accent:     var(--vt-red);

  --border-subtle:   var(--vt-gray-200);
  --border-strong:   var(--vt-indigo);

  /* --- TYPOGRAPHY --- */
  --font-display: 'Montserrat', 'Brother 1816', system-ui, sans-serif;
  --font-body:    'Jost', 'ITC Avant Garde Gothic', 'Century Gothic', system-ui, sans-serif;

  --fw-body:      400;
  --fw-medium:    500;
  --fw-semibold:  600;
  --fw-bold:      700;
  --fw-black:     900;

  --ls-eyebrow: 0.22em;

  /* --- SPACING --- */
  --container-max: 1200px;

  /* --- EFFECTS --- */
  --radius-sm:   6px;
  --radius-md:   12px;
  --radius-lg:   20px;
  --radius-xl:   28px;
  --radius-pill: 999px;

  --shadow-sm:  0 1px 2px rgba(23, 21, 44, 0.06);
  --shadow-md:  0 6px 18px rgba(23, 21, 44, 0.10);
  --shadow-lg:  0 18px 40px rgba(23, 21, 44, 0.14);
  --shadow-red: 0 10px 24px rgba(180, 34, 54, 0.30);

  --grad-navy:  linear-gradient(160deg, #2c2c6d 0%, #17152c 100%);
  --grad-red:   linear-gradient(135deg, #c8283e 0%, #b42236 60%, #841825 100%);

  --ease-out:   cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast:   0.15s;
  --dur-base:   0.28s;
}