/* Seculogik design tokens — deep-space blue + sand.
   Everything colour/size on the site comes from here. */
:root {
  color-scheme: dark;

  /* Ground */
  --bg: #040814;
  --bg-2: #071021;
  --bg-3: #0b1730;
  --surface: rgba(12, 24, 54, 0.62);
  --surface-2: rgba(16, 32, 70, 0.78);
  --surface-solid: #0d1a36;

  /* Blue family */
  --blue: #2f6bff;
  --blue-2: #5b8cff;
  --blue-deep: #143fb8;
  --cyan: #4fd1ff;
  --cyan-2: #8ee8ff;

  /* Sand family (the accent people click) */
  --sand: #e9c97b;
  --sand-2: #f3dda1;
  --sand-dark: #b9963f;
  --sand-ink: #2a1f06;

  /* Text */
  --fg: #e8eeff;
  --fg-2: #c3cfea;
  --fg-muted: #8e9fc4;
  --fg-dim: #5f6f94;

  /* Lines and glows */
  --line: rgba(120, 160, 255, 0.16);
  --line-2: rgba(120, 160, 255, 0.32);
  --line-sand: rgba(233, 201, 123, 0.45);
  --glow-blue: 0 0 0 1px rgba(91, 140, 255, 0.35), 0 0 32px rgba(47, 107, 255, 0.25);
  --glow-sand: 0 0 0 1px rgba(233, 201, 123, 0.5), 0 0 28px rgba(233, 201, 123, 0.22);
  --glow-cyan: 0 0 24px rgba(79, 209, 255, 0.35);

  /* Status */
  --ok: #43d9a3;
  --warn: #f2b84b;
  --crit: #ff5d73;

  /* Type */
  --font-display: "Space Grotesk", "Inter", system-ui, sans-serif;
  --font-body: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;

  --fs-hero: clamp(2.6rem, 6.5vw, 5.2rem);
  --fs-h1: clamp(2.2rem, 5vw, 3.8rem);
  --fs-h2: clamp(1.7rem, 3.2vw, 2.6rem);
  --fs-h3: clamp(1.15rem, 1.8vw, 1.45rem);
  --fs-lede: clamp(1.05rem, 1.5vw, 1.3rem);
  --fs-body: 1.02rem;
  --fs-small: 0.88rem;
  --fs-mono: 0.78rem;

  /* Layout */
  --container: 1180px;
  --narrow: 760px;
  --gutter: clamp(1rem, 4vw, 2.5rem);
  --section: clamp(4rem, 10vw, 8rem);
  --radius: 14px;
  --radius-sm: 8px;
  --radius-lg: 22px;

  /* Motion */
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --dur: 0.6s;
}