/* ═══════════════════════════════════════════════
   Nymbus - Design tokens
   "In the clouds" aesthetic: airy, carefree, capable.
   Light-first. Dark is an honest opt-in, not the default.
   ═══════════════════════════════════════════════ */

:root {
    /* ── Surfaces ───────────────────────────────────────
       Warm off-white, barely tinted toward the brand purple.
       Chroma stays low at high lightness so it reads as
       paper, not neon. */
    --bg:         oklch(0.985 0.005 285);
    --bg2:        oklch(1    0     0);
    --bg3:        oklch(0.97 0.008 285);
    --bg4:        oklch(0.94 0.012 285);

    /* ── Borders ───────────────────────────────────────── */
    --border:     oklch(0.92 0.012 285);
    --border2:    oklch(0.86 0.018 285);
    --border3:    oklch(0.78 0.025 285);

    /* ── Ink ───────────────────────────────────────────── */
    --text:         oklch(0.38 0.022 285);
    --text-bright:  oklch(0.18 0.025 285);
    --text-muted:   oklch(0.55 0.02  285);
    --text-dim:     oklch(0.68 0.018 285);
    --text-dimmer:  oklch(0.78 0.015 285);

    /* ── Brand ─────────────────────────────────────────── */
    --accent:        #7f77dd;                     /* the one non-negotiable */
    --accent-ink:    oklch(0.42 0.18 285);        /* darker purple for text on light bg */
    --accent-dim:    color-mix(in srgb, #7f77dd 10%, transparent);
    --accent-border: color-mix(in srgb, #7f77dd 24%, transparent);
    --accent-soft:   color-mix(in srgb, #7f77dd 18%, var(--bg2));

    /* ── Nav ───────────────────────────────────────────── */
    --nav-bg:     var(--bg2);
    --input-bg:   var(--bg2);

    /* ── Semantic (kept minimal) ─────────────────────────
       One muted amber, one muted green, one muted rose.
       No pure saturated traffic-light reds. */
    --ok:    oklch(0.58 0.13 155);
    --warn:  oklch(0.65 0.14  75);
    --alert: oklch(0.58 0.16  25);

    /* ── Spacing (4pt scale, semantic names) ──────────── */
    --space-2xs: 4px;
    --space-xs:  8px;
    --space-sm:  12px;
    --space-md:  16px;
    --space-lg:  24px;
    --space-xl:  32px;
    --space-2xl: 48px;
    --space-3xl: 64px;
    --space-4xl: 96px;

    /* ── Radii ─────────────────────────────────────────── */
    --radius-sm: 6px;
    --radius-md: 10px;
    --radius-lg: 16px;
    --radius-xl: 24px;

    /* ── Type ──────────────────────────────────────────── */
    --font-display: "evolver-variable", "Hanken Grotesk", Georgia, serif;
    --font-body:    "Hanken Grotesk", ui-sans-serif, system-ui, sans-serif;

    /* ── Motion: slow, drifting, eased out ─────────────── */
    --ease-out:  cubic-bezier(0.22, 1, 0.36, 1);
    --ease-calm: cubic-bezier(0.33, 1, 0.68, 1);
    --dur-fast:  180ms;
    --dur-med:   320ms;
    --dur-slow:  640ms;
    --dur-drift: 18s;
}

/* ── Dark theme: "hour after sunset", not "SaaS black" ─
   Deep twilight blue-purple, never pure black. Chroma
   tints neutrals toward the brand. */
[data-theme="dark"] {
    --bg:         oklch(0.16 0.018 285);
    --bg2:        oklch(0.20 0.022 285);
    --bg3:        oklch(0.24 0.024 285);
    --bg4:        oklch(0.28 0.026 285);

    --border:     oklch(0.26 0.022 285);
    --border2:    oklch(0.32 0.028 285);
    --border3:    oklch(0.40 0.032 285);

    --text:         oklch(0.82 0.018 285);
    --text-bright:  oklch(0.96 0.012 285);
    --text-muted:   oklch(0.66 0.020 285);
    --text-dim:     oklch(0.52 0.022 285);
    --text-dimmer:  oklch(0.42 0.022 285);

    --accent-ink:    oklch(0.78 0.14 285);
    --accent-dim:    color-mix(in srgb, #7f77dd 14%, transparent);
    --accent-border: color-mix(in srgb, #7f77dd 28%, transparent);
    --accent-soft:   color-mix(in srgb, #7f77dd 12%, var(--bg2));

    --nav-bg:     var(--bg2);
    --input-bg:   var(--bg);
}

/* ── Reduced motion: honor it everywhere ───────────── */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
    html { scroll-behavior: auto; }
}

/* ── Horizon: a soft, near-static "sky" gradient that
     sits behind hero sections. Replaces blurred blobs. */
.nimbus-sky {
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    overflow: hidden;
    background:
        radial-gradient(120% 60% at 50% -10%,
            color-mix(in oklch, var(--accent) 16%, transparent) 0%,
            transparent 60%),
        radial-gradient(80% 50% at 85% 110%,
            color-mix(in oklch, var(--accent) 8%, transparent) 0%,
            transparent 55%);
}
[data-theme="dark"] .nimbus-sky {
    background:
        radial-gradient(120% 60% at 50% -10%,
            color-mix(in oklch, var(--accent) 22%, transparent) 0%,
            transparent 60%),
        radial-gradient(80% 50% at 85% 110%,
            color-mix(in oklch, var(--accent) 14%, transparent) 0%,
            transparent 55%);
}