/**
 * tokens.css — GENERADO AUTOMÁTICAMENTE. No editar a mano.
 * Fuente: design/tokens.json  ·  Regenerar: npm run tokens
 */
:root {
  /* ── color ─────────────────────────────────── */
  --color-base-white: #FFFFFF;
  --color-base-quartz: #F6F5F2;
  --color-base-pearl: #EDEAE4;
  --color-base-sand: #E3DED5;
  --color-base-stone-300: #C7C2B9;
  --color-base-stone-400: #A8A29A;
  --color-base-stone-500: #807B72;
  --color-base-stone-600: #5C5852;
  --color-base-charcoal: #1C1B19;
  --color-base-anthracite: #232320;
  --color-base-ink: #0C0C0A;
  --color-brand-gold: #B08D57;
  --color-brand-gold-soft: #C9A876;
  --color-brand-gold-deep: #8A6D3F;
  --color-semantic-bg-canvas: var(--color-base-quartz);
  --color-semantic-bg-surface: var(--color-base-white);
  --color-semantic-bg-elevated: var(--color-base-pearl);
  --color-semantic-bg-inverse: var(--color-base-charcoal);
  --color-semantic-bg-inverse-2: var(--color-base-anthracite);
  --color-semantic-text-primary: var(--color-base-charcoal);
  --color-semantic-text-secondary: var(--color-base-stone-500);
  --color-semantic-text-muted: var(--color-base-stone-400);
  --color-semantic-text-inverse: var(--color-base-white);
  --color-semantic-text-on-dark-muted: var(--color-base-stone-300);
  --color-semantic-accent: var(--color-brand-gold);
  --color-semantic-accent-hover: var(--color-brand-gold-deep);
  --color-semantic-border-subtle: #E5E1DA;
  --color-semantic-border-strong: #D4CFC6;
  --color-semantic-border-inverse: #3A3A35;

  /* ── font ─────────────────────────────────── */
  --font-family-serif: "Cormorant Garamond", "Playfair Display", Georgia, serif;
  --font-family-sans: Inter, "Helvetica Neue", Arial, sans-serif;
  --font-weight-light: 300;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --font-size-xs: 0.75rem;
  --font-size-sm: 0.875rem;
  --font-size-base: 1rem;
  --font-size-md: 1.125rem;
  --font-size-lg: 1.375rem;
  --font-size-xl: 1.75rem;
  --font-size-2xl: 2.25rem;
  --font-size-3xl: 3rem;
  --font-size-4xl: 4rem;
  --font-size-5xl: 5.5rem;
  --font-line-height-tight: 1.05;
  --font-line-height-snug: 1.2;
  --font-line-height-normal: 1.5;
  --font-line-height-relaxed: 1.75;
  --font-letter-spacing-tighter: -0.03em;
  --font-letter-spacing-tight: -0.01em;
  --font-letter-spacing-normal: 0em;
  --font-letter-spacing-wide: 0.08em;
  --font-letter-spacing-widest: 0.24em;

  /* ── space ─────────────────────────────────── */
  --space-0: 0rem;
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
  --space-9: 6rem;
  --space-10: 8rem;
  --space-11: 10rem;

  /* ── radius ─────────────────────────────────── */
  --radius-none: 0rem;
  --radius-sm: 0.25rem;
  --radius-md: 0.5rem;
  --radius-lg: 1rem;
  --radius-xl: 1.5rem;
  --radius-pill: 999px;

  /* ── shadow ─────────────────────────────────── */
  --shadow-xs: 0px 1px 2px 0px rgba(28,27,25,0.04);
  --shadow-sm: 0px 4px 16px 0px rgba(28,27,25,0.05);
  --shadow-md: 0px 12px 32px -8px rgba(28,27,25,0.08);
  --shadow-lg: 0px 24px 60px -12px rgba(28,27,25,0.12);

  /* ── motion ─────────────────────────────────── */
  --motion-duration-fast: 180ms;
  --motion-duration-base: 320ms;
  --motion-duration-slow: 600ms;
  --motion-duration-slower: 900ms;
  --motion-easing-standard: cubic-bezier(0.22, 0.61, 0.36, 1);
  --motion-easing-entrance: cubic-bezier(0.16, 1, 0.3, 1);

  /* ── size ─────────────────────────────────── */
  --size-container: 1240px;
  --size-container-narrow: 820px;
  --size-gutter: 1.5rem;
  --size-gutter-lg: 3rem;
  --size-header-h: 76px;

  /* ── breakpoint ─────────────────────────────────── */
  --breakpoint-sm: 640px;
  --breakpoint-md: 768px;
  --breakpoint-lg: 1024px;
  --breakpoint-xl: 1280px;
}