/* Variables globales v1 (derivadas de Anima/Tailwind) :root { --black: rgba(32, 32, 32, 1); --blue: rgba(79, 86, 211, 1); --colorblack: rgba(51, 51, 51, 1); --colorwhite: rgba(245, 245, 245, 1); --dark-blue: rgba(81, 81, 97, 1); --dark-blue-2: rgba(53, 53, 66, 1); --dark-green: rgba(137, 210, 51, 1); --gray-1: rgba(245, 245, 245, 1); --gray-2: rgba(236, 236, 235, 1); --gray-3: rgba(178, 179, 185, 1); --gray-4: rgba(135, 135, 135, 1); --green: rgba(205, 255, 101, 1); --grey-02: rgba(194, 194, 194, 1); --purple: rgba(209, 212, 255, 1); --soft-green: rgba(235, 243, 234, 1); --soft-orange: rgba(242, 114, 119, 1); --tertiary-text: rgba(215, 215, 215, 1); --white: rgba(255, 255, 255, 1); --heading-2-font-family: "Cairo", Helvetica, Arial, sans-serif; --heading-2-font-size: 28px; --heading-2-font-weight: 700; --heading-3-font-family: "Cairo", Helvetica, Arial, sans-serif; --heading-3-font-size: 24px; --heading-3-font-weight: 700; --heading-4-font-family: "Cairo", Helvetica, Arial, sans-serif; --heading-4-font-size: 20px; --heading-4-font-weight: 700; --heading-5-font-family: "Open Sans", Helvetica, Arial, sans-serif; --heading-5-font-size: 16px; --heading-5-font-weight: 700; --heading-6-font-family: "Cairo", Helvetica, Arial, sans-serif; --heading-6-font-size: 16px; --heading-6-font-weight: 700; --label-font-family: "Cairo", Helvetica, Arial, sans-serif; --label-font-size: 14px; --label-font-weight: 400; --label-2-font-family: "Poppins", Helvetica, Arial, sans-serif; --label-2-font-size: 14px; --label-2-font-weight: 600; --paragraph-font-family: "Open Sans", Helvetica, Arial, sans-serif; --paragraph-font-size: 16px; --paragraph-font-weight: 400; --shadow-03: 0px 1px 28px 0px rgba(0, 0, 0, 0.12); --shadow-1: 17.47826px 3.88406px 33.98551px 0px rgba(0, 0, 0, 0.02); --shadow-2: 0px 4px 4px 0px rgba(0, 0, 0, 0.04); } /* Animaciones base usadas por Anima */ :root { --animate-spin: spin 1s linear infinite; } @keyframes spin { to { transform: rotate(1turn); } } @keyframes fade-in { 0% { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: none; } } @keyframes fade-up { 0% { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: none; } } @keyframes shimmer { 0%, 90%, to { background-position: calc(-100% - var(--shimmer-width)) 0; } 30%, 60% { background-position: calc(100% + var(--shimmer-width)) 0; } } @keyframes marquee { 0% { transform: translate(0); } to { transform: translateX(calc(-100% - var(--gap))); } } @keyframes marquee-vertical { 0% { transform: translateY(0); } to { transform: translateY(calc(-100% - var(--gap))); } } /* Tema oscuro: sobreescribe tokens cuando [data-theme="dark"] está en o */ [data-theme="dark"] { --black: rgba(230, 230, 230, 1); --colorblack: rgba(229, 229, 229, 1); --colorwhite: rgba(23, 23, 23, 1); --white: rgba(30, 30, 30, 1); --gray-1: rgba(18, 18, 18, 1); --gray-2: rgba(38, 38, 38, 1); --gray-3: rgba(82, 82, 82, 1); --gray-4: rgba(163, 163, 163, 1); --blue: rgba(99, 102, 241, 1); --purple: rgba(148, 163, 184, 0.25); --soft-green: rgba(34, 197, 94, 0.15); --soft-orange: rgba(244, 63, 94, 0.25); --shadow-2: 0px 4px 12px 0px rgba(0, 0, 0, 0.35); --shadow-1: 0px 2px 10px rgba(0, 0, 0, 0.25); }