.elementor-2200 .elementor-element.elementor-element-ea11137{--display:flex;--position:absolute;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--margin-top:10px;--margin-bottom:10px;--margin-left:10px;--margin-right:10px;--padding-top:80px;--padding-bottom:80px;--padding-left:0px;--padding-right:0px;top:0px;}body:not(.rtl) .elementor-2200 .elementor-element.elementor-element-ea11137{left:0px;}body.rtl .elementor-2200 .elementor-element.elementor-element-ea11137{right:0px;}.elementor-2200 .elementor-element.elementor-element-726cadd{width:auto;max-width:auto;top:1px;}body:not(.rtl) .elementor-2200 .elementor-element.elementor-element-726cadd{left:0px;}body.rtl .elementor-2200 .elementor-element.elementor-element-726cadd{right:0px;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}@media(max-width:767px){.elementor-2200 .elementor-element.elementor-element-ea11137{--width:1000px;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:space-between;--flex-wrap:nowrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:15%;--padding-bottom:15%;--padding-left:15%;--padding-right:15%;}}/* Start custom CSS for html, class: .elementor-element-4406b73 */.tp-nav-header {
    width: 100%;
    padding: 20px 0;
    position: absolute; /* Makes it sit OVER your hero section */
    top: 0;
    left: 0;
    z-index: 1000;
    background: transparent;
    font-family: 'Inter', sans-serif;
}

