/*--------------------- Copyright (c) 2020 ----------------------- 
[Master Stylesheet] 
 ------------------------------------------------------------------- 
[Table of contents] 
1. top-header
2. Common CSS
3. Preloader CSS
4. Top header CSS
5. Main Header CSS
6. banner
7. services
8. about us 
9. counter
10. why people choose 
11. our services
12. testimonial
13.pricing
14.blog
15.contact
16.footer
17.About Page
18.Service Page
19.Blog Page
20.Contact Page 
21. Responsive Style
-------------------------------------------------------------------*/

/********************************************************
1. body start
 *******************************************************/
body {
    font-family: 'Poppins', sans-serif;
    font-weight:400;
    font-size: 16px;
    line-height:1.78;
    color: #707070;
    -webkit-font-smoothing: antialiased;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
span.fa.fa-angle-double-up {
    background: linear-gradient(135deg, #cc2223, #164384);
    padding: 6px;
    border-radius: 50px;
    font-size: 18px;
    color: #fff;
    transition: all 0.3s;
    width: 30px !important;
    height: 30px !important;
}
span.fa.fa-angle-double-up:hover {
    color: #fff;
}
/********************************************************
    2. Common CSS
*******************************************************/
*,*:before,*:after{
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
}
a, a:hover, a:focus{
    color: #cf2224;
    font-size: 16px;
    font-weight: 400;
    text-transform: capitalize;
    text-decoration: none;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
h1, h2, h3, h4, h5, h6{
    font-family: 'Poppins', sans-serif;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
    margin:0;
    padding:0;
    text-transform:capitalize;
}
img {
    max-width: 100%;
}
input, textarea, select, button, label, svg, svg path, svg rect, svg polygon, img, a, :after, :before, :hover, :focus, .form-control:focus{
    outline: none !important;
    box-shadow:none;
}
ul{
    padding:0;
    margin:0;
    list-style-type: none;
}
p {
  margin: 0px;
  font-weight:400;
 font-size: 16px;
}
.container {
    max-width: 1200px;
}
/* button css */
.cs_btn, .cs_btn:focus {
    width: 165px;
    height: 50px;
    line-height: 50px;
    padding: 0 25px;
    border-radius: 50px;
    color: #ffffff;
    background-color: #0acffe;
    text-align: center;
    cursor: pointer;
    display: inline-block;
    border: solid 1px #0acffe;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
.cs_btn:hover {
    color: #cf2224;
    background-color: #ffffff;
    border: solid 1px #0acffe;
}
/* button css */

.cs_main_btn a {
      background: linear-gradient(135deg, #cc2223, #164384);
    color: #fff;
    padding: 10px 40px;
    height: 50px;
    width: auto;
    text-align: center;
    transition: all 0.5s;
    font-weight: 500;
    display: inline-block;
        text-decoration: none;
}
.cs_main_btn a:hover {
    background-color: #fff;
    color: #fff;
    border: solid 2px #ffffff;
}
::placeholder{
color: #858585;
}
/********************************************************
    3. Preloader CSS
*******************************************************/
.preloader_active .preloader_holder {
    background-color: var(--main-bg-color);
}
.preloader_active .preloader_holder .preloader span {
    box-shadow: 0px 0px 0px 0px #cf2224;
}
@-webkit-keyframes loadingCircles{
    0%{-webkit-transform: scale(0); opacity: 1; box-shadow: 0px 0px 0px 10px #cf2224;}
    100%{-webkit-transform: scale(1); opacity: 0; box-shadow: 0px 0px 0px 2px #cf2224;}
}
@-moz-keyframes loadingCircles{
    0%{-moz-transform: scale(0); opacity: 1; box-shadow: 0px 0px 0px 10px #cf2224;}
    100%{-moz-transform: scale(1); opacity: 0; box-shadow: 0px 0px 0px 2px #cf2224;}
}
@keyframes loadingCircles{
    0%{transform: scale(0); opacity: 1; box-shadow: 0px 0px 0px 10px #cf2224;}
    100%{transform: scale(1); opacity: 0; box-shadow: 0px 0px 0px 2px #cf2224;}
}
.preloader_open:before, .preloader_open:after {
    background-color: var(--main-bg-color);
}
/*=========================Top Header Style=======================*/
.cs_top_header_wrapper {
    background-color: #282932;
    padding: 11px 0 11px;
}
.cs_top_header_wrapper img {
    padding-right: 5px;
}
.cs_top_header_info p {
    color: #ffffff;
    transition: all 0.3s;
    font-weight: 500;
    margin: 0px !important;
}
.cs_top_header_info_btn a {
    color: #ffffff;
    transition: all 0.3s;
    font-weight: 500;
        text-decoration: none;
}
.cs_top_header_info_btn a:hover {
    color: #cf2224;
}
.cs_top_header_info_call p:hover span {
    color: #cf2224;
}
.cs_top_header_info_mail p:hover span{
    color: #cf2224;
}
.cs_top_header_info {
    display: flex;
    justify-content: left;
}
.cs_top_header_info_btn {
    text-align: right;
}
.cs_top_header_info_mail {
    padding-left: 50px;
}
.ed_pagetitle .container {
    position: relative;
}
/*=========================Main Header Style=======================*/
header {
    position: unset;
    display: inline-block;
    width: 100%;
    z-index: 9;
    background: var(--main-bg-color);
}
.cs_header_top {
    background: var(--main-bg-color);
    border-bottom: 1px solid var(--main-gray-version4);
    color: var(--main-gray-version5);
}
.cs_header_info {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
}
.cs_header_info ul {
    display: flex;
    flex-wrap: wrap;
}
.cs_header_info ul li {
    margin-left: 20px;
    padding: 6px 0;
}
.cs_header_top .cs_btn {
    min-width: 190px;
    border-radius: 0;
}
.cs_header_icon svg {
    height: 18px;
    fill: var(--main-royal-red);
}
.cs_header_info ul li:first-child {
    margin-left: 0;
}
.cs_header_info ul li a {
    color: var(--main-gray-version5);
    display: inline-block;
}
.cs_header_icon {
    margin-right: 3px;
}
.cs_header_wrapper {
    padding: 12px 0 12px 0px;
}
.cs_header_info ul li a > span {
    margin-right: 4px;
    font-weight: 700;
}
.searchBtn, .searchBtn:focus, .searchBtn:hover {
    color: var(--main-royal-blue);
    padding-left: 10px;
}
.cs_header_wrapper .cs_btn {
    min-width: 200px;
    margin: 0 0 0 30px;
    padding: 0 15px 0;
    letter-spacing: 0;
}
.cs_search_wrap .display_flex {
    align-items: center;
}
.cs_search_wrap .display_flex li {
    display: flex;
}


.plx-call strong a {
    color: #000000;
}


.main_menu_wrapper ul > li > a {
    padding: 4px 9px;
    display: inline-block;
    font-weight: 700;
    color: #534462;
    transition: all 0.3s;
        text-decoration: none;
}
.main_menu_wrapper ul > li > a:hover {
    color: #cf2224;
}
.cs_search_wrap {
    margin-left: 25px;
}
/*=================Banner Style==================*/
.cs_header_banner {
    position: relative;
    width: 100%;
    overflow: hidden;
    display: flex;
    align-items: center;
    z-index: 1;
}

/* Background Image via IMG */
.hero-bg {
    position: absolute;
    inset: 0;
    z-index: -2;
    overflow: hidden;
}

.hero-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;

    /* 🔥 Smooth reload animation */
    animation: zoomFade 2s ease forwards;
}

/* Overlay Gradient */
.cs_header_banner::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(to right, #174584 0%, rgba(255,255,255,0.2) 70%, #ffffff 120%);
}

/* Content Color */
.cs_header_banner h1,
.cs_header_banner p,
.cs_header_banner a,
.cs_header_banner .badge {
    color: #fff;
}

.cs_header_banner span {
    color: #cf2224;
}

/* 🔥 Animation */
@keyframes zoomFade {
    0% {
        transform: scale(1.2);
        opacity: 0;
    }
    100% {
        transform: scale(1);
        opacity: 1;
    }
}

/*=================Banner Tab Style==================*/
.cs_header_form a.active.show {
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    text-transform: capitalize;
    background: #cf2224;
    padding: 18px 30px;
    margin: 0;
}
.cs_header_form a.cs_banner_tab {
    background: #35363a;
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    text-transform: capitalize;
    padding: 18px 30px;
    margin: 0;
}
.cs_header_form .who_we_tab li a.active:before {
   display: none;
}
.cs_header_form .who_we_tab .nav:after {
   display: none;
}
 .who_we_tab li a:after {
  display: none;
}
div#header_tab h3 {
    color: #272727;
    font-size: 20px;
    font-weight: bold;
    line-height: 30px;
}
div#header_tab p {
    color: #858585;
    font-size: 16px;
}
div#header_tab input[type="text"] {
    padding: 10px 25px;
    width: 80%;
    background: #e2eff5;
    border: none;
    margin-top: 20px;
}
div#header_tab1 h3 {
    color: #272727;
    font-size: 20px;
    font-weight: bold;
    line-height: 30px;
}
div#header_tab1 p {
    color: #858585;
    font-size: 16px;
}
div#header_tab1 input[type="text"] {
    padding: 10px 25px;
    width: 80%;
    background: #f3f5f6;
    border: none;
    margin-top: 20px;
}
.cs_header_form a.cs_banner_tab.active {
    background: linear-gradient(135deg, #cc2223, #164384);
}
div#header_tab textarea {
    padding: 10px 25px;
    width: 80%;
    background: #e2eff5;
    border: none;
    margin-top: 20px;
    height: 100px;
}
div#header_tab a {
    padding: 10px 132px;
}
div#header_tab1 textarea {
    padding: 10px 25px;
    width: 80%;
    background: #f3f5f6;
    border: none;
    margin-top: 20px;
    height: 100px;
}
div#header_tab1 a {
    padding: 10px 132px;
}
div#pills-tabContent {
    padding: 17px 0px;
    border-top: none;
    background: #fff;
    text-align: center;
}
div#pills-tabContent1 {
    padding: 30px 0px;
    border-top: none;
    background: #fff;
    text-align: center;
}
.cs_tab_form_btn {
    margin-top: 20px;
}
.cs_header_form .who_we_tab .nav {
    position: relative;
    margin: 16px 0 15px;
}
/*=================Banner Tab Style==================*/
.cs_banner_slider_wrapper .swiper-button-prev {
    left: -60px !important;
    opacity: 1;
    background: #3a3b46;
    transition: all 0.3s;
}
.cs_banner_slider_wrapper .swiper-button-prev:hover{
    background: linear-gradient(135deg, #cc2223, #164384);
}
.cs_banner_slider_wrapper .swiper-button-next {
    right: -60px !important;
    left: auto;
    background:#3a3b46;
    transition: all 0.3s;
}
.cs_banner_slider_wrapper .swiper-button-next:hover {
    background:linear-gradient(135deg, #cc2223, #164384);
}
.cs_banner_slider_wrapper .swiper-button-next img{
    padding-right: 8px;
}
.cs_banner_slider_wrapper .swiper-button-prev img{
    padding-right: 8px;
}
.cs_banner_slider_wrapper .swiper-button-next, .cs_banner_slider_wrapper .swiper-button-prev {
    position: absolute;
    bottom: 20px !important;
    width: calc(var(--swiper-navigation-size)/ 44 * 27);
    height: var(--swiper-navigation-size);
    margin-top: calc(-1 * var(--swiper-navigation-size)/ 2);
    z-index: 10;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content:  center;
    color: #fff;
    width: 45px;
    height: 45px;
}

.cs_banner_slider_wrapper .swiper-button-next, .cs_banner_slider_wrapper .swiper-button-prev svg.swiper-navigation-icon path {
    width: 40px !important;
    height: 40px !important;
    padding: 10px;
    border-radius: 50px;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.15);
    background: #fff;
    color: #041a32;
}

.cs_banner_slider_wrapper .swiper-button-prev, .cs_banner_slider_wrapper .swiper-button-next svg.swiper-navigation-icon path {
    width: 40px !important;
    height: 40px !important;
    padding: 10px;
    border-radius: 50px;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.15);
    background: #fff;
    color: #041a32;
}

