/* =========================================================================
 * Rodando Van — Design Tokens
 * Único lugar donde viven colores, tipos, spacing, radios, sombras.
 * Cualquier cambio de marca: aquí y se propaga al resto.
 * ========================================================================= */

:root {
	/* --- Color: Marca --- */
	--rv-primary:       #8EA67C;   /* sage green, color de marca */
	--rv-primary-dark:  #68795A;   /* hover / oscuro */
	--rv-primary-light: #A8BC97;   /* luminoso */
	--rv-primary-soft:  #EEF2E8;   /* fondos suaves */
	--rv-primary-tint:  #8ea67c1f; /* sage 12% (carruseles) */

	/* --- Color: Acentos --- */
	--rv-accent:        #D4946A;   /* terracota */
	--rv-accent-dark:   #B5764C;
	--rv-accent-soft:   #F8EDE3;
	--rv-deal:          #E85A3C;   /* coral, solo CTAs urgentes / descuentos */
	--rv-deal-dark:     #C84528;

	/* --- Color: Neutros --- */
	--rv-ink:           #1A2B3C;   /* títulos, alto contraste */
	--rv-text:          #2D3A47;   /* cuerpo */
	--rv-muted:         #6B7785;   /* metadatos */
	--rv-line:          #E5E8EC;   /* separadores */
	--rv-bg:            #FFFFFF;
	--rv-bg-soft:       #FAFBF9;   /* fondo de página alterno */

	/* --- Color: Semánticos (callouts) --- */
	--rv-info:          #2E7D9B;
	--rv-info-soft:     #E5F1F6;
	--rv-warn:          #C77F2A;
	--rv-warn-soft:     #FBF1DF;
	--rv-tip:           #5A8C3F;
	--rv-tip-soft:      #E8F2DE;

	/* --- Tipografía --- */
	--rv-font-serif:    'Fraunces', Georgia, 'Times New Roman', serif;
	--rv-font-sans:     'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
	--rv-font-mono:     ui-monospace, 'SF Mono', Menlo, Consolas, monospace;

	/* Escala tipográfica fluida (clamp min, prefer, max) */
	--rv-text-xs:       0.8125rem;             /* 13 */
	--rv-text-sm:       0.9375rem;             /* 15 */
	--rv-text-base:     1.0625rem;             /* 17 */
	--rv-text-lg:       1.1875rem;             /* 19 */
	--rv-text-xl:       1.375rem;              /* 22 */
	--rv-text-2xl:      clamp(1.5rem,   1.2rem + 1vw,    1.875rem);   /* 24-30 */
	--rv-text-3xl:      clamp(1.875rem, 1.4rem + 1.6vw, 2.375rem);    /* 30-38 */
	--rv-text-4xl:      clamp(2.25rem,  1.6rem + 2.4vw, 3rem);        /* 36-48 */
	--rv-text-5xl:      clamp(2.75rem,  1.8rem + 3.6vw, 4rem);        /* 44-64 */

	--rv-leading-tight:   1.15;
	--rv-leading-snug:    1.35;
	--rv-leading-normal:  1.6;
	--rv-leading-relaxed: 1.75;

	--rv-tracking-tight:  -0.02em;
	--rv-tracking-normal: 0;
	--rv-tracking-wide:   0.08em;

	/* --- Spacing (escala 4) --- */
	--rv-space-1:   0.25rem;   /* 4 */
	--rv-space-2:   0.5rem;    /* 8 */
	--rv-space-3:   0.75rem;   /* 12 */
	--rv-space-4:   1rem;      /* 16 */
	--rv-space-5:   1.5rem;    /* 24 */
	--rv-space-6:   2rem;      /* 32 */
	--rv-space-7:   3rem;      /* 48 */
	--rv-space-8:   4rem;      /* 64 */
	--rv-space-9:   6rem;      /* 96 */

	/* --- Radios --- */
	--rv-radius-sm:    8px;
	--rv-radius:       12px;
	--rv-radius-lg:    20px;
	--rv-radius-xl:    28px;
	--rv-radius-pill:  999px;

	/* --- Sombras --- */
	--rv-shadow-xs:  0 1px 2px rgba(15, 30, 26, 0.05);
	--rv-shadow:     0 4px 14px rgba(15, 30, 26, 0.08);
	--rv-shadow-md:  0 10px 24px rgba(15, 30, 26, 0.10);
	--rv-shadow-lg:  0 20px 40px rgba(15, 30, 26, 0.12);
	--rv-ring:       0 0 0 3px rgba(142, 166, 124, 0.35);

	/* --- Layout --- */
	--rv-container:        1240px;   /* ancho máximo grandes superficies */
	--rv-container-narrow:  760px;   /* ancho de lectura en posts */
	--rv-container-wide:   1440px;   /* hero alignfull-ish */
	--rv-gutter:           clamp(1rem, 4vw, 2rem);

	--rv-sidebar-width:    320px;
	--rv-sidebar-gap:      48px;

	--rv-header-h:         72px;

	/* --- Transiciones --- */
	--rv-ease:        cubic-bezier(0.4, 0, 0.2, 1);
	--rv-duration:    220ms;
	--rv-duration-md: 320ms;
	--rv-duration-lg: 480ms;

	/* --- Z-index --- */
	--rv-z-sticky:   100;
	--rv-z-header:   200;
	--rv-z-overlay:  900;
	--rv-z-modal:    1000;
	--rv-z-toast:    1100;
}

/* Respeto a usuarios con preferencia de movimiento reducido */
@media (prefers-reduced-motion: reduce) {
	:root {
		--rv-duration:    1ms;
		--rv-duration-md: 1ms;
		--rv-duration-lg: 1ms;
	}
}