/**
 * AVAILABIO — Design Token System
 * Brand: Availabio (formerly Ampersand)
 * Palette: Deep Navy + Jade-Teal + Amber Gold
 * Distinct from prior Ampersand palette (#667eea/purple-indigo)
 *
 * DO NOT import this file from public/ — landing layer only.
 */

:root {

  /* ─── COLOR: Base Scale ─────────────────────────────────── */
  --avb-dark-950:  #030A13;    /* deepest bg — hero dark */
  --avb-dark-900:  #050E1A;    /* hero bg primary */
  --avb-dark-800:  #091828;    /* section bg alternate dark */
  --avb-dark-700:  #0D2137;    /* card bg on dark sections */
  --avb-dark-600:  #1A3550;    /* subtle border on dark */

  /* ─── COLOR: Brand Primary (Deep Ocean Blue) ─────────────── */
  --avb-primary-900: #061E33;
  --avb-primary-700: #0A3D62;  /* main brand blue */
  --avb-primary-500: #1A5276;
  --avb-primary-300: #2E86C1;
  --avb-primary-100: #D6EAF8;

  /* ─── COLOR: Brand Jade (Bioavailability Green — the "bio" color) */
  --avb-jade-900:  #065142;
  --avb-jade-700:  #089B7F;    /* hover / dark jade */
  --avb-jade-500:  #0EC4A0;    /* primary jade — main CTA, accents */
  --avb-jade-400:  #1DDBB7;    /* bright jade — highlight */
  --avb-jade-200:  #A3F0E4;    /* light jade tint */
  --avb-jade-100:  #D4F5EE;    /* surface tint */
  --avb-jade-50:   #EDFAF7;    /* near-white background tint */

  /* ─── COLOR: Accent Amber (Intelligence / Energy) ──────────── */
  --avb-amber-600: #C47D11;
  --avb-amber-500: #F5A623;    /* main amber */
  --avb-amber-300: #FAC85A;
  --avb-amber-100: #FDEFC7;

  /* ─── COLOR: Neutral Surface ──────────────────────────────── */
  --avb-surface:   #FFFFFF;
  --avb-bg:        #F5FFFE;    /* page default — barely perceptible jade tint */
  --avb-bg-alt:    #EFF8F6;    /* alternate section bg */
  --avb-border:    #DAEEF0;    /* subtle dividers */

  /* ─── COLOR: Text ─────────────────────────────────────────── */
  --avb-text-900: #0D1B2A;     /* primary body copy */
  --avb-text-600: #3D5166;     /* secondary / muted */
  --avb-text-400: #6B8090;     /* placeholder, hints */
  --avb-text-on-dark: #E8F4F8; /* body copy on dark bg */
  --avb-text-muted-dark: #8BAAB8; /* muted on dark bg */

  /* ─── GRADIENTS ────────────────────────────────────────────── */
  --avb-grad-hero:  linear-gradient(150deg, #030A13 0%, #082040 55%, #0A3A3A 100%);
  --avb-grad-brand: linear-gradient(135deg, #0A3D62 0%, #0EC4A0 100%);
  --avb-grad-jade:  linear-gradient(135deg, #0EC4A0 0%, #089B7F 100%);
  --avb-grad-dark-section: linear-gradient(150deg, #091828 0%, #0A3D62 100%);
  --avb-grad-text:  linear-gradient(135deg, #0EC4A0 0%, #2E86C1 100%);
  --avb-grad-amber: linear-gradient(135deg, #F5A623 0%, #C47D11 100%);

  /* ─── TYPOGRAPHY ───────────────────────────────────────────── */
  --avb-font-display: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
  --avb-font-body:    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  --avb-text-xs:   0.75rem;    /* 12px */
  --avb-text-sm:   0.875rem;   /* 14px */
  --avb-text-base: 1rem;       /* 16px */
  --avb-text-lg:   1.125rem;   /* 18px */
  --avb-text-xl:   1.25rem;    /* 20px */
  --avb-text-2xl:  1.5rem;     /* 24px */
  --avb-text-3xl:  1.875rem;   /* 30px */
  --avb-text-4xl:  2.25rem;    /* 36px */
  --avb-text-5xl:  3rem;       /* 48px */
  --avb-text-6xl:  3.75rem;    /* 60px */
  --avb-text-7xl:  4.5rem;     /* 72px */

  --avb-leading-tight:  1.2;
  --avb-leading-snug:   1.375;
  --avb-leading-normal: 1.6;
  --avb-leading-loose:  1.8;

  /* ─── SPACING ──────────────────────────────────────────────── */
  --avb-space-1:  0.25rem;
  --avb-space-2:  0.5rem;
  --avb-space-3:  0.75rem;
  --avb-space-4:  1rem;
  --avb-space-5:  1.25rem;
  --avb-space-6:  1.5rem;
  --avb-space-8:  2rem;
  --avb-space-10: 2.5rem;
  --avb-space-12: 3rem;
  --avb-space-16: 4rem;
  --avb-space-20: 5rem;
  --avb-space-24: 6rem;
  --avb-space-32: 8rem;

  /* ─── SHAPE ─────────────────────────────────────────────────── */
  --avb-radius-sm:   6px;
  --avb-radius-md:   10px;
  --avb-radius-lg:   16px;
  --avb-radius-xl:   24px;
  --avb-radius-pill: 999px;

  /* ─── SHADOW ─────────────────────────────────────────────────── */
  --avb-shadow-sm:  0 1px 3px rgba(5, 14, 26, 0.08);
  --avb-shadow-md:  0 4px 16px rgba(5, 14, 26, 0.10);
  --avb-shadow-lg:  0 8px 32px rgba(5, 14, 26, 0.14);
  --avb-shadow-xl:  0 20px 60px rgba(5, 14, 26, 0.20);
  --avb-shadow-jade: 0 8px 30px rgba(14, 196, 160, 0.30);
  --avb-shadow-jade-sm: 0 4px 16px rgba(14, 196, 160, 0.25);

  /* ─── ANIMATION ─────────────────────────────────────────────── */
  --avb-ease:        cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --avb-ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --avb-duration-fast:   150ms;
  --avb-duration-base:   250ms;
  --avb-duration-slow:   400ms;
  --avb-duration-reveal: 600ms;

  /* ─── LAYOUT ────────────────────────────────────────────────── */
  --avb-max-width: 1200px;
  --avb-content-width: 760px;
  --avb-nav-height: 68px;
}