/* ============================================================================
   Recode Audio — Studio 84 Series · Design Tokens
   Single source of truth for color, type, spacing, surfaces. Derived from the
   actual plugin UI: green accent 0xFF2E8B45, all-black synth panels + brushed
   metal effect faceplates, RECODE wordmark.
   ============================================================================ */
@font-face {
  font-family: "Michroma";
  src: url("../assets/fonts/Michroma-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
:root {
  /* ---- Brand accent (exact plugin faceplate green) ---- */
  --green:        #2E8B45;
  --green-bright: #3BA859;   /* hover / active lift */
  --green-deep:   #1F6831;   /* pressed / shadow */
  --green-glow:   rgba(46, 139, 69, 0.35);

  /* ---- Neutrals (pulled from the plugin panels) ---- */
  --ink:        #1B1C1E;   /* near-black panel */
  --charcoal:   #3A3B3E;   /* chrome buttons */
  --graphite:   #565a5e;   /* muted lines on dark */
  --silver:     #c7ccce;   /* brushed metal mid */
  --paper:      #F2F2F0;   /* off-white labels */
  --paper-pure: #FAFBFC;   /* lightest surface */

  /* ---- Semantic surfaces (two visual worlds) ---- */
  --bg:            var(--ink);        /* site default = dark, synth world */
  --bg-elevated:   #232427;
  --bg-metal:      linear-gradient(160deg, #e9ebec 0%, #cdd2d4 48%, #b9bec1 100%); /* FX cards */
  --surface-line:  rgba(255,255,255,0.08);
  --surface-line-metal: rgba(0,0,0,0.14);

  /* ---- Text ---- */
  --text:        #ECEDEA;
  --text-dim:    #9a9d9f;
  --text-on-metal: #1B1C1E;
  --text-on-green: #ffffff;

  /* ---- Type ---- */
  --font-display: "Archivo", "Helvetica Neue", Arial, sans-serif;  /* heavy geometric, matches wordmark */
  --font-body:    "Inter", system-ui, -apple-system, sans-serif;
  --font-mono:    "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace; /* price/spec chips, binary motif */
  --font-plugin:  "Michroma", "Archivo", sans-serif;  /* plugin names + Studio 84 lockup — matches faceplate type */

  --fs-hero:   clamp(2.6rem, 6vw, 5rem);
  --fs-h1:     clamp(2rem, 4vw, 3.25rem);
  --fs-h2:     clamp(1.5rem, 2.6vw, 2.25rem);
  --fs-h3:     1.25rem;
  --fs-body:   1.0625rem;
  --fs-small:  0.875rem;
  --fs-micro:  0.75rem;

  --lh-tight:  1.05;
  --lh-snug:   1.25;
  --lh-body:   1.6;

  /* ---- Spacing scale (8px base) ---- */
  --s-1: 0.25rem;  --s-2: 0.5rem;   --s-3: 0.75rem;  --s-4: 1rem;
  --s-5: 1.5rem;   --s-6: 2rem;     --s-7: 3rem;     --s-8: 4rem;
  --s-9: 6rem;     --s-10: 8rem;

  /* ---- Radius / shadow / layout ---- */
  --radius-sm: 4px;
  --radius:    8px;
  --radius-lg: 14px;
  --radius-pill: 999px;
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.35);
  --shadow:    0 8px 28px rgba(0,0,0,0.45);
  --shadow-green: 0 6px 24px var(--green-glow);
  --maxw:      1200px;
  --maxw-text: 68ch;
  --nav-h:     68px;

  --ease: cubic-bezier(0.22, 1, 0.36, 1);
}

/* ---- Light/metal section context (effects world) ---- */
.metal {
  --bg: var(--bg-metal);
  --text: var(--text-on-metal);
  --text-dim: #4a4e50;
  --surface-line: var(--surface-line-metal);
}