.cs_banner_slider_wrapper{
    position: relative;
    overflow: hidden;
}
.cs_banner_text {
    width: 600px;
}
.cs_header_form {
    position: absolute;
    top: 85px;
    right: 18%;
    width: 450px;
    height: 100%;
    z-index: 1;
}
img.next-prev {
    padding-left: 10px;
}
/*=================Services Style==================*/
.cs_top_services_wrapper {
    background: #f8f8f8;
    padding: 50px 0px;
}
.cs_top_services_icon p {
    color: #66728d;
    transition: all 0.5s;
    font-weight: 500;
}
.cs_top_services_box {
    text-align: center;
    background: #fff;
    padding: 25px 10px;
    border-radius: 20px;
box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
    transition: all 0.5s;
}
.cs_top_services_box:hover {
    text-align: center;
    background: linear-gradient(135deg, #cc2223, #164384);
    padding: 25px 10px;
    border-radius: 20px;
    box-shadow:0px 25px 50px 0px rgb(255 88 89 / 20%);
}
.cs_top_services_icon svg {
    fill: #66728d;
    margin-bottom: 10px;
    transition: all 0.5s;
}
.cs_top_services_box:hover .cs_top_services_icon svg {
    fill: #fff;
}
.cs_top_services_box:hover .cs_top_services_icon p {
    color: #fff;
}

/* Section Background */
.cs_people_choose_wrapper {
    padding: 100px 0;
    color: #fff;
}

/* LEFT SIDE (Dark Content) */
.cs_people_choose_content h5 {
    color: #38bdf8;
    letter-spacing: 2px;
    font-size: 15px;
    text-transform: uppercase;
}

.cs_people_choose_content h1 {
    font-size: 44px;
    font-weight: 700;
    margin: 15px 0;
    color: #fff;
}

.cs_people_choose_content p {
    color: #cbd5e1;
    font-size: 15px;
}

/* FEATURE BOX (Glass Effect) */
.feature-box {
    background: rgba(255,255,255,0.05);
    backdrop-filter: blur(10px);
    padding: 18px;
    border-radius: 12px;
    transition: 0.3s;
    border: 1px solid rgba(255,255,255,0.1);
}

.feature-box:hover {
    transform: translateX(8px);
    background: rgba(255,255,255,0.08);
}

/* ICON */
.icon-box {
    width: 50px;
    height: 50px;
    background: linear-gradient(135deg, #38bdf8, #6366f1);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
}

/* TEXT */
.feature-title {
    color: #fff;
    font-size: 17px;
    font-weight: 600;
}

.feature-text {
    color: #cbd5e1;
    font-size: 14px;
}

/* RIGHT SIDE - STACKED IMAGE STYLE */
.cs_people_choose_slider {
    position: relative;
    height: 420px;
}

.plx-body p {
    color: #413c3c;
}


/* Base image */
.cs_people_choose_slider_img img {
    width: 100%;
    border-radius: 20px;
    object-fit: cover;
}

/* Stack Effect */
.swiper-slide {
    transform: scale(0.85);
    opacity: 1.5;
    transition: 0.5s;
}

.swiper-slide-active {
    transform: scale(1);
    opacity: 1;
}

/* Floating Card Look */
.cs_people_choose_slider_img {
    box-shadow: 0 20px 50px rgba(0,0,0,0.5);
    border-radius: 20px;
    overflow: hidden;
}

/* Hide arrows for clean look */
.cs_people_choose_slider_arrow {
    display: none;
}

/* Responsive */
@media(max-width:768px){
    .cs_people_choose_wrapper {
        padding: 60px 0;
    }
    .cs_people_choose_content h1 {
        font-size: 30px;
    }
}
/*=================Counter Style==================*/
.cs_counter_wrapper{
   background-image: url(../images//count_img1.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    padding: 80px 0 80px;
    position: relative;
    z-index: 1;
}
.cs_counter_wrapper:after {
    content: "";
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0.96;
    background: #2a2a32;
    z-index: -1;
}
.cs_counter_icon svg {
    fill: #fff;
}
.cs_counter_icon_box {
    text-align: center;
}
.cs_counter_icon p {
    fill: #fff;
    background: #43444b;
    width: 100px;
    height: 100px;
    border-radius: 50px;
    padding: 20px;
    margin: 0 auto;
    border: 10px solid #2e2f37;
    position: relative;
}
.cs_counter_text h1 {
    padding: 20px 0px 8px;
    font-size: 36px;
    font-weight: bold;
}
.cs_counter_text p {
    font-size: 18px;
    font-weight: 500;
}
.cs_counter_icon p:after {
    content: "";
    position: absolute;
    width: 100px;
    height: 100px;
    border: 1px dashed #4e4e4e;
    border-radius: 50px;
    top: -10px;
    left: -10px;
    animation-name: spin;
    animation-duration: 0.5s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

@keyframes spin {
    from {
        transform:rotate(0deg);
    }
    to {
        transform:rotate(360deg);
    }
}
/*=================Why People Choose Style==================*/
/* Section */
.pro-choose-section {
    padding: 10px 0 60px;
    background: #fff;
}

/* Heading */
.pro-tag {
    color: #cc2223;
    letter-spacing: 2px;
}

.pro-title {
    color: #164384;
    font-size: 40px;
    margin: 15px 0;
    position: relative;
        font-weight: 700;
}

.pro-title::after {
    content: "";
    width: 80px;
    height: 3px;
    background: linear-gradient(90deg, #cc2223, #164384);
    position: absolute;
    bottom: -10px;
    left: 0;
}

/* Description */
.pro-desc {
    color: #777;
    margin-top: 20px;
}

/* Features */
.pro-feature {
    display: flex;
    margin-top: 20px;
    padding: 15px;
    border-radius: 12px;
    transition: 0.4s;
        background: #f9f9f9;
}

.pro-feature:hover {
    background: #f9f9f9;
    transform: translateX(10px);
}

/* Icon */
.pro-icon {
    width: 50px;
    height: 50px;
    background: linear-gradient(135deg, #cc2223, #164384);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    margin-right: 15px;
    transition: 0.4s;
}

.pro-feature:hover .pro-icon {
    transform: scale(1.1) rotate(8deg);
}

.pro-feature p {
    color: #656565;
}

/* Image Box */
.pro-image-box {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
}

/* Image */
.pro-image-box img {
    width: 100%;
    animation: zoomMove 8s infinite alternate ease-in-out;
}

/* Animation = Carousel Feel */
@keyframes zoomMove {
    0% {
        transform: scale(1) translateX(0);
    }
    100% {
        transform: scale(1.1) translateX(-10px);
    }
}

/* Hover Extra Effect */
.pro-image-box:hover img {
    transform: scale(1.15);
}

/* Responsive */
@media(max-width:768px){
    .pro-title {
        font-size: 23px;
    }
    .pro-image-box img {
        height: 250px;
    }
}
/*=================Our Services Style==================*/
/* Section */
.pro-service-section {
    background: #fff;
        margin-bottom: 30px;
}

/* Header */
.pro-service-header h5 {
    color: #cc2223;
    letter-spacing: 2px;
}

.pro-service-header h1 {
    color: #164384;
    font-size: 38px;
    font-weight: 700;
        padding-bottom: 20px;
}

/* Wrapper for arrows */
.pro-carousel-wrapper {
    position: relative;
    padding: 0 60px; 
}


/* Card */
.pro-service-card {
    position: relative;
    border-radius: 18px;
    overflow: hidden;
    background: #fff;
    z-index: 1;
        margin-bottom: 9px;
    box-shadow: 0 0 12px -8px #6a6a6a !important;
}

/* Animated Border Layer */
.pro-service-card::before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: 20px;
    background: linear-gradient(270deg, #cc2223, #164384, #cc2223);
    background-size: 400% 400%;
    z-index: -1;
    opacity: 0;
    transition: 0.4s;
}

/* Inner white card (so border dikhe properly) */
.pro-service-card::after {
    content: "";
    position: absolute;
    inset: 2px;
    background: #fff;
    border-radius: 16px;
    z-index: -1;
}

/* Hover = Start animation */
.pro-service-card:hover::before {
    opacity: 1;
    animation: borderMove 3s linear infinite;
}

/* Animation (Left→Top→Right→Bottom flow feel) */
@keyframes borderMove {
    0% {
        background-position: 0% 50%;
    }
    25% {
        background-position: 50% 0%;
    }
    50% {
        background-position: 100% 50%;
    }
    75% {
        background-position: 50% 100%;
    }
    100% {
        background-position: 0% 50%;
    }
}
/* Image */
.pro-service-img img {
    width: 100%;
    object-fit: cover;
    transition: 0.5s;
    padding: 20px;
}

.pro-service-card:hover img {
    transform: scale(1.1);
}

/* Content */
.pro-service-content {
    padding: 0px 20px 20px;
}

.pro-service-content h5 {
    color: #164384;
    font-weight: 600;
}

.pro-service-content p {
    color: #777;
    font-size: 14px;
}

.pro-service-content a {
    color: #cc2223;
    font-weight: 600;
    text-decoration: none;
}

/* OUTSIDE ARROWS */
.pro-carousel-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 45px;
    height: 45px;
    border-radius: 50%;
    border: none;
    background: #fff;
    color: #164384;
    font-size: 20px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.15);
    z-index: 10;
    transition: 0.3s;
}

/* Left */
.pro-prev {
    left: 0;
}

/* Right */
.pro-next {
    right: 0;
}

/* Hover arrows */
.pro-carousel-btn:hover {
    background: #cc2223;
    color: #fff;
}

/* Responsive */
@media(max-width:768px){
    .pro-carousel-wrapper {
        padding: 0 30px;
    }
}

.cs_footer_wrapper li a
 {
    color: #fff;
    text-decoration: none;
}


/*=================Service Testimonial Style==================*/


/* WRAPPER FOR OUTSIDE ARROWS */
.plx-slider-wrapper{
  position: relative;
  display: flex;
  align-items: center;
  gap: 20px;
}

/* SLIDER */
.plx-testimonial-slider{
  width: 100%;
}

/* CARD */
.plx-card{
  position: relative;
  background: #fff;
  border-radius: 20px;
  padding: 20px;
  box-shadow: 0 8px 20px rgba(0,0,0,0.12);
  overflow: visible;
  /* height: 250px; */
    margin: 9px;
}

/* ===== BLUE HEADER (LIKE IMAGE) ===== */
.plx-header{
  position: relative;
  background: #2f56a6;
  color: #fff;
  padding: 15px 20px;
  border-radius: 18px 60px 60px 18px;
  width: 75%;
  min-height: 70px;
  display: flex;
  align-items: center;
}

/* LEFT TEXT */
.plx-text h4{
  margin: 0;
  font-size: 16px;
  font-weight: 600;
}

.plx-text span{
  font-size: 12px;
  opacity: 0.9;
}

/* ===== IMAGE OVERLAP (TOP RIGHT CIRCLE) ===== */
.plx-img{
  position: absolute;
  top: 24px;
  right: 15px;
  width: 70px;
  height: 70px;
  z-index: 2;
}

.plx-img img{
  width: 70px;
  height: 70px;
  border-radius: 50%;
  border: 4px solid #fff;
  object-fit: cover;
  box-shadow: 0 6px 12px rgba(0,0,0,0.2);
}

/* ===== BODY ===== */
.plx-body{
  margin-top: 25px;
  padding-left: 10px;
}

.plx-stars{
  color: #f7b500;
  font-size: 16px;
  margin-bottom: 8px;
}

.plx-body p{
  font-size: 14px;
  color: #555;
  line-height: 1.6;
}


/* NAV BUTTONS (OUTSIDE STYLE) */
.swiper-slide{
  transition: 0.4s ease;
  transform: scale(0.85);
  opacity: 0.5;
}

/* ACTIVE CENTER SLIDE */
.swiper-slide-active{
  transform: scale(1);
  opacity: 1;
}

.swiper-button-prev:after, .swiper-rtl .swiper-button-next:after {
    content: 'prev';
    font-size: 20px !important;
}

.swiper-button-next:after, .swiper-rtl .swiper-button-prev:after {
    content: 'next';
    font-size: 20px !important;

}

/* side slides thoda blur feel */
.swiper-slide-prev,
.swiper-slide-next{
  transform: scale(0.9);
  opacity: 0.7;
}

/*=================Blog Section Style==================*/
.cs_blog_heading h3 {
    color: #cf2224;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 3px;
    text-transform: uppercase;
}
.cs_blog_heading h1 {
    color: #272727;
    font-size: 34px;
    font-weight: bold;
    margin-top: 15px;
    position: relative;
    padding-bottom: 10px;
}

h3.blog-title {
    line-height: 26px;
    padding-bottom: 10px;
}

.cs_blog_img img:before {
    position: absolute;
    content: "";
    bottom: 0px;
    right: 0;
    left: 0;
    margin: auto;
    width: 100%;
    height: 100%;
    background-color: transparent;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
.cs_blog-body {
    float: left;
    width: 100%;
    background-color: #ffffff;
    padding: 0px 20px 20px;
    border: 1px solid #e1e1e1;
    border-top: none;
    border-radius: 3px;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
}
.cs_blog_img img:hover:before {
    opacity: 1;
    visibility: visible;
    width: 100%;
    background: linear-gradient(135deg, #cc2223, #164384);
}
.cs_blog_heading {
    text-align: center;
    margin-bottom: 26px;
}
.cs_blog_img_box {
    position: relative;
}
.cs_blog_text {
    margin-top: 10px;
}
.cs_blog_text h3 {
    font-size: 20px;
    color: #272727;
    font-weight: 600;
    line-height: 32px;
    transition: all 0.3s;
}
.cs_blog_text h3:hover {
    color: #cf2224;
}
.cs_blog_text p {
    color: #858585;
    padding: 8px 0px;
}
.cs_blog_user a {
    color: #858585;
    transition: all 0.3s;
}
.cs_blog_user a:hover {
    color: #cf2224;
}

.cs_blog_comment a {
    color: #858585;
    transition: all 0.3s;
}
.cs_blog_comment a:hover {
    color: #cf2224;
}
.cs_blog_user_comment {
    display: flex;
    align-items: center;
    padding-top: 20px;
}
.cs_blog_btn.cs_blog_time a {
    color: #858585;
    transition: all 0.3s;
    font-size: 16px;
    font-weight: 400;
}
.cs_blog_comment {
    padding-left: 40px;
}
.cs_blog_img_box {
    position: relative;
    border: 1px solid #e1e1e1;
    border-radius: 3px;
}
.cs_blog_btn .cs_main_btn a {
    padding: 7px 30px;
    height: 45px;
}
.cs_blog_btn {
    margin-top: 10px;
}
.cs_blog_time a {
    color: #858585;
    transition: all 0.3s;
    font-size: 16px;
    font-weight: 400;
}
.cs_blog_time i {
    color: #cf2224;
}
.cs_blog_time a:hover {
    color: #cf2224;
}
.cs_blog_img img {
    transition: all 0.4s;
    position: relative;
    width: 100%;
}
.cs_blog_img:hover img {
    transition: all 0.4s;
    transform: scale(1.1);
}
.cs_blog_img {
    overflow: hidden;
    transition: all 0.4s;
}
.cs_blog_wrapper {
    margin-top: 80px;
}
/*=================Contact Section Style==================*/
.cs_contact_wrapper {
    margin-top: 80px;
    position: relative;
    z-index: 99;
}
/* .cs_contact_wrapper .row {
    background-image: url(../images//hero-bg-1.svg);
    box-shadow: 0px 0px 30px 0px rgba(157, 134, 183, 0.1);
    padding: 50px;
} */
.cs_contact_box h1 {
    color: #272727;
    font-size: 20px;
    font-weight: 500;
    padding: 20px 0px;
}
.cs_contact_box p {
    color: #858585;
}
.cs_contact_box {
    text-align: center;
}
/*=================Footer Section Style==================*/
.cs_footer_wrapper{
    background: #2f3942;
    padding: 50px 0 10px;
    position: relative;
    z-index: 1;
}
.cs_footer_wrapper:after{
    content: "";
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0.96;
    background: #2a2a32;
    z-index: -1;
}
.cs_footer_section4 i {
    color: #cf2224;
    padding-right: 15px;
}
.cs_footer_section4 img {
    padding-right: 5px;
}

.cs_footer_icon ul {
    display: flex;
    align-items: center;
}
.cs_footer_icon li {
    margin-right: 20px;
}
.cs_footer_icon i {
    font-size: 18px;
}
.cs_footer_icon h5 {
    font-size: 18px;
    font-weight: 600;
    color: #fff;
    padding: 25px 0px 15px;
}
.cs_footer_section1 p {
    padding: 20px 0px 0px;
    color: #fff;
}
.cs_footer_wrapper h5 {
    font-size: 18px;
    font-weight: 600;
    color: #fff;
    padding: 10px 0px 15px;
    position: relative;
}
.cs_footer_icon ul {
        padding-top: 10px;
    padding-left: 0px;
}
.cs_footer_wrapper h5:before {
    position: absolute;
    content: "";
    top: 90%;
    left: 0;
    width: 80px;
    height: 1px;
    background: linear-gradient(135deg, #cc2223, #164384);
}

.cs_footer_section2 ul {
    padding-top: 8px;
        padding-left: 0px;
}
.cs_footer_section3 ul {
    padding-top: 8px;
        padding-left: 0px;
}
.cs_footer_section4 ul {
    padding-top: 8px;
        padding-left: 0px;
}
.cs_footer_wrapper li i.fa.fa-envelope {
    color: #cf2224;
    padding-right: 27px;
}
.cs_footer_wrapper li i.fa.fa-phone {
    color: #cf2224;
    padding-right: 27px;
}
.cs_footer_wrapper li {
    padding-bottom: 10px;
}
.cs_copyright {
    text-align: center;
    border-top: 1px solid #484848;
    padding: 15px 0 0;
}
.cs_footer_wrapper a:hover {
    color: #cf2224;
}
.cs_footer_logo a:hover{
    color: #fff;
}

.cs_footer_logo .img-fluid {
    max-width: 37% !important;
    height: auto;
    filter: brightness(0) invert(1);
}

/*=================Swiper Style==================*/
    html,
    body {
      position: relative;
      height: 100%;
    }
    .swiper-container {
      width: 100%;
      height: 100%;
      margin-left: auto;
      margin-right: auto;
      position: relative;
    }

    .swiper-slide {
      font-size: 16px;

      /* Center slide text vertically */
      display: -webkit-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      -webkit-align-items: center;
      align-items: center;
    }

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

/*=================Blog Page Style==================*/
.blog-detail-new {
  padding: 80px 0;
  background: #f7f9fc;
}

/* MAIN CARD */
.blog-detail-card {
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 5px 25px rgba(0,0,0,0.05);
}

/* IMAGE */
.blog-detail-img img {
  width: 100%;
  height: 400px;
  object-fit: cover;
}

/* CONTENT */
.blog-detail-content {
  padding: 30px;
}

/* META */
.blog-meta {
  font-size: 14px;
  color: #777;
  margin-bottom: 15px;
}

.blog-meta span {
  margin-right: 15px;
}

.blog-meta i {
  color: #cf2c2b;
}

/* TITLE */
.blog-detail-content h1 {
  font-size: 30px;
  font-weight: 700;
  color: #164384;
  margin-bottom: 15px;
}

/* DESCRIPTION */
.blog-description {
  font-size: 15px;
  line-height: 1.8;
  color: #555;
}

/* SIDEBAR */
.blog-sidebar {
  background: #fff;
  padding: 20px;
  border-radius: 12px;
  box-shadow: 0 5px 20px rgba(0,0,0,0.05);
  position: sticky;
  top: 20px;
}

.blog-sidebar h4 {
  margin-bottom: 20px;
  color: #164384;
  font-weight: 700;
}

/* SIDEBAR ITEM */
.sidebar-item {
  display: flex;
  margin-bottom: 15px;
  text-decoration: none;
  border-bottom: 1px solid #eee;
  padding-bottom: 10px;
}

.sidebar-item img {
  width: 70px;
  height: 60px;
  object-fit: cover;
  border-radius: 6px;
  margin-right: 10px;
}

.blog-description p {
    color: #5a5050;
}

.sidebar-item h5 {
  font-size: 14px;
  color: #333;
  margin: 0;
}

.sidebar-item span {
  font-size: 12px;
  color: #999;
}

.sidebar-item:hover h5 {
  color: #cf2c2b;
}

/* RESPONSIVE */
@media(max-width:768px){
  .blog-detail-img img {
    height: 250px;
  }
}

/********************************************************
1. Contact start
 *******************************************************/
.cs_contact_info .timeline-contact-section{
  padding: 90px 0;
  background: #ffffff;
}

/* HEADER */
.tc-header{
  text-align: center;
  margin-bottom: 50px;
}

.tc-header h2{
  font-size: 36px;
  font-weight: 700;
}

.tc-header p{
  color: #666;
}

/* WRAPPER */
.tc-wrapper{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
}

/* TIMELINE */
.tc-timeline{
  position: relative;
  padding-left: 20px;
}



.tc-item{
  display: flex;
  gap: 15px;
  margin-bottom: 30px;
  position: relative;
}

.tc-icon{
  width: 40px;
  height: 40px;
  background: #cf2c2b;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  z-index: 2;
  box-shadow: 0 10px 20px rgba(255,94,20,0.3);
  transition: 0.3s;
}

.tc-item:hover .tc-icon{
  transform: scale(1.1) rotate(10deg);
}

.tc-content h4{
  margin: 0;
  font-size: 16px;
}

.tc-content p{
  margin: 0;
  color: #666;
  font-size: 14px;
}

/* FORM */
.tc-form{
  background: #f8fafc;
  padding: 35px;
  border-radius: 16px;
  box-shadow: 0 15px 40px rgba(0,0,0,0.08);
  transition: 0.4s;
}

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

.tc-form h3{
  margin-bottom: 20px;
}

/* INPUTS */
.tc-form input,
.tc-form textarea{
  width: 100%;
  margin-bottom: 15px;
  padding: 12px 15px;
  border: 1px solid #ddd;
  border-radius: 10px;
  outline: none;
  transition: 0.3s;
}

.tc-form input:focus,
.tc-form textarea:focus{
  border-color: #cf2c2b;
  box-shadow: 0 0 10px rgba(255,94,20,0.2);
}

/* BUTTON */
.tc-form button{
  background: linear-gradient(135deg, #cc2223, #164384);
  border: none;
  color: #fff;
  padding: 12px 30px;
  border-radius: 30px;
  font-weight: 600;
  cursor: pointer;
  transition: 0.3s;
}

.tc-form button:hover{
  transform: scale(1.05);
}

/* RESPONSIVE */
@media(max-width:768px){
  .tc-wrapper{
    grid-template-columns: 1fr;
  }
}


.contact-info-section{
  padding: 80px 0;
  background: #f6f8fc;
}

/* GRID */
.info-grid{
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 25px;
  margin-bottom: 40px;
}

/* CARD */
.info-card{
  background: #fff;
  padding: 30px;
  border-radius: 18px;
  text-align: center;
  box-shadow: 0 15px 35px rgba(0,0,0,0.08);
  transition: 0.4s;
  position: relative;
  overflow: hidden;
}

/* HOVER EFFECT */
.info-card:hover{
  transform: translateY(-10px);
  box-shadow: 0 25px 50px rgba(0,0,0,0.12);
}

.timeline-contact-section {
    margin: 50px 0px;
}

/* ICON */
.icon-box{
  width: 60px;
  height: 60px;
  background: linear-gradient(135deg, #cc2223, #164384);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  margin: 0 auto 15px;
  font-size: 20px;
  box-shadow: 0 10px 20px rgba(255,94,20,0.3);
  transition: 0.3s;
}

.info-card:hover .icon-box{
  transform: rotate(10deg) scale(1.1);
}

/* TEXT */
.info-card h4{
  margin: 10px 0 5px;
  font-size: 18px;
}

.info-card p{
      color: #666;
    font-size: 15px;
    padding-top: 10px;
    margin-bottom: 0px;
}

/* SOCIAL BOX */
.social-box{
  text-align: center;
}

.social-box h5{
  font-size: 18px;
  margin-bottom: 15px;
  color: #333;
}

/* SOCIAL ICONS */
.social-icons{
  display: flex;
  justify-content: center;
  gap: 15px;
}

/* ICON STYLE */
.social-icons a{
  width: 45px;
  height: 45px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #fff;
  color: #333;
  box-shadow: 0 10px 25px rgba(0,0,0,0.08);
  transition: 0.3s;
  font-size: 18px;
}

/* HOVER COLORS */
.social-icons a.fb:hover{
  background:#1877f2;
  color:#fff;
}
.social-icons a.ig:hover{
  background:#e1306c;
  color:#fff;
}
.social-icons a.tw:hover{
  background:#1da1f2;
  color:#fff;
}
.social-icons a.li:hover{
  background:#0077b5;
  color:#fff;
}

/* RESPONSIVE */
@media(max-width:768px){
  .info-grid{
    grid-template-columns: 1fr;
  }
}

/*=================Responsive Style==================*/
@media (max-width: 1400px){
.cs_header_form {
    right: 5%;
}
}

@media (max-width: 1200px){
.cs_header_form {
    right: 1%;
    width: 385px;
}
.cs_banner_text {
    width: 500px;
}
.cs_about_img {
    padding-left: 0px;
}
.cs_main_header_section .cs_main_btn a {
    padding: 7px 10px;
}
.cs_main_header_menu>ul>li>a {
    margin-left: 30px;
}
.cs_top_header_info {
    display: block;
}
.cs_about_img {
    transform: translateY(0px);
}
.cs_top_header_info_mail {
    padding-left: 0px;
}
.cs_about_wrapper .row {
    align-items: flex-end;
}
.cs_header_form {
    padding: 0 15px;
    width: 450px;
    right: 0;
    padding: 0 15px;
    height: unset;
        top: 7%;
    bottom: 110px;
}
.cs_banner_text {
    width: 500px;
}
.cs_about_content {
    padding-bottom: 50px;
}
.cs_main_btn a {
    padding: 7px 10px;
}
.cs_people_choose_wrapper .cs_main_btn a {
    padding: 7px 30px;
}
.cs_about_wrapper {
    padding: 0px 0 0;
}
}

@media (max-width: 1000px){
.cs_toggle {
    display: inline-block;
    position: absolute;
    top: 15px;
    right: 15px;
}
.ss_menu_open .cs_main_header_overlay{
    position: fixed;
    
}
.cs_about_img {
    padding-left: 0px;
}
.cs_main_header_section{
    position: fixed;
    top: 0;
    left: -300px;
    bottom: 0;
    width: 270px;
    background: #fff;
    padding: 0;
    transition: all 0.3s;
    z-index: 5;
}
.ss_menu_open.cs_main_header_section{
    left: 0;
}
nav.cs_main_header_section {
    display: block;
    margin-top: 0;
}
.cs_main_header_menu li {
    border-bottom: 1px solid #eaeaea;
    padding-bottom: 8px;
    padding-top: 10px;
}
header .cs_main_header_btn {

    margin-right: 50px;
}
.cs_main_header_section {
    justify-content: flex-end;
    margin-top: -25px;
}
.cs_main_header_section ul {
    display: block;
    margin-top: 50px;
}
.cs_header_banner .cs_main_btn a {
    padding: 10px 40px;
}
}

@media (max-width: 991px){
.ed_toggle_bar {
    display: block;
} 
.ed_toggle_bar i{
    color: #cf2224; 
}   
.cs_pricing_calculate_table {
    margin-bottom: 30px;
}
.menu_open .cs_nav_items.main_menu_wrapper.text-right {
    left: 0;
}
.cs_main_btn a {
    padding:10px 40px;
    /* margin-bottom: 20px; */
}
.cs_single_blog_img1_box2 img{
    width: 100%;
}
.cs_main_header_wrapper .cs_main_btn {
    margin-left: 20px;
}
.cs_about_img {
    padding-left: 0px;
}
.cs_main_header_menu>ul>li>a {
    margin-left: 25px;
}
.cs_top_services_box {
    margin-bottom: 20px;
}
.cs_about_icon_box {
    margin-top: 25px;
}
.cs_pricing_calculate_btn.cs_main_btn a {
    padding: 10px 25px;
}
.cs_pricing_calculate_table_body input[type="text"] {
    width: 90%;
}
.cs_pricing_calculate_table_body {
    padding: 10px 0px 10px 15px;
}
.cs_header_form {
    top: 35px;
}
.cs_header_banner h1 {
    font-size: 35px !important;
    padding-top : 10px !important;
}
.cs_banner_text {
    width: 400px;
}
.cs_banner_text p{
    font-size: 14px;
}
.cs_about_content {
    padding-bottom: 30px;
}
.cs_header_form {
    padding: 0 15px;
    width: 360px;
    right: 0;
    padding: 0 15px;
    height: unset;
    top: 15%;
    bottom: 110px;
}
.cs_pricing_charge_table table {
    display: block;
}
div#header_tab a {
    padding: 10px 80px;
}
div#header_tab1 a {
    padding: 10px 80px;
}
.cs_header_banner2 {
    padding: 200px 0 350px;
}
.cs_header_banner {
    padding: 200px 0 350px;
}
.cs_about_wrapper {
    padding: 80px 0 0;
}
.cs_header_form a.cs_banner_tab{
    padding: 18px 20px;
}
.cs_single_blog_img1_box2 {
    display: block;
}
.cs_single_blog_img1_box2 p {
    margin-left: 0;
    margin-top: 15px;
}
.cs_info_bg {
    margin-left: 0;
    margin-right: 0;
}
}

@media (max-width: 991.98px) {
    .main_menu_wrapper li.has_submenu:before, .main_menu_wrapper li.has_submenu:after {
        background: linear-gradient(135deg, #cc2223, #164384);
    }
    .main_menu_wrapper ul > li > a {
    padding: 15px 20px 0px;
    width: 100%;
}
.main_menu_wrapper li.has_submenu:before, .main_menu_wrapper li.has_submenu:after {
    background: #cf2224;
}
.main_menu_wrapper li.has_submenu:before {
    right: 26px;
    width: 2px;
    height: 12px;
    top: 20px;
}
.main_menu_wrapper li.has_submenu:before, .main_menu_wrapper li.has_submenu:after {
    position: absolute;
    bottom: 0;
    content: '';
}
.main_menu_wrapper li.has_submenu:before, .main_menu_wrapper li.has_submenu:after {
    background: linear-gradient(135deg, #cc2223, #164384);
}
.main_menu_wrapper li.has_submenu:after {
    right: 21px;
    width: 12px;
    height: 2px;
    top: 25px;
}
.main_menu_wrapper li.has_submenu:before, .main_menu_wrapper li.has_submenu:after {
    position: absolute;
    bottom: 0;
    content: '';
}
.cs_blog_section {
    padding-top: 30px;
}
}
@media (max-width: 767px){
.cs_pricing_calculate_table_body input[type="text"] {
    width: 125px;
}
.cs_pricing_calculate_btn.cs_main_btn a {
    padding: 10px 60px;
}
.cs_about_img {
    padding-left: 0px;
}
.tab {
    margin-top: 30px;
}
div#header_tab a {
    padding: 10px 65px;
}
div#header_tab1 a {
    padding: 10px 65px;
}
.tab button {
    padding: 14px 5px;
}
.cs_header_form {
    padding: 0 15px;
    width: 360px;
    right: 0;
    padding: 0 15px;
    height: unset;
    top: 19%;
    bottom: 110px;
}
.cs_blog_img img {
    width: 100%;
}
.cs_blog_section {
    margin-bottom: 25px;
}
.cs_blog_sidebar_start {
    margin-top: 50px;
}
.cs_blog_section2 {
    margin-top: 0px;
}
.cs_banner_text {
    width: 250px;
}
.cs_contact_box {
    margin-top: 20px;
}
.cs_about_img img {
    margin-top: 30px;
}
.cs_banner_text p {
    font-size: 16px;
}
.cs_pricing_charge_table {
    margin-top: 30px;
}
.cs_header_form {
    width: 300px;
    right: 1%;
}
.cs_top_header_info {
    display: block;
}
.cs_top_header_info_mail {
    padding-left: 0;
}
.cs_top_header_info_btn {
    text-align: center;
}
.cs_top_header_info {
    text-align: center;
}
.cs_pricing_calculate_table_body input[type="text"] {
    background: #f3f5f6;
    border: none;
    padding: 10px 15px;
    width: 100%;
}
.cs_pricing_calculate_btn.cs_main_btn a {
    padding: 10px 40px;
}
header {
    display: flex;
    justify-content: flex-end;
    margin-top: -45px;
    margin-right: 80px;
}

.cs_toggle {
    top: -40px;
    right: 15px;
}
.cs_our_service_box {
    margin-bottom: 30px;
} 
.cs_our_service_box2 {
    margin-top: 0;
}
.cs_banner_text {
    width: 100%;
}
.cs_header_form {
    padding: 0 15px;
    width: 100%;
    right: 0;
    padding: 0 15px;
    height: unset;
    top: 32%;
    bottom: 110px;
}
.cs_header_banner {
    padding: 30px 0 350px !important;
}
.cs_header_banner .cs_main_btn a {
    padding: 10px 40px;
}
.cs_header_form {
    margin-top: 65px;
}
.cs_blog_section {
    padding-top: 30px;
}
.cs_about_img {
    padding-left: 0;
}
.cs_people_choose_slider_img img {
    width: 800px;
}
.cs_single_blog_img1_box2 {
    display: block;
}
.cs_single_blog_img1_box2 p {
    margin-left: 0;
    margin-top: 15px;
}
.cs_info_bg {
    margin-left: 0;
    margin-right: 0;
}
}


@media (max-width: 567px){
    .cs_top_header_info {
    display: block;
    text-align: center;
}
.cs_header_form {
    padding: 0 15px;
    width: 100%;
    right: 0;
    padding: 0 15px;
    height: unset;
    top: 32%;
    bottom: 110px;
}
.cs_pricing_charge_table table {
    display: block;
}
.tab button {
    padding: 14px 15px;
}
.cs_about_img img {
    margin-top: 30px;
}
.cs_counter_wrapper {
    padding: 70px 0 70px;
}
.cs_counter_icon_box {
    margin: 15px 0;
}
.cs_pricing_charge_table td {
    padding: 18px 10px;
    white-space: nowrap;
}
.cs_testimonial_heading h1 {
    font-size: 26px;
}
.cs_our_services_heading h1 {
    font-size: 25px;
    line-height: 1.4;
    margin-top: 10px;
}
.cs_about_img {
    padding-left: 0;
}
.cs_about_content p {
    text-align: left;
}
.cs_people_choose_content h1 {
    font-size: 25px;
}
.cs_pricing_calculate_table_body {
    padding: 10px 0px 10px 15px;
}
.cs_contact_wrapper .row {
    padding: 25px;
}
.cs_about_content h1 {
    font-size: 25px;
}
.cs_banner_text {
    width: 100%;
}
.cs_info_bg {
    margin-left: 0;
    margin-right: 0;
}
.cs_banner_text_button {
    display: flex;
    margin-top: 30px;
}
.cs_pricing_calculate_table_body label {
    padding-top: 10px;
}
.cs_banner_tracking_button {
    margin-left: 30px;
    margin-top: 0;
}.cs_pricing_calculate_table_body {
    display: block;
    padding: 10px 20px 10px !important;
}
header {
    margin-top: -45px;
    margin-right: 0;
}
.cs_table_heading h1 {
    font-size: 26px;
}
.cs_top_header_info_mail {
    padding-left: 0;
}
.cs_pricing_charge_table {
    margin-top: 30px;
}
.cs_top_header_info_btn {
    text-align: center;
}
.cs_banner_text {
    margin-bottom: 40px;
}
    .cs_banner_tracking_button a {
    padding: 10px 15px;
}
    .cs_banner_read_button a {
    padding: 10px 15px;
}
.cs_main_header_btn.cs_main_btn a {
    padding: 6px 7px;
    font-size: 14px;
    height: 40px;
}
.cs_header_banner {
    padding: 60px 0 750px;
}
div#header_tab a {
    padding: 10px 90px;
}
div#header_tab1 a {
    padding: 10px 90px;
}
.cs_top_services_box {
    margin-bottom: 20px;
    width: 100%;
}
.cs_people_choose_slider_img {
    margin-top: 30px;
}
.cs_about_img {
    padding-left: 0;
}
.cs_our_service_box {
    margin-bottom: 20px;
}
.cs_our_service_box2 {
    margin-top: 0px;
}
.cs_testimonial_img_name {
    display: block;
    text-align: center;
}
.cs_testimonial_name:after {
display: none;
}
.cs_testimonial_slides {
    padding: 50px 15px;
    width: 100%;
}
.cs_testimonial_text p {
    color: #c1c2ce;
    font-style: italic;
    font-size: 14px;
    font-weight: 400;
    text-align: center;
}
.cs_our_service_box {
    margin-bottom: 30px;
}
.cs_our_service_box2 {
    margin-top: 0;
}
.cs_testimonial_name {
    display: block;
    text-align: center;
    padding: 20px 0;
}
.cs_testimonial_name p {
    padding-left: 0;
}
.cs_testimonial_wrapper .swiper-button-next  {
    left: auto;
    right: 0;
}
.cs_testimonial_wrapper .swiper-button-prev {
    right: 65px;
}
.cs_pricing_calculate_btn.cs_main_btn a {
    padding: 10px 20px;
    width: 90%;
}
.cs_pricing_calculate_table_body input[type="text"] {
    width: 100%;
}
.cs_blog_section {
    margin-bottom: 20px;
}
.cs_single_blog_img1_box2 {
    display: block;
}
.cs_single_blog_img1_box2 p {
    margin-left: 0;
    margin-top: 20px;
}
.cs_comment_holder {
    display: block;
}
.cs_comment_detail {
    width: 100%;
    margin-top: 15px;
}
.cs_single_blog_img1_box1 {
    display: block;
}
.cs_single_blog_text1 {
    width: 100%;
}
.cs_single_blog_user_comment {
    display: block;
    margin-top: 30px;
}
.cs_single_blog_user_comment .cs_blog_time {
    margin-left: 0;
    margin-top: 10px;
    margin-bottom: 10px;
}
.cs_blog_comment {
    padding-left: 0;
}
.cs_comment_holder {
    margin-bottom: 30px;
}
.cs_comment_form {
    margin-top: 55px;
}
.cs_contact_box {
    margin-bottom: 30px;
}
.cs_footer_wrapper {
    padding: 10px 0 10px;
}
.cs_blog_img img {
    width: 100%;
}
.cs_blog_section {
    margin-bottom: 25px;
}
.cs_toggle {
    display: inline-block;
    position: absolute;
    top: -40px;
    right: 15px;
}
.cs_main_header_logo a {
    font-size: 22px;
}
.cs_testimonial_section {
    width: 95%;
}
div#Mission {
    text-align: left;
}
div#Vision {
    text-align: left;
}
div#Vision .cs_main_btn a {
    padding: 10px 30px;
}
}
@media (max-width: 420px){
header {
    margin-top: 0px;
    margin-right: -20px;
    justify-content: flex-end;
}
.topbar {
    display: none;
}
.cs_header_form {
    top: 37%;
}
.cs_pricing_calculate_table_body input[type="text"] {
    width: 100%;
}
.display_flex {
    display: flex;
    flex-wrap: unset;
    width: auto;
}
.cs_search_wrap {
    margin-left: 0px;
}
.cs_about_content p {
    text-align: left;
}
.cs_people_choose_content p {
    text-align: left;
}
.who_we_tab li a {
    font-size: 15px;
    margin: 0 20px;
}
.cs_people_choose_wrapper .who_we_tab li a {
    font-size: 16px;
    margin: 0 10px;
}
}
@media (max-width: 350px){
header {
    margin-top: -40px;
    justify-content: flex-end;
    margin-right: -20px;
}
.cs_header_form {
    top: 39%;
}
.cs_main_btn a
{
    margin-bottom: 0px ;
}
.cs_main_header_logo img {
    max-width: 30px;
}
.display_flex {
    display: flex;
    flex-wrap: unset;
    width: 100%;
}
.cs_header_form a.cs_banner_tab {
    padding: 15px 10px;
}
.cs_header_banner .cs_main_btn a {
    padding: 5px 20px;
}
.cs_search_wrap {
    margin-left: 110px;
}
}
@media (max-width: 320px){
.cs_main_header_btn.cs_main_btn a {
    padding: 5px 3px;
    font-size: 13px;
    height: 38px;
}
.cs_banner_read_button a {
    padding: 5px 5px;
    height: 40px;
}
.cs_banner_tracking_button a {
    padding: 5px 5px;
    height: 40px;
}
.tab button {
    padding: 10px 10px;
}
.cs_header_form a.cs_banner_tab {
    padding: 15px 10px;
}
.cs_header_form a.active.show {
    padding: 15px 10px;
}
div#header_tab a {
    padding: 10px 60px;
}
div#header_tab1 a {
    padding: 10px 60px;
}
.cs_banner_tracking_button {
    margin-left: 5px;
}
.cs_about_content p{
    text-align: left;
}
.cs_people_choose_content p {
    text-align: left;
}
div#Mission {
    text-align: left;
}
div#Vision {
    text-align: left;
}
.who_we_tab li a {
    font-size: 14px;
    margin: 0 15px;
}
.cs_blog_comment {
    padding-left: 15px;
}
}





