/* ===================================================
   THE METALLIQUE HANDICRAFT
   Design System Variables
=================================================== */

:root {

  /* ===========================
     COLORS
  ============================ */

  --color-background: #F8F5F1;
  --color-surface: #FFFFFF;

  --color-charcoal: #171614;
  --color-text: #2D2B28;
  --color-muted: #6E6962;

  --color-border: #E7E1D8;

  --color-brass: #B08D57;

  --color-success: #3E6B57;
  --color-error: #A13E3E;


  /* ===========================
     TYPOGRAPHY
  ============================ */

  --font-heading: "Cormorant Garamond", serif;
  --font-body: "Inter", sans-serif;


  /* Font Sizes */

  --fs-hero: 92px;

  --fs-section-title: 56px;

  --fs-subheading: 28px;

  --fs-card-title: 22px;

  --fs-body: 18px;

  --fs-small: 15px;

  --fs-label: 12px;


  /* ===========================
     SPACING
  ============================ */

  --space-xs: 8px;

  --space-sm: 16px;

  --space-md: 24px;

  --space-lg: 40px;

  --space-xl: 64px;

  --space-section: 160px;


  /* ===========================
     LAYOUT
  ============================ */

  --container-width: 1440px;

  --text-column: 520px;

  --image-column: 800px;


  /* ===========================
     BORDER RADIUS
  ============================ */

  --radius-sm: 6px;

  --radius-md: 8px;

  --radius-lg: 12px;


  /* ===========================
     SHADOWS
  ============================ */

  --shadow-soft:
      0 10px 30px rgba(0,0,0,.06);

}