@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700;900&family=Open+Sans:wght@400;500;700;900&display=swap");

:root{
  /* Paleta */
  --color-dark:#336063;
  --color-key:#39B2BB;
  --color-support:#F28C45;
  --color-light:#E7F6F7;
  --color-white:#FFFFFF;
  --color-muted:#799698;
  --color-line:#E2E9E9;

  /* Tipografías */
  --font-primary:"Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-secondary:"Open Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-main:var(--font-secondary);

  /* Escala tipográfica */
  --type-h1:61px;
  --type-h2:49px;
  --type-h3:39px;
  --type-h4:31px;
  --type-h5:25px;
  --type-h6:20px;
  --type-card:20px;
  --type-stats:61px;
  --type-body:16px;
  --type-small:13px;
  --type-micro:10px;
  --type-label:var(--type-micro);
  --text-body:var(--type-body);

  /* Espacio y curvas */
  --space-content:18px;
  --radius-card:10px;
  --radius-button:10px;
  --radius-label:3px;

  /* Pesos */
  --weight-regular:400;
  --weight-medium:500;
  --weight-bold:700;
  --weight-black:900;

  /* Sombras derivadas del color oscuro */
  --shadow:0 30px 90px color-mix(in srgb,var(--color-dark) 14%,transparent);
  --shadow-soft:0 12px 32px color-mix(in srgb,var(--color-dark) 6%,transparent);
  --shadow-hover:0 18px 42px color-mix(in srgb,var(--color-dark) 16%,transparent);
}