/*-------------- Hero Area Start  ---- --------*/
.hero-area {
    padding-top: 4rem;
    padding-bottom: 0rem; }
    @media (min-width: 87.5rem) and (max-width: 93.6875rem) {
      .hero-area {
        padding: 5rem; } }
    @media (max-width: 61.9375rem) {
      .hero-area {
        padding: 3.125rem 0;
        padding-top: 1.875rem; } }
    .hero-area .hero__left {
      position: relative; }
      .hero-area .hero__left .hero_shp {
        position: absolute;
        width: 2.8125rem;
        top: -3.125rem;
        left: 0; }
        @media (min-width: 48rem) and (max-width: 61.9375rem) {
          .hero-area .hero__left .hero_shp {
            width: 1.875rem;
            top: -2.5rem; } }
        @media only screen and (max-width: 47.9375rem) {
          .hero-area .hero__left .hero_shp {
            width: 1.875rem;
            top: -2.1875rem;
            margin-bottom: 0.9375rem; } }
      .hero-area .hero__left h1 {
        color: #231F20;
        font-size: 5.875rem;
        font-weight: 700;
        line-height: 103.75%;
        /*  */
        max-width: 43.75rem; }
        .hero-area .hero__left h1 span {
          color: #231F20;
          font-size: 2.5rem;
          font-weight: 400;
          line-height: 90%;
          margin-bottom: 0.9375rem;
          padding-top: 0.9375rem;
          display: block; }
          @media (min-width: 81.25rem) and (max-width: 87.4375rem) {
            .hero-area .hero__left h1 span {
              font-size: 2.25rem; } }
          @media (min-width: 75rem) and (max-width: 81.1875rem) {
            .hero-area .hero__left h1 span {
              font-size: 2rem; } }
          @media (min-width: 62rem) and (max-width: 74.9375rem) {
            .hero-area .hero__left h1 span {
              font-size: 1.75rem; } }
          @media (min-width: 48rem) and (max-width: 61.9375rem) {
            .hero-area .hero__left h1 span {
              font-size: 2rem; } }
          @media only screen and (max-width: 47.9375rem) {
            .hero-area .hero__left h1 span {
              font-size: 1.5rem;
              margin-bottom: 0.9375rem; } }
        .hero-area .hero__left h1 strong {
          color: #0351A3;
          font-weight: 700; }
        @media (min-width: 1600px) and (max-width: 1699px) {
          .hero-area .hero__left h1 {
            font-size: 5.625rem; } }
        @media (min-width: 93.75rem) and (max-width: 99.9375rem) {
          .hero-area .hero__left h1 {
            font-size: 5rem; } }
        @media (min-width: 87.5rem) and (max-width: 93.6875rem) {
          .hero-area .hero__left h1 {
            font-size: 4.6875rem; } }
        @media (min-width: 81.25rem) and (max-width: 87.4375rem) {
          .hero-area .hero__left h1 {
            font-size: 4.375rem; } }
        @media (min-width: 75rem) and (max-width: 81.1875rem) {
          .hero-area .hero__left h1 {
            font-size: 4.0625rem; } }
        @media (min-width: 62rem) and (max-width: 74.9375rem) {
          .hero-area .hero__left h1 {
            font-size: 3.75rem; } }
        @media (min-width: 48rem) and (max-width: 61.9375rem) {
          .hero-area .hero__left h1 {
            font-size: 4.375rem; } }
        @media only screen and (max-width: 47.9375rem) {
          .hero-area .hero__left h1 {
            font-size: 2.8125rem; } }
      .hero-area .hero__left p {
        color: #231F20;
        font-size: 1.375rem;
        font-weight: 400;
        line-height: 145.455%;
        max-width: 46.875rem;
        font-family: "Gantari", sans-serif; }
        @media (min-width: 1600px) and (max-width: 1699px) {
          .hero-area .hero__left p {
            font-size: 1.3125rem; } }
        @media (min-width: 93.75rem) and (max-width: 99.9375rem) {
          .hero-area .hero__left p {
            font-size: 1.25rem; } }
        @media (min-width: 87.5rem) and (max-width: 93.6875rem) {
          .hero-area .hero__left p {
            font-size: 1.1875rem; } }
        @media (min-width: 81.25rem) and (max-width: 87.4375rem) {
          .hero-area .hero__left p {
            font-size: 1.125rem; } }
        @media (min-width: 75rem) and (max-width: 81.1875rem) {
          .hero-area .hero__left p {
            font-size: 1.125rem; } }
        @media (min-width: 62rem) and (max-width: 74.9375rem) {
          .hero-area .hero__left p {
            font-size: 1.125rem; } }
        @media (min-width: 48rem) and (max-width: 61.9375rem) {
          .hero-area .hero__left p {
            font-size: 1.25rem; } }
        @media only screen and (max-width: 47.9375rem) {
          .hero-area .hero__left p {
            font-size: 1rem; } }
      .hero-area .hero__left .hero__btn {
        margin-top: 1.875rem; }
      @media (min-width: 48rem) and (max-width: 61.9375rem) {
        .hero-area .hero__left {
          margin-top: 6.25rem; } }
      @media only screen and (max-width: 47.9375rem) {
        .hero-area .hero__left {
          margin-top: 5rem; } }
    @media (max-width: 61.9375rem) {
      .hero-area .hero__right img {
        display: none; } }
    .hero-area .hero__tab_thumb {
      display: none; }
      @media (max-width: 61.9375rem) {
        .hero-area .hero__tab_thumb {
          display: block;
          margin-bottom: 3.125rem; } }
  
  .scroll-down-area {
    text-align: center; }
    .scroll-down-area .scroll__down a {
      display: inline-block; }
      .scroll-down-area .scroll__down a img {
        width: 6.875rem; }
        @media (min-width: 87.5rem) and (max-width: 93.6875rem) {
          .scroll-down-area .scroll__down a img {
            width: 5.625rem; } }
        @media (min-width: 81.25rem) and (max-width: 87.4375rem) {
          .scroll-down-area .scroll__down a img {
            width: 5rem; } }
        @media (min-width: 75rem) and (max-width: 81.1875rem) {
          .scroll-down-area .scroll__down a img {
            width: 5rem; } }
        @media (min-width: 62rem) and (max-width: 74.9375rem) {
          .scroll-down-area .scroll__down a img {
            width: 4.375rem; } }
        @media (min-width: 48rem) and (max-width: 61.9375rem) {
          .scroll-down-area .scroll__down a img {
            width: 5rem; } }
        @media only screen and (max-width: 47.9375rem) {
          .scroll-down-area .scroll__down a img {
            width: 5rem; } }
  
  /*-------------- Hero Area End  ---- --------*/

  @media (min-width: 87.5rem) and (max-width: 93.6875rem) {
    .hero-variation-12 {
      padding-top: 120px !important; } }
  
  .hero-variation-12 .hero__left {
    width: 100%; }
    .hero-variation-12 .hero__left .hero_shp {
      margin-top: -15px; }
      @media (min-width: 75rem) and (max-width: 81.1875rem) {
        .hero-variation-12 .hero__left .hero_shp {
          width: 34px;
          margin-top: -10px; } }
      @media (min-width: 62rem) and (max-width: 74.9375rem) {
        .hero-variation-12 .hero__left .hero_shp {
          width: 30px;
          margin-top: 0px; } }
    .hero-variation-12 .hero__left h1 {
      font-size: 72px;
      max-width: 100%;
      margin-bottom: 20px; 
      line-height: 97.75%;
}
      @media (min-width: 87.5rem) and (max-width: 93.6875rem) {
        .hero-variation-12 .hero__left h1 {
          font-size: 64px; } }
      @media (min-width: 81.25rem) and (max-width: 87.4375rem) {
        .hero-variation-12 .hero__left h1 {
          font-size: 62px; } }
      @media (min-width: 75rem) and (max-width: 81.1875rem) {
        .hero-variation-12 .hero__left h1 {
          font-size: 60px; } }
      @media (min-width: 62rem) and (max-width: 74.9375rem) {
        .hero-variation-12 .hero__left h1 {
          font-size: 50px; } }
      @media (min-width: 48rem) and (max-width: 61.9375rem) {
        .hero-variation-12 .hero__left h1 {
          font-size: 60px; }
          .hero-variation-12 .hero__left h1 strong {
            display: block; } }
      @media only screen and (max-width: 47.9375rem) {
        .hero-variation-12 .hero__left h1 {
          font-size: 40px; } }
    .hero-variation-12 .hero__left .hero__btn--group {
      display: flex;
      align-items: center;
      gap: 0 18px;
      margin-top: 50px; }
      @media (min-width: 75rem) and (max-width: 81.1875rem) {
        .hero-variation-12 .hero__left .hero__btn--group {
          margin-top: 40px; } }
      @media (min-width: 62rem) and (max-width: 74.9375rem) {
        .hero-variation-12 .hero__left .hero__btn--group {
          margin-top: 30px; } }
      @media only screen and (max-width: 47.9375rem) {
        .hero-variation-12 .hero__left .hero__btn--group {
          margin-top: 40px;
          justify-content: center;
          flex-wrap: wrap; } }
      .hero-variation-12 .hero__left .hero__btn--group .custom-btn {
        width: 334px; }
        @media (min-width: 81.25rem) and (max-width: 87.4375rem) {
          .hero-variation-12 .hero__left .hero__btn--group .custom-btn {
            width: 280px; } }
        @media (min-width: 75rem) and (max-width: 81.1875rem) {
          .hero-variation-12 .hero__left .hero__btn--group .custom-btn {
            width: 280px; } }
        @media (min-width: 62rem) and (max-width: 74.9375rem) {
          .hero-variation-12 .hero__left .hero__btn--group .custom-btn {
            width: 250px; } }
        @media (min-width: 48rem) and (max-width: 61.9375rem) {
          .hero-variation-12 .hero__left .hero__btn--group .custom-btn {
            width: 325px; } }
        @media only screen and (max-width: 47.9375rem) {
          .hero-variation-12 .hero__left .hero__btn--group .custom-btn {
            width: 100%; } }
      .hero-variation-12 .hero__left .hero__btn--group span {
        font-size: 20px;
        color: #231F20;
        font-weight: normal; }
        @media (min-width: 81.25rem) and (max-width: 87.4375rem) {
          .hero-variation-12 .hero__left .hero__btn--group span {
            font-size: 18px; } }
        @media (min-width: 75rem) and (max-width: 81.1875rem) {
          .hero-variation-12 .hero__left .hero__btn--group span {
            font-size: 18px; } }
        @media (min-width: 62rem) and (max-width: 74.9375rem) {
          .hero-variation-12 .hero__left .hero__btn--group span {
            font-size: 18px; } }
        @media (min-width: 48rem) and (max-width: 61.9375rem) {
          .hero-variation-12 .hero__left .hero__btn--group span {
            font-size: 20px; } }
        @media only screen and (max-width: 47.9375rem) {
          .hero-variation-12 .hero__left .hero__btn--group span {
            font-size: 20px;
            display: block;
            width: 100%;
            text-align: center;
            margin-top: 15px; } }
      @media only screen and (max-width: 47.9375rem) {
        .hero-variation-12 .hero__left .hero__btn--group .schedule-btn {
          width: 100%;
          margin-top: 15px; } }
      .hero-variation-12 .hero__left .hero__btn--group .schedule-btn a {
        display: inline-block;
        padding: 2px 2px;
        color: #3D393B;
        font-size: 22px;
        font-weight: bold;
        text-decoration: none;
        transition: .3s; }
        @media (min-width: 81.25rem) and (max-width: 87.4375rem) {
          .hero-variation-12 .hero__left .hero__btn--group .schedule-btn a {
            font-size: 20px; } }
        @media (min-width: 75rem) and (max-width: 81.1875rem) {
          .hero-variation-12 .hero__left .hero__btn--group .schedule-btn a {
            font-size: 18px; } }
        @media (min-width: 62rem) and (max-width: 74.9375rem) {
          .hero-variation-12 .hero__left .hero__btn--group .schedule-btn a {
            font-size: 16px; } }
        @media (min-width: 48rem) and (max-width: 61.9375rem) {
          .hero-variation-12 .hero__left .hero__btn--group .schedule-btn a {
            font-size: 20px; } }
        @media only screen and (max-width: 47.9375rem) {
          .hero-variation-12 .hero__left .hero__btn--group .schedule-btn a {
            font-size: 20px;
            display: block;
            text-align: center;
            width: 100%; } }
        .hero-variation-12 .hero__left .hero__btn--group .schedule-btn a:hover {
          color: #0351A3; }
        .hero-variation-12 .hero__left .hero__btn--group .schedule-btn a:focus {
          color: #0351A3; }
        .hero-variation-12 .hero__left .hero__btn--group .schedule-btn a:active {
          color: #0351A3; }
    @media only screen and (max-width: 47.9375rem) {
      .hero-variation-12 .hero__left .client__setisfied-wrap {
        display: none; } }
  
  .hero-variation-12 .hero__right img {
    display: block !important; }

    .client__setisfied-wrap .client__setisfied {
        display: flex;
        align-items: center;
        gap: 0 20px;
        margin-top: 60px;
        margin-bottom: 10px; }
        @media (min-width: 75rem) and (max-width: 81.1875rem) {
          .client__setisfied-wrap .client__setisfied {
            margin-top: 45px; } }
        @media (min-width: 62rem) and (max-width: 74.9375rem) {
          .client__setisfied-wrap .client__setisfied {
            margin-top: 35px; } }
        .client__setisfied-wrap .client__setisfied .reviewed__clients {
          padding-left: 30px; }
          .client__setisfied-wrap .client__setisfied .reviewed__clients ul {
            margin: 0;
            padding: 0;
            list-style: none; }
            .client__setisfied-wrap .client__setisfied .reviewed__clients ul li {
              display: inline-block;
              margin-left: -30px; }
              .client__setisfied-wrap .client__setisfied .reviewed__clients ul li img {
                width: 50px;
                height: 50px;
                border-radius: 100%;
                border: 2px solid #fff; }
                @media (min-width: 75rem) and (max-width: 81.1875rem) {
                  .client__setisfied-wrap .client__setisfied .reviewed__clients ul li img {
                    width: 45px;
                    height: 45px; } }
        .client__setisfied-wrap .client__setisfied .review__stars ul {
          display: flex;
          align-items: center;
          gap: 0 8px; }
          .client__setisfied-wrap .client__setisfied .review__stars ul li {
            display: inline; }
            .client__setisfied-wrap .client__setisfied .review__stars ul li img {
              width: 24px; }
              @media (min-width: 75rem) and (max-width: 81.1875rem) {
                .client__setisfied-wrap .client__setisfied .review__stars ul li img {
                  width: 20px; } }
      
      .client__setisfied-wrap p {
        font-size: 22px;
        color: #3D393B;
        font-weight: normal;
        margin: 0; }