/* מענה — design tokens. Light-first, warm paper canvas, signal-teal brand, voice-orb gradient.
   Rationale: a business owner hands their first impression to a voice agent → the surface must read
   trustworthy and calm, not flashy AI. One chromatic anchor (teal), warmth from paper + amber accents,
   real chroma reserved for the living voice-orb. */

:root {
  /* color — premium blue (Meta / Apple / Figma / Framer / BMW family) on a cool light canvas */
  --bg: #FAFBFD;
  --surface: #FFFFFF;
  --surface-2: #F1F4F9;
  --text: #0E1422;
  --text-muted: #586173;
  --primary: #0A66E0;
  --primary-ink: #FFFFFF;
  --primary-strong: #074FB5;
  --primary-soft: #E9F1FE;
  --accent: #0EA5C9;
  --accent-soft: #E0F5FB;

  /* multi-accent family (Figma/Nike harmonic arc) — fill=icon tiles/orb/buttons · ink=TEXT (all ≥4.5:1 on white) · soft=pale chip bg. Blue stays the CTA/brand. */
  --a-blue: #2E7DF6;   --a-blue-ink: #074FB5;   --a-blue-soft: #E9F1FE;
  --a-indigo: #5B5BF0; --a-indigo-ink: #4B40C0; --a-indigo-soft: #ECECFE;
  --a-cyan: #0EA5C9;   --a-cyan-ink: #0E7490;   --a-cyan-soft: #E0F5FB;
  --a-teal: #12A594;   --a-teal-ink: #0F766E;   --a-teal-soft: #DEF5F0;
  --a-coral: #F2536D;  --a-coral-ink: #C2334D;  --a-coral-soft: #FDE8EC;
  --a-amber: #F59E0B;  --a-amber-ink: #B45309;  --a-amber-soft: #FDF1DC;
  --border: #E3E8F1;
  --border-strong: #CCD4E2;
  --success: #0A66E0;
  --success-soft: #E9F1FE;
  --danger: #E5484D;
  --danger-soft: #FCEAEA;
  --warning: #C8881A;
  --ring: #0A66E0;
  --live: #1B8FF5;
  --on-dark: #EAF1FB;
  --surface-dark: #0C1B33;

  /* type */
  --font-heading: 'Heebo', 'Assistant', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-body: 'Heebo', 'Assistant', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono: 'JetBrains Mono', 'SFMono-Regular', ui-monospace, 'Menlo', monospace;
  --font-latin: 'Inter', system-ui, -apple-system, sans-serif;
  --display-size: clamp(2rem, 1.3rem + 3.2vw, 3.5rem);
  --display-tracking: -0.02em;
  --body-size: 1.0625rem;
  --body-leading: 1.6;

  /* radii */
  --r-xs: 6px;
  --r-sm: 10px;
  --r-md: 14px;
  --r-lg: 20px;
  --r-xl: 28px;
  --r-pill: 999px;

  /* shadow */
  --sh-xs: 0 1px 2px rgba(22, 26, 34, 0.04);
  --sh-sm: 0 1px 3px rgba(22, 26, 34, 0.06), 0 1px 2px rgba(22, 26, 34, 0.04);
  --sh-md: 0 4px 12px rgba(22, 26, 34, 0.07), 0 2px 4px rgba(22, 26, 34, 0.04);
  --sh-lg: 0 12px 28px rgba(22, 26, 34, 0.10), 0 4px 8px rgba(22, 26, 34, 0.05);
  --sh-xl: 0 24px 56px rgba(22, 26, 34, 0.14);
  --sh-focus: 0 0 0 3px rgba(10, 102, 224, 0.30);
  --sh-orb: 0 0 0 1px rgba(10, 102, 224, 0.18), 0 8px 40px rgba(10, 102, 224, 0.24), 0 4px 18px rgba(25, 195, 255, 0.16);
  --sh-card: 0 2px 6px rgba(20, 30, 60, 0.06), 0 1px 2px rgba(20, 30, 60, 0.04);

  /* motion */
  --m-instant: 100ms;
  --m-fast: 160ms;
  --m-base: 220ms;
  --m-slow: 320ms;
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --orb-breathe: 1600ms;
  --orb-breathe-ease: cubic-bezier(0.45, 0, 0.55, 1);
  --waveform-cycle: 900ms;

  /* gradients */
  --g-hero: radial-gradient(120% 140% at 85% 0%, #E9F1FE 0%, #FAFBFD 46%, #FAFBFD 100%);
  --g-orb: conic-gradient(from 210deg at 50% 50%, #19C3FF 0deg, #12A594 64deg, #2E7DF6 140deg, #0A66E0 220deg, #5B5BF0 290deg, #F2536D 332deg, #19C3FF 360deg);
  --g-orb-idle: radial-gradient(circle at 38% 32%, #2E8CF6 0%, #0A66E0 52%, #074FB5 100%);
  --g-waveform: linear-gradient(90deg, #0EA5C9 0%, #2E7DF6 28%, #0A66E0 52%, #5B5BF0 74%, #F2536D 100%);
  --g-halo: radial-gradient(circle at 50% 50%, rgba(46,140,246,0.30) 0%, rgba(10,102,224,0.10) 55%, transparent 72%);
  --g-cta: linear-gradient(180deg, #0A66E0 0%, #074FB5 100%);
  --g-sheen: linear-gradient(180deg, #FFFFFF 0%, #F8FAFD 100%);
  --g-dark: linear-gradient(160deg, #0C1B33 0%, #081223 100%);

  /* liquid glass — frosted translucent surfaces */
  --glass: rgba(255, 255, 255, 0.55);
  --glass-strong: rgba(255, 255, 255, 0.74);
  --glass-border: rgba(255, 255, 255, 0.7);
  --glass-blur: blur(16px) saturate(170%);
  --glass-blur-lite: blur(10px) saturate(150%);
  --glass-edge: inset 0 1px 0 rgba(255, 255, 255, 0.85);
  --glass-sh: 0 10px 40px rgba(22, 26, 34, 0.10);
  --glass-dark: rgba(255, 255, 255, 0.07);
  --glass-dark-border: rgba(255, 255, 255, 0.16);
  --glass-dark-edge: inset 0 1px 0 rgba(255, 255, 255, 0.20);

  /* ambient depth — soft color the glass refracts */
  --blob-teal: rgba(46, 140, 246, 0.22);
  --blob-amber: rgba(106, 90, 240, 0.16);
  --blob-blue: rgba(25, 195, 255, 0.15);

  --maxw: 1120px;
}

@media (prefers-reduced-motion: reduce) {
  :root { --orb-breathe: 0ms; --waveform-cycle: 0ms; }
  * { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; }
}