@import url('https://fonts.googleapis.com/css2?family=Onest:wght@100..900&display=swap');

 .bg-body {
        background-color: #1a1a1a !important;
      }
      .banner h1 {
        font-size: 96px;
        font-family: "SugarPeachy";
        width: 860px;
        margin: 0 auto;
      }
      .gap-lg-3 {
        gap: 20px !important;
      }
      span.circle {
        background-image: url(./image/circle.svg);
        background-size: contain;
        background-repeat: no-repeat;
      }
      body a.nav-link:before {
        content: "";
        transition: 0.2s all ease;
        position: absolute;
        left: 13px;
        border: 1px solid #787878;
        width: 8px;
        height: 8px;
        border-radius: 100%;
        top: 50%;
        transform: translate(-50%, -50%);
      }
      .login a,
      .sign-up a {
        text-transform: uppercase;
      }
      .login a {
        color: #1a1a1a;
      }
      li.nav-item.login {
        margin-left: 65px;
      }
      li.nav-item.sign-up a {
        background-color: #1a1a1a;
        border: 1px solid #e5e5e5;
        color: #fff;
      }
      .banner .container {
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
      }
      img.top {
        position: absolute;
        right: 0px;
        top: 0;
      }
      img.bottom {
        position: absolute;
        left: 0;
        bottom: -270px;
        max-width: 55%;
        z-index: -1;
      }
      .banner {
        padding: 230px 0 175px;
        margin-top: -80px;
        background-color: #fafafa;
      }
      li.nav-item.sign-up a:hover {
        border: 1px solid #1a1a1a;
        color: #fff;
        background-color: #1a1a1a;
      }
      body a.nav-link {
        border: 1px solid #e5e5e5;
        border-radius: 100px;
        padding-left: 22px !important;
        color: #787878;
        padding-right: 14px !important;
        position: relative;
        padding-top: 5px !important;
        padding-bottom: 5px !important;
        font-size: 16px;
        font-family: "Quicksand";
        font-weight: 500;
      }

      @font-face {
        font-family: "SugarPeachy";
        src: url("./fonts/SugarPeachy.woff") format("woff"),
          url("./fonts/SugarPeachy.ttf") format("truetype");
        font-weight: 900;
        font-style: normal;
        font-display: swap;
      }
      .container,
      .container-lg,
      .container-md,
      .container-sm,
      .container-xl,
      .container-xxl {
        max-width: 1240px;
      }
      /* Global Custom Styles */
      :root {
        --primary-purple: #6f42c1;

        --dark-bg: #000;
        --light-subtle: #f8f9fa;
        --purple-subtle: #e2d9f3;
      }

      body {
        font-family: "Quicksand", sans-serif;
        line-height: 1.6;
      }

      .fc-logo {
        padding: 0.25rem 0.5rem;
      }

      .fc-logo-lg {
        font-size: 1.5rem;
        padding: 0.5rem 0.75rem;
      }

      /* Hero Section */
      .hero-bg {
        background: linear-gradient(135deg, var(--dark-bg) 0%, #1a1a1a 100%);
        color: white;
        position: relative;
      }

      .hero-bg::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><circle cx="20" cy="20" r="2" fill="%236f42c1" opacity="0.1"/><circle cx="80" cy="40" r="1.5" fill="%236f42c1" opacity="0.1"/><circle cx="50" cy="80" r="2.5" fill="%236f42c1" opacity="0.1"/></svg>')
          repeat;
        opacity: 0.5;
      }

      .hero-bg h1 {
        color: white;
        text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
      }

      .hero-bg .lead {
        color: #adb5bd;
      }

      .avatar {
        width: 40px;
        height: 40px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1.5rem;
      }

      .mini.stat {
        background: var(--purple-subtle);
        border: 1px solid #d9d9d9;
      }

      .mini.stat .h4 {
        color: var(--primary-purple);
        font-weight: bold;
      }

      /* Three Steps */

      .step-number {
        position: relative;
        background: #fff;
        color: #1a1a1a;
        width: 80px;
        font-size: 48px;
        height: 80px;
        border-radius: 100px;
        font-family: "SugarPeachy" !important;
        display: flex;
        align-items: center;
        justify-content: center;
      }
      .step-card h5 {
        color: var(--dark-bg);
      }

      /* Why Section */
      .tag {
        background: var(--primary-purple);
        color: white;
        padding: 0.5rem 1rem;
        border-radius: 20px;
        font-size: 0.875rem;
        font-weight: 500;
      }

      /* Features */
      .feature {
        background: white;
        border: 1px solid #e9ecef;
        transition: transform 0.3s ease, box-shadow 0.3s ease;
      }

      .feature:hover {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
      }

      .feature i {
        color: var(--primary-purple);
      }

      .feature h6 {
        color: var(--dark-bg);
      }

      /* Pricing */
      .bg-section {
        background: var(--light-subtle);
      }

      .premium {
        position: relative;
      }
