/* ==========================================================================
   Bradobrey Landing — Design Tokens (Supabase-style dark theme)
   Near-black surfaces, signature green accent, thin borders, mono labels.
   Accent lives in --accent — swap it back to #b17b2d to restore brass brand.
   ========================================================================== */

:root {
  /* ---- Green (Supabase signature accent) ---- */
  --green-50:  #e6faf1;
  --green-100: #c3f2dc;
  --green-200: #8fe8bf;
  --green-300: #57dba0;
  --green-400: #3ecf8e; /* base accent */
  --green-500: #24b47e;
  --green-600: #1c9e6f;
  --green-700: #14795a;
  --green-800: #0d5540;
  --green-900: #08392c;
  --green-950: #04211a;

  /* ---- Neutral (near-black scale) ---- */
  --n-0:   #ffffff;
  --n-50:  #ededed;
  --n-100: #d4d4d4;
  --n-200: #a0a0a0;
  --n-300: #808080;
  --n-400: #666666;
  --n-500: #4d4d4d;
  --n-600: #3d3d3d;
  --n-700: #2e2e2e;
  --n-800: #232323;
  --n-850: #1c1c1c;
  --n-900: #171717;
  --n-950: #121212;

  /* ---- Semantic ---- */
  --bg:            var(--n-900);
  --bg-shell:
    radial-gradient(60% 45% at 78% 0%, rgba(62, 207, 142, 0.10), transparent 70%),
    radial-gradient(50% 40% at 0% 12%, rgba(62, 207, 142, 0.05), transparent 70%);
  --surface:       var(--n-850);
  --surface-2:     var(--n-800);
  --text:          var(--n-50);
  --text-muted:    var(--n-200);
  --text-faint:    var(--n-300);

  --accent:        var(--green-400);
  --accent-strong: var(--green-300);
  --accent-soft:   var(--green-700);
  --accent-dim:    var(--green-900);

  --line:          var(--n-700);
  --line-strong:   var(--n-600);

  /* Kept for backward-compat with existing class names (all dark now) */
  --dark-bg:       var(--n-950);
  --dark-panel:    var(--n-850);
  --dark-line:     var(--n-700);
  --dark-text:     var(--n-50);
  --dark-muted:    var(--n-200);

  --card-bg:       var(--n-850);
  --card-shadow:   0 1px 0 rgba(255, 255, 255, 0.03), 0 18px 40px rgba(0, 0, 0, 0.45);
  --card-shadow-lg: 0 1px 0 rgba(255, 255, 255, 0.04), 0 30px 70px rgba(0, 0, 0, 0.55);
  --card-radius:   1rem;
  --card-radius-sm: 0.75rem;

  /* Type */
  --font-sans: 'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, 'SFMono-Regular', 'Menlo', monospace;
  --tracking-eyebrow: 0.02em;
  --tracking-tight: -0.03em;

  --text-hero: clamp(2.9rem, 1.1rem + 7.4vw, 6.5rem);
  --text-h2:   clamp(1.9rem, 1.1rem + 3.1vw, 3.5rem);
  --text-h3:   clamp(1.2rem, 1rem + 0.9vw, 1.6rem);
  --text-lead: clamp(1.05rem, 0.95rem + 0.5vw, 1.28rem);
  --text-base: clamp(0.98rem, 0.95rem + 0.15vw, 1.05rem);
  --text-eyebrow: 0.8rem;

  /* Space & motion */
  --space-section: clamp(5rem, 3.5rem + 7vw, 10rem);
  --gutter: clamp(1.25rem, 0.7rem + 2.5vw, 3rem);
  --maxw: 1200px;

  --dur-fast: 160ms;
  --dur: 380ms;
  --dur-slow: 720ms;
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-out-back: cubic-bezier(0.34, 1.56, 0.64, 1);
}