import { Component } from '@angular/core';
import { RouterLink } from '@angular/router';
import { CountUpModule } from 'ngx-countup';

@Component({
  selector: 'app-hero',
  host: { 'app-hero': 'app-single-hero8' },
  imports: [CountUpModule,RouterLink],
  template: `
    <div
      class="main-hero main-hero5 _relative"
      style="background-color: #E9EDF4;"
    >
      <div class="container">
        <div class="row align-items-center">
          <div class="col-lg-6 col-md-12 _relative">
            <div class="main-hadding8">
              <span>Welcome to Advisor</span>
              <div class="space16"></div>
              <h1>Cultivate your brand and expand your business</h1>
              <div class="space24"></div>
              <p>
                Your Partner in Achieving Sustainable Growth and Success,Unlock
                Your <br />
                Potential and Drive Growth. We help business to perform
              </p>
              <div class="space40"></div>
              <div class="header2-buttons">
                <a [routerLink]="[]" class="theme-btn10">Unlock Your Potential</a>
                <a [routerLink]="[]" class="theme-btn11">Learn More</a>
              </div>
            </div>
          </div>

          <div class="col-lg-6">
            <div class="hero8-images">
              <div class="hero8-img1 aniamtion-key-1">
                <img src="assets/img/shapes/hero8-shape1.svg" alt="" />
              </div>
              <div class="hero8-img2">
                <img src="assets/img/shapes/hero8-shape2.svg" alt="" />
              </div>
              <div class="hero8-img3">
                <img src="assets/img/image/hero8-main-img.png" alt="" />
              </div>

              <div class="hero8-counter-box hero8-counter-box1">
                <h1><span class="counter" [countUp]="16" [options]="{ suffix : '+'}"></span></h1>
                <div class="space8"></div>
                <p>Years of Experience</p>
              </div>

              <div class="hero8-counter-box hero8-counter-box2">
                <h1><span class="counter" [countUp]="95" [options]="{ suffix : '+'}"></span></h1>
                <div class="space8"></div>
                <p>Return on Investment</p>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  `,
  styles: ``,
})
export class HeroComponent {}
