/* ==========================================================================
   LAVA CASCADE — Design Tokens
   Molten purple → red on black. Modern, macOS-flavoured glass UI.
   Change a value here and the whole site follows.
   ========================================================================== */

:root {
  /* ---- Core palette: black with a violet undertone --------------------- */
  --deep:        #060309;   /* deepest void — behind everything */
  --night:       #0B0713;   /* page base (black, faint purple) */
  --night-2:     #120B1E;   /* raised surface */
  --night-3:     #180F28;   /* card / panel */
  --night-4:     #241634;   /* hover surface */

  /* ---- Duotone accents: the cascade ----------------------------------- */
  --violet:      #A855F7;   /* purple end of the gradient */
  --violet-2:    #8B5CF6;   /* deeper violet */
  --plum:        #6D28D9;   /* darkest violet */
  --lava:        #FF3D68;   /* molten red — primary pop */
  --lava-deep:   #C81D4A;   /* dark red */

  /* ---- Signature accent token (used site-wide) ------------------------- */
  --torch:       var(--lava);      /* primary accent = lava red */
  --torch-hot:   var(--violet);    /* gradient partner = violet */
  --torch-soft:  #FF93AC;          /* light highlight (slider thumb etc.) */
  --torch-glow:  rgba(255, 61, 104, 0.45);
  --violet-glow: rgba(168, 85, 247, 0.40);

  /* ---- Secondary: "online" / positive --------------------------------- */
  --grass:       #34E4A8;   /* online / good states (mint, reads on dark) */
  --grass-dim:   #17B98A;

  /* ---- Support --------------------------------------------------------- */
  --sky:         #38BDF8;   /* info / network accents, sparingly */
  --danger:      #FF6B81;   /* form errors */

  /* ---- Text ------------------------------------------------------------ */
  --ink:         #F4EFFA;   /* primary text (warm white) */
  --ink-2:       #C6BAD9;   /* secondary text */
  --muted:       #8C7DA6;   /* captions / meta */
  --faint:       #574B6E;   /* disabled / hairline-on-text */

  /* ---- Lines & fills (glass edges) ------------------------------------- */
  --line:        rgba(255, 255, 255, 0.08);
  --line-2:      rgba(255, 255, 255, 0.14);
  --line-violet: rgba(168, 85, 247, 0.22);
  --fill-soft:   rgba(255, 255, 255, 0.03);
  --fill:        rgba(255, 255, 255, 0.05);

  /* ---- Glass surfaces (macOS vibrancy) --------------------------------- */
  --glass:       rgba(24, 15, 40, 0.55);
  --glass-2:     rgba(18, 11, 30, 0.65);
  --glass-nav:   rgba(11, 7, 19, 0.62);
  --blur:        saturate(160%) blur(20px);

  /* ---- Gradients ------------------------------------------------------- */
  --grad-torch:  linear-gradient(135deg, var(--violet) 0%, var(--lava) 100%);   /* purple → red */
  --grad-surface: linear-gradient(180deg, rgba(255,255,255,.04) 0%, rgba(255,255,255,.015) 100%);
  --grad-night:  radial-gradient(1200px 620px at 50% -12%, #2B1250 0%, var(--night) 46%, var(--deep) 100%);
  --grad-text:   linear-gradient(120deg, #fff 0%, var(--violet) 60%, var(--lava) 100%);

  /* ---- Typography (General Sans, self-hosted) -------------------------- */
  --font-display: "General Sans", "SF Pro Display", system-ui, -apple-system, sans-serif;
  --font-body:    "General Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono:    ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;
  --font-pixel:   var(--font-display);

  /* type scale (fluid) */
  --fs-display: clamp(2.6rem, 6vw, 5rem);
  --fs-h1:      clamp(2rem, 4.5vw, 3.4rem);
  --fs-h2:      clamp(1.6rem, 3.2vw, 2.4rem);
  --fs-h3:      clamp(1.2rem, 2vw, 1.5rem);
  --fs-lead:    clamp(1.05rem, 1.6vw, 1.3rem);
  --fs-body:    1rem;
  --fs-sm:      0.875rem;
  --fs-xs:      0.75rem;

  /* ---- Spacing & shape (rounded, macOS-soft) --------------------------- */
  --gutter:     clamp(1.2rem, 5vw, 3rem);
  --maxw:       1180px;
  --radius-sm:  10px;
  --radius:     16px;
  --radius-lg:  24px;
  --radius-block: 9px;   /* was blocky 4px — now soft to match macOS */

  /* ---- Shadows & glows (soft, purple-tinted) --------------------------- */
  --shadow-1:   0 2px 10px rgba(0, 0, 0, 0.45);
  --shadow-2:   0 16px 44px rgba(8, 2, 20, 0.55);
  --shadow-lift: 0 34px 80px rgba(4, 0, 14, 0.62), 0 0 0 1px rgba(168,85,247,.05);
  --glow-torch: 0 0 0 1px rgba(255, 61, 104, 0.28), 0 12px 44px rgba(255, 61, 104, 0.38);
  --glow-violet: 0 0 0 1px rgba(168, 85, 247, 0.28), 0 12px 44px rgba(168, 85, 247, 0.34);

  /* ---- Motion (smooth macOS glide + springy pop) ---------------------- */
  --ease:       cubic-bezier(0.32, 0.72, 0, 1);      /* smooth, weighty */
  --ease-out:   cubic-bezier(0.16, 1, 0.3, 1);
  --spring:     cubic-bezier(0.34, 1.56, 0.64, 1);   /* gentle overshoot */
  --dur:        0.5s;
  --dur-fast:   0.25s;

  /* ---- Layering -------------------------------------------------------- */
  --z-bg:    0;
  --z-base:  1;
  --z-nav:   100;
  --z-modal: 200;
}