/* ============================================================
   Virtual.DO — Tokens de marca (v1 provisional)
   ------------------------------------------------------------
   SOT visual del sitio. Derivado del logo provisional
   (imagenes/logo/virtual-do-logo-provisional.jpeg).

   Cuando llegue el logo/paleta FINAL de la diseñadora,
   se reemplazan estos valores aquí — sin refactorizar el resto.
   ============================================================ */

:root {
  /* ---- Color: marca ---- */
  --vd-ink: #37434F;          /* slate oscuro — títulos, wordmark, texto fuerte */
  --vd-ink-deep: #2A333D;     /* slate profundo — fondos oscuros (footer, franja hero) */
  --vd-accent: #1E9FE8;       /* azul brillante — el punto ".", CTAs, links, "chispazo" */
  --vd-accent-strong: #1789CC;/* azul hover / estados activos */
  --vd-accent-soft: #E7F4FC;  /* azul lavado — fondos suaves, badges */

  /* ---- Color: texto ---- */
  --vd-text: #3D4855;         /* cuerpo de texto */
  --vd-text-muted: #6B7885;   /* texto secundario / apoyos */
  --vd-text-on-dark: #EAF0F5; /* texto sobre fondos oscuros */
  --vd-text-on-accent: #FFFFFF;

  /* ---- Color: superficies ---- */
  --vd-bg: #FFFFFF;           /* fondo base */
  --vd-surface: #F4F7F9;      /* fondo de secciones alternas (gris frío claro) */
  --vd-border: #E3E8ED;       /* bordes / hairlines */

  /* ---- Efecto de marca (glow del hexágono, uso MUY medido) ---- */
  --vd-glow-accent: 0 0 32px rgba(30, 159, 232, 0.35);

  /* ---- Tipografía ---- */
  --vd-font-display: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --vd-font-text: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  --vd-weight-regular: 400;
  --vd-weight-medium: 500;
  --vd-weight-semibold: 600;
  --vd-weight-bold: 700;

  /* Escala tipográfica fluida (clamp: min, preferido, max) */
  --vd-fs-hero: clamp(2.5rem, 5vw, 4rem);
  --vd-fs-h2: clamp(1.75rem, 3.2vw, 2.5rem);
  --vd-fs-h3: clamp(1.15rem, 1.8vw, 1.4rem);
  --vd-fs-body: 1.0625rem;    /* ~17px */
  --vd-fs-small: 0.9375rem;   /* ~15px */

  --vd-lh-tight: 1.15;
  --vd-lh-normal: 1.6;

  /* ---- Espaciado (escala base 4px) ---- */
  --vd-space-1: 0.25rem;
  --vd-space-2: 0.5rem;
  --vd-space-3: 0.75rem;
  --vd-space-4: 1rem;
  --vd-space-6: 1.5rem;
  --vd-space-8: 2rem;
  --vd-space-12: 3rem;
  --vd-space-16: 4rem;
  --vd-space-24: 6rem;        /* separación vertical entre secciones */

  /* ---- Layout ---- */
  --vd-container-max: 1120px;
  --vd-container-pad: 1.5rem;

  /* ---- Radios ---- */
  --vd-radius-sm: 6px;
  --vd-radius-md: 12px;
  --vd-radius-lg: 20px;
  --vd-radius-pill: 999px;

  /* ---- Sombras (sutiles, sobrias) ---- */
  --vd-shadow-sm: 0 1px 2px rgba(42, 51, 61, 0.06);
  --vd-shadow-md: 0 8px 24px rgba(42, 51, 61, 0.08);

  /* ---- Transiciones ---- */
  --vd-transition: 180ms ease;
}