/* =========================================================
   Barbatana Productions — Design Tokens
   Palette: deep ocean midnight + amber/gold + warm sand + teal
   Typography: Cormorant Garamond (display) + Inter (body)
   ========================================================= */

:root,
[data-theme="dark"] {
  --color-bg:#090c0f;
  --color-surface:#0d1117;
  --color-surface-2:#111720;
  --color-surface-offset:#141c24;
  --color-surface-dynamic:#1c2633;
  --color-divider:#1e2a38;
  --color-border:#253344;
  --color-text:#e4ddd0;
  --color-text-muted:#8a8070;
  --color-text-faint:#4a4438;
  --color-text-inverse:#090c0f;
  --color-primary:#c98a28;
  --color-primary-hover:#e09e30;
  --color-primary-active:#a86e1a;
  --color-primary-highlight:#1e1a0e;
  --color-ocean:#1a5f6e;
  --color-ocean-light:#2d8a9e;
  --color-sand:#b8a882;
  --color-error:#e85b5b;
  --color-success:#5ec27a;

  --shadow-sm:0 1px 4px rgba(0,0,0,.4);
  --shadow-md:0 4px 20px rgba(0,0,0,.5);
  --shadow-lg:0 16px 60px rgba(0,0,0,.7);

  --radius-sm:.375rem;
  --radius-md:.5rem;
  --radius-lg:.75rem;
  --radius-xl:1rem;
  --radius-full:9999px;

  --transition-interactive:200ms cubic-bezier(0.16,1,0.3,1);

  --content-narrow:640px;
  --content-default:960px;
  --content-wide:1200px;

  --text-xs:clamp(0.75rem,0.7rem + 0.25vw,0.875rem);
  --text-sm:clamp(0.875rem,0.8rem + 0.35vw,1rem);
  --text-base:clamp(1rem,0.95rem + 0.25vw,1.125rem);
  --text-lg:clamp(1.125rem,1rem + 0.75vw,1.5rem);
  --text-xl:clamp(1.5rem,1.2rem + 1.25vw,2.25rem);
  --text-2xl:clamp(2rem,1.2rem + 2.5vw,3.5rem);
  --text-3xl:clamp(2.5rem,1rem + 4vw,5rem);
  --text-hero:clamp(3rem,0.5rem + 7vw,8rem);

  --space-1:.25rem;  --space-2:.5rem;   --space-3:.75rem;
  --space-4:1rem;    --space-5:1.25rem; --space-6:1.5rem;
  --space-8:2rem;    --space-10:2.5rem; --space-12:3rem;
  --space-16:4rem;   --space-20:5rem;   --space-24:6rem;
  --space-32:8rem;

  --font-display:'Cormorant Garamond','Georgia',serif;
  --font-body:'Inter','Helvetica Neue',sans-serif;
}

[data-theme="light"] {
  --color-bg:#f4f0e8;
  --color-surface:#faf7f1;
  --color-surface-2:#ffffff;
  --color-surface-offset:#ede8dd;
  --color-surface-dynamic:#e3ddd0;
  --color-divider:#d5cfc2;
  --color-border:#c8c1b0;
  --color-text:#1c1810;
  --color-text-muted:#6b6252;
  --color-text-faint:#b0a890;
  --color-text-inverse:#f4f0e8;
  --color-primary:#9a6610;
  --color-primary-hover:#b87818;
  --color-primary-active:#7a4e0c;
  --color-primary-highlight:#f2e8d0;
  --color-ocean:#1a5f6e;
  --color-ocean-light:#2d8a9e;
  --color-sand:#8a7d62;
  --shadow-sm:0 1px 3px rgba(28,24,16,.10);
  --shadow-md:0 4px 16px rgba(28,24,16,.12);
  --shadow-lg:0 16px 60px rgba(28,24,16,.16);
}