.owl-item .animate_up {
    position: relative;
    display: block;
    overflow: hidden;
    opacity: 0;
    transform: perspective(400px) rotateY(0deg) translateY(-120px);
    transform-origin: center bottom;
    transition: all 1000ms ease 0s;
    z-index: 10;
}

.owl-item.active .animate_up {
    transform: perspective(400px) rotateY(0deg) translateY(0px);
    transition-delay: 1000ms;
    opacity: 1 !important;
    visibility: visible !important;
}

.owl-item .animate_down {
    position: relative;
    display: block;
    overflow: hidden;
    opacity: 0;
    transform: perspective(400px) rotateY(0deg) translateY(120px);
    transform-origin: center bottom;
    transition: all 1000ms ease 0s;
    z-index: 10;
}

.owl-item.active .animate_down {
    transform: perspective(400px) rotateY(0deg) translateY(0px);
    transition-delay: 1000ms;
    opacity: 1 !important;
    visibility: visible !important;
}

.owl-item .animate_left {
    position: relative;
    display: block;
    overflow: hidden;
    opacity: 0;
    transform: perspective(400px) rotateY(0deg) translateX(120px);
    transform-origin: center bottom;
    transition: all 1000ms ease 0s;
    z-index: 10;
}

.owl-item.active .animate_left {
    transform: perspective(400px) rotateY(0deg) translateX(0px);
    transition-delay: 1000ms;
    opacity: 1 !important;
    visibility: visible !important;
}

.owl-item .animate_right {
    position: relative;
    display: block;
    overflow: hidden;
    opacity: 0;
    transform: perspective(400px) rotateY(0deg) translateX(-120px);
    transform-origin: center bottom;
    transition: all 1000ms ease 0s;
    z-index: 10;
}

.owl-item.active .animate_right {
    transform: perspective(400px) rotateY(0deg) translateX(0px);
    transition-delay: 1000ms;
    opacity: 1 !important;
    visibility: visible !important;
}

.slider.style_one .slide-item-content {
    position: relative;
    overflow: hidden;
}

.slider.style_one .slide-item-content .image-layer {
    position: absolute;
    top: 0px;
    left: 0px;
    height: 100%;
    width: 100%;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: cover !important;
}

.slider.style_one .slide-item-content .container {
    position: relative;
    z-index: 10;
    padding: 0px 15px;
}

.slider.style_one .slide-item-content .slider_content {
    position: relative;
    padding: 140px 0px 206px;
    z-index: 11;
}

.slider.style_one .slide-item-content .slider_content h1 {
    font-size: 56px;
    line-height: 60px;
    font-weight: 800;
    margin-bottom: 20px;
    color: rgb(17, 17, 17);
    opacity: 0;
    font-family: var(--primary-font);
    transition: all 0.9s ease-in-out 0s;
}

.slider.style_one .slide-item-content .slider_content h6 {
    font-size: 13px;
    background: rgba(var(--snh-red-rgb), 0.1);
    padding: 5px 12px;
    line-height: 19px;
    display: inline-block;
    font-weight: 500;
    margin-bottom: 25px;
    border-radius: 50px;
    color: var(--snh-red);
    opacity: 0;
    text-transform: uppercase;
    font-family: var(--secondary-font);
    transition: all 0.9s ease-in-out 0s;
}

.slider.style_one .slide-item-content .slider_content p {
    font-size: 18px;
    line-height: 30px;
    font-weight: 400;
    color: rgb(17, 17, 17);
    margin-bottom: 30px;
    opacity: 0;
    transition: all 0.9s ease-in-out 0s;
}

.slider.style_one .slide-item-content .slider_content .btn-style-one {
    opacity: 0;
    transition: all 0.9s ease-in-out 0s;
}

.slider.style_one .owl-item.active .slide-item-content .image-layer {
    opacity: 1;
}

.slider.style_one .owl-item.active .slide-item-content .slider_content h1 {
    opacity: 1;
}

.slider.style_one .owl-item.active .slide-item-content .slider_content h6 {
    opacity: 1;
}

.slider.style_one .owl-item.active .slide-item-content .slider_content p {
    opacity: 1;
}

.slider.style_one .owl-item.active .slide-item-content .slider_content .theme-btn.one {
    opacity: 1;
}

.slider.style_one .slide-item-content .container .slider-image {
    position: relative;
    z-index: 9;
    overflow: visible;
    margin-right: -122px;
    padding-top: 50px;
    margin-top: 62px;
}

.slider.style_one .slide-item-content .container .slider-image::before {
    position: absolute;
    top: 0px;
    left: calc(50% - 255.5px);
    width: 511px;
    height: 511px;
    content: "";
    z-index: -1;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.5);
}

.oul_nav_none .owl-nav {
    display: none;
}

.owl_dots_none .owl-dots {
    display: none;
}
/* ===== Improved Responsive Banner (No Desktop Changes) ===== */
@media (max-width: 992px) {
  .slider.style_one .slide-item-content .slider_content {
    padding: 60px 0 80px !important;
    text-align: left !important;
  }

  .slider.style_one .slide-item-content .container .slider-image {
    margin-top: -30px !important; /* move image upward */
    margin-right: -30px !important; /* move image slightly right */
    padding-top: 0 !important;
    text-align: right !important;
  }

  .slider.style_one .slide-item-content .container .slider-image img {
    max-width: 85% !important;
    height: auto !important;
  }

  .slider.style_one .slide-item-content .slider_content h1 {
    font-size: 36px !important;
    line-height: 42px !important;
  }

  .slider.style_one .slide-item-content .slider_content p {
    font-size: 16px !important;
    line-height: 26px !important;
  }

  .slider.style_one .slide-item-content .slider_content h6 {
    font-size: 12px !important;
    margin-bottom: 12px !important;
  }
}

@media (max-width: 768px) {
  .slider.style_one .slide-item-content .slider_content {
    padding: 50px 0 60px !important;
    text-align: left !important;
  }

  .slider.style_one .slide-item-content .container .slider-image {
    margin-top: -60px !important; /* move more upward */
    margin-right: -40px !important; /* shift right */
    text-align: right !important;
  }

  .slider.style_one .slide-item-content .container .slider-image img {
    max-width: 80% !important;
  }

  .slider.style_one .slide-item-content .slider_content h1 {
    font-size: 30px !important;
    line-height: 38px !important;
  }

  .slider.style_one .slide-item-content .slider_content p {
    font-size: 15px !important;
    line-height: 24px !important;
  }
}

@media (max-width: 480px) {
  .slider.style_one .slide-item-content .slider_content {
    padding: 40px 0 50px !important;
    text-align: left !important;
  }

  .slider.style_one .slide-item-content .container .slider-image {
    margin-top: -50px !important;
    margin-right: -50px !important; /* move image further right */
    text-align: right !important;
  }

  .slider.style_one .slide-item-content .container .slider-image img {
    max-width: 78% !important;
  }

  .slider.style_one .slide-item-content .slider_content h1 {
    font-size: 26px !important;
    line-height: 34px !important;
  }

  .slider.style_one .slide-item-content .slider_content p {
    font-size: 14px !important;
    line-height: 22px !important;
  }
}


.brand-outer-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 30px;
}

.single-brand-item {
    position: relative;
    padding: 40px 10px;
    border-radius: 10px;
    text-align: center;
    max-width: 191px;
    width: 100%;
    border: 1px solid rgb(229, 229, 229);
    transition: all 500ms ease 0s;
}

.single-brand-item:hover {
    border-color: transparent;
    box-shadow: rgba(17, 17, 17, 0.07) 0px 10px 50px;
}

.single-brand-item .brand-image {
    height: 60px;
    line-height: 60px;
    margin-bottom: 20px;
}

.single-brand-item .brand-title h6 {
    font-size: 16px;
    line-height: 26px;
    font-weight: 500;
    color: rgb(17, 17, 17);
    font-family: var(--secondary-font);
}

.single-brand-item .brand-title h6 a {
    color: rgb(17, 17, 17);
}

.single-brand-item .brand-title h6 a:hover {
    color: var(--theme-color);
}

