@import url(../css/aos.css);
@import url(../css/animate.css);
@import url(../css/swiper.min.css);
@import url(../css/default.css);
@import url(../css/fancybox.css);
@import url('https://fonts.googleapis.com/css2?family=Great+Vibes&family=Sora:wght@100..800&display=swap');


:root {
    /* Colors: */
    --color-ff7f01: #ff7f01;
    --color-gredient: linear-gradient(90deg, #f59900 0%, #fdc100 100%);
    --color-3d200b: #3d200b;
    --color-4b0001: #4b0001;
    --color-282728: #282728;
    --color-f1f1f1: #f1f1f1;
    --color-f6f6f6: #f6f6f6;
    --color-f5f5f5: #f5f5f5;
    --color-484848: #484848;
    --color-c2c4c6: #c2c4c6;
    --color-000000: #000000;
    --color-ffffff: #ffffff;
    --font-Sora: "Sora", sans-serif;
    --font-Great-Vibes: "Great Vibes";
    --font-quiche: "Quiche Display Regular";
    --font-style-normal: normal;
    --font-size-15: 15px;
    --font-size-16: 16px;
    --font-size-17: 17px;
    --font-size-19: 19px;
    --font-size-22: 22px;
    --font-size-25: 25px;
    --font-size-26: 26px;
    --font-size-27: 27px;
    --font-size-33: 30px;
    --font-size-38: 38px;
    --font-size-41: 41px;
    --font-size-45: 45px;
    --font-size-48: 48px;
    --font-size-50: 50px;
    --font-size-56: 54px;
    --font-size-66: 66px;
    --character-spacing-0: 0px;
    --line-height-22: normal;
    --line-height-25: 25px;
    --line-height-27: 27px;
    --line-height-30: 30px;
    --line-height-32: 32px;
    --line-height-35: 35px;
    --line-height-36: 36px;
    --line-height-43: 43px;
    --line-height-51: 51px;
    --line-height-60: normal;
    --line-height-66: 66px;
    --line-height-78: 78px;
    --line-height-inherit: inherit;
    --font-weight-Thin: 100;
    --font-weight-ExtraLight: 200;
    --font-weight-Light: 300;
    --font-weight-Regular: 400;
    --font-weight-Medium: 500;
    --font-weight-SemiBold: 600;
    --font-weight-Bold: 700;
    --font-weight-ExtraBold: 800;
    --font-weight-Black: 900;
    --font-weight-normal: normal;
}

/* Custom  Font */

@font-face {
    font-family: "Quiche Display Regular";
    font-style: normal;
    font-weight: normal;
    src: local('Quiche Display Regular'),
         url('/font/Quiche_Display_Regular.otf') format('opentype');
}

.great-vibes-regular {
  font-family: "Great Vibes";
  font-style: normal;
}
.sora {
  font-family: "Sora", sans-serif;
  font-style: normal;
}

* {
    outline: 0;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: var(--font-Sora);
    font-style: var(--font-style-normal);
    font-size: var(--font-size-19);
    line-height: var(--line-height-30);
    color: var(--color-000000);
    font-weight: var(--font-weight-Regular);
    margin: 0;
    padding: 0;
    overflow-x: hidden;
}

body {
    min-height: auto !important;
}

.img {
    width: 100%;
}

a,
.btn,
button {
    color: var(--color-ffffff);
    outline: none;
    cursor: pointer;
    outline: 0;
    text-decoration: none;
    -webkit-transition: all 0.5s ease-out 0s;
    -moz-transition: all 0.5s ease-out 0s;
    -ms-transition: all 0.5s ease-out 0s;
    -o-transition: all 0.5s ease-out 0s;
    transition: all 0.5s ease-out 0s;
}

a:focus,
.btn:focus,
button:focus,
.custom-select:focus,
.form-control:focus {
    outline: none;
    box-shadow: none;
}

.btn:hover,
a:hover,
button:hover {
    color: var(--color-gredient);
    text-decoration: none;
    -webkit-transition: all 0.5s ease-out 0s;
    -moz-transition: all 0.5s ease-out 0s;
    -ms-transition: all 0.5s ease-out 0s;
    -o-transition: all 0.5s ease-out 0s;
    transition: all 0.5s ease-out 0s;
}

h4,
h2,
h3,
h4,
h5,
h6 {
    color: var(--color-000000);
    text-transform: normal;
    margin-bottom: 15px;
}

ul,
ol {
    margin: 0px;
    padding: 0px;
}

li {
    list-style: none;
}

.light-bg {
    background: #f9f7f7;
}

header,
footer,
section {
    width: 100%;
    float: left;
}

section {
    overflow: hidden;
}

section.section-space.video-section,
.about-section {
    overflow: visible !important;
}

hr {
    border-bottom: 1px solid var(--color-c2c4c6);
    border-top: 0 none;
    margin: 40px 0;
    padding: 0;
    opacity: 1;
}

p {
    font-size: var(--font-size-16);
    font-weight: var(--font-weight-Regular);
    font-family: var(--font-Sora);
    color: var(--color-000000);
    line-height: 22px;
    margin-bottom: 15px;
}

.p-content {
    font-size: var(--font-size-19);
    font-weight: var(--font-weight-SemiBold);
    color: var(--color-gredient);
    margin-bottom: 15px;
}

.small-text {
    font-size: var(--font-size-15);
    line-height: var(--line-height-27);
    color: var(--color-000000);
    margin-bottom: 15px;
}

.main-title {
    font-size: var(--font-size-41);
    font-weight: var(--font-weight-SemiBold);
    font-family: var(--font-Sora);
    margin-bottom: 15px;
    text-transform: capitalize;
}

.title {
  font-size: 55px;
  font-family: var(--font-quiche);
  font-weight: var(--font-weight-Medium);
  line-height: 66px;
  color: var(--color-3d200b);
  margin-bottom: 15px;
}


.div-title {
    font-size: var(--font-size-16);
    font-family: var(--font-Sora);
    text-transform: uppercase;
    font-weight: var(--font-weight-Regular);
    margin-bottom: 15px;
}

.div-text {
    font-size: var(--font-size-27);
    line-height: var(--line-height-36);
    font-family: var(--font-Sora);
    text-transform: uppercase;
    color: var(--color-000000);
    font-weight: var(--font-weight-Medium);
    margin-bottom: 15px;
}

.font-sora--font-Sora {
    font-family: var(--font-Sora);
}

.weight-Light {
    font-weight: var(--font-weight-Light);
}

.weight-Regular {
    font-weight: var(--font-weight-Regular);
}

.weight-Medium {
    font-weight: var(--font-weight-Medium);
}

.weight-SemiBold {
    font-weight: var(--font-weight-SemiBold);
}

.weight-Bold {
    font-weight: var(--font-weight-Bold);
}

.weight-ExtraBold {
    font-weight: var(--font-weight-ExtraBold);
}

.weight-Black {
    font-weight: var(--font-weight-Black);
}

.height-100 {
    height: 100vh;
}

.pr-100 {
    padding-right: 100px;
}

.pl-100 {
    padding-left: 100px;
}

.color-ff7f01 {
    color: var(--color-ff7f01) !important;
}

.color-gredient {
    color: var(--color-gredient) !important;
}

.btn-style {
    padding: 12px 30px;
    background: var(--color-000000);
    color: var(--color-d2a800);
    text-transform: uppercase;
    font-size: var(--font-size-14);
    font-weight: var(--font-weight-Bold);
}

.explore_btn {
    width: fit-content;
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 6px 15px;
    font-weight: var(--font-weight-Regular);
    font-size: 13px;
    color: var(--color-ffffff);
    background: var(--color-ff7f01);
    text-transform: uppercase;
    border: 1px solid var(--color-ff7f01);
    border-radius: 50px;
    letter-spacing: 0;
    text-decoration: none;
    overflow: hidden;
    -webkit-transition: all 0.5s ease-out 0s;
    -moz-transition: all 0.5s ease-out 0s;
    -ms-transition: all 0.5s ease-out 0s;
    -o-transition: all 0.5s ease-out 0s;
    transition: all 0.5s ease-out 0s;
}
.explore_btn-white{
       width: fit-content;
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 6px 15px;
    font-weight: var(--font-weight-Regular);
    font-size: 13px;
    color: var(--color-ff7f01);
    background: var(--color-ffffff);
    text-transform: uppercase;
    border: 1px solid var(--color-ffffff);
    border-radius: 50px;
    letter-spacing: 0;
    text-decoration: none;
    overflow: hidden;
    -webkit-transition: all 0.5s ease-out 0s;
    -moz-transition: all 0.5s ease-out 0s;
    -ms-transition: all 0.5s ease-out 0s;
    -o-transition: all 0.5s ease-out 0s;
    transition: all 0.5s ease-out 0s;
}


@keyframes borderMove {
    0% {
        background-position: 0% 50%, 0% 50%;
    }

    100% {
        background-position: 200% 50%, 200% 50%;
    }
}



.position-btn {
    position: fixed;
    bottom: 0;
    right: 5%;
    z-index: 99;
    border: 1px solid #fff;
    border-radius: 26px 26px 0 0 !important;
    padding-bottom: 6px !important;
}

.explore_btn:hover::before {
    left: 0;
}

.explore_btn span,
.explore_btn i {
    position: relative;
    z-index: 1;
}

.explore_btn i {
    color: #fff;
    border-radius: 50%;
    font-size: 20px;
    margin-left: 10px;
    -webkit-transition: all 0.5s ease-out 0s;
    -moz-transition: all 0.5s ease-out 0s;
    -ms-transition: all 0.5s ease-out 0s;
    -o-transition: all 0.5s ease-out 0s;
    transition: all 0.5s ease-out 0s;
    align-items: center;
    justify-content: center;
}

.explore_btn:hover i {
    margin-left: 0;
    color: var(--color-ff7f01);



}

.explore_btn:hover {
    color: var(--color-ff7f01);
    background: var(--color-ffffff);

}

.img-zoom {
    overflow: hidden;
}
.explore_btn-white:hover::before {
    left: 0;
}

.explore_btn-white span,
.explore_btn-white i {
    position: relative;
    z-index: 1;
}

.explore_btn-white i {
    color: var(--color-ff7f01);
    border-radius: 50%;
    font-size: 20px;
    margin-left: 10px;
    -webkit-transition: all 0.5s ease-out 0s;
    -moz-transition: all 0.5s ease-out 0s;
    -ms-transition: all 0.5s ease-out 0s;
    -o-transition: all 0.5s ease-out 0s;
    transition: all 0.5s ease-out 0s;
    align-items: center;
    justify-content: center;
}

.explore_btn-white:hover i {
    margin-left: 0;
    color: var(--color-ffffff);



}

.explore_btn-white:hover {
    color: var(--color-ffffff);
    background: var(--color-ff7f01);

}

.img-zoom .zoom {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: all 2.5s ease-out 0s;
    -moz-transition: all 2.5s ease-out 0s;
    -ms-transition: all 2.5s ease-out 0s;
    -o-transition: all 2.5s ease-out 0s;
    transition: all 2.5s ease-out 0s;
}

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


/* @import url(../css/root.css); */




/* loader css*/


/* loader css */

.main-nav {
    background: transparent;
    padding: 30px 0px;
    width: 100%;
    float: left;
}

.main-nav .navbar {
    padding: 0;
    width: 100%;
    float: left;
}

.main-nav .navbar-expand-lg .navbar-brand {
    position: absolute;
    top: -20px;
    margin-right: 0;
    -webkit-transition: all 0.5s ease-out 0s;
    -moz-transition: all 0.5s ease-out 0s;
    -ms-transition: all 0.5s ease-out 0s;
    -o-transition: all 0.5s ease-out 0s;
    transition: all 0.5s ease-out 0s;
}

.main-nav .navbar-expand-lg .navbar-brand img,
.main-nav .navbar-expand-lg .navbar-brand .svg {
    width: 160px;
    object-fit: contain;
    -webkit-transition: all 0.5s ease-out 0s;
    -moz-transition: all 0.5s ease-out 0s;
    -ms-transition: all 0.5s ease-out 0s;
    -o-transition: all 0.5s ease-out 0s;
    transition: all 0.5s ease-out 0s;
}

.main-nav .navbar-nav .nav-item .nav-link {
    position: relative;
    display: block;
    font-size: var(--font-size-19);
    color: var(--color-ffffff);
    font-weight: var(--font-weight-SemiBold);
    line-height: var(--line-height-inherit);
    padding: 8px 10px;
    text-transform: uppercase;
}

.main-nav .navbar-nav .nav-item {
    padding-left: 40px;
}

.main-nav .navbar-nav .nav-item .nav-link:focus,
.main-nav .navbar-nav .nav-item.active .nav-link,
.main-nav .navbar-nav .nav-item .nav-link:hover {
    color: var(--color-0e1f45);
}

.main-nav .navbar-nav .nav-item .nav-link.show,
.main-nav .navbar-nav .nav-item .show>.nav-link {
    color: var(--color-f68e1f);
}


/* dropdown-menu */

.main-nav .navbar-nav .nav-item.dropdown .dropdown-item:focus,
.main-nav .navbar-nav .nav-item.dropdown .dropdown-item:hover {
    background-color: transparent;
}

.main-nav .navbar-nav .dropdown .dropdown-menu {
    min-width: 200px;
    width: 200px;
    margin: 0;
    top: 100%;
    padding: 0px;
    background-color: var(--color-ffffff);
    border: none;
    box-shadow: 0px 0px 10px -4px #0000009d;
    z-index: 9;
}

.main-nav .navbar-nav .dropdown .dropdown-menu .dropdown-item {
    width: 100%;
    float: left;
    font-size: var(--font-size-16);
    color: var(--color-000000);
    background-color: var(--color-ffffff);
    padding: 10px 10px;
    text-transform: uppercase !important;
}




a.btn-link {
    width: fit-content;
    display: flex;
    border-radius: 50px;
    color: var(--color-ffffff);
    text-decoration: none;
    font-size: 18px;
    transition: 0.4s;
    font-weight: var(--font-weight-SemiBold);
}

.arrow-circul {
    width: 40px;
    height: 40px;
    border-radius: 50px;
    text-align: center;
    transition: 0.5s;
    position: relative;
    right: -10px;
    transform: rotate(56deg);
}


.arrow-circul i {
    color: var(--color-ffffff);
    font-size: 25px;
    position: relative;
    bottom: 2px;
    right: 6px;

}

a.btn-link:hover {
    transition: 0.4s;
    color: var(--color-000000);
}



a.btn-link:hover .arrow-circul i {
    color: var(--color-000000);
}

a.btn-link:hover .arrow-circul {
    transform: rotate(0deg);
}

.section-space {
    padding: 80px 50px;
}



/* main-banner */
.banner {
    position: relative;
    height: 750px;
}
.banner-left {
  padding-left: 6%;
}
.banner-subtitle {
    width: fit-content;
  font-family: var(--font-Great-Vibes);
  font-size: 100px;
  font-weight: 400;
  color: var(--color-3d200b);
  position: relative;
}
.banner-subtitle span {
    position: absolute;
    right: -50%;
    bottom: -10px;
    font-family: var(--font-quiche);
    font-size: var(--font-size-45);
  color: var(--color-ff7f01);
  font-weight: 600;
}
.banner-title {
  font-size: 140px;
  font-family: var(--font-quiche);
  font-weight: 700;
  line-height: 100px;
  color: var(--color-3d200b);
  margin-bottom: 20px;
}
.third{
    font-size: 60px;
  font-family: var(--font-quiche);
  color: var(--color-3d200b);

}
.explore-btn {
  display: inline-block;
  background: #ff7a1f;
  color: #fff;
  padding: 12px 28px;
  border-radius: 25px;
  font-size: 16px;
  font-weight: 600;
  text-decoration: none;
  transition: 0.3s ease;
}
.explore-btn:hover {
  background: #e65e00;
}

/* Right Image Section */
.banner-right {
  position: relative;
  display: flex;
  justify-content: flex-end;
}
.banner-image-wrapper {
  width: 100%;
  position: relative;
}
.banner-main-img {
  width: 100%;
  height: 750px;
  border-radius: 0;
}
.banner-overlay-img {
  position: absolute;
  top: 12%;
  left: -10%;
  width: 400px;
  height: 550px;
  border-radius: 250px 250px 0 0;
  border: 15px solid #FFF;
  overflow: hidden;
  /* box-shadow: 0px 10px 25px rgba(0,0,0,0.2); */
}
.banner-overlay-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 0;
}
/* Text Animations */
.swiper-slide-active .third {
  animation: fadeInDown 1s ease forwards;
}
.swiper-slide-active .banner-subtitle {
  animation: fadeInUp 1.2s ease forwards;
}
.swiper-slide-active .banner-title{
  animation: fadeInLeft 1.2s ease forwards;

}
.swiper-slide-active .explore-btn {
  animation: bounceIn 1.5s ease forwards;
}

