/* ============================================================
   FUNDORA SOLUTIONS — DESIGN TOKENS
   Role: Single source of truth for all design decisions
   Rule: Every color, space, type value references this file
   ============================================================ */

:root {

  /* ── COLOR: BASE ── */
  --c-bg:         #0A0A0A;   /* true dark — dominant surface */
  --c-bg-1:       #111111;   /* section layering */
  --c-bg-2:       #1A1A1A;   /* cards, containers */
  --c-bg-3:       #222222;   /* elevated surfaces */
  --c-border:     rgba(255, 255, 255, 0.06);
  --c-border-md:  rgba(255, 255, 255, 0.10);

  /* ── COLOR: TEXT ── */
  --c-text:       #FFFFFF;
  --c-text-2:     #B3B3B3;   /* secondary text */
  --c-text-3:     #6B6B6B;   /* labels, meta, muted */
  --c-text-4:     #444444;   /* disabled, ghost text */

  /* ── COLOR: ACCENT — Fundora Green ── */
  --c-green:      #4CB944;
  --c-green-dark: #2F7A2A;
  --c-green-glow: rgba(76, 185, 68, 0.12);
  --c-green-dim:  rgba(76, 185, 68, 0.06);

  /* ── COLOR: SUPPORT ── */
  --c-blue:       #3B82F6;
  --c-blue-dim:   rgba(59, 130, 246, 0.10);

  /* ── GRADIENT ── */
  --g-hero:       radial-gradient(ellipse 80% 60% at 50% -10%, rgba(76,185,68,0.08) 0%, transparent 60%);
  --g-card:       linear-gradient(135deg, rgba(255,255,255,0.03) 0%, transparent 100%);
  --g-fade-b:     linear-gradient(to bottom, transparent, var(--c-bg));
  --g-fade-t:     linear-gradient(to top, transparent, var(--c-bg));

  /* ── TYPOGRAPHY ── */
  --font-head:    'Sora', 'Inter', system-ui, -apple-system, sans-serif;
  --font-body:    'Inter', system-ui, -apple-system, sans-serif;
  --font-mono:    'JetBrains Mono', 'Fira Code', monospace;

  /* Type scale — fluid via clamp */
  --t-xs:   clamp(0.70rem, 1vw,   0.75rem);   /* 11–12px */
  --t-sm:   clamp(0.81rem, 1.2vw, 0.875rem);  /* 13–14px */
  --t-base: clamp(0.94rem, 1.5vw, 1rem);      /* 15–16px */
  --t-md:   clamp(1.06rem, 1.8vw, 1.125rem);  /* 17–18px */
  --t-lg:   clamp(1.25rem, 2vw,   1.5rem);    /* 20–24px */
  --t-xl:   clamp(1.5rem,  3vw,   2rem);      /* 24–32px */
  --t-2xl:  clamp(2rem,    4vw,   2.75rem);   /* 32–44px */
  --t-3xl:  clamp(2.5rem,  5vw,   3.5rem);    /* 40–56px */
  --t-4xl:  clamp(3rem,    6vw,   4.5rem);    /* 48–72px */

  /* ── SPACING ── */
  --s-1:    4px;
  --s-2:    8px;
  --s-3:    12px;
  --s-4:    16px;
  --s-5:    20px;
  --s-6:    24px;
  --s-8:    32px;
  --s-10:   40px;
  --s-12:   48px;
  --s-16:   64px;
  --s-20:   80px;
  --s-24:   96px;
  --s-32:   128px;

  /* ── LAYOUT ── */
  --max-w:     1200px;
  --max-w-md:  880px;
  --max-w-sm:  640px;
  --px:        clamp(20px, 5vw, 48px);

  /* ── RADIUS ── */
  --r-sm:  6px;
  --r-md:  10px;
  --r-lg:  16px;
  --r-xl:  24px;
  --r-full: 9999px;

  /* ── SHADOWS ── */
  --shadow-card:  0 1px 3px rgba(0,0,0,0.5), 0 4px 20px rgba(0,0,0,0.3);
  --shadow-glow:  0 0 40px rgba(76,185,68,0.10);
  --shadow-lg:    0 8px 40px rgba(0,0,0,0.6);

  /* ── TRANSITIONS ── */
  --ease:       cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out:   cubic-bezier(0, 0, 0.2, 1);
  --dur-fast:   150ms;
  --dur-base:   250ms;
  --dur-slow:   400ms;

  /* ── NAV ── */
  --nav-h:     68px;
}