.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    color: #495057;
    background-color: #fff;
    border-color: transparent !important;
}

/* custom css  */

.cs_top_header_info p span a {
    color: #fff;
    text-decoration: none;
}

.cs_copyright p a {
    color: #fff;
    text-decoration: none;
}

.cs_copyright p {
    color: #fff;
}


/* counter section  */
.plx-counter {
  padding: 90px 0;
  background: url('images/bg-cta-2.jpg') center/cover no-repeat;
  position: relative;
  color: #fff;
  margin-bottom: 50px;
}

/* DARK OVERLAY */
.plx-counter::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(44,44,44,0.85), rgba(56,56,56,0.8));
}

/* CONTENT ABOVE OVERLAY */
.plx-counter .container {
  position: relative;
  z-index: 2;
}

/* GRID */
.plx-counter-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 25px;
}

/* CARD */
.plx-counter-box {
  position: relative; /* IMPORTANT FIX */
  text-align: center;
  padding: 20px 20px;
  border-radius: 12px;
  background: #fff;
  transition: 0.4s ease;
  overflow: hidden;
}

/* BORDER ANIMATION LINE */
.plx-counter-box::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0;
  height: 3px;
  background: linear-gradient(to right, #164384, #cc2223);
  transition: 0.4s ease;
}

.plx-counter-box:hover::after {
  width: 100%;
}

