/* ==========================================================================
   LGM Design Tokens
   Single source of truth for colors, typography, spacing, radius, shadow.
   Every page imports this file first, then its own page styles.
   ========================================================================== */

/* ----- Custom brand font ----- */
@font-face {
  font-family: 'Eating Pasta';
  src: url('/assets/fonts/EatingPasta.otf') format('opentype'),
       url('/assets/fonts/EatingPasta.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

:root {
  /* ----- Brand colors ----- */
  --lgm-purple-deep:    #3e2c70;  /* primary brand purple */
  --lgm-purple-bright:  #8742ea;  /* accent / focus / hover */
  --lgm-purple-tint:    #f3eefc;  /* subtle purple background */
  --lgm-gold:           #e4b259;  /* gold accent */
  --lgm-gold-tint:      #fdf5e6;  /* subtle gold background */

  /* ----- Ink / text ----- */
  --lgm-ink:            #1a1326;  /* darkest — headings */
  --lgm-body:           #2e2a3a;  /* body copy */
  --lgm-muted:          #6b6577;  /* secondary text, labels */

  /* ----- Surfaces ----- */
  --lgm-bg:             #ffffff;  /* card / surface */
  --lgm-bg-alt:         #fafaff;  /* page background */
  --lgm-line:           #e6e0ef;  /* borders, dividers */

  /* ----- Status colors ----- */
  --lgm-success:        #2e8555;
  --lgm-warning:        #c89541;
  --lgm-danger:         #c0392b;

  /* ----- Typography ----- */
  --font-display: 'Eating Pasta', 'Playfair Display', Georgia, serif;
  --font-serif:   'Playfair Display', Georgia, serif;
  --font-body:    'Inter', -apple-system, BlinkMacSystemFont, sans-serif;

  /* ----- Spacing scale ----- */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  24px;
  --space-6:  32px;
  --space-7:  48px;
  --space-8:  64px;

  /* ----- Radius ----- */
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;

  /* ----- Shadow ----- */
  --shadow-sm: 0 1px 3px rgba(62,44,112,0.06);
  --shadow-md: 0 4px 12px rgba(62,44,112,0.08);
  --shadow-lg: 0 8px 24px rgba(62,44,112,0.12);

  /* ----- Layout ----- */
  --container-max: 1100px;
}