.contact-number,
body {
                font-family: Karla, sans-serif
}

.carousel-wrapper,
.dropdown-menu,
.navbar {
                background-color: var(--background-color)
}

.contact-number,
.dropdown-item,
.guarantee-list li i {
                color: var(--primary-color)
}

.btn-link,
.contact-number,
.navbar-nav .nav-link:hover {
                text-decoration: none
}

.btn-success,
.button,
.go_top {
                cursor: pointer
}

:root {
                --primary-color: #F25C05;
                --secondary-color: #000000;
                --background-color: #ffffff;
                --hover-color: darkorange
}

body {
                margin: 0;
                padding: 0;
                background-color: #f8f9fa
}

.navbar {
                box-shadow: 0 2px 4px rgba(0, 0, 0, .1);
                margin: 10px 20px 0;
                border-radius: 15px;
                padding: 10px 0
}

.carousel-container,
.navbar-center {
                padding-left: 20px;
                padding-right: 20px
}

.navbar-brand img {
                height: 50px;
                width: auto
}

.navbar-nav .nav-link {
                color: var(--primary-color) !important;
                font-weight: 700;
                transition: color .3s
}

.navbar-center {
                flex-grow: 1;
                text-align: center
}

.contact-number {
                font-weight: 700;
                font-size: 1.1rem;
                transition: color .3s
}

.contact-number:hover {
                color: var(--hover-color);
                text-decoration: none
}

.carousel-container {
                margin-top: 40px
}

.carousel-wrapper {
                max-width: 1200px;
                margin: 0 auto;
                border-radius: 8px;
                overflow: hidden;
                box-shadow: 0 4px 8px rgba(0, 0, 0, .1)
}

.carousel-inner {
                position: relative;
                width: 100%;
                padding-top: 56.25%
}

.carousel-item {
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%
}

.carousel-item img {
                width: 100%;
                height: 100%;
                object-fit: cover
}

.carousel-indicators {
                bottom: 15px
}

.carousel-indicators [data-bs-target] {
                background-color: var(--primary-color);
                width: 12px;
                height: 12px;
                border-radius: 50%;
                margin: 0 5px;
                transition: background-color .3s
}

.carousel-indicators .active {
                background-color: var(--hover-color)
}

.dropdown-menu {
                border: none
}

.dropdown-item {
                transition: background-color .3s, color .3s
}

.button,
.icon {
                transition: .3s ease-in-out
}

.dropdown-item:hover {
                background-color: var(--primary-color);
                color: #fff
}

.sticky-top {
                position: sticky;
                top: 10px;
                z-index: 10
}

.button,
.step,
.step-icon {
                position: relative
}

@media (max-width:1200px) {
                .carousel-wrapper {
                                max-width: 1000px
                }
}

@media (max-width:992px) {
                .carousel-wrapper {
                                max-width: 900px
                }
}

.button {
                box-shadow: 0 10px 20px rgba(0, 0, 0, .2);
                padding-block: 0.5rem;
                padding-inline: 1.25rem;
                background-color: #f25c05;
                border-radius: 9999px;
                display: flex;
                align-items: center;
                justify-content: center;
                color: #fff;
                gap: 10px;
                font-weight: 700;
                border: 3px solid #ffffff4d;
                outline: 0;
                overflow: hidden;
                font-size: 15px
}

.icon {
                width: 24px;
                height: 24px
}

.button:hover {
                transform: scale(1.05);
                border-color: #fff9
}

.button .icon {
                transform: translate(4px)
}

.button::before {
                content: "";
                position: absolute;
                width: 100px;
                height: 100%;
                background-image: linear-gradient(120deg, rgba(255, 255, 255, 0) 30%, rgba(255, 255, 255, .8), rgba(255, 255, 255, 0) 70%);
                top: 0;
                left: -100px;
                opacity: .6;
                animation: 1.5s ease-out infinite shine
}

@keyframes shine {
                0% {
                                left: -100px
                }

                60%,
                to {
                                left: 100%
                }
}

.process-section {
                padding: 20px
}

.process-header h2 {
                margin: 10px 0
}

.process-header p {
                font-size: 16px;
                color: #555
}

.process-steps {
                display: flex;
                flex-wrap: wrap;
                justify-content: center;
                gap: 20px;
                margin-top: 30px
}

