/*
Theme Name: Springfield Electric Pros
Theme URI: https://electricianspringfieldohio.com
Author: Springfield Electric Pros Engineering Team
Author URI: https://electricianspringfieldohio.com
Description: High-converting, pay-per-call lead-generation theme for residential electricians in Springfield, OH and Clark County. Features upfront flat-rate pricing, 24/7 emergency dispatch CTAs, Custom Post Types for Services and Service Areas, and a Modern Premium Trade aesthetic.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: springfield-electric-pros
Tags: lead-generation, electrician, local-business, pay-per-call, responsive-layout, custom-menu, custom-post-types
*/

/* Core CSS Custom Properties & Base Styles */
:root {
  --font-heading: 'Sora', sans-serif;
  --font-sans: 'Inter', sans-serif;
  --color-primary-dark: #0B1220;
  --color-primary-surface: #152343;
  --color-accent-amber: #FFB703;
  --color-accent-orange: #FF6B35;
  --color-glow-blue: #2E6CF6;
  --color-success-green: #0EA86C;
  --color-bg-light: #F6F7FB;
  --color-border-light: #E8EAF1;
  --color-text-muted: #5B6472;
  --color-text-ink: #0F172A;
}

html {
  scroll-behavior: smooth;
  font-family: var(--font-sans);
  color: var(--color-text-ink);
  background-color: var(--color-bg-light);
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  letter-spacing: -0.015em;
}

/* Background Gradients & Glows */
.bg-mesh-hero {
  background-color: #0B1220;
  background-image: 
    radial-gradient(circle at 12% 20%, rgba(255, 183, 3, 0.14) 0%, transparent 45%),
    radial-gradient(circle at 88% 18%, rgba(46, 108, 246, 0.16) 0%, transparent 48%),
    radial-gradient(circle at 50% 80%, rgba(21, 35, 67, 0.95) 0%, #0B1220 100%);
}

.bg-dot-pattern {
  background-image: radial-gradient(rgba(255, 255, 255, 0.08) 1.2px, transparent 1.2px);
  background-size: 24px 24px;
}

/* Button & Card Glows */
.btn-amber-glow {
  box-shadow: 0 4px 20px -2px rgba(255, 107, 53, 0.35);
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}

.btn-amber-glow:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 28px -2px rgba(255, 107, 53, 0.5);
}

.card-lift-hover {
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.25s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.25s ease;
}

.card-lift-hover:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 32px -8px rgba(11, 18, 32, 0.12);
}

/* Mobile pulsing call button */
@keyframes pulse-ring {
  0% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(255, 107, 53, 0.7);
  }
  70% {
    transform: scale(1);
    box-shadow: 0 0 0 16px rgba(255, 107, 53, 0);
  }
  100% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(255, 107, 53, 0);
  }
}

.animate-pulse-ring {
  animation: pulse-ring 2.2s cubic-bezier(0.24, 0, 0.38, 1) infinite;
}
