/**
 * Design tokens — Selling Billings (Lovable reference)
 * Paleta de marca sin cambios; tipografía serif + sans; fondo claro #f3efec.
 */

:root {
	--sb-color-navy: #010130;
	--sb-color-gold: #c0a15a;
	--sb-color-gold-light: #ceb982;
	--sb-color-black: #000000;
	--sb-color-white: #ffffff;
	--sb-color-gold-deep: #9a7a3e;
	--sb-color-cream: #f3efec;

	--sb-color-navy-soft: rgb(1 1 48 / 72%);
	--sb-color-navy-faint: rgb(1 1 48 / 8%);
	--sb-color-white-soft: rgb(255 255 255 / 78%);
	--sb-color-white-faint: rgb(255 255 255 / 16%);

	--sb-color-bg: var(--sb-color-cream);
	--sb-color-bg-alt: var(--sb-color-white);
	--sb-color-bg-inverse: var(--sb-color-navy);
	--sb-color-text: var(--sb-color-navy);
	--sb-color-text-muted: var(--sb-color-navy-soft);
	--sb-color-text-on-dark: var(--sb-color-white);
	--sb-color-text-on-dark-muted: var(--sb-color-white-soft);
	--sb-color-primary: var(--sb-color-navy);
	--sb-color-accent: var(--sb-color-gold);
	--sb-color-accent-light: var(--sb-color-gold-light);
	--sb-color-accent-hover: var(--sb-color-gold-deep);
	--sb-color-border: rgb(1 1 48 / 12%);
	--sb-color-border-on-dark: var(--sb-color-white-faint);

	--sb-font-heading: "Playfair Display", "Libre Baskerville", Georgia, "Times New Roman", serif;
	--sb-font-body: "DM Sans", "Avenir Next", "Segoe UI", Helvetica, Arial, sans-serif;

	--sb-font-size-eyebrow: 0.6875rem;
	--sb-font-size-sm: 0.9375rem;
	--sb-font-size-base: 1rem;
	--sb-font-size-lg: 1.25rem;
	--sb-font-size-xl: clamp(1.75rem, 2.5vw, 2.25rem);
	--sb-font-size-2xl: clamp(2rem, 3.2vw, 2.75rem);
	--sb-font-size-display: clamp(2.35rem, 4.8vw, 3.65rem);

	--sb-letter-spacing-eyebrow: 0.28em;
	--sb-letter-spacing-heading: -0.01em;
	--sb-line-height-heading: 1.15;
	--sb-line-height-body: 1.65;

	--sb-space-2xs: 8px;
	--sb-space-xs: 16px;
	--sb-space-sm: 24px;
	--sb-space-md: 40px;
	--sb-space-lg: 72px;
	--sb-space-xl: 112px;

	--sb-container-padding: clamp(16px, 2.8vw, 48px);
	--sb-container-max: 1320px;
	--sb-header-height: 76px;

	--sb-radius-sm: 2px;
	--sb-radius-md: 4px;
	--sb-radius-card: 4px;
	--sb-transition: 200ms ease;
	--sb-shadow: 0 12px 32px rgb(1 1 48 / 6%);
}