/* This site was custom designed by Sitethreesixty.com and is actively managed by Sitethreesixty.com */
/* ================================
   DESIGN TOKENS - BELOW-FOLD ONLY
   Variables used by deferred CSS that are NOT
   defined in critical.css or internal-critical.css.
   All above-fold tokens live in the critical files.
   ================================ */

:root {

  /* ========================================
     BELOW-FOLD ONLY TOKENS
     ======================================== */

  /* Background semantic tokens (below fold) */
  --bg-section: var(--color-white);
  --bg-section-alt: var(--color-off-white);
  --bg-card: var(--color-white);
  --bg-card-hover: var(--color-gray-100);

  /* Accent semantic (below fold usage) */
  --accent-primary-hover: var(--color-orange-dark);
  --accent-secondary: var(--color-blue);
  --accent-secondary-hover: var(--color-blue-dark);

  /* Border tokens (below fold) */
  --border-strong: var(--color-gray-400);
  --border-focus: var(--color-blue);

  /* Button secondary (below fold) */
  --button-secondary-bg: transparent;
  --button-secondary-bg-hover: var(--color-blue-subtle);
  --button-secondary-text: var(--color-blue);
  --button-secondary-border: var(--color-blue);

  /* Input tokens (below fold — contact/forms) */
  --input-bg: var(--color-white);
  --input-border: var(--color-gray-300);
  --input-border-focus: var(--color-blue);
  --input-text: var(--color-text);
  --input-placeholder: var(--color-text-muted);

  /* Footer tokens (below fold) */
  --footer-bg: var(--color-gray-200);
  --footer-text: var(--color-text-secondary);
  --footer-heading: var(--color-text);
  --footer-link: var(--color-text-secondary);
  --footer-link-hover: var(--color-orange);

  /* Overlay/glass (below fold) */
  --glass-bg: rgba(255, 255, 255, 0.85);
  --glass-border: rgba(255, 255, 255, 0.3);

  /* Trust badge tokens (below fold) */
  --badge-bg: var(--color-blue-subtle);
  --badge-text: var(--color-blue);
  --badge-icon: var(--color-orange);

  /* Extra shadow tokens (hover states, below fold) */
  --shadow-glass-hover: 0 8px 24px rgba(0, 0, 0, 0.08), inset 0 0 0 1px rgba(255, 255, 255, 0.9);
  --shadow-elevated-hover: 0 20px 40px -6px rgba(0, 0, 0, 0.2), 0 8px 16px -4px rgba(0, 0, 0, 0.12);

  /* Glow effects (below fold) */
  --glow-orange: 0 0 20px rgba(249, 115, 22, 0.15);
  --glow-orange-strong: 0 0 30px rgba(249, 115, 22, 0.25);
  --glow-blue: 0 0 20px rgba(30, 64, 175, 0.1);
  --glow-blue-strong: 0 0 30px rgba(30, 64, 175, 0.2);

  /* Blur effects (below fold) */
  --blur-sm: blur(4px);
  --blur-md: blur(8px);
  --blur-lg: blur(12px);
  --blur-xl: blur(20px);
  --backdrop-glass: blur(12px) saturate(180%);
  --backdrop-glass-strong: blur(20px) saturate(200%);

  /* CTA padding (below fold) */
  --cta-padding-sm: 30px;
  --cta-padding-md: 40px;
  --cta-padding-lg: 50px;

  /* Max line width variants (below fold) */
  --max-line-width-narrow: 55ch;
  --max-line-width-wide: 85ch;

  /* List spacing (below fold) */
  --list-spacing: 0.75em;

  /* Text inverse (below fold) */
  --text-inverse: var(--color-white);

  /* State colors (below fold) */
  --color-warning: #F59E0B;
  --color-info: #2980B9;
  --color-info-dark: #1a5276;
  --color-accent: var(--color-blue);
  --color-border: var(--color-gray-200);

  /* Navigation background scrolled (deferred below fold) */
  --nav-border: var(--color-gray-200);

}

/* This site was custom designed by Sitethreesixty.com and is actively managed by Sitethreesixty.com */