/* HOVER EFFECT */
.plx-counter-box:hover {
  transform: translateY(-10px);
  box-shadow: 0 15px 30px rgba(0,0,0,0.2);
}

/* NUMBER */
.plx-counter-box h2 {
  font-size: 38px;
  font-weight: 700;
  color: #cc2223;
  margin-bottom: 8px;
}

/* TEXT */
.plx-counter-box p {
  color: #333;
  font-size: 15px;
}

/* RESPONSIVE */
@media(max-width: 992px) {
  .plx-counter-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media(max-width: 576px) {
  .plx-counter-grid {
    grid-template-columns: 1fr;
  }
}



.cs_blog_section {
  background: #fff;
  transition: all 0.3s ease;
  box-shadow: 0 8px 24px rgb(100 97 97 / 31%) !important;
  padding: 20px;
  border-radius: 10px;
}
.cs_blog_section:hover {
  transform: translateY(-5px);
  box-shadow: 0px 6px 15px rgba(0,0,0,0.1);
}

.blog-title a {
  text-decoration: none;
  color: #222;
  font-weight: 600;
}
.blog-title a:hover {
  color: #ff9458;
}

.cs_blog_meta {
  display: flex;
  align-items: center;
  gap: 15px;
  font-size: 0.9rem;
  margin-top: 10px;
  margin-bottom: 10px;
}
.cs_blog_date {
  display: flex;
  align-items: center;
  gap: 5px;
  color: #555;
  font-weight: 500;
}
.cs_blog_date i {
  color: #ff7755;
}

.cs_blog_share a {
  color: #555;
  margin-right: 10px;
  font-size: 19px;
  transition: color 0.2s ease;
}
.cs_blog_share a:hover {
  color: #ff9458;
}

.blog-button a.btn {
  color: #ff8c58;
  border: 1px solid #ff8c58;
}
.blog-button a.btn:hover {
  color: #ffffff !important;
  background: linear-gradient(135deg, #cc2223, #164384);
  border-color: #fe8656;
}

.equal-contact {
  position: relative;
  padding: 80px 0;
  background: #f5f8ff;
  overflow: hidden;
      margin-top: 50px;
}

/* SOFT BACKGROUND SHAPES */
.equal-bg::before,
.equal-bg::after {
  content: "";
  position: absolute;
  width: 350px;
  height: 350px;
  filter: blur(120px);
  opacity: 0.1;
  border-radius: 50%;
}

.equal-bg::before {
  background: #144384;
  top: -120px;
  left: -120px;
}

.equal-bg::after {
  background: #cf2c2b;
  bottom: -120px;
  right: -120px;
}

/* WRAPPER (EQUAL SPLIT) */
.equal-wrapper {
  display: flex;
  gap: 30px;
  position: relative;
  z-index: 2;
}

/* LEFT & RIGHT EQUAL */
.equal-left {
  flex: 1;   /* 👈 THIS MAKES IT 50/50 */
  /* background: #fff; */
  border-radius: 18px;
  padding: 30px;
  /* box-shadow: 0 10px 30px rgba(0,0,0,0.05); */
  animation: fadeUp 0.8s ease;
}


.equal-right {
  flex: 1;   /* 👈 THIS MAKES IT 50/50 */
  background: #fff;
  border-radius: 18px;
  padding: 30px;
  border: 1px solid #eee;
  box-shadow: 0 10px 30px rgba(0,0,0,0.05);
  animation: fadeUp 0.8s ease;
}

/* HEADINGS */
.equal-left h2,
.equal-right h2 {
  color: #144384;
    margin-bottom: 20px;
    font-weight: 700;
}

.equal-card h4 {
    font-size: 20px;
    color: #144384;
    font-weight: 600;
}

.equal-card a {
    text-decoration: none;
    color: #000;
}


/* TEXT */
.equal-left p {
  color: #666;
  margin-bottom: 25px;
}

/* INFO CARDS */
.equal-info {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.equal-card {
  display: flex;
  gap: 15px;
  padding: 15px;
  border-radius: 12px;
  transition: 0.3s;
  border: 1px solid #eee;
  box-shadow: 0 10px 30px rgba(0,0,0,0.05);
}

.equal-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 20px rgba(20,67,132,0.12);
}

.equal-card i {
  color: #ffffff;
  font-size: 18px;
      background: linear-gradient(135deg, #cc2223, #164384);
    width: 40px;
    height: 40px;
    padding: 12px;
    border-radius: 50%;
}

/* FORM GRID */
.equal-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 15px;
}

/* INPUTS */
.equal-form input,
.equal-form textarea {
  width: 100%;
  padding: 12px;
  margin-bottom: 20px;

  border-radius: 10px;
  border: 1px solid #ddd;
  outline: none;
  transition: 0.3s;
}

.equal-form input:focus,
.equal-form textarea:focus {
  border-color: #144384;
  box-shadow: 0 0 10px rgba(20,67,132,0.15);
}

.equal-form textarea {
  min-height: 120px;
  resize: none;
}

/* BUTTON */
.equal-form button {
  width: 100%;
  padding: 12px;
  border: none;
  border-radius: 10px;

  background: linear-gradient(135deg, #144384, #cf2c2b);
  color: #fff;
  font-weight: 600;

  cursor: pointer;
  transition: 0.3s;
}

.equal-form button:hover {
  transform: scale(1.03);
  box-shadow: 0 10px 20px rgba(71, 71, 71, 0.25);
}

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

/* RESPONSIVE */
@media(max-width: 991px) {
  .equal-wrapper {
    flex-direction: column;
  }

  .equal-grid {
    grid-template-columns: 1fr;
  }
}


.plx-logistics {
  padding: 80px 0;
  background: #fff;
  overflow: hidden;
}

.plx-row {
  display: none;
}


/* IMAGE SIDE */


.style-one {
  position: relative;
  overflow: hidden;
  border-radius: 12px;
  flex: 1;
  min-width: 300px;
}

/* .style-one .plx-main-img {
  width: 100%;
  display: block;
} */

.plx-diagonal {
  position: absolute;
  bottom: 0;
  left: 0;
  background: #cc2223;
  color: #fff;
  padding: 11px 45px;
  clip-path: polygon(0 0, 100% 0, 85% 100%, 0% 100%);
  font-weight: 600;
}

.plx-image-box:hover .plx-main-img {
  transform: scale(1.05);
}

/* Badge */
.plx-badge {
  position: absolute;
  top: 20px;
  left: 20px;
  background: #cc2223;
  color: #fff;
  padding: 8px 15px;
  font-weight: 600;
  border-radius: 5px;
}

/* Overlay Card */
.plx-overlay-card {
  position: absolute;
  bottom: -30px;
  right: 20px;
  background: #164384;
  color: #fff;
  padding: 20px;
  border-radius: 10px;
  width: 220px;
  box-shadow: 0 10px 25px rgba(0,0,0,0.2);
}

.plx-overlay-card h4 {
  margin: 0;
  font-size: 18px;
}

/* CONTENT SIDE */
.plx-content {
  flex: 1;
  min-width: 300px;
}

.plx-sub {
  color: #cc2223;
  font-weight: 600;
  margin-bottom: 10px;
}

.plx-title {
  font-size: 38px;
  font-weight: 700;
  color: #164384;
  margin-bottom: 12px;
}

.plx-desc {
  color: #666;
  margin-bottom: 25px;
}

plx-features {
  margin-top: 20px;
}

.plx-features .col-sm-6 {
  margin-bottom: 15px;
}

/* KEEP FEATURE STYLE SAME */
.plx-feature {
  display: flex;
  align-items: center;
  gap: 15px;
  background: #f4f4f4;
  padding: 18px;
  border-radius: 10px;
  transition: 0.3s;
  border-left: 3px solid #cc2223;
}

.plx-feature:hover {
  transform: translateY(-5px);
  background: #fff;
  box-shadow: 0 10px 20px rgba(0,0,0,0.08);
}

/* ICON */
.plx-feature i {
     font-size: 16px;
    color: #fff;
    background: linear-gradient(135deg, #cc2223, #164384);;
    min-width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
}

/* TEXT */
.plx-feature h6 {
  margin: 0;
  font-size: 16px;
  color: #164384;
}

.plx-feature p {
  margin: 5px 0 0;
  font-size: 14px;
  color: #666;
}
/* FEATURES FIX END */

/* BOTTOM */
.plx-bottom {
  display: flex;
  align-items: center;
  gap: 30px;
  margin-top: 30px;
  flex-wrap: wrap;
}

/* BUTTON */
.plx-btn {
  background: #cc2223;
  color: #fff;
  padding: 12px 25px;
  border-radius: 5px;
  text-decoration: none;
  transition: 0.3s;
}

.plx-btn:hover {
  background: #164384;
}

.plx-call {
  display: flex;
  align-items: center;
  gap: 12px;
  border-left: 4px solid #cc2223;
  padding: 10px 15px;
  background: #f9f9f9;
  border-radius: 6px;
}

.plx-call i {
  background: #164384;
  color: #fff;
  width: 38px;
  height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
}

.plx-call strong {
  color: #cc2223;
}
/* RESPONSIVE */
@media(max-width: 992px) {
  .plx-row {
    flex-direction: column;
  }

  .plx-title {
    font-size: 28px;
  }

  .plx-features {
    grid-template-columns: 1fr;
  }

  .plx-overlay-card {
    position: relative;
    bottom: 0;
    right: 0;
    margin-top: 15px;
  }
}
/* services  */

.marquee-container {
  overflow: hidden;
  position: relative;
  width: 100%;
}

.marquee-track {
  display: flex;
  width: max-content;
  animation: marqueeScroll 30s linear infinite;
}

.cs_our_service_content h5.fw-semibold.mb-2 {
        color: #000;
    font-weight: 600;
    text-transform: capitalize;
    letter-spacing: 0px;
    font-size: 20px;
}

.marquee-item {
  flex: 0 0 auto;
  width: 300px; /* Fixed width ensures no wrapping */
}
.cs_our_services_wrapper h5 {
    color: #cf2224;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 3px;
    text-transform: uppercase;
}

@keyframes marqueeScroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

.pricing-card {
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 8px 30px rgb(138 138 157 / 25%);
  padding: 30px 25px;
  transition: all 0.3s ease;
  height: 100%;
}

.pricing-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.1);
}

.pricing-card h4 {
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 15px;
  color: #cf2224;
}

.pricing-card ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.pricing-card ul li {
  padding: 10px 0;
  border-bottom: 1px solid #eee;
  font-size: 15px;
  color: #333;
}

.cs_table_heading h3 {
  color: #cf2224;
  font-size: 18px;
  text-transform: uppercase;
  letter-spacing: 2px;
  margin-bottom: 10px;
}

.cs_table_heading h1 {
  font-size: 32px;
  font-weight: bold;
  color: #333;
}

.who_we_tab ul.nav.nav-tabs.nav-pills li {
    display: flex;
    gap: 20px;
}


.cs_mission_vision_wrapper .feature-box {
  background: #fff;
  padding: 15px 20px;
  border-radius: 10px;
  box-shadow: 0 2px 12px rgba(0,0,0,0.05);
  transition: all 0.3s ease-in-out;
}

.cs_mission_vision_wrapper .feature-box:hover {
  transform: translateY(-5px);
  box-shadow: 0 6px 20px rgba(0,0,0,0.1);
}

.cs_mission_vision_wrapper .icon-box {
  background: linear-gradient(135deg, #cc2223, #164384);
  color: #fff;
  font-size: 22px;
  padding: 12px;
  border-radius: 8px;
  min-width: 48px;
  text-align: center;
}

.cs_mission_vision_wrapper .feature-title {
  margin: 0;
  font-size: 18px;
  font-weight: 600;
}

.cs_mission_vision_wrapper .feature-text {
  font-size: 14px;
  color: #555;
    }


.cs_banner_text {
  max-width: 600px;
  color: white;
}




.hero-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 50px;
}

.badge{
  display: inline-block;
  padding: 9px 17px !important;
  background: rgba(255,255,255,0.1);
  border-radius: 30px;
  font-size: 13px;
  margin-bottom: 15px;
      letter-spacing: 1px;
}

.hero-content h1{
  font-size: 52px;
  line-height: 1.1;
  color: #fff;
      font-weight: 700;
}

.hero-content h1 span{
  color: #d02b2e;
      font-weight: 700;
}

.hero-content p{
  margin-top: 15px;
  color: #cbd5e1;
}

.hero-actions{
  margin-top: 25px;
  display: flex;
  gap: 15px;
}

.btn-primary{
  padding: 12px 22px;
  background: #d02b2e;
  color: #ffffff;
  border-radius: 8px;
  text-decoration: none;
  font-weight: 600;
}

.btn-primary:hover{
  padding: 12px 22px;
  background: #ffffff;
  color: #d02b2e;
  border-radius: 8px;
  text-decoration: none;
  font-weight: 600;
}


.btn-outline{
     padding: 12px 22px;
    color: #33578d !important;
    background: #ffffff;
    border-radius: 8px;
    text-decoration: none;
}

.btn-outline:hover{
  padding: 12px 22px;
  color: #ffffff !important;
  background: #33578d !important;

  border-radius: 8px;
  text-decoration: none;
}

.hero-stats{
  margin-top: 35px;
  display: flex;
  gap: 30px;
}

.hero-stats h3{
  margin: 0;
  font-size: 22px;
}

.hero-stats span{
  font-size: 12px;
  color: #94a3b8;
}

/* RIGHT SIDE */
.hero-visual{
  position: relative;
  text-align: center;
}

.truck-card{
  position: relative;
  display: inline-block;
      margin-top: 80%;
}

.hero-content {
       padding: 50px 0px;
}

.truck-main{
  width: 100%;
}



/* animations */
.spin{
  animation: spin 1s linear infinite;
}

@keyframes spin{
  from{transform: rotate(0deg);}
  to{transform: rotate(360deg);}
}

.blink{
  animation: blink 1s infinite;
}

@keyframes blink{
  0%,100%{opacity: 1;}
  50%{opacity: 0.3;}
}

.floating-badge{
  position: absolute;
  background: #fff;
  color: #000;
  padding: 6px 10px;
  font-size: 12px;
  border-radius: 20px;
  box-shadow: 0 10px 20px rgba(0,0,0,0.2);
}

.b1{ top: 20px; right: 0; }
.b2{ bottom: 40px; left: 0; }

/* responsive */
@media(max-width: 991px){
  .hero-grid{
    grid-template-columns: 1fr;
    text-align: center;
  }

  .hero-actions, .hero-stats{
    justify-content: center;
  }
}



.cs_banner_text h1 span {
  color: #cc2220;
}

.cs_banner_image {
  position: relative;
  animation: scaleIn 1.5s ease forwards;
  transform: translateX(100px);
}
.truck-img {
  width: 400px;
  position: relative;
  z-index: 2;
  margin-top: 210px;
}

/* Light blinking */
.truck-light {
     position: absolute;
    top: 60%;
    left: -68%;
    width: 75%;
}

.blink-image {
  animation: blink 1s infinite;
}

/* Optional: Rotating wheels */
.wheel {
      position: absolute;
    width: 50px;
    height: 50px;
    z-index: 2;

}

.wheel1 {
      bottom: 13px;
    left: 54px;
}

span.truck-light {
    top: 83%;
    left: -108%;
}

span.wheel.wheel3 {
    margin-top: 85%;
    left: 180px;
}

.wheel2 {
        bottom: 11px;
    left: 328px;
}

.spin-wheel {
  width: 100%;
  animation: spin 1s linear infinite;
}

/* Animations */
@keyframes blink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0; }
}

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

