/* Bri-corp design tokens. Source: design/references/DESIGN.source.md (design only, no copy)
   Brand blue sampled from the logo: #87D4E6 */
:root {
  /* surfaces (obsidian) */
  --void: #07090e;
  --onyx: #0d1117;
  --membrane: #161d26;
  --bg: var(--void);
  --surface: var(--onyx);
  --surface-2: var(--membrane);
  /* text */
  --text: #e2e2ea;
  --text-dim: #bdc8d1;
  --text-mute: #87929a;
  /* accents */
  --brand: #87d4e6; /* logo blue: main accent */
  --primary: #38bdf8; /* ice cyan: interactive */
  --secondary: #5ce1e6; /* neon cyan: glow, hover */
  --chrome: #e2e8f0; /* hairlines and dividers */
  --success: #34d399;
  --danger: #f43f5e;
  /* lines */
  --hairline: rgba(226, 232, 240, 0.08);
  --line: rgba(226, 232, 240, 0.12);
  --line-strong: rgba(226, 232, 240, 0.18);
  /* fonts */
  /* Tech look: Space Grotesk headings, Inter text, JetBrains Mono labels */
  --font-display: 'Space Grotesk', 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-body: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  /* small uppercase labels and buttons */
  --font-mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, Consolas, monospace;
  /* commands and codes only */
  --font-code: ui-monospace, 'SF Mono', Menlo, Consolas, 'Liberation Mono', monospace;
  /* type scale (fluid) */
  /* Phones and tablets get a smooth, smaller scale; from about 1024px wide the
     laptop/desktop sizes take over unchanged. (min(): laptop value, max(): phone curve) */
  --fs-hero: min(clamp(2.25rem, 3.6vw + 0.9rem, 4rem), max(3.03vw + 20.3px, 3.6vw + 0.9rem));
  --fs-xl: min(clamp(1.75rem, 2vw + 0.9rem, 2.5rem), max(1.286vw + 19.9px, 2vw + 0.9rem));
  --fs-lg: min(1.625rem, 0.893vw + 19.14px);
  --fs-md: min(1.25rem, 0.446vw + 16.57px);
  --fs-title: 1.125rem;
  --fs-body-lg: 1.0625rem;
  --fs-body: 0.9375rem;
  --fs-sm: 0.8125rem;
  --fs-label: 0.6875rem;
  /* shape and space (8pt) */
  --r-sm: 0.25rem;
  --r-md: 0.5rem;
  --r-pill: 9999px;
  --s-1: 0.25rem;
  --s-2: 0.5rem;
  --s-3: 1rem;
  --s-4: 1.5rem;
  --s-5: 2.5rem;
  --s-6: 5rem;
  --s-section: min(clamp(4rem, 10vw, 7.5rem), max(7.73vw + 23.3px, 10vw));
  --gutter: clamp(1.5rem, 3.64vw - 12.4px, 2.5rem);
  /* Side margins grow smoothly with the screen, with no sudden jumps:
     16px on a 320px phone, 24px from 430px, then 4% of the width
     (41px at 1024, 51px at 1280, 59px at 1470) up to 80px on big screens. */
  --margin: max(clamp(1rem, 7.27vw - 7.27px, 1.5rem), min(4vw, 5rem));
  /* Very wide screens: content stops at 1600px wide and sits in the middle,
     with equal space on both sides. */
  --content-max: 1600px;
  /* glass and glow */
  --glass: rgba(13, 17, 23, 0.7);
  --blur: 24px;
  --glow-cyan: 0 0 35px -5px rgba(56, 189, 248, 0.22);
  --glow-peak: 0 0 50px rgba(92, 225, 230, 0.35);
  --rim: linear-gradient(
    135deg,
    rgba(226, 232, 240, 0.25),
    rgba(56, 189, 248, 0.15) 50%,
    rgba(226, 232, 240, 0.02)
  );
  /* motion */
  --ease: cubic-bezier(0.23, 1, 0.32, 1);
  --dur-fast: 150ms;
  --dur: 200ms;
  --dur-slow: 520ms;
}