@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Sora:wght@100..800&display=swap');

body {
   font-family: "Poppins", sans-serif;
   font-weight: normal;
   color: #424A4D;
   font-size: 1rem;
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
   font-family: "Sora", sans-serif;
   font-weight: 600;
}

a {
   color: #0C121D;
}

b, strong {
   font-weight: 600;
}

/* Typography */
.text-dark {
   color: #0C121D !important;
}

.text-danger {
   color: #FF0201 !important;
}

.text-gradient {
   color: var(--bs-navbar-active-color);
   background: linear-gradient(90deg, #FF7802 0%, #FF0201 100%);
   background-clip: text;
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
}

.mt-48 {
   margin-top: 48px;
}

.mb-48 {
   margin-bottom: 48px;
}

.mb-5 {
   margin-bottom: 2rem !important;
}

.mt-5 {
   margin-top: 2rem !important;
}

.rounded-5 {
   border-radius: 1.5rem !important;
}

@media (min-width: 1200px) {
   .h1, h1 {
      font-size: 2.625rem;
   }

   .h3, h3 {
      font-size: 2rem;
   }

   .h4, h4 {
      font-size: 1.5rem;
   }
}

.px-5 {
   padding-right: 2rem !important;
   padding-left: 2rem !important;
}

.p-5 {
   padding: 2rem !important;
}

.shadow-sm {
   box-shadow: 0 0.75rem 0.875rem rgba(0, 0, 0, 0.075) !important;
}

.ps-64 {
   padding-left: 4rem;
}

.lead {
   font-size: 1.125rem;
   font-weight: 400;
}

.text-15 {
   font-size: 0.9375rem;
}

.text-14 {
   font-size: 0.875rem;
}

.text-13 {
   font-size: 0.8125rem;
}

.text-12 {
   font-size: 0.75rem !important;
}

hr {
   color: #E6ECF1;
   opacity: 1;
}

/* Button CSS */
.btn-primary {
   background: rgb(255, 120, 2);
   background: linear-gradient(145deg, rgba(255, 120, 2, 1) 0%, rgba(255, 2, 1, 1) 100%);
   border: 0;
}

.btn {
   padding: 0.733rem 1.5rem;
   font-weight: 600;
   text-transform: uppercase;
}

.btn-lg {
   padding: 1rem 1rem;
   font-size: 1rem;
}

.btn-light, .btn-light:hover, .btn-light:focus, .btn:first-child:active {
   background-color: #ffffff;
   border: transparent;
}

.btn-light span {
   color: var(--bs-navbar-active-color);
   background: linear-gradient(90deg, #FF7802 0%, #FF0201 100%);
   background-clip: text;
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
}


/* Landing Page CSS */
.navbar{
   padding-left: 100px;
   padding-right: 100px;
}
.navbar-brand {
   padding-top: 0;
   padding-bottom: 0;
}

.navbar-brand img {
   width: 122px;
}

.hero-section {
   background: #FF7802;
   background: linear-gradient(180deg, rgba(255, 120, 2, 0.1) 0%, rgba(255, 2, 1, 0.09) 50%, rgba(255, 255, 255, 1) 100%);
   padding: 94px 0;
}

.hero-section h1 {
   font-size: 3.25rem;
}

.G2-five-star-review {
   margin-top: 64px;
}

.G2-review-logo {
   display: flex;
   justify-content: center;
   flex-wrap: wrap;
   gap: 10px;
}

.G2-review-logo img {
   width: 80px;
}


.timeline-card .card-body {
   padding-left: 56px !important;
   padding-bottom: 22px !important;
}

.timeline-card::before {
   content: '';
   width: 24px;
   height: 24px;
   background: rgb(255, 120, 2) !important;
   background: -moz-linear-gradient(145deg, rgba(255, 120, 2, 1) 0%, rgba(255, 2, 1, 1) 100%) !important;
   background: -webkit-linear-gradient(145deg, rgba(255, 120, 2, 1) 0%, rgba(255, 2, 1, 1) 100%) !important;
   background: linear-gradient(145deg, rgba(255, 120, 2, 1) 0%, rgba(255, 2, 1, 1) 100%) !important;
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff7802", endColorstr="#ff0201", GradientType=1) !important;
   position: absolute;
   top: 0;
   z-index: 1;
   border-radius: 50px;
}

.timeline-card::after {
   content: '';
   border: dashed 1px #0C121D;
   height: 100%;
   position: absolute;
   top: 0;
   left: 12px;
}


ul.check-list-secondary, .plan-list {
   margin: 0;
   padding: 0;
   list-style: none;
}

ul.check-list-secondary li {
   position: relative;
   font-size: 0.875rem;
   border-bottom: solid 1px #E3E6E7;
   padding-left: 42px;
   padding-top: 8px;
   padding-bottom: 8px;
   color: #0C121D;
   font-weight: 400;
}

ul.check-list-secondary li:last-child {
   border: 0;
}

ul.check-list-secondary li::before {
   content: '';
   background-image: url(../images/check-circle-solid.svg);
   width: 20px;
   height: 20px;
   position: absolute;
   left: 0;
   background-size: cover;
}

@media (min-width: 1400px) {
   .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
      max-width: 1280px;
   }
}

.section {
   padding: 48px 0;
}

.section h2 {
   margin-bottom: 3rem;
   /*48px*/
}

.bg-gradient {
   background: rgb(255, 120, 2) !important;
   background: -moz-linear-gradient(145deg, rgba(255, 120, 2, 1) 0%, rgba(255, 2, 1, 1) 100%) !important;
   background: -webkit-linear-gradient(145deg, rgba(255, 120, 2, 1) 0%, rgba(255, 2, 1, 1) 100%) !important;
   background: linear-gradient(145deg, rgba(255, 120, 2, 1) 0%, rgba(255, 2, 1, 1) 100%) !important;
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff7802", endColorstr="#ff0201", GradientType=1) !important;
}

.btn-circle {
   width: 48px;
   height: 48px;
   align-items: center;
   text-align: center;
   justify-content: center;
   display: flex;
}

.card-plan-details {
   background-color: #f6f6f6 !important;
   border-radius: 20px;
}

.card-plan-details .card-body {
   padding: 40px;
}

.plan-table {
   margin-top: 64px;
}

ul.plan-list {
   padding: 8px 0;
}

ul.plan-list li {
   position: relative;
   border-bottom: solid 1px #E3E6E7;
   padding-top: 18px;
   padding-bottom: 18px;
   color: #0C121D;
   font-size: 0.875rem;
}

ul.plan-name {
   margin-top: 100px;
}

ul.plan-name li {
   padding: 16px 0 17px 0;
}

.maestro-plan ul li:first-child, ul.others-plan li:first-child {
   border: 0;
}

.maestro-plan ul li:last-child, ul.others-plan li:last-child {
   border: 0;
}

ul.plan-name li {
   font-size: 1rem;
}

.maestro-plan {
   background: rgb(255, 120, 2) !important;
   background: -moz-linear-gradient(145deg, rgba(255, 120, 2, 1) 0%, rgba(255, 2, 1, 1) 100%) !important;
   background: -webkit-linear-gradient(145deg, rgba(255, 120, 2, 1) 0%, rgba(255, 2, 1, 1) 100%) !important;
   background: linear-gradient(145deg, rgba(255, 120, 2, 1) 0%, rgba(255, 2, 1, 1) 100%) !important;
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff7802", endColorstr="#ff0201", GradientType=1) !important;
   border-radius: 10px;
   padding: 1px;
}

.maestro-plan ul {
   background-color: #fff;
   width: 100%;
   height: 100%;
   border-radius: 10px;
}

.maestro-plan ul li {
   padding-top: 10px;
   padding-bottom: 11px;
}

.maestro-plan ul li b {
   font-size: 24px;
}

.maestro-plan ul li:first-child {
   padding-top: 16px;
   padding-bottom: 0;
}

.compare-plans {
   position: relative;
}

.compare-plans h2.h1.compare-plans-heading{
   font-size: 3.25rem;
}

.compare-plans::before {
   content: '';
   background: url('../images/maestro-icon.svg') no-repeat;
   height: 465px;
   display: block;
   position: absolute;
   top: -110px;
   right: 0;
   width: 355px;
}

.pricing-plan {
   margin: 60px 0;
   background-color: #fff;
   padding: 40px;
   border-radius: 10px;
}

.pricing-content {
   text-align: center;
}

/* Plan Features Styles */
.plan-features {
   margin-bottom: 40px;
}

.plan-features h3 {
   margin-bottom: 20px;
   font-size: 1.5em;
   color: #555;
}

.plan-features ul {
   display: flex;
   justify-content: center;
   list-style-type: none;
   gap: 20px;
   flex-wrap: wrap;
}

.plan-features li {
   background-color: #f0f4f8;
   padding: 10px 20px;
   border-radius: 5px;
   font-size: 0.95em;
   color: #555;
}

/* Plan Option Styles */
.plan-option {
   margin-bottom: 20px;
   display: flex;
   justify-content: center;
   align-items: center;
   gap: 10px;
}

/* Toggle Switch Styles */
.switch-wrapper {
   position: relative;
   display: inline-block;
   width: 36px;
   height: 18px;
}

/* Hide the checkbox */
#billing-toggle {
   display: none;
}

