/* ============================================================
   AP CONSULTING SOLUTIONS BRANDING
   ============================================================ */

/* 1. GLOBAL COLORS & OVERRIDES */
:root {
  --c-primary: #1B2F5E;
  --c-primary-d: #0F2040;
  --c-secondary: #2EAA4A; /* Maps to success/metric color */
  --c-accent: #1E6FCC; /* Replaced default F59E0B with 1E6FCC */
  --c-accent-d: #185CA8; 
  --c-white: #FFFFFF;
  --c-light: #F0F2F5;
  --c-muted: #5A6A80;
  --c-border: #E8ECF2;
  --c-dark: #0F2A4A;
  --c-text: #1B2F5E;
}

/* Base Body overrides */
body {
  color: var(--c-text);
  overflow-x: hidden !important;
  width: 100%;
}

/* Ensure main content containers for custom templates are truly full-width */
main.contact-main,
main.global-page-main,
section.custom-page-content {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}


/* 2. HEADER & NAVIGATION */
.site-header {
  background: #FFFFFF;
  border-bottom: 1px solid #E8ECF2;
}

.nav-menu > li > a {
  color: #1B2F5E;
}

.nav-menu > li > a:hover,
.nav-menu > li.current-menu-item > a,
.nav-menu > li > a.active {
  color: #1E6FCC;
}

.nav-menu > li.current-menu-item > a {
  color: #2EAA4A;
}

.mega-menu, .sub-menu {
  background: #FFFFFF;
}

.nav-menu .sub-menu li a:hover,
.mega-menu-item:hover {
  background: #F0F2F5;
  color: #1E6FCC !important;
}
.nav-menu .sub-menu li a:hover strong,
.mega-menu-item:hover strong {
  color: #1E6FCC;
}

/* 3. BUTTONS */
/* Primary CTA */
.btn-accent, .btn-primary {
  background: #2EAA4A !important;
  color: #FFFFFF !important;
  border-color: transparent !important;
}
.btn-accent:hover, .btn-primary:hover {
  background: #1B2F5E !important;
  color: #FFFFFF !important;
}

/* Secondary outline */
.btn-outline, .btn-outline-white {
  background: transparent !important;
  border: 2px solid #FFFFFF !important;
  color: #FFFFFF !important;
}
.btn-outline:hover, .btn-outline-white:hover {
  background: #FFFFFF !important;
  color: #1B2F5E !important;
}

/* Form Submit Button */
form button[type="submit"], 
.wpforms-submit,
.form-submit button {
  background: #1B2F5E !important;
  color: #FFFFFF !important;
  border: none !important;
}
form button[type="submit"]:hover, 
.wpforms-submit:hover,
.form-submit button:hover {
  background: #2EAA4A !important;
  color: #FFFFFF !important;
}

/* 4. LINKS */
.entry-content a, p a {
  color: #1E6FCC;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.entry-content a:hover, p a:hover {
  color: #2EAA4A;
}
.entry-content a:active, p a:active {
  color: #1B2F5E;
}

.footer-links a, .footer-legal a {
  color: #C8D8F0;
}
.footer-links a:hover, .footer-legal a:hover {
  color: #2EAA4A; /* Replaced F59E0B */
}

/* 5. SECTION BACKGROUNDS */
.bg-light, .whychoose-section, .industries-section, .casestudies-section, .leadform-section, .service-features {
  background-color: #F0F2F5 !important;
}

.services-section, .about-overview {
  background-color: #FFFFFF !important;
}

.process-section, .cta-banner-section, .footer-main, .site-footer {
  background-color: #0F2040 !important;
}

.hero-section, .service-hero, .page-hero {
  background: #0F2A4A !important; 
  position: relative;
  overflow: hidden;
}

/* 5.1 Centered Hero (Common Page Template) */
.hero-centered {
  text-align: center;
  padding: 100px 0 80px;
}

.hero-centered .page-hero-inner {
  display: flex;
  justify-content: center;
}

.hero-centered .page-hero-content {
  max-width: 800px;
}

.hero-centered .page-hero-desc {
  color: rgba(255, 255, 255, 0.8) !important;
  font-size: 1.15rem;
  margin: 0 auto;
}

