/* AI Workflows palette — slate & copper (real estate warmth) */
:root {
  --bg: #050a12;
  --bg-2: #0e1d2a;
  --accent: #cf6a3a;
  --accent-2: #f4b860;
  --accent-3: #f9d089;
  --text: #f4ece0;
  --text-soft: #a0afc0;
  --muted: #5e6a78;
  --border: rgba(244, 184, 96, 0.12);
  --border-strong: rgba(244, 184, 96, 0.24);
  --surface: rgba(244, 184, 96, 0.04);
  --surface-solid: #0e1d2a;
  --input: #0e1d2a;
}
body {
  background-image:
    radial-gradient(ellipse 80% 55% at 18% -8%, color-mix(in srgb, #0e1d2a 60%, transparent), transparent 70%),
    radial-gradient(ellipse 55% 50% at 80% 8%, color-mix(in srgb, var(--accent-2) 8%, transparent), transparent 60%),
    radial-gradient(circle at 50% 50%, color-mix(in srgb, var(--surface-solid) 35%, transparent), var(--bg));
  background-attachment: fixed; background-size: cover;
}
.topbar { background: rgba(5, 10, 18, 0.96); }
.topbar .brand { color: var(--accent-3); }
a.cta { background: var(--accent-2); color: #050a12 !important; box-shadow: 0 8px 30px color-mix(in srgb, var(--accent-2) 30%, transparent); }
a.cta:hover { background: var(--accent-3); color: #050a12 !important; box-shadow: 0 10px 40px color-mix(in srgb, var(--accent-2) 50%, transparent); }
.kicker { color: var(--accent-3); }