section.login-page .row .button-set .row{
    height: auto !important;
    text-align: center;
    width: 100%;
    max-width: 415px;
}
      .premium::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 4px;
        background: var(--primary-purple);
      }

      .premium h4 {
        color: var(--primary-purple);
      }

      /* CTA */
      .bg-dark {
        background: var(--dark-bg) !important;
      }

      .bg-dark h3 {
        color: white;
      }

      /* Banner CTA */
      .banner-cta {
        background: var(--light-subtle);
      }

      /* FAQ */
      .accordion-button {
        background: white;
        border: 1px solid #e9ecef;
        font-weight: 500;
      }

      .accordion-button:not(.collapsed) {
        background: var(--purple-subtle);
        color: var(--primary-purple);
      }

      .accordion-item {
        border: none;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
      }

      /* Footer */
      footer {
        background: white;
      }

      /* Responsive Adjustments */
      @media (max-width: 1440px) {
        .container {
          max-width: 1200px;
        }
      }

      @media (max-width: 768px) {
        body a.nav-link {
          width: max-content;
        }
        li.nav-item.login {
          ul.navbar-nav {
            padding: 12px 12px 30px;
          }
          margin-left: 0px;
        }
        .hero-card {
          margin-top: 2rem;
        }

        .d-flex.flex-wrap.gap-2 .tag {
          font-size: 0.75rem;
          padding: 0.375rem 0.75rem;
        }

        .feature i {
          font-size: 2rem;
        }
      }

      /* Line Height Tight for Headings */
      .lh-tight {
        line-height: 1.2;
      }

      .img-set {
        width: 100%;
        max-width: 1240px;
        position: relative;
      }
      img.two {
        position: absolute;
        right: -170px;
        top: 200px;
      }

      img.star_rgt_one {
        position: absolute;
        right: -170px;
        top: 60px;
        animation: blink 2s infinite;
        display: inline-block;
        animation: blink 1s infinite;
      }
      img.one {
        position: absolute;
        right: -120px;
        bottom: -570px;
      }

      img.star_rgt_two {
        position: absolute;
        right: 10px;
        bottom: -400px;
        display: inline-block;
        animation: blink 1s infinite;
      }
      img.sticker {
        position: absolute;
        right: 0;
        top: -70px;
      }
      img.four {
        position: absolute;
        left: -130px;
        top: 120px;
      }
      img.three {
        position: absolute;
        left: 200px;
        top: -100px;
      }

      img.star_one {
        position: absolute;
        left: 30px;
        top: 0px;
        display: inline-block;
        animation: blink 1s infinite;
      }
      .banner p {
        font-size: 24px;
        color: #1e1e1e;
        font-weight: 500;
        margin-bottom: 75px;
      }
      img.five {
        position: absolute;
        left: 0;
        top: 550px;
      }
      img.star_left_two {
        position: absolute;
        left: -150px;
        top: 460px;
        display: inline-block;
        animation: blink 1s infinite;
      }
      img.sticker_two {
        position: absolute;
        left: -190px;
        top: 310px;
      }

      /* Blinking (Fade In/Out) */
      @keyframes blink {
        0%,
        100% {
          opacity: 1;
        }
        50% {
          opacity: 0;
        }
      }

      .banner a {
        transition: 0.2s all ease;
        background: #2c2c2c;
        color: #fff;
        text-decoration: none;
        padding: 20px 87px;
        font-size: 26px;
        font-weight: bold;
        border: 1.5px solid var(--Black, #1a1a1a);
        border-radius: 100px;
        background: linear-gradient(
            88deg,
            #000 43.71%,
            rgba(157, 157, 157, 0) 71.33%
          ),
          linear-gradient(
            0deg,
            rgba(255, 255, 255, 0.06) 0%,
            rgba(255, 255, 255, 0.06) 100%
          ),
          #2c2c2c;
        /* background-blend-mode: lighten, normal, normal; */
        box-shadow: 0 10px 0 0 rgba(44, 44, 44, 0.8);
        display: inline-block;
        transition: transform 0.3s ease, box-shadow 0.3s ease; /* Smooth effect */
      }
      span.badge {
        border: 1px solid #787878 !important;
        border-radius: 100px;
        padding-left: 35px !important;
        color: #fff;
        padding-right: 20px !important;
        position: relative;
        padding-top: 10px !important;
        padding-bottom: 10px !important;
        font-size: 16px;
        font-family: "Onest", sans-serif;
        text-transform: uppercase;
        font-weight: 500;
        font-weight: 500;
        background-color: transparent;
      }

      span.badge:before {
        content: "";
        transition: 0.2s all ease;
        position: absolute;
        left: 20px;
        background-color: #fff;
        border: 1px solid #787878;
        width: 8px;
        height: 8px;
        border-radius: 100%;
        top: 50%;
        transform: translate(-50%, -50%);
      }
      .how-it-works {
        background: #1a1a1a;
        padding: 157px 15px 115px 15px;
      }
      img.sparkle {
        position: absolute;
        right: -29px;
        max-width: 8%;
        top: -48px;
      }
      .banner a:hover {
        border-radius: 56px;
        border: 1.5px solid var(--Black, #1a1a1a);
        background: linear-gradient(
            88deg,
            #bb8ef0 45.5%,
            rgba(255, 255, 255, 0) 74.69%
          ),
          linear-gradient(88deg, #bb8ef0 45.18%, rgba(255, 255, 255, 0) 71.88%),
          linear-gradient(
            0deg,
            rgba(255, 255, 255, 0.06) 0%,
            rgba(255, 255, 255, 0.06) 100%
          ),
          #c097f0;
        /* background-blend-mode: lighten, lighten, normal, normal; */
        box-shadow: 0 13px 0 0 #c097f0;
        color: #1a1a1a;
        transform: rotate(-4deg) translate(4px, -4px); /* Rotates slightly counter-clockwise & moves up-right */
        transform-origin: bottom left; /* Pivot point for rotation */
      }
      body a.nav-link:hover {
        color: #1a1a1a;
      }
      body a.nav-link:hover::before {
        background-color: #1a1a1a;
      }
      .how-it-works p {
        font-size: 20px;
        color: #e5e5e5;
      }
      .how-it-works h2 {
        font-size: 64px;
        font-family: "SugarPeachy";
        width: 860px;
        margin: 0 auto;
        color: #fff;
      }
      .text-center {
        width: 100%;
        max-width: 860px;
        margin: 0 auto;
      }
      .how-it-works p {
        font-size: 20px;
        color: #e5e5e5;
        margin-top: 15px;
        margin-bottom: 50px;
      }
      .step-card {
        border-radius: 50%;
        width: 475px;
        height: 475px;
        display: flex;
        border: 5px solid #1a1a1a;
        padding: 20px 25px;
        text-align: center;
        align-items: center;
        justify-content: center;
        flex-direction: column;
      }
      .how-it-works .container:before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        background: #fff;
        width: 1px;
        height: 65%;
        z-index: 0;
      }
      .how-it-works .container {
        border-top: 1.5px solid #fff;
        padding-top: 75px;
        z-index: 0;
        position: relative;
      }
      .how-it-works .container:after {
        content: "";
        position: absolute;
        right: 0;
        top: 0;
        background: #fff;
        width: 1px;
        height: 65%;
      }
      .step-card.first {
        margin-left: -50px;
        background: #c097f0;
        background-image: url("./image/card-bg.svg");
        background-repeat: no-repeat;
        background-position: top center;
        background-size: auto;
      }
      .step-card.second {
        margin-left: -50px;
        background: #f6eeff;
        background-image: url("./image/card-bg-two.svg");
        background-repeat: no-repeat;
        background-position: top center;
        background-size: auto;
      }
      .step-card.third {
        margin-left: -30px;
        background: #fff;
        background-image: url("./image/card-bg-three.svg");
        background-repeat: no-repeat;
        background-position: top center;
        background-size: auto;
      }
      .step-card.first h5 {
        margin: 0;
        font-size: 40px;
        font-family: "SugarPeachy";
        color: #fff;
      }
      .step-card.first p {
        margin: 10px;
        color: #f6eeff !important;
        font-size: 18px;
        font-weight: 500;
      }
      .step-card.second p {
        margin: 10px;
        color: #1a1a1a !important;
        font-weight: 500;
        font-size: 18px;
      }
      .step-card.third p {
        margin: 10px;
        color: #1a1a1a !important;
        font-weight: 500;
        font-size: 18px;
      }
      .step-card.second h5 {
        font-size: 40px;
        font-family: "SugarPeachy";
        color: #1a1a1a;
      }
      .step-card.third h5 {
        font-size: 40px;
        font-family: "SugarPeachy";
        color: #1a1a1a;
      }
      img.left-cross {
        position: absolute;
        top: 0;
        left: 0;
      }
      img.right-cross {
        position: absolute;
        right: -180px;
        bottom: -290px;
        z-index: 0;
      }
      img.leaf-left {
        position: relative;
        left: -20px;
        top: 30px;
      }
      img.leaf-right {
        position: absolute;
        right: -40px;
      }
      .row.g-4.step-cards {
        z-index: 1;
        position: relative;
      }
      .why-us h1 {
        font-size: 2.5em;
        font-weight: bold;
        color: #333;
      }
      .why-us p {
        color: #2c2c2c;
      }
      .why-us ul li {
        color: #333;
        position: relative;
        padding-left: 20px;
      }
      section.why-us {
        padding: 115px 50px;
        border-bottom-left-radius: 100px;
        border-bottom-right-radius: 100px;
        background-color: #fafafa;
      }
      .why-us span {
        background: #c097f0;
        font-size: 20px;
        font-weight: 500;
        display: inline-block;
        color: #fff;
        border-radius: 100px;
        transform: rotate(359deg);
        padding: 0 10px;
      }
      .challenges {
        background: #f6eeff;
        border-radius: 10px;
        padding: 35px;
      }

      .challenges ul li:nth-child(5):after {
        content: "😕";
        margin-left: 5px;
      }
      .btn-custom {
        background: #9370db;
        color: white;
        border: none;
        border-radius: 25px;
      }
      .btn-outline-custom {
        background: #d8bfd8;
        color: #333;
        border: 1px solid #9370db;
        border-radius: 25px;
      }
      .why-us span.badge {
        background: transparent;
        padding: 2px 5px;
        border-radius: 5px;
        color: #333;
      }
      .why-us span.badge:before {
        content: "";
        transition: 0.2s all ease;
        position: absolute;
        left: 20px;
        background-color: #c097f0;
        border: 1px solid #c097f0;
        width: 8px;
        height: 8px;
        border-radius: 100%;
        top: 50%;
        transform: translate(-50%, -50%);
      }
      .comn-text p {
        font-size: 20px;
      }

      section.why-us h2 {
        color: #1a1a1a;
        font-size: 64px;
        font-family: "SugarPeachy";
        margin: 15px auto 35px;
      }

      .why-us ul.check li {
        position: relative;
        padding-left: 25px; /* add space for the icon */
        list-style: none; /* hide default bullets */
      }

      .why-us ul.check li:before {
        content: "";
        position: absolute;
        left: 0;
        top: 14px;
        width: 16px; /* adjust size as needed */
        height: 16px;
        background-image: url("./image/tick.svg");
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        transform: translateY(-50%);
      }
      a.get-started {
        background: #1a1a1a;
        color: #fff;
        padding: 14px 40px;
        font-size: 20px;
        text-transform: uppercase;
        text-decoration: none;
        border-radius: 100px;
        margin-top: 35px;
	font-weight:500;
        display: inline-block;
        font-family: "Quicksand";
      }
      li.bg-w {
        background: #fff;
      }
      li.trp-border {
        border: 1px solid #787878;
      }
      .challenges ul li {
        border-radius: 12px;
        font-size: 24px;
        font-family: "SugarPeachy";
        padding: 15px;
      }
      body li.bg-purple {
        background: #c097f0;
        color: #fff;
      }
      .challenges p {
        font-size: 24px;
        font-weight: 500;
        line-height: 36px;
      }
      .challenges ul {
        display: flex;
        flex-direction: column;
        gap: 15px;
        margin-top: 35px;
      }
      .features-section {
        background-color: #111;
        color: #fff;
        padding: 80px 0 0;
      }

      .features-section .badge {
        border-color: #555;
        color: #ddd;
        background: transparent;
      }

      .section-title {
        font-family: "SugarPeachy";
        font-weight: 700;
        font-size: 64px;
        margin-top: 15px;
        margin-bottom: 76px;
      }

      .feature-card {
        border-radius: 20px;
        padding: 30px 30px;
        transition: transform 0.3s ease, box-shadow 0.3s ease;
        box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
      }
      .feature-card.dark h6 {
        color: #fff;
      }
      .feature-card h6 {
        font-size: 36px;
        font-weight: 700;
        margin-bottom: 10px;
        font-family: "SugarPeachy";
        color: #2c2c2c;
      }
      .feature-card.dark.tilt-right p {
        color: #fff;
      }
      .features-section .col-12.col-md-6.col-lg-3 {
        padding: 0;
        margin: 20px -10px;
      }
      .feature-card p {
        color: #2c2c2c;
        margin: 0;
        font-size: 18px;
      }
      .feature-card.white {
        background-color: #fff;
        color: #000;
        height: 290px;
        margin-bottom: -140px;
        margin-top: 40px;
      }
     .feature-card.dark:hover {
        background: #2c2c2c;
        height: 320px;
        border: 3px solid #5b5b5b;
        background-image: url(./image/hover-dark.svg);
        background-repeat: no-repeat;
        background-size: 100px 120px;
        background-repeat: no-repeat;
        background-position: 205px 160px;
      }
      .feature-card.dark {
        background-color: #2c2c2c;
        color: #fff;
        height: 290px;
        margin-bottom: -140px;
        margin-top: 0px;
      }

      .tilt-left {
        transform: rotate(-5deg);
      }

      .tilt-right {
        transform: rotate(5deg);
      }

      .feature-card:hover {
        transform: scale(1.05);
        box-shadow: 0 10px 25px rgba(0, 0, 0, 0.3);
      }
      .pricing-section {
        background: #f6efff;
        padding: 100px 0;
        text-align: center;
        border-top-left-radius: 100px;
        border-top-right-radius: 100px;
      }

      .pricing-section .badge {
        border-color: #787878 !important;
        color: #555;
        background: #fff;
      }
      .pricing-section span.badge:before {
        content: "";
        transition: 0.2s all ease;
        position: absolute;
        left: 20px;
        background-color: #c097f0;
        border: 1px solid #c097f0;
        width: 8px;
        height: 8px;
        border-radius: 100%;
        top: 50%;
        transform: translate(-50%, -50%);
      }
      .pricing-title {
        font-family: "SugarPeachy";
        font-weight: 700;
        font-size: 64px;
        color: #2c2c2c;
        margin-top: 15px;
        margin-bottom: 76px;
      }
      .plan-card {
        text-align: left;
        z-index: 0;
        border-radius: 24px;
        transition: transform 0.3s ease, box-shadow 0.3s ease;
      }

      .plan-card:hover {
        transform: translateY(-5px);
      }
      .dark-plan:before {
        content: "";
        position: absolute;
        inset: 0;
        padding: 3px;
        border-radius: inherit;
        background: linear-gradient(
          205deg,
          rgba(26, 26, 26, 1) 0%,
          rgba(66, 66, 66, 1) 100%
        );
        -webkit-mask: linear-gradient(#fff 0 0) content-box,
          linear-gradient(#fff 0 0);
        -webkit-mask-composite: xor;
        mask-composite: exclude;
        z-index: -1;
      }
      .light-plan:before {
        content: "";
        position: absolute;
        inset: 0;
        padding: 3px;
        border-radius: inherit;
        background: linear-gradient(
          205deg,
          rgba(192, 151, 240, 1) 0%,
          rgba(255, 255, 255, 1) 100%
        );
        -webkit-mask: linear-gradient(#fff 0 0) content-box,
          linear-gradient(#fff 0 0);
        -webkit-mask-composite: xor;
        mask-composite: exclude;
        z-index: -1;
      }
      /* Light Plan */
      .light-plan {
        transition: transform 0.3s ease, box-shadow 0.3s ease;
        position: relative;
        border-radius: 24px;
        background: #fff;
        z-index: 1;
      }

      /* Dark Plan */
      .dark-plan {
        background: linear-gradient(
          205deg,
          rgba(66, 66, 66, 1) 0%,
          rgba(26, 26, 26, 1) 100%
        );
        color: #fff;
        position: relative;
      }
      .dark-plan .included h6 {
        font-weight: 600;
        margin-bottom: 25px;
        color: #f6eeff;
        font-size: 20px;
      }
      .rainbow {
        position: relative;
      }
      .rainbow:before {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(180deg,rgb(250 250 250) 0%,rgb(250 250 250 / 0%) 100%);
        z-index: 3;
        top: -100px;
        width: 323px;
        left: 50%;
        transform: translate(-50%, -50%);
        height: 130px;
      }
      .dark-plan .included li {
        color: #f6eeff;
      }
      .dark-plan .btn {
        color: #000;
        font-weight: 500;
      }
      .rainbow img {
        position: absolute;
        z-index: 1;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 100%;
        max-width: 326px;
        top: -4px;
        height: 321px;
      }
      .rainbow {
        position: relative;
      }

      .price {
        font-size: 74px;
        font-weight: 800;
        margin-bottom: 0.3rem;
        font-family: "SugarPeachy";
      }
      .per {
        font-size: 24px;
        color: #aaa;
        font-family: "SugarPeachy";
      }
      .offer {
        background: #444;
        color: #fff;
        font-size: 22px;
        border-radius: 12px;
        padding: 2px 10px;
        font-family: "Quicksand";
      }

      /* Plan Texts */
      .plan-name {
        font-weight: 700;
        text-transform: capitalize;
        margin-top: 0.5rem;
        font-size: 36px;
        font-family: "SugarPeachy";
      }
      .ribbon {
        position: absolute;
        top: -22px;
        right: 25px;
      }
      .plan-desc {
        font-size: 16px;
        color: #2c2c2c;
      }
      .light-plan a {
        padding: 20px;
        font-size: 16px;
        color: #2c2c2c;
        text-transform: uppercase;
        font-weight: 500;
        margin-bottom: 65px;
	    font-weight: 500;
      }

      .dark-plan a {
        padding: 20px;
        font-size: 16px;
        color: #2c2c2c;
        text-transform: uppercase;
        font-weight: 500;
        margin-bottom: 65px;
      }

      /* Included List */
      .light-plan .included h6 {
        font-weight: 600;
        margin-bottom: 25px;
        color: #787878;
        font-size: 20px;
      }

      .included ul {
        list-style: none;
        padding: 0;
        margin: 0;
      }
      .dark-plan p.plan-desc {
        color: #fff;
      }
      .included li {
        font-size: 20px;
        display: flex;
        align-items: center;
        gap: 8px;
        margin-bottom: 8px;
        color: #787878;
        font-weight: 500;
      }

      .included img {
        width: 20px;
        height: 20px;
      }

      .navbar.scrolled {
        background: white !important;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); /* optional */
        /* transition: background 0.3s ease; */
      }

      .Why_list li {
        margin-top: 10px;
      }

      .why-us {
        position: relative;
      }
      .text-center {
        width: 100%;
        max-width: 920px;
        margin: 0 auto;
      }
      .our-mission p {
        color: #e5e5e5;
        font-family: "Quicksand";
      }
      .our-mission {
        background-color: #111;
        color: #fff;
        padding: 244px 50px 244px 50px;
      }
      .our-mission h2.pricing-title {
        color: #fff;
        margin: 15px auto;
      }
      .our-mission p span {
        font-weight: bold;
      }

      img.patter-left {
        position: absolute;
        bottom: 0;
        left: 0;
      }
      img.patter-right {
        position: absolute;
        top: 0;
        right: 0;
      }

img.heart {
    position: absolute;
    top: -160px;
    left: -60px;
}
      img.ear {
        position: absolute;
        right: 80px;
        top: 90px;
      }
      img.book {
        position: absolute;
      }
      img.sticker {
        position: absolute;
      }
img.sticker {
    position: absolute;
    top: unset;
    bottom: -20px;
    right: -90px;
    width: 100%;
    max-width: 340px;
}
img.book {
    position: absolute;
    left: -60px;
    bottom: -140px;
}

      img.one {
        position: absolute;
        right: -120px;
        bottom: -570px;
      }

      a.get-started-dark {
        background: #fff;
        color: #1a1a1a;
        padding: 20px 40px;
        font-size: 20px;
        text-transform: uppercase;
        text-decoration: none;
        border-radius: 100px;
        margin-top: 35px;
        display: inline-block;
font-weight:500;
      }

      .banner a {
        box-shadow: 1px 10px 1px #444444;
      }

      .banner a:hover {
        box-shadow: none;
      }

      .why-us ul.check li:before {
        background-image: url("./image/tick.svg");
      }

      .feature-card.dark.tilt-right p {
        color: #fff;
      }

      .text-center {
        width: 100%;
        max-width: 920px;
        margin: 0 auto;
      }

      .our-mission p {
        color: #e5e5e5;
      }

      .our-mission h2.pricing-title {
        color: #fff;
        margin: 15px auto;
      }

      .our-mission p span {
        font-weight: bold;
      }

      img.patter-left {
        position: absolute;
        bottom: 0;
        left: 0;
      }

      img.patter-right {
        position: absolute;
        top: 0;
        right: 0;
      }

img.ear {
    position: absolute;
    right: -100px;
    top: -190px;
}

      img.book {
        position: absolute;
      }

      img.sticker {
        position: absolute;
      }

.our-mission img.sticker {
    position: absolute;
    right: -40px;
    bottom: -160px;
}


      /*------------------footer____OPEN-------------------*/
   
      .footer_main{
        background-color: #FAFAFA;
        position: relative;
	padding:0 15px;
      }
      .footer_main .container{
        background-color: #1A1A1A;
        border-radius: 20px;
        padding: 75px 45px 0px;
      }

      .foot-main-hea{
        font-size: 36px;
        font-family: "Quicksand";
        font-weight: 500;
        line-height: 1.3em;
        color: #FFFFFF;
        text-transform: capitalize
      }
.foot-des{
      font-size: 20px;
        font-family: "Quicksand";
        font-weight: 400;
        line-height: 1.3em;
        color: #FFFFFF;
        text-transform: capitalize;
        margin-top:20px;
}

.social-main{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.social-main ul{
display: flex;
gap: 30px;
flex-direction: row;
margin-top:20px;
}
ol, ul {
    padding-left: 0rem !important;
}

.social-main ul li {
    list-style: none;
      font-size: 16px;
        font-family: "Quicksand";
        font-weight: 400;
        line-height: 1.3em;
        color: #787878;
       
}
.social-main ul li a {
        color: #787878 !important;
        text-decoration: none;
        
}

.social-icons-foot{
     display: flex;
  flex-direction: row;
  gap: 20px;

}

.ftr_bg_logo{
       position: absolute;
    top: 20%;
    right: 230px;
}
.cpr-main{
    display: flex;
    flex-direction: row;
    gap: 30px;
}
.cpr-main p{
      font-size: 14px;
        font-family: "Quicksand";
        font-weight: 400;
        color: #787878;
}

.cpr-main ul li{
      font-size: 14px;
        font-family: "Quicksand";
        font-weight: 400;
        color: #787878;
        list-style: none;
}
.cpr-main ul {
display: flex;
flex-direction: row;
gap: 30px;
}

.cpr-main ul li a {
        color: #787878 !important;
        text-decoration: none;
        
}
.characters {
    padding: 115px 15px;
    background: #fafafa;
}
.only-in-about-round {
    border-top-left-radius: 100px;
    border-top-right-radius: 100px;
}
.characters .container {
    background: #F6EEFF;
    padding: 0px 60px;
    border: 2px solid #2C2C2C;
    border-radius: 20px;
}
.characters .container a.get-started {
    margin-bottom: 60px;
}
.characters .container h2 {
    color: #1a1a1a;
    font-family: 'SugarPeachy';
    font-weight: 700;
    font-size: 64px;
    margin: 60px auto 0;
}
.characters .container p {
    font-size: 20px;
}


.copy_main-cont{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.bck_to_top{
   font-size: 16px;
        font-family: "Quicksand";
        font-weight: 400;
        color: #FFFFFF;
        list-style: none;
        text-decoration: none;

}

.cpr_rw {
    margin-top: 40px !important;
    padding: 30px 0px;
    border-top: 1px solid #787878;
}


.characters .col-lg-5.position-relative {
    text-align: center;
}
.faq-section {
    background: #fafafa;
    padding-bottom: 115px;
}

.faq-title {
  font-family: 'Fredoka', sans-serif;
  font-weight: 700;
  font-size: 2.8rem;
  line-height: 1.2;
}

.faq-badge {
  background-color: #f4edff;
  color: #7b57f2;
  font-weight: 600;
  font-size: 0.8rem;
  letter-spacing: 1px;
}

.faq-badge .dot {
  width: 8px;
  height: 8px;
  background-color: #7b57f2;
  border-radius: 50%;
  display: inline-block;
}

/* Accordion Styling */
.accordion-button {
  border-radius: 0.75rem;
  background-color: #fff;
  box-shadow: none;
  font-weight: 600;
  font-size: 1.05rem;
  color: #444;
  padding: 1rem 1.25rem;
}

.accordion-button:focus {
  box-shadow: none;
}

.accordion-item {
  transition: all 0.3s ease;
}

.accordion-body {
  color: #444;
  font-size: 0.95rem;
}

.accordion-button:not(.collapsed)::after {
      background-image: url(./image/cross-active.svg);
}
.accordion-button::after {
    background-image: url(./image/Cross.svg);
}
.accordion-item.active-item .accordion-body {
    color: #1A1A1A;
    border-radius: 0 0 0.75rem 0.75rem;
    font-size: 18px;
    font-family: 'Quicksand';
    font-weight: 500;
    padding-bottom: 26px;
}
.faq-section h2 {
    font-size: 64px;
    font-family: 'SugarPeachy';
}
.faq-section span.badge {
    color: #2c2c2c;
}
.faq-section p {
    font-family: 'Quicksand';
    font-size: 20px;
    color: #2C2C2C;
}
.faq-section span.badge:before {
    content: "";
    transition: 0.2s all 
ease;
    position: absolute;
    left: 20px;
    background-color: #c097f0;
    border: 1px solid #787878;
    width: 8px;
    height: 8px;
    border-radius: 100%;
    top: 50%;
    transform: translate(-50%, -50%);
}
button.accordion-button.collapsed {
    padding: 30px 1.25rem;
}
button.accordion-button.collapsed {
    color: #787878;
    font-family: 'Quicksand';
border-radius:12px;
    font-size: 22px;
border:none;
    font-weight: 500;
}
.faq-section {
  background: #fafafa;
}

.accordion-item.active-item .accordion-button {
    color: #1A1A1A;
    font-family: 'Quicksand';
    font-size: 22px;
    background: transparent;
    border: none !important;
    box-shadow: none ! Important;
}

.accordion-item {
    background: #fff;
    box-shadow: none !important;
    border: none !important;
}

.accordion-item.active-item {
    background: linear-gradient(88deg, #C097F0 43.71%, rgba(157, 157, 157, 0) 71.33%), linear-gradient(0deg, rgba(255, 255, 255, 0.06) 0%, rgba(255, 255, 255, 0.06) 100%), #C097F0;
    border: 1.5px solid #1a1a1a !important;
    box-shadow: 1px 8px 1px #C097F0!important;
}
.accordion-item.active-item .accordion-button {
    padding-top: 30px;
    padding-bottom: 0;
}
img.sticker_two {
    position: absolute;
    left: -120px;
    top: 390px;
    width: 100%;
    max-width: 290px;
}
.feature-card:hover {
    transform: scale(1.05);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.3);
    margin-top: -20px;
    z-index: 1999;
    position: relative;
    background: #F6EEFF;
    height: 350px;
    border: 3px solid #C097F0;
    background-image: url(./image/hover-white.svg);
    background-size: 100px 120px;
    background-repeat: no-repeat;
    background-position: 205px 160px;
}


@media screen and (max-width: 1366px) {
.step-card {
    border-radius: 1000px;
    width: 425px;
    height: 425px;
}
}

@media screen and (max-width: 1300px) {
 
img.one {
    position: absolute;
    right: -90px;
    bottom: -570px;
}
img.two {
    position: absolute;
    right: -110px;
    top: 200px;
}
.our-mission img.sticker {
    right: 0;
}
img.heart {
    left: 0px;
}
img.ear {
    right: 0px;
}
img.book {
    left: 0px;
}
}
@media screen and (max-width: 1200px) {
    .step-card {
        margin-left: 20px;
        padding: 50px;
    }
    .step-card.first {
           margin-left: auto;
    }

.step-card.second {
    margin-left: auto;
}
.step-card.third {
     margin-left: auto;
}
    .step-card {

        width: 420px;
        height: 420px;
    }
}

@media screen and (max-width: 1024px) {
.rainbow img {
    max-width: 286px;
}
.pricing-title, .characters .container h2, .faq-section h2, .how-it-works h2, section.why-us h2, .section-title {
    font-size: 54px;
}
.banner a {
    padding: 20px 67px;
}
.banner h1 {
    font-size: 66px;
}
.step-card {
        margin-left: 0px;
        padding:40px;
    }
    .step-card.third {
        margin-left: -60px;
    }
.step-card {
        width: 380px;
        height: 380px;
    }
    .step-card.first {
        margin-left: 0;
}
img.sparkle {
    position: absolute;
    right: -18px;
    max-width: 10%;
    top: -48px;
}
    img.one {
        position: absolute;
        right: 0px;
    }
img.sticker {
    bottom: 0px;
    right: 50px;
}
img.sticker_two {
    left: -20px;
    top: 410px;
}

li.nav-item.login {
    margin-left: 0;
}
.faq-section {
    padding-bottom: 60px;
}
}

@media screen and (max-width:1023px) {
.pricing-title, .characters .container h2, .faq-section h2, .how-it-works h2, section.why-us h2, .section-title {
    font-size: 54px;
}
    .banner h1 {
        font-size: 56px;
	width:700px;
}
img.four {
    position: absolute;
    left: -40px;
    top: 120px;
}
    img.sticker {
        bottom: 0px;
        right: 50px;
        max-width: 250px;
    }

    img.sticker_two {
        left: 20px;
        top: 300px;
        max-width: 200px;
    }
    img.two {
        position: absolute;
        right: -10px;
        top: 200px;
    }
    .step-card.third {
        margin-left: auto;
        position: relative;
        transform: translate(0%, -16%);
        left: 50%;
    }
    .step-card {
        width: 410px;
        height: 410px;
    }

    .how-it-works .col-md-4 {
        flex: 0 0 auto;
        width: 50%;
    }
img.leaf-left {
    position: relative;
    left: -20px;
    top: -20px;
}
.how-it-works h2 {
    font-size: 64px;
    font-family: "SugarPeachy";
    width: 100%;
    margin: 0 auto;
    color: #fff;
}
.how-it-works .container:before, .how-it-works .container:after {
    height: 36%;
}
.features-section .row.g-4.justify-content-center {
    padding: 0 15px;
}
img.heart {
    position: absolute;
    top: -140px;
    left: 40px !important;
    max-width: 180px;
}

.faq-section h2 br {
display:none;
}
.how-it-works {
    padding: 175px 15px 15px 15px;
}
.characters .col-lg-5.position-relative:before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgb(246 238 255) 0%, rgb(255 255 255 / 0%) 100%);
    z-index: 3;
    top: 60px;
    width: 100%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: 130px;
}
}
@media screen and (max-width:820px) {
.pricing-title, .characters .container h2, .faq-section h2, .how-it-works h2, section.why-us h2, .section-title {
        font-size: 44px;
    }
section.why-us {
    padding: 65px 0;
    border-bottom-left-radius: 50px;
    border-bottom-right-radius: 50px;
}
    .step-card {
        width: 390px;
        height: 390px;
    }
.pricing-section {
    
    padding: 55px 0;
    border-top-left-radius: 50px;
    border-top-right-radius: 50px;

}
.faq-section {
        padding-bottom: 20px;
    }
.characters {
    padding: 55px 15px;

}
.foot-main-hea {
    font-size: 32px;
}
.our-mission {
    padding: 204px 0 204px 0;
}
    .our-mission img.sticker {
        right: 40px;
        max-width: 200px;
        bottom: -110px;
    }
    img.book {
        left: 40px;
        max-width: 180px;
    }
    img.ear {
        top: -170px;
        max-width: 210px;
        right: 30px;
    }
.banner {
    padding: 200px 0 175px;
    margin-top: -80px;
    background-color: #fafafa;
}
}

@media screen and (max-width:767px) {
.pricing-section .col-6 {
    width: 100%;
}
.pricing-section {
    border-top-left-radius: 30px;
    border-top-right-radius: 30px;
}
.feature-card:hover, .feature-card.dark:hover {
    background-position: bottom right;
}
    img.four {
        position: absolute;
        left: -90px;
        top: 150px;
        max-width: 120px;
        z-index: 0;
    }
    .banner h1 {
        font-size: 48px;
        font-family: "SugarPeachy";
        width: 100%;
        margin: 0 auto;
    }
    .features-section .row.g-4.justify-content-center {
        padding: 0 25px;
    }
.pricing-title, .characters .container h2, .faq-section h2, .how-it-works h2, section.why-us h2, .section-title {
    font-size: 44px;
}
.challenges {
    margin-top: 60px;
}
    .how-it-works {
        padding-bottom: 65px;
    }
    .step-card.third {
        margin-left: auto;
        position: relative;
        transform: unset;
        left: auto;
        margin-top: -50px;
    }
    .step-card.second {
        margin-left: auto;
        margin-top: -50px;
    }
    body .how-it-works .col-md-4 {
        flex: 0 0 auto;
        width: 100%;
    }
    body .feature-card.dark {
        margin-bottom: -100px;
    }

    img.four {
        position: absolute;
        left: -20px;
        top: -90px;
        max-width: 80px;
        z-index: 0;
    }
    img.one {
        position: absolute;
        right: 0px;
        max-width: 60px;
    }
.banner a, .banner h1, .banner p {
    z-index: 1;
    position: relative;
}
    img.ear {
        top: -180px;
        max-width: 150px;
        right: 0px;
    }
    img.sticker {
        bottom: -30px;
        right: -30px;
        max-width: 230px;
    }
    img.book {
        left: 10px;
        max-width: 100px;
        bottom: -100px;
    }
    .our-mission {
        padding: 174px 0 154px 0;
    }
    .our-mission img.sticker {
        right: 40px;
        max-width: 130px;
        bottom: -110px;
    }
.banner p {
    font-size: 20px;
    margin-bottom: 45px;
}
    img.sticker_two {
        left: 20px;
display:none;
        top: 270px;
        max-width: 180px;
    }
.cpr-main {
    gap: 20px;
    flex-direction: column;
}
img.three {
    position: absolute;
    left: 360px;
    top: -100px;
    max-width: 60px;
}
    img.heart {
        position: absolute;
        top: -130px;
        left: 10px !important;
        max-width: 110px;
    }
.rainbow:before {
    width: 260px;
}
.rainbow img {
    max-width: 266px;
}
img.five {
    position: absolute;
    left: 0;
    top: 450px;
}
    .step-card {
        padding: 30px;
    }
    .step-card h5 {
    font-size: 36px; 
}
.ftr_bg_logo {
    right: auto;
    width: 100%;
    max-width: 80%;
}
.banner a {
    padding: 16px 56px;
}
.social-main ul {
    flex-direction: column;
}
.social-main {
    align-items:start;
    flex-direction: column;
}
    section.why-us {
        padding: 65px 0;
        border-bottom-left-radius: 30px;
        border-bottom-right-radius: 30px;
    }
.characters .container {

    padding: 0px 30px;
}
    img.two {
        position: absolute;
        right: -10px;
        top: 270px;
        max-width: 60px;
    }
    .step-card {
        width: 100%;
        height: fit-content;
    }
    
nav.navbar.navbar-expand-lg.sticky-top.scrolled {
    z-index: 4;
}
}
  .btn-chip{ border-radius:999px; border:1px solid var(--ring); background:#fff; padding:.55rem 1rem; }
    .btn-back{ width:44px;height:44px;border-radius:12px;border:1px solid var(--ring);background:#fff; display:flex;align-items:center;justify-content:center;}
    .title{ font-family:"Baloo 2"; font-weight:700; color:#111; letter-spacing:.2px; font-size:clamp(26px, 3.2vw, 36px);}
    .muted{ color:var(--muted); }

    /* Input shell styled like screenshot */
    .phone-shell{
      position:relative;
      border-radius:999px;
      border:1.6px solid var(--ring);
      display:flex; align-items:center;
      padding:.18rem .3rem;
      background:#fff;
      transition:border-color .15s ease, box-shadow .15s ease;
    }
    .phone-shell.valid{ border-color:var(--violet); box-shadow:0 0 0 4px rgba(139,92,246,.16); }
    .phone-shell.invalid{ border-color:var(--danger); box-shadow:0 0 0 4px rgba(239,68,68,.14); }

    /* Flag chip (left) */
    .flag-chip{
      display:flex; align-items:center; gap:.38rem;
      background:var(--chip);
      border-radius:999px;
      padding:.38rem .56rem;
      margin-left:.1rem;
      border:1px solid rgba(0,0,0,.04);
      cursor:pointer;
      user-select:none;
    }
    .flag-chip img{ width:28px; height:20px; object-fit:cover; border-radius:6px; box-shadow:0 0 0 1px rgba(0,0,0,.06); }
    .flag-chip .caret{
      width:18px;height:18px; display:inline-flex; align-items:center; justify-content:center; color:#555;
    }

    /* Phone input */
    .phone-input{
      border:none; outline:none; flex:1; padding:.74rem .8rem; font-size:1.05rem; color:#2b2b2b;
    }
    .phone-input::placeholder{ color:#9aa0a6; }

    /* Trailing phone icon */
    .trailing{
      width:26px;height:26px; margin-right:.65rem; color:#1f1f1f; opacity:.7;
    }

    /* Dropdown panel */
    .country-menu{
      position:absolute; inset: auto auto 0 0;
      transform: translateY(calc(100% + 10px));
      width:560px; max-width:92vw;
      background:#fff; border:1px solid var(--ring); border-radius:16px; box-shadow:0 14px 38px rgba(0,0,0,.12);
      padding:.6rem; z-index:1000; display:none;
    }
    .country-menu.open{ display:block; }
    .search{
      width:100%; border:1px solid var(--ring); border-radius:10px; padding:.6rem .8rem; outline:none;
    }
    .list{
      margin-top:.5rem; max-height:420px; overflow:auto;
    }
    .row-item{
      display:flex; align-items:center; gap:.65rem; padding:.6rem .65rem; border-radius:10px; cursor:pointer;
    }
    .row-item:hover{ background:#f7f7fb; }
    .row-item img{ width:22px;height:16px;border-radius:3px;object-fit:cover; box-shadow:0 0 0 1px rgba(0,0,0,.05); }
    .row-item .name{ flex:1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

    .helper{
      font-size:.86rem; margin-top:.5rem;
    }
    .helper.invalid{ color:var(--danger); }
    .helper.valid{ color:var(--violet); }

    .btn-primary-soft{ background:#111; color:#fff; border:none; }
    .btn-outline{ background:#fff; border:1px solid var(--ring); color:#111; }
    section.login-page {
    height: 100vh;
}
section.login-page .col-md-6.col-left {
    background-color: #111;
    color: #fff;
    padding: 80px 0 0;
    height: 100%;
    align-items: center;
    justify-content: center;
    display: flex
;
}
section.login-page img.left-cross {
    position: absolute;
    top: 0;
    left: -110px;
    width: 100%;
    z-index: 1;
    max-width: 510px;
}
section.login-page img.vector-two {
    width: 92px;
    position: absolute;
    bottom: 14%;
    right: 16%;
}
section.login-page .row {
    height: 100vh;
    width: 100%;
    margin: 0 auto;
}
section.login-page img.vector-one {
    position: absolute;
    width: 72px;
    top: 20%;
    left: 20%;
}
section.login-page .section-title {
    margin-bottom: 24px;
    font-size: 48px;
    font-weight: 500;
}
section.login-page img.stars {
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    top: 50%;
}
img.auth-logo {
    width: 100%;
    max-width: 416px;
}
.characters .container img {
    width: 100%;
    height: -webkit-fill-available;
    object-fit: fill;
}
@media screen and (max-width: 1024px) {
img.auth-logo {
    width: 100%;
    max-width: 330px;
}
}
@media screen and (max-width: 767px) {
section.login-page .col-md-6.col-left {
    display: none;
}
}












/*============================== About Page ==================================*/

.about-page{
  background-color: #000;
}
.navbar {
  background-color: #fafafa;
}
.hero_aboutus {
  background-color: #fafafa;
}
.aboutus_title {
  font-size: 80px;
  font-family: 'SugarPeachy';
  line-height: 1em;

}
.about-first {
  padding-bottom: 160px;
}
.section_pad {
  padding: 100px 50px 100px 50px;
}

.aboutus_banner_p {
  font-size: 24px;
  font-family: "Quicksand";
}

.abouts_second_p {
  font-size: 48px;
  font-family: 'SugarPeachy';
  font-weight: 500;
  color: #1A1A1A;
  margin-bottom: 0px;
  line-height: normal;
}

.aboutme_card_sub_head {
  font-size: 20px;
  font-weight: 500;
  font-family: "Quicksand";
}

.aboutme_card_para {
  font-size: 18px;
  line-height: 28px;
  font-family: "Quicksand";
}
.aboutme_card_para span{
  font-weight: 600;
}

.tilt-right-about-card {
  transform: rotate(2deg);
}

.about-card-padding{
  padding: 30px 55px 50px 55px;
  gap: 30px;
}

.aboutus_banner_image {
  position: absolute;
  top: 60px;
}

/*.margin_top_aboutus_banner {
  margin-top: 5rem;
}*/

.common_para {
  font-size: 20px;
  line-height: 1.7em;
  font-family: "Quicksand";
}

.Book_2 {
  left: 0;
  top: 55%;
}

.Ball_2 {
  top: 5%;
  left: 45.5%;
}

.shoe_2 {
  bottom: 2%;
}

.common_head {
  font-size: 64px;
  font-family: 'SugarPeachy';
  line-height: 1.2em;
}

.purple_tick_list.check li:before {
  content: "";
  position: absolute;
  left: 0px;
  top: 14px;
  width: 16px;
  height: 16px;
  background-image: url("./image/tick.svg");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  transform: translateY(-50%);
}

.purple_tick_list li {
  padding-left: 26px;
}

.margin_ourmission {
  margin-top: 5rem;
}

.aboutme_card {
  border-radius: 20px;
  background: linear-gradient(179deg, rgba(192, 151, 240, 0.20) 36.25%, rgba(255, 255, 255, 0.20) 84.41%), #FFF;
  max-width: 1100px;
  margin: 0 auto;
}

.aboutme_card_content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  color: #2C2C2C;
}
#Contact-us.why-us h2 {
  margin: 15px auto 0px;
}

#features{
  padding-bottom: 50px !important;
}

.waiting-card{
  padding: 115px 0px 45px 0px;
  border-radius: 70px 70px 0px 0px;
  background-color: #fafafa;
  position: relative;
  z-index: 9;
  margin-top: -85px;
}
section#Contact-us {
  border-radius: 0px;
}

/* User message (dark bubble) */
.user-msg {
align-self: flex-end;
background: linear-gradient(192.62deg, #424242 14.91%, #1A1A1A 46.86%);
border: 1.5px solid;
border-image-source: linear-gradient(189.86deg, #1A1A1A 6.64%, rgba(255, 255, 255, 0) 98.45%);
color: #fff;
border-radius: 50px;
border-bottom-right-radius: 0px;
padding: 35px;
max-width: 80%;
font-family: Quicksand;
font-weight: 600;
font-size: 36px;
line-height: 46px;
letter-spacing: 0px;
}

/* Reply container */
.reply {
display: flex;
align-items: flex-start;
gap: 20px;
}

/* fc circle */
.fc-circle {
  height: -webkit-fill-available;
  align-content: end;
}

/* Reply text bubble */
.reply-bubble {
border: 2px dashed #787878;
border-radius: 50px;
border-bottom-left-radius: 0px;
background-color: #fff;
color: #333;
padding: 35px;
font-family: Quicksand;
font-weight: 400;
font-size: 36px;
line-height: 46px;
letter-spacing: 0px;
max-width: 75%;
}
.reply-bubble a{
  font-weight: 600;
  color: #2C2C2C;
}
.chat-wrapper {
width: 100%;
display: flex;
flex-direction: column;
gap: 35px;
}








/*===================== sumit ==================*/



.purple_tick_list {
    font-family: "Quicksand";
    font-size: 18px;
    font-weight: 400;
    line-height: 28px;
}

.navbar-nav {
  margin-top: 35px;
  margin-bottom: 20px;
  z-index: 999;
  position: relative;
}

.carousel-control-next, .carousel-control-prev {
  bottom: -8%;
  top: auto;
  padding: 0;
  color: #000;
  filter: invert(1);
}
.little-width {
    max-width: 69%;
}