/*
 * Fluid Brand Theme
 *
 * Sets CSS custom properties for the Fluid brand identity.
 * This file is the ONLY thing that changes when swapping brands.
 * Overrides _base.css defaults and reveal.js --r-* variables.
 */

/* ============================
   FONT FACES
   ============================ */

@font-face {
  font-family: 'FLFont';
  src: url('./assets/fonts/flfontbold.ttf') format('truetype');
  font-weight: 700;
  font-display: swap;
}

@font-face {
  font-family: 'NeueHaas';
  src: url('./assets/fonts/NeueHaasDisplay-Light.ttf') format('truetype');
  font-weight: 300;
  font-display: swap;
}

@font-face {
  font-family: 'NeueHaas';
  src: url('./assets/fonts/NeueHaasDisplay-Mediu.ttf') format('truetype');
  font-weight: 500;
  font-display: swap;
}

@font-face {
  font-family: 'NeueHaas';
  src: url('./assets/fonts/NeueHaasDisplay-Bold.ttf') format('truetype');
  font-weight: 700;
  font-display: swap;
}

@font-face {
  font-family: 'NeueHaas';
  src: url('./assets/fonts/NeueHaasDisplay-Black.ttf') format('truetype');
  font-weight: 900;
  font-display: swap;
}

@font-face {
  font-family: 'Inter';
  src: url('./assets/fonts/Inter-VariableFont.ttf') format('truetype');
  font-weight: 100 900;
  font-display: swap;
}


/* ============================
   BRAND VARIABLES
   ============================ */

:root {
  /* --- Reveal.js native variables --- */
  --r-background-color: #000000;
  --r-main-font: 'Inter', sans-serif;
  --r-main-font-size: 32px;
  --r-main-color: rgba(255, 255, 255, 0.85);
  --r-heading-font: 'NeueHaas', 'Inter', sans-serif;
  --r-heading-color: #ffffff;
  --r-heading-font-weight: 900;
  --r-heading-letter-spacing: -0.02em;
  --r-heading-line-height: 0.95;
  --r-heading-text-transform: uppercase;
  --r-heading-text-shadow: none;
  --r-heading1-text-shadow: none;
  --r-heading-margin: 0 0 20px 0;
  --r-heading1-size: 112px;
  --r-heading2-size: 88px;
  --r-heading3-size: 62px;
  --r-heading4-size: 50px;
  --r-link-color: #42b1ff;
  --r-link-color-hover: #78c8ff;
  --r-selection-background-color: rgba(66, 177, 255, 0.3);
  --r-selection-color: #ffffff;
  --r-code-font: 'SF Mono', 'Fira Code', monospace;
  --r-block-margin: 20px;

  /* --- Brand accent palette --- */
  --brand-accent: #42b1ff;           /* Blue — trust, technical, intelligence */
  --brand-accent-warm: #FF8B58;      /* Orange — urgency, pain, CTAs */
  --brand-accent-green: #44b574;     /* Green — success, proof, solution */
  --brand-accent-purple: #c985e5;    /* Purple — premium, analytical */
  --brand-accent-muted: rgba(255, 255, 255, 0.3);

  /* --- Fluid text palette --- */
  --text-primary: #ffffff;
  --text-secondary: rgba(255, 255, 255, 0.6);
  --text-muted: rgba(255, 255, 255, 0.35);
  --text-faint: rgba(255, 255, 255, 0.2);

  /* --- Structural --- */
  --slide-bg: #000000;
  /* --card-border: inherits from _base.css */
  --card-radius: 12px;
  --divider: rgba(255, 255, 255, 0.08);

  /* --- Decorative asset base path --- */
  --asset-path: './assets';
}


/* ============================
   FLUID-SPECIFIC OVERRIDES
   ============================ */

/* Slide background */
.reveal .slides section {
  background: var(--slide-bg);
}

/* FLFont for taglines and emphasis labels */
.fluid-tagline {
  font-family: 'FLFont', sans-serif;
  font-weight: 700;
}

/* Tier labels in FLFont — tilted, oversized, outdented */
.tier-label {
  font-family: 'FLFont', sans-serif;
  font-weight: 700;
  font-size: 30px;
  display: inline-block;
  transform: rotate(-3deg);
  transform-origin: left center;
  margin-left: -20px;
}

/* Stat values in FLFont blue — bigger and branded */
.stat-card .stat-value {
  font-family: 'FLFont', sans-serif;
  font-weight: 700;
  font-size: 80px;
  color: var(--brand-accent);
}

/* Fluid quote marks — NeueHaas at max weight for decorative impact */
.quote-mark {
  font-family: 'NeueHaas', 'Inter', sans-serif;
  font-weight: 900;
  font-style: normal;
}