/**
 * FindTheAnswer design tokens — UI Redesign v2 (locked)
 * Ban beige #F6F0E8 and olive #A0B848 as page bg / primary.
 */

:root {
  /* Brand */
  --fta-brand-name: "FindTheAnswer";
  --fta-tagline: "Jawaban untuk kulit yang lebih baik";

  /* Color (UI Redesign v2) */
  --fta-bg: #F8F7FC;
  --fta-surface: #FFFFFF;
  --fta-hero-glow: #EDE9FE;
  --fta-primary: #9BC53D;
  --fta-primary-hover: #86AD32;
  --fta-violet: #5B4BD6;
  --fta-violet-soft: #6B5CE7;
  --fta-text: #1A1A2E;
  --fta-muted: #6B7280;
  --fta-border: #E5E7EB;
  --fta-danger: #DC2626;
  --fta-focus-ring: rgba(155, 197, 61, 0.45);

  /* Compat aliases → violet accents (links / secondary) */
  --fta-primary-deep: var(--fta-violet);
  --fta-accent-night: var(--fta-violet);

  /* Typography */
  --fta-font-serif: "Source Serif 4", "Libre Baskerville", Georgia, serif;
  --fta-font-sans: "Inter", "Plus Jakarta Sans", system-ui, -apple-system, sans-serif;

  --fta-fs-hero: clamp(2rem, 4vw, 3rem);
  --fta-fs-h1: clamp(1.75rem, 3vw, 2.25rem);
  --fta-fs-h2: clamp(1.35rem, 2.5vw, 1.75rem);
  --fta-fs-body: 1rem;
  --fta-fs-small: 0.875rem;
  --fta-lh-tight: 1.25;
  --fta-lh-body: 1.6;

  /* Space */
  --fta-space-xs: 0.25rem;
  --fta-space-sm: 0.5rem;
  --fta-space-md: 1rem;
  --fta-space-lg: 1.5rem;
  --fta-space-xl: 2.5rem;
  --fta-space-2xl: 4rem;
  --fta-gutter: 1rem;

  /* Radius / shadow */
  --fta-radius: 12px;
  --fta-radius-sm: 8px;
  --fta-shadow: 0 4px 24px rgba(26, 26, 46, 0.06);

  /* Layout */
  --fta-max: 1120px;
  --fta-header-h: 68px;
  --fta-touch: 44px;
}