.moving-bg {
  background: url('images/bg-large2.jpg') repeat-x;
  background-size: cover;
  animation: bgScrollReverse 40s linear infinite;
}

@keyframes bgScrollReverse {
  0% {
    background-position: -10000px 0;
  }
  100% {
    background-position: 0 0;
  }
}

i.fa-solid.fa-phone-volume:before{
        content: "\f095";
    font-family: 'FontAwesome';
}


.cs_contact_box i.fa-solid {
    background: linear-gradient(135deg, #cc2223, #164384);
    color: #fff;
    font-size: 22px;
    padding: 12px;
    border-radius: 8px;
    min-width: 48px;
}


/* Section */
/* Card base */
.cargo-card {
    background: #fff;
    border-radius: 14px;
    padding: 25px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 8px 25px rgba(0,0,0,0.05);
    transition: all 0.4s ease;
    width: 400px;
        margin-bottom: 60px;
}


.cargo-grid {
    display: flex;
    gap: 20px;
}

.cargo-list .row span {
    width: 70%;
}

.cargo-list .row strong {
    width: 30%;
}

/* left accent */
.cargo-card::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 4px;
    height: 100%;
    background: linear-gradient(180deg, #cc2223, #164384);
}

/* ✨ overlay layer */
.cargo-card::after {
    content: "";
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(204,34,35,0.12), rgba(22,67,132,0.12));
    transition: 0.5s ease;
}

