design: sistema visual de marca (Midnight/Orange, Canela, shell oscuro)

tailwind.config.ts

@@ -1,5 +1,10 @@
 import type { Config } from "tailwindcss";
 
+/**
+ * Tokens de marca 4Ventures (brandbook):
+ *  Midnight #07101E · Burnt Orange #FF5D00 · Mint #F0FCF0 · Mist #B1C3CD
+ * Un solo acento (naranja). La jerarquía se construye con tono, no con sombras.
+ */
 const config: Config = {
   darkMode: ["class"],
   content: [
@@ -10,21 +15,57 @@ const config: Config = {
   theme: {
     extend: {
       fontFamily: {
-        sans: ['var(--font-sans)', 'ui-sans-serif', 'system-ui', 'sans-serif'],
+        sans: ["var(--font-sans)", "ui-sans-serif", "system-ui", "sans-serif"],
+        display: ["var(--font-display)", "Georgia", "serif"],
       },
       colors: {
-        background: "#FFFFFF",
-        card: "#FFFFFF",
-        sidebar: "#FFFFFF",
-        border: "#E5E7EB",
+        background: "var(--background)",
+        card: "var(--card)",
+        sidebar: "var(--sidebar)",
+        border: "var(--border)",
+        ink: {
+          DEFAULT: "#07101E",
+          soft: "#2B3744",
+          muted: "#5B6B78",
+          faint: "#8A99A6",
+        },
+        mist: {
+          50: "#F6F8F7",
+          100: "#EEF2F1",
+          200: "#DCE4E8",
+          300: "#B1C3CD",
+          400: "#8FA4B1",
+        },
+        mint: {
+          DEFAULT: "#F0FCF0",
+          200: "#D9F3DA",
+        },
         brand: {
-          50: "#FFF8F0",
-          200: "#F5C796",
-          400: "#EDA05A",
-          500: "#E58A3C",
-          600: "#D07528",
-          700: "#B35E1B"
-        }
+          50: "#FFF1E8",
+          100: "#FFE0CC",
+          200: "#FFC4A0",
+          400: "#FF7A2E",
+          500: "#FF5D00",
+          600: "#E04F00",
+          700: "#B84100",
+        },
+      },
+      borderRadius: {
+        DEFAULT: "12px",
+        sm: "8px",
+        md: "10px",
+        lg: "12px",
+        xl: "12px",
+        "2xl": "16px",
+        "3xl": "20px",
+      },
+      boxShadow: {
+        sm: "0 1px 0 0 rgba(7, 16, 30, 0.04)",
+        DEFAULT: "0 1px 2px 0 rgba(7, 16, 30, 0.06)",
+        md: "0 2px 8px -2px rgba(7, 16, 30, 0.10)",
+        lg: "0 12px 32px -12px rgba(7, 16, 30, 0.18)",
+        xl: "0 24px 48px -16px rgba(7, 16, 30, 0.24)",
+        brand: "0 8px 24px -8px rgba(255, 93, 0, 0.45)",
       },
     },
   },