/**
 * Logez design tokens.
 *
 * These variables mirror the approved design system and should be used by
 * child-theme CSS and custom components. Elementor global variables remain the
 * primary editing layer for page builders.
 */

:root {
  /* Colours */
  --lz-color-white: #ffffff;
  --lz-color-dark: #2a292a;
  --lz-color-charcoal: #444444;
  --lz-color-accent: #3ceddf;
  --lz-color-black: #000000;
  --lz-color-surface-light: #f7f7f7;
  --lz-color-grey: #ababab;
  --lz-color-border: #e0e0e0;

  /* Transparent colours */
  --lz-overlay-dark-50: rgba( 0, 0, 0, 0.5 );
  --lz-overlay-dark-65: rgba( 0, 0, 0, 0.65 );
  --lz-border-on-dark: rgba( 255, 255, 255, 0.25 );
  --lz-border-on-light: var( --lz-color-border );

  /* Shadows */
  --lz-shadow-dark-soft: 0 0.25rem 1rem rgba( 0, 0, 0, 0.25 );
  --lz-shadow-dark-medium: 0 0.5rem 1.5rem rgba( 0, 0, 0, 0.4 );

  /* Font families */
  --lz-font-display-family: "Black Ravens", sans-serif;
  --lz-font-body-family: "Hero New Regular", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --lz-font-bold-family: "Hero New Bold", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  /* Fluid font sizes */
  --lz-font-display: clamp( 3rem, 2.1rem + 3vw, 5.125rem );
  --lz-font-h1: clamp( 3.25rem, 2.5rem + 2.2vw, 4.5rem );
  --lz-font-h2: clamp( 2.5rem, 2rem + 1.4vw, 3.5rem );
  --lz-font-h3: clamp( 1.625rem, 1.4rem + 0.5vw, 2rem );
  --lz-font-h4: clamp( 1.375rem, 1.25rem + 0.35vw, 1.625rem );
  --lz-font-h5: clamp( 1.25rem, 1.15rem + 0.25vw, 1.375rem );
  --lz-font-h6: clamp( 1.125rem, 1.05rem + 0.2vw, 1.25rem );
  --lz-font-lead: clamp( 1.1875rem, 1.05rem + 0.45vw, 1.5rem );
  --lz-font-body: clamp( 1rem, 0.95rem + 0.15vw, 1.125rem );
  --lz-font-small: clamp( 0.875rem, 0.84rem + 0.1vw, 0.9375rem );

  /* Line heights */
  --lz-line-display: 0.8;
  --lz-line-h1: 0.8;
  --lz-line-h2: 0.85;
  --lz-line-heading: 1.15;
  --lz-line-body: 1.5;
  --lz-line-small: 1.4;
  --lz-line-button: 1.3;

  /* Layout widths */
  --lz-width-content: 1200px;
  --lz-width-wide: 1440px;
  --lz-width-text: 780px;
  --lz-width-narrow: 640px;

  /* Spacing */
  --lz-space-xs: clamp( 0.5rem, 0.4rem + 0.3vw, 0.75rem );
  --lz-space-sm: clamp( 0.75rem, 0.6rem + 0.4vw, 1rem );
  --lz-space-md: clamp( 1.25rem, 1rem + 0.8vw, 2rem );
  --lz-space-lg: clamp( 2rem, 1.5rem + 1.8vw, 4rem );
  --lz-space-xl: clamp( 3rem, 2rem + 3vw, 6rem );
  --lz-space-xxl: clamp( 4rem, 3rem + 5vw, 9rem );

  /* Radius */
  --lz-radius-sm: 0.25rem;
  --lz-radius-md: 0.5rem;
  --lz-radius-pill: 999px;

  /* Motion */
  --lz-transition-fast: 160ms ease;
  --lz-transition-base: 220ms ease;
}