.step {
                width: 120px;
                text-align: center
}

.step-icon {
                width: 80px;
                height: 80px;
                background-color: #f0f0f0;
                border-radius: 50%;
                margin: 0 auto;
                display: flex;
                justify-content: center;
                align-items: center;
                font-size: 24px
}

.guarantee-list li,
.step-number {
                display: flex;
                align-items: center
}

.step-number {
                position: absolute;
                top: 0;
                left: 0;
                transform: translate(-30%, -40%);
                background-color: transparent;
                width: 30px;
                height: 30px;
                border-radius: 50%;
                justify-content: center;
                font-size: 23px;
                color: #bebdbd;
                font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif, sans-serif;
                font-weight: 400
}

#guarantee-section h2,
.arrange-call-section h2,
.btn-book-call,
.count,
.offer-price {
                font-weight: 700
}

.step-icon i {
                color: #313831
}

.step-desc {
                font-size: 14px;
                color: #555
}

.count,
.icon-color {
                color: #fff
}

.trusted_section {
                padding: 50px 0;
                margin: 0 auto
}

#guarantee-section h2,
.section_title {
                margin-bottom: 30px;
                text-align: center
}

.section_title h2 {
                font-size: 36px;
                margin-bottom: 15px
}

.section_title p {
                font-size: 18px;
                margin-bottom: 40px;
                color: #666
}

.company_logos {
                margin: 0 auto;
                padding: 0 15px
}

.company_logos .item {
                padding: 15px;
                margin: 0 10px;
                text-align: center
}

.accordion .card,
.count {
                margin-bottom: 10px
}

.company_logos .logo img {
                filter: grayscale(100%);
                transition: filter .3s ease-in-out, transform .3s;
                max-width: 100%;
                margin: 0 auto
}

.company_logos .logo img:hover {
                filter: grayscale(0%);
                transform: scale(1.05)
}

#company_slider .owl-item {
                display: flex;
                justify-content: center;
                align-items: center
}

.stats-container {
                background-color: #e64a19;
                border-radius: 15px
}

.stats-item {
                padding: 20px 0;
                position: relative
}

.count {
                font-size: 2.5rem
}

.text {
                font-size: 1.1rem;
                margin-bottom: 0;
                color: #d8f3f0
}

.stats-item:after {
                content: '|';
                position: absolute;
                color: #fff;
                font-size: 2rem;
                top: 50%;
                transform: translateY(-50%);
                right: 0
}

.stats-item:nth-child(2n):after {
                display: none
}

@media (max-width:768px) {

                .contact-number,
                .navbar-center,
                .text {
                                font-size: 1rem
                }

                .navbar-brand img {
                                height: 40px
                }

                .navbar {
                                margin: 5px 10px 0;
                                padding: 8px 0
                }

                .navbar-center {
                                padding-left: 10px;
                                padding-right: 10px
                }

                .btn {
                                font-size: 0.9rem;
                                padding: 0.375rem 0.75rem
                }

                .process-steps {
                                gap: 10px
                }

                .step {
                                width: calc(33.33% - 10px)
                }

                .count {
                                font-size: 2rem
                }

                .stats-item {
                                padding: 20px 10px;
                                border-right: none
                }
}

@media (max-width:576px) {

                .navbar-center,
                .navbar-nav .nav-link,
                .text {
                                font-size: .9rem
                }

                .navbar {
                                margin: 2px 5px 0;
                                padding: 5px 0
                }

                .navbar-brand img {
                                height: 35px
                }

                .navbar-center {
                                padding-left: 5px;
                                padding-right: 5px
                }

                .contact-number {
                                font-size: 0.85rem
                }

                .btn {
                                font-size: 0.8rem;
                                padding: 0.25rem 0.5rem
                }

                .d-flex {
                                gap: 0.25rem
                }

                .carousel-indicators [data-bs-target] {
                                width: 10px;
                                height: 10px;
                                margin: 0 3px
                }

                .count {
                                font-size: 1.8rem
                }

                .stats-item:after {
                                font-size: 1.5rem
                }
}

