/* ==========================================================================
   Centro INDAT — Design tokens

   Salen del modelo de Claude Design (sistema "Organic", retocado a turquesa
   y rosa del logo). Son la unica fuente de verdad del diseno: todo lo que
   esta aca esta espejado en theme.json, o el cliente no lo ve en el editor
   de bloques.
   ========================================================================== */

:root {
	/* --- Marca --------------------------------------------------------- */
	--indat-bg: #faf5ec;
	--indat-surface: #f2e9da;
	--indat-text: #201e1d;
	--indat-white: #ffffff;
	--indat-accent: #3d8494;
	--indat-accent-2: #e59aa2;

	/* --- Rampa turquesa (acento) ---------------------------------------- */
	--indat-accent-100: #eaf6f9;
	--indat-accent-200: #d3ecf1;
	--indat-accent-300: #b3dde6;
	--indat-accent-400: #8cc4d1;
	--indat-accent-500: #5ea7b7;
	--indat-accent-600: #3a7a89;
	--indat-accent-700: #2e6774;
	--indat-accent-800: #244f59;
	--indat-accent-900: #18363d;

	/* --- Rampa rosa (segundo acento) ------------------------------------ */
	--indat-accent-2-100: #fdf0f1;
	--indat-accent-2-200: #fbe0e2;
	--indat-accent-2-300: #f7c8cc;
	--indat-accent-2-400: #f2aab0;
	--indat-accent-2-500: #e08d95;
	--indat-accent-2-600: #c36f78;
	--indat-accent-2-700: #9d535c;
	--indat-accent-2-800: #733c43;
	--indat-accent-2-900: #4a272c;

	/* --- Neutros calidos ------------------------------------------------- */
	--indat-neutral-100: #f9f4ed;
	--indat-neutral-200: #eee7db;
	--indat-neutral-300: #dcd3c4;
	--indat-neutral-700: #645c50;
	--indat-neutral-800: #474238;
	--indat-neutral-900: #2e2b25;

	/* --- WhatsApp -------------------------------------------------------- */
	--indat-wa: #1f9d55;
	--indat-wa-bright: #25d366;
	--indat-wa-soft: #dff5e7;
	--indat-wa-ink: #1a7a43;

	/* --- Tipografia ------------------------------------------------------ */
	--indat-font-display: "Nunito", system-ui, -apple-system, "Segoe UI", sans-serif;
	--indat-font-body: "Figtree", system-ui, -apple-system, "Segoe UI", sans-serif;

	--indat-h1: clamp(2.5rem, 1.4rem + 4.6vw, 4.875rem);
	--indat-h1-page: clamp(2.5rem, 1.6rem + 3.6vw, 4.25rem);
	--indat-h2: clamp(1.875rem, 1.4rem + 1.9vw, 2.75rem);
	--indat-h3: clamp(1.25rem, 1.1rem + 0.5vw, 1.5rem);
	--indat-lead: clamp(1.0625rem, 1rem + 0.25vw, 1.25rem);
	--indat-body: 1rem;
	--indat-small: 0.875rem;

	/* --- Layout ---------------------------------------------------------- */
	--indat-page-width: 1200px;
	--indat-narrow-width: 760px;
	--indat-gutter: clamp(16px, 4vw, 40px);
	--indat-section-y: clamp(56px, 8vw, 110px);
	--indat-header-h: 76px;

	/* --- Formas ---------------------------------------------------------- */
	--indat-radius-md: 20px;
	--indat-radius-lg: 32px;
	--indat-radius-xl: 40px;
	--indat-radius-pill: 999px;

	/* --- Sombras (teñidas con el tono de la tinta) ------------------------- */
	--indat-shadow-sm: 0 1px 2px color-mix(in srgb, #2e2b25 14%, transparent);
	--indat-shadow-md: 0 3px 10px color-mix(in srgb, #2e2b25 16%, transparent);
	--indat-shadow-lg: 0 12px 32px color-mix(in srgb, #2e2b25 22%, transparent);

	/* --- Movimiento ------------------------------------------------------ */
	--indat-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
	--indat-dur: 0.28s;

	--indat-z-header: 100;
	--indat-z-wa: 90;
}
