/* ============================================================
   H DENTAL & UNIFORMES S.A.S. — Design tokens
   Ver docs/design-system.md
   ============================================================ */

:root {
  /* --- Marca (derivados del logo) --- */
  --brand-navy: #2F406A;
  --brand-navy-deep: #22304F;
  --brand-turquoise: #5CC6D0;      /* decorativo / chips claros */
  --brand-turquoise-ink: #0E6E7A;  /* accesible: enlaces, eyebrow, foco */
  --brand-teal-band: #0E6E7A;      /* fondo de banda full-width (texto blanco ≥ 5:1) */
  --brand-green: #8FC74A;          /* solo decorativo */
  --brand-green-ink: #4F7D1B;      /* botón WhatsApp, checks */

  /* --- Neutros --- */
  --paper: #FFFFFF;
  --surface: #F3F6F7;
  --surface-2: #E9EFF1;
  --ink: #1C2A3F;
  --ink-muted: #566677;
  --border: #DCE4E7;
  --border-strong: #C3D0D4;

  /* --- Estados --- */
  --success: #2F7D32;
  --warning: #B26B00;
  --error: #C0392B;
  --focus-ring: var(--brand-turquoise-ink);

  /* --- Tipografía --- */
  --font-display: "Archivo", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-body: "Figtree", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  /* --- Espaciado (base 8) --- */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
  --space-9: 6rem;
  --space-10: 8rem;

  /* --- Layout --- */
  --container: 1240px;
  --gutter: clamp(1.25rem, 5vw, 3rem);
  --band-skew: 2.2vw;              /* alto del borde diagonal de las bandas full-width */
  --section-y: clamp(var(--space-8), 6vw, var(--space-10));
  --header-h: 4.25rem;

  /* --- Bordes / radios / sombras --- */
  --radius-sm: 6px;
  --radius: 10px;
  --radius-lg: 16px;
  --radius-pill: 999px;
  --shadow-sm: 0 1px 2px rgba(28, 42, 63, 0.06);
  --shadow: 0 6px 20px -8px rgba(28, 42, 63, 0.18);
  --shadow-lg: 0 20px 48px -16px rgba(28, 42, 63, 0.22);

  /* --- Movimiento --- */
  --ease: 200ms cubic-bezier(0.2, 0.6, 0.2, 1);
}