/*
Theme Name: chris and friends
Theme URI:
Description: Custom WordPress theme built pixel-perfect from the CAF x RADA Figma design. Reusable ACF Flexible-Content module system on a dark, glow-accented dark theme.
Version: 1.0
Author: chris and friends
Text Domain: theme
*/

/* ============================================================
   :root — DESIGN TOKENS
   Single source of truth for tokenizable values.
   Every value traces to theme/docs/home/figma-audit.json.
   NOTE: font-SIZES are tokenized (raw Figma px), but line-heights,
   weights and alignment are written PER ELEMENT in main.css because
   the same px size appears with different line-heights across the design.
   ============================================================ */
:root {
  /* === Colors (figma-audit.json → colors[]) === */
  --color-bg: #000000;      /* page background, overlays, button text on lime */
  --color-white: #FFFFFF;   /* body text, headings, logos, white button bg, calendly bg */
  --color-green: #2BEB7C;   /* brand green: accordion open title/plus, tagline sweep target, glow core 1 */
  --color-lime: #B7FF2B;    /* CTA + submit button bg, glow core 2, footer gradient start */
  --color-line: #707070;    /* form field underlines, accordion dividers */

  /* === Background glow (module-catalog defaults; overridable via ACF options) === */
  --glow-1: #2BEB7C;
  --glow-2: #B7FF2B;

  /* === Font family (figma-audit.json → font_family) === */
  --font-sans: 'Barlow', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  /* === Type scale — raw Figma px (figma-audit.json → typography[]) === */
  --fs-100: 100px; /* #TEAM CAF (700) */
  --fs-80: 80px;   /* section headlines: hero, REFERENZEN, BECOME A FRIEND (900) */
  --fs-50: 50px;   /* contact info (900) · accordion plus icon (400) */
  --fs-30: 30px;   /* accordion item titles (900) */
  --fs-25: 25px;   /* reference card subtitle (300) */
  --fs-24: 24px;   /* hero subtext + references intro (300 center) · form labels (300 left) */
  --fs-20: 20px;   /* nav links (400) · CTA / submit label (700) */
  --fs-18: 18px;   /* team tagline, footer links, ref card title, accordion body, mehr-ueber-uns btn */
  --fs-16: 16px;   /* DE | EN switch (300) */
  --fs-15: 15px;   /* footer "Jobs ♡" (300) */
  --fs-14: 14px;   /* datenschutz checkbox text (300) */

  /* === Border radius (figma-audit.json → border_radius.tokens[]) === */
  --radius-card: 15px;     /* ref cards, group photo, services visual, image masks/overlays */
  --radius-sm: 5px;        /* mehr-ueber-uns button, form checkbox */
  --radius-btn: 3px;       /* CTA + submit buttons */
  --radius-calendly: 29px; /* Calendly placeholder */

  /* === Gradients (figma-audit.json → gradients[]) === */
  --gradient-footer: linear-gradient(to right, #B7FF2B 0%, #2BEB7C 100%); /* 10px footer bar (3:36) */

  /* === Layout constants (figma-audit.json → spacing.observations / meta) === */
  --site-max: 1920px;   /* design width — treated as MAX; pixel-perfect verified at 1920 */
  --nav-height: 109px;  /* Navi (3:522) height */

  /* === Transitions (design is static in Figma — these drive the briefing's frontend behaviors) === */
  --transition-fast: 150ms ease-out;
  --transition-normal: 300ms ease;
  --transition-slow: 600ms ease;

  /* Soft "standard" easing (Material) — sanftes Ein-/Ausschwingen; treibt die
     smooth/weiche Nav-Transition beim Scroll (nav-shrink → .is-scrolled). */
  --ease-soft: cubic-bezier(0.4, 0, 0.2, 1);
  --transition-nav: 400ms var(--ease-soft);
}