/* ============================================
   JEMMA.APP — Design Tokens
   ============================================ */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800;900&family=DM+Mono:wght@400;500&display=swap');

:root {
  /* — Palette */
  --bg:           #050911;
  --bg-2:         #0a1020;
  --surface:      #0f1829;
  --surface-2:    #151f35;
  --border:       rgba(255,255,255,0.07);
  --border-hi:    rgba(16,185,129,0.3);

  /* — Brand */
  --emerald:      #10b981;
  --emerald-glow: rgba(16,185,129,0.18);
  --emerald-deep: #059669;
  --amber:        #f59e0b;
  --crimson:      #ef4444;
  --indigo:       #6366f1;
  --sky:          #38bdf8;

  /* — Text */
  --text:         #e2e8f0;
  --text-mid:     #94a3b8;
  --text-dim:     #475569;

  /* — Typography */
  --font:         'Outfit', sans-serif;
  --font-mono:    'DM Mono', monospace;

  /* — Radii */
  --r-sm: 10px;
  --r-md: 16px;
  --r-lg: 24px;
  --r-xl: 32px;

  /* — Shadows */
  --shadow-emerald: 0 20px 60px rgba(16,185,129,0.2);
  --shadow-card:    0 8px 32px rgba(0,0,0,0.5);
  --shadow-glow:    0 0 40px rgba(16,185,129,0.15);
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; }

body {
  background: var(--bg);
  color: var(--text);
  font-family: var(--font);
  line-height: 1.65;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }