.elementor-kit-5{--e-global-color-primary:#002238;--e-global-color-secondary:#006DD6;--e-global-color-text:#393939;--e-global-color-accent:#61CE70;--e-global-typography-primary-font-family:"Poppins";--e-global-typography-primary-font-weight:500;--e-global-typography-secondary-font-family:"Poppins";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Poppins";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Poppins";--e-global-typography-accent-font-weight:500;background-color:transparent;font-family:"Poppins", Sans-serif;background-image:linear-gradient(180deg, #FFFFFF 46%, #FFFFFFF7 57%);--e-page-transition-entrance-animation:e-page-transition-fade-out;--e-page-transition-exit-animation:e-page-transition-fade-in;--e-page-transition-animation-duration:1500ms;}.elementor-kit-5 e-page-transition{background-color:#FFBC7D;}.elementor-kit-5 a{font-family:"Poppins", Sans-serif;}.elementor-kit-5 h1{font-family:"Poppins", Sans-serif;}.elementor-kit-5 h2{font-family:"Poppins", Sans-serif;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1600px;}.e-con{--container-max-width:1600px;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS */<!-- Header / Navigation -->
<header class="site-header">
  <div class="container">
    <div class="logo">
      <a href="<?php echo home_url(); ?>">MyBrand</a>
    </div>
    <nav class="main-nav">
      <?php 
        wp_nav_menu( array(
          'theme_location' => 'primary',
          'container' => false,
          'menu_class' => 'menu',
        ));
      ?>
    </nav>
    <a href="/get-started" class="cta-btn">Free Trial</a>
    <div class="menu-toggle">&#9776;</div>
  </div>
</header>

<!-- Hero Section -->
<section class="hero">
  <video autoplay muted loop playsinline class="hero-bg">
    <source src="your-video.mp4" type="video/mp4">
  </video>
  <div class="overlay"></div>
  <div class="hero-content">
    <h1 class="animated-text">Boost Your Business with Modern Web Design</h1>
    <p>Attract more clients with professional, mobile-friendly websites that convert.</p>
    <div class="cta-group">
      <a href="/get-started" class="btn-primary">Get Started</a>
      <a href="/learn-more" class="btn-secondary">Learn More</a>
    </div>
    <div class="trust-bar">
      <span>⭐ Trusted by 2000+ Businesses</span>
      <span>⚡ 24/7 Support</span>
      <span>✅ Free 14-Day Trial</span>
    </div>
  </div>
  <div class="scroll-indicator">&#8595;</div>
</section>/* End custom CSS */