.single-popular-car-block {
    position: relative;
    padding: 10px;
    margin-bottom: 30px;
    border-radius: 10px;
    background-color: rgb(255, 255, 255);
    box-shadow: rgba(17, 17, 17, 0.08) 0px 20px 80px;
}
.single-popular-car-block.style-three{
    padding: 0;
    box-shadow: none;
}
.style-three .single-popular-car-content{
    margin: 0 20px;
    padding: 30px;
    margin-top: -48px;
    border-radius: 10px;
    background-color: rgb(255, 255, 255);
    box-shadow: rgba(17, 17, 17, 0.08) 0px 20px 80px;
}
.style-three .single-popular-car-rating{
    top: 38px;
}
.single-popular-car-image {
    position: relative;
    border-radius: 6px;
    overflow: hidden;
}
.single-popular-car-image img {
    width: 100%;
    transform: scale(1.0);
    transition: all 500ms;
}
.single-popular-car-block:hover .single-popular-car-image img {
    transform: scale(1.15);
}
.single-popular-car-rent-per-day {
    position: absolute;
    top: 18px;
    right: 10px;
    font-size: 14px;
    color: var(--body-color);
    line-height: 30px;
    font-weight: 400;
    padding: 9px 20px 5px;
    text-transform: capitalize;
    font-family: var(--primary-font);
    background-color: rgb(255, 255, 255);
    border-radius: 90px;
}
.single-popular-car-rent-per-day span {
    font-size: 28px;
    color: var(--theme-color);
}
.single-popular-car-content {
    position: relative;
    padding: 20px;
}
.single-popular-car-rating {
    position: absolute;
    right: 20px;
    top: 28px;
    font-size: 14px;
    font-weight: 400;
    padding: 0px 10px;
    line-height: 22px;
    border-radius: 50px;
    display: flex;
    align-items: center;
    gap: 5px;
    border: 1px solid rgb(229, 229, 229);
}
.single-popular-car-rating i {
    font-size: 16px;
    color: var(--rating-color);
}
h5.single-popular-car-title {
    font-size: 24px;
    font-weight: 500;
    line-height: 36px;
    color: rgb(17, 17, 17);
    font-family: var(--primary-font);
    margin-bottom: 15px;
}
p.single-popular-car-text {
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
    color: rgb(17, 17, 17);
    font-family: var(--secondary-font);
    padding-bottom: 25px;
}
.single-popular-car-info {
    margin: 25px 0px;
}
.single-popular-car-info li {
    font-size: 16px;
    font-weight: 400;
    color: rgb(17, 17, 17);
    line-height: 30px;
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 8px 0px;
    font-family: var(--secondary-font);
}
.single-popular-car-info li i {
    font-size: 22px;
    color: var(--theme-color);
}
.single-popular-car-book-btn a {
    display: block;
    text-align: center;
}
.car-type-outer-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 30px;
}
.car-type-item {
    position: relative;
    max-width: 191px;
    width: 100%;
    cursor: pointer;
    padding: 50px 10px 40px;
    border-radius: 10px;
    text-align: center;
    border: 1px solid rgb(229, 229, 229);
    transition: all 500ms ease 0s;
}
.dark-bg .car-type-item {
    border: none;
}
.home-three .car-type-item {
    border: none;
}
.home-three .car-type-item:hover {
    box-shadow: none;
}
.home-three .car-type-item .car-image {
    height: 100px;
}
.car-type-item:hover {
    border-color: transparent;
    box-shadow: rgba(17, 17, 17, 0.07) 0px 10px 50px;
}
.car-type-item .car-image {
    position: relative;
    height: 60px;
    line-height: 60px;
    margin-bottom: 12px;
}
.home-three .car-type-item .car-image {
    z-index: 1;
}
.home-three .car-type-item .car-image .shape {
    position: absolute;
    top: -35px;
    z-index: -1;
    left: calc(50% - 60px);
    opacity: 0;
    transform: rotate(0deg);
    transition: all 2000ms ease 0s;
}
.home-three .car-type-item:hover .car-image .shape {
    opacity: 1;
    transform: rotate(360deg);
}
.car-type-item .car-name h6 {
    font-size: 16px;
    line-height: 26px;
    font-weight: 500;
    color: rgb(17, 17, 17);
    font-family: var(--secondary-font);
}
.car-type-item .car-name h6 a {
    color: rgb(17, 17, 17);
}
.car-type-item .car-name h6 a:hover {
    color: var(--theme-color);
}
.dark-bg .car-type-item .car-name h6 a {
    color: rgb(255, 255, 255);
}
.dark-bg .car-type-item .car-name h6 a:hover {
    color: var(--theme-color);
}
.why-chooseus-block {
    position: relative;
    padding: 50px 40px 45px;
    background: rgb(255, 255, 255);
    border-radius: 10px;
    margin-bottom: 30px;
    box-shadow: rgba(17, 17, 17, 0.07) 0px 10px 50px;
}
.why-chooseus-icon {
    width: 90px;
    height: 90px;
    text-align: center;
    line-height: 90px;
    border-radius: 10px;
    border: 1px solid rgb(17, 17, 17);
    margin-bottom: 30px;
    font-size: 28px;
    color: rgb(17, 17, 17);
}
.why-chooseus-icon.light {
    color: rgb(255, 255, 255);
    border-color: var(--theme-color);
    background-color: var(--theme-color);
}
h5.why-chooseus-title {
    font-size: 24px;
    line-height: 32px;
    font-weight: 600;
    color: rgb(13, 13, 13);
    text-transform: capitalize;
    margin-bottom: 20px;
}
p.why-chooseus-text {
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
    color: var(--body-color);
    font-family: var(--secondary-font);
}
.gallery-image-block {
    position: relative;
    overflow: hidden;
}
.gallery-image-block img{
    transform: scale(1.0);
    transition: all 500ms;
}
.gallery-image-block:hover img{
    transform: scale(1.15);
}
.gallery-image-block .lightbox-image {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    opacity: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    transform: scale(0);
    background-color: rgba(var(--snh-red-rgb), 0.6);
}
.gallery-image-block .lightbox-image img {
    width: auto;
}
.gallery-image-block:hover .lightbox-image {
    opacity: 1;
    transform: scale(1);
}
.featured-car-section .owl-nav {
    opacity: 0;
    visibility: hidden;
    transition: all 500ms ease 0s;
}
.featured-car-section:hover .owl-nav {
    opacity: 1;
    visibility: visible;
}
.featured-car-section .owl-carousel .owl-stage-outer {
    overflow: visible;
}
.featured-car-section .owl-carousel .owl-item {
    opacity: 0;
    visibility: hidden;
    transition: all 500ms ease 0s;
}
.featured-car-section .owl-carousel .owl-item.active {
    opacity: 1;
    visibility: visible;
}
.single-featured-car-block {
    position: relative;
    padding: 10px;
    margin-bottom: 30px;
    border-radius: 10px;
    background-color: rgb(255, 255, 255);
    box-shadow: rgba(17, 17, 17, 0.08) 0px 20px 80px;
}
.dark-bg .single-featured-car-block {
    box-shadow: rgba(0, 0, 0, 0.25) 0px 8.69px 43.46px;
    background: rgba(255, 255, 255, 0.1);
}
.single-featured-car-image {
    position: relative;
    border-radius: 6px;
    overflow: hidden;
}
.single-featured-car-image img {
    width: 100%;
    transform: scale(1.0);
    transition: all 500ms;
}
.single-featured-car-image:hover img {
    transform: scale(1.15);
}
.single-featured-car-rent-per-day {
    position: absolute;
    top: 18px;
    right: 10px;
    font-size: 14px;
    color: var(--body-color);
    line-height: 30px;
    font-weight: 400;
    padding: 9px 20px 5px;
    text-transform: capitalize;
    font-family: var(--primary-font);
    background-color: rgb(255, 255, 255);
    border-radius: 90px;
}
.dark-bg .single-featured-car-rent-per-day {
    color: rgb(255, 255, 255);
    background: var(--theme-color);
}
.single-featured-car-rent-per-day span {
    font-size: 28px;
    color: var(--theme-color);
}
.dark-bg .single-featured-car-rent-per-day span {
    color: rgb(255, 255, 255);
}
.single-featured-car-content {
    position: relative;
    padding: 20px;
}
.single-featured-car-rating {
    position: absolute;
    right: 20px;
    top: 28px;
    font-size: 14px;
    font-weight: 400;
    padding: 0px 10px;
    line-height: 22px;
    border-radius: 50px;
    display: flex;
    align-items: center;
    gap: 5px;
    border: 1px solid rgb(229, 229, 229);
}
.single-featured-car-rating i {
    font-size: 16px;
    color: var(--rating-color);
}
.dark-bg .single-featured-car-rating {
    color: var(--primary-color);
    background: rgb(255, 186, 7);
    border-color: rgb(255, 186, 7);
}
.dark-bg .single-featured-car-rating i {
    color: var(--primary-color);
}
h5.single-featured-car-title {
    font-size: 24px;
    font-weight: 500;
    line-height: 36px;
    font-family: var(--primary-font);
    margin-bottom: 15px;
}
h5.single-featured-car-title a {
    color: rgb(17, 17, 17);
}
.dark-bg h5.single-featured-car-title a {
    color: rgb(255, 255, 255);
}
h5.single-featured-car-title a:hover {
    color: var(--theme-color);
}
p.single-featured-car-text {
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
    color: rgb(17, 17, 17);
    font-family: var(--secondary-font);
    padding-bottom: 25px;
}
.dark-bg p.single-featured-car-text {
    color: rgb(171, 171, 171);
}
.dark-bg .single-featured-car-block .border-divider {
    background: rgba(255, 255, 255, 0.1);
}
.single-featured-car-info {
    margin: 25px 0px;
}
.single-featured-car-info li {
    font-size: 16px;
    font-weight: 400;
    color: rgb(17, 17, 17);
    line-height: 30px;
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 8px 0px;
    font-family: var(--secondary-font);
}
.dark-bg .single-featured-car-info li {
    color: rgb(171, 171, 171);
}
.single-featured-car-info li i {
    font-size: 22px;
    color: var(--theme-color);
}
.single-featured-car-book-btn a {
    display: block;
    text-align: center;
}
.vedio-section-outer {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 200px 0px;
    border-radius: 10px;
    background-repeat: no-repeat;
    background-position: center center;
    overflow: hidden;
}
.dark-bg .vedio-section-outer {
    border-radius: 0px;
}
.vedio-section-outer::before {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    content: "";
    z-index: -1;
    background: rgba(0, 0, 0, 0.3);
}
.vedio-section-outer .lightbox-image {
    position: relative;
    width: 100px;
    height: 100px;
    font-size: 28px;
    display: inline-block;
    line-height: 108px;
    text-align: center;
    background: rgb(255, 255, 255);
    border-radius: 50%;
    cursor: pointer;
    color: var(--theme-color);
}
.vedio-section-outer .lightbox-image::before,
.vedio-section-outer .lightbox-image::after {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background: transparent;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    content: "";
    position: absolute;
    box-shadow: rgba(255, 255, 255, 0.5) 0px 0px 0px 0px;
    animation: 3s ease 0s infinite normal none running ripple;
    transition: all 0.4s ease 0s;
}
.vedio-section-outer .lightbox-image::after {
    animation-delay: 0.6s;
}
.blog-post-one {
    position: relative;
    margin-bottom: 30px;
}
.blog-post-image {
    overflow: hidden;
    border-radius: 10px;
}
.blog-post-image img {
    width: 100%;
    transform: scale(1.0);
    transition: all 500ms;
}
.blog-post-one:hover .blog-post-image img {
    transform: scale(1.15);
}
.blog-post-content .post-info {
    display: flex;
    align-items: center;
    gap: 30px;
    margin-top: 30px;
    margin-bottom: 15px;
}
.blog-post-content .post-info .post-tag a {
    font-size: 13px;
    line-height: 19px;
    display: inline-block;
    font-weight: 500;
    border-radius: 50px;
    color: var(--snh-red);
    padding: 5px 12px;
    background: rgba(var(--snh-red-rgb), 0.05);
    border: 1px solid rgba(var(--snh-red-rgb), 0.2);
    text-transform: uppercase;
    font-family: var(--secondary-font);
}
.blog-post-content .post-info li {
    font-size: 16px;
    line-height: 26px;
    color: var(--body-color);
    font-weight: 400;
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: var(--secondary-font);
}
.blog-post-content .post-info li i {
    color: rgb(0, 0, 0);
    font-size: 20px;
}
.blog-post-content .post-title {
    font-size: 24px;
    line-height: 30px;
    font-weight: 600;
    font-family: var(--primary-font);
}
.blog-post-content .post-title a {
    color: rgb(17, 17, 17);
    display: inline-block;
    transition: all 500ms ease 0s;
}
.blog-post-content .post-title a:hover {
    color: var(--theme-color);
}
.slider.style_two .slide-item-content {
    position: relative;
    overflow: hidden;
}
.slider.style_two .slide-item-content .image-layer {
    position: absolute;
    top: 0px;
    left: 0px;
    height: 100%;
    width: 100%;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.slider.style_two .slide-item-content .container {
    position: relative;
    z-index: 10;
    padding: 0px 15px;
}
.slider.style_two .slide-item-content .slider_content {
    position: relative;
    padding: 220px 0px 230px;
    z-index: 11;
    max-width: 600px;
}
.slider.style_two .slide-item-content .slider_content h6 {
    font-size: 13px;
    line-height: 19px;
    display: inline-block;
    font-weight: 500;
    margin-bottom: 25px;
    border-radius: 50px;
    color: var(--snh-red);
    padding: 5px 0px;
    opacity: 0;
    text-transform: uppercase;
    font-family: var(--secondary-font);
    transition: all 0.9s ease-in-out 0s;
}
.slider.style_two .slide-item-content .slider_content h1 {
    font-size: 56px;
    line-height: 60px;
    font-weight: 600;
    margin-bottom: 20px;
    color: rgb(255, 255, 255);
    opacity: 0;
    font-family: var(--primary-font);
    transition: all 0.9s ease-in-out 0s;
}
.slider.style_two .slide-item-content .slider_content p {
    font-size: 18px;
    line-height: 30px;
    font-weight: 400;
    color: rgb(171, 171, 171);
    margin-bottom: 30px;
    opacity: 0;
    transition: all 0.9s ease-in-out 0s;
}
.slider.style_two .slide-item-content .slider_content .btn-style-four {
    opacity: 0;
    transition: all 0.9s ease-in-out 0s;
}
.slider.style_two .owl-item.active .slide-item-content .image-layer {
    opacity: 1;
}
.slider.style_two .owl-item.active .slide-item-content .slider_content h1 {
    opacity: 1;
}
.slider.style_two .owl-item.active .slide-item-content .slider_content h6 {
    opacity: 1;
}
.slider.style_two .owl-item.active .slide-item-content .slider_content p {
    opacity: 1;
}
.slider.style_two .owl-item.active .slide-item-content .slider_content .btn-style-four {
    opacity: 1;
}
.slider.style_two .slide-item-content .container .slider-image {
    position: relative;
    z-index: 9;
    overflow: visible;
    margin-right: -122px;
    padding-top: 50px;
    margin-top: 62px;
}
.slider.style_two .slide-item-content .container .slider-image::before {
    position: absolute;
    top: 0px;
    left: calc(50% - 255.5px);
    width: 511px;
    height: 511px;
    content: "";
    z-index: -1;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.5);
}
.works-process-section {
    position: relative;
}
.works-process-section::before {
    position: absolute;
    top: 0px;
    left: 0px;
    bottom: -100px;
    width: 100%;
    height: 100%;
    content: "";
    z-index: -1;
    background-image: url("..//images/shape/shape-1.png");
    background-position: center center;
    background-repeat: no-repeat;
}
.works-process-block {
    margin-bottom: 30px;
}
.works-process-block-icon {
    position: relative;
    width: 80px;
    height: 80px;
    display: inline-block;
    color: rgb(6, 7, 2);
    font-size: 30px;
    line-height: 80px;
    text-align: center;
    border-radius: 20px;
    background: rgb(245, 167, 126);
    margin-bottom: 25px;
}
.colmun:nth-child(1) .works-process-block-icon {
    background: rgb(245, 167, 126);
}
.colmun:nth-child(2) .works-process-block-icon {
    background: rgb(132, 98, 239);
}
.colmun:nth-child(3) .works-process-block-icon {
    background: rgb(132, 221, 177);
}
.colmun:nth-child(4) .works-process-block-icon {
    background: rgb(248, 203, 118);
}
.works-process-block-icon::before {
    position: absolute;
    top: -10px;
    left: -10px;
    width: 40px;
    height: 40px;
    content: "";
    font-size: 24px;
    font-weight: 600;
    font-family: var(--primary-font);
    line-height: 35px;
    text-align: center;
    border-radius: 50%;
    background: rgb(255, 255, 255);
    color: rgb(6, 7, 2);
    border: 3px solid rgb(6, 7, 2);
}
.colmun:nth-child(1) .works-process-block-icon::before {
    content: "1";
}
.colmun:nth-child(2) .works-process-block-icon::before {
    content: "2";
}
.colmun:nth-child(3) .works-process-block-icon::before {
    content: "3";
}
.colmun:nth-child(4) .works-process-block-icon::before {
    content: "4";
}
.inner-page .works-process-block-icon::before {
    border-color: rgb(255, 255, 255);
}
.inner-page .colmun:nth-child(1) .works-process-block-icon::before {
    background: rgb(245, 167, 126);
}
.inner-page .colmun:nth-child(2) .works-process-block-icon::before {
    background: rgb(132, 98, 239);
}
.inner-page .colmun:nth-child(3) .works-process-block-icon::before {
    background: rgb(132, 221, 177);
}
.inner-page .colmun:nth-child(4) .works-process-block-icon::before {
    background: rgb(248, 203, 118);
}
.works-process-block-title {
    font-size: 24px;
    line-height: 36px;
    font-weight: 600;
    font-family: var(--primary-font);
}
.works-process-block-title a {
    color: rgb(255, 255, 255);
    transition: all 500ms ease 0s;
}
.inner-page .works-process-block-title a {
    color: rgb(17, 17, 17);
}
.works-process-block-title a:hover {
    color: var(--theme-color);
}
.promotional-banner-block {
    position: relative;
    overflow: hidden;
    padding: 35px 30px 40px;
    border-radius: 10px;
    margin-bottom: 30px;
    background: rgba(255, 255, 255, 0.1);
}
.promotional-banner-image {
    position: absolute;
    bottom: 0px;
    right: 0px;
}
.clomun:nth-child(1) .promotional-banner-image {
    right: -50px;
    bottom: 5px;
}
.clomun:nth-child(2) .promotional-banner-image {
    right: -143px;
    bottom: 13px;
}
.clomun:nth-child(3) .promotional-banner-image {
    right: -75px;
    bottom: 12px;
}
.promotional-banner-block span {
    font-size: 13px;
    line-height: 20px;
    color: var(--theme-color);
    font-weight: 500;
    display: block;
    margin-bottom: 10px;
    text-transform: uppercase;
    font-family: var(--secondary-font);
}
.promotional-banner-block h2 {
    font-size: 36px;
    line-height: 56px;
    color: rgb(255, 255, 255);
    font-weight: 600;
    margin-bottom: 15px;
    text-transform: capitalize;
    font-family: var(--primary-font);
}
.clomun:nth-child(1) .promotional-banner-block h2 {
    font-size: 48px;
}
.promotional-banner-block h6 {
    font-size: 16px;
    line-height: 30px;
    color: rgb(171, 171, 171);
    font-weight: 500;
    margin-bottom: 25px;
    font-family: var(--secondary-font);
}
.dark-bg .view-all-btn .btn-style-five {
    padding: 15px 30px;
    background-color: var(--theme-color);
}
.dark-bg .view-all-btn .btn-style-five::after {
    background: var(--primary-color);
}
.brand-section-2.home-three{
    border-bottom: 1px solid rgba(142, 123, 195, 0.2);
}
.brand-section-2 .brand-outer-box-2 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}
.brand-section-2.dark-home .brand-outer-box-2 {
    border-bottom: 1px solid rgba(142, 123, 195, 0.2);
}
.single-brand-item-2 {
    flex-grow: 1;
    padding: 60px 20px;
    display: inline-block;
    text-align: center;
    border-right: 1px solid rgba(142, 123, 195, 0.2);
}
.single-brand-item-2:last-child {
    border-right: 0px;
}
.single-brand-item-2 .brand-image img {
    opacity: 0.5;
    cursor: pointer;
    transition: all 500ms ease 0s;
}
.single-brand-item-2 .brand-image:hover img {
    opacity: 1;
}
.google-map-outer {
    position: relative;
    display: block;
    text-align: center;
}
.google-map-outer::before {
    position: absolute;
    top: -70px;
    left: calc(50% - 328px);
    width: 656px;
    height: 656px;
    content: "";
    z-index: -1;
    border-radius: 50%;
    background: rgba(184, 13, 13, 0.4);
    mix-blend-mode: multiply;
    filter: blur(1.5rem);
}
.google-map-outer .cuntry-tag {
    position: absolute;
    top: calc(50% - 50px);
    right: calc(50% - 325px);
    display: flex;
    padding: 2px 12px 2px 2px;
    align-items: center;
    border-radius: 60px;
    gap: 8px;
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
    color: rgb(255, 255, 255);
    font-family: var(--secondary-font);
    text-transform: capitalize;
    background-color: rgb(10, 8, 3);
}
.google-map-outer .cuntry-tag .cuntry-flug {
    width: 20px;
    height: 20px;
    line-height: 22px;
    background: var(--theme-color);
    border-radius: 50%;
}
.testimonial-block-one {
    position: relative;
    padding: 40px;
    margin-bottom: 50px;
    border-radius: 10px;
    box-shadow: rgba(0, 0, 0, 0.25) 0px 8.69px 43.46px;
    background: rgba(255, 255, 255, 0.1);
}
.testimonial-block-one.style-two {
    box-shadow: rgba(0, 0, 0, 0.07) 0px 10px 50px;
}
.testimonial-block-one .inner-box {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 30px;
}
.testimonial-block-one .author-box {
    display: flex;
    align-items: center;
    gap: 11px;
}
.testimonial-block-one .author-info h5 {
    font-size: 24px;
    line-height: 30px;
    color: rgb(255, 255, 255);
    font-weight: 600;
    font-family: var(--primary-font);
}
.testimonial-block-one.style-two .author-info h5 {
    color: rgb(17, 17, 17);
}
.testimonial-block-one .author-info span {
    font-size: 16px;
    line-height: 30px;
    color: rgb(255, 255, 255);
    font-weight: 400;
    font-family: var(--secondary-font);
}
.testimonial-block-one.style-two .author-info span {
    color: var(--body-color);
}
.testimonial-block-one .author-rating {
    display: flex;
    align-items: center;
    gap: 7px;
}
.testimonial-block-one .author-rating li {
    color: rgb(255, 200, 68);
}
.testimonial-block-one .author-comments p {
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
    color: rgb(255, 255, 255);
    font-family: var(--secondary-font);
}
.testimonial-block-one.style-two .author-comments p {
    color: var(--body-color);
}
.testimonials-section .owl-carousel .owl-stage-outer {
    overflow: visible;
}
.testimonials-section .owl-carousel .owl-item {
    opacity: 0;
}
.testimonials-section .owl-carousel .owl-item.active {
    opacity: 1;
}
.subscribe-inner {
    position: relative;
    padding: 55px;
    display: flex;
    z-index: 1;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border-radius: 10px;
    background: var(--snh-red);
}
.subscribe-inner h3 {
    font-size: 36px;
    line-height: 42px;
    color: rgb(255, 255, 255);
    font-weight: 600;
    font-family: var(--primary-font);
}
.subscribe-inner h3 span {
    color: rgb(0, 0, 0);
}
.subscribe-layer-bg {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    opacity: 0.1;
    z-index: -1;
    background-position: center bottom;
    background-repeat: no-repeat;
}
.subscribe-inner .form-group {
    display: flex;
    align-items: center;
    gap: 10px;
}
.subscribe-inner .form-group input {
    color: rgb(159, 157, 157);
    background: rgb(255, 255, 255);
    border-radius: 5px;
    font-size: 16px;
    line-height: 30px;
    font-weight: 400;
    padding: 10px 25px;
    text-transform: capitalize;
    font-family: var(--secondary-font);
}
.subscribe-inner .form-group button i {
    font-size: 10px;
}
.slider.style_three .slide-item-content {
    position: relative;
    overflow: hidden;
}
.slider.style_three .slide-item-content .image-layer {
    position: absolute;
    top: 0px;
    left: 0px;
    height: 100%;
    width: 100%;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.slider.style_three .slide-item-content .container {
    position: relative;
    z-index: 10;
    padding: 0px 15px;
}
.slider.style_three .slide-item-content .slider_content {
    position: relative;
   padding: 150px 0px 80px;  /* Changed from 260px 0px 150px */
    max-width: 600px;
    z-index: 11;
}
.slider.style_three .slide-item-content .slider_content h6 {
    font-size: 13px;
    line-height: 19px;
    display: inline-block;
    font-weight: 500;
    margin-bottom: 25px;
    border-radius: 50px;
    color: var(--snh-red);
    opacity: 0;
    text-transform: uppercase;
    font-family: var(--secondary-font);
    transition: all 0.9s ease-in-out 0s;
}
.slider.style_three .slide-item-content .slider_content h1 {
    font-size: 80px;
    line-height: 70px;
    font-weight: 600;
    margin-bottom: 20px;
    color: rgb(17, 17, 17);
    opacity: 0;
    font-family: var(--primary-font);
    transition: all 0.9s ease-in-out 0s;
}
.slider.style_three .slide-item-content .slider_content h1 span {
    font-size: 64px;
    line-height: 60px;
    font-weight: 400;
}
.slider.style_three .slide-item-content .slider_content p {
    font-size: 20px;
    line-height: 30px;
    font-weight: 400;
    color: rgb(17, 17, 17);
    margin-bottom: 30px;
    opacity: 0;
    transition: all 0.9s ease-in-out 0s;
}
.slider.style_three .slide-item-content .slider_content .btn-style-four {
    opacity: 0;
    transition: all 0.9s ease-in-out 0s;
}
.slider.style_three .owl-item.active .slide-item-content .image-layer {
    opacity: 1;
}
.slider.style_three .owl-item.active .slide-item-content .slider_content h1 {
    opacity: 1;
}
.slider.style_three .owl-item.active .slide-item-content .slider_content h6 {
    opacity: 1;
}
.slider.style_three .owl-item.active .slide-item-content .slider_content p {
    opacity: 1;
}
.slider.style_three .owl-item.active .slide-item-content .slider_content .btn-style-four {
    opacity: 1;
}
.slider.style_three .slide-item-content .container .slider-image {
    position: relative;
    z-index: 9;
    overflow: visible;
    margin-right: -122px;
    padding-top: 50px;
    margin-top: 62px;
}
.slider.style_three .slide-item-content .container .slider-image::before {
    position: absolute;
    top: 0px;
    left: calc(50% - 255.5px);
    width: 511px;
    height: 511px;
    content: "";
    z-index: -1;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.5);
}

