/*
Theme Name: Hello Elementor Child
Theme URI: https://elementor.com/hello-theme/
Description: Custom high-performance child theme for Hello Elementor, tailored for Haris Farooq (Senior SEO Specialist & Growth Strategist). Features custom Page Attribute templates, interactive SEO case studies, live ranking showcases, Core Web Vitals optimizations, and lead capture funnels.
Author: Haris Farooq
Author URI: https://www.linkedin.com/in/harisfarooqofficial
Template: hello-elementor
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: hello-elementor-child
Tags: portfolio, seo-specialist, elementor, responsive-layout, custom-page-templates, clean-code
*/

/* ==========================================================================
   Base Child Theme Styles
   ========================================================================== */

:root {
  --hf-primary: #10b981;
  --hf-primary-hover: #059669;
  --hf-primary-light: rgba(16, 185, 129, 0.12);
  --hf-primary-glow: rgba(16, 185, 129, 0.25);
  --hf-secondary: #0ea5e9;
  --hf-secondary-light: rgba(14, 165, 233, 0.12);
  --hf-accent: #6366f1;
  --hf-accent-light: rgba(99, 102, 241, 0.12);
  
  --hf-bg-dark: #090d16;
  --hf-bg-surface: #0f172a;
  --hf-bg-card: #131d35;
  --hf-bg-card-hover: #192644;
  --hf-border: rgba(255, 255, 255, 0.08);
  --hf-border-hover: rgba(16, 185, 129, 0.35);
  
  --hf-text-main: #f8fafc;
  --hf-text-muted: #94a3b8;
  --hf-text-dim: #64748b;
  
  --hf-radius-sm: 8px;
  --hf-radius-md: 14px;
  --hf-radius-lg: 22px;
  --hf-radius-full: 9999px;
  
  --hf-shadow-sm: 0 4px 6px -1px rgba(0, 0, 0, 0.2), 0 2px 4px -1px rgba(0, 0, 0, 0.1);
  --hf-shadow-md: 0 10px 25px -5px rgba(0, 0, 0, 0.3), 0 8px 10px -6px rgba(0, 0, 0, 0.2);
  --hf-shadow-glow: 0 0 35px -5px rgba(16, 185, 129, 0.22);
  
  --hf-font-sans: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --hf-font-display: 'Plus Jakarta Sans', var(--hf-font-sans);
}

/* Ensure smooth scrolling across page sections */
html {
  scroll-behavior: smooth;
  color-scheme: dark;
}

body {
  font-family: var(--hf-font-sans);
  background-color: var(--hf-bg-dark);
  color: var(--hf-text-main);
  line-height: 1.6;
  overflow-x: hidden;
  margin: 0;
  padding: 0;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Custom Page Template Container Overrides */
.haris-portfolio-wrapper {
  min-height: 100vh;
  background-color: var(--hf-bg-dark);
  background-image: 
    radial-gradient(at 0% 0%, rgba(16, 185, 129, 0.07) 0px, transparent 50%),
    radial-gradient(at 100% 0%, rgba(14, 165, 233, 0.06) 0px, transparent 50%),
    radial-gradient(at 50% 100%, rgba(99, 102, 241, 0.05) 0px, transparent 50%);
  background-attachment: fixed;
}