/*
 * Los tokens del sitio. Un solo sitio donde vive cada color, cada tamaño y cada
 * sombra: cambiar la marca es cambiar este fichero, no rebuscar por las vistas.
 *
 * Los `--bl-*` del final NO son un descuido: el banner de cookies que inyecta la
 * plataforma se pinta con esos nombres (con los colores de otro proyecto como
 * valor por defecto). Mapeándolos aquí, el banner sale con ESTA marca sin tocar
 * el fichero de la plataforma.
 */
:root {
  /* Marca */
  --bp-ink: #0A1B28;
  --bp-deep: #0F3546;
  --bp-teal: #0D7F78;
  --bp-teal-dark: #095E59;
  --bp-aqua: #23C7B4;
  --bp-coral: #F35A3F;
  --bp-coral-dark: #D63F26;

  /* Neutros */
  --bp-paper: #FFFFFF;
  --bp-sand: #F7F5F1;
  --bp-mist: #EFF4F5;
  --bp-line: #DFE6E9;
  --bp-text: #17242E;
  --bp-muted: #5C6D79;

  /* Tipografía */
  --bp-font-display: 'Manrope', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --bp-font-body: 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;

  /* Ritmo */
  --bp-radio: 14px;
  --bp-radio-s: 8px;
  --bp-ancho: 1160px;
  --bp-gutter: clamp(1.15rem, 5vw, 2.5rem);
  --bp-seccion: clamp(3.5rem, 8vw, 6.5rem);

  /* Sombras: suaves, nunca duras — el sitio tiene que leerse como papel. */
  --bp-sombra-s: 0 1px 2px rgba(10, 27, 40, .05), 0 2px 8px rgba(10, 27, 40, .04);
  --bp-sombra-m: 0 2px 4px rgba(10, 27, 40, .04), 0 12px 28px rgba(10, 27, 40, .07);
  --bp-sombra-l: 0 24px 60px rgba(10, 27, 40, .13);

  /* El banner de cookies de la plataforma, con la marca de esta web. */
  --bl-rosa: var(--bp-teal);
  --bl-hondo: var(--bp-teal);
  --bl-profundo: var(--bp-deep);
  --bl-arena: var(--bp-line);
  --bl-crema: var(--bp-mist);
  --bl-tinta: var(--bp-text);
  --bl-suave: var(--bp-muted);
  --bl-font-display: var(--bp-font-display);
  --bl-font-body: var(--bp-font-body);
}