/* ============================================================
   ai-methodist — design tokens (ported 1:1 from the original
   Lovable/TanStack project's src/styles.css)
   ============================================================ */

:root {
  --radius: 1rem;
  --background: oklch(0.975 0.012 85);
  --foreground: oklch(0.24 0.03 260);
  --card: oklch(0.995 0.006 90);
  --card-foreground: oklch(0.24 0.03 260);
  --popover: oklch(0.995 0.006 90);
  --popover-foreground: oklch(0.24 0.03 260);
  --primary: oklch(0.64 0.17 40);
  --primary-glow: oklch(0.72 0.16 55);
  --primary-foreground: oklch(0.99 0.005 90);
  --secondary: oklch(0.42 0.07 195);
  --secondary-foreground: oklch(0.99 0.005 90);
  --muted: oklch(0.93 0.015 85);
  --muted-foreground: oklch(0.5 0.03 260);
  --accent: oklch(0.92 0.04 60);
  --accent-foreground: oklch(0.35 0.06 40);
  --destructive: oklch(0.577 0.245 27.325);
  --destructive-foreground: oklch(0.984 0.003 247.858);
  --border: oklch(0.88 0.02 80);
  --input: oklch(0.88 0.02 80);
  --ring: oklch(0.64 0.17 40);
  --ink: oklch(0.24 0.03 260);
  --ink-foreground: oklch(0.96 0.01 85);
  --teal-soft: oklch(0.94 0.025 195);
  --gradient-cta: linear-gradient(135deg, var(--primary), var(--primary-glow));
  --shadow-card: 0 8px 30px -12px oklch(0.35 0.06 40 / 0.18);
  --shadow-cta: 0 12px 32px -10px oklch(0.64 0.17 40 / 0.5);

  --font-display: "Unbounded", system-ui, sans-serif;
  --font-sans: "Golos Text", system-ui, sans-serif;
}

* {
  border-color: var(--border);
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  background-color: var(--background);
  color: var(--foreground);
  font-family: var(--font-sans);
  margin: 0;
}

h1,
h2,
h3 {
  font-family: var(--font-display);
}

img {
  max-width: 100%;
  display: block;
}

a {
  color: inherit;
}

/* ---------- custom utilities (mirrors @utility in the original) ---------- */

.gradient-cta {
  background-image: var(--gradient-cta);
}

.shadow-cta {
  box-shadow: var(--shadow-cta);
}

.shadow-card-soft {
  box-shadow: var(--shadow-card);
}

.bg-ink {
  background-color: var(--ink);
}

.text-ink-foreground {
  color: var(--ink-foreground);
}

.bg-teal-soft {
  background-color: var(--teal-soft);
}