/* ============================================================
   tokens.css — Design tokens (única fuente de verdad)
   Sistema moderno: paleta andina (teal/turquesa) + neutros,
   tipografía actual, radios y sombras. Cambia algo aquí y se
   actualiza todo el sitio.
   ============================================================ */

:root {
	/* ---- Marca / acentos (paleta: verde oscuro · blanco · negro) ---- */
	--c-primary:        #14532d;   /* verde oscuro — botones, acentos */
	--c-primary-600:    #0f3d22;   /* hover de primary */
	--c-primary-700:    #0a2c18;
	--c-accent:         #2e7d32;   /* verde medio — realces */
	--c-blue:           #1b6e35;   /* enlaces */
	--c-rose:           #2e7d32;   /* hover del menú */

	/* ---- Tintes suaves de secciones (bandas / tarjetas) ---- */
	--c-aqua:           #eef5ef;   /* verde muy suave */
	--c-turquoise:      #e6f1e8;   /* verde suave */
	--c-peach:          #f3f6f3;   /* neutro claro (comentarios) */
	--c-yellow:         #edf4ee;   /* verde claro (tarjetas tour) */
	--c-green:          #e1eee4;   /* verde claro (tarjetas tour) */

	/* ---- Texto ---- */
	--c-ink:            #141414;   /* texto principal (negro) */
	--c-muted:          #5a635c;   /* texto secundario */
	--c-on-primary:     #ffffff;

	/* ---- Superficies ---- */
	--c-bg:             #ffffff;   /* fondo de página — blanco */
	--c-surface:        #ffffff;   /* tarjetas / cajas */
	--c-surface-2:      #f2f5f3;   /* superficie sutil */
	--c-nav-bg:         #0c2f17;   /* barra de menú — verde oscuro */
	--c-footer-bg:      #0c2f17;   /* pie — verde oscuro */
	--c-border:         #e2e8e4;   /* bordes suaves */
	--c-border-strong:  #cdd8d0;

	/* ---- Tipografía ---- */
	--font-base:    "Inter", "Segoe UI", system-ui, -apple-system, Arial, sans-serif;
	--font-display: "Poppins", "Segoe UI", system-ui, sans-serif;
	--font-nav:     "Sora", "Poppins", "Segoe UI", system-ui, sans-serif;
	--font-script:  "Dancing Script", "Monotype Corsiva", "Brush Script MT", cursive;
	--fs-base:     17px;
	--fs-sm:       14.5px;
	--fs-lg:       20px;
	--fs-xl:       clamp(1.6rem, 1.1rem + 1.8vw, 2.3rem);
	--lh-base:     1.65;

	/* ---- Espaciado (escala de 4) ---- */
	--sp-1: 4px;
	--sp-2: 8px;
	--sp-3: 12px;
	--sp-4: 16px;
	--sp-5: 20px;
	--sp-6: 30px;
	--sp-8: 50px;

	/* ---- Radios ---- */
	--radius-sm:   0;
	--radius:      0;
	--radius-lg:   0;
	--radius-pill: 999px;

	/* ---- Sombras ---- */
	--shadow-sm: 0 1px 2px rgba(16,36,43,.06), 0 1px 3px rgba(16,36,43,.08);
	--shadow:    0 4px 14px rgba(16,36,43,.08), 0 2px 6px rgba(16,36,43,.06);
	--shadow-lg: 0 18px 40px rgba(16,36,43,.14), 0 8px 18px rgba(16,36,43,.08);

	/* ---- Transiciones ---- */
	--t-fast: .18s ease;
	--t:      .28s cubic-bezier(.22,.61,.36,1);

	/* ---- Anchos de contenedor ---- */
	--w-narrow:  460px;
	--w-content: 860px;
	--w-wide:    1040px;
	--w-grid:    1180px;

	/* ---- Cabecera ---- */
	--header-h: 150px;
}
