:root{
  /* marketon-autos · generado por build-tokens.py desde marketon-autos.json; editar el JSON, no este archivo */
  --ma-tinta-950: #06141C;
  --ma-tinta-900: #0B1F2A;
  --ma-tinta-800: #12303F;
  --ma-tinta-700: #1D4354;
  --ma-tinta-600: #2E5A6C;
  --ma-azul-900: #12347F;
  --ma-azul-800: #173F9E;
  --ma-azul-700: #1B4BC0;
  --ma-azul-600: #1F57DB;
  --ma-azul-500: #4677E8;
  --ma-azul-400: #7FA0F0;
  --ma-azul-200: #C9D7FA;
  --ma-azul-100: #E3EBFD;
  --ma-azul-50: #F1F5FE;
  --ma-niebla-0: #FFFFFF;
  --ma-niebla-50: #F0F5F4;
  --ma-niebla-100: #E6EEEC;
  --ma-niebla-200: #DCE5E3;
  --ma-niebla-300: #C4D0CD;
  --ma-niebla-400: #9AABA7;
  --ma-niebla-500: #7A8C88;
  --ma-tx-fg: #0B1F2A;
  --ma-tx-body: #2A3A40;
  --ma-tx-muted: #56676C;
  --ma-tx-ondark: #FFFFFF;
  --ma-tx-ondark-body: #C6D6DA;
  --ma-tx-ondark-muted: #9CB4BA;
  --ma-wa-solid: #25D366;
  --ma-wa-ink: #0B141A;
  --ma-wa-dark: #075E54;
  --ma-ok-text: #0B6B57;
  --ma-ok-bg: #DDF3EC;
  --ma-ok-border: #A7DCCB;
  --ma-ok-solid: #10997A;
  --ma-ok-ondark: #5ED3B1;
  --ma-warn-text: #8A4B00;
  --ma-warn-bg: #FDF0D9;
  --ma-warn-border: #EFC888;
  --ma-warn-solid: #C47A0A;
  --ma-warn-ondark: #F5C46B;
  --ma-sold-text: #4B5162;
  --ma-sold-bg: #ECEEF2;
  --ma-sold-border: #D0D4DD;
  --ma-sold-solid: #6B7186;
  --ma-sold-ondark: #B3B9C7;
  --ma-err-text: #B42318;
  --ma-err-bg: #FDECEA;
  --ma-err-border: #F4B4AD;
  --ma-err-solid: #D92D20;
  --ma-err-ondark: #FF8C82;
  --ma-font-ui: "Host Grotesk", -apple-system, "Segoe UI", Roboto, sans-serif;
  --ma-font-display: "Host Grotesk", -apple-system, "Segoe UI", Roboto, sans-serif;
  --ma-font-mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;
  --ma-font-logo: "Archivo", "Host Grotesk", sans-serif;
  --ma-font-brand: "Archivo", "Host Grotesk", sans-serif;
  --ma-text-display: clamp(40px, 5.6vw, 72px); --ma-lh-display: 1.0; --ma-ls-display: -0.035em;
  --ma-text-h1: clamp(32px, 3.6vw, 48px); --ma-lh-h1: 1.05; --ma-ls-h1: -0.03em;
  --ma-text-h2: clamp(26px, 2.6vw, 36px); --ma-lh-h2: 1.1; --ma-ls-h2: -0.025em;
  --ma-text-h3: clamp(20px, 1.6vw, 24px); --ma-lh-h3: 1.2; --ma-ls-h3: -0.015em;
  --ma-text-title: clamp(17px, 1.2vw, 18px); --ma-lh-title: 1.3; --ma-ls-title: -0.01em;
  --ma-text-price-xl: clamp(34px, 3vw, 44px); --ma-lh-price-xl: 1.0; --ma-ls-price-xl: -0.03em;
  --ma-text-price: clamp(20px, 1.6vw, 22px); --ma-lh-price: 1.1; --ma-ls-price: -0.02em;
  --ma-text-lead: clamp(17px, 1.3vw, 19px); --ma-lh-lead: 1.55; --ma-ls-lead: 0;
  --ma-text-body: clamp(16px, 1.1vw, 16px); --ma-lh-body: 1.55; --ma-ls-body: 0;
  --ma-text-sm: clamp(14px, 1vw, 14px); --ma-lh-sm: 1.45; --ma-ls-sm: 0;
  --ma-text-caption: clamp(13px, 0.9vw, 13px); --ma-lh-caption: 1.4; --ma-ls-caption: 0;
  --ma-text-label: clamp(12px, 0.9vw, 12px); --ma-lh-label: 1.3; --ma-ls-label: 0.06em;
  --ma-space-1: 4px;
  --ma-space-2: 8px;
  --ma-space-3: 12px;
  --ma-space-4: 16px;
  --ma-space-5: 20px;
  --ma-space-6: 24px;
  --ma-space-7: 32px;
  --ma-space-8: 40px;
  --ma-space-9: 48px;
  --ma-space-10: 64px;
  --ma-space-11: 80px;
  --ma-space-12: 96px;
  --ma-space-13: 128px;
  --ma-radius-sm: 8px;
  --ma-radius-field: 10px;
  --ma-radius-md: 12px;
  --ma-radius-lg: 16px;
  --ma-radius-xl: 20px;
  --ma-radius-pill: 999px;
  --ma-shadow-1: 0 1px 2px rgba(11,31,42,.06), 0 12px 32px -16px rgba(11,31,42,.20);
  --ma-shadow-2: 0 2px 6px rgba(11,31,42,.08), 0 24px 56px -20px rgba(11,31,42,.32);
  --ma-shadow-focus: 0 0 0 2px #FFFFFF, 0 0 0 4px #1F57DB;
  --ma-motion-fast: 120ms;
  --ma-motion-base: 200ms;
  --ma-motion-slow: 320ms;
  --ma-motion-ease-out: cubic-bezier(.16,1,.3,1);
  --ma-motion-ease-in-out: cubic-bezier(.65,0,.35,1);
  --ma-g-scrim: linear-gradient(180deg, rgba(6,20,28,0) 55%, rgba(6,20,28,.55) 100%);
  --ma-g-skeleton: linear-gradient(90deg, #E6EEEC 0%, #F0F5F4 50%, #E6EEEC 100%);
  --ma-container: 1280px;
  --ma-gutter: 24px;
  --ma-gutter-sm: 16px;
  --ma-columns: 12;
  --ma-side: 400px;
  --ma-touch: 44px;
  /* semánticos, superficie clara */
  --ma-bg: #F0F5F4; --ma-page: #F0F5F4; --ma-surface: #FFFFFF; --ma-band: #E6EEEC; --ma-line: #DCE5E3; --ma-line-strong: #C4D0CD; --ma-fg: #0B1F2A; --ma-body: #2A3A40; --ma-muted: #56676C; --ma-action: #1F57DB; --ma-action-hover: #1B4BC0; --ma-action-ink: #FFFFFF; --ma-action-soft: #F1F5FE; --ma-link: #1B4BC0; --ma-focus: #1F57DB; --ma-invert: #0B1F2A; --ma-invert-ink: #FFFFFF; --ma-trust: #0B6B57; --ma-line-control: #7A8C88;
}
.ma-dark{ --ma-bg: #06141C; --ma-page: #06141C; --ma-surface: #0B1F2A; --ma-band: #12303F; --ma-line: #1D4354; --ma-line-strong: #2E5A6C; --ma-fg: #FFFFFF; --ma-body: #C6D6DA; --ma-muted: #9CB4BA; --ma-action: #1F57DB; --ma-action-hover: #1B4BC0; --ma-action-ink: #FFFFFF; --ma-action-soft: #12303F; --ma-link: #7FA0F0; --ma-focus: #7FA0F0; --ma-invert: #FFFFFF; --ma-invert-ink: #0B1F2A; --ma-trust: #5ED3B1; --ma-line-control: #9CB4BA; color: var(--ma-fg); background: var(--ma-bg); }
@media (prefers-reduced-motion: reduce){ :root{ --ma-motion-fast: 0ms; --ma-motion-base: 0ms; --ma-motion-slow: 0ms; } }