/* base.css — Reset, CSS variables, scroll animations, cursor glow */

* { margin: 0; padding: 0; box-sizing: border-box; }
:root {
  --text: #f0f0f0;
  --dim: #8888aa;
  --accent: #10b981;
  --accent2: #8b5cf6;
  --accent4: #ec4899;
  --blue: #3b82f6;
  /* Dark-theme tokens for the cabinet and the forms (Linear-style surfaces from
     styles.refero.design: three levels, hairlines instead of shadows). The
     landing keeps its own gradients; these only add names. */
  --bg: #08090a; --surface: #0f1011; --surface-2: #161718;
  --text-1: #ffffff; --text-2: #d0d6e0; --muted: #8a8f98;
  --border: #23252a; --border-strong: #383b3f;
  --accent-soft: rgba(16,185,129,0.14); --accent-text: #6ee7b7; --on-accent: #052e1f;
  --warn: #f59e0b; --warn-soft: rgba(245,158,11,0.14); --warn-text: #fcd34d;
  --danger: #ef4444; --danger-soft: rgba(239,68,68,0.14); --danger-text: #fca5a5;
  --kaspi: #f14635;
  --radius-sm: 6px; --radius: 12px; --radius-lg: 16px; --radius-pill: 9999px;
  --font-ui: -apple-system, BlinkMacSystemFont, "SF Pro", "Segoe UI", Roboto, system-ui, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
html { scroll-behavior: smooth; }
body { font-family: -apple-system, BlinkMacSystemFont, 'SF Pro', system-ui, sans-serif; overflow-x: hidden; }

/* ===== Scroll animations ===== */
.reveal { opacity: 0; transform: translateY(40px); transition: all 0.8s cubic-bezier(0.16,1,0.3,1); }
.reveal.v { opacity: 1; transform: none; }
.rl { opacity: 0; transform: translateX(-60px); transition: all 0.8s cubic-bezier(0.16,1,0.3,1); }
.rl.v { opacity: 1; transform: none; }
.rr { opacity: 0; transform: translateX(60px); transition: all 0.8s cubic-bezier(0.16,1,0.3,1); }
.rr.v { opacity: 1; transform: none; }
.rs { opacity: 0; transform: scale(0.8); transition: all 0.7s cubic-bezier(0.16,1,0.3,1); }
.rs.v { opacity: 1; transform: scale(1); }

/* Cursor glow (desktop) */
#cursorGlow {
  position: fixed; width: 250px; height: 250px; border-radius: 50%;
  background: radial-gradient(circle, rgba(16,185,129,0.05) 0%, transparent 70%);
  pointer-events: none; z-index: 9999; transform: translate(-50%,-50%); transition: opacity 0.3s;
}

/* Shared gradient text */
.grad {
  background: linear-gradient(135deg, #fff 0%, var(--accent) 50%, var(--accent2) 100%);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text; background-size: 200% 200%;
  animation: heroGrad 6s ease infinite;
}