/*
 * GO design tokens
 * Source of truth: docs/superpowers/specs/2026-04-15-go-funnel-mobile-web-app-design.md §3
 * Do not hardcode colors, spacings, or durations anywhere else — reference these tokens.
 */

:root {
  /* ── Palette ─────────────────────────────────────── */
  --go-bg: #FAFAFA;
  --go-surface: #FFFFFF;
  --go-ink: #1E293B;
  --go-ink-soft: #64748B;
  --go-ink-faint: #94A3B8;
  --go-headline: #0F766E;
  --go-cta: #F59E0B;
  --go-cta-ink: #FFFFFF;
  --go-cta-hover: #E08C08;
  --go-money: #10B981;
  --go-money-hover: #059669;
  --go-hairline: #E2E8F0;
  --go-surface-muted: #F5F5F5;
  --go-success-soft: #F0FDF4;
  --go-danger-soft: #FEF2F2;
  --go-danger-border: #FCA5A5;
  --go-danger-ink: #991B1B;
  --go-danger-text: #B91C1C;
  --go-shadow: 0 1px 3px rgba(15, 118, 110, 0.08);
  --go-shadow-lg: 0 4px 16px rgba(15, 118, 110, 0.12);

  /* Parent-brand colors — used ONLY inside the full logo lockup (see spec §3).
     Never apply these to surface elements outside the logo. */
  --pacr-navy: #1A365D;
  --pacr-orange: #F97316;

  /* ── Spacing (8pt grid) ──────────────────────────── */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --space-16: 64px;

  /* ── Radii ───────────────────────────────────────── */
  --radius-card: 16px;
  --radius-pill: 9999px;

  /* ── Type scale ──────────────────────────────────── */
  --font-sans: 'Nunito', system-ui, -apple-system, sans-serif;
  --text-display: 700 42px/1.02 var(--font-sans);
  --text-headline: 700 29px/1.12 var(--font-sans);
  --text-title: 700 20px/1.22 var(--font-sans);
  --text-body: 400 17px/1.5 var(--font-sans);
  --text-label: 600 15px/1.3 var(--font-sans);
  --text-caption: 400 13px/1.4 var(--font-sans);
  --text-legal: 400 12px/1.5 var(--font-sans);

  /* ── Motion ──────────────────────────────────────── */
  --ease-spring: cubic-bezier(0.32, 0.72, 0, 1);
  --dur-card-fwd: 220ms;
  --dur-card-back: 200ms;
  --dur-press: 120ms;
  --dur-sheet: 280ms;
  --dur-state-swap: 280ms;
  --dur-count-up: 1200ms;

  /* ── Component sizing ────────────────────────────── */
  --btn-height: 56px;
  /* Nominal height of the .trust-header element itself (used by
     the component's own CSS). The LAYOUT-AFFECTING runtime flag
     below is tracked separately — it's 0px when no trust header
     is actually rendered (desktop, dismissed) and 32px when it is. */
  --trust-header-height: 32px;
  --layout-trust-header-offset: 0px;
  --bottom-bar-pad: max(var(--space-6), env(safe-area-inset-bottom));
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-card-fwd: 0ms;
    --dur-card-back: 0ms;
    --dur-sheet: 0ms;
    --dur-state-swap: 80ms;
    --dur-count-up: 0ms;
  }
}