/* Slider Styles */
.switch-wrapper .slider {
   position: absolute;
   cursor: pointer;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background-color: #D9D9D9;
   transition: 0.4s;
   border-radius: 34px;
}

.switch-wrapper .slider:before {
   position: absolute;
   content: "";
   height: 14px;
   width: 14px;
   left: 2px;
   bottom: 2px;
   background-color: white;
   transition: 0.4s;
   border-radius: 50%;
}

/* Change background color when checked */
#billing-toggle:checked+.switch-wrapper .slider {
   background: rgb(255, 120, 2) !important;
   background: -moz-linear-gradient(145deg, rgba(255, 120, 2, 1) 0%, rgba(255, 2, 1, 1) 100%) !important;
   background: -webkit-linear-gradient(145deg, rgba(255, 120, 2, 1) 0%, rgba(255, 2, 1, 1) 100%) !important;
   background: linear-gradient(145deg, rgba(255, 120, 2, 1) 0%, rgba(255, 2, 1, 1) 100%) !important;
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff7802", endColorstr="#ff0201", GradientType=1) !important;
}

/* Move the slider when checked */
#billing-toggle:checked+.switch-wrapper .slider:before {
   transform: translateX(18px);
}

/* Labels for Switch */
.billing-labels {
   display: flex;
   justify-content: center;
   align-items: center;
   gap: 10px;
   font-size: 0.875rem;
}

.billing-labels span {
   user-select: none;
}

.yearly-price {
   display: none;
}

/* Footer CSS */
.footer {
   border-top: solid 1px #E6ECF1;
   padding: 48px 0 48px;
}

/* Responsive css */
@media (min-width: 768px) and (max-width: 991.98px) {
   .navbar{
      padding-left: 15px;
      padding-right: 15px;
   }

   .compare-plans::before {
      height: 205px;
      width: 155px;
      top: 555px;
      background-size: cover;
      z-index: -1;
   }

   .G2-review-logo img {
      width: 62px;
   }
   
   .card-plan-details {
      background-color: #f6f6f6 !important;
      border-radius: 20px;
      margin-top: 24px;
  }
  
}

@media (min-width: 991px) and (max-width: 1199.98px) {
   .navbar{
      padding-left: 15px;
      padding-right: 15px;
   }
   .compare-plans::before {
      height: 305px;
      width: 225px;
      position: absolute;
      top: -60px;
      background-size: cover;
      z-index: -1;
   }

   ul.plan-name li {
      font-size: 0.875rem;
   }

   ul.others-plan li {
      font-size: 0.75rem;
   }

   .maestro-plan ul li b {
      font-size: 22px;
   }
}

@media (min-width: 768px) {
   .container, .container-md, .container-sm {
      max-width: 750px;
   }

   .footer-menu li:first-child a {
      padding-top: 0;
   }

   ul.others-plan {
      margin-top: 41px;
   }
}

@media (max-width: 575.98px) {
   .product-price {
      flex-wrap: wrap;
      justify-content: center;
   }

   .product-price .btn {
      margin-top: 10px;
   }
   .global-contractor .lead{
      padding: 0 30px;
   }

}


@media (max-width: 991.98px) {
   .hero-section h1,   .compare-plans h2.h1.compare-plans-heading{
      font-size: 2.225rem;
   }

   .section {
      padding: 40px 0;
   }
}


@media (max-width: 1199.98px) {
   body {
      font-size: 14px;
   }

   .h1, h1 {
      font-size: 2rem;
   }

   .h3, h3 {
      font-size: 1.5rem;
   }

   .h5, h5 {
      font-size: 1.125rem;
   }

   .lead {
      font-size: 1rem;
   }
}

@media (max-width: 767.98px) {
   .navbar-brand img {
      width: 112px;
   }

   /* Inner Page CS */
   .award-winning-platform .G2-review-logo img {
      width: 48px;
   }

   .hero-section h1, .compare-plans h2.h1.compare-plans-heading {
      font-size: 1.875rem;
   }


   .h1, h1 {
      font-size: 1.5rem;
   }

   .h5, h5 {
      font-size: 1rem;
   }

   .lead {
      font-size: 0.875rem;
   }

   .btn-book-demo {
      padding: 0.5rem 1rem;
      font-weight: 600;
      font-size: 0.875rem;
   }

   .btn-book-demo svg {
      width: 20px;
   }

   .section h2 {
      margin-bottom: 2rem;
   }

   .hero-section {
      padding: 94px 0 48px 0;
   }

   .global-contractor .img-fluid {
      width: 70%;
      margin: 0 auto 1.5rem auto;
      display: block;
   }

   .btn-lg {
      padding: 0.75rem 1.5rem;
      font-size: 0.875rem;
   }

   .G2-review-logo img {
      width: 48px;
   }

   .section {
      padding-bottom: 0;
   }

   .product-price {
      margin-bottom: 32px;
   }

   .product-price .h1, .product-price h3 {
      font-size: 2rem !important;
   }

   ul.check-list-secondary li::before {
      width: 20px;
      height: 20px;
      background-size: 100%;
      top: 10px;
   }

   .get-started-price img.img-fluid {
      width: 70%;
      margin: 0 auto;
      display: block;
   }

   .mb-48 {
      margin-bottom: 24px;
   }

   .heading {
      font-size: 1.625rem;
   }

   .compare-plans::before {
      display: none;
   }

   .plan-table {
      margin-top: 48px;
   }

   .navbar{
      padding-left: 0px;
      padding-right: 0px;
   }

   .footer {
      padding: 4rem 0;
      margin-top: 48px;
   }


}


@media (min-width: 992px) {
   .container, .container-lg, .container-md, .container-sm {
      max-width: 960px;
   }
}

@media (min-width: 1200px) {
   .container, .container-lg, .container-md, .container-sm, .container-xl {
      max-width: 1180px;
   }

   .row {
      --bs-gutter-x: 2.5rem;
   }

   .row>* {
      --bs-gutter-x: 2.5rem;
   }
}

@media (min-width: 1340px) {
   .container, .container-lg, .container-md, .container-sm, .container-xl {
      max-width: 1310px;
   }

}