.why-chooseus-section {
    position: relative;
    overflow: hidden;
}
.why-chooseus-section .shape-three {
    position: absolute;
    left: -208px;
    bottom: -130px;
}
.why-chooseus-section .shape-four {
    position: absolute;
    right: -208px;
    bottom: -130px;
}
.brand-section-2.home-three {
    background: rgb(18, 18, 18);
}
.style_two h5.single-featured-car-title {
    margin-bottom: 10px;
}
.single-featured-car-rent-per-day-2 {
    font-size: 14px;
    color: rgb(17, 17, 17);
    line-height: 20px;
    font-weight: 400;
    padding-bottom: 20px;
    text-transform: capitalize;
    font-family: var(--primary-font);
}
.single-featured-car-rent-per-day-2 span {
    font-size: 28px;
    color: var(--theme-color);
}
.featured-car-info-outer {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: space-between;
}
.subscribe-section-2 {
    position: relative;
    z-index: 99;
    background: var(--theme-color);
}
.subscribe-section-2 .subscribe-layer-bg-2 {
    position: absolute;
    left: 0px;
    bottom: 0px;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: center bottom;
}
.subscribe-section-2 .subscribe-inner {
    padding: 50px 0px;
    border-radius: 0px;
    background: transparent;
}
.services-section {
    background-color: rgb(246, 246, 246);
}
.services-block-one {
    position: relative;
    margin-bottom: 30px;
    z-index: 1;
    padding: 25px 0px 0px 40px;
}
.services-block-one::before {
    position: absolute;
    inset: 0px 50px 65px 0px;
    content: "";
    z-index: -1;
    border-radius: 10px;
    background-color: rgb(255, 255, 255);
}
.services-block-one h6.service-title {
    font-size: 16px;
    font-weight: 500;
    line-height: 26px;
    margin-bottom: 15px;
    font-family: var(--secondary-font);
}
.services-block-one h6.service-title a {
    color: rgb(17, 17, 17);
    display: inline-block;
}
.services-block-one h6.service-title a:hover {
    color: var(--theme-color);
}
.services-block-one .services-iamge img {
    border-radius: 10px;
}
.slider.style_four {
    position: relative;
    padding: 270px 0px 230px;
}
.slider.style_four .shape-image {
    position: absolute;
    top: 0px;
    left: 0px;
    height: 100%;
    width: 100%;
    background-repeat: no-repeat !important;
    background-position: right top !important;
}
.slider.style_four .shape-image-2 {
    position: absolute;
    bottom: 0px;
    right: 0px;
    height: 100%;
    width: 100%;
    background-repeat: no-repeat !important;
    background-position: left bottom !important;
}
.slider.style_four .slide-item-content .container {
    position: relative;
    z-index: 10;
    padding: 0px 15px;
}
.slider.style_four .slide-item-content .slider_content {
    position: relative;
    z-index: 11;
}
.slider.style_four .slide-item-content .slider_content h6 {
    font-size: 13px;
    background: rgba(var(--snh-red-rgb), 0.1);
    padding: 5px 12px;
    line-height: 19px;
    display: inline-block;
    font-weight: 500;
    margin-bottom: 25px;
    border-radius: 50px;
    color: var(--snh-red);
    opacity: 0;
    text-transform: uppercase;
    font-family: var(--secondary-font);
    transition: all 0.9s ease-in-out 0s;
}
.slider.style_four .slide-item-content .slider_content h1 {
    font-size: 80px;
    line-height: 70px;
    font-weight: 600;
    margin-bottom: 20px;
    color: rgb(17, 17, 17);
    opacity: 0;
    font-family: var(--primary-font);
    transition: all 0.9s ease-in-out 0s;
}
.slider.style_four .slide-item-content .slider_content h1 span {
    font-size: 64px;
    line-height: 60px;
    font-weight: 400;
}
.slider.style_four .slide-item-content .slider_content p {
    font-size: 20px;
    line-height: 30px;
    font-weight: 400;
    color: rgb(17, 17, 17);
    margin-bottom: 30px;
    opacity: 0;
    transition: all 0.9s ease-in-out 0s;
}
.slider.style_four .slide-item-content .slider_content .btn-style-four {
    opacity: 0;
    transition: all 0.9s ease-in-out 0s;
}
.slider.style_four .owl-item.active .slide-item-content .image-layer {
    opacity: 1;
}
.slider.style_four .owl-item.active .slide-item-content .slider_content h1 {
    opacity: 1;
}
.slider.style_four .owl-item.active .slide-item-content .slider_content h6 {
    opacity: 1;
}
.slider.style_four .owl-item.active .slide-item-content .slider_content p {
    opacity: 1;
}
.slider.style_four .owl-item.active .slide-item-content .slider_content .btn-style-four {
    opacity: 1;
}
.slider.style_four .slide-item-content .container .slider-image {
    position: relative;
    z-index: 9;
    overflow: visible;
    margin-right: -260px;
}
.slider.style_four .slide-item-content .container .slider-image::before {
    position: absolute;
    top: 0px;
    left: calc(50% - 255.5px);
    width: 511px;
    height: 511px;
    content: "";
    z-index: -1;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.5);
}
.owl_dots_one .owl-dots {
    gap: 9px;
    display: flex;
    position: absolute;
    top: calc(50% - 50px);
    left: 75px;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
.owl_dots_one .owl-dots .owl-dot {
    width: 9px;
    height: 9px;
    opacity: 0.3;
    background: var(--snh-red);
    border-radius: 50px;
}
.owl_dots_one .owl-dots .owl-dot.active {
    width: 13px;
    height: 13px;
    opacity: 1;
    border-radius: 50px;
}
.owl_navs_one.theme_carousel .owl-nav {
    gap: 90px;
    display: flex;
    position: absolute;
    top: calc(50% - 100px);
    left: 75px;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
.owl_navs_one.theme_carousel .owl-nav button {
    color: rgb(0, 0, 0);
}
.owl_navs_one.theme_carousel .owl-nav button:hover {
    color: var(--theme-color);
}
.about-section {
    position: relative;
}
.about-section .shape {
    position: absolute;
    bottom: 40px;
    left: 0px;
}
.about-info-block {
    display: flex;
    align-items: center;
    gap: 20px;
}
.about-info-icon {
    width: 60px;
    height: 60px;
    font-size: 25px;
    line-height: 60px;
    text-align: center;
    border-radius: 50%;
    flex-shrink: 0;
    color: rgb(0, 0, 0);
    background: rgba(var(--snh-red-rgb), 0.1);
}
.about-info-title {
    font-size: 24px;
    line-height: 28px;
    font-weight: 600;
    color: rgb(13, 13, 13);
    font-family: var(--primary-font);
}
.about-info-text {
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
    color: var(--body-color);
    font-family: var(--secondary-font);
}
.download-app-outer {
    position: relative;
    padding: 0px 100px;
    border-radius: 20px;
    z-index: 1;
    background: rgb(23, 22, 38);
}
.download-app-content {
    padding-top: 70px;
    padding-bottom: 70px;
}
.download-app-content h2 {
    font-size: 44px;
    line-height: 52px;
    font-weight: 600;
    color: rgb(255, 255, 255);
    margin-bottom: 30px;
    font-family: var(--primary-font);
}
.download-app-content p {
    font-size: 18px;
    line-height: 32px;
    font-weight: 500;
    color: rgb(255, 255, 255);
    font-family: var(--secondary-font);
    margin-bottom: 40px;
}
.download-app-image {
    margin-top: -100px;
    margin-bottom: -100px;
    text-align: right;
}
.download-app-list {
    display: flex;
    align-items: center;
    gap: 20px;
}
.download-app {
    display: flex;
    align-items: center;
    gap: 10px;
    max-width: 200px;
    width: 100%;
    padding: 10px;
    border-radius: 10px;
    background: rgb(255, 255, 255);
}
.download-app .app-icon {
    width: 30px;
    height: 30px;
    flex-shrink: 0;
    text-align: center;
    line-height: 30px;
}
.download-app .app-content span {
    font-size: 12px;
    font-weight: 500;
    line-height: 20px;
    display: block;
    color: rgb(17, 17, 17);
    text-transform: uppercase;
    font-family: var(--secondary-font);
}
.download-app .app-content h6 {
    font-size: 20px;
    font-weight: 500;
    line-height: 20px;
    color: rgb(17, 17, 17);
    font-family: var(--primary-font);
    text-transform: capitalize;
}
.download-app-outer .icon-box {
    position: absolute;
    width: 136px;
    height: 136px;
    bottom: calc(50% - 68px);
    right: 95px;
    content: "";
    padding: 25px;
    text-align: center;
    color: var(--bs-white);
    background-color: rgb(255, 255, 255);
    line-height: 136px;
    border-radius: 50%;
}
@-webkit-keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}
@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}
.download-app-outer .icon-box .icon {
    font-size: 30px;
    width: 85px;
    height: 85px;
    line-height: 85px;
    text-align: center;
    border-radius: 50%;
    color: var(--bs-white);
    transform: rotate(0deg);
    background-color: var(--theme-color);
    transition: all 500ms ease 0s;
}
.download-app-outer .icon-box:hover .icon {
    transform: rotate(180deg);
}
.download-app-outer .icon-box .icon-text {
    position: absolute;
    top: 6px;
    left: 1px;
    width: 100%;
    height: 100%;
    text-align: center;
}
.download-app-outer .icon-box .icon-text img {
    animation: 10s linear 0s 1 normal none running spin;
}
.download-app-outer .shape {
    position: absolute;
    right: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: -1;
    border-radius: 20px;
    background-repeat: no-repeat;
    background-position: right center;
}
.view-all-btn .btn-style-two {
    border-radius: 5px;
}
.subscribe-section.style-two {
    position: relative;
    margin-bottom: -95px;
    z-index: 99;
}
.slider.style_five .slide-item {
    padding: 185px 0px 180px;
}
.slider.style_five .slide-item-content .slider_content h6 {
    font-size: 13px;
    background: rgba(var(--snh-red-rgb), 0.1);
    padding: 5px 12px;
    line-height: 19px;
    display: inline-block;
    font-weight: 500;
    margin-bottom: 25px;
    border-radius: 50px;
    color: var(--snh-red);
    opacity: 0;
    text-transform: uppercase;
    font-family: var(--secondary-font);
    transition: all 0.9s ease-in-out 0s;
}
.slider.style_five .slide-item-content .slider_content h1 {
    font-size: 72px;
    line-height: 80px;
    font-weight: 600;
    margin-bottom: 20px;
    color: rgb(17, 17, 17);
    opacity: 0;
    font-family: var(--primary-font);
    transition: all 0.9s ease-in-out 0s;
}
.slider.style_five .slide-item-content .slider_content p {
    font-size: 20px;
    line-height: 30px;
    font-weight: 400;
    color: rgb(17, 17, 17);
    margin-bottom: 30px;
    opacity: 0;
    transition: all 0.9s ease-in-out 0s;
}
.slider.style_five .slide-item-content .big-title {
    position: absolute;
    bottom: 0px;
    left: calc(50% - 880px);
    font-size: 440px;
    font-weight: 600;
    line-height: 440px;
    text-align: center;
    display: block;
    overflow: hidden;
    opacity: 0;
    transform: perspective(400px) rotateY(0deg) translateY(120px);
    transform-origin: center bottom;
    transition: all 1000ms ease 0s;
    font-family: var(--primary-font);
    background: linear-gradient(rgb(17, 17, 17) 0%, rgba(17, 17, 17, 0) 100%) text;
    -webkit-text-fill-color: transparent;
}
.booking-section.style-three {
    margin-top: -130px;
}
.slider.style_five .owl-item.active .big-title {
    transform: perspective(400px) rotateY(0deg) translateY(0px);
    transition-delay: 1000ms;
    opacity: 0.06 !important;
    visibility: visible !important;
}
.promotional-banner-block.style-two {
    box-shadow: rgba(0, 0, 0, 0.08) 0px 0px 50px;
}
.promotional-banner-block.style-two h2 {
    color: rgb(17, 17, 17);
}
.home-five .vedio-section-outer {
    border-radius: 0px;
}
.brand-section.home-five .brand-outer-box {
    flex-wrap: wrap;
    margin-bottom: 50px;
}
.google-map-section.style-two {
    position: relative;
}
.google-map-section.style-two .shape {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: left bottom;
}
.style-two .google-map-outer::before {
    display: none;
}
.testimonial-block-two .inner-box {
    position: relative;
    padding: 0px 40px 40px;
    margin-top: 20px;
    border-radius: 10px;
    background: rgb(255, 255, 255);
    box-shadow: rgba(0, 0, 0, 0.07) 0px 10px 50px;
}
.testimonial-block-two .inner-box .author-image {
    position: relative;
    width: 100px;
    height: 100px;
    margin-top: -45px;
    display: inline-block;
    border-radius: 50%;
    text-align: center;
}
.testimonial-block-two .inner-box .author-image img {
    width: auto;
}
.testimonial-block-two .inner-box .author-info h5 {
    font-size: 24px;
    line-height: 30px;
    color: rgb(17, 17, 17);
    font-weight: 600;
    font-family: var(--primary-font);
}
.testimonial-block-two .inner-box .author-info .designation {
    font-size: 16px;
    line-height: 30px;
    color: var(--body-color);
    font-weight: 400;
    display: block;
    font-family: var(--secondary-font);
}
.testimonial-block-two .inner-box .author-rating {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    margin-bottom: 15px;
}
.testimonial-block-two .inner-box .author-rating li {
    font-size: 15px;
    color: rgb(255, 200, 68);
}
.testimonial-block-two .inner-box p {
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
    color: var(--body-color);
    font-family: var(--secondary-font);
}
.home-five .owl_dot_one.theme_carousel .owl-dots {
    margin-top: 60px;
}
.breadcrumb-section {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    padding: 200px 0px 140px;
}
.breadcrumb-section .banner-content h1 {
    color: rgb(255, 255, 255);
    text-align: center;
    font-size: 64px;
    font-weight: 600;
    line-height: 90%;
    font-family: var(--primary-font);
    text-transform: capitalize;
}
@media (max-width: 767px) {
    .breadcrumb-section .banner-content h1 {
        font-size: 50px;
    }
}
@media (max-width: 576px) {
    .breadcrumb-section .banner-content h1 {
        font-size: 40px;
    }
}
.team-block-one .inner-box {
    position: relative;
    padding: 0px 40px 40px;
    margin-top: 40px;
    border-radius: 10px;
    background: rgb(255, 255, 255);
    z-index: 1;
    cursor: pointer;
    box-shadow: rgba(0, 0, 0, 0.07) 0px 10px 50px;
}
.team-block-one .inner-box::before {
    position: absolute;
    bottom: 0px;
    right: 0px;
    width: 100px;
    height: 100px;
    content: "";
    opacity: 0;
    z-index: -1;
    transform: translateY(10px);
    background: var(--theme-color);
    transition: all 500ms ease 0s;
    border-radius: 0px 0px 10px;
    clip-path: polygon(100% 25%, 10% 99%, 100% 100%);
}
.team-block-one:hover .inner-box::before {
    opacity: 1;
    transform: translateY(0px);
}
.team-block-one .inner-box .author-image {
    position: relative;
    width: 140px;
    height: 140px;
    margin-top: -66px;
    display: inline-block;
    border-radius: 100px;
    text-align: center;
    overflow: hidden;
    margin-bottom: 15px;
}
.team-block-one .inner-box .author-image img {
    width: auto;
}
.team-block-one .inner-box .author-info {
    margin-bottom: 20px;
}
.team-block-one .inner-box .author-info h5 {
    font-size: 24px;
    line-height: 30px;
    color: rgb(17, 17, 17);
    font-weight: 600;
    margin-bottom: 5px;
    font-family: var(--primary-font);
}
.team-block-one .inner-box .author-info h5 a {
    color: rgb(17, 17, 17);
    display: inline-block;
}
.team-block-one .inner-box .author-info span {
    font-size: 16px;
    line-height: 30px;
    color: var(--body-color);
    font-weight: 400;
    display: block;
    margin-bottom: 10px;
    font-family: var(--secondary-font);
}
.team-block-one .inner-box .author-social-links {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    margin-bottom: 15px;
}
.team-block-one .inner-box .author-social-links li {
    width: 40px;
    height: 40px;
    line-height: 35px;
    background: rgb(255, 255, 255);
    border-radius: 50%;
    text-align: center;
    box-shadow: rgba(0, 0, 0, 0.08) 0px 0px 20px;
}
.team-block-one .inner-box .author-social-links li a {
    width: 24px;
    height: 24px;
    background: rgb(0, 0, 0);
    border-radius: 50%;
    color: rgb(255, 255, 255);
    font-size: 12px;
    line-height: 24px;
    text-align: center;
    display: inline-block;
    transition: all 500ms ease 0s;
}
.team-block-one .inner-box .author-social-links li a:hover {
    background: var(--theme-color);
}
.inner-page .testimonial-block-one.style-two {
    margin-bottom: 30px;
}
.testimonials-section.inner-page .btn-style-two {
    line-height: 48px;
    border-radius: 0px;
    margin-top: 20px;
}
.inner-page .testimonial-block-two .inner-box .author-image {
    margin-bottom: 15px;
}
.testimonials-section.dark-bg {
    background: rgb(6, 7, 2);
}
.faq-outer-box {
    max-width: 850px;
    width: 100%;
    margin: 0px auto;
}
.accordion-box .accordion .acc-content {
    display: none;
}
.accordion-box .accordion .acc-content.current {
    display: block;
}
.accordion-box .accordion {
    position: relative;
    background: rgb(255, 255, 255);
    border-radius: 5px;
    margin-bottom: 10px;
    border: 1px solid rgb(229, 229, 229);
    overflow: hidden;
}
.accordion-box .accordion:last-child {
    margin-bottom: 0px;
}
.accordion-box .accordion .acc-btn {
    position: relative;
    display: block;
    padding: 20px 60px 20px 30px;
    background: rgb(255, 255, 255);
    cursor: pointer;
    transition: all 500ms ease 0s;
}
.accordion-box .accordion .acc-btn h4 {
    display: block;
    font-size: 20px;
    font-weight: 500;
    line-height: 28px;
    font-family: var(--primary-font);
    transition: all 500ms ease 0s;
}
.accordion-box .accordion .acc-btn::before {
    position: absolute;
    top: 20px;
    right: 30px;
    font-size: 24px;
    color: var(--theme-color);
    content: "";
    font-weight: 900;
    font-family: "Font Awesome 6 Free";
}
.accordion-box .accordion .acc-btn.active::before {
    content: "";
    color: rgb(0, 0, 0);
    font-family: "Font Awesome 6 Free";
}
.accordion-box .accordion .acc-content {
    padding: 15px 60px 33px 30px;
}
.accordion-box .accordion .acc-content p {
    font-size: 16px;
    font-weight: 400;
    line-height: 28px;
    color: var(--body-color);
    font-family: var(--secondary-font);
}
#questionForm .form-group {
    margin-bottom: 30px;
}
#questionForm input, #questionForm textarea {
    font-size: 16px;
    line-height: 28px;
    padding: 15px 30px;
    width: 100%;
    transition: all 0.5s ease 0s;
    color: var(--body-color);
    border: 1px solid rgb(229, 229, 229);
    border-radius: 5px;
    font-family: var(--secondary-font);
}
#questionForm textarea {
    height: 170px;
    resize: none;
}
#questionForm input:focus, #questionForm textarea:focus {
    border-color: var(--theme-color);
}
#questionForm button.btn-style-five {
    padding: 15px 30px;
}
.services-section.inner-page {
    padding-bottom: 200px;
    margin-bottom: -99px;
}
.area-outer-image {
    display: grid;
    grid-template-columns: auto auto auto auto;
    gap: 6px;
}
.area-details-image img {
    width: 100%;
}
.area-details-image:nth-child(1) {
    grid-area: 1 / 1 / span 2 / span 3;
}
.planning-details-section p {
    font-size: 16px;
    line-height: 26px;
    color: var(--body-color);
    font-family: var(--secondary-font);
    margin-bottom: 30px;
}
.planning-details-section .btn-style-five {
    padding: 15px 30px;
}
.planning-details-section .planning-map iframe{
    width: 100%;
    height: 400px;
}
.sortable-masonry .filter-tabs {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 20px;
}
.sortable-masonry .filter-tabs li {
    position: relative;
    font-size: 16px;
    font-weight: 500;
    line-height: 30px;
    color: rgb(17, 17, 17);
    padding: 10px 30px;
    border-radius: 4px;
    z-index: 1;
    overflow: hidden;
    cursor: pointer;
    font-family: var(--secondary-font);
}
.sortable-masonry .filter-tabs li::before {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 0px;
    height: 100%;
    content: "";
    z-index: -1;
    transition: all 0.5s ease 0s;
    background-color: var(--theme-color);
}
.sortable-masonry .filter-tabs li.active, .sortable-masonry .filter-tabs li:hover {
    color: rgb(255, 255, 255);
}
.sortable-masonry .filter-tabs li.active::before, .sortable-masonry .filter-tabs li:hover::before {
    width: 100%;
}
.gallery-block-one .inner-box {
    position: relative;
    display: block;
    cursor: pointer;
    border-radius: 10px;
    margin-bottom: 30px;
    overflow: hidden;
}
.gallery-block-one .inner-box img{
    width: 100%;
}
.gallery-block-one .inner-box .view-btn {
    position: absolute;
    inset: 10px;
    content: "";
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    transform: scale(0);
    transition: all 500ms ease 0s;
    background: rgba(var(--snh-red-rgb), 0.6);
}
.gallery-block-one .inner-box .view-btn .lightbox-image {
    display: inline-block;
    color: rgb(255, 255, 255);
    font-size: 30px;
}
.gallery-block-one:hover .inner-box .view-btn {
    transform: scale(1);
}
.gallery-section .btn-style-five {
    padding: 15px 30px;
}
.pricing-block-one {
    position: relative;
    border-radius: 10px;
    background-color: rgb(255, 255, 255);
    margin-bottom: 30px;
    padding: 40px 30px;
    transition: all 0.5s ease 0s;
    border-top: 3px solid var(--theme-color);
    box-shadow: rgba(0, 0, 0, 0.08) 0px 0px 50px;
}
.pricing-block-one .table-header {
    text-align: center;
    padding-bottom: 30px;
    border-bottom: 2px dashed rgba(0, 0, 0, 0.2);
    border-top-width: 2px;
    border-right-width: 2px;
    border-left-width: 2px;
    margin-bottom: 30px;
    border-top-color: rgba(0, 0, 0, 0.2);
    border-right-color: rgba(0, 0, 0, 0.2);
    border-left-color: rgba(0, 0, 0, 0.2);
}
.pricing-block-one h6.title {
    font-size: 18px;
    line-height: 30px;
    color: rgb(17, 17, 17);
    font-weight: 500;
    text-transform: uppercase;
    font-family: var(--primary-font);
    margin-bottom: 20px;
}
.pricing-block-one .price {
    font-size: 48px;
    line-height: 30px;
    color: rgb(17, 17, 17);
    font-weight: 600;
    font-family: var(--primary-font);
}
.pricing-block-one .price span {
    font-size: 24px;
    line-height: 30px;
    color: rgb(17, 17, 17);
    font-weight: 400;
    font-family: var(--primary-font);
}
.pricing-block-one .feature-list li {
    padding: 10px 0px;
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
    color: rgb(17, 17, 17);
    display: flex;
    align-items: center;
    gap: 16px;
    font-family: var(--secondary-font);
}
.pricing-block-one .feature-list li span {
    width: 25px;
    height: 25px;
    display: block;
    color: var(--theme-color);
    line-height: 25px;
    text-align: center;
    font-size: 8px;
    border-radius: 50%;
    background: rgba(var(--snh-red-rgb), 0.1);
}
.order-information h3.title {
    font-size: 28px;
    font-weight: 600;
    line-height: 30px;
    color: rgb(17, 17, 17);
    text-transform: capitalize;
    font-family: var(--primary-font);
    padding-bottom: 15px;
}
.order-information .order-outer-box {
    position: relative;
    padding: 30px 0px;
    margin-bottom: 30px;
    border-top: 1px solid rgba(229, 229, 229, 0.89);
    border-bottom: 1px solid rgba(229, 229, 229, 0.89);
}
.order-information .info-title-box span.price {
    font-size: 28px;
    font-weight: 600;
    line-height: 30px;
    color: var(--theme-color);
}
.order-outer-box .product-image {
    flex-shrink: 0;
}
.order-information .order-outer-box {
    position: relative;
    display: flex;
    align-items: center;
    gap: 20px;
}
.order-outer-box .info-title-box {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 15px;
}
.order-outer-box .product-info-box {
    width: 100%;
}
.order-information .order-outer-box .product-name {
    font-size: 28px;
    font-weight: 600;
    line-height: 30px;
    color: rgb(17, 17, 17);
    font-family: var(--primary-font);
}
.order-information .order-outer-box .product-info-list li {
    font-size: 14px;
    line-height: 20px;
    color: rgb(17, 17, 17);
    font-weight: 400;
    padding: 5px 0px;
    font-family: var(--secondary-font);
}
.order-information .order-outer-box .product-info-list li strong {
    font-weight: 700;
}
.order-summary {
    display: flex;
    gap: 20px;
    align-items: flex-start;
    justify-content: space-between;
}
.order-summary #couponForm {
    position: relative;
    padding: 5px;
    display: inline-block;
    max-width: 410px;
    width: 100%;
    border-radius: 5px;
    border: 1px solid rgb(229, 229, 229);
}
.order-summary #couponForm input {
    font-size: 16px;
    line-height: 28px;
    font-weight: 400;
    color: var(--body-color);
    padding: 10px 15px;
    text-transform: capitalize;
}
.order-summary #couponForm button {
    position: absolute;
    top: 5px;
    right: 5px;
    font-size: 18px;
    line-height: 28px;
    font-weight: 500;
    padding: 10px 30px;
}
.order-summary .bill-history {
    max-width: 240px;
    width: 100%;
}
.order-summary .bill-history li {
    font-size: 16px;
    line-height: 26px;
    font-weight: 500;
    color: rgb(17, 17, 17);
    display: flex;
    align-items: center;
    padding: 5px 0px;
    text-align: right;
    gap: 20px;
    justify-content: space-between;
    text-transform: capitalize;
    font-family: var(--secondary-font);
    margin-bottom: 10px;
}
.order-summary .bill-history li.deu-amount span {
    font-size: 28px;
    color: var(--snh-red);
    line-height: 28px;
    font-family: var(--primary-font);
}
.bill-information {
    position: relative;
    padding: 20px 30px;
    margin-left: 20px;
    box-shadow: rgba(0, 0, 0, 0.08) 0px 10px 50px;
}
.bill-information h3 {
    font-size: 28px;
    line-height: 36px;
    font-weight: 600;
    color: rgb(17, 17, 17);
    margin-bottom: 20px;
}
.bill-information .contact-info .form-group {
    margin-bottom: 20px;
}
.bill-information .contact-info .form-group input {
    font-size: 16px;
    line-height: 28px;
    font-weight: 400;
    font-family: var(--secondary-font);
    color: var(--body-color);
    padding: 10px 20px;
    border: 1px solid rgb(229, 229, 229);
    border-radius: 5px;
    width: 100%;
}
.bill-information .pay-bill {
    font-size: 16px;
    font-weight: 500;
    line-height: 36px;
    font-family: var(--secondary-font);
    padding-top: 10px;
    padding-bottom: 30px;
    margin-bottom: 30px;
    display: flex;
    align-items: center;
    gap: 25px;
    border-bottom: 1px solid rgb(229, 229, 229);
}
.bill-information .pay-bill span {
    font-size: 28px;
    font-weight: 600;
    line-height: 36px;
    color: var(--theme-color);
    font-family: var(--primary-font);
}
.payment-method {
    display: inline-flex;
    align-items: center;
    background: rgb(246, 246, 246);
    border-radius: 5px;
    overflow: hidden;
    margin-bottom: 20px;
}
.payment-method input[type="radio"] {
    display: none;
}
.payment-method label.btn {
    display: inline-block;
    padding: 10px 20px;
    font-size: 16px;
    cursor: pointer;
    color: var(--body-color);
    font-weight: 400;
    border-radius: 0px;
    background: rgb(246, 246, 246);
    font-family: var(--secondary-font);
    transition: all 0.3s ease 0s;
}
.payLater-box .btn {
    border-radius: 0px 0px 5px 5px;
}
.paypal-box .btn {
    border-radius: 5px 5px 0px 0px;
}
.payment-method input[type="radio"]:checked + label.btn {
    color: rgb(255, 255, 255);
    background-color: var(--theme-color);
    border-color: var(--theme-color);
}
.bill-information .contact-info p.text {
    font-size: 16px;
    line-height: 30px;
    font-weight: 400;
    color: var(--body-color);
    font-family: var(--secondary-font);
    margin-bottom: 30px;
}
.terms-checkbox .checkbox-container {
    display: block;
    position: relative;
    padding-left: 25px;
    margin-bottom: 20px;
    cursor: pointer;
}
.terms-checkbox .checkbox-container input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}
.terms-checkbox .checkbox-container .checkmark {
    position: absolute;
    top: 7px;
    left: 0px;
    height: 15px;
    width: 15px;
    background: transparent;
    border: 1px solid rgb(221, 221, 221);
    border-radius: 2px;
}
.terms-checkbox .checkbox-container:hover input ~ .checkmark {
    border-color: var(--theme-color);
}
.terms-checkbox .checkbox-container input:checked ~ .checkmark {
    background-color: var(--theme-color);
    border-color: var(--theme-color);
}
.terms-checkbox .checkbox-container .checkmark::after {
    content: "";
    position: absolute;
    display: none;
}
.terms-checkbox .checkbox-container input:checked ~ .checkmark::after {
    display: block;
}
.terms-checkbox .checkbox-container .checkmark::after {
    left: 4px;
    top: 1px;
    width: 5px;
    height: 10px;
    border-style: solid;
    border-color: white;
    border-image: initial;
    border-width: 0px 3px 3px 0px;
    transform: rotate(45deg);
}
.terms-checkbox .checkbox-container h6 {
    font-size: 16px;
    line-height: 28px;
    font-weight: 400;
    color: rgb(17, 17, 17);
    font-family: var(--secondary-font);
}
.terms-checkbox .checkbox-container p {
    font-size: 16px;
    line-height: 28px;
    font-weight: 400;
    color: var(--body-color);
    font-family: var(--secondary-font);
}
.bill-information .btn-style-five {
    padding: 10px 30px;
    font-size: 18px;
    font-weight: 500;
    line-height: 28px;
    width: 100%;
    font-family: var(--primary-font);
    border-radius: 5px;
}
.product-sidebar {
    position: relative;
    border-radius: 10px;
    padding: 50px 40px;
    background: rgb(255, 255, 255);
    box-shadow: rgba(0, 0, 0, 0.04) 0px 10px 80px;
}
h3.sidebar-widget-title {
    font-size: 28px;
    line-height: 36px;
    font-weight: 600;
    color: rgb(17, 17, 17);
    font-family: var(--primary-font);
    margin-bottom: 25px;
}
.sidebar-search-widget {
    padding-bottom: 50px;
    margin-bottom: 40px;
    border-bottom: 1px solid rgb(229, 229, 229);
}
.sidebar-search-box {
    position: relative;
}
.sidebar-search-box input {
    padding: 20px 30px;
    font-size: 16px;
    font-weight: 400;
    color: var(--body-color);
    line-height: 28px;
    width: 100%;
    border-radius: 10px;
    font-family: var(--secondary-font);
    background: rgb(255, 240, 241);
    border: 1px solid rgb(255, 240, 241);
    transition: all 500ms ease 0s;
}
.sidebar-search-box input:focus {
    border-color: var(--theme-color);
}
.sidebar-search-box button {
    position: absolute;
    top: 20px;
    right: 30px;
    font-size: 18px;
    color: rgb(144, 144, 146);
    transition: all 500ms;
}
.sidebar-search-box button:hover{
    color: var(--theme-color);
}
.sidebar-select-car-widget{
    padding-bottom: 50px;
    margin-bottom: 40px;
    border-bottom: 1px solid rgb(229, 229, 229);
}
.custom-select {
    position: relative;
    display: inline-block;
    width: 100%;
}
.custom-select select {
    appearance: none;
    outline: none;
    cursor: pointer;
    width: 100%;
    padding: 15px 20px;
    font-size: 16px;
    line-height: 28px;
    color: rgb(17, 17, 17);
    border-radius: 5px;
    margin-bottom: 10px;
    background-color: rgb(244, 244, 244);
    border: 1px solid rgb(244, 244, 244);
}
.custom-select select option {
    background-color: rgb(255, 255, 255);
    color: rgb(51, 51, 51);
}
.custom-select select option:hover {
    background-color: rgb(240, 240, 240);
}
.custom-select::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 10px;
    font-weight: 900;
    font-family: "Font Awesome 6 Free";
    transform: translateY(-50%);
    pointer-events: none;
}
.sidebar-filter-widget {
    padding-bottom: 50px;
    margin-bottom: 40px;
    border-bottom: 1px solid rgb(229, 229, 229);
}
.price-range-slider {
    position: relative;
    width: 100%;
}
.price-range-slider .range-value {
    position: relative;
    display: flex;
    align-items: center;
    margin-top: 15px;
    margin-bottom: 20px;
    font-size: 14px;
    font-weight: 500;
    color: var(--primary-color);
    font-family: var(--secondary-font);
}
.price-range-slider .range-value span {
    font-size: 14px;
    line-height: 24px;
    font-weight: 500;
    color: var(--title-color);
    margin-right: 5px;
}
.price-range-slider .range-value input {
    width: 100%;
    background: none;
    font-size: 14px;
    line-height: 24px;
    font-family: var(--text-font);
    font-weight: 500;
    color: var(--title-color);
    box-shadow: none;
    border: none;
}
.price-range-slider .range-bar {
    border: none;
    height: 4px;
    width: 100%;
    background: rgb(255, 223, 223);
    border-radius: 0px;
}
.price-range-slider .ui-slider-range {
    background-color: var(--theme-color);
}
.price-range-slider .ui-slider-handle {
    position: relative;
    display: inline-block;
    width: 20px;
    height: 20px;
    border: 4px solid rgb(255, 255, 255);
    border-radius: 50%;
    background-color: var(--theme-color);
    cursor: pointer;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 18px 0px;
    top: -11px;
}
.price-range-slider .btn-box {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.price-range-slider .btn-box .clear-btn {
    position: relative;
    display: inline-block;
    font-size: 16px;
    line-height: 30px;
    font-weight: 500;
    color: #222222;
    text-decoration: underline;
    transition: all 500ms ease 0s;
}
.price-range-slider .btn-box .clear-btn:hover {
    color: var(--theme-color);
}
.price-range-slider .btn-box .btn-style-four {
    padding: 15px 30px;
}
.sidebar-capacity-widget{
    padding-bottom: 30px;
    margin-bottom: 40px;
    border-bottom: 1px solid rgb(229, 229, 229);
}
.check-box input {
    display: none;
}
.check-box label {
    position: relative;
    font-size: 16px;
    line-height: 30px;
    color: var(--primary-color);
    padding-left: 20px;
    font-weight: 400;
    display: inline-block;
    cursor: pointer;
    font-family: var(--secondary-font);
    margin-bottom: 10px;
}
.check-box label:before{
    position: absolute;
    content: '';
    left: 0px;
    top: 7px;
    width: 15px;
    height: 15px;
    border-radius: 2px;
    border-style: solid;
    border-width: 1px;
    border-color: #DDDDDD;
    background: transparent;
}
.check-box label:after {
    opacity: 0;
    content: "\f00c";
    position: absolute;
    top: -1px;
    left: 3.5px;
    font-size: 10px;
    font-weight: 900;
    color: #ffffff;
    font-family: "Font Awesome 6 Free";
    pointer-events: none;
}
.check-box input:checked + label:after {
    opacity: 1;
}
.check-box input:checked + label:before{
    background-color: var(--theme-color);
}
.rating-star{
    display: flex;
    align-items: center;
    gap: 7px;
}
.rating-star li{
    color: #D3D3D3;
    font-size: 15px;
}
.rating-star li.rated-star{
    color: var(--rating-color);
}
.car-listing-section .single-featured-car-book-btn a{
    display: inline-block;
    padding: 10px 50px;
}
.sidebar-car-brands-widget,
.sidebar-car-type-widget{
    padding-bottom: 30px;
    margin-bottom: 40px;
    border-bottom: 1px solid rgb(229, 229, 229);
}
.car-brands-list{
    max-height: 250px;
    height: 100%;
    overflow-y: auto;
}
.car-details-outerbox{
    display: grid;
    gap: 6px;
    grid-template-columns: auto auto auto auto;
}
.car-details-image:nth-child(1){
    grid-area: 1 / 1 / span 2 / span 3;
}
.car-details-image img{
    width: 100%;
    border-radius: 10px;
}
.car-details-info-outer{
    padding-top: 30px;
}
.rating-location-box{
    display: flex;
    align-items: center;
    gap: 30px;
}
.rating-location-box .location{
    font-size: 14px;
    font-weight: 700;
    color: var(--theme-color);
    display: flex;
    align-items: center;
    gap: 5px;
    text-transform: uppercase;
    font-family: var(--primary-font);
}
.rating-location-box .location i{
    font-size: 20px;
    color: var(--theme-color);
}
.rating-location-box .rating{
    font-size: 14px;
    font-weight: 400;
    color: var(--primary-color);
    display: flex;
    align-items: center;
    gap: 5px;
    font-family: var(--secondary-font);
}
.rating-location-box .rating i{
    font-size: 15px;
    color: var(--rating-color);
}
h3.car-details-title{
    font-size: 44px;
    line-height: 56px;
    color: var(--primary-color);
    font-weight: 600;
    padding-bottom: 40px;
    margin-bottom: 50px;
    font-family: var(--primary-font);
    border-bottom: 1px solid #E5E5E5;
}
.car-details-feature-list{
    padding-bottom: 30px;
    margin-bottom: 50px;
    border-bottom: 1px solid #E5E5E5;
}
.car-details-feature-box{
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px;
}
.car-details-feature-icon{
    width: 50px;
    height: 50px;
    font-size: 24px;
    text-align: center;
    line-height: 50px;
    color: var(--theme-color);
    background-color: #FFF0F1;
    border-radius: 5px;
}
.car-details-feature-content h6{
    font-size: 14px;
    line-height: 26px;
    font-weight: 400;
    color: #6A6A6A;
    text-transform: capitalize;
    font-family: var(--secondary-font);
}
.car-details-feature-content span{
    font-size: 16px;
    line-height: 26px;
    font-weight: 500;
    color: var(--primary-color);
    text-transform: capitalize;
    font-family: var(--secondary-font);
}
.car-details-about-box{
    margin-bottom: 40px;
}
h4.car-details-sub-title{
    font-size: 24px;
    font-weight: 500;
    line-height: 32px;
    padding-bottom: 20px;
    font-family: var(--primary-font);
    color: var(--primary-color);
}
p.car-details-about-text{
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
    color: #6A6A6A;
    font-family: var(--secondary-font);
}
.car-details-included-excluded{
    margin-bottom: 30px;
}
.car-details-included-list li{
    display: flex;
    align-items: center;
    gap: 14px;
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
    color: var(--primary-color);
    margin-bottom: 20px;
    font-family: var(--secondary-font);
}
.car-details-included-list li i{
    color: #45DE5E;
    font-size: 13px;
}
.car-details-excluded-list li{
    display: flex;
    align-items: center;
    gap: 14px;
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
    color: var(--primary-color);
    margin-bottom: 20px;
    font-family: var(--secondary-font);
}
.car-details-excluded-list li i{
    color: var(--theme-color);
    font-size: 13px;
}
.car-details-highlights{
    padding-bottom: 30px;
    margin-bottom: 50px;
    border-bottom: 1px solid #E5E5E5;
}
.car-details-highlights-text{
    font-size: 16px;
    line-height: 26px;
    color: #6A6A6A;
    font-weight: 400;
    margin-bottom: 20px;
    font-family: var(--secondary-font);
}
.car-details-top-highlights-list li{
    display: flex;
    align-items: center;
    gap: 14px;
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
    color: var(--primary-color);
    margin-bottom: 20px;
    font-family: var(--secondary-font);
}
.car-details-top-highlights-list li i{
    color: #45DE5E;
    font-size: 20px;
}
.car-details-right-sidebar{
    position: relative;
    padding: 30px;
    background: #ffffff;
    border-radius: 10px;
    filter: drop-shadow(0px 10px 80px rgb(0 0 0 / 4%));
}
.select-date-box{
    margin-bottom: 30px;
}
.select-date-box input{
    position: relative;
    border-radius: 10px;
    padding: 10px 30px;
    width: 100%;
    font-size: 16px;
    line-height: 30px;
    font-weight: 600;
    color: var(--primary-color);
    font-family: var(--secondary-font);
    background-color: #F4F4F4;
}
.add-extra-box .link-btn .btn-style-four{
    width: 100%;
    text-align: center;
}
.select-time-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 20px;
    margin-bottom: 20px;
    border-bottom: 1px solid #E5E5E5;
}
.select-time-box label{
    font-size: 16px;
    font-weight: 500;
    line-height: 30px;
    color: var(--primary-color);
    text-transform: capitalize;
    font-family: var(--secondary-font);
}
.select-time-box input{
    font-size: 14px;
    font-weight: 400;
    line-height: 30px;
    color: #6A6A6A;
    font-family: var(--secondary-font);
}
.select-delivery-box{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 20px;
    margin-bottom: 20px;
    border-bottom: 1px solid #E5E5E5;
}
.select-delivery-box label{
    font-size: 16px;
    font-weight: 500;
    line-height: 30px;
    color: var(--primary-color);
    text-transform: capitalize;
    font-family: var(--secondary-font);
}
.select-delivery-box input{
    font-size: 14px;
    font-weight: 400;
    line-height: 30px;
    color: #6A6A6A;
    font-family: var(--secondary-font);
}
.add-extra-box h6.add-extra-sub-title{
    font-size: 16px;
    font-weight: 500;
    line-height: 30px;
    color: var(--primary-color);
    text-transform: capitalize;
    font-family: var(--secondary-font);
    margin-bottom: 15px;
}
.add-extra-box .check-box{
    position: relative;
}
.add-extra-box .check-box span{
    position: absolute;
    right: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 30px;
    color: #6A6A6A;
    font-family: var(--secondary-font);
}
.price-list{
    padding-bottom: 20px;
    margin-bottom: 20px;
    border-bottom: 1px solid #E5E5E5;
}
.price-list li{
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: space-between;
    padding-bottom: 10px;
}
.price-list li h6{
    font-size: 16px;
    font-weight: 400;
    line-height: 30px;
    color: #6A6A6A;
    text-transform: capitalize;
    font-family: var(--secondary-font);
}
.price-list li span{
    font-size: 16px;
    font-weight: 700;
    line-height: 30px;
    color: var(--primary-color);
    font-family: var(--primary-font);
}
.rating-outer-box{
    position: relative;
    padding: 30px;
    display: flex;
    align-items: center;
    gap: 30px;
    background: #ffffff;
    margin-bottom: 50px;
    border-radius: 10px;
    filter: drop-shadow(0px 20px 80px rgb(0 0 0 / 8%));
}
.rating-title-box{
    position: relative;
    padding: 35px;
    padding-left: 24px;
    padding-right: 54px;
    flex-shrink: 0;
    border-right: 1px solid #E5E5E5;
}
.rating-title-box h2{
    font-size: 42px;
    line-height: 50px;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    color: var(--theme-color);
    font-family: var(--primary-font);
}
.rating-title-box h2 i{
    font-size: 33px;
    color: var(--rating-color);
}
.rating-title-box h6{
    font-size: 20px;
    line-height: 30px;
    font-weight: 700;
    color: #000000;
    font-family: var(--primary-font);
}
.rating-title-box p{
    font-size: 16px;
    line-height: 30px;
    font-weight: 400;
    color: #000000;
    font-family: var(--secondary-font);
}
.rating-progress-box{
    width: 100%;
    padding-left: 20px;
}
.rating-progress-box .progress-box{
    position: relative;
    display: flex;
    justify-items: stretch;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 5px;
}
.rating-progress-box .progress-box .title{
    width: 22%;
    font-size: 16px;
    font-weight: 400;
    line-height: 30px;
    color: #6A6A6A;
    font-family: var(--secondary-font);
}
.rating-progress-box .progress-box .bar{
    max-width: 300px;
    width:100%;
    height:4px;
    flex-shrink: 0;
    background: #E2E2E2;
    border-radius: 51px;
}
.rating-progress-box .progress-box .bar-inner{
    display:block;
    width:0px;
    height:4px;
    background: #10B451;
    border-radius: 51px;
    -webkit-transition:all 1500ms ease;
    -ms-transition:all 1500ms ease;
    -o-transition:all 1500ms ease;
    -moz-transition:all 1500ms ease;
    transition:all 1500ms ease;
}
.rating-progress-box .progress-box .progress-bar-text{
    display: flex;
    align-items: center;
    justify-content: end;
    flex-shrink: 0;
    gap: 5px;
    font-size: 16px;
    font-weight: 400;
    line-height: 30px;
    color: #6A6A6A;
    font-family: var(--secondary-font);
    width: 12%;
}
.comment-inner {
    padding-bottom: 50px;
    margin-bottom: 40px;
    border-bottom: 1px solid #E5E5E5;
}
.comment-inner .comment-box{
    display: flex;
    align-items: flex-start;
    gap: 20px;
    margin-bottom: 24px;
}
.comment-inner .comment-box:last-child{
    margin-bottom: 0;
}
.comment-box .comment-thumb{
    width: 80px;
    height: 80px;
    text-align: center;
    border-radius: 50%;
    flex-shrink: 0;
    overflow: hidden;
}
.comment-box .comment-details{
    position: relative;
    padding: 20px 30px;
    border-radius: 5px;
    border: 1px solid #E5E5E5;
}
.comment-box .comment-details h6{
    font-size: 20px;
    font-weight: 600;
    line-height: 30px;
    color: var(--primary-color);
    font-family: var(--primary-font);
}
.comment-box .comment-details .post-date{
    font-size: 14px;
    font-weight: 400;
    line-height: 30px;
    color: #6A6A6A;
    display: block;
    margin-bottom: 10px;
    font-family: var(--secondary-font);
}
.comment-box .comment-details p{
    font-size: 16px;
    font-weight: 400;
    line-height: 30px;
    color: #6A6A6A;
    padding-bottom: 25px;
    margin-bottom: 25px;
    border-bottom: 1px solid #E5E5E5;
    font-family: var(--secondary-font);
}
.comment-box .comment-details .reply-btn{
    position: absolute;
    top: 30px;
    right: 30px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 30px;
}
.comment-box .comment-details .reply-btn i{
    font-size: 15px;
}
.comment-box .comment-details .rating-box{
    display: flex;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
    justify-content: space-between;
}
.comment-box .comment-details .rating-box .rating{
    display: flex;
    align-items: center;
    gap: 20px;
    width: 30%;
}
.comment-box .comment-details .rating-box .rating span{
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
    color: var(--primary-color);
    font-family: var(--secondary-font);
}
.comment-box .comment-details .rating-box .rating ul{
    display: flex;
    align-items: center;
    gap: 5px;
}
.comment-box .comment-details .rating-box .rating ul li{
    font-size: 12px;
    line-height: 20px;
    color: var(--rating-color);
}
.comment-box.replay-comment{
    margin-left: 100px;
}
.comment-box.replay-comment .comment-details p{
    padding-bottom: 0;
    margin-bottom: 0;
    border-bottom: none;
}
.comment-form-area h4.comment-form-title{
    font-size: 24px;
    font-weight: 500;
    line-height: 32px;
    font-family: var(--primary-font);
    color: var(--primary-color);
    margin-bottom: 30px;
}
.comment-form .rating-box{
    display: flex;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
    margin-bottom: 30px;
    justify-content: space-between;
}
.comment-form .rating-box .rating{
    display: flex;
    align-items: center;
    gap: 20px;
    width: 30%;
}
.comment-form .rating-box .rating span{
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
    color: var(--primary-color);
    font-family: var(--secondary-font);
}
.comment-form .rating-box .rating ul{
    display: flex;
    align-items: center;
    gap: 5px;
}
.comment-form .rating-box .rating ul li{
    font-size: 12px;
    line-height: 20px;
    color: #CACACA;
}
.comment-form .rating-box .rating ul li.rated-star{
    color: var(--rating-color);
}
.comment-form .form-group{
    margin-bottom: 30px;
}
.comment-form form input,
.comment-form form textarea{
    width: 100%;
    height: 50px;
    font-size: 16px;
    line-height: 26px;
    padding: 12px 20px;
    color: #6A6A6A;
    font-weight: 400;
    border-radius: 5px;
    background: #ffffff;
    transition: all 500ms;
    border: 1px solid #e5e5e5;
}
.comment-form form textarea{
    height: 170px;
    resize: none;
}
.comment-form form input:focus,
.comment-form form textarea:focus{
    border-color: var(--theme-color);
}
.blog-sidebar{
    position: relative;
    padding: 60px 40px;
    border-radius: 10px;
    margin-left: 22px;
    box-shadow: 0 10px 50px rgb(0 0 0 / 5%);
}
.blog-sidebar .sidebar-search-widget{
    border-bottom: none;
    padding-bottom: 0;
    margin-bottom: 0px;
}
.blog-sidebar .sidebar-widget{
    margin-bottom: 50px;
}
.sidebar-category-list li a{
    position: relative;
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
    color: var(--primary-color);
    padding: 8px 0px;
    display: inline-block;
    font-family: var(--secondary-font);
}
.sidebar-category-list li a:before{
    position: absolute;
    top: 9px;
    left: 0;
    content: '\f105';
    font-size: 15px;
    font-weight: 900;
    color: #000000;
    opacity: 0;
    transition: all 500ms;
    font-family: "Font Awesome 6 Free";
}
.sidebar-category-list li a:hover{
    color: var(--theme-color);
    padding-left: 16px;
}
.sidebar-category-list li a:hover:before{
    opacity: 1;
}
.sidebar-post-inner .post{
    display: flex;
    align-items: center;
    gap: 20px;
    padding-bottom: 20px;
    margin-bottom: 20px;
    border-bottom: 1px solid #E5E5E5;
}
.sidebar-post-inner .post:last-child{
    border-bottom: none;
}
.sidebar-post-inner .post .post-thumb{
    width: 90px;
    height: 90px;
    line-height: 90px;
    text-align: center;
    border-radius: 10px;
    overflow: hidden;
    flex-shrink: 0;
}
.sidebar-post-inner .post .post-text h5{
    font-size: 18px;
    line-height: 22px;
    font-weight: 600;
    margin-bottom: 10px;
    font-family: var(--primary-font);
}
.sidebar-post-inner .post .post-text h5 a{
    color: var(--primary-color);
    display: inline-block;
    transition: all 500ms;
}
.sidebar-post-inner .post .post-text h5 a:hover{
    color: var(--theme-color);
}
.sidebar-post-inner .post .post-text span.post-date{
    font-size: 15px;
    font-weight: 400;
    color: #6A6A6A;
    line-height: 20px;
    display: flex;
    align-items: center;
    gap: 5px;
    font-family: var(--secondary-font);
}
.sidebar-post-inner .post .post-text span.post-date i{
    font-size: 16px;
    color: var(--theme-color);
}
.gallery-image-list{
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.gallery-image-list li .image{
    position: relative;
    display: block;
    max-width: 96px;
    width: 100%;
    overflow: hidden;
    border-radius: 5px;
}
.sidebar-archives-list li a{
    position: relative;
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
    color: var(--primary-color);
    padding: 8px 0px;
    display: inline-block;
    font-family: var(--secondary-font);
}
.sidebar-archives-list li a:before{
    position: absolute;
    top: 9px;
    left: 0;
    content: '\f105';
    font-size: 15px;
    font-weight: 900;
    color: var(--primary-color);
    opacity: 0;
    transition: all 500ms;
    font-family: "Font Awesome 6 Free";
}
.sidebar-archives-list  li a:hover{
    color: var(--theme-color);
    padding-left: 16px;
}
.sidebar-archives-list  li a:hover:before{
    opacity: 1;
    color: var(--theme-color);
}
.sidebar-tags-list{
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
}
.sidebar-tags-list li a{
    font-size: 15px;
    line-height: 26px;
    color: #6A6A6A;
    font-weight: 400;
    padding: 5px 17px;
    background: #F4F4F4;
    border-radius: 55px;
    display: inline-block;
    transition: all 500;
    font-family: var(--secondary-font);
}
.sidebar-tags-list li a:hover{
    color: #ffffff;
    background-color: var(--theme-color);
}
.blog-sidebar .sidebar-widget:last-child{
    margin-bottom: 0;
}

.listing-blog {
    border-radius: 10px;
    box-shadow: 0 10px 50px rgb(0 0 0 / 5%);
}
.listing-blog .blog-post-content{
    padding: 30px;
    padding-top: 0;
}
.listing-blog .post-title{
    font-size: 36px;
    font-weight: 600;
    line-height: 48px;
}
.blockquote{
    position: relative;
    padding: 40px 30px;
    background: #ffffff;
    display: flex;
    align-items: flex-start;
    gap: 35px;
    border-radius: 10px;
    margin-top: 50px;
    margin-bottom: 50px;
    border-top: 3px solid var(--theme-color);
    box-shadow: 0 10px 80px rgb(0 0 0 / 4%);
}
.blockquote .quote-icon{
    font-size: 40px;
    color: #000000;
}
.blockquote .quote-text p{
    font-size: 20px;
    line-height: 30px;
    font-weight: 400;
    font-family: var(--primary-font);
    color: var(--primary-color);
    margin-bottom: 15px;
}
.blockquote .quote-text strong{
    font-size: 20px;
    line-height: 30px;
    font-weight: 700;
    font-family: var(--primary-font);
    color: var(--primary-color);
}
.blog-details-content .post-title{
    font-size: 36px;
    line-height: 48px;
    margin-bottom: 20px;
}
.blog-details-content p.blog-text{
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
    color: #6A6A6A;
    margin-bottom: 20px;
    font-family: var(--secondary-font);
}
.blog-details-content .image{
    border-radius: 10px;
    overflow: hidden;
    margin-top: 30px;
    margin-bottom: 30px;
}
.post-share-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 30px;
    margin-bottom: 40px;
    flex-wrap: wrap;
    border-bottom: 1px solid #E5E5E5;
}
.post-share-box ul{
    display: flex;
    align-items: center;
    gap: 10px;
}
.post-share-box ul{
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
}
.post-share-box .post-tags{
    gap: 10px;
}
.post-share-box .post-tags li h6{
    font-size: 16px;
    line-height: 26px;
    font-weight: 500;
    color: var(--primary-color);
}
.post-share-box .post-tags li a{
    font-size: 15px;
    font-weight: 400;
    line-height: 26px;
    color: #6A6A6A;
    border-radius: 45px;
    padding: 4px 20px;
    display: inline-block;
    transition: all 500ms;
    border: 1px solid #E5E5E5;
    font-family: var(--secondary-font);
}
.post-share-box .post-tags li a:hover{
    color: #ffffff;
    background-color: var(--theme-color);
}
.post-share-box .post-share{
    gap: 20px;
}
.post-share-box .post-share li a{
    gap: 20px;
    font-size: 16px;
    color: #6A6A6A;
    display: inline-block;
    transition: all 500ms;
}
.post-share-box .post-share li a:hover{
    color: var(--theme-color);
}
.blog-post-content .author-box{
    display: flex;
    align-items: flex-start;
    gap: 30px;
    margin-bottom: 50px;
}
.blog-post-content .author-thumb{
    width: 120px;
    height: 120px;
    flex-shrink: 0;
    overflow: hidden;
    border-radius: 100px;
}
.blog-post-content .author-box .author-info h4{
    font-size: 24px;
    font-weight: 700;
    line-height: 30px;
    color: var(--primary-color);
    font-family: var(--primary-font);
}
.blog-post-content .author-box .designation{
    font-size: 16px;
    font-weight: 400;
    line-height: 26px;
    color: #6A6A6A;
    display: block;
    font-family: var(--secondary-font);
    margin-bottom: 10px;
}
.blog-post-content .author-box .designation{
    font-size: 15px;
    font-weight: 400;
    line-height: 28px;
    color: #6A6A6A;
    font-family: var(--secondary-font);
}
.contact-info-item{
    position: relative;
    padding: 0 60px 40px;
    background: #ffffff;
    margin-top: 50px;
    border-radius: 10px;
    margin-bottom: 30px;
    box-shadow: 0 10px 80px rgb(0 0 0 / 7%);
}
.contact-info-icon{
    width: 100px;
    height: 100px;
    line-height: 110px;
    text-align: center;
    border-radius: 10px;
    display: inline-block;
    transform: translateY(-50px);
    margin-bottom: -20px;
    font-size: 40px;
    color: #ffffff;
    background: var(--theme-color);
    box-shadow: 0 10px 50px rgb(0 0 0 / 8%);
}
h4.contact-info-title{
    font-size: 24px;
    line-height: 32px;
    font-weight: 600;
    font-family: var(--primary-font);
    color: #0D0D0D;
    text-transform: capitalize;
    margin-bottom: 15px;
}
.contact-info-text p{
    font-size: 16px;
    line-height: 32px;
    font-weight: 400;
    color: #6A6A6A;
    font-family: var(--secondary-font);
}
.contact-info-text a{
    font-size: 16px;
    line-height: 20px;
    font-weight: 400;
    color: #6A6A6A;
    display: inline-block;
    font-family: var(--secondary-font);
    transition: all 500ms;
}
.contact-info-text a:hover{
    color: var(--theme-color);
}
.google-map-section iframe{
    height: 520px;
    width: 100%;
    border-radius: 10px;
}
.contact-section .default-form{
    max-width: 850px;
    width: 100%;
    margin: 0 auto;
}
.contact-section .default-form .form-group{
    margin-bottom: 30px;
}
.contact-section .default-form .form-group input,
.contact-section .default-form .form-group textarea{
    width: 100%;
    height: 50px;
    font-size: 16px;
    line-height: 26px;
    padding: 12px 20px;
    color: #6A6A6A;
    font-weight: 400;
    border-radius: 5px;
    background: #ffffff;
    transition: all 500ms;
    border: 1px solid #E5E5E5;
}
.contact-section .default-form .form-group textarea{
    height: 170px;
    resize: none;
}
.contact-section .default-form .form-group input:focus,
.contact-section .default-form .form-group textarea:focus{
    border-color: var(--theme-color);
}
.contact-section .btn-style-five{
    padding: 15px 30px;
}

