@media only screen and (max-width: 768px) {
    .hero-section{
        background-image: url('../image/responsive/Front-_-MOBILE.jpg') !important;
    }
    .contact-page{
        background-image: url('../image/responsive/CONTACT-_+-MOBILE.jpg') !important;
    }
    .faq{
        height: 550px !important;
    }
    
  
    .titleh1 {
        font-weight: 600 !important;
        font-size: 27px !important
    }

    .about-img {
        margin-right: 0%
    }

    .compliance-section {
        height: 70px !important;
        top:70% !important;
    }

    .compliance-badge {
        left: 2% !important;
        max-width: 100px !important
    }

    .title-reward {
        font-size: 14px !important;
        padding-left: 5%
    }

    .swiper-text {
        font-family: reward-head;
        font-size: large !important;
        font-weight: 800;
        padding: 50px !important
    }

    .service-cardhome {
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: center
    }

    .about-img {
        margin-right: 0% !important
    }

    .service {
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: center
    }

    .contact-card {
        margin-top: -50% !important;
        margin-bottom: 5%
    }

    .pricing-badge {
        font-size: 23px !important
    }
    .feature-text{
        font-size: 16px !important;
    }

    h6 {
        font-size: x-large !important
    }
    .title-reward{
        padding-left: 10% !important;
    }
    /* .row-center {
        padding-left: 0% !important;
    } */
}

@media only screen and (max-width: 600px) {
    .about-img {
        margin-right: 0%
    }

    .contact-card {
        margin-top: -50% !important;
        margin-bottom: 5%
    }
    .compliance-section {
        height: 70px !important;
        top:70% !important;
    }
    .contact-card{
        margin-top: -45% !important;
    }
}

@media only screen and (max-width: 400px) {
    .about-img {
        margin-right: 0% !important
    }

    .compliance-badge {
        left: 1% !important;
        max-width: 90px !important
    }

    .title-reward {
        font-size: 14px !important;
        padding-left: 24%
    }
    .compliance-section {
        height: 70px !important;
        top:70% !important;
    }
    .contact-card{
        margin-top: -45% !important;
    }
    .feature-text{
        font-size: 14px !important;
    }

}

@media (max-width: 768px) {
    .testimonial-title {
        font-size: large;
        text-align: center
    }

    .profile-img {
        width: 70px;
        height: 70px
    }

    .google-img {
        width: 250px;
        height: auto;
        display: none
    }

    .testimonial-card {
        padding: 15px
    }

    .interaction-icons {
        font-size: 14px
    }

    .testimonial {
        font-size: 18px;
        background: #fff0;
        height: 400px !important
    }
}

@media (max-width: 480px) {
    .testimonial-title {
        font-size: medium
    }

    .testimonial-card p {
        font-size: 14px
    }

    .google-img {
        width: 200px;
        display: none !important
    }

    .testimonial {
        font-size: 18px;
        background: #fff0;
        height: 500px !important
    }
}

.compliance-section {
    background-color: #e48b5a;
    padding-top: 1rem;
    text-align: center;
    position: relative;
    height: 90px
}

.compliance-badge {
    position: absolute;
    left: 15%;
    top: 80%;
    transform: translateY(-50%);
    max-width: 150px
}

.title-reward {
    font-family: reward-head;
    color: #fff;
    padding-top: .5rem
}

@font-face {
    font-family: header-font;
    src: url('../fonts/BwModelica/BwModelica-Black.otf') format("truetype");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: reward-head;
    src: url('../fonts/BwModelica/BwModelica-Bold.otf') format("truetype");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: spantitle;
    src: url('../fonts/BwModelica/BwModelica-Medium.otf') format("truetype");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: paratitle;
    src: url('../fonts/BwModelica/BwModelica-Regular.otf') format("truetype");
    font-style: normal
}

.subtitle {
    font-family: spantitle;
    text-align: center
}

.feature-box {
    background: #fff;
    border-radius: 30px 0 30px 30px;
    display: flex;
    align-items: center;
    box-shadow: 0 4px 6px #0000001a;
    padding: 5px 20px 5px 15px
}

.feature-box img {
    width: 50px;
    height: 50px;
    margin-right: 10px
}

.feature-text {
    font-size: 26px;
    margin: 0;
    font-weight: 700;
    color: #181c40;
    font-family: paratitle;
    padding-left: 20px
}

.footersection {
    background-color: #12163f
}

.footer-logo {
    width: 200px
}

.footer-row {
    padding-top: 4%;
    padding-bottom: 3%
}

.footer-text {
    color: #fff;
    /* text-align: justify; */
    /* font-size: larger */
}

.quick-link {
    color: #fff
}

.footer-link {
    padding: 0rem;
    list-style: none;
    color: #fff
}

.footer-link li {
    margin-top: 15px
}

