/* vitaralink.com — tokens del sistema de diseño Vitaralink
   Generado desde tokens.json del sistema (https://claude.ai/artifact/LPCWKYXwSPdDE9ihyJ9Dvu).
   No editar a mano: regenerar con generar_tokens.py. Tema oscuro por defecto; claro con data-theme="light"
   en <html> o en una sección. */

@font-face {
  font-family: 'Inter Display';
  src: url('../assets/fonts/InterDisplay-SemiBold.woff2') format('woff2'), url('../assets/fonts/InterDisplay-SemiBold.woff') format('woff');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Inter Display';
  src: url('../assets/fonts/InterDisplay-Medium.woff2') format('woff2'), url('../assets/fonts/InterDisplay-Medium.woff') format('woff');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Inter Display';
  src: url('../assets/fonts/InterDisplay-Regular.woff2') format('woff2'), url('../assets/fonts/InterDisplay-Regular.woff') format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Inter';
  src: url('../assets/fonts/Inter-SemiBold.woff2') format('woff2'), url('../assets/fonts/Inter-SemiBold.woff') format('woff');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Inter';
  src: url('../assets/fonts/Inter-Medium.woff2') format('woff2'), url('../assets/fonts/Inter-Medium.woff') format('woff');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Inter';
  src: url('../assets/fonts/Inter-Regular.woff2') format('woff2'), url('../assets/fonts/Inter-Regular.woff') format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'JetBrains Mono';
  src: url('../assets/fonts/JetBrainsMono-Regular.woff2') format('woff2'), url('../assets/fonts/JetBrainsMono-Regular.woff') format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'JetBrains Mono';
  src: url('../assets/fonts/JetBrainsMono-ExtraBold.woff2') format('woff2'), url('../assets/fonts/JetBrainsMono-ExtraBold.woff') format('woff');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'PP Mondwest';
  src: url('../assets/fonts/ppmondwest-regular.woff2') format('woff2'), url('../assets/fonts/ppmondwest-regular.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'PP NeueBit';
  src: url('../assets/fonts/ppneuebit-bold.woff2') format('woff2'), url('../assets/fonts/ppneuebit-bold.otf') format('opentype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root {
  --navy-950: #041018;
  --navy-800: #052F3E;
  --navy-700: #064E63;
  --cyan-600: #03839E;
  --cyan-500: #00B8D9;
  --cyan-200: #8DEBFA;
  --cyan-50: #EFFDFF;
  --black: #000000;
  --white: #FFFFFF;
  --mono-0: #000000;
  --mono-1: #1C1C1C;
  --mono-2: #3A3A3A;
  --mono-3: #636363;
  --mono-4: #8F8F8F;
  --mono-5: #C2C2C2;
  --mono-6: #F0F0F0;
  --font-display: "Inter Display", Inter, -apple-system, system-ui, "Segoe UI", Arial, sans-serif;
  --font-sans: Inter, -apple-system, system-ui, "Segoe UI", Arial, sans-serif;
  --font-pixel-serif: "PP Mondwest", Georgia, serif;
  --font-mono: "JetBrains Mono", "SF Mono", Consolas, "Liberation Mono", Menlo, monospace;
  --font-pixel: "PP NeueBit", "Courier New", monospace;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --space-10: 120px;
  --space-11: 240px;
  --radius-none: 0px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --stroke-1: 1px;
  --stroke-2: 2px;
  --container-max: 1512px;
  --content-max: 1192px;
  --gutter: 124px;
  --gutter-tablet: 64px;
  --gutter-mobile: 16px;
  --nav-height: 88px;
  --nav-float-height: 64px;
  --nav-float-offset: 16px;
  --hero-pad: 152px;
  --text-max: 680px;
  --lede-max: 508px;
  --email-width: 600px;
  --visual-min: 320px;
  --cell-min: 2.5px;
  --ascii-cell: 15px;
  --grid-cell: 48px;
  --grid-fade: 120px;
  --grid-cell-card: 24px;
  --pixel-block: 16px;
  --marquee-fade: 140px;
  --icon-sm: 16px;
  --icon-md: 20px;
  --icon-lg: 24px;
  --icon-xl: 32px;
  --px-icon-sm: 10px;
  --px-icon-md: 15px;
  --px-icon-lg: 20px;
  --input-height: 48px;
  --checkbox-size: 20px;
  --opacity-hover: 0.85;
  --opacity-tab-inactive: 0.24;
  --opacity-disabled: 0.4;
  --duration-fast: 150ms;
  --duration-base: 200ms;
  --duration-tooltip: 260ms;
  --duration-slow: 300ms;
  --duration-shift: 500ms;
  --duration-selector: 2400ms;
  --duration-boost: 1400ms;
  --duration-marquee: 170s;
  --ease-standard: cubic-bezier(0, 0, 0.58, 1);
  --ease-icon: cubic-bezier(0.2, 0.6, 0.6, 1);
  --ease-pixel: steps(6, end);
}

:root,
[data-theme="dark"] {
  --bg: var(--black);
  --surface: #0A161D;
  --surface-raised: #101E26;
  --surface-strong: #182830;
  --surface-nav: #0A161D;
  --border: rgba(239, 253, 255, 0.08);
  --border-strong: rgba(239, 253, 255, 0.24);
  --border-control: #677479;
  --text: var(--cyan-50);
  --text-muted: rgba(239, 253, 255, 0.64);
  --text-mono: #A7B1B4;
  --text-subtle: #7A868A;
  --link: var(--text);
  --action: var(--cyan-50);
  --on-action: var(--navy-950);
  --action-hover: #C9D6D9;
  --action-icon: var(--cyan-500);
  --button-outline: rgba(239, 253, 255, 0.48);
  --ghost-hover: rgba(239, 253, 255, 0.08);
  --ghost-active: rgba(239, 253, 255, 0.16);
  --card-accent: var(--navy-700);
  --on-card-accent: var(--cyan-50);
  --scrim: rgba(0, 0, 0, 0.64);
  --highlight: var(--cyan-500);
  --on-highlight: var(--navy-950);
  --highlight-soft: var(--navy-800);
  --on-highlight-soft: var(--cyan-200);
  --focus: var(--cyan-500);
  --success: #3DD68C;
  --success-soft: #091E14;
  --warning: #F5B841;
  --warning-soft: #221A09;
  --danger: #FF7A66;
  --danger-soft: #24110E;
  --ascii-ink: var(--white);
  --grid-line: rgba(239, 253, 255, 0.10);
  --shadow-md: none;
  --shadow-visual: none;
}

[data-theme="light"] {
  --bg: var(--white);
  --surface: #F5F7F8;
  --surface-raised: #EEF1F2;
  --surface-strong: #E4E8EA;
  --surface-nav: #FFFFFF;
  --border: rgba(4, 16, 24, 0.08);
  --border-strong: rgba(4, 16, 24, 0.24);
  --border-control: #82888C;
  --text: var(--navy-950);
  --text-muted: rgba(4, 16, 24, 0.64);
  --text-mono: #687074;
  --text-subtle: #6F787D;
  --link: var(--text);
  --action: var(--navy-950);
  --on-action: var(--white);
  --action-hover: var(--navy-800);
  --action-icon: var(--cyan-500);
  --button-outline: rgba(4, 16, 24, 0.48);
  --ghost-hover: rgba(4, 16, 24, 0.06);
  --ghost-active: rgba(4, 16, 24, 0.12);
  --card-accent: var(--navy-700);
  --on-card-accent: var(--cyan-50);
  --scrim: rgba(0, 0, 0, 0.64);
  --highlight: var(--cyan-500);
  --on-highlight: var(--navy-950);
  --highlight-soft: var(--cyan-50);
  --on-highlight-soft: var(--navy-700);
  --focus: var(--cyan-600);
  --success: #0B7A50;
  --success-soft: #E7F2EE;
  --warning: #9A5B00;
  --warning-soft: #F5EFE6;
  --danger: #B42318;
  --danger-soft: #F8E9E8;
  --ascii-ink: var(--navy-950);
  --grid-line: rgba(4, 16, 24, 0.08);
  --shadow-md: 0 12px 32px -12px rgba(4, 16, 24, 0.22);
  --shadow-visual: 0 24px 48px -24px rgba(4, 16, 24, 0.42);
}

/* color-scheme solo en bloques (no en <html>): en la raíz, el iframe de Cal.com pinta su fondo oscuro. */
[data-theme="dark"]:not(:root) {
  color-scheme: dark;
}

[data-theme="light"]:not(:root) {
  color-scheme: light;
}