body{
    /* overflow-y: hidden; */
    width: auto !important;
    font-family: 'Neue Montreal' !important;
}
body::-webkit-scrollbar { 
    width: 5px;
    display: none;
}
  body::-webkit-scrollbar-track {background: #fff;}
  body::-webkit-scrollbar-thumb {background: #B5975B;}
  body::-moz-scrollbar { width: 8px;}
  body::-moz-scrollbar-track {background: #fff;}
  body::-moz-scrollbar-thumb {background: #B5975B;}
  body::-o-scrollbar { width: 8px;}
  body::-o-scrollbar-track {background: #fff;}
  body::-o-scrollbar-thumb {background: #B5975B;}
  body::-ms-scrollbar { width: 8px;}
  body::-ms-scrollbar-track {background: #fff;}
  body::-ms-scrollbar-thumb {background: #B5975B;}

  @font-face {
    font-family: 'Neue Montreal';
    src: url('../fonts/NeueMontreal-Regular.eot');
    src: url('../fonts/NeueMontreal-Regulard41d.eot?#iefix') format('embedded-opentype'),
        url('../fonts/NeueMontreal-Regular.woff2') format('woff2'),
        url('../fonts/NeueMontreal-Regular.woff') format('woff'),
        url('../fonts/NeueMontreal-Regular.ttf') format('truetype'),
        url('../fonts/NeueMontreal-Regular.svg#NeueMontreal-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
section{
    background: #000;
}
@font-face {
    font-family: 'Neue Montreal';
    src: url('../fonts/NeueMontreal-Medium.eot');
    src: url('../fonts/NeueMontreal-Mediumd41d.eot?#iefix') format('embedded-opentype'),
        url('../fonts/NeueMontreal-Medium.woff2') format('woff2'),
        url('../fonts/NeueMontreal-Medium.woff') format('woff'),
        url('../fonts/NeueMontreal-Medium.ttf') format('truetype'),
        url('../fonts/NeueMontreal-Medium.svg#NeueMontreal-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Neue Montreal';
    src: url('../fonts/NeueMontreal-Light.eot');
    src: url('../fonts/NeueMontreal-Lightd41d.eot?#iefix') format('embedded-opentype'),
        url('../fonts/NeueMontreal-Light.woff2') format('woff2'),
        url('../fonts/NeueMontreal-Light.woff') format('woff'),
        url('../fonts/NeueMontreal-Light.ttf') format('truetype'),
        url('../fonts/NeueMontreal-Light.svg#NeueMontreal-Light') format('svg');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Neue Montreal';
    src: url('../fonts/NeueMontreal-Bold.eot');
    src: url('../fonts/NeueMontreal-Boldd41d.eot?#iefix') format('embedded-opentype'),
        url('../fonts/NeueMontreal-Bold.woff2') format('woff2'),
        url('../fonts/NeueMontreal-Bold.woff') format('woff'),
        url('../fonts/NeueMontreal-Bold.ttf') format('truetype'),
        url('../fonts/NeueMontreal-Bold.svg#NeueMontreal-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Inter';
    src: url('../fonts/Inter-Regular.eot');
    src: url('../fonts/Inter-Regulard41d.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Inter-Regular.woff2') format('woff2'),
        url('../fonts/Inter-Regular.woff') format('woff'),
        url('../fonts/Inter-Regular.ttf') format('truetype'),
        url('../fonts/Inter-Regular.svg#Inter-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Inter';
    src: url('../fonts/Inter-Light.eot');
    src: url('../fonts/Inter-Lightd41d.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Inter-Light.woff2') format('woff2'),
        url('../fonts/Inter-Light.woff') format('woff'),
        url('../fonts/Inter-Light.ttf') format('truetype'),
        url('../fonts/Inter-Light.svg#Inter-Light') format('svg');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}
/* p{
    font-family: 'Inter' !important;
    font-weight: 300 !important; 
} */
.main-container{
    margin: 0 50px;
}
/* header */
header{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 99;
    background: #000;
}
/* header.smaller {
    top: 0px;
    position: fixed;
    width: 100%;
    z-index: 99;
    background: #181818;
    box-shadow: 0px 3px 6px #00000029;
    transition: 0.5s;
    border-bottom: none;
} */
.navbar-brand{
    width: 155px;
}
.navbar-expand-lg .navbar-collapse{
    justify-content: end;
    padding-right: 40px;
}
.navbar-expand-lg .navbar-nav .nav-link{
    color: #fff;
    font-weight: normal !important;
    font-size: 15px !important;
    padding: 15px 0px;
    transition: 0.5s;
    margin: 0 25px;
    text-transform: unset;
}
.navbar-expand-lg .navbar-nav .nav-link:hover{
    color: #ff5314 !important;
    transition: 0.5s;
}
.navbar-light .navbar-nav .active>.nav-link{
    color: #ff5314 !important;
    transition: 0.5s;
}
.navbar-light .navbar-nav .nav-link:focus{
    color: #ff5314 !important;
    transition: 0.5s;
}
.navbar{
   padding-left: 0;
   padding-right: 0;
}
/*-- Underline From Center --*/
.hvr-underline-from-center { 
    display: inline-block; 
    vertical-align: middle; 
    -webkit-transform: perspective(1px) translateZ(0); 
    transform: perspective(1px) translateZ(0); 
    box-shadow: 0 0 1px rgba(0, 0, 0, 0); 
    position: relative; 
    overflow: hidden; 
}
.hvr-underline-from-center:before { 
    content: ""; 
    position: absolute; 
    left: 51%; 
    right: 51%; 
    bottom: 0; 
    background: #ff5314; 
    height: 3px; 
    -webkit-transition-property: left, right; 
    transition-property: left, right; 
    -webkit-transition-duration: 0.3s; 
    transition-duration: 0.3s; 
    -webkit-transition-timing-function: ease-out; 
    transition-timing-function: ease-out; 
}
.hvr-underline-from-center:hover:before, 
.hvr-underline-from-center:focus:before, 
.hvr-underline-from-center:active:before{   
    left: 0; 
    right: 0; 
}
.desk-top-menu{
    position: relative;
}
/* nav-bar-start */
.head-menu{
    position: absolute;
    right: 0;
    top: 31px;
}
.menu-icon {
    cursor: pointer !important;
    transition:0.5s;
}
.m-tags li{
    list-style: none;
    padding-left: 0;
    padding-bottom: 10px;
}
#megaMenu{
    cursor: pointer;
}
.overlay-close {
    position: fixed;
    z-index: 999;
    top: 50px;
    right: 50px;
    display: inline;
    width: 40px;
    height: 40px;
    border: 3px solid #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}
.loan-bullet li {
  list-style: none;
  position: relative;
  padding-left: 15px;
  padding-bottom: 10px;
}
.loan-bullet li::before
{
    position: absolute;
  content: '';
  background: #14097A;
  width: 6px;
  height: 6px;
  left: 0;
  top: 9px;
  border-radius: 50%;
}
.overlay-menu {
    background-color: #000;
    color: #fff;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow-y: auto;
    transition: all 0.5s;
    z-index: -1;
    -webkit-overflow-scrolling: touch;
    padding: 20px;
    opacity: 0;
    visibility: hidden;
    overflow-x: hidden;
}
.overlay-menu.active {
    z-index: 99999;
    opacity: 1;
    visibility: visible;
}
.overlay-close i {
    font-size: 20px;
    color: #fff;
    float: right;
    cursor: pointer;
}
.menu-container {
    width: 100%;
    height: 100%;
    padding: 50px;
    overflow: hidden;
    overflow-y: auto;
    position: relative;
    border-radius: 20px;
    background: #141414;
    border: 0.5px solid #303030;
    padding: 40px;
    scrollbar-width: none;
}
.m-contents {
    transition: 0.5s;
    opacity: 0;
    transform: translateY(20px);
}
.overlay-menu.active .m-contents {
    transition: 0.5s;
    opacity: 1;
    transform: translateY(0);
}
.mlinks-bx {
    padding-top: 40px;
}
.m-contact h4::before {
    font-family: "FontAwesome";
    position: absolute;
    left: -20px;
    content: "\f041";
    color: #fff;
}
.m-header h2 {
    font-size: 25px;
    position: relative;
    display: inline-block;
    padding-bottom: 10px;
    margin-bottom: 20px;
    font-weight: normal;
}
.m-header h2::before {
    content: "";
    background-color: #ff5314;
    width: 60%;
    height: 1px;
    position: absolute;
    bottom: 0;
    left: 0;
}
.m-contact {
    padding-left: 20px;
    display: flex;
    flex-direction: column;
    gap: 30px;
}
.m-contact h4 {
    font-size: 22px;
    position: relative;
}
.m-contact p {
    font-size: 15px;
    margin: 0;
    line-height: 25px;
}
.m-tags {
    padding-top: 0px;
}
.m-tags ul{
    padding: 0;
    margin: 0;
}
.m-links a {
    font-size: 15px;
    color: #fff;
    margin-bottom: 10px;
    transition: 0.5s;
    text-decoration: none;
}
.m-links a:hover {
    padding-left: 5px;
    transition: 0.5s;
    color: #ff5314;
}
.m-medias {
    align-items: center;
    gap: 30px;
}
.m-medias a i {
    color: #fff;
    font-size: 19px;
    transition: 0.5s;
}
.footer-social ul{
    margin: 0;
    padding: 0;
}
.footer-social li{
    display: inline-block;
    padding: 0 10px;
}
.footer-social img{
   width: 13px;
}
/* nav-bar-end */
.book-call{
    display: none;
}
.desk-top-menu .dropdown .dropbtn {
    font-size: 16px;
    border: none;
    outline: none;
    color: white;
    background-color: inherit;
    font: inherit;
    cursor: pointer;
    display: flex;
    align-items: center;
    font-weight: 500;
    font-size: 15px;
    z-index: 9;
    position: relative;
    padding: 0;
}
.desk-top-menu .dropdown-content {
    display: none;
    position: absolute;
    background-color: #192544 !important;
    width: 220px;
    left: 0;
    box-shadow: 0px 8px 16px 0px rgb(0 0 0 / 20%);
    z-index: 999;
    border-radius: 10px;
    overflow: hidden;
    top: 100%;
    transition: 0.5s;
}
.desk-top-menu .dropdown:hover .dropdown-content {
    display: block;
    background: #ddd !important;
    border: 1px solid #CA252B;
    border-radius: 0;
    transition: 0.5s;
}
.desk-top-menu .dropdown:hover .dropdown-content .col-lg-6 :is(.main-col1, #col1) {
    display: none;
}
.desk-top-menu .column {
    float: none;
    width: 100%;
    padding: 10px;
    height: 100%;
    padding-right: 0;
}
.desk-top-menu .column a {
    float: none;
    color: black;
    padding: 6px;
    text-decoration: none;
    display: block;
    text-align: left;
    font-size: 14px;
}
.desk-top-menu i {
    color: #CA252B;
    padding-right: 10px;
    font-size: 11px;
}

.desk-top-menu .bg-color a:hover {
    background: #CA252B !important;
    color: #fff;
}
/* banner */
.social-link ul{
    padding: 0;
    margin: 0;
}
.serch-box{
    display: none;
}
.phone-menu{
    display: none;
}
.phone-video{
    display: none;
}
.social-link li{
    list-style: none;
    display: inline-block;
    padding: 0 10px;
}
.social-link li:first-child{
    padding-left: 0;
}
.social-link a{
    color: #fff;
    font-size: 18px;
    text-decoration: none;
    transition: 0.5s;
}
.social-link a:hover{
    color: #ff5314;
    transition: 0.5s;
}
.social-link {
    padding-top: 20px;
}
.scrool-down {
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    position: absolute;
    left: 25px;
    bottom: 110px;
    z-index: 9;
    writing-mode: tb;
    color: #fff;
    margin: 0;
    /* height: 100%; */
    padding-top: 45px;
}
.scrool-down h6 {
    margin: 0;
    font-size: 14px;
    color: #fff;
    margin-top: 65px;
    position: relative;
    left: -18px;
    font-weight: normal;
}
.aroow-img-down {
    position: relative;
    transform: translatey(0px);
    animation: updown 5s ease-in-out infinite;
}
@keyframes updown {
    0% {
      transform: translatey(0px);
    }
    50% {
      transform: translatey(-10px);
    }
    100% {
      transform: translatey(0px);
    }
}
.scrool-down img {
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    position: relative;
    writing-mode: tb;
}
.aroow-img-down::after {
    position: absolute;
    content: '';
    background: #ff5314a6;
    width: 26px;
    height: 26px;
    left: 2px;
    top: -7px;
    border-radius: 50%;
}
.banner{
    position: relative;
}
@media (min-aspect-ratio: 16/9) {
    .back-video {
        width: 100%;
        height: auto;
    }
}

@media (max-aspect-ratio: 16/9) {
    .back-video {
        width: auto;
        height: 100%;
    }
}
.vedio-banner{
    height: 670px;
    overflow: hidden;
    box-shadow: 0px 3px 6px #00000029;
    position: relative;
}
.banner-text{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, 10%);
    width: 100%;
    padding-left: 60px;
}
.banner-text span{
    color: #ff5314;
}
.banner-text h2{
    color: #fff;
    font-weight: normal;
    font-size: 40px;
    padding-bottom: 10px;
}
.banner-text p{
    font-size: 16px;
    color: #fff;
    font-weight: normal;
    margin: 0;
    padding-right: 52%;
}
.round-box-text{
    width: 265px;
    height: 265px;
    position: absolute;
    right: 50px;
    top: 50%;
    background: #ff5314;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px;
    flex-direction: column;
}
.round-all-content{
    width: 100%;
    height: 100%;
    border: 1px solid #ffffff94;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding: 17px;
}
.round-box-text h4{
    font-size: 18px;
    color: #fff;
    font-weight: normal;
    text-align: center;
    padding-bottom: 10px;
}
.banner a{
    text-decoration: none;
    transition: 0.5s;
}
.banner a:hover{
    transform: translateY(-5px);
    transition: 0.5s;
}
.round-box-text p{
    color: #000;
    text-align: center;
    font-size: 13px;
    font-weight: normal;
    position: relative;
    margin: 0;
}
.round-box-text p::after{
    position: absolute;
    content: '';
    background: #fff;
    width: 85px;
    height: 3px;
    bottom: -15px;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-clip-path: polygon(0% 0,100% 0,93% 100%,0 100%);
    clip-path: polygon(0% 0,100% 0,93% 100%,0 100%);
    border-top-right-radius: 10px;
}
.banner{
    background: #000;
}
.vedio-banner::before{
    position: absolute;
    content: '';
    background: #0000008f;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
}
.out-box{
    color: #ff5314;
    display: inline-block;
    position: relative;
    top: -25px;
    font-weight: normal;
}
.banner-btn a{
    background: #ff5314;
    padding: 10px 25px;
    font-weight: normal;
    text-decoration: none;
    color: #fff;
    font-size: 16px;
    transition: 0.5s;
    font-weight: normal;
    border-radius: 5px;
}
.banner-btn a:hover{
    background: #181818;
    transition: 0.5s;
}
.banner-btn{
    padding-top: 30px;
}
/* Crafting Dream Spaces */
.page-wrapper{
    width: auto !important;
    overflow:  hidden !important;
    padding: 5% 0;
    background: #000;
}
.type-text{
    position: relative;
    text-align: center;
}
.page-wrapper h3{
    line-height: unset;
    font-size: 45px;
    color: #fff;
    text-align: center;
    font-weight: 500;
}
.page-wrapper p{
    font-size: 16px;
    color: #fff;
    font-weight: 300;
    text-align: center;
    padding: 0 33%;
    padding-bottom: 20px;
    position: relative;
}
.page-wrapper p::after{
    position: absolute;
    content: '';
    background: #ff5314;
    width: 115px;
    height: 3px;
    bottom: 8%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-clip-path: polygon(0% 0,100% 0,93% 100%,0 100%);
    clip-path: polygon(0% 0,100% 0,93% 100%,0 100%);
}
.page-wrapper span{
    color: #ff5314;
    display: inline-block;
    position: relative;
    top: -17px;
    padding: 0 5px;
    font-weight: 500;
}
.main-wrapper{
    position: unset !important;
    height: auto !important;
}
.fake-scroll-height{
    height: auto !important;
    display: unset !important;
}
.half_height_bg {
    z-index: -1;
    background-color: #000;
    height: 50%;
    position: absolute;
    top: auto;
    bottom: 0%;
    left: 0%;
    right: 0%;
}
.home_intro_wrap.padding-section-medium {
background-color: #fff;
padding: 5% 0;
padding-bottom: 0%;
}
.home_intro_wrap h3{
    font-size: 45px;
    text-align: center;
    color: #181818;
    padding-bottom: 10px;
    font-weight: 500;
}
.type-text .typewrite{
    color: #ff5314;
    font-size: 45px;
    font-weight: 500;
}
.up-down {
    animation: up-down linear 4s;
    animation-iteration-count: infinite;
    transform-origin: 50% 50%;
    -webkit-animation: up-down linear 4s;
    -webkit-animation-iteration-count: infinite;
    -webkit-transform-origin: 50% 50%;
    -moz-animation: up-down linear 4s;
    -moz-animation-iteration-count: infinite;
    -moz-transform-origin: 50% 50%;
    -o-animation: up-down linear 4s;
    -o-animation-iteration-count: infinite;
    -o-transform-origin: 50% 50%;
    -ms-animation: up-down linear 4s;
    -ms-animation-iteration-count: infinite;
    -ms-transform-origin: 50% 50%;
}
@keyframes up-down{
    0% {
      transform:  translate(1px,20px)  ;
    }
                                                                                                                                                     
    50% {
      transform:  translate(1px,12px)  ;
    }
    100% {
      transform:  translate(1px,22px)  ;
    }
}  
.home_intro_wrap p{
    font-size: 16px;
    color: #181818;
    text-align: center;
    padding: 0 20%;
    font-weight: normal;
    padding-bottom: 20px;
}
.g_header_text {
    grid-column-gap: 1.5rem;
    grid-row-gap: 1.5rem;
    text-align: center;
    flex-flow: column;
    justify-content: flex-start;
    align-items: center;
    max-width: 42.5rem;
    margin-left: auto;
    margin-right: auto;
    display: flex;
}
.sticky_circle_wrap {
    height: 200dvh;
    border-radius: 60px;
}
.sticky_circle {
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100dvh;
    display: flex;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    overflow: hidden;
}
.sticky_circle_element {
    justify-content: flex-start;
    align-items: end;
    width: 100%;
    height: 100%;
    display: flex;
    position: relative;
    padding: 0 50px;
}
.sticky_circle_element img{
    border-radius: 60px;
    width: 100%;
}
.sticky_circle_element .overlay {
    content: "";
    background-color: #00000059;
}
.sticky_pin_element {
    grid-column-gap: 1rem;
    grid-row-gap: 1rem;
    background-color: var(--base-color-brand--tomato);
    border-radius: 100rem;
    flex-flow: column;
    justify-content: flex-end;
    align-items: center;
    width: 100%;
    height: 0;
    display: flex;
    position: absolute;
    top: 78%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
}
.sticky_logo h2{
    font-size: 45px;
    color: #ffffff;
    font-weight: normal;
    
}
.main-text{
    width: 300px;
    height: 300px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #181818ba;
    padding: 15px;
    position: relative;
}
.border-line{
    width: 100%;
    height: 100%;
    border: 1px solid #ffffff94;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding: 15px;
}
.sticky_line {
    flex: none;
    justify-content: center;
    align-items: flex-end;
    width: 1px;
    height: 6rem;
    display: flex;
}
.sticky_line_move {
    background-color: var(--base-color-brand--tomato);
    width: 100%;
    height: 100%;
}
.swap_wrap {
    background-color: var(--base-color-brand--peach);
    display: none;
}
.swap_layout {
    justify-content: space-between;
    align-items: stretch;
    height: 100%;
    display: flex;
}
.swap_right {
    color: var(--base-color-brand--tomato);
    flex-flow: column;
    width: 100%;
    max-width: 35.25rem;
    display: flex;
}
.swap_height {
    width: 100%;
    height: 300dvh;
    position: relative;
}
.swap_sticky {
    width: 100%;
    height: 100dvh;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
} 
.swap_left {
    flex: 1;
    overflow: hidden;
}
.swap_card {
    flex-flow: column;
    display: flex;
}
.text-style-label {
    letter-spacing: .05em;
    text-transform: uppercase;
    white-space: pre-wrap;
    font-size: .75rem;
    font-weight: 600;
}
.swap_card_label {
    justify-content: flex-start;
    align-items: center;
    padding-top: 1rem;
    padding-bottom: 1rem;
    display: flex;
} 
.swap_card_label.is-2, .swap_card_label.is-3 {
    border-top: 1px solid var(--base-color-brand--tomato);
}
.swap_btn_wrap {
    grid-column-gap: 1.5rem;
    grid-row-gap: 1.5rem;
    justify-content: flex-start;
    align-items: center;
    margin-top: 1rem;
    display: flex;
}
.swap_card_content {
    overflow: hidden;
}
.swap_card_content.is-2 {
    height: 0%;
    overflow: hidden;
} 
.swap_card_content.is-3 {
    height: 0;
}
.swap_expand.is-1 {
    height: 100%;
}
.swap_expand.is-2 {
    height: 22%;
    overflow: hidden;
}
.swap_trigger_wrap {
    z-index: -1;
    flex-flow: column;
    width: 100%;
    height: 100%;
    display: flex;
    position: absolute;
    top: 0%;
    bottom: 0%;
    left: 0%;
    right: 0%;
}
.swap_trigger_1, .swap_trigger_2, .swap_trigger_3 {
    flex: none;
    width: 100%;
    height: 100dvh;
}
.service-small img {
    width: 100%;
}
.service-inner .row {
    display: flex;
    justify-content: space-between;
}
.service-left,
.service-right {
    width: 20%;
    padding-bottom: 110px;
}
.service-right {
    text-align: left;
}
.album_item:nth-child(6n+1) {
    width: 40vw;
    height: 40vw;
    left: 0%;
    right: auto;
    top: auto;
    bottom: -45%;
}
.album_item:nth-child(6n+2) {
    width: 30vw;
    height: 45vw;
    left: auto;
    right: 10%;
    top: 10%;
    bottom: auto;
}
.album_item:nth-child(6n+3) {
    width: 40vw;
    height: 40vw;
    left: 0%;
    right: auto;
    top: -40%;
    bottom: auto;
}
.album_item:nth-child(6n+4) {
    width: 50vw;
    height: 30vw;
    left: auto;
    right: 10%;
    top: auto;
    bottom: -30%;
}
.album_item:nth-child(6n+5) {
    width: 40vw;
    height: 40vw;
    left: 0%;
    right: auto;
    top: auto;
    bottom: auto;
}
.album_item:nth-child(6n+6) {
    width: 40vw;
    height: 55vw;
    left: auto;
    right: 25%;
    top: -70%;
    bottom: auto;
}
.album_image-mask h5 {
    color: #fff;
    position: relative;
    z-index: 99;
    text-align: center;
    background: #00000073;
    padding: 10px 0;
    font-size: 20px;
}
.char {
    opacity: 0;
}
.line {
    overflow: hidden;
    padding-bottom: 0.2em;
    margin-top: -0.2em;
}
.transition-img {
    pointer-events: none;
}
.item_headline {
    pointer-events: none;
}
.blur-filter {
    transition: filter 0.3s ease;
    pointer-events: none;
}
.light{
    font-weight: 300 !important;
    color: #fff !important;
    padding: 0 !important;
    top: 0 !important;
}
.expiricans-box{
    background: #2b2b2b;
    border: 0.5px solid #303030;
    border-radius: 50px;
    padding: 30px;
    height: 305px;
}
.expiricans-box h4{
   color: #fff;
   font-weight: 500;
   font-size: 20px;
   padding-top: 20px;
   padding-bottom: 10px;
   height: 85px;
}
.expiricans-box p{
    color: #fff;
    font-size: 16px;
    font-weight: normal;
    padding: 0 !important;
    text-align: left !important;
    line-height: unset !important;
}
.expiricans-box img{
    height: 75px;
    transition: 0.5s;
}
.expiriance-bg h3{
    color: #fff;
    font-size: 35px;
    font-weight: 300;
    padding-bottom: 10px;
    text-align: center;
}
.color-change{
    color: #ff5314;
    display: inline-block;
    position: relative;
    top: -17px;
    padding: 0 5px;
    font-weight: 500;
}
.expiriance-bg p{
    color: #fff;
    font-weight: 300;
    font-size: 16px;
    padding: 0 15%;
    padding-bottom: 30px;
    text-align: center;
}
.expiriance-bg{
    padding-bottom: 5%;
}
.expiricans-box:hover img{
    transform: rotate(10deg);
    transition: 0.5s;
}
.padd-box{
    padding: 10%;
}
.pain-points-outer {
    flex-flow: column;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    height: 440px;
    min-height:auto;
    display: flex;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
}

.pain-points-inner {
    flex-flow: column;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    height:auto;
    display: flex;
    position: relative;
    text-align: center;
}
/* ELEVATED EXPERIENCES */
.experieaces-bg .main-container{
    margin: 0 105px;
}
@media (min-aspect-ratio: 16/9) {
    .panal-video {
        width: 100%;
        height: auto;
    }
}

@media (max-aspect-ratio: 16/9) {
    .panal-video {
        width: auto;
        height: 100%;
    }
}
.cards-layer-2 {
    z-index: 2;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: auto;
    display: flex;
    position: relative;
}
.card-1 {
    z-index: 1;
    background-color: #141414;
    border: 0.5px solid #303030;
    border-radius: 50px;
    flex-flow: column;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 25rem;
    padding: 20px;
    display: flex;
    position: relative;
}
.card-icon {
    margin-bottom: 2rem ;
    width: auto;
}
.custom h3{
    color: #fff;
    margin-top: 0;
    margin-bottom: 0;
    font-size: 45px;
    font-weight: normal;
    padding-bottom: 20px;
}
.custom span{
    top: 0;
    color: #ff5314;
    font-weight: 300;
}
.custom p{
    font-size: 16px;
    color: #fff;
    font-weight: 300;
    padding: 0 15%;
}
.global-subline h2{
    text-align: center ;
    font-size: 25px ;
    color: #fff;
    font-weight: normal;
    height: 65px;
}
.global-subline p {
    color: #fff;
    font-size: 16px;
    font-weight: 300;
}
.copytext {
    color: var(--grey);
    letter-spacing: -.2px;
    margin-bottom: 0;
    font-size: 21px;
    font-weight: 600;
    line-height: 1.3em;
}
.card-2 {
    z-index: 2;
    background-color: #141414;
    border: 0.5px solid #303030;
    border-radius: 50px;
    flex-flow: column;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 25rem;
    padding: 20px;
    display: flex;
    position: relative;
}

.card-3 {
    z-index: 3;
    background-color: #141414;
    border: 0.5px solid #303030;
    border-radius: 50px;
    flex-flow: column;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 25rem;
    padding: 20px;
    display: flex;
    position: relative;
}
.padd-sec{
    padding-left: 5px;
    padding-right: 5px;
}
/* client-logo */
.client-logo{
    text-align: center;
}
.phone-logo{
    display: none;
}
.client-logo-sec{
    border-radius: 40px;
    background: #fff;
    padding: 2.5rem 2rem;
    margin: 0 7%;
}
.client-logo-sec .owl-carousel .owl-stage{
    display: flex;
    align-items: center;
}
.client-logo-sec h3{
    font-size: 21px;
    font-weight: 600;
    color: #000;
    margin-bottom: 1.5rem;
    text-align: center;
}
.client-bg{
   padding: 3% 0;
   background: #000;
   padding-bottom: 0;
}
.client-bg .main-container{
    border-bottom: 1px solid #565656;
    padding-bottom: 70px;
	margin-top: 168px;
    position: relative;
}
/* footer */
.footer-grid-item {
    background-color: #212121;
    perspective: 1000px;
    border: 0.5px solid #353535;
    border-radius: 24px;
    flex-flow: row;
    justify-content: center;
    align-items: center;
    width: 100%;
    padding: 30px 20px;
    display: flex;
    gap: 20px;
    font-weight: 500;
    height: 130px;
}
.copytext{
    color: #fff;
    font-size: 15px;
    font-weight: 300;
}
.footer-bg{
    background: #000;
}
.footer-change{
    border-top: 1px solid #747474;
    padding: 3% 0;
}
.form-sec h5{
    color: #fff;
    font-weight: normal;
    font-size: 16px;
}
.form-sec .form-control{
    background: transparent;
    border-radius: 0;
    border-top: none;
    border-left: none;
    border-right: none;
    border-bottom: 1px solid rgba(230,230,230,.45);
    box-shadow: none;
    padding-left: 0;
   padding-bottom: 10px;
}
.form-sec input::placeholder{
    color: rgba(230,230,230,.45);
    font-size: 14px;
    font-weight: normal;
}
.mail-box{
    position: relative;
}
.mail-box .form-group{
    margin-right: 95px;
}
.sub-btn{
    position: absolute;
    right: 0;
    top: 0;
}
.sub-btn .btn-primary{
    background-color: rgba(230,230,230,0);
    border: 1px solid rgba(230,230,230,.35);
    padding: 10px 32px;
    font-size: .75em;
    transition:  0.4s;
}
.sub-btn .btn-primary:hover{
    background: #ff5314;
    transition:  0.4s;
}
.form-sec h4{
    color: #fff;
    font-size: 40px;
    font-weight: 400;
    margin-bottom: 20px;
    padding-right: 215px;
}
.form-sec span{
    color: #ff5314;
    font-weight: 300;
    top: 0;
}
.quick-links ul{
    margin: 0;
    padding: 0;
}
.quick-links li{
    list-style: none;
}
.quick-links a{
    color: #fff;
    font-size: 13px;
    text-decoration: none;
    transition: 0.5s;
}
.quick-links a:hover{
    color: #ff5314;
    transition: 0.5s;
}
.contact-pri{
    border-color: #ff5314;
    background-color: #ff5314;
    border-radius: 4px;
    flex-flow: row;
    justify-content: center;
    align-items: center;
    width: auto;
    height: 46px;
    margin-right: 400px;
    padding: 12px 72px;
    font-size: .82em;
    font-weight: 400;
    display: flex;
    color: #fff;
    text-decoration: none !important;
    transition: 0.5s;
}
.arrow-img{
    position: absolute;
    margin-left: 280px;
    border-radius: 4px;
    width: 46px;
    height: 46px;
    background: #ff5314;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.5s;
}
.contact-btn:hover a{
    transform: scale(1.1);
    transition: 0.5s;
    background: #000;
    color: #fff;
    border: 1px solid rgba(230,230,230,.45);
}
.coppy-sec p{
    color: #fff;
    font-size: 13px;
    font-weight: normal;
    margin: 0;
}
.privacy{
    text-align: center;
}
.privacy a{
    color: #fff;
    text-decoration: none;
    font-size: 13px;
    font-weight: normal;
    transition: 0.5s;
}
.privacy a:hover{
    color: #ff5314;
    transition: 0.5s;
}
.all-right{
    text-align: right;
}
.all-right p{
    font-size: 13px;
    font-weight: normal;
    color: #fff;
    margin: 0;
}
.coppy-bg{
    padding-top: 85px;
}
.logo-footer{
    padding-top: 95px;
}
#button {
    display: inline-block;
    background: #181818;
    width: 50px;
    height: 50px;
    text-align: center;
    border-radius: 50%;
    position: relative;
    /* position: fixed;
    bottom: 50px;
    right: 20px; */
    transition: background-color .3s, opacity .5s, visibility .5s;
    opacity: 0;
    visibility: hidden;
    z-index: 1000;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.5s;
    -webkit-transform: translateY(100%);
    -o-transform: translateY(100%);
    -ms-transform: translateY(100%);
    -moz-transform: translateY(100%);
    transform: translateY(100%);
    -webkit-box-shadow: 0 0 5px rgb(0 0 0 / 20%);
    box-shadow: 0 0 5px rgb(0 0 0 / 20%);
    transition: 0.5s;
}
#button:hover{
    background: #ff5314;
    transition: 0.5s;
}
#button.show {
    visibility: visible;
    opacity: 1;
    -webkit-transform: translateY(0%);
    -o-transform: translateY(0%);
    -ms-transform: translateY(0%);
    -moz-transform: translateY(0%);
    transform: translateY(0%);
}
#button::after {
    content: "\f062";
    font-family: FontAwesome;
    font-weight: normal;
    font-style: normal;
    font-size: 20px;
    color: #fff;
    transition: 0.5s;
}
.top-link {
    justify-content: flex-start;
    align-self: flex-start;
    align-items: center;
    width: auto;
    margin: 0 0;
    font-family: Q-R,sans-serif;
    font-size: .9em;
    font-weight: 400;
    display: flex;
}

element.style {
    background-color: rgba(241, 241, 241, 0);
}
.social-link-box {
    border: 1px solid rgba(230,230,230,.35);
    border-radius: 100%;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 50px;
    margin-right: 4px;
    display: flex;
}
.back-top-btn a{
    text-decoration: none;
    color: #fff;
    font-size: 13px;
    font-weight: normal;
}
.social-link-box.to-top {
    margin-right: 10px;
}

  .container {
  
    display: flex;
    flex-wrap: nowrap;
  }
  #root{
    overflow: hidden;
  }
  .panel {
    width: 100%;
    height: 100vh;
    color: white;
    position: relative;
    box-sizing: border-box;
}
.product-img{
    padding-left: 50px;
}
.panel h3{
    font-size: 18px;
    color: #fff;
    font-weight: normal;
    text-align: left;
    padding-top: 20px;
}
.panel h1{
    width: 100%;
    font-weight: normal;
    font-size: 145px;
    margin: 0;
    text-align: center;
    letter-spacing: 5px;
    color: #ff5314;
}
.loong-text p::after{
  display: none;
}
.enqury-btn{
    text-align: center;
}
.enqury-btn a{
    border: 1px solid #ff5314;
    border-radius: 5px;
    color: #fff;
    font-size: 15px;
    font-weight: normal;
    text-decoration: none;
    transition: 0.5s;
    padding: 8px 25px;
}
.enqury-btn a:hover{
    background: #ff5314;
    color: #fff;
    transition: 0.5s;
}
.panel span{
    color: #fff;
    font-weight: normal;
    top: 0;
    padding: 0;
}
.bottam-img{
    width: 275px;
    position: fixed;
    top: 370px;
    -webkit-transform: rotate(355deg);
    -moz-transform: rotate(355deg);
    transform: rotate(355deg);
}

.other-box{
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}
.top-img{
    width: 275px;
    position: absolute;
    top: 112px;
    right: 105px;
    -webkit-transform: rotate(355deg);
    -moz-transform: rotate(355deg);
    transform: rotate(355deg);
    z-index: -1;
}
@media (min-aspect-ratio: 16/9) {
    .back-video {
        width: 100%;
        height: auto;
    }
}

@media (max-aspect-ratio: 16/9) {
    .back-video {
        width: auto;
        height: 100%;
    }
}
body.loaded #backgrounds {
    /* width: 1000vw; */
    height: 100%;
    position: fixed;
    z-index: -1;
    top: 0;
    left: 0;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    transform: translateX(calc(var(--total) * -1%)) skewX(calc(var(--velocity) * 5deg));
}
body.loaded #backgrounds .bg {
    display: flex;
    height: 100vh;
    width: 100vw;
    /* background: var(--pink); */
    overflow: visible;
    position: relative;
}
body.loaded #backgrounds .bg:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 2;
    top: 0;
    left: 100%;
    background: var(--cream);
    transform: scaleX(calc(var(--posvelocity)));
    transform-origin: left;
}
body.loaded #backgrounds .bg:nth-of-type(2n) {
    background: var(--cream);
}
body.loaded #wrap {
    width: calc(100% - 32px);
    /* max-width: 1200px; */
    position: relative;
    z-index: 1;
}
body.loaded #wrap #panels {
    width: 100%;
    /* height: 1000vh; */
}
body.loaded #wrap #panels section.panel {
    width: 100%;
    height: 100vh;
    position: relative;
    box-sizing: border-box;
    margin-bottom: 0vh;
}
/* Faq */
.qustion{
    font-weight: 300;
    color: #fff !important;
}
.flip-card {
    background: none;
    width: 300px;
    height: 300px;
    margin-bottom: 10px;
    position: relative;
}
.flip-card-inner {
    position: relative;
    width: 300px;
    height: 300px;
    transition: transform 0.8s;
    transform-style: preserve-3d;
    background: #0d0d0d;
}
.flip-card:hover .flip-card-inner {
    transform: rotateY(180deg);
}
.flip-card-front{
    position: absolute;
    width: 300px;
    height: 300px;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    display: flex;
    align-items: end;
    flex-direction: column;
    justify-content: end;
    padding: 20px;
    border: 1px solid #141414;
}
.flip-card-back {
    position: absolute;
    width: 300px;
    height: 300px;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
}
.flip-card-front h5{
    font-size: 20px;
    font-weight: 300;
    color: #fff;
}
.flip-card-front h6{
    color: #fff;
    font-size: 12px;
    font-weight: 300;
    position: absolute;
    top: 20px;
    right: 20px;
}
.flip-card-back {
    background-color: #fff;
    color: #000;
    transform: rotateY(180deg);
    padding: 20px;
    font-size: 15px;
}
.flip-box{
    padding-left: 320px;
}
.faq-sec h3{
    text-align: center;
    color: #fff;
    font-size: 75px;
    font-weight: normal;
    padding: 0 17%;
}
.faq-sec span{
    color: #ff5314;
    font-weight: 300;
}
.fixed-sec p{
    font-size: 16px;
    font-weight: 300;
    color: #fff;
    text-align: center;
    padding: 0 32%;
}
.faq-sec{
    padding: 5% 0;
    padding-bottom:5px !important
}
.fixed-sec{
    
    top: 0%;
    left: 50%;
    z-index: 0;
    transform: translate(-50%,);
    text-align: center;
    /* margin-top: 30px; */
    margin-bottom: -225px;
}
.fixed-faq-box{
    padding-top: 30%;
}
.navwrap {
    max-width: 100%;
    margin: auto;
    overflow: hidden;
    white-space: nowrap;
    margin-right: 20px;
}
/* Responsive */
@media (max-width: 991px){
.main-container{
    margin: 0 15px;
}
.m-contact h4{
    font-size: 18px;
}
.footer-logo img{
    width: 130px;
}
.footer-logo{
    padding-bottom: 20px;
}
.experieaces-bg .main-container{
    margin: 0 15px;
}
.pl-0{
    padding-left: 15px !important;
}
.pr-0{
    padding-right: 15px !important;
}
.panal-video{
    width: 100%;
    height: auto;
}
.navbar-light .navbar-toggler{
    display: none;
}
.scrool-down{
    display: none;
}
.back-video {
    width: auto;
    height: auto;
    display: none;
}
.phone-img{
    height: 320px;
}
.home_intro_wrap h3{
    font-size: 25px;
}
.type-text .typewrite{
    font-size: 25px;
}
.flip-card-front{
    width: 100%;
    height: 300px;
    align-items: flex-start;
}
.flip-card{
    width: 100%;
    height: 300px;
    margin-bottom: 20px;
}
.flip-card-inner{
    width: 100%;
    height: 300px;
}
.flip-card-back{
    width: 100%;
    height: 300px;
}
.flip-card-front h6{
    right: unset;
    left: 20px;
}
.round-box-text{
    display: none;
}
.banner-text p{
    padding-right: 0;
    font-size: 14px;
}
.phone-video{
    display: block;
    width: 100%;
    height: auto;
    border-radius: 40px;
}
.banner-text{
    padding-left: 0;
}
.banner-btn a{
    font-size: 14px;
	float: left;
        margin-left: 10px;
        margin-top: 10px;
}
.social-link a{
    font-size: 15px;
}
.home_intro_wrap p{
    padding: 0 15px;
    font-size: 14px;
}
.sticky_circle_element{
    padding: 0 0px;
}
.sticky_circle_element img{
    width: auto;
}
.sticky_circle_element img{
    border-radius: 0px;
}
.sticky_logo h2{
    font-size: 30px;
}
.main-text {
    width: 215px;
    height: 215px;
    padding: 10px;
    border-radius: 0;
}
.out-box{
    top: -5px;
}
.page-wrapper h3{
    font-size: 25px;
    padding: 0 15px;
}
.page-wrapper p{
    padding: 0;
    font-size: 14px;
    padding-left: 15px;
}
.page-wrapper p::after{
    bottom: -85%;
}
.panel h1{
    font-size: 50px;
}
.panel span{
    font-size: 70px;
}
.panel{
    padding: 15px;
}
.other-box{
    justify-content: left !important;
}
.container {
   
    display: flex;
    flex-wrap: nowrap;
}
.top-img{
    z-index: -1;
    top: 153px;
    right: 105px;
    -webkit-transform: rotate(355deg);
    -moz-transform: rotate(355deg);
    transform: rotate(314deg);
    width: 180px;
}
.bottam-img {
    width: 180px;
    position: fixed;
    top: 125px;
    -webkit-transform: rotate(355deg);
    -moz-transform: rotate(355deg);
    transform: rotate(341deg);
    z-index: -1;
}
.card-1{
    will-change: unset !important;
    transform: unset !important;
    transform-style: unset !important;
    height: auto;
    border-radius: 15px;
}
.card-2{
    height: auto;
    will-change: unset !important;
    transform: unset !important;
    transform-style: unset !important;
    margin: 20px 0;
    border-radius: 15px;
}
.card-3{
    height: auto;
    will-change: unset !important;
    transform: unset !important;
    transform-style: unset !important;
    border-radius: 15px;
}
.pain-points-outer{
    height: 100vh !important;
    display: unset;
    position: unset;
}
.pain-points-inner{
    display: unset;
}
.custom p{
    padding: 0;
    font-size: 14px;
}
.cards-layer-2{
    position: unset;
}
.faq-sec h3{
    font-size: 25px;
    padding: 0;
}
.fixed-sec p{
    font-size: 14px;
    padding: 0;
}
.flip-box{
    padding-left: 30px;
}
.padd-right{
    padding-right: 30px;
}
.padd-left{
    padding-left: 30px;
}
.fixed-sec{
    margin-bottom: 0;
}
.faq-sec{
    padding-bottom: 5%;
}
.top-link{
    padding-bottom: 20px;
}
.logo-footer {
    padding-top: 15px;
}
.form-sec h4{
    padding-right: 0;
    font-size: 25px;
}
.contact-pri {
    width: 215px;
}
.coppy-bg {
    padding-top: 35px;
}
.privacy {
    text-align: left;
}
.all-right{
    text-align: left;
}
.flip-card-front h5{
    font-size: 20px;
}
.flip-card-back{
    font-size: 14px;
}
.fixed-faq-box {
    padding-top: 15%;
}
.client-logo-sec{
    margin: 0;
    padding: 30px 20px;
    display: none;
}
.client-logo{
    padding: 10px 0;
}
.global-subline h2{
    font-size: 20px;
    height: auto;
}
.custom h3 {
    font-size: 25px;
}
.sticky_circle{
    height: auto;
    margin-top: -145px;
}
.m-header h2{
    font-size: 17px;
}
.menu-container{
    padding: 15px;
    padding-bottom: 40px;
}
.m-tags{
    padding-top: 0;
}
.m-contact p{
    font-size: 12px;
    line-height: 25px;
}
.m-links ul{
    padding: 0;
    margin: 0;
}
.m-links a{
    font-size: 13px;
}
.lenis-smooth{
    scroll-behavior: unset !important;
}
.overlay-close{
    width: 35px;
    height: 35px;
}
.overlay-close i{
    font-size: 16px;
}
.m-medias a i{
    font-size: 15px;
}
.m-tags li{
    padding-bottom: 5px;
}
.sticky_circle_wrap{
    height: 300dvh;
}
.phone-menu{
    display: block;
}
.navwrap {
    margin-right: 0;
    overflow: unset;
    overflow-y: auto;
    padding: 8px 0;
    margin-left: 30px;
}
.main-container {
    margin: 0 15px;
}
.navwrap .nav {
    display: table;
    width: 100%;
    word-spacing: -9em;
    overflow-y: scroll;
}
.navwrap .nav li {
    display: inline-block;
    text-align: left;
    word-spacing: normal;
}
.navwrap .nav a {
    display: block;
    padding: 4px 10px;
    background: none;
    color: #fff;
    text-decoration: none;
    white-space: nowrap;
    position: relative;
    font-size: 12px;
    font-weight: normal;
    font-family: 'DM Sans 24pt';
}
.bor-line-mob{
    border: 0.20000000298023224px solid #fff;
    border-radius: 5px;
    margin: 0 3px;
}
.navwrap .nav li > a {
    position: relative;
    transition: 0.5s;
}
.navwrap .nav li a:first-child:not(:last-child) {
    padding-right: 20px;
}
.navwrap .nav ul {
    position: absolute;
    z-index: 104;
    left: -999em;
    top: 0;
    opacity: 0;
    transition: opacity 0.5s, left 0s 0.5s, top 0.5s;
    background: #fff;
    box-shadow: 0px 3px 6px #00000029;
    padding-left: 0;
}
.navwrap .nav li li {
    display: block;
}
.navwrap .nav li > a {
    position: relative;
    transition: 0.5s;
}
.phone-nav {
    display: block;
    position: relative !important;
}
.navwrap .nav li > a:hover {
    background: #ff5314;
    color: #fff !important;
    transition: 0.5s;
}
.navwrap .nav li a:first-child:not(:last-child):after {
    content: "";
    position: absolute;
    right: 7px;
    top: 47%;
    margin-top: -6px;
    width: 0;
    height: 0;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    border-left: 6px solid #fff;
}
.navwrap .nav > li > a:first-child:not(:last-child):after {
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 4px solid #fff;
    border-bottom: none;
    margin-top: 0px;
}
.navwrap .nav li:hover, .navwrap .nav > li > a:hover, .navwrap .nav li:focus, .navwrap .nav > li > a:focus {
    z-index: 105;
    color: #fff;
}
.navwrap .nav ul {
    position: absolute;
    z-index: 104;
    left: -999em;
    top: 0;
    opacity: 0;
    transition: opacity 0.5s, left 0s 0.5s, top 0.5s;
    background: #fff;
    box-shadow: 0px 3px 6px #00000029;
    padding-left: 0;
}
.navwrap .nav li:hover > ul {
    left: auto;
    top: auto;
    opacity: 1;
    transition: opacity 0.5s linear, top 0.5s;
}
.navwrap .nav ul ul {
    transition: opacity 0.4s, left 0s 0.4s, margin 0s 0.4s;
    z-index: 103;
}
.navwrap .nav li li:hover ul {
    top: auto;
    margin-left: 100%;
    transform: translateY(-2.2rem);
    opacity: 1;
    transition: opacity 0.5s linear, margin 0.5s;
}
.navwrap::-webkit-scrollbar{
    display: none !important;
}
header{
    position: relative;
}
.navbar-brand{
    display: block;
    width: 105px;
}
.head-menu{
    top: 28px;
}
/* .navbar{
    display: none;
} */
.serch-box{
    display: block;
}
.serch-go {
    position: absolute;
    right: 20px;
    top: 3px;
}
.serch-box .form-control {
    background: #f1f0f5;
    border-radius: 10px;
    border: none;
    padding: 5px 20px;
    box-shadow: none;
}
.serch-go .btn-primary {
    background: transparent;
    border-color: transparent;
}
.serch-box .form-group {
    margin-bottom: 10px;
    position: relative;
}
.serch-go button {
    padding: 0;
}
.btn-primary:focus {
    box-shadow: none;
}
.banner{
    padding: 0 15px;
    background: #000;
    padding-bottom: 35px;
    border-bottom-right-radius: 20px;
    border-bottom-left-radius: 20px;
}
.vedio-banner{
    height: auto;
}
header.smaller {
    top: 0px;
    position: fixed;
    width: 100%;
    z-index: 99;
    background: transparent;
    transition: 0.5s;
    border-bottom: none;
    padding: 10px 50px;
}
header.smaller .desk-top-menu{
    background: #000;
    width: 100%;
    margin: 0 auto;
    border-radius: 40px;
    box-shadow: 3px 3px 9px #0000006b;
    padding: 13px;
}
.navbar{
    padding: 0;
}
header.smaller .main-container{
    margin: 0;
}
.desk-top-menu{
    padding: 15px 0;
}
header.smaller .navbar-brand{
    width: 85px;
    padding: 0;
}
header.smaller .head-menu{
    top: 18px;
    right: 15px;
}
header.smaller .head-menu img{
    width: 23px;
}
.book-call a{
    color: #fff;
    background-color: #ff5314;
    cursor: pointer;
    font-weight: normal;
    border-radius: 8px;
    font-size: 15px;
    padding: 7px 10px;
    text-decoration: none;
    transition: 0.5s;
}
.book-call a:hover{
    background: #ff5314;
    color: #fff;
    transition: 0.5s;
}
.navbar{
    padding-right: 45px;
}
header.smaller .book-call a{
    background: #ff5314;
    color: #fff;
    font-size: 13px;
    padding: 6px 10px;
}
header.smaller .navbar{
    padding-right: 35px;
}
.book-call{
    display: block;
}
.phone-logo{
    background: #fff;
    padding: 20px 15px;
    border-radius: 20px;
    display: block;
}
.client-bg .main-container{
    padding-bottom: 35px;
}
.padd-sec{
    padding-left: 15px;
    padding-right: 15px;
}
.client-bg{
    padding-top: 8% ;
}
.page-wrapper{
    padding: 8% 0;
}
.product-img{
    padding-left: 0;
}
}
@media (max-width: 499px){
.banner-text h2{
    font-size: 30px;
} 
.contact-pri {
    width: 170px;
    padding: 12px 15px;
}
.arrow-img{
    margin-left: 230px;
}
.form-sec h4 {
    font-size: 22px;
}
.sticky_circle_wrap {
    height: 290dvh;
}  
.sticky_logo h2 {
    font-size: 25px;
}
.main-text{
    width: 180px;
    height: 180px;
}
.container {
   
    display: flex;
    flex-wrap: nowrap;
}
/* .sticky_circle{
    height: 100dvh;
} */

.pin-spacer{
    height: 3800px !important;
    padding-bottom: 40px !important;
}
}

