/* GENERADO por tokens/build.mjs desde tokens.mjs — no editar. */

@theme {
  --font-sans: 'Poppins', 'Trebuchet MS', system-ui, -apple-system, sans-serif;

  /* Marca — pine · Verde Bosque */
  --color-pine-50: #EEF6F3;
  --color-pine-100: #D5E8E0;
  --color-pine-200: #AED3C4;
  --color-pine-300: #7BB8A1;
  --color-pine-400: #4A9C80;
  --color-pine-500: #36856A;
  --color-pine-600: #2A7058;
  --color-pine-700: #1F5E49;
  --color-pine-800: #184A3A;
  --color-pine-900: #103A2C;
  --color-pine-950: #0C2A20;

  /* Marca — leaf · Verde Follaje */
  --color-leaf-50: #F8FAF8;
  --color-leaf-100: #DBE6DB;
  --color-leaf-200: #BED4BE;
  --color-leaf-300: #A1C39F;
  --color-leaf-400: #82B280;
  --color-leaf-500: #66A263;
  --color-leaf-600: #528850;
  --color-leaf-700: #416C3F;
  --color-leaf-800: #2F502E;
  --color-leaf-900: #1E331D;
  --color-leaf-950: #0D170D;

  /* Acento — camel */
  --color-camel-50: #FDFCFA;
  --color-camel-100: #F3ECE0;
  --color-camel-200: #E8DCC7;
  --color-camel-300: #DAC9AB;
  --color-camel-400: #C7B28C;
  --color-camel-500: #B3996B;
  --color-camel-600: #9C814F;
  --color-camel-700: #7E683D;
  --color-camel-800: #61502D;
  --color-camel-900: #45391F;
  --color-camel-950: #2A2312;

  /* Suelo — cream · Blanco Verdoso */
  --color-cream-50: #F7F8F1;
  --color-cream-100: #EFF0E2;
  --color-cream-200: #E2E2D6;
  --color-cream-300: #D2D2C4;
  --color-cream-400: #C1C1B3;
  --color-cream-500: #AFAFA3;

  /* Texto — ink · Tinta */
  --color-ink-50: #F7F8F7;
  --color-ink-100: #E0E4E1;
  --color-ink-200: #C6CCC8;
  --color-ink-300: #A8B1AB;
  --color-ink-400: #8A958D;
  --color-ink-500: #6A776F;
  --color-ink-600: #4B5A52;
  --color-ink-700: #2C3A33;
  --color-ink-800: #1F2D26;
  --color-ink-900: #14201B;
  --color-ink-950: #0C1512;

  /* Estados */
  --color-success-100: #DCEFE1;
  --color-success-200: #BCDFC7;
  --color-success-300: #8FCCA5;
  --color-success-400: #5FB07E;
  --color-success-600: #2F7D4F;
  --color-success-700: #24603D;
  --color-warning-100: #FBEECD;
  --color-warning-200: #F5DDA3;
  --color-warning-300: #EFCB77;
  --color-warning-400: #DCAE49;
  --color-warning-600: #B07D1A;
  --color-warning-700: #8A6113;
  --color-danger-100: #FADEDB;
  --color-danger-200: #F2BDB7;
  --color-danger-300: #EDA79E;
  --color-danger-400: #DE8175;
  --color-danger-600: #B3453B;
  --color-danger-700: #8F342C;
  --color-info-100: #D5EAF0;
  --color-info-200: #A9D3DE;
  --color-info-300: #8FC9D8;
  --color-info-400: #5AAAC0;
  --color-info-600: #0D6B83;
  --color-info-700: #074151;

  /* Impresión */
  --color-white: #FFFFFF;
  --color-black: #000000;

  /* Espaciado */
  --spacing-0: 0;
  --spacing-1: 0.25rem;
  --spacing-2: 0.5rem;
  --spacing-3: 0.75rem;
  --spacing-4: 1rem;
  --spacing-5: 1.25rem;
  --spacing-6: 1.5rem;
  --spacing-8: 2rem;
  --spacing-10: 2.5rem;
  --spacing-12: 3rem;
  --spacing-16: 4rem;
  --spacing-20: 5rem;
  --spacing-24: 6rem;

  /* Radios — cajas 0.75rem, líneas píldora */
  --radius-box-sm: 0.375rem;
  --radius-box: 0.75rem;
  --radius-box-lg: 1.25rem;

  /* Elevación */
  --shadow-card: 0 1px 2px 0 rgb(20 32 27 / 0.05);
  --shadow-raised: 0 4px 6px -1px rgb(20 32 27 / 0.08), 0 2px 4px -2px rgb(20 32 27 / 0.05);

  /* Tracking del eyebrow */
  --tracking-eyebrow: 0.14em;
  --tracking-eyebrow-wide: 0.2em;

  /* Movimiento */
  --duration-fast: 120ms;
  --duration-base: 200ms;
  --duration-slow: 320ms;
  --ease-brand: cubic-bezier(0.2, 0, 0, 1);
  --ease-brand-out: cubic-bezier(0.4, 0, 1, 1);
}