/* Image Animations */
.swiper-slide-active .banner-main-img {
  animation: fadeInUp 1.5s ease forwards;
}
.swiper-slide-active .banner-overlay-img {
  animation: fadeInDown 1.5s ease forwards;
}

/* Keyframes */
@keyframes fadeInDown {
  from { opacity: 0; transform: translateY(-40px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(40px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes bounceIn {
  0% { opacity: 0; transform: scale(0.5); }
  60% { opacity: 1; transform: scale(1.1); }
  100% { transform: scale(1); }
}
@keyframes zoomIn {
  from { transform: scale(1.1); opacity: 0; }
  to { transform: scale(1); opacity: 1; }
}
@keyframes slideInLeft {
  from { opacity: 0; transform: translateX(-100px); }
  to { opacity: 1; transform: translateX(0); }
}

.banner .swiper-pagination {
bottom: 10%;
    left: -200px;
    text-align: center;
}

.banner .swiper-pagination-bullet {
  margin: 0px 4px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--color-3d200b);
}

.banner .swiper-pagination-bullet-active {
  background: #ff6600; 
  opacity: 1;
}   
/* why-choose */
.why-choose {
    background:url(../images/why-bg.jpg)center no-repeat;
    background-size: cover;
    position: relative;
    padding-bottom: 100px;
}
.icon {
  text-align: center;
}
.why-choose h2{
    margin-bottom: 50px;
}

.choose-icon-circle {
  background: #4b0001; /* dark maroon circle */
  width: 120px;
  height: 120px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 20px;
}

.choose-icon-circle img {
  width: 80px;
  height: auto;
}

.icon h4 {
  font-size: 27px;
  color: var(--color-ffffff);
}
ul.why-choose-list {
    display: flex;
    justify-content: space-between;
    gap: 0;
    padding: 0 15%;
}

/* why-choose */

/* counter */
.counter-section {
    height: 540px;
    display: flex;
    justify-content: space-around;
    text-align: center;
    padding-top: 70px;
    background: url(../images/counter-bg.jpg) bottom no-repeat;
    background-size: cover;
    padding-bottom: initial;
}



.counter {
    font-weight: var(--font-weight-Bold);
  color: var(--color-ff7f01); /* orange */
}

.counter-box p {
  margin-top: -10px;
  font-size: 16px;
  font-weight: var(--font-weight-SemiBold);
  color: var(--color-4b0001);
}
.counter-box h3{
    color: var(--color-ff7f01);
    font-weight: var(--font-weight-Bold);
}
.counter-flex {
    display: flex
;
    flex-direction: row;
    justify-content: center;
    gap: 0 150px;
}
/* counter */
/* projects */
.projects {
  background: linear-gradient(0deg, rgb(255 127 1) 50%, rgba(0, 0, 0, 0) 50%);
  padding: 80px 0;
  text-align: center;
}
.projects h2{
    color: #3d200b;
}
.projects p {
    width: 70%;
    color: var(--color-ffffff);
    margin: 0;
    opacity: 0.8;

    display: -webkit-box;
    -webkit-line-clamp: 2;   /* show only 2 lines */
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
.projects button{
    padding: 0;
    color: var(--color-000000);
}
.projects .explore_btn i {
    margin-left: 0px;
    color: var(--color-000000);
}
.projects button:hover{
    background: transparent;
    color: #FFF;
}
.projects .explore_btn:hover i {
    margin-left: 0;
    color: var(--color-ffffff);
}
.project-flex {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.project-box {
  overflow: hidden;
  padding: 0 15px;
}

.project-img img {
  width: 100%;
  height: auto;
  display: block;
 border-radius: 12px;
}

.project-content {
  padding: 30px 0;
  text-align: left;
  color: #fff;
}

.project-title {
  font-size: 27px;
  color: var(--color-ffffff);
  font-weight: var(--font-weight-SemiBold);
}

.view-projects {
  color: #fff;
  font-weight: 600;
  margin-top: 15px;
  display: inline-block;
  text-decoration: none;
}

.view-projects i {
  margin-left: 8px;
}
/* projects */
/* services */
.services{
    background: var(--color-3d200b);
    padding-bottom: 150px;
}
img.services-img {
    width: 92%;
    border-radius: 12px;
}
ul.services-list li a {
    display: flex;
    justify-content: space-between;
    color: #fff;
    position: relative;
    padding: 35px 0;
    border-bottom: 2px solid #8e4806;
}
ul.services-list li a:hover{
    color: var(--color-ff7f01);
}
.services-list h3{
    color: var(--color-ffffff);
    margin: 0;
    -webkit-transition: all 0.5s ease-out 0s;
    -moz-transition: all 0.5s ease-out 0s;
    -ms-transition: all 0.5s ease-out 0s;
    -o-transition: all 0.5s ease-out 0s;
    transition: all 0.5s ease-out 0s;
}
.services-list a:hover h3{
    color: var(--color-ff7f01);
}
.services-list h3 span{
    font-size: 19px;
    margin-right: 30px;
    color: var(--color-ff7f01);
}
.services-list ul li i{
    color: var(--color-ffffff);
}
img.small-img {
    position: absolute;
    width: 200px;
    right: 10%;
    bottom: -10%;
    opacity: 0;
            -webkit-transition: all 0.5s ease-out 0s;
    -moz-transition: all 0.5s ease-out 0s;
    -ms-transition: all 0.5s ease-out 0s;
    -o-transition: all 0.5s ease-out 0s;
    transition: all 0.5s ease-out 0s;
}
.services-list a:hover img{
        bottom: 20px;
        opacity: 1;

}
/* services */
/* process */
.process h2 {
    color: #3d200b;
    margin-bottom: 80px;
}

    .process-container {
      display: flex;
      /* align-items: flex-start; */
      /* gap: 35px; */
      width: 100%;
      /* flex-direction: row; */
      justify-content: center;
    }
.process {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: 50px; /* spacing between steps */
}

.step {
  text-align: center;
  flex: 0 0 auto;
}

.step-icon {
  background: #e87a1e;
  width: 110px;
  height: 110px;
  /* border: 50px solid #fff; */
  border-radius: 50%;
  padding: 25px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 15px;
  position: relative;
}
.step-icon::after {
    content: "";
    width: 144px;
    height: 144px;
    position: absolute;
    background: #fff;
    border-radius: 50%;
    z-index: -9;
}

.step-icon::before {
  content: "";
  position: absolute;
  width: 150px;
  height: 150px;
  background: linear-gradient(90deg,rgba(234, 117, 1, 1) 50%, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 52%, rgba(75, 0, 1, 1) 52%);
  border-radius: 50%;
  top: -20px;
  left: -20px;
  z-index: -9;
}

.process h3 {
  text-transform: capitalize;
  color: #3d200b; /* same as your var(--color-3d200b) */
  margin: 10px 0;
  margin-top: 40px;
  font-weight: 600;
}

.process p {
  font-size: 14px;
  color: #555;
  max-width: 180px;
  margin: 0 auto;
}
.step {
    position: relative;
    margin: 0 30px;
    width: 180px;
}

.step:before {
    width: 100px;
    height: 2px;
    content: "";
    background: linear-gradient(90deg,rgba(234, 117, 1, 1) 50%, rgba(75, 0, 1, 1) 50%);
    position: absolute;
    top: 20%;
    right: -80px;
    z-index: -9;
}

.step.before-none:before {
    display: none;
}

/* process */
/* logo-slider */
.logo-slider {
  overflow: hidden;
  white-space: nowrap;
  width: 100%;
  background: #f1f1f1;
  padding: 50px 0;
}

.logo-track {
  display: flex;
  animation: scroll 60s linear infinite;
}

.logo-slider:hover .logo-track {
  animation-play-state: paused; /* pause on hover */
}

.logo-track img {
  width: 250px;
  margin: 0 30px;
  transition: 0.3s;
}

.logo-track img:hover {
  filter: grayscale(0%);
  transform: scale(1.1);
}

@keyframes scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
/* logo-slider */
/* solutions */
.solutions {
    position: relative;
}
.solutions img.spin {
    position: absolute;
    left: -15%;
    bottom: -40%;
    z-index: -9;
    animation: rotate 10s linear infinite;
}
.card {
    width: 100%;
    border: none;
    border-radius: 26px;
    overflow: hidden;
    position: relative;
    margin-top: 30px;
}

.card-main:hover {
    box-shadow: none;
}

.card::before {
    content: "";
    width: 100%;
    height: 70px;
    position: absolute;
    background: linear-gradient(to right, #ff7f01, #ff7f01);
    z-index: 9;
    bottom: 0;
    opacity: 1;
    -moz-transition: all 0.5s ease-out 0s;
    -ms-transition: all 0.5s ease-out 0s;
    -o-transition: all 0.5s ease-out 0s;
    transition: all 0.5s ease-out 0s;
}

.card::after {
    content: "";
    width: 100%;
    height: 70px;
    position: absolute;
    background: linear-gradient(to right, #f8b500, #ffeb3b);
    z-index: 9;
    bottom: 0;
    opacity: 0;
    -moz-transition: all 0.5s ease-out 0s;
    -ms-transition: all 0.5s ease-out 0s;
    -o-transition: all 0.5s ease-out 0s;
    transition: all 0.5s ease-out 0s;
}

.card:hover::before {
    opacity: 0;
}

.card:hover::after {
    opacity: 1;
}

.card:hover .card-icon {
    background: var(--color-gredient);
    border-color: transparent;
}

.card:hover img.img-1 {
    width: 0%;
    opacity: 0;
}

.card:hover img.img-fluid.img-2 {
    width: 100%;
    opacity: 1;
}

img.img-1 {
    width: 100%;
    opacity: 1;
    -webkit-transition: all 0.5s ease-out 0s;
    -moz-transition: all 0.5s ease-out 0s;
    -ms-transition: all 0.5s ease-out 0s;
    -o-transition: all 0.5s ease-out 0s;
    transition: all 0.5s ease-out 0s;
}

img.img-2 {
    width: 0;
    opacity: 0;
    -webkit-transition: all 0.5s ease-out 0s;
    -moz-transition: all 0.5s ease-out 0s;
    -ms-transition: all 0.5s ease-out 0s;
    -o-transition: all 0.5s ease-out 0s;
    transition: all 0.5s ease-out 0s;
}

.card-content h3 {
    font-size: var(--font-size-22);
    color: #282728;
    font-weight: var(--font-weight-SemiBold);
    opacity: 0.8;
}

.card-image {
    position: relative;
    border-radius: 70% 0 0 0;
}

.card-icon {
    width: 90px;
    height: 90px;
    padding: 20px;
    background: #fff;
    border: 2px solid var(--color-ff7f01);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 150px;
    left: 20px;
    z-index: 100;
}

.card-content {
    padding: 60px 20px 20px;
    margin-bottom: 10px;
    border-radius: 0 0 26px 26px;
    text-align: left;
    background: #f5f6f7;
    /* box-shadow: 0px 10px #ff7f01; */
    position: relative;
    z-index: 99;
}

.card-content:hover {
    box-shadow: 0px 10px linear-gradient(90deg, #f59900 0%, #fdc100 100%);
}


.card-content p {
    font-size: 14px;
    color: #777;
    margin: 10px 0 20px;
}


.card .read-more {
    justify-content: flex-start;
}

.card .read-more i {
    background: var(--color-ff7f01);
    color: var(--color-ffffff);
    -webkit-transition: all 0.5s ease-out 0s;
    -moz-transition: all 0.5s ease-out 0s;
    -ms-transition: all 0.5s ease-out 0s;
    -o-transition: all 0.5s ease-out 0s;
    transition: all 0.5s ease-out 0s;
}

.card:hover .read-more i {
    background: var(--color-gredient);
    rotate: 180deg;
}

.card .read-more a {
    background: var(--color-ff7f01);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.card:hover .read-more a {
    background: var(--color-gredient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* solutions */

/* advantages */
.advantages {
    position: relative;
    background: var(--color-ff7f01);
}
.advantages img.spin {
    position: absolute;
    right: -15%;
    top: -40%;
    z-index: 9;
    animation: rotate 10s linear infinite;
}

.tab-buttons {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    margin-bottom: 20px;
}

.tab-buttons button {
    font-size: var(--font-size-22);
    padding: 15px 0px;
    padding-right: 30px;
    border: none;
    background: transparent;
    color: #ffffffac;
    cursor: pointer;
    transition: all 0.3s ease;
    font-weight: var(--font-weight-SemiBold);
    position: relative;
}

.tab-buttons button::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1px;
    /* Thickness of the border */
    background: linear-gradient(to right, #fff, #fff);
}

.tab-buttons button.active {
    background: var(--color-gredient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.tab-buttons button.active::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 90%;
    height: 1px;
    /* Thickness of the border */
    background: var(--color-gredient);
}

.tab-buttons button:hover {
    background: var(--color-gredient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.tab-contents {
    margin-top: 50px;
    position: relative;
}

.tab-content {
    display: none;
    transition: opacity 0.5s ease;
}

.tab-content.active {
    display: flex;
    opacity: 1;
    gap: 100px;
}

.tab-content img {
    width: 70%;
    border-radius: 0;
    margin-bottom: 0;
    animation: fadeInUp 1.5s;
}

.tab-content p {
    width: 30%;
    color: var(--color-ffffff);
    animation: fadeInLeft 1.5s;
}

/* advantages */
/* clintel */
.slider {
    overflow: hidden;
    white-space: nowrap;
    box-sizing: border-box;
    width: 100%;
    padding: 20px 0;
}

.slider-track {
    display: inline-flex;
    animation: scroll 20s linear infinite;
}

.slide {
    flex: 0 0 auto;
    margin: 0 15px;
    padding: 3px;
    border-radius: 10px;
    background: linear-gradient(0deg, rgb(214 214 214 / 45%) 0%, rgb(247 246 246 / 78%) 100%);
}

.slide img {
    padding: 15px;
    width: 180px;
    height: 100px;
    border-radius: 10px;
    object-fit: contain;
    background: #fff;
    /* box-shadow: 0 2px 6px rgba(0,0,0,0.1); */
}

@keyframes scroll {
    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(-50%);
    }
}
.clients-text {
    padding-left: 250px;
    padding-right: 50px;
    margin-right: 50px;
    border-right: 2px solid #cccccc;
}
/* clintel */

/* product */

.project-section {
    background: var(--color-gredient);
    position: relative;
    background-repeat: no-repeat;
    z-index: 9;
}

.project-section button {
    margin-top: 30px;
}


.product-title-card {
    margin-bottom: 30px;
}

h2.product-title {
    font-size: 22px;
    font-weight: 600;
}

.product-img img {
    width: 100%;
    height: 400px;
    opacity: 1;
    -webkit-transition: all 0.5s ease-out 0s;
    -moz-transition: all 0.5s ease-out 0s;
    -ms-transition: all 0.5s ease-out 0s;
    -o-transition: all 0.5s ease-out 0s;
    transition: all 0.5s ease-out 0s;
}

.product-img1 img {
    width: 100%;
    height: 625px;
    object-fit: cover;
    border-radius: 16px;
}

h2.product-title {
    font-size: var(--font-size-19);
    font-weight: var(--font-weight-SemiBold);
    background: #ff7f01e0;
    text-align: center;
    padding: 12px 5px
}

.product-inner {
    z-index: 999;
    overflow: hidden;
    border-radius: 8px;
    position: relative;
    margin-bottom: 25px;
    -webkit-transition: all 0.5s ease-out 0s;
    -moz-transition: all 0.5s ease-out 0s;
    -ms-transition: all 0.5s ease-out 0s;
    -o-transition: all 0.5s ease-out 0s;
    transition: all 0.5s ease-out 0s;
}

.product-inner-text {
    background: linear-gradient(0deg, #ffffff, #ffffff00);
    padding: 5%;
    padding-top: 100px;
    padding-bottom: 20px;
    display: flex;
    position: absolute;
    width: 100%;
    bottom: 0px;
    -webkit-transition: all 0.5s ease-out 0s;
    -moz-transition: all 0.5s ease-out 0s;
    -ms-transition: all 0.5s ease-out 0s;
    -o-transition: all 0.5s ease-out 0s;
    transition: all 0.5s ease-out 0s;
    justify-content: space-between;
    align-items: center;
}
.product-inner-text a h4:hover{
    color: var(--color-ff7f01);
}

.project-right h4 {
    text-transform: capitalize;
        -webkit-transition: all 0.5s ease-out 0s;
    -moz-transition: all 0.5s ease-out 0s;
    -ms-transition: all 0.5s ease-out 0s;
    -o-transition: all 0.5s ease-out 0s;
    transition: all 0.5s ease-out 0s;
    margin-bottom: 0;
}
.project-right h4:hover{
    color: var(--color-ff7f01);
}
.project-left .read-more i {
    background: var(--color-ff7f01);
    color: var(--color-ffffff);
}
.project-left a:hover .read-more i {
    rotate: 180deg;
}


.list-pointing li {
    list-style-type: disc;
    font-size: 15px;
    line-height: 20px;
    margin-bottom: 10px;
}

.product-img {
    background: #000;
    border-radius: 8px;
    -webkit-transition: all 0.5s ease-out 0s;
    -moz-transition: all 0.5s ease-out 0s;
    -ms-transition: all 0.5s ease-out 0s;
    -o-transition: all 0.5s ease-out 0s;
    transition: all 0.5s ease-out 0s;

}

.product-card {
    overflow: hidden;
    border-radius: 8px;

}

.product-card:hover .product-inner-text {
    bottom: -10px;

}
.project-section img.spin {
    position: absolute;
    left: -20%;
    bottom: 20%;
    z-index: -9;
    animation: rotate 10s linear infinite;
}
/* projects */
/* testimonials */
.testimonial {
    overflow: hidden;
    position: relative;
    
}

.testimonial img.spin {
    width: 29%;
    position: absolute;
    right: -16%;
    bottom: 2%;
    z-index: 9;
    animation: rotate 10s linear infinite;
}
.testimonial .swiper-button-next,.testimonial .swiper-button-prev {
    top: 60%;
}
.testimonial .swiper-button-prev,.testimonial .swiper-container-rtl .swiper-button-next {
    left: 50px;
    right: auto;
}
.testimonial .swiper-button-next,.testimonial .swiper-container-rtl .swiper-button-prev {
    right: 50px;
    left: auto;
}

.testimonial-slider {
    position: relative;
    width: 110%;
    margin: auto;
    padding-top: 30px;
    overflow: hidden;
    z-index: 99;
    margin-top: 30px;
}
.testimonial-slider::before {
    content: "";
    position: absolute;
    width: 90%;
    background: #dfdfe0;
    height: 2px;
    top: 0;
}
.testimonial-slider::after {
    content: "";
    position: absolute;
    width: 50%;
    background: linear-gradient(90deg,rgba(0, 0, 0, 0) 0%, rgba(255, 255, 255, 1) 100%);

    height: 100%;
    top: 0;
    right: 0;
    z-index: 9;
}

.testimonial-card {
    background: #ffffff;
    border-radius: 12px;
    padding: 40px 0px;
    padding-right: 80px;
    padding-bottom: 00px;
    text-align: left;
    transition: all 0.3s ease;
    opacity: 1;
    border: 2px solid transparent;
}


.testimonial-card p {
    line-height: 1.6;
    color: #000;
    font-size: 16px;
}

.author {
    display: flex;
    align-items: center;
    margin-top: 20px;
}

.author img {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    margin-right: 12px;
}

.author h4 {
    color: var(--color-000000);
    margin-bottom: 0;
    font-weight: bold;
}

.author span {
    font-size: 14px;
    color: #000;
}
.testimonial .swiper-button-next,
.testimonial .swiper-button-prev {
    width: 30px;
    height: 30px;
color: white;
    background-color: transparent;
    border: 1px solid #fff;
    padding: 20px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* testimonials */
/* gallaery */
.gallery{
    background: var(--color-3d200b);
}
.gallery-slider {
  width: 100%;
  margin: auto;
  padding: 50px 0;
  overflow: visible;
}
.gallery-slider .swiper-slide {
  transition: transform 0.5s ease; /* smooth animation */
}

.gallery-slider .swiper-slide:nth-child(odd) {
  transform: translateY(-30px); /* move odd slides up */
}

.gallery-slider .swiper-slide:nth-child(even) {
  transform: translateY(30px);  /* move even slides down */
}
.gallery-slider .swiper-slide {
  position: relative;
  overflow: hidden;
  transition: all 0.4s ease;
  filter: brightness(50%);
  opacity: 0.5;
}

.gallery-slider .swiper-slide-active,.gallery-slider .swiper-slide.swiper-slide-prev,.gallery-slider .swiper-slide.swiper-slide-next {
  filter: brightness(100%);
  opacity: 1;
}

.gallery-slider .slide-tag {
  position: absolute;
  top: 15px;
  left: 15px;
  background: #ff6a00;
  color: #fff;
  padding: 8px 12px;
  border-radius: 20px;
  font-size: 11px;
  line-height: normal;
  font-weight: var(--font-weight-Regular);
  text-transform: uppercase;
  z-index: 10;
}

.gallery-slider .slide-content h3 {
    display: none;
    margin-bottom: 0;
    color: var(--color-ff7f01);
  font-size: 16px;
  font-weight: bold;
  z-index: 10;
}

.gallery-slider .slide-content span {
  display: none;
  font-size: 13px;
  color: #ddd;
}
/* gallaery */


/* footer */

.footer {
    width: 100%;
    background: url(../images/footer-bg.jpg)right no-repeat;
    background-size: cover;
    position: relative;
    overflow: hidden;
    padding-top: 80px;
    padding-bottom: 50px;
}
.footer h2{
    font-family: var(--font-quiche);
    font-size: var(--font-size-41);
    color: var(--color-282728);
    font-weight: var(--font-weight-ExtraBold);
}


.footer img.spin {
    width: 51%;
    position: absolute;
    right: 0%;
    bottom: 0%;
    z-index: 9;
    animation: rotate 10s linear infinite;
}
/* copy-right  */

.copy-right {
    margin-top: 75px;
    padding-bottom: 0;
}

.copy-right p,
.copy-right p a {
    font-size: var(--font-size-16);
    color: #000;
    margin-bottom: 0;
}

.copy-right p span {
    float: right;
}

.copy-right p a {
    color: var(--color-ff7f01);
}

ul.footer-contact {
    position: relative;
    z-index: 99;
    display: flex;
    justify-content: space-between;
    margin-top: 30px;
    flex-direction: column;
    gap: 30px;
}

ul.footer-contact li i{
    display: none;
}
ul.footer-contact li .details p{
    font-size: var(--font-size-16);
    color: var(--color-ff7f01);
    font-weight: var(--font-weight-SemiBold);
    margin: 0;
}
ul.footer-contact li .details a{
    font-size: var(--font-size-16);
    line-height: 16px;
    color: var(--color-000000);
    font-weight: var(--font-weight-Regular);
    margin: 0;
}
ul.footer-contact li .details a:hover{
    color: var(--color-ff7f01);
}
ul.footer-contact li .details a p:hover{
    color: var(--color-ff7f01);
    
}
ul.footer-contact li .details a p{
    font-size: var(--font-size-16);
    line-height: 26px;
    color: var(--color-ffffff);
    font-weight: var(--font-weight-Regular);
    text-transform: none;
    margin: 0;
        -webkit-transition: all 0.5s ease-out 0s;
    -moz-transition: all 0.5s ease-out 0s;
    -ms-transition: all 0.5s ease-out 0s;
    -o-transition: all 0.5s ease-out 0s;
    transition: all 0.5s ease-out 0s;
}

ul.footer-social {
    display: flex;
    gap: 25px;
    margin-top: 30px;
    position: relative;
    z-index: 99;
}

ul.footer-social li i {
    font-size: 24px;
  scale: 1;
          -webkit-transition: all 0.5s ease-out 0s;
    -moz-transition: all 0.5s ease-out 0s;
    -ms-transition: all 0.5s ease-out 0s;
    -o-transition: all 0.5s ease-out 0s;
    transition: all 0.5s ease-out 0s;
   color: var(--color-ff7f01);
}
ul.footer-social li i:hover {
  scale: 1.2;
}
.footer-menu ul {
    display: flex;
    justify-content: space-between;
    margin-top: 0;
    padding-top: 0;
    flex-direction: column;
}
.footer-menu {
    position: relative;
    z-index: 99;
}
.footer-menu h3{
        font-size: var(--font-size-16);
    color: var(--color-ff7f01);
    font-weight: var(--font-weight-SemiBold);
        margin-top: 30px;
}

.footer-menu ul li a {
    color: var(--color-000000);
    font-size: 15px;
    
}
.footer-menu ul li a:hover{
        color: var(--color-ff7f01);

}
.footer-padding{
    padding-right: 35px;
}
p.addres-p{
    font-size: 16px!important;
    line-height: 26px!important;
    color: var(--color-000000)!important;
    font-weight: var(--font-weight-Regular)!important;
}
  .contact-form {
    position: relative;
    z-index: 99;
    float: right;
    width: 95%;
    background: white;
    border-radius: 12px;
    padding: 35px;
    box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.1);
}
.contact-form a span{
    font-size: 16px;
    padding: 2px 30px;
}
    .contact-form h2 {
        font-size: var(--font-size-33);
    color: #282728;
    }
    .contact-form label {
        font-size: 14px;
        display: block;
        margin-bottom: 5px;
        color: #555;
    }
    .contact-form input, 
    .contact-form textarea {
        width: 100%;
        padding: 10px;
        margin-bottom: 15px;
        border: none;
        border-radius: 8px;
        font-size: 14px;
    }
    .contact-form textarea {
        height: 80px;
        resize: none;
    }


.nav-tabs {
    border-bottom: none;
}

.sidenav,
.mobile-toggle {
    display: none;
}

.mobile-banner {
    display: none !important;
}

.mobile-img {
    display: none;
}

.container,
.container-lg,
.container-md,
.container-sm,
.container-xl {
    max-width: 1660px;
}


/* back to top */

#button {
    display: inline-block;
    background: var(--color-ff7f01);
    width: 45px;
    height: 45px;
    text-align: center;
    border-radius: 0;
    position: fixed;
    bottom: 23px;
    right: 15px;
    border-radius: 50%;
    transition: background-color .3s, opacity .5s, visibility .5s;
    visibility: hidden;
    z-index: 1000;
    border: 2px solid var(--color-ffffff);
    text-decoration: none;
    opacity: 0;
}

#button::after {
    content: "\2191";
    font-family: 'bootstrap-icons';
    font-weight: normal;
    font-style: normal;
    font-size: 25px;
    line-height: 28px;
    color: var(--color-ffffff);
    text-decoration: none;
    border: 0;
}

#button:hover {
    cursor: pointer;
    border: 2px solid var(--color-ff7f01);
    background-color: var(--color-ffffff);
}

#button:hover:after {
    color: var(--color-f26b28);
}

#button:active {
    border: 2px solid var(--color-f26b28);
    background-color: var(--color-ffffff);
}

#button.show {
    opacity: 1;
    visibility: visible;
    text-decoration: none;
    -webkit-transition: all 0.5s ease-out 0s;
    -moz-transition: all 0.5s ease-out 0s;
    -ms-transition: all 0.5s ease-out 0s;
    -o-transition: all 0.5s ease-out 0s;
    transition: all 0.5s ease-out 0s;
}



.whatsapp-btn {
    position: fixed;
    bottom: 140px;
    right: 15px;
    z-index: 999;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background-color: #25D366;
    border: 1px solid #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
    animation: breathe 2s ease-in-out infinite;
}


/*Estilos solo al icono whatsapp*/

.whatsapp-btn i {
    color: #fff;
    font-size: 20px;
    animation: beat 2s ease-in-out infinite;
    text-decoration: none;
    line-height: 0px;
}


/*Estilos con animation contorno respirando*/

@keyframes breathe {
    0% {
        box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.5);
    }

    70% {
        box-shadow: 0 0 0 15px rgba(37, 211, 102, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
    }
}


/*Estilos de animacion del icono latiendo*/

@keyframes beat {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.2);
    }

    100% {
        transform: scale(1);
    }
}
/* Common style for social buttons */
.social-btn {
    display: none!important;
    position: fixed;
    right: 15px;
    z-index: 999;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: 1px solid #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    visibility: visible;
    opacity: 1;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
    transition: transform 0.3s ease;
}
.social-btn:hover {
    transform: scale(1.1);
}

/* Instagram */
.instagram-btn {
    bottom: 190px;
    background: linear-gradient(45deg, #feda75, #fa7e1e, #d62976, #962fbf, #4f5bd5)
}
.instagram-btn i { color: #fff; }

/* Facebook */
.facebook-btn {
    bottom: 240px;
    background: #1877F2;
}
.facebook-btn i { color: #fff; }

/* Twitter (X) */
.twitter-btn {
    bottom: 290px;
    background: #000;
}
.twitter-btn i { color: #fff; }

/* LinkedIn */
.linkedin-btn {
    bottom: 340px;
    background: #0A66C2;
}
.linkedin-btn i { color: #fff; }

/* Inquiry-btn */
.inquire-btn {
    display: flex!important;
    bottom: 90px;
    background: #fa7e1e;
}
.inquire-btn i { color: #fff; }


/* Breadcrumb  */
.breadcrumb {
position: relative;
height: 400px;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
color: var(--color-ffffff);
    background-position: center !important;
    background-size: cover !important;
margin: 0;
}
.breadcrumb::after {
content: "";
position: absolute;
inset: 0;
background: rgba(0,0,0,0.55);
}
.breadcrumb .content {
position: relative;
z-index: 2;
}
.breadcrumb h1 {
font-size: var(--font-size-48);
font-weight: var(--font-weight-Bold);
margin-bottom: 10px;
}
.breadcrumb ol {
list-style: none;
padding: 0;
display: inline-flex;
gap: 8px;
font-size: var(--font-size-16);
}
.breadcrumb ol li { color: #fff; }
.breadcrumb ol li a {
color: var(--color-ff7f01);
text-decoration: none;
}
/* Breadcrumb  */

/* about-page */
.about-us{
    background: var(--color-3d200b);
}
.facility-card{
    margin-bottom: 30px;
}
.facility-card img {width: 100%;}

.why-text {
    padding: 1.5rem;
}
.about-text p{
    opacity: 0.8;
}
.about-us .counter-box {
    display: flex;
    align-items: center;
    gap: 25px;
    justify-content: center;
}





/* about-page */

/* services-page */
.service-ps-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(25%, 1fr));
gap: 24px;
}


.service-ps-card {
position: relative;
overflow: hidden;
border-radius: 18px;
box-shadow: 0 6px 20px rgba(0,0,0,.15);
}
.service-ps-card img {
width: 100%;
height: 350px;
object-fit: cover;
display: block;
transition: transform .5s ease;
}
.service-ps-card h3{
    color: var(--color-ff7f01);
    margin-bottom: 10px;
}
.service-ps-card p{
    color: var(--color-ffffff);
}
.service-ps-card:hover img {
transform: scale(1.1);
}
.service-ps-card .overlay {
position: absolute;
inset: 0;
background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgb(0 0 0 / 63%) 100%);
color: #fff;
display: flex;
flex-direction: column;
justify-content: flex-end;
padding: 20px;
transition: background .3s ease;
}

.interior_13-text {
    padding-bottom: 32px;
}

.h3-touch{
    color: var(--color-ff7f01);
    font-size: var(--font-size-33);
}


.services-section .content-column {
  position: relative;
  display: flex;
  align-items: center;
  padding: 0 5rem;
}

.inner-column h3 {
    color: var(--color-3d200b);
  font-size: var(--font-size-50);
}

.inner-column li {
  font-size: var(--font-size-16);
  display: flex;
  align-items: center;
}

.inner-column li img {
  /* width: 18px; */
  height: 20px;
  /* border: 1px solid #ccc; */
  border-radius: 100%;
  margin-right: 10px;
}

.services-section .image-column {
  position: relative;
}

.services-section .image-column .text-layer {
  position: absolute;
  right: -110px;
  top: 50%;
  font-size: 325px;
  line-height: 1em;
  color: #ffffff;
  margin-top: -175px;
  font-weight: 500;
}

.services-section .image-column .inner-column {
  position: relative;
  padding-left: 50px;
  padding-bottom: 0px;
}

.services-section .image-column .inner-column::before {
  content: '';
  position: absolute;
  width: calc(50% + 160px);
  height: calc(100% + 80px);
  top: -40px;
  left: 0px;
  background: var(--color-yellow);
  z-index: 0;
}

.services-section .image-column .inner-column-right {
  position: relative;
  padding-right: 50px !important;
  padding-bottom: 0px;
}

.services-section .image-column .inner-column-right::before {
  content: '';
  position: absolute;
  width: calc(50% + 160px);
  height: calc(100% + 80px);
  top: -40px;
  right: 0px;
  background: var(--color-ff7f01);
  z-index: 0;
}

.services-section .image-column .image-1 {
  position: relative;
}

.services-section .image-column .image-2 {
  position: absolute;
  left: 0;
  bottom: 0;
}

.services-section .image-column .image-2 img, .services-section .image-column .image-1 img {
  box-shadow: 0 30px 50px rgba(8, 13, 62, .15);
  border-radius: 46px;
  width: 100%;
  height: 500px;
  object-fit: cover;
}
.services-section .image-column .inner-column::before {
    content: '';
    position: absolute;
    width: calc(50% + 160px);
    height: calc(100% + 80px);
    top: -40px;
    left: 0px;
    background: var(--color-ff7f01);
    z-index: 0;
}
/* contact-us-page */
/* Contact Left Panel */
.contact-left {
  background: var(--color-ff7f01);
  padding: 3rem;
  padding-right: 16%;
  border-radius: 1.5rem;
  color: #fff;
  box-shadow: 0 8px 20px rgba(0,0,0,0.15);
}
.contact-title {
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 15px;
  color: var(--color-4b0001);
}
.contact-subtext {
  font-size: 18px;
  line-height: 28px;
  margin-bottom: 25px;
  color: #f8f8f8;
}
.contact-info {
  display: flex;
  align-items: flex-start;
  margin-bottom: 30px;
}
.contact-info i {
  font-size: 22px;
  color: #fff;
  margin-right: 12px;
  background: rgba(255,255,255,0.2);
  padding: 12px;
  border-radius: 50%;
}
.contact-text h5 {
    color: var(--color-4b0001);
    font-size: 15px;
    margin-bottom:5px;
    font-weight: 500;
}
.contact-text a, .contact-text p {
  font-size: var(--font-size-17);
  color: #fff;
  opacity: 0.9;
  text-decoration: none;
  margin: 0;
}
.contact-text a:hover {
  text-decoration: underline;
}

/* Social Icons */
ul.social {
  display: flex;
  gap: 15px;
  margin-top: 30px;
}
ul.social li{
    width: 40px;
    height: 40px;
  color: #fff;
  background: rgba(255,255,255,0.15);
  padding: 10px 12px;
  border-radius: 50%;
  transition: 0.3s;
        display: flex;
    align-items: center;
    justify-content: center;
}
ul.social li:hover {
  background: #fff;
  color: #ff5500;
}

/* Form Styling */
.contact-form .form-control {
  border: 1px solid #ddd;
  border-radius: 10px;
  padding: 12px 15px;
  font-size: 14px;
}
.contact-form .form-control:focus {
  border-color: #ff5500;
  box-shadow: 0 0 0 0.15rem rgba(255, 85, 0, 0.2);
}

/* Submit Button */
.contact-btn {
  background: #ff5500;
  border: none;
  padding: 12px 25px;
  border-radius: 10px;
  font-size: 15px;
  font-weight: 600;
  color: #fff;
  transition: 0.3s;
}
.contact-btn:hover {
  background: #e64700;
  transform: translateY(-2px);
}



.desktop-view{
  display: block ;
}



.desktop-display-none{
  display: none !important;
}