/* Bugbee Law Office — design tokens (source of truth for Elementor Site Settings).
   Every value below is used verbatim in the reference HTML. */
:root {
  /* ---------- Brand / core ---------- */
  --bb-navy:        #0B1F3A; /* rgb(11,31,58)   primary dark, headings, body ink, dark sections */
  --bb-navy-deep:   #08182E; /* rgb(8,24,46)    hero bottom fade + small-screen overlay */
  --bb-navy-2:      #0E2748; /* rgb(14,39,72)   dark-section gradient end */
  --bb-navy-3:      #12305A; /* rgb(18,48,90)   feature-panel gradient end */
  --bb-navy-4:      #0D264A; /* rgb(13,38,74)   footer gradient mid */
  --bb-navy-5:      #0A1B33; /* rgb(10,27,51)   footer gradient end */
  --bb-navy-panel:  rgba(19,43,75,.88); /* #132B4B @ 88% glass panels on navy */
  --bb-blue:        #0277C6; /* rgb(2,119,198)  primary accent: CTAs, links, icons, eyebrows */
  --bb-blue-hover:  #1486D4; /* rgb(20,134,212) pill hover */
  --bb-blue-hover-2:#1B8BD6; /* rgb(27,139,214) "Next step" hover */
  --bb-sky:         #9FCBF0; /* rgb(159,203,240) eyebrows/icons on photo heroes */
  --bb-sky-2:       #7FB9E6; /* rgb(127,185,230) eyebrows on navy sections, footer headings */

  /* ---------- Light surfaces ---------- */
  --bb-white:       #FFFFFF;
  --bb-mist:        #F4F8FC; /* rgb(244,248,252) light section bg, utility bar, info boxes */
  --bb-ice:         #EAF3FB; /* rgb(234,243,251) icon chips, tints, offset frames, dropdown hover */
  --bb-frost:       #E6F0FA; /* rgb(230,240,250) gradient start */
  --bb-frost-2:     #EEF5FC; /* rgb(238,245,252) gradient mid */
  --bb-frost-3:     #F6FAFD; /* footer CTA gradient end */
  --bb-frost-4:     #F7FAFD; /* attorney note gradient end */
  --bb-faq-open:    #F9FBFD; /* open accordion bg */
  --bb-img-ph:      #D9E6F2; /* image placeholder bg */
  --bb-warm:        #F7F6F3; /* testimonials section bg */

  /* ---------- Text ---------- */
  --bb-ink:         #0B1F3A; /* headings + lead copy */
  --bb-body:        #3A4553; /* rgb(58,69,83) body copy */
  --bb-body-blog:   #2E3A49; /* blog article body */
  --bb-muted:       #6B7582; /* rgb(107,117,130) meta, captions, legal */
  --bb-faint:       #9AA6B4; /* rgb(154,166,180) index numbers, dots */
  /* on dark */
  --bb-on-dark-1:   #FFFFFF;
  --bb-on-dark-2:   #E6EDF5; /* hero trust list */
  --bb-on-dark-3:   #DCEBF8; /* hero italic subtitle */
  --bb-on-dark-4:   #D6E0EB; /* feature-panel body */
  --bb-on-dark-5:   #C8D3E1; /* navy-section body */
  --bb-on-dark-6:   #D5DEE9; /* footer links */
  --bb-on-dark-7:   #B7C3D3; /* footer base text */
  --bb-on-dark-8:   #C3CEDB; /* copyright */
  --bb-on-dark-9:   #95A4B8; /* footer legal base */
  --bb-on-dark-10:  #8C9BB0; /* disclaimer paragraph */

  /* ---------- Borders ---------- */
  --bb-line:        #E3E9F0; /* rgb(227,233,240) default hairline everywhere */
  --bb-line-2:      #DCE6F0; /* top rules on feature columns */
  --bb-line-3:      #CFDDEB; /* outline buttons, chips, open accordion */
  --bb-line-input:  #D6DEE8; /* form inputs */
  --bb-line-4:      #D6E2EE; /* list rules on tinted bg */
  --bb-line-5:      #DCE8F4; /* tinted card border */
  --bb-line-6:      #EEF2F6; /* table rows */
  --bb-line-hover:  #9CC6EA; /* card hover border */
  --bb-line-warm:   #ECE8E0; --bb-line-warm-2: #EEEBE4; --bb-line-warm-3: #DAD5CB; --bb-dot-warm: #D8D3C9;
  --bb-line-on-dark:   rgba(255,255,255,.16);
  --bb-line-on-dark-2: rgba(255,255,255,.10);
  --bb-line-on-dark-3: rgba(255,255,255,.32); /* ghost pill border */

  /* ---------- Type ---------- */
  --bb-font-display: 'Playfair Display', Georgia, serif;
  --bb-font-body:    'Instrument Sans', system-ui, sans-serif;

  /* ---------- Layout ---------- */
  --bb-container: 1400px;
  --bb-gutter: clamp(20px, 3vw, 32px);
  --bb-gap-grid: 16px;

  /* ---------- Radius ---------- */
  --bb-r-pill: 999px; --bb-r-lg: 10px; --bb-r-md: 8px; --bb-r-sm: 6px; --bb-r-bar: 3px;

  /* ---------- Shadows ---------- */
  --bb-sh-pill-blue: 0 18px 40px -20px rgba(2,119,198,.95), inset 0 1px 0 rgba(255,255,255,.2);
  --bb-sh-pill-blue-hover: 0 26px 50px -20px rgba(2,119,198,1), inset 0 1px 0 rgba(255,255,255,.25);
  --bb-sh-pill-navy: 0 18px 40px -22px rgba(11,31,58,.7);
  --bb-sh-header-cta: 0 12px 26px -14px rgba(2,119,198,.9), inset 0 1px 0 rgba(255,255,255,.2);
  --bb-sh-header-cta-hover: 0 16px 30px -14px rgba(11,31,58,.7), inset 0 1px 0 rgba(255,255,255,.12);
  --bb-sh-submit: 0 18px 36px -20px rgba(2,119,198,.9);
  --bb-sh-card-hover: 0 28px 56px -30px rgba(11,31,58,.4);
  --bb-sh-card-hover-2: 0 28px 56px -32px rgba(11,31,58,.4); /* case results, related posts */
  --bb-sh-quick-hover: 0 34px 64px -32px rgba(11,31,58,.55);
  --bb-sh-featured-hover: 0 32px 64px -36px rgba(11,31,58,.45);
  --bb-sh-panel: 0 40px 80px -60px rgba(11,31,58,.35);
  --bb-sh-form: 0 40px 80px -40px rgba(11,31,58,.28);
  --bb-sh-dropdown: 0 30px 60px -20px rgba(11,31,58,.22);
  --bb-sh-header: 0 10px 30px -18px rgba(11,31,58,.35);
  --bb-sh-chip: 0 8px 20px -12px rgba(11,31,58,.35);
  --bb-sh-tab: 0 16px 36px -24px rgba(11,31,58,.35);
  --bb-sh-badge-hover: 0 20px 40px -26px rgba(11,31,58,.4);
  --bb-sh-footer-badge: 0 10px 24px -12px rgba(11,31,58,.4);
  --bb-sh-totop: 0 16px 32px -14px rgba(11,31,58,.6), inset 0 0 0 1px rgba(255,255,255,.12);
  --bb-focus-ring: 0 0 0 4px rgba(2,119,198,.12);

  /* ---------- Motion ---------- */
  --bb-ease-out: cubic-bezier(.2,.7,.2,1);
  --bb-t-pill: .3s ease;
  --bb-t-btn: .25s;
  --bb-t-link: .2s;
}