/* Decorative background blobs to match screenshot */
.hero-centered::after {
  content: '';
  position: absolute;
  top: -10%;
  right: -5%;
  width: 300px;
  height: 300px;
  background: radial-gradient(circle, rgba(30, 111, 204, 0.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

.hero-centered::before {
  content: '';
  position: absolute;
  bottom: -20%;
  right: -10%;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(46, 170, 74, 0.08) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}

/* 5.2 Pill Tag Styling */
.section-tag-pill {
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 50px;
  padding: 6px 20px;
  font-size: 0.7rem !important;
  letter-spacing: 0.1em;
  background: rgba(255, 255, 255, 0.05);
  margin-bottom: 2rem !important;
  display: inline-block;
  color: #1E6FCC !important;
}

/* If background gradient is locked via elementor background */
.cw-hero-slider {
  background: #0F2A4A !important; 
}

.card, .service-card, .whychoose-card, .industry-card, .form-card, .feature-card, .snapshot-card {
  background: #FFFFFF !important;
  border-color: #DDE3EC !important;
}

/* 6. TYPOGRAPHY */
/* Headings */
h1, h2, h3, h4, h5, h6 {
  color: #1B2F5E;
}

.hero-section h1, .hero-section h2, .service-hero h1, .page-hero h1,
.process-section h2, .cta-banner-section h2, .cta-banner-section p, .hero-content p {
  color: #FFFFFF !important;
}

/* Hero Accent Text ("Momentum for organizations.") */
.hero-content h1 em, .cw-hero-slider h2 em, .hero-content em {
  font-style: normal;
  color: #2EAA4A !important;
}

/* Eyebrow Labels */
.section-tag, .snap-label, .case-row-label {
  color: #1E6FCC !important; /* Replaced F59E0B */
}

.hero-badge, .process-section .section-tag, .cta-banner-section .section-tag {
  color: #2EAA4A !important;
}

/* Body / Paragraphs */
p {
  color: #5A6A80;
}

/* 7. ACCENT ELEMENTS */
.service-icon, .whychoose-icon, .industry-icon, .feature-icon, .value-icon {
  color: #1B2F5E !important;
}
.service-icon svg, .whychoose-icon svg, .industry-icon svg, .feature-icon svg, .value-icon svg {
  stroke: #1B2F5E !important;
}
/* Hover icons */
.service-card:hover .service-icon {
  background: #1E6FCC !important;
}
.service-card:hover .service-icon svg {
  stroke: #FFFFFF !important;
}
/* Industry Card Hover FIX */
.industry-card:hover {
  background: #FFFFFF !important;
  border-color: #2EAA4A !important;
}
.industry-card:hover h4 {
  color: #1B2F5E !important;
}
.industry-card:hover .industry-icon {
  background: #E8F5EC !important;
}
.industry-card:hover .industry-icon svg {
  stroke: #2EAA4A !important;
}

/* Bullet Dots */
.perk-dot, .hero-badge-dot {
  background: #2EAA4A !important;
}
.styled-list li::before {
  color: #2EAA4A !important;
}

/* Phase / step numbers */
.step-number, .step-num {
  background: #1B3A6B !important;
  border-color: #2EAA4A !important;
  color: #FFFFFF !important;
}
.process-step:hover .step-number,
.process-step.active .step-number {
  background: #2EAA4A !important;
  border-color: #2EAA4A !important;
  color: #FFFFFF !important;
}

/* Metric / stat numbers */
.stat-card-value, .metric-value, .snap-metric, .result-val {
  color: #2EAA4A !important;
}

/* Divider / border line */
hr, .snapshot-divider, .case-metrics, .footer-bottom {
  border-color: #E8ECF2 !important;
}
.process-steps::before {
  background: #2A4A7A !important;
  opacity: 0.6 !important;
}

/* Form input focus */
input:focus, select:focus, textarea:focus {
  border-color: #1E6FCC !important;
  box-shadow: 0 0 0 3px rgba(30,111,204,.15) !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   8. FULL-WIDTH CONTENT  —  Common Page Template ONLY
   ALL rules are scoped to .full-width-content; they CANNOT affect other pages.
═══════════════════════════════════════════════════════════════════════════ */

/* 8.0  Main wrapper: flush, no extra space */
main.contact-main {
    overflow-x: hidden !important;    /* kills horizontal scrollbar */
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}
.full-width-content,
.full-width-content .elementor-page-content {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    display: block !important;
    box-sizing: border-box !important;
}

/* 8.1  Elementor intermediate wrappers (old widget system) — strip all padding */
.full-width-content .elementor-column,
.full-width-content .elementor-col-100,
.full-width-content .elementor-widget,
.full-width-content .elementor-widget-wrap,
.full-width-content .elementor-widget-container,
.full-width-content .elementor-widget-html,
.full-width-content .elementor-widget-html .elementor-widget-container {
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* 8.1b  Elementor Flexbox Container system (e-con, e-con-boxed) — THE ROOT CAUSE
   The CTA section is inside an e-con-boxed which constrains its width.
   Override to be truly full-width, no padding, no max-width limit. */
.full-width-content .e-con,
.full-width-content .e-con-boxed,
.full-width-content .e-parent,
.full-width-content .e-grid {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
}

/* 8.1c  Elementor grid root wrapper */
.full-width-content .elementor > .e-grid,
.full-width-content .elementor-element.e-grid {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* 8.2  All sections inside the raw HTML are full-width by default */
.full-width-content .elementor-widget-html  section {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
}

/* 8.3  Inner .container inside raw sections stays centered / boxed (correct) */
.full-width-content .elementor-widget-html section > .container {
    max-width: 1200px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 24px !important;
    padding-right: 24px !important;
    box-sizing: border-box !important;
    width: 100% !important;
}

/* 8.4  Elementor section-level rules (for Elementor-native sections if any) */
.full-width-content .elementor-section {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
}
.full-width-content .elementor-section.elementor-section-boxed > .elementor-container {
    max-width: 1200px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    box-sizing: border-box !important;
}
.full-width-content .elementor-section.elementor-section-full_width > .elementor-container {
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}