.tp-nav-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 30px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* Logo Styles */
.tp-logo-wrapper { display: flex; align-items: center; gap: 12px; }
.tp-logo-text { display: flex; flex-direction: column; line-height: 1; }
.tp-brand-name { font-weight: 900; color: #0F172A; font-size: 20px; letter-spacing: -0.5px; }
.tp-brand-tagline { font-size: 9px; font-weight: 800; color: #F4A300; letter-spacing: 2px; }

/* Nav Links */
.tp-main-nav { display: flex; gap: 35px; }
.tp-main-nav a { 
    text-decoration: none; 
    color: #475569; 
    font-weight: 600; 
    font-size: 15px; 
    transition: color 0.3s; 
}
.tp-main-nav a:hover { color: #0F172A; }

/* The "Book a Demo" Button */
.tp-header-btn {
    background: #0F172A;
    color: #ffffff;
    padding: 12px 24px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 14px;
    text-decoration: none;
    transition: all 0.3s ease;
}

.tp-header-btn:hover {
    background: #1E293B; /* The hover color you asked for */
    transform: translateY(-2px);
    box-shadow: 0 8px 15px rgba(15, 23, 42, 0.2);
}

/* Mobile Responsiveness */
@media (max-width: 768px) {
    .tp-main-nav { display: none; } /* Standard for mobile; you'd use a burger menu usually */
    .tp-nav-container { padding: 0 20px; }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-726cadd *//* ==========================================
   TRUE PRO: HEADER CSS
=========================================== */
.tp-navbar {
  width: 100%;
  padding: 16px 0;
  background: #ffffff !important; 
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99999; 
  border-bottom: 1px solid #E2E8F0;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}

body { padding-top: 80px !important; }

.tp-nav-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

/* --- LOGO --- */
.tp-logo { display: flex; align-items: center; gap: 12px; text-decoration: none; }
.tp-logo-icon { width: 38px; height: auto; object-fit: contain; }
.tp-logo-text { display: flex; flex-direction: column; align-items: center; line-height: 1; }
.tp-logo-title { font-family: 'Poppins', sans-serif; font-size: 22px; font-weight: 800; color: #0F172A; letter-spacing: 0px; }
.tp-logo-sub { 
  display: flex; align-items: center; gap: 6px;
  font-size: 8px; font-weight: 700; color: #9CA3AF; 
  text-transform: uppercase; letter-spacing: 0.1em; margin-top: 4px; 
}
.tp-logo-sub::before, .tp-logo-sub::after {
  content: ""; display: block; width: 12px; height: 1px; background-color: #F4A300;
}

/* --- DESKTOP NAV & CTA --- */
.tp-desktop-nav { display: flex; gap: 32px; align-items: center; }
.tp-desktop-nav a { text-decoration: none; color: #475569; font-weight: 600; font-size: 15px; transition: color 0.2s; }
.tp-desktop-nav a:hover { color: #F4A300; }

.tp-desktop-cta { display: flex; align-items: center; }

.tp-btn-nav {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; 
  background-color: #0F172A; color: #ffffff; font-family: 'Inter', sans-serif;
  font-size: 15px; font-weight: 600; padding: 12px 24px; border-radius: 8px;
  text-decoration: none; transition: all 0.3s ease; border: none; cursor: pointer;
}
.tp-btn-nav svg { transition: transform 0.3s ease; }
.tp-btn-nav:hover {
  background-color: #1E293B; transform: translateY(-2px); 
  box-shadow: 0 10px 20px -10px rgba(15, 23, 42, 0.5); color: #ffffff;
}
.tp-btn-nav:hover svg { transform: translateX(4px); }

/* --- MOBILE ELEMENTS (Hidden on Desktop) --- */
.tp-hamburger {
  display: none; background: none; border: none; cursor: pointer; padding: 4px;
}
.tp-mobile-menu {
  display: none; /* Hidden by default */
  position: absolute; top: 100%; left: 0; width: 100%;
  background: #ffffff; border-top: 1px solid #E2E8F0;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
  padding: 24px; flex-direction: column; gap: 24px;
}
.tp-mobile-menu.is-open { display: flex; animation: slideDown 0.3s ease forwards; }

@keyframes slideDown {
  from { opacity: 0; transform: translateY(-10px); }
  to { opacity: 1; transform: translateY(0); }
}

.tp-mobile-nav-links { display: flex; flex-direction: column; gap: 16px; }
.tp-mobile-nav-links a {
  text-decoration: none; color: #0F172A; font-weight: 600; font-size: 18px;
  padding-bottom: 16px; border-bottom: 1px solid #F1F5F9;
}
.tp-mobile-cta-wrapper { display: flex; width: 100%; }
.tp-mobile-cta { width: 100%; padding: 16px; font-size: 16px; }

/* ==========================================
   BREAKPOINT: TABLET & MOBILE (< 1024px)
=========================================== */
@media (max-width: 1024px) {
  /* Hide Desktop Elements */
  .tp-desktop-nav, .tp-desktop-cta { display: none; }
  
  /* Show Mobile Elements */
  .tp-hamburger { display: block; }
}

@media (max-width: 768px) {
  .tp-logo-icon { width: 32px; }
  .tp-logo-title { font-size: 18px; }
  .tp-nav-container { padding: 0 16px; }
  <script>
  document.addEventListener('DOMContentLoaded', function() {
    
    // --- 1. MOBILE MENU TOGGLE LOGIC ---
    var menuToggle = document.getElementById('tp-menu-toggle');
    var mobileMenu = document.getElementById('tp-mobile-menu');
    var iconMenu = menuToggle ? menuToggle.querySelector('.tp-icon-menu') : null;
    var iconClose = menuToggle ? menuToggle.querySelector('.tp-icon-close') : null;
    
    if (menuToggle && mobileMenu) {
      menuToggle.addEventListener('click', function(e) {
        e.preventDefault();
        
        // Toggle the open class
        var isOpen = mobileMenu.classList.toggle('is-open');
        
        // Swap the hamburger and X icons
        if (isOpen) {
          iconMenu.style.display = 'none';
          iconClose.style.display = 'block';
        } else {
          iconMenu.style.display = 'block';
          iconClose.style.display = 'none';
        }
      });
    }

    // --- 2. CALENDLY POPUP LOGIC ---
    var calendlyButtons = document.querySelectorAll('.tp-calendly-trigger');
    calendlyButtons.forEach(function(button) {
      button.addEventListener('click', function(e) {
        e.preventDefault(); 
        
        // Close mobile menu if it's open when CTA is clicked
        if (mobileMenu && mobileMenu.classList.contains('is-open')) {
          mobileMenu.classList.remove('is-open');
          iconMenu.style.display = 'block';
          iconClose.style.display = 'none';
        }

        // Launch Calendly
        if (typeof Calendly !== 'undefined') {
          Calendly.initPopupWidget({
            url: 'https://calendly.com/brandon-conroy-truepro/30min'
          });
        }
        return false;
      });
    });

  });
</script>
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-ea11137 */<script>
document.addEventListener('DOMContentLoaded', function() {
  const menuToggle = document.getElementById('tp-menu-toggle');
  const mobileMenu = document.getElementById('tp-mobile-dropdown');
  const calendlyBtns = document.querySelectorAll('.tp-calendly-trigger');

  // Toggle Mobile Menu
  if(menuToggle) {
    menuToggle.addEventListener('click', () => {
      mobileMenu.classList.toggle('active');
    });
  }

  // Calendly Popup Logic
  calendlyBtns.forEach(btn => {
    btn.addEventListener('click', (e) => {
      e.preventDefault();
      Calendly.initPopupWidget({ url: 'https://calendly.com/brandon-conroy-truepro/30min' });
    });
  });
});
</script>/* End custom CSS */