@media (max-width:480px) {
                .navbar {
                                margin: 2px 2px 0;
                                padding: 3px 0
                }

                .navbar-brand img {
                                height: 30px
                }

                .navbar-center {
                                padding-left: 2px;
                                padding-right: 2px
                }

                .contact-number {
                                font-size: 0.75rem;
                                white-space: nowrap
                }

                .btn {
                                font-size: 0.75rem;
                                padding: 0.2rem 0.4rem
                }

                .navbar-nav .nav-link {
                                font-size: 0.8rem;
                                padding: 0.25rem 0.5rem
                }

                .dropdown-menu {
                                font-size: 0.8rem
                }
}

@media (max-width:360px) {
                .contact-number {
                                font-size: 0.7rem
                }

                .navbar-brand img {
                                height: 25px
                }

                .btn {
                                font-size: 0.7rem;
                                padding: 0.15rem 0.3rem
                }
}

#guarantee-section {
                padding: 40px;
                background-color: #f9f9f9;
                margin: 2px auto
}

.guarantee-list {
                list-style-type: none;
                padding: 0
}

.guarantee-list li {
                font-size: 13px;
                margin-bottom: 20px
}

.guarantee-list li i {
                font-size: 1.5rem;
                margin-right: 15px
}

.arrange-call-section {
                background-color: transparent
}

.call-card {
                background-color: var(--primary-color);
                color: #fff;
                border-radius: 10px;
                padding: 40px;
                max-width: 400px;
                margin: 0 auto;
                box-shadow: 0 4px 8px rgba(0, 0, 0, .1)
}

.arrange-call-section p {
                font-size: 1rem;
                line-height: 1.5
}

.btn-book-call {
                background-color: #fff;
                color: #ff6f3c;
                border-radius: 5px;
                border: 2px solid #fff
}

.btn-book-call i {
                margin-right: 8px
}

.btn-book-call:hover {
                background-color: #ff6f3c;
                color: #fff;
                border: 2px solid #fff
}

.btn-link,
.btn-link.collapsed,
.play-btn i,
.play-btn i:hover {
                color: var(--primary-color)
}

.play-btn i:hover {
                opacity: .8
}

#videoModal .modal-body {
                padding: 0
}

#modalVideo {
                width: 100%;
                height: auto;
                border-radius: 10px
}

.owl-dots {
                text-align: center;
                margin-top: 20px
}

.owl-dot {
                display: inline-block;
                margin: 0 5px
}

.owl-dot span {
                width: 12px;
                height: 12px;
                background: #ddd;
                display: block;
                border-radius: 50%
}

.owl-dot.active span {
                background: var(--primary-color)
}

.btn-link {
                transition: color .3s
}

.btn-link i.icon_faq {
                font-size: 16px
}

.card-header {
                background-color: #f8f9fa;
                padding: 15px
}

.card-body {
                background-color: #fff;
                padding: 20px
}

.card-header button {
                text-align: left
}

.btn-link:not(.collapsed) {
                color: var(--primary-color) !important
}

.go_top {
                position: fixed;
                bottom: 30px;
                left: 30px;
                z-index: 1000;
                margin-bottom: 20px
}

.progress-circle {
                position: relative;
                width: 60px;
                height: 60px
}

.circle {
                width: 100%;
                height: 100%;
                background-color: #ff5722;
                border-radius: 50%;
                display: flex;
                align-items: center;
                justify-content: center;
                box-shadow: 0 4px 10px rgba(0, 0, 0, .2);
                transition: background-color .3s;
                position: absolute;
                top: 0;
                left: 0
}

.circle:hover {
                background-color: #e64a19
}

.up-icon {
                color: #fff;
                font-size: 24px;
                position: relative;
                z-index: 1
}

circle {
                fill: none;
                stroke-width: 4
}

.progress {
                stroke: #ffffff;
                stroke-dasharray: 176;
                stroke-dashoffset: 176;
                transition: stroke-dashoffset .5s
}

.sticky-bar {
                position: fixed;
                bottom: 0;
                width: 100%;
                background-color: #f5f5f5;
                z-index: 9999;
                padding: 15px;
                box-shadow: 0 -2px 10px rgba(0, 0, 0, .2);
                border-radius: 15px
}

.offer-price {
                font-size: 16px
}

.original-price {
                font-size: 13px;
                margin-bottom: 5px
}

.btn-success {
                font-size: 16px;
                background-color: #28a745;
                border: none
}

.btn-success:hover {
                background-color: #218838
}

@media (min-width:768px) {
                .btn-success {
                                width: auto
                }
}