/* ============================================================
   VICTORY · Design Tokens
   Importa este archivo en cualquier HTML de Victory / Victory CYCSA.
   Fuente: Manuales de Identidad Corporativa Victory Auto México (2024).
   ============================================================ */
:root{
  /* ===== COLOR CORPORATIVO ===== */
  --vic-green:#97D700;        /* Pantone 375 · RGB 151,215,0 · CMYK 30/0/100/16 */
  --vic-charcoal:#253746;     /* Pantone 7546 · RGB 36,55,70 · CMYK 47/21/0/73 */
  --vic-blue:#0085CA;         /* Process Blue · SOLO línea Eléctricos */

  /* ===== TONOS VERDE ===== */
  --green-100:#97D700; --green-80:#ABDF33; --green-60:#C0E766; --green-40:#D5EF99; --green-20:#EAF7CC;
  /* ===== TONOS CHARCOAL ===== */
  --charcoal-100:#253746; --charcoal-80:#515F6B; --charcoal-60:#7C8790; --charcoal-40:#A8AFB5; --charcoal-20:#D3D7DA;
  /* ===== TONOS AZUL (Eléctricos) ===== */
  --blue-100:#0085CA; --blue-80:#339DD4; --blue-60:#66B6DF; --blue-40:#99CEE9; --blue-20:#CCE7F4;

  /* ===== COLOR SECUNDARIO ===== */
  --cool-gray-6:#A7A8AA; --cool-gray-8:#888B8D; --cool-gray-11:#53565A;
  --pantone-7542:#A4BCC2; --pantone-021:#FE5000; --black:#000000;

  /* ===== SEMÁNTICOS ===== */
  --bg:#FFFFFF; --bg-soft:#F4F6F4; --ink:#253746; --ink-soft:#53565A; --line:#E2E6E4;

  /* ===== TIPOGRAFÍA (fuentes de marca + fallbacks web) ===== */
  --font-display:'Avenir','Montserrat',system-ui,sans-serif;   /* logo / fonograma */
  --font-head:'Objektiv Mk3','Archivo',system-ui,sans-serif;    /* títulos / UI */
  --font-body:'Helvetica Neue','Inter',system-ui,sans-serif;    /* cuerpo */

  /* ===== FORMA ===== */
  --r-sm:8px; --r-md:14px; --r-lg:22px; --r-pill:999px;
  --shadow:0 10px 30px -12px rgba(37,55,70,.35);
}

/* ===== UTILIDADES DE MARCA ===== */
.vic-bg-green{background:var(--vic-green);color:var(--vic-charcoal)}
.vic-bg-charcoal{background:var(--vic-charcoal);color:#fff}
.vic-bg-blue{background:var(--vic-blue);color:#fff}
.vic-text-green{color:var(--vic-green)}
.vic-text-charcoal{color:var(--vic-charcoal)}

.vic-h{font-family:var(--font-head);font-weight:800;text-transform:uppercase;line-height:1.02;letter-spacing:-.01em}
.vic-display{font-family:var(--font-display);font-weight:800;letter-spacing:.02em}
.vic-body{font-family:var(--font-body);line-height:1.6}

.vic-btn{font-family:var(--font-head);font-weight:700;border:0;border-radius:var(--r-pill);padding:13px 26px;cursor:pointer;display:inline-flex;gap:8px;align-items:center;text-decoration:none;transition:.18s}
.vic-btn--primary{background:var(--vic-green);color:var(--vic-charcoal)}
.vic-btn--dark{background:var(--vic-charcoal);color:#fff}
.vic-btn--electric{background:var(--vic-blue);color:#fff}
.vic-btn--ghost{background:transparent;color:var(--vic-charcoal);border:2px solid var(--vic-charcoal)}

.vic-badge{font-family:var(--font-head);font-weight:700;font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;padding:5px 12px;border-radius:var(--r-pill)}

/* Textura insignia: parrilla hexagonal (verde con trama charcoal) */
.vic-hex{
  background-color:var(--vic-green);
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='84' height='48' viewBox='0 0 84 48'><g fill='none' stroke='%23253746' stroke-width='1.4'><path d='M0 12 L14 4 L28 12 L28 28 L14 36 L0 28 Z'/><path d='M28 12 L42 4 L56 12 L56 28 L42 36 L28 28 Z'/><path d='M56 12 L70 4 L84 12 L84 28 L70 36 L56 28 Z'/><path d='M14 36 L28 28 L42 36 L42 52 L28 60 L14 52 Z'/></g></svg>");
}
/* Textura señalización / paso peatonal */
.vic-cross{background:repeating-linear-gradient(45deg,var(--vic-charcoal) 0 14px,var(--vic-green) 14px 28px)}