/* ======================
   ABOUT PAGE
====================== */

.about-hero {
    background: #000;
    padding: 10% 0;
}

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

/* Left content */
.about-content {
    max-width: 620px;
}

.about-tag {
    color: #ff5314;
    font-size: 14px;
    letter-spacing: 3px;
    text-transform: uppercase;
    display: inline-block;
    margin-bottom: 20px;
}

.about-title {
    font-size: 70px;
    font-weight: 300;
    color: #fff;
    line-height: 1.1;
    margin-bottom: 25px;
}

.about-description p {
    font-family: 'Inter';
    color: #dcdcdc;
    font-size: 17px;
    line-height: 30px;
    margin-bottom: 20px;
}

/* Right image */
.about-image {
    position: relative;
    border-radius: 40px;
    overflow: hidden;
}

.about-image img {
    width: 100%;
    height: auto;
    border-radius: 40px;
    transition: transform 0.6s ease;
}

.about-image:hover img {
    transform: scale(1.05);
}

/* Glow border */
.about-image::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 40px;
    border: 1px solid rgba(255,255,255,0.15);
    pointer-events: none;
}

/* Responsive */
@media (max-width: 991px) {

    .about-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .about-title {
        font-size: 36px;
    }

    .about-hero {
        padding: 18% 0;
    }
}
.wp-block-list li,
.wp-block-list li strong {
    color: #ffffff !important;
}
/* =====================
ABOUT CTA
===================== */

