/* =====================================================================
   PYDE · Tokens de diseño compartidos
   Colores, tipografía, espaciado, radios, sombras y movimiento del sistema .nd-.
   Los cargan la web pública (Publico/NuevaWeb/Layout, antes de sistema.css) y el
   área privada (Shared/Header/HeaderEmpresa), para que las dos respiren el mismo aire.
   Solo variables: ningún selector de elemento, así no choca con Crafto ni Metronic.
   Ojo: en las páginas con Metronic el html mide 13px; fuera de la web pública,
   usar px en lugar de los tamaños en rem (--nd-t-*).
   ===================================================================== */
:root {
	/* Marca: los dos azules del logotipo, el azul noche y el cian «digital» */
	--nd-noche: #061f42;
	--nd-marino: #082d5c;
	--nd-azul: #0d4c91;          /* azul del logotipo · acción principal (9.1:1 sobre blanco) */
	--nd-azul-medio: #1976ba;    /* segundo azul del logotipo (4.7:1 sobre blanco) */
	--nd-azul-hover: #0a3d76;
	--nd-cian: #6fd0ff;          /* acento solo sobre fondos oscuros */
	--nd-cian-fuerte: #08739f;   /* el mismo tono con contraste AA a cualquier tamaño: 5,3:1 sobre blanco, 4,9:1 sobre fondo suave
	                                (el anterior #0a7fb5 daba 4,45:1 y suspendía en texto pequeño) */
	--nd-degradado: linear-gradient(135deg, var(--nd-azul) 0%, var(--nd-azul-medio) 100%);
	--nd-degradado-noche: linear-gradient(140deg, var(--nd-noche) 0%, var(--nd-marino) 45%, var(--nd-azul) 100%);

	/* Neutros fríos, derivados del azul noche */
	--nd-tinta: #0b1b33;         /* titulares (17:1) */
	--nd-texto: #33415c;         /* cuerpo (10:1) */
	--nd-texto-suave: #5a6782;   /* secundario (5.6:1) */
	--nd-texto-tenue: #7b879c;   /* solo en texto grande (3.7:1): nunca en cuerpo, ayudas ni placeholders */
	--nd-borde: #e3e8f0;
	--nd-borde-fuerte: #cdd5e1;
	--nd-fondo: #ffffff;
	--nd-fondo-suave: #f5f8fc;
	--nd-fondo-azul: #eaf2fb;

	/* Tipografía: la misma pareja que oapcnc.es y el resto de PYDE */
	--nd-fuente-titulos: "Mulish", system-ui, -apple-system, "Segoe UI", sans-serif;
	--nd-fuente-texto: "Archivo", system-ui, -apple-system, "Segoe UI", sans-serif;

	/* Escala tipográfica fluida (≈ 1.25 en móvil, ≈ 1.333 en escritorio).
	   Dos tamaños de título de sección: h2 para las secciones principales y h2-medio para
	   las secundarias, para que no todos los titulares compitan con el mismo peso */
	--nd-t-display: clamp(2.6rem, 1rem + 4vw, 5.5rem);       /* 42 → 88 */
	--nd-t-h2: clamp(2rem, 1.25rem + 2.8vw, 3.75rem);        /* 32 → 60 */
	--nd-t-h2-medio: clamp(1.75rem, 1.2rem + 1.8vw, 2.75rem); /* 28 → 44 */
	--nd-t-h3: clamp(1.3rem, 1.1rem + 0.7vw, 1.625rem);      /* 21 → 26 */
	--nd-t-entradilla: clamp(1.125rem, 1rem + 0.5vw, 1.375rem); /* 18 → 22 */
	--nd-t-cuerpo: 1.0625rem;                                /* 17 */
	--nd-t-pequeno: 0.9375rem;                               /* 15 */
	--nd-t-micro: 0.8125rem;                                 /* 13 */

	/* Espaciado (base 4) */
	--nd-e-1: 4px;
	--nd-e-2: 8px;
	--nd-e-3: 12px;
	--nd-e-4: 16px;
	--nd-e-5: 24px;
	--nd-e-6: 32px;
	--nd-e-7: 48px;
	--nd-e-8: 64px;
	--nd-e-9: 96px;
	--nd-seccion: clamp(72px, 5vw + 48px, 136px);           /* ritmo vertical: 72 → 136 */
	--nd-seccion-corta: clamp(48px, 4vw + 24px, 88px);     /* bloques compactos y transiciones */

	/* Radios */
	--nd-r-s: 10px;
	--nd-r-m: 16px;
	--nd-r-l: 24px;
	--nd-r-xl: 32px;
	--nd-r-pastilla: 999px;

	/* Sombras: suaves, teñidas del azul noche */
	--nd-sombra-1: 0 1px 2px rgba(8, 45, 92, 0.05), 0 2px 8px -2px rgba(8, 45, 92, 0.06);
	--nd-sombra-2: 0 2px 4px rgba(8, 45, 92, 0.04), 0 16px 40px -16px rgba(8, 45, 92, 0.18);
	--nd-sombra-3: 0 4px 8px rgba(8, 45, 92, 0.04), 0 32px 64px -24px rgba(8, 45, 92, 0.28);
	/* Sombra ambiental de los mockups del producto: amplia y muy difusa, sin borde duro */
	--nd-sombra-producto: 0 1px 1px rgba(8, 45, 92, 0.04), 0 12px 24px -12px rgba(8, 45, 92, 0.12), 0 48px 96px -32px rgba(8, 45, 92, 0.24);
	--nd-borde-hover: #c9d9ec;

	/* Movimiento: dos familias.
	   · Estados (hover, foco, abrir/cerrar): 160-240 ms, se sienten inmediatos.
	   · Narrativa (apariciones, el punto que brota, el anillo que se dibuja): 700 ms o más.
	   Elevación de tarjetas de 3 px y pulsación al 98 % */
	--nd-curva: cubic-bezier(0.22, 1, 0.36, 1);       /* salida suave, sin rebote */
	--nd-curva-entrada: cubic-bezier(0.65, 0, 0.35, 1);
	--nd-d-rapida: 160ms;
	--nd-d-media: 240ms;
	--nd-d-lenta: 700ms;
	--nd-elevar: -3px;

	--nd-ancho: 1280px;
	--nd-ancho-texto: 64ch;
	--nd-alto-cabecera: 76px;
}