.error-container-outer h1{
    font-size: 44px;
    font-weight: 600;
    color: var(--primary-color);
    line-height: 56px;
    margin-bottom: 40px;
    font-family: var(--primary-font);
}
.error-container-outer h1 span{
    color: var(--theme-color);
}
.error-container-outer .button-outer-box{
    display: flex;
    justify-content: center;
    gap: 30px;
}
.error-container-outer .button-outer-box .btn-style-five{
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 15px 30px;
}
.error-container-outer .button-outer-box .btn-style-five i{
    font-size: 10px;
}
.error-container-outer .button-outer-box .btn-style-four{
    font-size: 14px;
    line-height: 20px;
    padding: 15px 30px;
}



/* ===== MODERN BLUR BOXES SECTION ===== */
.blur-boxes-section {
  position: relative;
  margin-top: 0px; /* Changed from negative margin to move boxes down */
  padding: 48px 20px 40px;
  margin-bottom: 28px;
  z-index: 5;
  background: linear-gradient(180deg, rgba(248, 249, 250, 0) 0%, rgba(248, 249, 250, 0.5) 100%);
}

.blur-boxes-container {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
  max-width: 1200px;
  margin: 0 auto;
}
/* Remove background + reduce overall height */
.finance-banner {
    padding: 0;             /* no extra spacing */
    margin-top: 30px;      /* move upward */
    text-align: center;
    position: relative;
    background: transparent !important;

}