.about-cta {
    position: relative;
    background: #FF5314;
    padding: 90px 0;
    overflow: hidden;
}

/* White line layers */
.about-cta::before,
.about-cta::after {
    content: "";
    position: absolute;
    width: 140%;
    height: 1px;
    background: rgba(255,255,255,0.35);
    left: -20%;
}

.about-cta::before {
    top: 30%;
}

.about-cta::after {
    top: 65%;
}

.cta-lines {
    position: absolute;
    inset: 0;
    background:
        repeating-linear-gradient(
            -25deg,
            transparent,
            transparent 90px,
            rgba(255,255,255,0.12) 91px,
            rgba(255,255,255,0.12) 92px
        );
    pointer-events: none;
}

/* Layout */
.cta-inner {
    position: relative;
    z-index: 2;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 60px;
}

.cta-text h2 {
    font-size: 42px;
    color: #fff;
    font-weight: 400;
    margin-bottom: 15px;
}

.cta-text p {
    font-size: 17px;
    color: #fff;
    max-width: 520px;
    opacity: 0.9;
}

.cta-phone {
    display: block;
    margin-top: 12px;
    font-size: 22px;
    letter-spacing: 1px;
    color: #fff;
}

/* BUTTON */
.cta-btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    padding: 16px 44px;
    border-radius: 60px;
    background: transparent;
    color: #fff;
    border: 1px solid rgba(255,255,255,0.6);
    font-size: 15px;
    letter-spacing: 2px;
    text-transform: uppercase;
    text-decoration: none;
    overflow: hidden;
    transition: all 0.4s ease;
}