.cargo-card.hightlight {
    background: linear-gradient(135deg, rgba(204,34,35,0.12), rgba(22,67,132,0.12));
    border-radius: 14px;
    padding: 25px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 8px 25px rgba(0,0,0,0.05);
    transition: all 0.4s ease;
    width: 400px;
        margin-bottom: 60px;
}

/* hover card */
.cargo-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 22px 60px rgba(0,0,0,0.15);
}

/* overlay slide in */
.cargo-card:hover::after {
    left: 0;
}

/* title animation */
.cargo-card h4 {
    position: relative;
    transition: 0.4s ease;
    font-weight: 600;
    color: #164384;
    margin-bottom: 20px;
}

.cargo-card:hover h4 {
    letter-spacing: 1px;
    color: #cc2223;
    transform: translateX(6px);
}

/* rows */
.cargo-list .row {
    display: flex;
    justify-content: space-between;
    padding: 10px 0;
    border-bottom: 1px solid #eee;
    position: relative;
    transition: 0.3s ease;
    z-index: 1;
}

/* row hover effect */
.cargo-list .row:hover {
    transform: translateX(10px);
    color: #cc2223;
}

/* price highlight */
.cargo-list .row:hover strong {
    color: #164384;
}
/* blog section css  */
.blog-style-section {
  padding: 80px 0;
  background: #f4f4f4;
}