/* Make GIF smaller + responsive */
.finance-banner-img {
    max-width: 100%;         /* smaller image */
    height: auto;
    display: block;
    margin: 0 auto;
}

/* Desktop only visibility (already in classes, but safe) */
@media (max-width: 1199px) {
    .finance-banner {
        display: none;
    }
}
/* Modern Blur Box Card */
.modern-blur-box {
  --bg: #ffffff;
  --title-color: #fff;
  --title-color-hover: #1a1a2e;
  --text-color: #f0f0f0;
  --button-color: rgba(255, 255, 255, 0.2);
  --button-color-hover: var(--snh-red);
  --accent-color: var(--snh-red);

  background: var(--bg);
  border-radius: 2rem;
  overflow: hidden;
  position: relative;
  font-family: 'Inter', 'Lato', 'Montserrat', sans-serif;
  transition: all 0.4s cubic-bezier(0.2, 0.9, 0.4, 1.1);
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.15);
  cursor: pointer;
  height: 400px;
}

/* Image Wrapper */
.box-image-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

/* Background Image */
.modern-blur-box > .box-image-wrapper > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  transition: transform 0.6s cubic-bezier(0.3, 0.9, 0.4, 1.1);
}

/* Dark Overlay - Always present */
.image-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0.3) 0%,
    rgba(0, 0, 0, 0.6) 50%,
    rgba(0, 0, 0, 0.85) 100%
  );
  transition: all 0.4s ease;
  z-index: 1;
}

