// direction-config.jsx — Three brand directions for Eixo Pharma. // Each direction is a self-contained set of color + type tokens; cards // receive a direction object and render against its tokens. Tweaks can // override `accent`, `dark`, `density`, `layout` at runtime. const DIRECTIONS = [ { id: "clinico", name: "EIXO PHARMA", codename: "01 / CLÍNICO", descriptor: "Laboratório editorial", tagline: "A ciência do hormônio, sem rodeios.", statement: "Um espaço sério para quem leva o próprio corpo a sério. Educação de farmacologia esportiva com base em evidência — direta, sem moralismo, sem promessa milagrosa.", // colors bg: "#EFECE4", surface: "#FBFAF6", surfaceAlt: "#E5E1D6", ink: "#0E0F12", inkSoft: "#4A4D54", inkMuted: "#8C8F95", hairline: "rgba(14,15,18,0.10)", accent: "#1F4FD9", accentSoft: "#DDE6FB", accentOn: "#FBFAF6", // type — SF Pro / SF Mono via system stack, with Inter as fallback display: '-apple-system, BlinkMacSystemFont, "SF Pro Display", "Inter Tight", "Inter", system-ui, sans-serif', body: '-apple-system, BlinkMacSystemFont, "SF Pro Text", "Inter", system-ui, sans-serif', mono: 'ui-monospace, "SF Mono", SFMono-Regular, Menlo, Monaco, monospace', dark: false, // Apple-ish surface tokens radius: 14, radiusLg: 22, radiusXl: 28, glassBg: "rgba(255,255,255,0.55)", glassBorder: "rgba(255,255,255,0.65)", shadowSoft: "0 1px 1px rgba(15,15,20,0.04), 0 12px 36px -14px rgba(15,15,20,0.16)", shadowGlass: "inset 0 1px 0 rgba(255,255,255,0.8), 0 14px 40px -12px rgba(15,15,20,0.22)", highlight: "radial-gradient(120% 80% at 50% -10%, rgba(255,255,255,0.9), rgba(255,255,255,0) 60%)", bgGradient: "radial-gradient(120% 80% at 80% -10%, rgba(31,79,217,0.10), transparent 55%), radial-gradient(110% 90% at 0% 110%, rgba(31,79,217,0.06), transparent 55%)", // notes mood: "Linhas finas, muito espaço, grid visível em micro-elementos. Como um paper bem diagramado.", accentOptions: ["#1F4FD9", "#0F7A55", "#C24A1C", "#3D3D3D"], }, { id: "atleta", name: "EIXO PHARMA", codename: "02 / ATLETA", descriptor: "Performance editorial", tagline: "Pra quem treina pesado e estuda mais ainda.", statement: "Para o atleta que não aceita resposta vaga. Conteúdo objetivo, escrito por gente que treina, com a tinta do consultório e o peso da barra.", bg: "#E8DFCB", surface: "#F2EBD8", surfaceAlt: "#D9CDB1", ink: "#1B1410", inkSoft: "#5A4938", inkMuted: "#8E7A60", hairline: "rgba(27,20,16,0.14)", accent: "#A82E1C", accentSoft: "#E7C4B8", accentOn: "#F2EBD8", display: '-apple-system, BlinkMacSystemFont, "SF Pro Display", "Archivo", system-ui, sans-serif', body: '-apple-system, BlinkMacSystemFont, "SF Pro Text", "Inter", system-ui, sans-serif', mono: 'ui-monospace, "SF Mono", SFMono-Regular, Menlo, Monaco, monospace', dark: false, radius: 14, radiusLg: 22, radiusXl: 28, glassBg: "rgba(255,255,255,0.55)", glassBorder: "rgba(255,255,255,0.65)", shadowSoft: "0 1px 1px rgba(27,20,16,0.06), 0 14px 36px -14px rgba(27,20,16,0.22)", shadowGlass: "inset 0 1px 0 rgba(255,255,255,0.7), 0 14px 40px -12px rgba(27,20,16,0.24)", highlight: "radial-gradient(120% 80% at 50% -10%, rgba(255,255,255,0.85), rgba(255,255,255,0) 60%)", bgGradient: "radial-gradient(120% 80% at 80% -10%, rgba(168,46,28,0.10), transparent 55%)", mood: "Tipografia gorda, manchetes de revista de musculação, papel jornal, tinta vermelha de carimbo.", accentOptions: ["#A82E1C", "#1B3D2F", "#B2741C", "#1B1410"], }, { id: "noturno", name: "EIXO PHARMA", codename: "03 / NOTURNO", descriptor: "Subterrâneo & técnico", tagline: "O que ninguém te explica no balcão.", statement: "Underground em vibe, premium em execução. Para a parte da comunidade que quer conversa de verdade — protocolos, bloodwork, ciclos, PCT — em ambiente reservado.", bg: "#0C0D11", surface: "#16181F", surfaceAlt: "#1F222B", ink: "#F2EFE6", inkSoft: "#B4B7BF", inkMuted: "#7A7F8A", hairline: "rgba(242,239,230,0.12)", accent: "#D7FF3A", accentSoft: "#2A3009", accentOn: "#0C0D11", display: '-apple-system, BlinkMacSystemFont, "SF Pro Display", "Space Grotesk", system-ui, sans-serif', body: '-apple-system, BlinkMacSystemFont, "SF Pro Text", "Inter", system-ui, sans-serif', mono: 'ui-monospace, "SF Mono", SFMono-Regular, Menlo, Monaco, monospace', dark: true, radius: 14, radiusLg: 22, radiusXl: 28, glassBg: "rgba(28,30,38,0.55)", glassBorder: "rgba(255,255,255,0.10)", shadowSoft: "0 1px 1px rgba(0,0,0,0.40), 0 14px 36px -14px rgba(0,0,0,0.65)", shadowGlass: "inset 0 1px 0 rgba(255,255,255,0.08), 0 16px 50px -14px rgba(0,0,0,0.75)", highlight: "radial-gradient(140% 90% at 50% -10%, rgba(215,255,58,0.12), rgba(255,255,255,0) 50%)", bgGradient: "radial-gradient(120% 70% at 80% -10%, rgba(215,255,58,0.10), transparent 55%), radial-gradient(110% 90% at -10% 110%, rgba(122,229,255,0.06), transparent 55%)", mood: "Tela escura, acento ácido, dados como ornamento, sensação de terminal médico fora de hora.", accentOptions: ["#D7FF3A", "#FF7A1A", "#7AE5FF", "#FF4D6D"], }, ]; // Apply runtime tweaks to a direction (accent override + dark inversion + // density). Returns a NEW token object — never mutate base directions. function applyTweaks(dir, tw) { const out = { ...dir }; if (tw.accent && tw.accent !== "default") out.accent = tw.accent; if (tw.forceMode === "light" && dir.dark) { out.bg = "#EFECE4"; out.surface = "#FBFAF6"; out.surfaceAlt = "#E5E1D6"; out.ink = "#0E0F12"; out.inkSoft = "#4A4D54"; out.inkMuted = "#8C8F95"; out.hairline = "rgba(14,15,18,0.14)"; out.dark = false; out.accentOn = out.surface; } else if (tw.forceMode === "dark" && !dir.dark) { out.bg = "#0C0D11"; out.surface = "#16181F"; out.surfaceAlt = "#1F222B"; out.ink = "#F2EFE6"; out.inkSoft = "#B4B7BF"; out.inkMuted = "#7A7F8A"; out.hairline = "rgba(242,239,230,0.16)"; out.dark = true; out.accentOn = "#0C0D11"; } out.density = tw.density || "regular"; out.layout = tw.layout || "editorial"; out.logoVariant = tw.logoVariant || "hpta"; return out; } // Spacing scale that responds to density tweak. function pad(dir, base = 28) { const m = dir.density === "compact" ? 0.78 : dir.density === "loose" ? 1.2 : 1; return Math.round(base * m); } Object.assign(window, { DIRECTIONS, applyTweaks, pad });