/* Corporate Space GH · care-label gold on paper
 * gold fills #a28245 · text-safe gold #6e5428 · deep field #14110c
 */
html { background: #f9fafb; }

:root {
  color-scheme: light;

  --color-paper: #f9fafb;
  --color-paper-2: #ffffff;
  --color-ink: #111827;
  --color-muted: #4b5563;
  --color-rule: #e5e7eb;
  --color-accent: #a28245;
  --color-accent-2: #6e5428;
  --color-accent-soft: #f6efe0;
  --color-accent-deep: #14110c;
  --color-accent-mid: #c4a56a;
  --color-on-accent: #ffffff;
  --color-whatsapp: #25d366;
  --color-focus: #a28245;
  --color-danger: #b42318;
  --color-danger-soft: #fbeceb;
  --color-ok: #3d5a2c;
  --color-ok-soft: #eef3e6;
  --color-hairline: rgba(162, 130, 69, 0.35);
  --color-hero-ink: #ffffff;
  --color-on-deep: #f3f4f6;
  --color-nav: #374151;
  --color-mark: #0c0c0c;

  --font-display: "Playfair Display", Georgia, "Times New Roman", serif;
  --font-body: "Outfit", "Segoe UI", sans-serif;

  --space-xs: 0.5rem;
  --space-sm: 0.75rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2.5rem;
  --space-2xl: 4rem;

  --radius-md: 0.5rem;
  --radius-lg: 0.75rem;
  --radius-xl: 1rem;
  --radius-2xl: 1.5rem;
  --radius-3xl: 2.5rem;
  --radius-full: 9999px;

  --shadow-1: 0 1px 2px rgba(20, 17, 12, 0.05), 0 1px 1px rgba(20, 17, 12, 0.04);
  --shadow-2: 0 1px 2px rgba(20, 17, 12, 0.05), 0 8px 20px rgba(20, 17, 12, 0.08);
  --shadow-lift: 0 20px 40px -15px rgba(20, 17, 12, 0.15);
  --shadow-cta: 0 16px 45px rgba(20, 17, 12, 0.28);
  --shadow-tab: 0 -4px 30px rgba(20, 17, 12, 0.08);
  --shadow-btn: 0 10px 20px -10px rgba(20, 17, 12, 0.3);

  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-sheet: cubic-bezier(0.32, 0.72, 0, 1);
  --ease-reveal: cubic-bezier(0, 0, 0.2, 1);
  --dur-short: 220ms;
  --dur-mid: 300ms;
  --dur-long: 420ms;
  --dur-reveal: 600ms;
  --dur-hero: 1000ms;

  --z-skip: 80;
  --z-cart: 70;
  --z-drawer: 60;
  --z-header: 50;
  --z-tabbar: 40;
  --z-fab: 36;
  --z-sticky: 30;

  --aspect-card: 4 / 5;
  --card-width: 240px;
  --max: 80rem;

  --background: var(--color-paper);
  --surface: var(--color-paper-2);
  --foreground: var(--color-ink);
  --muted-foreground: var(--color-muted);
  --border: var(--color-rule);
  --primary: var(--color-accent);
}