/* Hover fill */
.cta-btn span {
    position: absolute;
    inset: 0;
    background: #fff;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.45s ease;
    z-index: -1;
}

.cta-btn:hover span {
    transform: scaleX(1);
}

.cta-btn:hover {
    color: #FF5314;
}

/* Lift animation */
.cta-btn:hover {
    transform: translateY(-4px);
}

/* Responsive */
@media(max-width: 991px) {

    .cta-inner {
        flex-direction: column;
        text-align: center;
    }

    .cta-text h2 {
        font-size: 30px;
    }
}
/****************/
/* =====================
FEATURE PAGE HERO
===================== */

.feature-hero {
    background: #FF5314;
        padding: 94px 0 24px;
    position: relative;
    overflow: hidden;
}

.feature-hero h1 {
    font-size: 65px;
    color: #fff;
    font-weight: 400;
    text-align: center;
}

.feature-hero-desc {
    max-width: 720px;
    margin: 25px auto 0;
    color: #fff;
    text-align: center;
    font-size: 17px;
}

/* white lines */
.feature-hero::before,
.feature-hero::after {
    content: "";
    position: absolute;
    width: 140%;
    height: 1px;
    background: rgba(255,255,255,0.35);
    left: -20%;
}

.feature-hero::before { top: 30%; }
.feature-hero::after { top: 65%; }

