/*
 * BBQ Report design tokens from latest handoff package.
 * Keep this file path-safe for WordPress; brand fonts are loaded by
 * bbq-brand-identity.css and the existing local Font Awesome bundle.
 */
:root {
  --charcoal: #2C2C2C;
  --smoke: #5C5C5C;
  --ember: #D84315;
  --wood: #8D6E63;
  --flame: #FF6F00;
  --ash: #E0E0E0;
  --coal: #424242;

  --brand-orange: #FA4302;
  --brand-brown: #341A10;
  --brand-grey: #948C89;
  --brand-grey-light: #CAC2BF;
  --brand-peach: #EE784D;

  --success: #4CAF50;
  --warning: #FFC107;
  --danger: #F44336;
  --info: #2196F3;

  /* Editorial callout accents and surfaces. */
  --callout-facts: #C8861E;
  --callout-warning: #A8341A;
  --callout-tip-surface: rgba(216, 67, 21, .06);
  --callout-tip-icon-surface: rgba(216, 67, 21, .11);
  --callout-note-surface: rgba(141, 110, 99, .07);
  --callout-note-icon-surface: rgba(141, 110, 99, .13);
  --callout-facts-surface: rgba(200, 134, 30, .07);
  --callout-facts-icon-surface: rgba(200, 134, 30, .13);
  --callout-warning-surface: rgba(168, 52, 26, .06);
  --callout-warning-icon-surface: rgba(168, 52, 26, .12);

  --bg-light: #FAFAFA;
  --bg-dark: #1A1A1A;
  --bg-card: #FFFFFF;

  --font-heading: 'Bebas Neue', 'Arial Narrow', sans-serif;
  --font-body: 'Poppins', system-ui, sans-serif;
  --font-logo: 'ChunkFive Ex', 'Rockwell', Georgia, serif;

  --fs-tiny: 10px;
  --fs-micro: 11px;
  --fs-label: 12px;
  --fs-small: 13px;
  --fs-secondary: 14px;
  --fs-body: 16px;
  --fs-callout-title: 19px;

  --fs-xs: .75rem;
  --fs-sm: .875rem;
  --fs-base: 1rem;
  --fs-lg: 1.125rem;
  --fs-xl: 1.25rem;
  --fs-2xl: 1.5rem;
  --fs-3xl: 1.875rem;
  --fs-4xl: 2.25rem;
  --fs-5xl: 3rem;
  --fs-6xl: 3.75rem;

  --ls-heading: .02em;
  --ls-eyebrow: .06em;

  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-full: 9999px;
  --radius-callout: 10px;
  --radius-callout-icon: 9px;

  --callout-gap: 15px;
  --callout-icon-size: 38px;
  --callout-padding-block: 16px;
  --callout-padding-inline: 20px;
  --callout-margin-block: 22px;

  --shadow-card: 0 4px 14px rgba(26,26,26,.05);
  --shadow-card-elevated: 0 10px 30px rgba(26,26,26,.06);
  --shadow-callout: 0 6px 22px rgba(26,26,26,.05);
  --shadow-hover: 0 14px 30px rgba(26,26,26,.10);
  --shadow-ember: 0 10px 26px rgba(216,67,21,.12);

  --border-subtle: #ECECEC;
  --border-warm: #E6E2DD;
  --surface-card: #FFFFFF;
  --surface-page: #FAFAFA;
  --surface-warm: #FAF8F6;
  --table-row-hover: #FBF5F1;
}