@charset "utf-8";
/* ==========================================================================
   Sistema de diseño — olgamiranda.com
   Paleta derivada de la plantilla original (oliva, lima, crema y coral);
   el logo "Olga!" es blanco y se apoya sobre el oliva.
   Contrastes verificados (WCAG 2.1 AA) en la nota de cada color de texto.
   ========================================================================== */

/* ---------- Fuentes autoalojadas (SIL Open Font License 1.1) ---------- */
@font-face {
	font-family: 'Nunito';
	font-style: normal;
	font-weight: 600 800;
	font-display: swap;
	src: url('../fonts/nunito/nunito-latin.woff2') format('woff2');
}
@font-face {
	font-family: 'Nunito Sans';
	font-style: normal;
	font-weight: 400 700;
	font-display: swap;
	src: url('../fonts/nunito-sans/nunito-sans-latin.woff2') format('woff2');
}

:root {
	/* ---- Paleta ---- */
	--olive-900: #2c2b0a;   /* barra superior, pie (blanco 14.4:1) */
	--olive-800: #45440d;   /* hover oscuro (blanco 10.1:1) */
	--olive-700: #5c5b12;   /* cabecera, botón principal, enlaces (blanco 7.1:1) */
	--olive-500: #7d7c1a;   /* oliva original de la plantilla */
	--olive-300: #c3c289;   /* oliva claro original (fondo antiguo) */
	--lime-400: #d0ce2b;    /* acento (texto oscuro 8.6:1) */
	--lime-200: #e4e37d;    /* fondos activos (texto oscuro 10.7:1) */
	--lime-100: #f1f1c6;
	--cream-100: #fbfbf2;   /* fondo general */
	--surface: #ffffff;
	--coral-500: #e0525c;   /* coral original: solo decorativo (3.8:1) */
	--coral-600: #b8323d;   /* títulos de módulo (5.9:1 sobre blanco) */
	--whatsapp: #1f7a4d;    /* blanco 5.3:1 */

	--text: #2b2a1f;        /* 14.4:1 sobre blanco */
	--text-muted: #575649;  /* 7.4:1 sobre blanco */
	--text-on-dark: #ffffff;
	--text-on-dark-muted: #e2e1c4;   /* 11.6:1 sobre olive-900 */
	--border: #e3e2cf;
	--focus: #d0ce2b;

	/* ---- Tipografía ---- */
	--font-heading: 'Nunito', 'Segoe UI', system-ui, -apple-system, Roboto, Arial, sans-serif;
	--font-body: 'Nunito Sans', 'Segoe UI', system-ui, -apple-system, Roboto, Arial, sans-serif;
	--fs-xs: 0.8125rem;   /* 13px */
	--fs-sm: 0.9375rem;   /* 15px */
	--fs-base: 1rem;      /* 16px */
	--fs-md: 1.125rem;    /* 18px */
	--fs-lg: 1.375rem;    /* 22px */
	--fs-xl: clamp(1.5rem, 1.2rem + 1.2vw, 2rem);
	--fs-2xl: clamp(1.75rem, 1.3rem + 1.8vw, 2.5rem);
	--lh-tight: 1.25;
	--lh-base: 1.6;

	/* ---- Espaciado (múltiplos de 4px) ---- */
	--space-1: 0.25rem;
	--space-2: 0.5rem;
	--space-3: 0.75rem;
	--space-4: 1rem;
	--space-5: 1.5rem;
	--space-6: 2rem;
	--space-7: 3rem;
	--space-8: 4rem;

	/* ---- Formas, sombras y movimiento ---- */
	--radius-sm: 6px;
	--radius-md: 12px;
	--radius-lg: 20px;
	--radius-pill: 999px;
	--shadow-sm: 0 1px 2px rgba(44, 43, 10, .06), 0 1px 3px rgba(44, 43, 10, .08);
	--shadow-md: 0 4px 12px rgba(44, 43, 10, .08), 0 2px 4px rgba(44, 43, 10, .06);
	--shadow-lg: 0 12px 28px rgba(44, 43, 10, .14), 0 4px 10px rgba(44, 43, 10, .08);
	--transition: 200ms ease;

	/* ---- Maquetación ---- */
	--container: 1200px;
	--gutter: clamp(1rem, 0.5rem + 2vw, 1.5rem);
	--sidebar: 280px;
	--header-h: 72px;
}

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