.hero-lines {
    position: absolute;
    inset: 0;
    background:
        repeating-linear-gradient(
            -25deg,
            transparent,
            transparent 100px,
            rgba(255,255,255,0.12) 101px,
            rgba(255,255,255,0.12) 102px
        );
}

/* =====================
FEATURE GRID
===================== */

.feature-grid-section {
    background: #000;
    padding: 120px 0;
}

.feature-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 35px;
}

/* FLIP CARD */

.feature-card {
    perspective: 1200px;
    height: 320px;
}

.flip-inner {
    position: relative;
    width: 100%;
    height: 100%;
    transition: transform 0.8s cubic-bezier(.4,0,.2,1);
    transform-style: preserve-3d;
}

.feature-card:hover .flip-inner {
    transform: rotateY(180deg);
}

/* FRONT */
.flip-front,
.flip-back {
    position: absolute;
    inset: 0;
    backface-visibility: hidden;
    border-radius: 40px;
    border: 1px solid #202020;
    background: #0e0e0e;
    padding: 35px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.flip-front::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 40px;
    border: 1px solid rgba(255,83,20,0.4);
    pointer-events: none;
    opacity: 0;
    transition: .4s;
}

.feature-card:hover .flip-front::after {
    opacity: 1;
}

.feature-icon img {
       margin-bottom: 18px;
    border-radius: 20px;
}

