/*
 * Design tokens captured from live production (ginecologiaintegral.es)
 * on 2026-08-13 via computed styles. Refine against baseline screenshots
 * during the Phase 6 visual-diff acceptance gate; do not impose Konekta
 * agency colors here per the runbook.
 */

:root {
	/* Color */
	/* Los tres primeros salen del kit global de Elementor de producción
	   (`global-kit-styles`), que es donde la web define su sistema de color.
	   El navy estaba en #25344E, que no es el suyo: el real es #1F3C5B. */
	--kmc-color-navy: #1F3C5B;
	--kmc-color-navy-soft: #3A4C6B;
	--kmc-color-pink: #E8A5C3;
	--kmc-color-blue-accent: #4C7BD9;
	/* Azul del segundo tramo de los titulares a dos colores (medido en producción). */
	--kmc-color-blue-heading: #2E7CBF;
	--kmc-color-ink: #52555A;
	--kmc-color-ink-soft: #7A7D82;
	--kmc-color-surface: #F7F8F9;
	--kmc-color-alt-bg: #E7F1F3;   /* "Alt bg Light" del kit */
	--kmc-color-white: #FFFFFF;
	--kmc-gradient-hero: linear-gradient(90deg, #25344E 0%, #6B5C82 50%, #E8A5C3 100%);

	/* Typography */
	--kmc-font-body: "Poppins", -apple-system, BlinkMacSystemFont, sans-serif;
	--kmc-font-heading: "Archivo", -apple-system, BlinkMacSystemFont, sans-serif;
	/* Titulares con peso de verdad.
	   Estaba TODO a 600: H1, H2 y H3 con el mismo grosor. Una escala así no
	   marca jerarquía —solo cambia el tamaño— y se lee sin fuerza. El titular
	   y el que abre sección suben a 700 y se les aprieta el espaciado; el H3
	   se queda en 600, y ese contraste de peso es el que separa un nivel de
	   otro. Archivo se carga con 500, 600 y 700, así que no hay que traer
	   ninguna fuente nueva. */
	--kmc-h1-size: clamp(2.125rem, 1.5rem + 2.4vw, 3.75rem);
	--kmc-h1-weight: 700;
	--kmc-h1-tracking: -0.025em;
	--kmc-h2-weight: 700;
	--kmc-h2-tracking: -0.02em;
	/* DOS tamaños de H2, no uno.
	   Producción usa 36px para el titular que abre una SECCIÓN y 28px para un
	   subtítulo dentro del texto. Aquí estaban los dos a 46px, así que
	   "Servicios y precios de ginecología" gritaba lo mismo que la portada de
	   la página y la escala se veía descompensada. */
	--kmc-h2-size: clamp(1.5rem, 1.05rem + 1.5vw, 1.75rem);       /* 24 → 28px, dentro del texto */
	--kmc-h2-seccion: clamp(1.75rem, 1.1rem + 2.2vw, 2.25rem);    /* 28 → 36px, abre sección */
	--kmc-h3-size: 1.5rem;                                     /* 24px */
	--kmc-h4-size: 1.125rem;                                   /* 18px */

	/* Spacing / radius */
	--kmc-radius-pill: 50px;
	--kmc-radius-card: 16px;
	--kmc-space-section: clamp(2.5rem, 2rem + 2vw, 5rem);
	--kmc-content-width: 1200px;

	/* Motion */
	--kmc-transition: 150ms ease;
}

@media (prefers-reduced-motion: reduce) {
	:root {
		--kmc-transition: 0ms;
	}
}