/* CARD */
.blog-card-style {
  background: #fff;
  border-radius: 6px;
  overflow: hidden;
  transition: 0.3s;
  box-shadow: 0 5px 20px rgba(0,0,0,0.05);
}

.blog-card-style:hover {
  transform: translateY(-8px);
}

/* IMAGE */
.blog-img-style {
  position: relative;
}

.blog-img-style img {
  width: 100%;
  height: 220px;
  object-fit: cover;
}

/* DATE BOX */
.blog-date-box {
  position: absolute;
  bottom: -51px;
  right: 20px;
  background: #cf2c2b;
  color: #fff;
  width: 70px;
  text-align: center;
  font-weight: 600;
  padding: 12px 5px;
  z-index: 2;
}

/* DATE TEXT */
.blog-date-box .date {
  display: block;
  font-size: 22px;
  line-height: 1;
}

.blog-date-box .month {
  font-size: 12px;
  letter-spacing: 1px;
}

/* 🔥 CORNER CUT (IMPORTANT PART) */
.blog-date-box::after {
  position: absolute;
    top: 0px;
    left: -15px;
    width: 15px;
    border-bottom: 20px solid #9c0d11;
    border-left: 15px solid transparent;
    border-right: 0px solid transparent;
    transition: all 200ms linear;
    transition-delay: 0.1s;
    content: "";
}

/* CONTENT */
.blog-content-style {
  padding: 15px 20px 20px;
}

/* META */
.blog-meta-style {
  display: flex;
    gap: 15px;
    font-size: 13px;
    color: #777;
    margin-bottom: 17px;
    border-bottom: 1px solid #bdb8b8;
    padding-bottom: 16px
}

.blog-meta-style i {
  color: #cf2c2b;
  margin-right: 5px;
}

/* TITLE */
.blog-content-style h3 {
  font-size: 18px;
  margin-bottom: 10px;
}

.blog-content-style h3 a {
  color: #0c2e60;
  text-decoration: none;
  font-weight: 600;
  line-height: 26px;
}

.blog-content-style h3 a:hover {
  color: #cf2c2b;
}

/* TEXT */
.blog-content-style p {
  font-size: 14px;
  color: #666;
  line-height: 1.6;
}

/* BUTTON */
.blog-btn-style {
  display: inline-block;
  margin-top: 15px;
  padding: 10px 18px;
  background: #cf2c2b;
  color: #fff;
  text-decoration: none;
  border-radius: 5px;
  font-size: 14px;
  transition: 0.3s;
}

.blog-btn-style:hover {
  background: #0c2e60;
      color: #fff;
}

/* RESPONSIVE */
@media(max-width:768px){
  .blog-img-style img {
    height: 200px;
  }
}



.logistics-section{
  background: #f7f9fc;
  position: relative;
  
}

/* WRAPPER */


/* IMAGE BOX */
.image-box{
  position: relative;
}

/* MAIN IMAGE */
.img-main{
  width: 100%;
  border-radius: 18px;
  box-shadow: 0 20px 40px rgba(0,0,0,0.15);
}

/* OVERLAY IMAGE */
.img-overlay{
  position: absolute;
  bottom: 0;
  right: 0;
  width: 180px;
  height: 180px;
  object-fit: cover;
  border-radius: 15px;
  border: 6px solid #fff;
  box-shadow: 0 15px 30px rgba(0,0,0,0.2);
}

/* BADGE */
.since-badge{
  position: absolute;
  top: 30px;
  left: 30px;
  background: #cd2222;
  color: #fff;
  padding: 10px 18px;
  font-weight: 600;
  border-radius: 30px;
  font-size: 14px;
  box-shadow: 0 10px 20px rgb(49 48 47 / 30%);
}

/* CONTENT */
.content-box{
  padding: 20px;
}

.sub-title{
  color: #cd2222;
  font-weight: 600;
  letter-spacing: 1px;
  margin-bottom: 10px;
}

.main-title{
  font-size: 32px;
  font-weight: 700;
  color: #1c1c1c;
  margin-bottom: 15px;
}

.desc{
  color: #666;
  line-height: 1.7;
  margin-bottom: 20px;
}

/* FEATURE LIST */
.feature-list{
  list-style: none;
  padding: 0;
  margin: 0 0 25px;
}

.feature-list li{
  position: relative;
  margin-bottom: 12px;
  color: #444;
  padding: 10px;
    border-radius: 5px;
    box-shadow: 0 0 21px -4px #6a6a6a1c !important;
}

.feature-list li i {
    color: #144482;
    padding-right: 5px;
}

/* CONTACT CARD */
.contact-card{
  display: flex;
  align-items: center;
  gap: 15px;
  background: #fff;
  padding: 15px 20px;
  border-radius: 12px;
  box-shadow: 0 10px 25px rgba(0,0,0,0.08);
  width: fit-content;
}

.contact-card i{
  font-size: 22px;
  color: #cf2c2b;
}

.contact-card span{
  display: block;
  font-size: 13px;
  color: #777;
}

.contact-card a{
  font-size: 16px;
  font-weight: 600;
  color: #1c1c1c;
  text-decoration: none;
}

/* RESPONSIVE */
@media (max-width: 768px){
  .img-main{
    height: 320px;
  }

  .img-overlay{
    width: 140px;
    height: 140px;
  }

  .main-title{
    font-size: 26px;
  }
}

.ed_pagetitle{
  position: relative;
  background: url('images/bg-image.png') center/cover no-repeat;
  padding: 100px 0;
  color: #fff;
  text-align: center;
}

/* DARK OVERLAY */
.ed_img_overlay{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(120deg, rgb(0 0 0 / 61%), rgb(21 68 132 / 61%));
}

/* TITLE */
.page_title{
  position: relative;
  z-index: 2;
}

.page_title h2{
  font-size: 42px;
  font-weight: 700;
  margin-bottom: 10px;
  letter-spacing: 1px;
}

.page_title p{
  font-size: 16px;
  color: rgba(255,255,255,0.85);
  margin-bottom: 20px;
}

/* BREADCRUMB */
.breadcrumb{
  position: relative;
  z-index: 2;
  justify-content: center;
  background: transparent;
  margin: 0;
  padding: 0;
  list-style: none;
}

.breadcrumb li{
  display: inline-block;
  color: rgba(255,255,255,0.8);
  font-size: 14px;
  margin: 0 5px;
}

.breadcrumb li a{
  color: #fff;
  text-decoration: none;
  font-weight: 500;
  transition: 0.3s;
}

.breadcrumb li a:hover{
  color: #cd2222;
}

.breadcrumb li.active{
  color: #cd2222;
  font-weight: 600;
}

/* RESPONSIVE */
@media(max-width: 768px){
  .page_title h2{
    font-size: 30px;
  }

  .ed_pagetitle{
    padding: 70px 0;
  }
}

/* HIDE ON DESKTOP */
.toggle{
  display: none;
  font-size: 24px;
  cursor: pointer;
}

/* OVERLAY */
.menu-overlay{
  position: fixed;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background: rgba(0,0,0,0.6);
  opacity: 0;
  visibility: hidden;
  transition: 0.3s;
  z-index: 998;
}

/* SIDEBAR MENU */
.mobile-menu{
  position: fixed;
  top: 0;
  left: -300px;
  width: 280px;
  height: 100%;
  background: #fff;
  box-shadow: 10px 0 30px rgba(0,0,0,0.2);
  transition: 0.4s;
  z-index: 999;
  padding: 20px;
}

/* ACTIVE STATE */
.mobile-menu.active{
  left: 0;
}

.menu-overlay.active{
  opacity: 1;
  visibility: visible;
}

/* HEADER */
.menu-header{
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}

.menu-header h4{
  margin: 0;
}

/* MENU LIST */
.mobile-menu ul{
  list-style: none;
  padding: 0;
  margin: 0;
}

.mobile-menu ul li{
  margin-bottom: 15px;
  position: relative;
}

.mobile-menu ul li a{
  text-decoration: none;
  color: #333;
  font-weight: 500;
  display: block;
  transition: 0.3s;
}

.mobile-menu ul li a:hover{
  color: #cf2c2b;
  padding-left: 5px;
}

/* SUB MENU */
.sub-menu{
  display: none;
  padding-left: 15px;
  margin-top: 10px;
}

.has-sub.active .sub-menu{
  display: block;
}

/* RESPONSIVE */
@media(max-width:768px){
  .toggle{
    display: block;
  }
}