.flip-front h3 {
    color: #fff;
    font-size: 18px;
    font-weight: 400;
}

/* BACK */

.flip-back {
    background: #FF5314;
    transform: rotateY(180deg);
    color: #fff;
    text-align: center;
}

.flip-back p {
    font-size: 15px;
}

/* Responsive */

@media(max-width: 991px) {

    .feature-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .feature-hero h1 {
        font-size: 38px;
    }

}

@media(max-width: 575px) {

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

}


  
/* =====================
GALLERY HERO
===================== */

.gallery-hero {
    background:#FF5314;
    padding:120px 0 90px;
    text-align:center;
    position:relative;
	background-size: contain;
}

.gallery-hero h1 {
    font-size:60px;
    color:#fff;
}

.gallery-desc {
    max-width:700px;
    margin:20px auto 0;
    color:#fff;
}

/* lines */

.gallery-hero::after {
  content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .7);
    /* left: -20%; */
    left: 0;
    top: 0;
}

.gallery-hero .main-container
{
	    z-index: 9999;
    position: relative;
}
/* =====================
FILTER BAR
===================== */

.gallery-filter ul {
    display:flex;
    justify-content:center;
    gap:30px;
    list-style:none;
    padding:40px 0;
}

.gallery-filter li {
    cursor:pointer;
    color:#fff;
    font-size:14px;
    letter-spacing:2px;
    text-transform:uppercase;
}

