/* SmartPilot design tokens: the single source for the website, statics (social-statics) and video (social-video).
   Brand: brand/brand.json. Fixed brand platform: STRATEGY.md section 2. Campaign motifs live in CAMPAIGNS.md, not here. */
@import url('https://fonts.googleapis.com/css2?family=Heebo:wght@400;500;700;800;900&family=Manrope:wght@500;700;800&family=IBM+Plex+Mono:wght@500&display=swap');

:root {
  /* Color: navy "control room" for brand moments, cool paper for reading. */
  --sp-ink: #0B1530;        /* text on light, hero and footer background */
  --sp-deep: #13265C;       /* raised surfaces on navy, headings accent */
  --sp-paper: #F4F8FC;      /* page background */
  --sp-white: #FFFFFF;      /* cards on paper */
  --sp-cyan: #22D3EE;       /* "active / AI on": signal color, never body text on light */
  --sp-blue: #2F6BFF;       /* links, primary buttons on light */
  --sp-muted: #9FB3D9;      /* secondary text on navy, rules */
  --sp-slate: #4A5A7A;      /* secondary text on light (AA on paper) */
  --sp-line: #DCE5F2;       /* hairlines on light */
  --sp-line-dark: #22346A;  /* hairlines on navy */
  --sp-whatsapp: #25D366;   /* WhatsApp buttons only */

  /* Type. Heebo for Hebrew display and body, Manrope for Latin, Plex Mono for system labels and data. */
  --sp-font-he: 'Heebo', 'Manrope', system-ui, sans-serif;
  --sp-font-latin: 'Manrope', 'Heebo', system-ui, sans-serif;
  --sp-font-mono: 'IBM Plex Mono', ui-monospace, monospace;

  /* Scale (fluid, 360px to 1440px). */
  --sp-fs-hero: clamp(2.6rem, 1.6rem + 4.4vw, 5.4rem);
  --sp-fs-h2: clamp(1.9rem, 1.4rem + 2vw, 3.1rem);
  --sp-fs-h3: clamp(1.2rem, 1.05rem + 0.6vw, 1.5rem);
  --sp-fs-lead: clamp(1.08rem, 1rem + 0.35vw, 1.3rem);
  --sp-fs-body: 1.0625rem;
  --sp-fs-small: 0.9rem;
  --sp-fs-label: 0.78rem;
  --sp-lh-tight: 1.05;
  --sp-lh-body: 1.65;
  --sp-track-label: 0.14em;

  /* Space, radius, motion. */
  --sp-gutter: clamp(16px, 4vw, 48px);
  --sp-max: 1200px;
  --sp-section: clamp(72px, 10vw, 140px);
  --sp-radius: 14px;
  --sp-radius-sm: 8px;
  --sp-ease: cubic-bezier(.2, .7, .2, 1);
  --sp-glow: 0 0 0 1px rgba(34, 211, 238, .55), 0 0 28px rgba(34, 211, 238, .35);

  /* Social formats (social-statics / social-video). */
  --sp-safe-reel-top: 220px;   /* 1080x1920: keep text out of the top UI */
  --sp-safe-reel-bottom: 380px;
}