body{
    margin: 0;
    padding: 0;
    font-family: 'Plus Jakarta Sans', sans-serif;
}
:root{
    /* font-size  */
    --first-size: 12px;
    --second-size: 14px;
    --third-size: 16px;
    --fourth-size: 18px;
    --fifth-size: 20px;
    --sixth-size: 24px;
    --seventh-size: 32px;
    --eighth-size: 40px;
    --nineth-size: 48px;
    --tenth-size: 56px;
    /* color  */
    --para-grey: #686B76;
    --blue-text: #213164;
    --darkblue-text: #12151F;
}
.fs-12{
    font-size: var(--first-size);
}
.fs-14{
    font-size: var(--second-size);
}
.fs-16{
    font-size: var(--third-size);
}
.fs-18{
    font-size: var(--fourth-size);
}
.fs-20{
    font-size: var(--fifth-size);
}
.fs-24{
    font-size: var(--sixth-size);
}
.fs-32{
    font-size: var(--seventh-size);
}
.fs-40{
    font-size: var(--eighth-size);
}
.fs-48{
    font-size: var(--nineth-size);
}
.fs-56{
    font-size: var(--tenth-size);
}
.para-grey{
    color: var(--para-grey);
}
.blue-text{
    color: var(--blue-text);
}
.darkblue-text{
    color: var(--darkblue-text);
}
.h-banner{
    height: 100vh;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.primary-button{
    background: linear-gradient(338deg, rgba(190,36,52,1) 0%, rgba(33,49,100,1) 100%);
    transition: all 0.3s ease;
}
.primary-button:hover{
    box-shadow: 1px 3px 19px #00000033;
    transform:  scale(1.05);
    transition: all 0.3s ease;
    background: linear-gradient(338deg, rgb(183, 24, 40) 0%, rgb(25, 49, 130) 100%);
}
.banner-arrow-link-text{
    transition: all 0.3s ease;
}
.banner-arrow-link:hover .banner-arrow-link-text{
    margin-left: 5px;
    transition: all 0.3s ease;
}
.gradient-text{
    background: #121FCF;
    background: linear-gradient(to right, #213164 0%, #BE2434 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.h-s2-positon-card{
    transform: rotate(-5.71deg);
    box-shadow: 0px 32px 64px #00000022;
    top: -25px;
}
.h-s2-img{
    width: 420px;
}
.h-s3-card{
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100% 100%;

}
.bg-zoom-effect{
    animation: returnSize 0.5s ease;
}
.bg-zoom-effect:hover {
    animation: changeSize 0.5s ease;
    background-size: 120% 120%; /* Larger size on hover */
}

  @keyframes changeSize {
    from {
      background-size: 100% 100%;
    }
    to {
      background-size: 120% 120%;
    }
  }
  @keyframes returnSize {
    from {
      background-size: 120% 120%;
    }
    to {
      background-size: 100% 100%;
    }
  }
.h-s3-card-btn{
    transition: all 0.3s ease;
}
.h-s3-card-btn:hover{
    background-color: #213164;
    color: #fff;
    transition: all 0.3s ease;
    border: 1px solid transparent !important;
}
.h-s3-card-p{
    min-height: 4.5em;
}
.h-s4-card-div{
    transition: all 0.3s ease;
}
.h-s4-card-div:hover{
    transition: all 0.3s ease;
    box-shadow: 20px 20px 66px 0px #0000000f;
}
.h-s6-card-div{
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    height:450px;
    transition: all 0.5s ease;
}
.h-s6-card-div:hover{
    transform: scale(1.05);
    /* box-shadow: 0px 0px 50px #00000050; */
    transition: all 0.5s ease;
}
.custom-h-effect-border{
    border: 2px solid #fff;
}
.h-s6-card-div-inner{
    transition: all 0.3s ease;
}
.h-s6-card-div-inner:hover{
    filter: drop-shadow(2px 4px 6px rgba(0, 0, 0, 0.7));
    transition: all 0.3s ease;
}
.h-s6-div-badge{
    background-color: #ffffff45;
}
.h-s6-link-card{
    margin-top:145px
}
.h-s6-link-card-h{
    font-weight:800;
    transform:rotate(-90deg)
}
.cta-div{
    background-image: url(../img/cta-bg.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.nav-link{
    transition: all 0.3s ease;
}
.nav-link:hover{
    transition: all 0.3s ease;
    color: var(--blue-text);
}
.ftr-social:hover .ftr-social-fill{
    transition: all 0.3s ease;
    fill: var(--blue-text);
}
.navbar-toggler-res-custom:focus{
    box-shadow: none !important;
}
.btn-close-resp-custom:focus{
    box-shadow: none !important;
}
.dynamic{
    margin-top: 40px;
}
.fixed-nav{
    margin-top: 0px;
    background: linear-gradient(338deg, rgba(190,36,52,1) 0%, rgba(33,49,100,1) 100%);
}
.resp-logo{
    display: none;
}
.resp-logo-d-block{
    display: block;
}
.offcanvas-custom-resp{
    background: linear-gradient(321deg, rgba(190,36,52,1) 0%, rgba(33,49,100,1) 100%);
}
.inner-banner{
    height: 70vh;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.abt-banner-bg{
    background-image: url(../img/abt-banner-bg.png);
}
.abt-s2-card-div{
    border: 1px solid #eaeaea;
    transition: all 0.3s ease;
}
.abt-s2-card-div:hover{
    /* background-color: #2131642b; */
    border: 1px solid transparent;
    transition: all 0.3s ease;
}
.contact-banner-bg{
    background-image: url(../img/contact-banner-bg.png);
}
.cont-link{
    transition: all 0.3s ease;
}
.cont-link:hover{
    color: var(--blue-text) !important;
    text-decoration: underline !important;
    transition: all 0.3s ease;
}
.cont-form-input{
    background-color: #F7F7F7;
    outline: none;
}
.products-banner-bg{
    background-image: url(../img/products-banner-bg.png);
}
.prod-filter-tab-btn{
    background-color: #F4F4F4;
    border: 1px solid #F4F4F4;
    border-bottom: 0;
    cursor: pointer;
    transition: all 0.3s ease;
    width: fit-content;
}
.prod-filter-tab-btn:hover .prod-filter-tab-btn-head{
    background: #121FCF;
    background: linear-gradient(to right, #213164 0%, #BE2434 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    transition: all 0.3s ease;
}
.prod-filter-tab-btn:hover{
    background-color: #fff;
    border: 1px solid #DCDCDC;
    border-bottom: 0;
    transition: all 0.3s ease;
}
.prod-filter-tab-btn-active{
    background-color: #fff;
    border: 1px solid #DCDCDC;
    border-bottom: 0;
}
.prod-filter-tab-btn-active .prod-filter-tab-btn-head{
    background: #121FCF;
    background: linear-gradient(to right, #213164 0%, #BE2434 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.prod-s2-listing-div{
    margin-top: -1px;
    border: 1px solid #DCDCDC;
}
.prod-bed-main-img{
    position: absolute;
    right: 0;
    z-index: -1;
    width: 800px;
    aspect-ratio: 8/3;
    object-fit: cover;
}
.prod-bed-main-img-div{
    height: 296px;
}
.product-img{
    aspect-ratio: 4/3;
    object-fit: cover;
    transition: all 0.5s ease-in-out;
}
.prod-card-text-div{
    background-color: #f4f4f4;
    border: 1px solid #f4f4f4;
}
/* .prod-card-text-head, .prod-card-badge-h100, .prod-card-descr-h100{
    height: 100%;
} */
.prod-card-main-div:hover .product-img{
    transform: scale(1.2);
}
.breadcrumb-active{
    background: #121FCF;
    background: linear-gradient(to right, #213164 0%, #BE2434 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
/* .prod-card-main-single-div:hover .prod-card-single-quickview-btn{
    display: block !important;
} */
.prod-card-main-single-div:hover .product-img-single{
    filter: brightness(0.85);
}
/* .product-quick-modal-close-btn:focus{
    box-shadow: none !important;
} */
.swiper-button-next:after, .swiper-button-prev:after{
    color: #898989;
    background: #fff;
    padding: 10px;
}
.swiper-button-next:after{
    border-bottom-left-radius: 15px;
    border-top-left-radius: 15px;
}
.swiper-button-prev:after{
    border-bottom-right-radius: 15px;
    border-top-right-radius: 15px;
}
.swiper-scrollbar {
    position: unset !important;
}
.swiper-scrollbar > .swiper-scrollbar-drag {
    background: linear-gradient(to right, #213164 0%, #BE2434 100%);
}
.swiper-horizontal>.swiper-scrollbar, .swiper-scrollbar.swiper-scrollbar-horizontal{
    width: 100% !important;
}
.prod-inner-size-btn{
    background-color: #F4F4F4;
}
.prod-inner-size-btn-active{
    background-color: var(--darkblue-text);
    color: #fff;
}
.prod-color-btn{
    width: 40px;
    height: 40px;
}
.prod-color-btn-active{
    border: 1px solid #fff;
    box-shadow: 4px 4px 12px #00000025;
    position: relative;
}
.prod-color-btn-active::after{
    content: '';
    position: absolute;
    width: 17.5px;
    height: 13.41px;
    background-image: url(../img/prod-color-active-tick.png);
    transform: translate(-50%, -50%);
}
.prod-overview-card{
    border: 1px solid #eaeaea;
}
.prod-inner-faqitem-div{
    border-bottom: 1px solid #eaeaea;
}
.primary-button-prod-contact{
    width: 150px;
    height: 50px;
    background: linear-gradient(to right, #213164 0%, #BE2434 100%);
    border-radius: 8px;
}
.primary-button-prod-contact-inside{
    width: calc(100% - 1.8px);
    height: calc(100% - 1.6px);
    border-radius: 7px;
}
.primary-button-prod-contact:hover .primary-button-prod-contact-inside{
    background: linear-gradient(to right, #e9edff 0%, #ffeced 100%);
}
.nav-main-div{
    background-color: #f4f4f4e8;
    backdrop-filter: blur(3px);
    height: 100vh;
    top: 0;
    left: 0;
    transform: translateX(-95%);
    transition: all 0.5s ease-in;
}
.nav-main-div-show{
    transform: translateX(0);
    transition: all 0.5s ease-in;
}
.nav-social{
    transition: all 0.3s ease;
}
.nav-social:hover{
    opacity: 0.8;
    transition: all 0.3s ease;
}

/* toggle-animation  */
.wrapper-menu {
    width: 35px;
    height: 25px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    cursor: pointer;
    transition: transform 330ms ease-out;
  }

  .wrapper-menu.open {
    transform: rotate(-45deg);
    height: 35px;
  }

  .line-menu {
    background-color: var(--darkblue-text);
    border-radius: 25px;
    width: 100%;
    height: 4px;
  }

  .line-menu.half {
    width: 50%;
  }

  .line-menu.start {
    transition: transform 330ms cubic-bezier(0.54, -0.81, 0.57, 0.57);
    transform-origin: right;
  }

  .open .line-menu.start {
    transform: rotate(-90deg) translateX(2px);
  }

  .line-menu.end {
    align-self: flex-end;
    transition: transform 330ms cubic-bezier(0.54, -0.81, 0.57, 0.57);
    transform-origin: left;
  }

  .open .line-menu.end {
    transform: rotate(-90deg) translateX(-2px);
  }


  .background-darkoverlay-banner{
    background: linear-gradient(90deg, rgb(0 0 0 / 70%) 0%, rgba(0,0,0,0.0313375350140056) 100%);
  }
  .background-darkoverlay-h-categ{
    background: linear-gradient(180deg, rgb(0 0 0 / 50%) 0%, rgba(0,0,0,0) 50%, rgb(0 0 0 / 50%) 100%);
  }

  .text-truncate-3{
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .h-s3-card-h{
    height: 100%;
  }
  .h-ban-title{
    max-width: 75%;
  }
  .h-s3-card-inner-div-even{
    aspect-ratio: 1/1;
  }
  .h-s3-card-inner-div-odd{
    aspect-ratio: 2/1;
  }