.gallery-filter li.active,
.gallery-filter li:hover {
    color:#FF5314;
}


/* =====================
GRID
===================== */

.gallery-grid-wrap {
    background:#000;
    padding:80px 0;
}

.gallery-grid {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:25px;
}

.gallery-img {
    position:relative;
    overflow:hidden;
    border-radius:25px;
}

.gallery-img img {
    width:100%;
    transition:.6s;
}

/* Hover overlay */
.gallery-overlay {
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.7);
    opacity:0;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    text-align:center;
    padding:25px;
    transition:.5s;
}

.gallery-img:hover img {
    transform:scale(1.1);
}

.gallery-img:hover .gallery-overlay {
    opacity:1;
}

.gallery-overlay h3 {
    color:#fff;
    font-size:18px;
    margin-bottom:10px;
}

.gallery-overlay p {
    color:#ccc;
    font-size:14px;
}

.gallery-eye {
    margin-top:15px;
    font-size:26px;
    cursor:pointer;
    color:#FF5314;
}


/* =====================
LIGHTBOX
===================== */

.gallery-lightbox {
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.9);
    display:none;
    justify-content:center;
    align-items:center;
    z-index:99999;
}

.gallery-lightbox img {
    max-width:90%;
    max-height:80vh;
}

.gallery-lightbox span {
    position:absolute;
    color:#fff;
    font-size:40px;
    cursor:pointer;
}