/* Content Section */
.modern-blur-box > section {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 2rem 1.5rem 1.8rem;
  display: flex;
  flex-direction: column;
  z-index: 2;
  background: linear-gradient(
    to top,
    rgba(0, 0, 0, 0.9) 0%,
    rgba(0, 0, 0, 0.5) 70%,
    transparent 100%
  );
  transition: all 0.4s ease;
}

.modern-blur-box > section h2 {
  margin: 0;
  margin-block-end: 0.75rem;
  font-size: 1.6rem;
  font-weight: 700;
  color: white;
  transition: all 0.3s ease;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
  transform: translateY(0);
}

.modern-blur-box > section p {
  font-size: 0.9rem;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.9);
  margin: 0 0 1rem 0;
  transition: all 0.3s ease 0.05s;
  text-shadow: 0 1px 5px rgba(0, 0, 0, 0.2);
  opacity: 0.9;
}

.modern-blur-box > section > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 0.5rem;
  transition: all 0.3s ease 0.1s;
}

/* Stock Tag */
.modern-blur-box > section > div .stock-tag {
  color: white;
  font-size: 0.85rem;
  font-weight: 600;
  background: rgba(var(--snh-red-rgb), 0.85);
  padding: 0.5rem 1rem;
  border-radius: 2rem;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  letter-spacing: 0.3px;
  backdrop-filter: blur(4px);
  transition: all 0.3s ease;
}

.modern-blur-box > section > div .stock-tag i {
  font-size: 0.9rem;
}

/* Explore Button */
.modern-blur-box > section > div button {
  border: none;
  border-radius: 2rem;
  font-size: 0.85rem;
  font-weight: 600;
  padding: 0.7rem 1.2rem;
  background: white;
  transition: all 0.3s ease;
  cursor: pointer;
  color: #1a1a2e;
  font-family: inherit;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.modern-blur-box > section > div button i {
  transition: transform 0.2s ease;
  font-size: 0.8rem;
}

.modern-blur-box > section > div button:hover {
  background: var(--snh-red);
  color: white;
  transform: translateX(3px);
  box-shadow: 0 4px 12px rgba(var(--snh-red-rgb), 0.4);
}

.modern-blur-box > section > div button:hover i {
  transform: translateX(4px);
}

/* ===== HOVER EFFECTS ===== */
/* On hover - Image clears (overlay disappears) */
.modern-blur-box:hover .image-overlay {
  opacity: 0;
  visibility: hidden;
}

.modern-blur-box:hover > .box-image-wrapper > img {
  transform: scale(1.08);
}

/* Content section background becomes lighter on hover */
.modern-blur-box:hover > section {
  background: linear-gradient(
    to top,
    rgba(0, 0, 0, 0.7) 0%,
    rgba(0, 0, 0, 0.3) 70%,
    transparent 100%
  );
}

/* Text stays visible but adjusts */
.modern-blur-box:hover > section h2 {
  transform: translateY(-5px);
  color: white;
}

.modern-blur-box:hover > section p {
  opacity: 1;
}

.modern-blur-box:hover > section > div .stock-tag {
  background: var(--snh-red);
  transform: translateY(-2px);
}

/* Box lift effect */
.modern-blur-box:hover {
  transform: translateY(-12px);
  box-shadow: 0 30px 50px rgba(0, 0, 0, 0.25);
}

/* Responsive Design */
@media (max-width: 992px) {
  .blur-boxes-section {
    margin-top: 20px;
    padding: 40px 20px 60px;
  }

  .blur-boxes-container {
    gap: 25px;
  }

  .modern-blur-box {
    height: 360px;
  }

  .modern-blur-box > section {
    padding: 1.5rem 1.2rem 1.2rem;
  }

  .modern-blur-box > section h2 {
    font-size: 1.4rem;
  }

  .modern-blur-box > section p {
    font-size: 0.85rem;
  }
}

@media (max-width: 768px) {
  .blur-boxes-section {
    margin-top: 0;
    padding: 30px 15px 50px;
  }

  .blur-boxes-container {
    grid-template-columns: 1fr;
    gap: 30px;
    max-width: 450px;
  }

  .modern-blur-box {
    height: 380px;
  }
}

@media (max-width: 480px) {
  .modern-blur-box {
    height: 350px;
  }

  .modern-blur-box > section {
    padding: 1.2rem 1rem 1rem;
  }

  .modern-blur-box > section h2 {
    font-size: 1.3rem;
    margin-bottom: 0.5rem;
  }

  .modern-blur-box > section p {
    font-size: 0.8rem;
    margin-bottom: 0.8rem;
  }

  .modern-blur-box > section > div .stock-tag {
    font-size: 0.7rem;
    padding: 0.4rem 0.8rem;
  }

  .modern-blur-box > section > div button {
    font-size: 0.7rem;
    padding: 0.5rem 1rem;
  }
}

/* Car Cards Section */
.car-cards-section {
    background-color: #fff;
    padding: 28px 0 32px;
    position: relative;
    overflow: hidden;
}

.cards-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 20px;
}

.cards-header {
    text-align: center;
    margin-bottom: 20px;
    opacity: 0;
    transform: translateY(30px);
    animation: fadeInUp 0.8s ease-out forwards;
}

.cards-header h2 {
    font-size: 42px;
    color: var(--snh-red);
    margin-bottom: 15px;
    font-weight: 700;
    position: relative;
    display: inline-block;
}

.cards-header h2::after {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    width: 80px;
    height: 4px;
    background: var(--snh-red);
    border-radius: 2px;
}

.cards-header p {
    font-size: 17px;
    color: #666;
    max-width: 700px;
    margin: 12px auto 0;
    line-height: 1.6;
}

.cards-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(380px, 1fr));
    gap: 20px;
}

.car-card {
    background: #fff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(var(--snh-red-rgb), 0.1);
    transition: all 0.4s ease;
    position: relative;
    opacity: 0;
    transform: translateY(40px);
    animation: fadeInUp 0.8s ease-out forwards;
}

.car-card:nth-child(1) { animation-delay: 0.1s; }
.car-card:nth-child(2) { animation-delay: 0.2s; }
.car-card:nth-child(3) { animation-delay: 0.3s; }
.car-card:nth-child(4) { animation-delay: 0.4s; }
.car-card:nth-child(5) { animation-delay: 0.5s; }
.car-card:nth-child(6) { animation-delay: 0.6s; }

.car-card:hover {
    transform: translateY(-12px);
    box-shadow: 0 20px 40px rgba(var(--snh-red-rgb), 0.15);
}

.car-image-link {
    display: block;
    text-decoration: none;
    color: inherit;
    cursor: pointer;
}

.car-image-container {
    position: relative;
    height: 250px;
    overflow: hidden;
    background: linear-gradient(135deg, #f8f9fa, #e9ecef);
    border-radius: 16px 16px 0 0;
}

.car-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.5s ease;
}

.car-card:hover .car-image {
    transform: scale(1.05);
}

.image-hover-zones {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    z-index: 5;
}

.hover-zone {
    flex: 1;
    cursor: pointer;
    position: relative;
    transition: all 0.3s ease;
}

.hover-zone:hover {
    background: rgba(var(--snh-red-rgb), 0.1);
}

.hover-zone::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 10px;
    height: 10px;
    background: rgba(255,255,255,0.9);
    border-radius: 50%;
    opacity: 0;
    transition: all 0.3s ease;
    border: 2px solid var(--snh-red);
    box-shadow: 0 0 0 2px rgba(255,255,255,0.8);
}

.hover-zone:hover::before {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1.3);
}

/* Mobile Slider Styles */
.car-image-slider {
    display: none;
    position: relative;
    height: 250px;
    overflow: hidden;
    border-radius: 16px 16px 0 0;
}

.slider-track {
    display: flex;
    transition: transform 0.3s ease;
    height: 100%;
}

.slider-slide {
    min-width: 100%;
    height: 100%;
}

.slider-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.slider-dots {
    position: absolute;
    bottom: 15px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 8px;
    z-index: 10;
}

.slider-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.5);
    border: 2px solid rgba(255, 255, 255, 0.8);
    cursor: pointer;
    transition: all 0.3s ease;
}

.slider-dot.active {
    background: #fff;
    transform: scale(1.2);
}

.slider-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(255, 255, 255, 0.9);
    border: none;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 10;
    transition: all 0.3s ease;
    font-size: 18px;
    color: var(--snh-red);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.slider-nav:hover {
    background: #fff;
    transform: translateY(-50%) scale(1.1);
}

.slider-prev {
    left: 10px;
}

.slider-next {
    right: 10px;
}

.car-card-content {
    padding: 18px 20px 20px;
    position: relative;
}