@media (max-width: 576px)
{

    .cs_banner_text h5 {
        font-size: 14px !important;
        letter-spacing: 1px;
        line-height: 24px;
    }

.wheel1 {
    bottom: -20px !important;
    left: 20px !important;
}
.wheel2 {
    bottom: -20px !important;
    left: 126px !important;
}
.wheel {
    position: absolute;
    width: 22px !important;
    height: 45px;
    z-index: 2;
}

.pro-choose-section {
    padding: 0px 0 !important;
    background: #fff;
}

.pro-icon {
    width: 65px !important;
    height: 50px;
    background: linear-gradient(135deg, #cc2223, #164384);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    margin-right: 15px;
    transition: 0.4s;
}

.pro-service-header h1 {
    color: #164384;
    font-size: 23px;
    font-weight: 700;
}

.testimonial {
    padding-top: 40px;
}

.cargo-grid {
    display: block !important;
    gap: 20px;
}

.plx-counter {
    padding: 50px 0 !important;
    background: url(images/baner.jpg) center / cover no-repeat;
    position: relative;
    color: #fff;
    margin-bottom: 30px;
}

.blog-modern-heading h2 {
    color: #144384;
    font-size: 25px !important;
    font-weight: 700;
}

.equal-contact {
    position: relative;
    padding: 10px 0 !important;
    background: #f5f8ff;
    overflow: hidden;
    
}

}
.testimonial-modern {
  padding: 80px 0;
  background: #f7f8fa;
}

/* LEFT */
.testimonial-left h2 span {
  color: #cf2c2b;
}

/* SLIDER */
.slider-wrapper {
  overflow: hidden;
}

.custom-slider {
  display: flex;
}

/* SLIDE */
.slide {
  flex: 0 0 50%;
  padding: 10px;
  box-sizing: border-box;
}

/* CARD */
.testimonial-card {
  background: #fff;
  padding: 25px 25px 0px;
  border-radius: 10px;
  height: 100%;
  box-shadow: 0 5px 20px rgba(0,0,0,0.05);
}

.testimonial-card .top {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}

.testimonial-card p
 {
    color: #656565;
    font-size: 15px;
}

.testimonial-left p {
    color: #6c6363;
}

.testimonial-left h2 {
    font-size: 35px;
    font-weight: 700;
}


.testimonial-card img {
  width: 55px;
  height: 55px;
  border-radius: 50%;
  margin-right: 10px;
  border: 2px solid #cf2c2b;
}

/* RATING */
.rating {
  margin-top: 10px;
  background: #cf2c2b;
  color: #fff;
  display: inline-block;
  padding: 4px 10px;
  position: relative;
}

.rating::after {
  position: absolute;
    top: 16px;
    right: -15px;
    width: 15px;
    border-top: 15px solid #a94020;
    border-left: 0px solid transparent;
    border-right: 15px solid transparent;
    content: "";
}

/* ARROWS */
.slider-controls {
  position: absolute;
  top: -50px;
  right: 0;
  z-index: 10;
}

.slider-controls button {
  width: 45px;
  height: 45px;
  border: none;
  background: #cf2c2b;
  color: #fff;
  border-radius: 50%;
  margin-left: 10px;
  cursor: pointer;
}

.slider-controls button:hover {
  background: #000;
}

/* MOBILE */
@media(max-width:992px){
  .slide {
    flex: 0 0 100%;
  }
}

/* SECTION BG */
.why-choose {
  position: relative;
  padding: 100px 0;
  overflow: hidden;
}

/* Background Image Layer */
.why-choose::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url('images/map1.png') no-repeat center;
  background-size: cover;
  opacity: 20; /* 🔥 control image opacity here */
  z-index: -2;
}

/* Gradient Overlay */
.why-choose::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(rgba(20,67,132,0.8), rgba(208,44,43,0.7));
  z-index: -1;
}
/* LEFT */
.left-content .tag {
  color: #fff;
  letter-spacing: 2px;
  font-size: 14px;
}

.left-content h2 {
  color: #fff;
  font-size: 40px;
  margin: 20px 0;
      font-weight: 700;
}

.left-content h2 span {
  color: #d02c2b;
}

.left-content ul {
  list-style: none;
  padding: 0;
}

.left-content ul li {
  color: #eee;
  margin-bottom: 10px;
  padding-left: 25px;
  position: relative;
}

.left-content ul li::before {
  content: "✈";
  position: absolute;
  left: 0;
  color: #d02c2b;
}

/* CONTACT INFO */
.contact-info {
  margin-top: 30px;
}

.info-box {
  display: flex;
  align-items: center;
  background: rgb(255 225 225 / 28%);
  padding: 15px;
  border-radius: 8px;
  margin-bottom: 15px;
  transition: 0.3s;
}

.info-box:hover {
  background: rgba(255,255,255,0.2);
  transform: translateY(-3px);
}

.info-box .icon {
  width: 45px;
  height: 45px;
  background: #d02c2b;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  margin-right: 15px;
}

.info-box h5 {
  margin: 0;
  color: #fff;
}

.info-box p {
  margin: 0;
  color: #ffffff;
}

/* BUTTON */
.btn-main {
  display: inline-block;
  background: #d02c2b;
  color: #fff;
  padding: 12px 25px;
  border-radius: 5px;
  text-decoration: none;
  border: none;
  margin-top: 20px;
}

/* FORM */
.quote-form {
  background: #fff;
  padding: 30px;
  border-radius: 10px;
}

.quote-form h3 {
  margin-bottom: 20px;
      font-weight: 700;
    color: #144384;
}

.quote-form input,
.quote-form textarea {
  width: 100%;
  padding: 12px;
  margin-bottom: 15px;
  border: 1px solid #ddd;
  border-radius: 5px;
}

.quote-form textarea {
  height: 120px;
  resize: none;
}

/* GRID */
.row {
  display: flex;
  flex-wrap: wrap;
}

.col-lg-6 {
  width: 50%;
  padding: 15px;
}

.col-md-6 {
  width: 50%;
  padding: 5px;
}

.col-12 {
  width: 100%;
}

/* RESPONSIVE */
@media(max-width: 991px){
  .col-lg-6 {
    width: 100%;
  }
  .col-md-6 {
    width: 100%;
  }
}



.logistics-section{
  padding:20px 0 50px;
  background:#fff;
  font-family: Arial, sans-serif;
  animation: sectionFade 1s ease-in-out;
}

@keyframes sectionFade{
  from{opacity:0; transform:translateY(40px);}
  to{opacity:1; transform:translateY(0);}
}

/* LEFT SIDE */
.sub-tag{
  font-size:14px;
  color:#cf2c2b;
  font-weight:600;
  letter-spacing:1px;
  display:inline-block;
  margin-bottom:10px;
}

.logistics-content h2{
  font-size:40px;
  font-weight:800;
  color:#0b1b2b;
  line-height:1.2;
}

.logistics-content h2 span{
  color:#cf2c2b;
}

.logistics-content p{
  color:#666;
  margin-top:15px;
  margin-bottom:20px;
  max-width:520px;
}

/* FEATURES */
.feature-boxes{
  display:flex;
  gap:20px;
  margin-bottom:25px;
  flex-wrap:wrap;
}

.feature-card{
  display:flex;
  gap:12px;
  background:#fff;
  border:1px solid #eee;
  padding:15px;
  width:260px;
  box-shadow:0 10px 25px rgba(0,0,0,0.05);
  border-left:3px solid #cf2c2b;
   transition: all 0.4s ease;
   
}

.feature-card:hover{
  transform: translateY(-8px);
  box-shadow:0 15px 35px rgba(0,0,0,0.12);
  border-left:5px solid #cf2c2b;
}


.feature-card .icon{
  font-size:22px;
  color:#cf2c2b;
   transition: 0.4s ease;
}

.feature-card:hover .icon i{
  color:#164384;
}

.feature-card h4{
  font-size:14px;
  margin:0;
  font-weight:700;
}

.feature-card p{
  font-size:13px;
  margin:5px 0 0;
  color:#777;
}

/* BUTTON + PHONE */
.action-row{
  display:flex;
  align-items:center;
  gap:25px;
  flex-wrap:wrap;
}

.btn-main{
  background:#cf2c2b;
  color:#fff;
  padding:12px 22px;
  text-decoration:none;
  font-weight:600;
  border-radius:4px;
}

.phone-box{
  display:flex;
  align-items:center;
  gap:10px;
}

.phone-icon{
  width:40px;
  height:40px;
  border-radius:50%;
  background:#fff3ec;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#cf2c2b;
}

.phone-box small{
  display:block;
  color:#888;
  font-size:12px;
}

.phone-box h5{
  margin:0;
  font-size:15px;
  font-weight:700;
}


/* RIGHT SIDE */
.logistics-images{
  position:relative;
  text-align:center;
}

.img-main img{
  /* width:100%; */
  border-radius:10px;
  box-shadow:0 20px 40px rgba(0,0,0,0.15);
    transition: 0.6s ease;
}

.logistics-images .img-overlay{
 position: absolute;
    bottom: 11px;
    left: 11px;
    width: 43%;
    border: 8px solid #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.2);
    height: 160px;
      transition: 0.6s ease;
}

.logistics-images:hover .img-main img{
  transform: scale(1.05);
}

.logistics-images:hover .img-overlay img{
  transform: scale(1.1);
}

.img-overlay img{
  width:100%;
  display:block;
}

/* BADGE */
.badge-circle{
  position:absolute;
  right:20px;
  bottom:30px;
  width:120px;
  height:120px;
  border-radius:50%;
  background:#cf2c2b;
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:10px;
  font-size:11px;
  font-weight:600;
  box-shadow:0 10px 20px rgba(0,0,0,0.2);
    animation: pulse 2.5s infinite;
}

.badge-circle strong{
  display:block;
  margin-top:5px;
}

/* RESPONSIVE */
@media(max-width:991px){
  .logistics-content h2{
    font-size:32px;
  }

  .img-main img{
    width:100%;
  }

  .img-overlay{
    width:60%;
  }
}



/* FLEX */
.flex-between{display:flex;justify-content:space-between;align-items:center}

/* TOP BAR */
.topbar{
  background:#1c447f;
  color:#fff;
  padding:10px 0;
  font-size:14px;
}
.top-left{display:flex;gap:25px}
.top-right i{margin-left:10px;cursor:pointer}

/* HEADER */

.header-flex{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0px 0;
}

/* LOGO */
.logo{
  display:flex;
  align-items:center;
  font-weight:600;
  font-size:22px;
}
.logo img{width:100px;margin-right:10px}

.top-left div a {
    color: #fff;
    text-decoration: none;
    font-size: 15px;
    text-transform: lowercase;
}

.right-section a.btn {
    background: linear-gradient(135deg, #cc2223, #164384);
    color: #fff;
        border: 1px;
}

.top-right a {
      color: #fff;
    margin-left: 0px;
    transition: 0.3s;
    text-decoration: none;
}

.top-right a:hover {
  color: #ff5c2c;
}

/* MENU */
.nav ul{
  display:flex;
  list-style:none;
  gap:25px;
      margin-top: 15px;
}
.nav ul li{
  position:relative;
  cursor:pointer;
}
.nav ul li a {
    color: #000;
    text-decoration: none;
    font-weight: 600;
}

.nav ul li.active{color:#cf2c2b; font-weight: 600;}

/* DROPDOWN */
/* PARENT */
.dropdown {
  position: relative;
}

/* SUBMENU DEFAULT HIDDEN */
.submenu {
  position: absolute;
  top: 100%;
  left: 0;
  width: 230px;
  background: #fff;
  box-shadow: 0 5px 15px rgba(0,0,0,0.1);

  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: 0.3s ease;
  z-index: 999;
}

/* SHOW ON HOVER */
.dropdown:hover .submenu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  display: block;
  padding: 0px;
      margin-top: 30px;
}

/* SUBMENU ITEMS */
.submenu li {
  list-style: none;
}

.submenu li a {
  display: block;
  padding: 12px 15px;
  color: #333;
  text-decoration: none;
  border-bottom: 1px solid #eee;
}

.submenu li a:hover {
  background: #f5f5f5;
  color: #cf2c2b;
}

/* RIGHT SECTION */
.right-section{
  display:flex;
  align-items:center;
  gap:20px;
}

.btn{
  background:#cf2c2b;
  color:#fff;
  padding:10px 20px;
  border-radius:5px;
  cursor:pointer;
}

/* MOBILE */
.menu-toggle{display:none;cursor:pointer;font-size:20px}

@media(max-width:991px){
  .nav{
    position:fixed;
    top:0;
    right:-100%;
    width:250px;
    height:100%;
    background:#fff;
    flex-direction:column;
    padding:20px;
    transition:.3s;
  }

  .nav.active{right:0}

  .nav ul{
    flex-direction:column;
    gap:15px;
  }

  .menu-toggle{display:block}
}