/* ── Roles por tema ──────────────────────────────────────────────────────
   Tres estados: elección explícita clara, elección explícita oscura, y el
   predeterminado "sistema" que no estampa nada y solo distingue por
   prefers-color-scheme. Los tres se resuelven a nivel de token. */

:root {
  --ground: #FFFFFF;
  --ground-alt: #EFF0E2;
  --ground-invert: #184A3A;
  --surface: #FFFFFF;
  --surface-alt: #F7F8F1;
  --border: #E2E2D6;
  --border-strong: #D2D2C4;
  --text: #14201B;
  --text-muted: #4B5A52;
  --text-faint: #8A958D;
  --text-on-invert: #FFFFFF;
  --accent: #184A3A;
  --accent-hover: #1F5E49;
  --accent-text: #184A3A;
  --secondary: #82B280;
  --secondary-text: #416C3F;
  --warm: #B3996B;
  --warm-text: #7E683D;
  --focus: #2A7058;
  --shadow-elev-card: 0 1px 2px 0 rgb(20 32 27 / 0.05);
  --shadow-elev-raised: 0 4px 6px -1px rgb(20 32 27 / 0.08), 0 2px 4px -2px rgb(20 32 27 / 0.05);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
  --ground: #0E1A15;
  --ground-alt: #152318;
  --ground-invert: #184A3A;
  --surface: #152318;
  --surface-alt: #1B2C22;
  --border: #2A3D33;
  --border-strong: #3D5347;
  --text: #EFF0E2;
  --text-muted: #A8B1AB;
  --text-faint: #8A958D;
  --text-on-invert: #FFFFFF;
  --accent: #82B280;
  --accent-hover: #A1C39F;
  --accent-text: #82B280;
  --secondary: #4A9C80;
  --secondary-text: #7BB8A1;
  --warm: #B3996B;
  --warm-text: #C7B28C;
  --focus: #82B280;
    --shadow-elev-card: 0 1px 2px 0 rgb(0 0 0 / 0.35);
    --shadow-elev-raised: 0 4px 6px -1px rgb(0 0 0 / 0.45), 0 2px 4px -2px rgb(0 0 0 / 0.35);
  }
}

:root[data-theme="dark"] {
  --ground: #0E1A15;
  --ground-alt: #152318;
  --ground-invert: #184A3A;
  --surface: #152318;
  --surface-alt: #1B2C22;
  --border: #2A3D33;
  --border-strong: #3D5347;
  --text: #EFF0E2;
  --text-muted: #A8B1AB;
  --text-faint: #8A958D;
  --text-on-invert: #FFFFFF;
  --accent: #82B280;
  --accent-hover: #A1C39F;
  --accent-text: #82B280;
  --secondary: #4A9C80;
  --secondary-text: #7BB8A1;
  --warm: #B3996B;
  --warm-text: #C7B28C;
  --focus: #82B280;
  --shadow-elev-card: 0 1px 2px 0 rgb(0 0 0 / 0.35);
  --shadow-elev-raised: 0 4px 6px -1px rgb(0 0 0 / 0.45), 0 2px 4px -2px rgb(0 0 0 / 0.35);
}

/* ── Base ─────────────────────────────────────────────────────────────── */

body {
  background: var(--ground);
  color: var(--text);
  font-family: 'Poppins', 'Trebuchet MS', system-ui, -apple-system, sans-serif;
  font-weight: 300;
  line-height: 1.7;
}

/* Poppins nunca por encima de 600. */
h1, h2, h3, h4, h5, h6, strong, b { font-weight: 600; }

.eyebrow {
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: var(--tracking-eyebrow);
  text-transform: uppercase;
}

:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 1ms !important;
    transition-duration: 1ms !important;
    scroll-behavior: auto !important;
  }
}

/* Inputs numéricos sin flechas nativas. */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
input[type="number"] { -moz-appearance: textfield; appearance: textfield; }