.car-name {
    font-size: 20px;
    font-weight: 700;
    color: #333;
    margin-bottom: 10px;
    transition: color 0.3s ease;
    line-height: 1.45;
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.car-card:hover .car-name {
    color: var(--snh-red);
}

.car-price {
    font-size: 26px;
    font-weight: 700;
    color: var(--snh-red);
    margin-bottom: 12px;
    display: flex;
    align-items: center;
}

.car-price::before {
    content: '£';
    font-size: 20px;
    margin-right: 2px;
}

.car-details {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 10px;
    margin-bottom: 16px;
    padding-bottom: 14px;
    border-bottom: 1px solid #eee;
}

.detail-item {
    text-align: center;
    padding: 6px 8px;
    border-radius: 8px;
    transition: all 0.3s ease;
}

.detail-item:hover {
    background: rgba(var(--snh-red-rgb), 0.05);
    transform: translateY(-3px);
}

.detail-label {
    font-size: 12px;
    color: #999;
    text-transform: uppercase;
    margin-bottom: 5px;
    font-weight: 600;
    letter-spacing: 0.5px;
}

.detail-value {
    font-size: 14px;
    font-weight: 600;
    color: #333;
}

.card-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
}

.view-details-btn {
    background: var(--snh-red);
    color: white;
    padding: 14px 20px;
    border: none;
    border-radius: 10px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    text-decoration: none;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    box-shadow: 0 4px 15px rgba(var(--snh-red-rgb), 0.3);
    position: relative;
    overflow: hidden;
}

.view-details-btn::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
    transition: all 0.5s ease;
}

.view-details-btn:hover::before {
    left: 100%;
}

.view-details-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(var(--snh-red-rgb), 0.4);
}

.action-buttons {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 10px;
}

.action-btn {
    padding: 12px 15px;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    text-decoration: none;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

.car-cards-section .action-btn.whatsapp-btn,
.whatsapp-btn {
    background: #25d366;
    color: #ffffff;
}

.car-cards-section .action-btn.whatsapp-btn:hover,
.whatsapp-btn:hover {
    background: #1ebe57;
    color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(37, 211, 102, 0.3);
}

/* Higher specificity — overrides chat-bot-widget .action-btn */
.car-cards-section .action-btn.enquire-btn,
.enquire-btn {
    background: #6c757d;
    color: #ffffff;
}

.car-cards-section .action-btn.enquire-btn:hover,
.enquire-btn:hover {
    background: #374151;
    color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 4px 14px rgba(55, 65, 81, 0.35);
}

.car-cards-section .action-btn.finance-btn,
.finance-btn {
    background: var(--snh-red);
    color: #ffffff;
}

.car-cards-section .action-btn.finance-btn:hover,
.finance-btn:hover {
    background: var(--snh-red-dark);
    color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 4px 14px rgba(var(--snh-red-rgb), 0.4);
}

/* Animations */
@keyframes fadeInUp {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* Featured vehicles — mobile button layout */
@media (max-width: 768px) {
    .car-cards-section .card-actions {
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
        width: 100%;
    }

    .car-cards-section .view-details-btn {
        width: 100%;
        box-sizing: border-box;
        padding: 14px 16px;
    }

    .car-cards-section .action-buttons {
        display: grid !important;
        grid-template-columns: 52px 1fr 1fr !important;
        gap: 8px !important;
        width: 100%;
        align-items: stretch;
    }

    .car-cards-section .action-btn {
        white-space: nowrap;
        overflow: visible;
        text-overflow: unset;
        padding: 12px 8px;
        font-size: 12px;
        min-height: 46px;
        box-sizing: border-box;
        width: 100%;
    }

    .car-cards-section .whatsapp-btn {
        padding: 12px;
        min-width: 52px;
    }

    .car-cards-section .whatsapp-btn i {
        font-size: 20px;
    }

    .car-cards-section .enquire-btn,
    .car-cards-section .finance-btn {
        justify-content: center;
        text-align: center;
    }
}

@media (max-width: 400px) {
    .car-cards-section .action-buttons {
        grid-template-columns: 1fr 1fr !important;
        grid-template-rows: auto auto;
    }

    .car-cards-section .whatsapp-btn {
        grid-column: 1 / -1;
        width: 100%;
        min-height: 44px;
    }

    .car-cards-section .enquire-btn {
        grid-column: 1;
    }

    .car-cards-section .finance-btn {
        grid-column: 2;
    }
}

        /* Responsive Design */
        @media (max-width: 768px) {
            .top-bar {
                padding: 8px 20px;
                font-size: 12px;
            }

            .top-bar .contact-info {
                gap: 15px;
                flex-direction: column;
                align-items: flex-start;
            }

            .top-bar .contact-info div {
                font-size: 12px;
            }

            .top-bar .social-icons {
                gap: 10px;
                margin-top: 5px;
            }
/*
            header {
                padding: 10px 20px;
            }

            nav {
                display: none;
                position: absolute;
                top: 100%;
                right: 0;
                background: #fff;
                width: 100%;
                text-align: center;
                box-shadow: 0 4px 10px rgba(0,0,0,0.1);
            }

            nav ul {
                flex-direction: column;
                gap: 0;
                padding: 20px 0;
            }

            nav ul li a {
                padding: 15px 20px;
                border-bottom: 1px solid #eee;
                display: block;
            }

            .menu-toggle {
                display: block;
            }

            nav.active {
                display: block;
            } */

            .hero {
                height: 70vh;
            }

            .hero-content {
                max-width: 100%;
                padding: 0 20px;
            }

            .hero-content h1 {
                font-size: 32px;
            }

            .hero-content p {
                font-size: 16px;
            }

            .hero-content .btn {
                font-size: 14px;
                padding: 12px 24px;
            }

            .slider-wrapper {
                padding: 20px 10px;
            }

            .slide {
                min-width: 200px;
                flex: 0 0 200px;
                padding: 15px 5px;
            }

            .car-icon {
                width: 100px;
                height: 70px;
            }

            .car-icon svg {
                width: 70px;
                height: 50px;
            }

            .nav-btn {
                width: 40px;
                height: 40px;
                font-size: 16px;
            }

            .nav-btn.prev {
                left: 10px;
            }

            .nav-btn.next {
                right: 10px;
            }

            .cards-grid {
                grid-template-columns: 1fr;
                gap: 20px;
            }

            .cards-header h2 {
                font-size: 28px;
            }
        }

        @media (max-width: 480px) {
            .top-bar .contact-info div {
                font-size: 11px;
            }

            .hero-content h1 {
                font-size: 28px;
            }

            .hero-content p {
                font-size: 14px;
            }

            .slide {
                min-width: 160px;
                flex: 0 0 160px;
            }

            .slider-header h2 {
                font-size: 24px;
            }

            .car-title {
                font-size: 18px;
            }

            .car-image-container {
                height: 200px;
            }

            .car-card-content {
                padding: 20px;
            }

            .car-details {
                grid-template-columns: 1fr 1fr;
                gap: 10px;
            }
        }

/* Car Brands Section */

    .car-brands-section {
      display: flex;
      flex-wrap: wrap;
      max-width: 1200px;
      margin: 0 auto;
      background: var(--snh-red);
      border-radius: 15px;
      overflow: hidden;
      box-shadow: 0 10px 30px rgba(var(--snh-red-rgb), 0.2);
    }

    .car-brands-content {
      flex: 1;
      min-width: 300px;
      padding: 50px 40px;
      color: white;
      display: flex;
      flex-direction: column;
      justify-content: center;
    }

    .car-brands-content h2 {
      font-size: 2.5rem;
      font-weight: 800;
      margin-bottom: 20px;
      text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2);
      color: #FFF0F1;
    }

    .car-brands-content p {
      font-size: 1.1rem;
      margin-bottom: 30px;
      opacity: 0.9;
      line-height: 1.7;
      color:  #FFF0F1;
    }

    .car-brands-btn {
      display: inline-block;
      background: white;
      color: var(--snh-red);
      padding: 12px 30px;
      border-radius: 30px;
      text-decoration: none;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 1px;
      transition: all 0.3s ease;
      box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
      width: fit-content;
    }

    .car-brands-btn:hover {
      background: #f0f0f0;
      transform: translateY(-3px);
      box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
    }

    .car-brands-grid {
      flex: 1.5;
      min-width: 300px;
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 20px;
      padding: 40px;
      background: white;
      border-top-left-radius: 50px;
      border-bottom-left-radius: 50px;
    }

    .car-brand-card {
      background: white;
      border-radius: 10px;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 20px;
      transition: all 0.3s ease;
      box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
      border: 1px solid #f0f0f0;
      min-height: 120px;
      opacity: 0;
      transform: translateY(20px);
    }

    .car-brand-card.show {
      animation: fadeInUp 0.6s ease-out forwards;
    }

    .car-brand-card img {
      max-width: 100%;
      max-height: 60px;
      object-fit: contain;
      filter: grayscale(100%);
      transition: all 0.3s ease;
    }

    .car-brand-card:hover img {
      filter: grayscale(0%);
      transform: scale(1.1);
    }

    @keyframes fadeInUp {
      from { opacity: 0; transform: translateY(20px); }
      to { opacity: 1; transform: translateY(0); }
    }
@media (max-width: 1200px) {
  .car-brands-section {
    margin: 0 20px;
  }

  .car-brands-content h2 {
    font-size: 2.2rem;
  }

  .car-brands-grid {
    padding: 35px 30px;
    gap: 18px;
  }
}

@media (max-width: 992px) {
  .car-brands-grid {
    grid-template-columns: repeat(2, 1fr);
    border-top-left-radius: 40px;
    border-bottom-left-radius: 40px;
    padding: 30px 25px;
  }

  .car-brand-card img {
    max-height: 65px; /* reduced from 70px */
  }

  .car-brands-content {
    padding: 40px 35px;
  }

  .car-brands-content h2 {
    font-size: 2rem;
  }

  .car-brands-content p {
    font-size: 1.05rem;
  }
}

@media (max-width: 768px) {
  .car-brands-section {
    flex-direction: column;
    margin: 0 15px;
    border-radius: 12px;
  }

  .car-brands-grid {
    grid-template-columns: repeat(2, 1fr);
    border-radius: 0;
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
    padding: 25px 20px;
    gap: 18px;
  }

  .car-brand-card {
    min-height: 110px;
    padding: 18px;
  }

  .car-brand-card img {
    max-height: 70px; /* reduced from 75px */
  }

  .car-brands-content {
    padding: 35px 25px;
    text-align: center;
  }

  .car-brands-content h2 {
    font-size: 1.8rem;
  }

  .car-brands-btn {
    margin: 0 auto;
  }
}

@media (max-width: 576px) {
  .car-brands-section {
    margin: 0 12px;
  }

  .car-brands-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 15px;
    padding: 20px 15px;
  }

  .car-brand-card {
    min-height: 100px;
    padding: 15px;
  }

  .car-brand-card img {
    max-height: 65px; /* reduced from 80px */
  }

  .car-brands-content {
    padding: 30px 20px;
  }

  .car-brands-content h2 {
    font-size: 1.6rem;
  }

  .car-brands-content p {
    font-size: 0.95rem;
  }

  .car-brands-btn {
    padding: 10px 25px;
    font-size: 0.9rem;
  }
}

@media (max-width: 400px) {
  .car-brands-section {
    margin: 0 10px;
  }

  .car-brands-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
    padding: 20px 10px;
  }

  .car-brand-card {
    min-height: 90px;
    padding: 12px;
  }

  .car-brand-card img {
    max-height: 60px; /* reduced from 85px */
  }

  .car-brands-content {
    padding: 25px 15px;
  }

  .car-brands-content h2 {
    font-size: 1.5rem;
  }

  .car-brands-content p {
    font-size: 0.9rem;
  }
}



  /* Counter Section Styles */

.counter-item {
    padding: 30px 20px;
    border-radius: 15px;
    background: white;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    margin-bottom: 30px;
}

.counter-item:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15);
}

.counter-value {
    font-size: 3rem;
    font-weight: 800;
    color: #2c3e50;
    margin-bottom: 10px;
    transition: color 0.3s ease;
}

.counter-item:hover .counter-value {
    color: var(--snh-red);
}

.counter-label {
    font-size: 1.2rem;
    color: #7f8c8d;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* Animation for counters */
@keyframes countUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.counter-item.animated {
    animation: countUp 1s ease-out forwards;
}

/* Responsive design for counters */
@media (max-width: 1199px) {
    .counter-value {
        font-size: 2.8rem;
    }
    .counter-label {
        font-size: 1.1rem;
    }
}

@media (max-width: 992px) {
    .counter-value {
        font-size: 2.5rem;
    }
    .counter-label {
        font-size: 1rem;
    }
    .counter-item {
        padding: 25px 15px;
    }
}

@media (max-width: 768px) {
    .counter-item {
        margin-bottom: 20px;
        padding: 20px 15px;
    }

    .counter-value {
        font-size: 2.2rem;
    }

    .counter-label {
        font-size: 0.95rem;
        letter-spacing: 0.5px;
    }

    .counter-icon {
        margin-bottom: 15px !important;
    }

    .counter-icon i {
        font-size: 2rem !important;
    }
}

@media (max-width: 576px) {
    .counter-item {
        padding: 18px 12px;
    }

    .counter-value {
        font-size: 2rem;
    }

    .counter-label {
        font-size: 0.9rem;
    }

    .counter-icon i {
        font-size: 1.8rem !important;
    }
}

@media (max-width: 400px) {
    .counter-item {
        padding: 15px 10px;
    }

    .counter-value {
        font-size: 1.8rem;
    }

    .counter-label {
        font-size: 0.85rem;
    }

    .counter-icon i {
        font-size: 1.6rem !important;
    }
}

.testimonials-section {
  padding: 4rem 2rem;
  background: #f8fafc;
}

.section-title {
  text-align: center;
  margin-bottom: 3rem;
}

.section-title .title {
  font-size: 2rem;
  font-weight: 700;
  color: #1e293b;
}

.testimonials-container {
  max-width: 1400px;
  margin: 0 auto;
}

/* Swiper slides (cards) */
.testimonial-card {
  position: relative;
  background: white;
  border-radius: 16px;
  padding: 2.5rem;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  border: 1px solid #e2e8f0;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  height: auto;
}

.testimonial-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 20px 25px rgba(0, 0, 0, 0.1);
}

.stars {
  position: absolute;
  top: 1rem;
  right: 1.5rem;
  display: flex;
  gap: 0.25rem;
}

.star {
  color: #f59e0b;
  font-size: 1.25rem;
}

.quote-mark {
  font-size: 3rem;
  color: #f59e0b;
  margin-bottom: 1rem;
  display: flex;
  align-items: left;
}

.testimonial-text {
  font-size: 1.1rem;
  color: #64748b;
  margin-bottom: 2rem;
  line-height: 1.6;
}

.customer-info {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.customer-avatar {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  object-fit: cover;
  border: 3px solid #e2e8f0;
}

.customer-details h3 {
  font-size: 1.2rem;
  font-weight: 600;
  color: #1e293b;
}

.customer-details p {
  color: #64748b;
  font-size: 0.9rem;
}

/* Swiper Pagination Dots */
.swiper-pagination-bullet-active {
  background: #f59e0b !important;
}

/* ✅ Updated Swiper Navigation Buttons */
.swiper-button-next,
.swiper-button-prev {
  color: #000 !important; /* black color */
  width: 28px !important; /* smaller hit area */
  height: 28px !important;
}

/* ✅ Smaller arrow icons */
.swiper-button-next::after,
.swiper-button-prev::after {
  font-size: 5px !important; /* reduces arrow size */
  font-weight: bold;
}

/* ✅ Move arrows closer to carousel */
.swiper-button-next {
  right: 10px !important;
}

.swiper-button-prev {
  left: 10px !important;
}

/* Optional: hide arrows on very small screens for cleaner look */
@media (max-width: 480px) {
  .swiper-button-next,
  .swiper-button-prev {
    display: none !important;
  }
}


/* Brand Logos Section */ .brands-section { background: #fff; padding: 2rem 0; overflow: hidden; } /* Brand Section */ .brands-section { background: #000; /* black background */ padding: 2rem 0; overflow: hidden; border-top: 2px solid #111; /* subtle separation */ } .brands-slider { width: 100%; overflow: hidden; } .brands-track {
  display: flex;
  gap: 4rem;
  animation: slide-left 30s linear infinite; /* fixed: use correct keyframes */
}

@keyframes slide-left {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%); /* move left */
  }
}
 .brand-logo { height: 60px; width: auto; flex-shrink: 0; opacity: 0.8; transition: all 0.3s ease; } .brand-logo:hover { filter: grayscale(0%) brightness(1); opacity: 1; }

/* Remove or modify this - it's causing layout issues */
.search-page {
  display: flex;
  justify-content: center;
  padding: 30px 20px;
  width: 100%;
  height: fit-content;
  /* transform: scale(0.9);  REMOVE THIS - it breaks zoom */
  /* transform-origin: top center; REMOVE THIS */
}

/* If you need it smaller, use max-width instead */
.search-container {
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);
  width: 100%;
  max-width: 1100px; /* Slightly smaller if needed */
  margin: 0 auto;
  overflow: hidden;
}


/* Search Section */
  .search-page {
    display: flex;
    justify-content: center;
    padding: 30px 20px; /* less vertical padding */
    width: 100%;
    height: fit-content;

}
.search-page {
  transform: scale(0.9);   /* shrink the whole section */
  transform-origin: top center; /* keeps it centered while scaling */
}


.search-container {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);
    width: 100%;          /* full width of page */
    max-width: 1200px;    /* optional, keeps it from getting too wide on large screens */
    margin: 0 auto;       /* center horizontally */
    overflow: hidden;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;

}