.footer-link i {
    color: #e5895a
}

.office-container {
    color: #fff;
    border-radius: 10px;
    font-family: Poppins, sans-serif
}

.row-center {
    padding-left: 5%
}

.footer-link li {
    font-size: 16px;
    margin-bottom: 10px;
    display: flex;
    align-items: flex-start
}

.footer-link i {
    color: #f76c1b;
    margin-right: 10px;
    font-size: 18px
}

.footer-link a {
    color: #fff;
    text-decoration: none;
    font-weight: 500
}

.footer-link a:hover {
    text-decoration: underline
}

.line-gratient {
    position: relative;
    width: 100%;
    height: 10px;
    background: linear-gradient(90deg, #e5895a, #21285a 66%);
    border-radius: 20px;
    z-index: 999;
    margin-bottom: -.5%
}

.section-title {
    text-align: center;
    font-size: 28px;
    font-weight: 600;
    margin-bottom: 30px
}

.service-card {
    background: #fff;
    padding: 20px;
    border-radius: 12px;
    transition: all .3s ease;
    box-shadow: 0 2px 8px #0000000d;
    height: 320px;
}

.service-card:hover,
.service-card.active {
    border: 2px solid #f5a76c;
    background: linear-gradient(177deg, #fef7f4 55%, #fee5d6 85%)
}

.service-card h4 {
    margin-top: 7%;
    font-family: reward-head;
    font-weight: 800;
    color: #1d1d1d
}

.service-card p {
    margin-top: 7%;
    font-size: 14px;
    color: #555;
    font-family: paratitle;
    line-height: 1.5rem;
    text-align: left;
    font-weight: 400
}

.view-more {
    text-align: center;
    font-size: 16px;
    font-weight: 500;
    color: #f5a76c;
    text-decoration: none;
    display: block;
    margin-top: 20px
}

.view-more:hover {
    text-decoration: underline
}

.service-btn {
    text-align: start;
    font-size: 16px;
    font-weight: 500;
    color: #f5a76c;
    text-decoration: none;
    display: block;
    margin-top: 20px
}

.icon-about {
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%
}

.icon-about img {
    width: 100px;
    height: 100px
}

.text-section h2 {
    font-weight: 700;
    color: #111
}

.text-section p {
    color: #333
}

.image-section img {
    max-width: 100%
}

.about-img {
    margin-right: -95%
}

.team-member {
    text-align: center;
    padding: 20px
}

.team-member img {
    width: 300px;
    height: 400px;
    border-radius: 10px;
    object-fit: cover
}

.team-member h4 {
    color: #d97827;
    font-weight: 700;
    margin-top: 10px
}

.team-member p {
    color: #666;
    margin-top: -5px
}

.card {
    border: none
}

.card img {
    border-radius: 20px !important;
    height: 270px
}

.card-title {
    font-weight: 700;
    font-size: larger;
    color: #181818;
    font-family: reward-head;
    line-height: 2rem
}

.card-text {
    padding-top: 2rem;
    color: #555;
    font-family: paratitle;
    line-height: 1.5rem;
    font-weight: 300;
    font-size: 15px
}

.read-more {
    background-color: #e5895a;
    border: none;
    color: #fff;
    padding: 8px 16px;
    border-radius: 5px;
    text-decoration: none;
    display: inline-block;
    margin-bottom: 1rem
}

.read-more:hover {
    background-color: #e5895a
}

.contact-page {
    background-image: url('../image/image/about us copy.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 100vh;
    position: relative;
    width: 100%;
    height: 100vh;
    z-index: -9999
}

.form-container {
    background: linear-gradient(10deg, #e5895abf 100%, #fff);
    background-blend-mode: darken;
    background-size: cover;
    padding: 30px;
    border-radius: 8px;
    color: #fff;
    width: 100%
}

.form-control {
    margin-bottom: 30px
}

.btn-custom {
    background-color: #0d1b42;
    color: #fff;
    width: 100%
}
.btn-custom:hover{
    background-color: #FFF6F1;
    color: #000000;

}

.contact-card {
    margin-top: -10% ;
    margin-bottom: 5%
}

.contact-title {
    font-size: large;
    font-weight: 400
}

.iti {
    width: 100% !important;
    margin-bottom: 30px
}

.iti__selected-dial-code {
    color: #000;
    display: none
}

.iti__country {
    color: #000
}

#phone {
    padding-left: 51px
}

.pricing-badge {
    display: inline-block;
    padding: 10px 20px;
    font-size: 30px;
    font-weight: 700;
    color: #fff;
    background: linear-gradient(90deg, #0d1b42, #e5895a);
    border-radius: 30px;
    box-shadow: 3px 3px 8px #0003;
    width: 500px;
    text-align: center;
    font-family: reward-head
}

h1 {
    color: #fff
}

.py-7 {
    padding: 4rem
}

.pt {
    padding-top: 2rem
}

.mt {
    margin-top: 1.5rem
}

h6 {
    font-family: reward-head;
    font-size: xx-large;
    font-weight: 700;
    color: #12163f
}

.pb {
    padding-bottom: 1rem
}

p {
    font-family: paratitle
}

.para {
    text-align: center;
    font-family: paratitle
}

.paragraph {
    font-family: paratitle;
    line-height: 2rem;
    font-weight: 400;
    font-size: 18px
}

.dropdown:hover .dropdown-menu {
    display: block;
    margin-top: 0
}

.subtitle {
    font-family: reward-head;
    font-size: xx-large;
    font-weight: 700
}

.bg-color {
    background-color: #fff6f1
}

.nav-item {
    padding-left: 25px
}

.hero-section {
    position: relative;
    background: url('../image/image/Front.jpg') no-repeat center center/cover;
    height: 95vh;
    color: #fff;
    display: flex;
    align-items: center
}

.hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #0009
}

.titleh1 {
    font-weight: 800;
    font-size: 50px;
    font-family: header-font
}

.titlecolor {
    color: #e5895a
}

.hero-content {
    position: relative;
    z-index: 2;
    max-width: 800px
}

.spantitle {
    font-family: spantitle;
    font-size: x-large;
    font-weight: 700
}

.value-box {
    text-align: center
}

.icon-circle {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: auto
}

.icon-circle img {
    width: 80px;
    height: 80px
}

.value-title {
    font-weight: 700;
    color: #181c40;
    margin-top: 15px
}

.value-text {
    color: #333;
    font-size: 14px
}

.swiper {
    width: 100%;
    height: 100%
}

.swiper-slide {
    height: 100px;
    text-align: center;
    font-size: 18px;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center
}

.swiper-button-next,
.swiper-button-prev {
    width: 40px;
    height: 40px;
    background-color: #0d1b37;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    transition: background-color .3s ease, transform .2s ease
}

.swiper-button-next:hover,
.swiper-button-prev:hover {
    background-color: #162b56;
    transform: scale(1.1)
}

.swiper-button-next:after,
.swiper-button-prev:after {
    font-size: 16px;
    font-weight: 700
}

.swiper-button-next {
    right: 10px
}

.swiper-button-prev {
    left: 10px
}

.swiper-text {
    font-family: spantitle;
    font-size: xx-large;
    font-weight: 800
}

/* counter */
.stats-section {
    padding: 50px 0;
    text-align: center;
    overflow-x: hidden; /* Prevent horizontal scroll */
}

.stat-item {
    font-size: 50px;
    font-weight: 700;
    color: #181c40;
}

.stat-text {
    font-size: 16px;
    color: #333;
}

/* Optional: Ensure border is handled well on smaller screens */
@media (max-width: 767.98px) {
    .counter .border-end {
        /* border-right: none !important; */
        /* border-bottom: 1px solid #ddd; */
        padding-bottom: 15px;
        margin-bottom: 15px;
    }
}


.testimonial-section {
    padding: 60px 0;
    background-image: url('../image/png/bg.png')
}

.testimonial-title {
    font-family: spantitle;
    color: #fff;
    font-weight: 700;
    font-size: xx-large
}

.testimonial {
    font-size: 18px;
    background: #fff0;
    display: flex;
    height: 380px
}

.testimonial-card {
    background: #fff0;
    color: #fff;
    border-radius: 15px;
    position: relative;
    border: 1px solid;
    border-color: #fff;
    text-align: start !important
}

.profile-img {
    width: 90px;
    height: 90px;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid white
}

.stars img {
    width: 20px
}

.interaction-icons {
    color: #fff;
    opacity: .8
}

.testimonial-card {
    font-family: spantitle
}

.google-img {
    width: 400px;
    height: 80px
}

.faq {
    background-image: url('../image/png/bg.png');
    height: 500px
}

.faq-title {
    font-family: spantitle;
    color: #fff;
    font-weight: 700;
    font-size: xx-large;
    padding-top: 3rem
}

.accordion {
    /* margin-top: 5% */
    margin-bottom: 5%;
}

.accordion-button {
    background: #fff3;
    color: #fff;
    border: none
}

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

.accordion-button:not(.collapsed) {
    background: #ffffff4d
}

.accordion-item {
    background: transparent;
    border: none;
    margin-top: 20px;
    margin-bottom: 10px
}

.audit-image {
    max-width: 100%;
    height: auto
}

@media (mix-width: 1025px) {
    .title-reward {
       
        padding-left: 23% !important;
    }
    
} 


/* after checking bug fix */
.Business{
    /* width: 60% !important; */
}
.nav-link{
    font-family: paratitle;
}
.pdtop{
    padding-top: 3rem !important;
}


.para-justify{
    text-align: justify;
}