/* ============================================
   LaserMed · Design Tokens
   ============================================ */

:root {
  /* ---------- Color · Base ---------- */
  --lm-bg: #f5f1ea;
  --lm-bg-2: #ede6d7;
  --lm-bg-3: #e6dec9;
  --lm-bg-dark: #161412;
  --lm-bg-dark-2: #221f1c;

  /* ---------- Color · Ink ---------- */
  --lm-ink: #1a1815;
  --lm-ink-2: #5c574f;
  --lm-ink-3: #8c857b;
  --lm-ink-4: #b5afa3;
  --lm-ink-inv: #f8f5ef;
  --lm-ink-inv-2: #c7c1b4;

  /* ---------- Color · Accent (cobre) ---------- */
  --lm-accent: #c9603d;
  --lm-accent-2: #a84d2c;
  --lm-accent-soft: #e8b89e;
  --lm-accent-bg: #f4dcc9;

  /* ---------- Color · Auxiliary ---------- */
  --lm-green: #3b5c4e;
  --lm-sand: #d4b996;

  /* ---------- Color · Functional ---------- */
  --lm-whatsapp: #25d366;
  --lm-warn: #b54a3a;
  --lm-ok: #3b5c4e;

  /* ---------- Borders ---------- */
  --lm-border: rgba(26, 24, 21, 0.12);
  --lm-border-2: rgba(26, 24, 21, 0.2);
  --lm-border-dark: rgba(248, 245, 239, 0.12);

  /* ---------- Shadows ---------- */
  --lm-shadow-sm: 0 1px 2px rgba(26, 24, 21, 0.04), 0 1px 3px rgba(26, 24, 21, 0.06);
  --lm-shadow: 0 4px 8px rgba(26, 24, 21, 0.04), 0 8px 24px rgba(26, 24, 21, 0.08);
  --lm-shadow-lg: 0 8px 16px rgba(26, 24, 21, 0.06), 0 16px 40px rgba(26, 24, 21, 0.1);
  --lm-shadow-cobre: 0 4px 16px rgba(201, 96, 61, 0.18);

  /* ---------- Typography · Families ---------- */
  --font-serif: "Fraunces", "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-mono: "JetBrains Mono", "SF Mono", "Monaco", "Cascadia Code", monospace;

  /* ---------- Typography · Sizes (fluid) ---------- */
  --fs-eyebrow: clamp(11px, 0.7vw, 13px);
  --fs-caption: clamp(13px, 0.85vw, 15px);
  --fs-body: clamp(16px, 1.1vw, 18px);
  --fs-body-lg: clamp(18px, 1.3vw, 21px);
  --fs-h6: clamp(18px, 1.4vw, 22px);
  --fs-h5: clamp(22px, 1.8vw, 28px);
  --fs-h4: clamp(26px, 2.4vw, 36px);
  --fs-h3: clamp(30px, 3.2vw, 44px);
  --fs-h2: clamp(36px, 5vw, 64px);
  --fs-h1: clamp(48px, 8vw, 120px);

  /* ---------- Spacing ---------- */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 24px;
  --sp-8: 32px;
  --sp-10: 40px;
  --sp-12: 48px;
  --sp-16: 64px;
  --sp-20: 80px;
  --sp-24: 96px;
  --sp-30: 120px;
  --sp-40: 160px;

  /* ---------- Layout ---------- */
  --max-w: 1280px;
  --max-w-narrow: 880px;
  --max-w-wide: 1440px;
  --pad-x: clamp(20px, 5vw, 80px);

  /* ---------- Radii ---------- */
  --r-sm: 6px;
  --r-md: 12px;
  --r-lg: 20px;
  --r-pill: 999px;

  /* ---------- Motion ---------- */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-out-soft: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 200ms;
  --dur: 400ms;
  --dur-slow: 800ms;

  /* ---------- Z-index ---------- */
  --z-nav: 100;
  --z-sticky: 50;
  --z-modal: 200;
  --z-toast: 300;
}