.gallery-lightbox .close {
    top:30px;
    right:40px;
}

.gallery-lightbox .prev {left:40px;}
.gallery-lightbox .next {right:40px;}


/* =====================
RESPONSIVE
===================== */

@media(max-width:991px){
.gallery-grid{grid-template-columns:repeat(2,1fr);}
}

@media(max-width:575px){
.gallery-grid{grid-template-columns:1fr;}
.gallery-hero h1{font-size:34px;}
}
/*******************************/
/* ================= CONTACT PAGE ================= */

.contact-hero {
    padding: 14% 0 6%;
    background: #000;
    text-align: center;
}

.contact-hero h1 {
    font-size: 70px;
    color: #fff;
    font-weight: 400;
}

.contact-desc {
    max-width: 700px;
    margin: auto;
    color: #ccc;
}


/* GRID */

.contact-main {
    padding: 6% 0;
    background: #000;
}

.contact-grid {
    display: grid;
    grid-template-columns: 1.1fr .9fr;
    gap: 60px;
}

/* FORM */

.contact-form-box {
    background: #0f0f0f;
    border: 1px solid #222;
    border-radius: 40px;
    padding: 60px;
}

.contact-form-box h3 {
    color: #fff;
    font-size: 32px;
}

.contact-form-box p {
    color: #aaa;
}

/* INPUTS */

.contact-form-box input,
.contact-form-box textarea {
    width: 100%;
    background: transparent;
    border: none;
    border-bottom: 1px solid #444;
    color: #fff;
    padding: 14px 0;
    margin-bottom: 25px;
}

.contact-form-box button {
    background: linear-gradient(135deg,#ff5314,#ff7a3c);
    color: #fff;
    padding: 14px 40px;
    border-radius: 40px;
    border: none;
    transition: .4s;
}

.contact-form-box button:hover {
    transform: translateY(-5px);
    box-shadow: 0 20px 40px rgba(255,83,20,.4);
}


/* INFO BOX */

.contact-info-box {
    display: grid;
    gap: 25px;
}

.info-card {
    background: rgba(20,20,20,.9);
    border: 1px solid #333;
    padding: 35px;
    border-radius: 28px;
    transition: .4s;
}

.info-card:hover {
    transform: translateY(-6px);
    border-color: #ff5314;
}

.info-card h5 {
    color: #ff5314;
}

.info-card p,
.info-card a {
    color: #fff;
    text-decoration: none;
}


/* SOCIAL */

.social-icons {
    display: flex;
    gap: 15px;
}

.social-icons a {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #111;
    border: 1px solid #333;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ff5314;
}

.social-icons a:hover {
    background: #ff5314;
    color: #000;
}


/* MAP */

.contact-map iframe {
    width: 100%;
    height: 450px;
    border: none;
}


/* WHATSAPP */

.whatsapp-float {
    position: fixed;
    right: 25px;
    bottom: 25px;
    background: #25D366;
    color: #fff;
    width: 55px;
    height: 55px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 26px;
    z-index: 999;
    box-shadow: 0 15px 40px rgba(0,0,0,.4);
    transition: .4s;
}

.whatsapp-float:hover {
    transform: scale(1.1);
}


/* RESPONSIVE */

@media(max-width:991px){
.contact-grid{
grid-template-columns:1fr;
}

.contact-hero h1{
font-size:38px;
}
}


.aluminium-products-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr); /* 👈 4 per row */
    gap: 32px;
}
/* CARD */
.aluminium-card {
    background: linear-gradient(180deg,#0b0b0b,#151515);
    border-radius: 18px;
    overflow: hidden;
    position: relative;
    transition: all .45s ease;
    box-shadow: 0 30px 80px rgba(0,0,0,.6);
}

.aluminium-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(120deg,transparent,rgba(255,255,255,.15),transparent);
    opacity: 0;
    transition: .6s;
}

.aluminium-card:hover::before {
    opacity: 1;
}

/* LINK RESET */
.card-link {
    color: inherit;
    text-decoration: none;
    display: block;
}

/* IMAGE */
.card-image {
    overflow: hidden;
    height: 240px;
}

.card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .8s ease;
}

.aluminium-card:hover img {
    transform: scale(1.15);
}

/* CONTENT */
.card-content {
    padding: 26px;
}

.product-title {
    font-size: 1.3rem;
    font-weight: 600;
    margin-bottom: 10px;
    color: #fff;
}

.product-desc {
    font-size: .95rem;
    color: #cfcfcf;
    margin-bottom: 14px;
}

.ideal-for {
    font-size: .8rem;
    color: #9ad7ff;
    margin-bottom: 14px;
}

/* FEATURES */
.features {
    list-style: none;
    padding: 0;
    margin: 0;
}

.features li {
    font-size: .85rem;
    color: #bfbfbf;
    padding-left: 18px;
    position: relative;
    margin-bottom: 8px;
}

.features li::before {
    content: "•";
    color: #4db8ff;
    position: absolute;
    left: 0;
}

/* HOVER FLOAT */
.aluminium-card:hover {
    transform: translateY(-12px);
    box-shadow: 0 50px 120px rgba(0,0,0,.9);
}
@media (max-width: 1200px) {
    .aluminium-products-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 900px) {
    .aluminium-products-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 520px) {
    .aluminium-products-grid {
        grid-template-columns: 1fr;
    }
}
.btnhero{	    margin-left: 10px;}
.head-menu
{
	 display: none;
}

@media (max-width: 1024px) {
    .head-menu {
        display: block !important;
    }
}

@media (max-width: 1024px) {
    .banner-text {
        top: 40% !important;
    }
	.social-link {
    
    position: relative;
    float: left;
    margin-left: 10px;
}

.home_intro_wrap .sticky_circle_wrap {
    height: 89dvh !important;
  
}
.nav-link
{
	    color: #ffffff  !important;
}
}
.footer-menu ul {
    list-style: none;
    padding: 0;
}

.footer-menu li {
    margin-bottom: 8px;
}

.footer-menu a {
    color: #fff;
    text-decoration: none;
    font-size: 14px;
}

.footer-menu a:hover {
    color: #ddd;
}