/* Responsive Design */
@media (max-width: 768px) {
  .hero-title {
    font-size: 2.5rem;
  }

  .hero-subtitle {
    font-size: 1rem;
  }

  .contact-section {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .form-row {
    grid-template-columns: 1fr;
  }

  .main-container {
    padding: 2rem 15px;
  }

  .contact-cards {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
}
/* Common scroll animation */
.scroll-animate {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.8s ease, transform 0.8s ease;
}

.scroll-animate.show {
  opacity: 1;
  transform: translateY(0);
}


/* Hero Section */
.hero {
    height: 70vh;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Part exchange page banner only (not all .hero sections) */
.hero.hero--part-exchange {
    background: url('../images/background/part-ex-banner.webp') center/cover no-repeat;
}

.hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.55); /* darker overlay for contrast */
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 20px;
}

.hero-content {
    text-align: center;
    color: #fff; /* force white */
    max-width: 800px;
    z-index: 2; /* keeps text above overlay */
    padding: 2rem;
}

.hero-title {
    font-size: 3rem;
    font-weight: 800;
    margin-bottom: 1rem;
    line-height: 1.2;
    color: #fff; /* force white */
}

.hero-subtitle {
    font-size: 1.4rem;
    font-weight: 400;
    opacity: 0.95;
    color: #f5f5f5; /* slightly lighter than white */
}

/* Inner pages — same banner treatment as part exchange */
.page-hero.hero {
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

.page-hero.hero .hero-title,
.hero.hero--part-exchange .hero-title {
    font-size: 4rem;
    margin-bottom: 0.75rem;
}

.page-hero.hero .hero-subtitle,
.hero.hero--part-exchange .hero-subtitle {
    font-size: 1.5rem;
    font-weight: 400;
    line-height: 1.5;
    max-width: 640px;
    margin: 0 auto;
}

/* Section Headers */
.section-header {
    text-align: center;
    margin-bottom: 4rem;
}

.section-header h2 {
    font-size: 3rem;
    font-weight: 700;
    color: #333;
    margin-bottom: 1rem;
}

.section-header p {
    font-size: 1.25rem;
    color: #666;
}

/* How It Works Section */
.how-it-works {
    padding: 5rem 0;
    background: #f8f9fa;
}

.steps-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 2rem;
}

.step-card {
    background: white;
    padding: 2.5rem 2rem;
    border-radius: 12px;
    text-align: center;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
    position: relative;
}

.step-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 25px rgba(0, 0, 0, 0.15);
}

.step-icon {
    width: 4rem;
    height: 4rem;
    background: var(--snh-red);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1.5rem;
    transition: all 0.3s ease;
}

.step-card:hover .step-icon {
    box-shadow: 0 0 20px rgba(var(--snh-red-rgb), 0.4);
}

.step-icon i {
    font-size: 1.5rem;
    color: white;
}

.step-number {
    width: 2rem;
    height: 2rem;
    background: var(--snh-red);
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1rem;
    font-weight: 600;
    font-size: 0.875rem;
}

.step-card h3 {
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 1rem;
    color: #333;
}

.step-card p {
    color: #666;
    line-height: 1.6;
}

/* Form Section */

    .form-wrapper {
      position: relative;
      max-width: 1000px;
      margin: auto;
      background: #fff;
      padding: 30px;
      border-radius: 15px;
      box-shadow: 0 8px 25px rgba(0,0,0,0.15);
      overflow: hidden;
    }

    .header {
      text-align: center;
      margin-bottom: 20px;
    }

    .header h1 {
      color: var(--snh-red);
      font-size: 28px;
      margin-bottom: 10px;
    }

    .header p {
      color: #555;
      font-size: 15px;
    }

    .form-container {
      display: flex;
      gap: 20px;
      flex-wrap: wrap;
    }

    .form-box {
      flex: 1;
      min-width: 45%;
      background: #fff;
      padding: 20px;
      border-radius: 12px;
      box-shadow: 0 5px 15px rgba(0,0,0,0.1);
      transition: transform 0.3s ease;
    }

    .form-box:hover {
      transform: translateY(-5px);
    }

    .form-box h2 {
      color: var(--snh-red);
      font-size: 20px;
      margin-bottom: 15px;
      display: flex;
      align-items: center;
      gap: 8px;
    }

    .form-group {
      margin-bottom: 15px;
    }

    .form-row {
      display: flex;
      gap: 15px;
    }

    .form-row .form-group {
      flex: 1;
    }

    label {
      font-size: 14px;
      font-weight: 500;
      color: #333;
      display: block;
      margin-bottom: 5px;
    }

    input, select, textarea {
      width: 100%;
      padding: 10px 12px;
      border-radius: 8px;
      border: 1px solid #ccc;
      outline: none;
      font-size: 14px;
      transition: border 0.3s, box-shadow 0.3s;
    }

    input:focus, select:focus, textarea:focus {
      border-color: var(--snh-red);
      box-shadow: 0 0 5px rgba(179, 0, 0, 0.5);
    }

    textarea {
      resize: none;
      height: 90px;
    }

    .submit-container {
      text-align: center;
      margin-top: 25px;
    }

    .submit-btn {
      background: var(--snh-red);
      color: white;
      border: none;
      padding: 14px 35px;
      border-radius: 50px;
      font-size: 16px;
      font-weight: 600;
      cursor: pointer;
      position: relative;
      overflow: hidden;
      box-shadow: 0 6px 20px rgba(179, 0, 0, 0.4);
      transition: transform 0.2s ease;
    }

    .submit-btn:hover {
      transform: scale(1.05);
    }

    /* Ripple effect */
    .ripple {
      position: absolute;
      border-radius: 50%;
      background: rgba(255, 255, 255, 0.6);
      transform: scale(0);
      animation: rippleAnim 0.6s linear;
      pointer-events: none;
    }

    @keyframes rippleAnim {
      to {
        transform: scale(4);
        opacity: 0;
      }
    }

    /* Notification */
    .notification {
      position: fixed;
      top: 20px;
      right: 20px;
      background: var(--snh-red);
      color: white;
      padding: 15px 25px;
      border-radius: 8px;
      box-shadow: 0 5px 15px rgba(0,0,0,0.2);
      transform: translateX(150%);
      transition: transform 0.4s ease;
      z-index: 1000;
    }

    .notification.show {
      transform: translateX(0);
    }
/* Notification default hidden (off screen) */
.notification {
  position: fixed;
  top: 20px;
  right: 20px;
  background: var(--snh-red);
  color: white;
  padding: 15px 25px;
  border-radius: 8px;
  box-shadow: 0 5px 15px rgba(0,0,0,0.2);
  transform: translateX(150%); /* hidden to the right */
  transition: transform 0.4s ease, opacity 0.4s ease;
  opacity: 0;
  z-index: 1000;
}

/* When .show is added */
.notification.show {
  transform: translateX(0);
  opacity: 1;
}

/* Responsive layout: stack forms + button */
@media (max-width: 768px) {
  .form-container {
    flex-direction: column; /* stack vertically */
  }

  .form-box {
    min-width: 100%; /* take full width */
  }

  .submit-container {
    margin-top: 20px;
  }
}

/* Why Choose Us Section */
.why-choose-us {
    padding: 5rem 0;
    background: #f8f9fa;
}

.features-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 2rem;
}

.feature-card {
    text-align: center;
    padding: 2rem 1rem;
}

.feature-icon {
    width: 5rem;
    height: 5rem;
    background: var(--snh-red);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1.5rem;
    transition: all 0.3s ease;
}

.feature-card:hover .feature-icon {
    box-shadow: 0 0 20px rgba(var(--snh-red-rgb), 0.4);
}

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

.feature-card h3 {
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 1rem;
    color: #333;
}

.feature-card p {
    color: #666;
    line-height: 1.6;
}

/* Testimonials Section */
.testimonials {
    padding: 5rem 0;
    background: white;
}

.testimonial-slider {
    max-width: 700px;
    margin: 0 auto;
}

.testimonial-card {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    padding: 3rem 2.5rem;
    text-align: center;
}

.stars {
    margin-bottom: 1.5rem;
}

.stars i {
    color: #ffc107;
    font-size: 1.25rem;
    margin: 0 0.25rem;
}

.testimonial-card blockquote {
    font-size: 1.125rem;
    color: #333;
    line-height: 1.6;
    margin-bottom: 2rem;
    font-style: italic;
}

.testimonial-author strong {
    color: var(--snh-red);
    font-size: 1.125rem;
    display: block;
    margin-bottom: 0.5rem;
}

.testimonial-author div {
    color: #666;
}

.testimonial-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 2rem;
    gap: 1rem;
}

.nav-btn {
    width: 3rem;
    height: 3rem;
    border: 1px solid #ddd;
    border-radius: 50%;
    background: white;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

.nav-btn:hover {
    border-color: var(--snh-red);
    color: var(--snh-red);
}

.testimonial-dots {
    display: flex;
    gap: 0.5rem;
}

.dot {
    width: 0.75rem;
    height: 0.75rem;
    border-radius: 50%;
    background: #ddd;
    cursor: pointer;
    transition: all 0.3s ease;
}

.dot.active {
    background: var(--snh-red);
}

/* Final CTA Section */
.final-cta {
    padding: 5rem 0;
    background: var(--snh-red);
    color: white;
    text-align: center;
}

.cta-content h2 {
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 1rem;
    color: #fff; /* force white */
}

.cta-content p {
    font-size: 1.25rem;
    margin-bottom: 2.5rem;
    opacity: 0.95;
    color: #f5f5f5;
}

.cta-button-white {
    background: white;
    color: var(--snh-red);
    padding: 1rem 2.5rem;
    font-size: 1.1rem;
    font-weight: 600;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    text-decoration: none;
    display: inline-block;
}

.cta-button-white:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
}

/* Animations */
@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.fade-up {
    animation: fadeUp 0.6s ease-out forwards;
}

/* Responsive Design */
@media (max-width: 768px) {
    .page-hero.hero .hero-title,
    .hero.hero--part-exchange .hero-title {
        font-size: 2.75rem;
    }

    .page-hero.hero .hero-subtitle,
    .hero.hero--part-exchange .hero-subtitle {
        font-size: 1.15rem;
    }

    .hero-title {
        font-size: 2.5rem;
    }

    .hero-subtitle {
        font-size: 1.1rem;
    }

    .section-header h2 {
        font-size: 2.25rem;
    }

    .section-header p {
        font-size: 1.1rem;
    }

    .form-row {
        grid-template-columns: 1fr;
    }

    .form-card {
        padding: 2rem;
    }

    .steps-grid,
    .features-grid {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    .cta-content h2 {
        font-size: 2rem;

    }

    .container {
        padding: 0 15px;
    }
}

@media (max-width: 480px) {
    .hero-title {
        font-size: 2rem;
    }

    .section-header h2 {
        font-size: 1.875rem;
    }

    .form-card {
        padding: 1.5rem;
    }

    .step-card,
    .testimonial-card {
        padding: 2rem 1.5rem;
    }
}

.pagination-container {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 30px;
  padding: 20px;
  background: var(--white);
  border-radius: 10px;
  box-shadow: var(--shadow);

}

.pagination {
  display: flex;
  list-style: none;
  padding: 0;
  margin: 0;
  align-items: center;
}

.pagination-item {
  margin: 0 5px;
}

.pagination-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 45px;
  height: 45px;
  border-radius: 50%;
  background: var(--white);
  color: var(--text-dark);
  text-decoration: none;
  font-weight: 600;
  transition: var(--transition);
  border: 2px solid transparent;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.08);
}

.pagination-link:hover {
  transform: translateY(-3px);
  box-shadow: 0 5px 15px rgba(var(--snh-red-rgb), 0.2);
  border-color: var(--primary-red);
  color: var(--primary-red);
}

.pagination-link.active {
  background: var(--primary-red);
  color: var(--white);
  border-color: var(--primary-red);
  transform: scale(1.1);
  box-shadow: 0 5px 15px rgba(var(--snh-red-rgb), 0.3);
}

.pagination-link.disabled {
  opacity: 0.5;
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}

.pagination-link.disabled:hover {
  border-color: transparent;
  color: var(--text-dark);
  transform: none;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.08);
}

.pagination-ellipsis {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 45px;
  height: 45px;
  color: var(--dark-gray);
  font-weight: 600;
}

.pagination-info {
  margin-left: 20px;
  color: var(--dark-gray);
  font-size: 0.9rem;
}

.results-per-page {
  display: flex;
  align-items: center;
  margin-right: 20px;
}

.results-per-page label {
  margin-right: 10px;
  color: var(--dark-gray);
  font-size: 0.9rem;
}

.results-per-page select {
  padding: 8px 12px;
  border-radius: 6px;
  border: 1px solid var(--medium-gray);
  background: var(--white);
  color: var(--text-dark);
  outline: none;
  transition: var(--transition);
}

.results-per-page select:focus {
  border-color: var(--primary-red);
  box-shadow: 0 0 0 3px rgba(var(--snh-red-rgb), 0.1);
}

@keyframes pageChange {
  0% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.5; transform: scale(0.95); }
  100% { opacity: 1; transform: scale(1); }
}

.page-change-animation {
  animation: pageChange 0.4s ease;
}

/* Responsive */
@media (max-width: 768px) {
  .pagination-container { flex-direction: column; gap: 20px; }
  .results-per-page { margin-right: 0; margin-bottom: 10px; }
  .pagination-info { margin-left: 0; margin-top: 10px; }
  .pagination-link { width: 40px; height: 40px; }
  .pagination-ellipsis { width: 40px; height: 40px; }
}

@media (max-width: 480px) {
  .pagination { flex-wrap: wrap; justify-content: center; }
  .pagination-item { margin: 3px; }
}



        /* Car Types Carousel Styles */
        .ct-carousel-section {
            padding: 36px 0 24px;
            position: relative;
        }

        .ct-carousel-section .section-title.mb_30 {
            margin-bottom: 24px;
        }

        .ct-carousel-container {
            max-width: 1200px;
            margin: 0 auto;
            padding: 0 20px;
            position: relative;
        }

        .ct-carousel-row {
            display: flex;
            align-items: center;
            gap: 14px;
        }

        .ct-carousel-wrapper {
            position: relative;
            flex: 1;
            min-width: 0;
        }

        .ct-carousel-viewport {
            overflow: hidden;
            width: 100%;
            padding: 14px 0;
            margin: -14px 0;
        }

        .ct-carousel-track {
            display: flex;
            transition: transform 0.5s ease;
            gap: 30px;
            align-items: stretch;
        }

        .ct-carousel-item {
            flex: 0 0 calc(20% - 24px); /* 5 items with gap adjustment */
            text-align: center;
            padding: 22px 16px;
            border-radius: 12px;
            background: #f8f9fa;
            transition: background 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease, transform 0.3s ease;
            border: 2px solid transparent;
            min-width: 0;
            box-sizing: border-box;
        }

        .ct-carousel-item--clone {
            pointer-events: none;
        }

        .ct-carousel-item:hover {
            background: white;
            border-color: #2c3e50;
            transform: translateY(-6px);
            box-shadow: 0 10px 30px rgba(0,0,0,0.1);
        }

        .ct-car-image {
            margin-bottom: 20px;
            height: 80px;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .ct-car-image img {
            max-height: 100%;
            max-width: 100%;
            transition: transform 0.3s ease;
        }

        .ct-carousel-item:hover .ct-car-image img {
            transform: scale(1.1);
        }

        .ct-car-info h4 {
            margin: 0 0 8px 0;
            font-size: 18px;
            font-weight: 600;
            color: #2c3e50;
        }

        .ct-car-stock {
            font-size: 14px;
            color: #7f8c8d;
            font-weight: 500;
        }

        /* Navigation Buttons — left / right on carousel */
        .ct-carousel-nav {
            display: none;
        }

        .ct-carousel-prev,
        .ct-carousel-next {
            position: relative;
            top: auto;
            left: auto;
            right: auto;
            transform: none;
            flex-shrink: 0;
            z-index: 4;
            background: var(--snh-red);
            border: none;
            width: 44px;
            height: 44px;
            border-radius: 50%;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            transition: background 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
            color: white;
            font-size: 18px;
            font-weight: bold;
            box-shadow: 0 4px 14px rgba(var(--snh-red-rgb), 0.35);
        }

        .ct-carousel-prev:hover,
        .ct-carousel-next:hover {
            background: var(--snh-red-dark);
            transform: scale(1.08);
            box-shadow: 0 6px 18px rgba(var(--snh-red-rgb), 0.45);
        }

        .ct-carousel-prev.disabled,
        .ct-carousel-next.disabled {
            opacity: 0.35;
            cursor: not-allowed;
            transform: none !important;
            box-shadow: none;
        }

        .ct-carousel-dots {
            display: none !important;
        }

        /* Responsive Design */
        @media (max-width: 1200px) {
            .ct-carousel-item {
                flex: 0 0 calc(25% - 22.5px); /* 4 items */
            }
        }

        @media (max-width: 992px) {
            .ct-carousel-item {
                flex: 0 0 calc(33.333% - 20px); /* 3 items */
            }
        }

        @media (max-width: 768px) {
            .ct-carousel-row {
                gap: 8px;
            }

            .ct-carousel-item {
                flex: 0 0 calc(50% - 15px); /* 2 items */
            }

            .ct-carousel-prev,
            .ct-carousel-next {
                width: 38px;
                height: 38px;
                font-size: 16px;
            }
        }

        @media (max-width: 576px) {
            .ct-carousel-item {
                flex: 0 0 100%; /* 1 item */
            }

            .ct-carousel-section {
                padding: 28px 0 20px;
            }

            .ct-carousel-container {
                padding: 0 12px;
            }
        }