body {
    background-color: #0D0D0D;
}

h1,
h2,
h3,
h4,
h5,
p {
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
}

.header {
    background-color: #0D0D0D;
    padding: 1rem 0;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
}

.header-content {
    max-width: 1440px;
    margin: 0 auto;
    padding: 0 2rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.header img {
    width: 150px;
    background-color: #0B150F;
}

.menu-btn {
    background: none;
    border: none;
    font-size: 1.5rem;
    cursor: pointer;
    padding: 0.5rem;
    border-radius: 4px;
    transition: background-color 0.2s;
    color: #DBB56E;
}

.menu-btn:hover {
    background-color: rgba(240, 240, 240, 0.1);
}



/* Sidebar */
.close-btn {
    color: white;
    background-color: #0B150F;
    border-radius: 30px;
    border: 1px solid #0B150F;
    position: absolute;
    top: 1rem;
    left: 1rem;
    font-size: 1.5rem;
    cursor: pointer;
    padding: 0.5rem;
    transition: background-color 0.2s;
}

.close-btn:hover {
    background-color: #34495e;
}

.sidebar {
    position: fixed;
    top: 0;
    right: -500px;
    width: 500px;
    height: 100vh;
    background-color: #0D0D0D;
    color: white;
    transition: right 0.3s ease;
    z-index: 1001;
    overflow-y: auto;
}

.sidebar.open {
    right: 0;
}

.nav-menu {
    padding: 100px 40px;
}

.nav-item {
    display: block;
    padding: 1rem 1.5rem;
    color: white;
    text-decoration: none;
    transition: background-color 0.2s;
    border: none;
    background: none;
    width: 70%;
    text-align: left;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    border-radius: 10px;
    font-size: 18px;
    font-weight: 500;
    line-height: 150%;
}

.nav-item:hover {
    background-color: #272727;
}

.nav-item.active {
    position: relative;
    background-color: #272727;
    /* Solid background color */

    font-size: 18px;
    font-weight: 500;
    line-height: 150%;
    color: transparent;
    /* So text doesn't show default color */
}

.nav-item.active span,
.nav-item.active i {
    background-image: linear-gradient(to right, #fee4b5, #a46c03);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
}

.nav-icon {
    font-size: 1.25rem;
    width: 20px;
    text-align: center;
}


/* Banner-01 */


.banner-01 {
    position: relative;

    height: 835px;
    overflow: hidden;

}

.hero-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.hero-video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    /* Video optimization */
    will-change: transform;
    transform: translateZ(0);
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    display: block;
}

.hero-fade-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.5) 50%, rgba(0, 0, 0, 0.7) 100%);
    z-index: 1;
}

.hero-overlay {
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    z-index: 2;
    padding: 0 65px;
}

.hero-content {
    flex: 1;
    max-width: 1200px;
    z-index: 2;
}

.banner-01 h5 {
    color: #797979;
    font-size: 16px;
    line-height: 44px;
}

.inner-heading {
    position: relative;
    height: 68.53px;
    overflow: hidden;
    display: inline-block;
    vertical-align: top;
    width: 370px;
    min-width: 370px;
}

.inner-heading span {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    animation: slideText 6s ease-in-out infinite;
}

.inner-heading span div {
    height: 68.53px;
    line-height: 68.53px;
    background: linear-gradient(to right,
            #FEE4B5 0%,
            /* Bright gold at top */
            #FEE4B5 25%,
            /* Orange-gold */
            #D3AA5F 50%,
            /* Goldenrod middle */
            #A46C03 75%,
            /* Dark goldenrod */
            #A46C03 100%
            /* Saddle brown at bottom */
        );
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #DBB56E;
    /* Fallback */
    font-size: 68.53px;
    white-space: nowrap;
    width: 100%;
}

@keyframes slideText {

    0%,
    20% {
        top: 0;
    }

    30%,
    50% {
        top: -68.53px;
    }

    60%,
    80% {
        top: -137.06px;
    }

    90%,
    100% {
        top: 0;
    }
}

.hero-title {
    font-size: 68.53px;
    font-weight: 600;
    color: white;
    line-height: auto;
    margin-bottom: 24px;
}

.hero-title .highlight {
    color: #D4AF37;
}

.hero-subtitle {
    font-size: 28px;
    color: white;
    font-weight: normal;
    line-height: 40px;
    margin-bottom: 20px;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
}

.hero-buttons {
    display: flex;
    gap: 25px;
    flex-wrap: wrap;

}

.banner-01 .btn {
    position: relative;
    margin: 10px;
    padding: 8px 40px;
    font-size: 24px;
    font-weight: 600;
    text-decoration: none;
    border-radius: 12px;
    transition: all 0.3s ease;
    cursor: pointer;
    text-align: center;
    display: flex;
    justify-content: center;
    line-height: 44px;
    border: none;
}

.btn:hover {
    box-shadow: 0 0 20px #E7C586;
}

.banner-01 .btn-primary {
    background-color: transparent;
    color: #E1E1E1;
}

.banner-01 .btn-secondary {
    background-color: transparent;
    color: #E1E1E1;
}

.banner-01 .btn-primary::before {
    content: '';
    position: absolute;
    inset: 0;
    padding: 2px;
    /* This creates the border width */
    background: linear-gradient(to right, #FEE4B5, #A46C03);
    border-radius: 12px;
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask-composite: xor;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
}

.banner-01 .btn-secondary::before {
    content: '';
    position: absolute;
    inset: 0;
    padding: 2px;
    /* This creates the border width */
    background: linear-gradient(to right, #FEE4B5, #A46C03);
    border-radius: 12px;
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask-composite: xor;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
}

.hero-logo {
    position: absolute;
    right: 41px;
    top: 50%;
    transform: translateY(-50%);
    width: 356px;
    height: 335px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Main-pill section*/

.pills-section {
    padding: 0px 16px;
    position: absolute;
}

.pills-container {

    width: auto;
    max-width: 1200px;
    margin: 10px auto;
    display: flex;
    justify-content: center;
    align-items: center;

}

.pills-wrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 55px;
}

.pill {
    display: inline-flex;
    align-items: center;
    padding: 12px 24px;
    color: #FFFFFF;
    text-decoration: none;
    font-size: 18px;
    font-weight: normal;
    border-radius: 9999px;
    white-space: nowrap;
    transition: background-color 0.2s ease;
    position: relative;
}

.pills-section {
    position: sticky;
    top: 80px;
    /* same as .header height */
    z-index: 999;
    /* above content but below sidebar if needed */
    background-color: #0d0d0d;
    /* or your site background */
    padding: 10px 0;
}

#about,
#services,
#projects,
#why,
#clients {
    scroll-margin-top: 110px;
}

.main-port .pill:hover {
    background: linear-gradient(to right, #FEE4B5, #A46C03);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #DBB56E;
}

.main-port .pill.active {
    background: linear-gradient(to right, #FEE4B5, #A46C03);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #DBB56E;
}

.main-port .pill:hover::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 30%;
    height: 2px;
    background: linear-gradient(to right, #FEE4B5, #A46C03);
    border-radius: 3px;
}

.main-port .pill.active::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 30%;
    height: 2px;
    background: linear-gradient(to right, #FEE4B5, #A46C03);
    border-radius: 3px;
}

.about_nav .pill:hover {
    background: linear-gradient(to right, #FEE4B5, #A46C03);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #DBB56E;
}

.about_nav .pill.active {
    background: linear-gradient(to right, #FEE4B5, #A46C03);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #DBB56E;
}

.about_nav .pill:hover::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 30%;
    height: 2px;
    background: linear-gradient(to right, #FEE4B5, #A46C03);
    border-radius: 3px;
}

.about_nav .pill.active::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 30%;
    height: 2px;
    background: linear-gradient(to right, #FEE4B5, #A46C03);
    border-radius: 3px;
}

#trust,
#vision,
#values,
#partners,
#Why,
#certificates {
    scroll-margin-top: 110px;
}

/* about section*/

.about {
    padding: 0;
    width: 100%;
    max-width: 1440px;
    position: relative;
    margin: 0 auto;
}

/* Add this new pseudo-element for the background logo */
.about::before {
    content: '';
    position: absolute;
    top: 0;
    right: -146.41px;
    width: 498.3125px;
    height: 469px;
    background-image: url(../img/icons/image\ 59.png);
    opacity: 30%;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: top right;
}



.about .container {
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
    padding: 200px 70px;
}

.about h2 {
    font-size: 48px;
    /* Your existing size */
    font-weight: bold;
    margin-bottom: 40px;
    line-height: 1.2;
    color: white;
}

.about h2 .company-name {
    background: linear-gradient(to left,
            #FEE4B5 0%,
            #FEE4B5 25%,
            #EDCD92 50%,
            #DBB56E 75%,
            #DBB56E 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #DBB56E;
}

.about p:first-of-type {
    font-size: 28px;
    font-style: italic;
    line-height: 34px;
    margin-bottom: 30px;
    color: #DBB56E;
    letter-spacing: -3%;
}

.about p {
    font-size: 28px;
    line-height: 34px;
    margin-bottom: 25px;
    color: #e0e0e0;
    letter-spacing: -3%;
}

.about .btn-secondary {
    position: relative;
    background-color: transparent;
    color: #E1E1E1;
    border: none;
    font-size: 24px;
    font-weight: 600;
    text-decoration: none;
    border-radius: 12px;
    transition: all 0.3s ease;
    display: inline-block;
    padding: 8px 20px;
}

.about .btn-secondary::before {
    content: '';
    position: absolute;
    inset: 0;
    padding: 2px;
    background: linear-gradient(to right, #FEE4B5, #A46C03);
    border-radius: 12px;
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask-composite: xor;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
}


.about .section-about-img {
    position: absolute;
    right: 30px;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 469px;
    /* adjust as needed */
    height: 677px;
    /* adjust as needed */
    margin: auto;
}

/* Base image style */
.about .section-about-img .img {
    width: 260px;
    /* adjust size */
    height: 493px;
    object-fit: cover;
    position: absolute;
    border-radius: 300px;
    /* elliptical shape */
    overflow: hidden;
}

/* Left/top image */
.about .section-about-img .img-left {
    left: -35px;
    top: 0;
    z-index: 1;
}

.about .col-lg-7 {
    padding-right: 75px;
}

/* Right/bottom image */
.about .section-about-img .img-right {
    right: 0;
    bottom: 0;
    z-index: 2;
}


.logos .container {
    display: block;
    width: 100%;
    max-width: 1440px;
    /* never larger than its container */
    height: auto;
    /* keeps aspect ratio */
    margin: 0 auto;
    padding-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    align-content: center;
}

.logos h3 {
    color: white;
    margin-bottom: 30px;
    font-size: 16px;
    padding-top: 30px;
}

.logos img {
    width: contain;
    height: auto;
    margin: 0 10px;

}

/* Tablet */
@media (max-width: 1060px) {

    .logos h3 {
        margin-bottom: 20px;
        font-size: 16px;
    }
}

@media (max-width:850px) {
    .logos img {
        margin: 0 0px;
    }

    .logos h3 {
        margin-bottom: 15px;
        font-size: 12px;
        margin-right: 10px;
    }
}

@media(max-width: 670px) {
    .logos .container {
        display: block;
        width: 100%;
        max-width: 670px;
        /* never larger than its container */
        height: auto;
        /* keeps aspect ratio */
        margin: 0 auto;
        padding-bottom: 20px;
        padding: 0px 50px;
        display: flex;
        align-items: center;
        justify-content: center;
        align-content: center;
    }

    .logos img {
        width: 40px;
        height: 20px;
        margin: 5px;
    }

    .logos h3 {
        margin-bottom: 20px;
        font-size: 10px;
        padding-top: 15px;
        margin-right: 10px;
    }
}

@media (max-width: 440px) {
    .logos img {
        width: 30px;
        height: 15px;
    }

    .logos h3 {
        margin-bottom: 20px;
        font-size: 8px;
        padding-top: 25px;
        margin-right: 10px;
    }
}

/* Mobile */
@media (max-width: 389.2px) {

    .logos h3 {
        margin-bottom: 10px;
        font-size: 8px;
        padding-top: 25px;
    }

    .logos img {
        width: 30px;
        height: 15px;
    }
}

@media (max-width: 369px) {
    .logos img {
        width: 20px;
        height: 8px;
    }

    .logos h3 {
        margin-bottom: 5px;
        font-size: 6px;
        padding-top: 10px;
    }

}



/*Services Section*/

.services {
    position: relative;
    overflow: hidden;
    background-color: #1A1711;
}

.services .container {
    padding: 50px 65px 0 65px;
    width: 80%;
    max-width: 1440px;
    margin: 0 auto;
}

.services .text-center h2 {
    font-size: 48px;
    color: white;
    letter-spacing: -3%;
    line-height: auto;
    margin-bottom: 18px;
    margin-top: 28px;
}

.services .text-center p {
    font-size: 28px;
    color: white;
    line-height: 141%;
    letter-spacing: -3%;
    margin-bottom: 18px;
    padding: 0px 20px
}

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

.services span {
    color: #DBB56E;
}


.services .card {
    padding: 40px 50px 40px 28px;
    border-radius: 12px;
    background-color: #1E1C1C;
    height: 100%;
    text-align: left;

}

.services .card:hover {
    box-shadow: 0 0 20px #E7C586;
    /* gold glow */
}

.services .card img {
    height: 28px;
    width: 28px;
    margin-bottom: 16px;
}

.services .card .card-title p {
    line-height: 26px;
    letter-spacing: 0.15;
    font-weight: 600;
    font-size: 24px;
    background: linear-gradient(to right, #DBB56E 0%, #DBB56E 25%, #EDCE93 50%, #FEE4B5 75%, #FEE4B5 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    margin-bottom: 16px;
}

.services .card .card-content p {
    line-height: 28px;
    letter-spacing: 0;
    font-size: 20px;
    color: #D9D9D9;
}

.services .num1 {
    background-image: url(../img/1.png);
    background-size: auto 100px;
    /* Adjust size as needed */
    background-repeat: no-repeat;
    background-position: bottom right 10px;
    /* Position in bottom right with some padding */
    position: relative;
}

.services .num1 .card-title,
.services .num1 .card-content {
    position: relative;
    z-index: 1;
}

.services .num3 {
    background-image: url(../img/3.png);
    background-size: auto 100px;
    /* Adjust size as needed */
    background-repeat: no-repeat;
    background-position: bottom right;
    /* Position in bottom right with some padding */
    position: relative;
}

.services .num3 .card-title,
.services .num3 .card-content {
    position: relative;
    z-index: 1;
}

.services .num4 {
    background-image: url(../img/4.png);
    background-size: auto 100px;
    /* Adjust size as needed */
    background-repeat: no-repeat;
    background-position: bottom right 10px;
    /* Position in bottom right with some padding */
    position: relative;
}

.services .num4 .card-title,
.services .num4 .card-content {
    position: relative;
    z-index: 1;
}

.services .num6 {
    background-image: url(../img/6.png);
    background-size: auto 100px;
    /* Adjust size as needed */
    background-repeat: no-repeat;
    background-position: bottom right;
    /* Position in bottom right with some padding */
    position: relative;
}

.services .num6 .card-title,
.services .num6 .card-content {
    position: relative;
    z-index: 1;
}

.services .num2 {
    background-image: url(../img/2.png);
    background-size: auto 100px;
    /* Adjust size as needed */
    background-repeat: no-repeat;
    background-position: top right;
    /* Position in bottom right with some padding */
    position: relative;
}

.services .num2 .card-title,
.services .num2 .card-content {
    position: relative;
    z-index: 1;
}

.services .num5 {
    background-image: url(../img/5.png);
    background-size: auto 100px;
    /* Adjust size as needed */
    background-repeat: no-repeat;
    background-position: top right;
    /* Position in bottom right with some padding */
    position: relative;
}

.services .num5 .card-title,
.services .num5 .card-content {
    position: relative;
    z-index: 1;
}



/*Projects*/

.projects {
    width: 100%;
    max-width: 1440px;
    position: relative;
    margin: 0px auto;
    overflow: hidden;
    padding: 50px 65px 0 65px;
}

.projects .col-4 {
    display: flex;
    justify-content: center;
}

.projects .text-center h2 {
    font-size: 48px;
    color: white;
    margin-bottom: 18px;
}

.projects .text-center p {
    font-size: 28px;
    color: #D9D9D9;
    margin-bottom: 50px;
}

.projects .company-name {
    font-size: 48px;
    background: linear-gradient(to right, #DBB56E 0%, #DBB56E 25%, #EDCE93 50%, #FEE4B5 75%, #FEE4B5 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #DBB56E;
}

.projects .row {
    width: 100%;
    max-width: 1440px;
    position: relative;
    margin: 0px auto;
}

.projects .image-box img {
    border-radius: 20px;
    height: 280px;
    width: 300px;
}

.projects .image-box img:hover {
    box-shadow: 0 0 30px #E7C586;
}

.projects .image-box {
    width: 300px;
}


.projects .image-box p {
    margin-top: 10px;
    letter-spacing: -3%;
    line-height: 100%;
    color: #FFFFFF;
    font-size: 20px;
    text-align: center;
}

/*Why Section Page Index*/

.why {
    width: 100%;
    max-width: 1440px;
    position: relative;
    margin: 50px auto;

}

.why::before {
    content: '';
    position: absolute;
    top: 0;
    left: -160.42px;
    width: 498.3125px;
    height: 469px;
    background-image: url(../img/icons/image\ 59.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: left top;
    opacity: 10%;
}

.why .container {
    padding: 100px 65px 0px 65px;
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
}

.why h2 {
    font-size: 48px;
    color: white;
    margin-bottom: 16px;
    letter-spacing: -3%;
}


.why p {
    font-size: 28px;
    color: #D9D9D9;
    line-height: 121%;
    letter-spacing: -3%;
    padding-right: 0px;
    font-weight: 400;
    margin-bottom: 10px;
}

.why .company-name {
    font-size: 48px;
    background: linear-gradient(to right, #DBB56E 0%, #DBB56E 25%, #EDCE93 50%, #FEE4B5 75%, #FEE4B5 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #DBB56E;
}

.why .why-top-para {
    color: #DBB56E;
    font-size: 28px;
    font-weight: 400;
    line-height: 100%;
    letter-spacing: -3%;
    padding-right: 300px;
}

.why .card p {
    color: #DBB56E;
    padding: 15px 10px;
    background-color: transparent;
    border-radius: 8px;
    font-size: 22px;
    font-weight: 500;
    line-height: 100%;
    text-align: center;
}

.why .card {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 30px;
    background-color: transparent;
    border-radius: 12px;
}

.why .card::before {
    content: '';
    position: absolute;
    inset: 0;
    padding: 2px;
    background: linear-gradient(to right, #FEE4B5, #A46C03);
    border-radius: 12px;
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask-composite: xor;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
}

.why .card:hover {
    box-shadow: 0 0 15px #E7C586;
}





.why .text-center p {
    color: #DBB56E;
    font-size: 28px;
    letter-spacing: -3%;
    line-height: 141%;
    max-width: 1000px;
    width: 100%;
    margin: 0px auto;
}


/* Cilent section last section*/

.clients {
    width: 100%;
    max-width: 1440px;
    position: relative;
    margin: 50px auto 200px auto;
    overflow: hidden;
    padding: 55px 65px 0 65px;
}

.clients h3 {
    font-size: 32px;
    color: white;
}

.clients .top_btn .btn {
    font-size: 24px;
    font-weight: 600;
    color: #0D0D0D;
    background: linear-gradient(to right, #FEE4B5, #A46C03);
    border: none;
    padding: 8px 20px;
    margin-top: 12px;
}

.clients .footer_start {
    background-color: #1A1711;
    width: 100%;
    max-width: 1231px;
    margin: 0px auto;
    border-radius: 30px;
    padding: 50px;
    background-image:
        url(../img/image\ 5.png),
        url(../img/image\ 4.png);
    background-size:
        120px 120px,
        120px 120px;
    background-position:
        top left,
        bottom right;
    background-repeat: no-repeat, no-repeat;
    position: relative;
    z-index: 1;
    pointer-events: none;
}


/*Footer*/

.footer {
    position: relative;
    margin: 0px auto;
    overflow: hidden;
}

.footer .cnum1 {
    position: relative;
    width: 1050px;
    max-width: 1050px;
    height: 204px;
    margin: 0 auto;
    left: 0%;
    top: 90px;
}

.footer .cnum1 h1 {
    font-size: 144.64px;
    font-weight: 800;
    letter-spacing: -3%;
    display: inline-block;
    color: #DBB56E;
    opacity: 20%;
    overflow: hidden;
}


.inner-heading-bottom {
    position: relative;
    height: 144.64px;
    overflow: hidden;
    display: inline-block;
    width: 430px;
    min-width: 430px;
}

.inner-heading-bottom span {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    animation: footerslidetext 6s ease-in-out infinite;
}

.inner-heading-bottom span div {
    height: 144.64px;
    line-height: 120%;
    color: #DBB56E;
    /* Fallback */
    font-size: 144.64px;
    white-space: nowrap;
    width: 100%;
    overflow: hidden;
}

@keyframes footerslidetext {

    0%,
    20% {
        top: 0;
    }

    30%,
    50% {
        top: -144.64px;
    }

    60%,
    80% {
        top: -292px;
    }

    90%,
    100% {
        top: 0;
    }
}


.footer .cnum2 {
    position: relative;
    width: 100%;
    z-index: 1;
    padding: 0px 20px 1px 20px;
    background-color: #1A1711;
    background-image: url(../img/image\ 59.png);
    background-size: 469px 200px;
    /* Adjust size as needed */
    background-repeat: no-repeat;
    background-position: bottom left;
    /* Position in bottom right with some padding */
}

.footer .cnum2 .container {
    max-width: 1440px;
    /* Restrict content to 1440px */
    margin: 0 auto;
    /* Center the content */
}

.footer .footer_head {
    margin-bottom: 30px;
}

.footer h2 {
    margin-top: 50px;
    color: white;
    font-size: 48px;
    letter-spacing: -3%;
    margin-bottom: 18px;
    position: relative;
    z-index: 1;
}

.footer .company-name {
    background: linear-gradient(to left,
            #FEE4B5 0%,
            #FEE4B5 25%,
            #EDCD92 50%,
            #DBB56E 75%,
            #DBB56E 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #DBB56E;
}

.footer .footer_head p {
    color: #D9D9D9;
    font-size: 28px;
    letter-spacing: -3%;
    line-height: 141%;
    width: 80%;
    margin: 0px auto 0px auto;
    position: relative;
    z-index: 1;
    margin-bottom: 30px;
}


.owl-carousel {
    margin: 0 auto;
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 1440px;
    overflow: hidden;
    height: 151px;
    /* keep if needed */
}

.owl-carousel img {
    display: flex;
    justify-content: center;
    align-items: space-between;
    position: relative;
}

.logo-strip {
    overflow: hidden;
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
    height: 160px;
    position: relative;
}

.logos-track {
    display: flex;
    gap: 80px;
    /* space between logos */
    width: calc(200%);
    /* allow scrolling loop */
    animation: scroll 30s linear infinite;
    overflow: hidden;
}

.logos-track div img {
    height: 100px;
    /* adjust sizes as needed */
    object-fit: contain;
}

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

    to {
        transform: translateX(-50%);
        /* move by half (because of duplication) */
    }
}

.logos-track .img1 img {
    height: 69.99999237060547px;
    width: 408.926513671875px;
    margin-top: 40.78px;

}

.logos-track .img2 img {
    height: 70px;
    width: 261.60565185546875px;
    margin-top: 28.78px;
}

.logos-track .img3 img {
    height: 88.86830139160156px;
    width: 142px;
    margin-top: 28.35px;
}

.logos-track .img4 img {
    height: 76.98165893554688px;
    width: 187px;
    margin-top: 37.29px;
}

.logos-track .img5 img {
    height: 75.99971771240234px;
    width: 195.99974060058594px;
    margin-top: 41.78px;
}

.logos-track .img6 img {
    height: 136px;
    width: 190px;
    margin-top: 5px;
}

.logos-track .img7 img {
    height: 57px;
    width: 258px;
    margin-top: 43px;
}

.separator {
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background-color: #DBB56E;
    /* gold */
    flex-shrink: 0;
    margin-top: 63.28px;
}


.footer .base_text {
    width: 80%;
    margin: 0px auto 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    z-index: 1;
    padding-top: 15px;

}

.footer .base_text-about {
    width: 80%;
    margin: 0px auto 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    z-index: 1;
    padding-top: 0px;

}

.footer .base_text-about::before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 60%;
    /* custom width */
    height: 2px;
    background: linear-gradient(to right, #FEE4B5, #A46C03);
}

.footer .base_text a {
    color: white;
    text-decoration: none;
    font-size: 15px;
    font-weight: 300;
    line-height: 16px;
}

.footer .base_text-about a {
    color: white;
    text-decoration: none;
    font-size: 15px;
    font-weight: 300;
    line-height: 16px;
}


.footer .text-start .footer-icon {
    height: 38.08020782470703px;
    width: 177px;
    margin-bottom: 15px;
}

.footer .text-start .link-parent {
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: start;
}

.footer .text-start .link-parent img {
    margin-right: 10px;
}

.footer .text-start .call-calling {
    position: relative;
    top: 0px;
    right: 10px;
}

.footer .text-start .phone-icon {
    position: relative;
    left: 7px;
    margin-right: 7px;
}

.footer .text-start .link-parent a {
    gap: 50px;
}

.footer .text-end p {
    font-size: 18px;
    text-align: left;
    color: #D9D9D9;
    letter-spacing: -3%;
    line-height: 141%;
    width: 100%;
    margin: 0px auto 0px auto;
    position: relative;
    z-index: 1;
    margin-bottom: 0px;
}

.footer .text-end .btn {
    font-size: 24px;
    font-weight: 600;
    color: #0D0D0D;
    background: linear-gradient(to right, #FEE4B5, #A46C03);
    border: none;
    padding: 8px 20px;
    margin-top: 12px;

}


.last_sect .text-center {
    color: white;
}

.last_sect a {
    color: white;
    text-decoration: none;
}

.last_sect p {
    font-size: 14px;
}

.last_sect .footer_base_downloads {
    display: flex;
    justify-content: center;
    gap: 18px;
}

.last_sect .footer_base_downloads p {
    margin-bottom: 0px;
    font-size: 14px;
}

.last_sect {
    width: 90%;
    margin: 10px auto 0 auto;
    justify-content: space-between;
    align-items: center;
    position: relative;
    z-index: 1;
    padding-top: 30px;
}

.last_sect::before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    /* custom width */
    height: 2px;
    background: linear-gradient(to right, #FEE4B5, #A46C03);
}





/* Contect Page */
/* Contact First Section Start*/
.contact_first {
    width: 100%;
    max-width: 1440px;
    position: relative;
    margin: 100px auto 40px auto;
    overflow: hidden;
    padding: 150px 0px 0px 65px;
}

.contact_first h5 {
    font-size: 16px;
    color: #797979;
    line-height: 44px;
}

.contact_first h1 {
    font-size: 68.53px;
    color: white;
}

.contact_first .company-name {
    background: linear-gradient(to left,
            #FEE4B5 0%,
            #FEE4B5 25%,
            #EDCD92 50%,
            #DBB56E 75%,
            #DBB56E 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #DBB56E;
}

.contact_first p {
    font-size: 28px;
    color: #FFFFFF;
    letter-spacing: -3%;
}


/* Content Second Section Start */

.contact_second {
    position: relative;
    margin: 0 auto;
    width: 100%;
    overflow: hidden;
    background-color: #1A1711;
}

.contact_second .container {

    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
    display: flex;
    padding: 0px 64px;
    height: 667px;
    /* Added gap for spacing between columns */
}

.contact_second .row {
    width: 100%;
    max-width: 1440px;
}

.contact_second .col_left {
    background-color: #000000;
    border-radius: 10px;
    height: 647px;
    /* Added for internal spacing */
    box-sizing: border-box;
    margin-top: 10px;
    background-image: url(../img/image\ 4.png), url(../img/Ellipse\ 793.png);
    background-position: right bottom, left bottom;
    background-repeat: no-repeat, no-repeat;
    margin-left: 10px;
}

.contact_second .col_left .link-parent {
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: start;
    margin: 20px 60px;
}

.contact_second .col_left .link-parent img {
    margin-right: 15px;
}

.contact_second .col_left .phone_link {
    position: relative;
    top: 0px;
    right: 10px;
}

.contact_second .col_left .phone-icon {
    position: relative;
    left: 7px;
}

.contact_second .col_left .email-link {
    position: relative;
    bottom: 3px;
}

.contact_second h2 {
    font-size: 28px;
    color: white;
    margin: 34px 0px 0px 34px;
}

.contact_second p {
    font-size: 18px;
    color: #C9C9C9;
    margin: 22px 0px 0px 34px;
}

.contact_second a {
    color: white;
    font-size: 15px;
    font-weight: 300;
    line-height: 14.4px;
    font-style: light;
    text-decoration: none;
}



.contact_second .col_right {
    border-radius: 10px;
    /* Added border-radius */
    padding: 50px;
    /* Added padding */
    height: 647px;
    /* Added height to match col_left */
    box-sizing: border-box;
    z-index: 1;

}


.contact_second .col_right .contact-form label {
    color: #FFFFFF;
    /* Light gray for labels */
    font-size: 18px;
    font-weight: 500;
    line-height: 20px;
    margin-top: 30px;
}

.contact_second .col_right .form-control {
    color: white;
    /* White text for inputs */
    background: none;
    border: none;
    border-bottom: 1px solid #444;
    border-radius: 0;
    padding: 8px 0px;
    box-shadow: none;
}

.contact_second .col_right .btn {
    padding: 8px 60px;
    margin-top: 10px;
    font-size: 24px;
    line-height: 40px;
    font-weight: 600;
    background: linear-gradient(to right, #FEE4B5, #A46C03);
    border: none;
    border-radius: 12px;
    color: #0D0D0D;
}

.contact_second .col_right input::placeholder {
    color: #BCBCBC;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
}



.contact-third {
    width: 100%;
    max-width: 1440px;
    padding: 30px auto;
    position: relative;
    overflow: hidden;
    margin: 30px auto;
}

.contact-third .bd {
    border-right: 2px solid #444;
}

#location {
    scroll-margin-top: 110px;
}

.contact-third h5 {
    color: white;
    margin: 20px;
    font-size: 20px;
}

.contact-third p {
    color: white;
    font-size: 18px;
}

.contact-third .text-bottom {
    display: flex;
    justify-content: center;
}


/* Service First Section */



.service_first {
    width: 100%;
    max-width: 1440px;
    position: relative;
    margin: 100px auto 40px auto;
    padding: 66px 0px 237.47px 65px;
}

.service_first::before {
    content: '';
    position: absolute;
    top: 0;
    right: -146.41px;
    width: 498.3125px;
    height: 469px;
    background-image: url(../img/icons/image\ 59.png);
    opacity: 30%;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: top right;
    /* Makes it subtle like in your reference */
    z-index: 1;
    pointer-events: none;
    /* Ensures it doesn't interfere with content */
}

.service_first h5 {
    font-size: 16px;
    color: #797979;
    line-height: 44px;

}

.service_first h1 {
    font-size: 68.53px;
    color: white;
}

.service_first .company-name {
    background: linear-gradient(to left,
            #FEE4B5 0%,
            #FEE4B5 25%,
            #EDCD92 50%,
            #DBB56E 75%,
            #DBB56E 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #DBB56E;
}

.service_first p {
    font-size: 28px;
    color: #FFFFFF;
    letter-spacing: -3%;
    font-weight: 400;
    line-height: 100%;
    padding-right: 300px;
}

.service_first .btn {
    position: relative;
    padding: 8px 40px;
    margin-top: 10px;
    font-size: 24px;
    font-weight: 600;
    line-height: 40px;
    border-radius: 12px;
    border: none;
    background-color: transparent;
    color: #E1E1E1;
}

.service_first .btn::before {
    content: '';
    position: absolute;
    inset: 0;
    padding: 2px;
    background: linear-gradient(to right, #FEE4B5, #A46C03);
    border-radius: 12px;
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask-composite: xor;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
}



.service_pic_section {}

.service_pic_section .service_1_wrapper,
.service_pic_section .service_2_wrapper,
.service_pic_section .service_3_wrapper,
.service_pic_section .service_4_wrapper,
.service_pic_section .service_5_wrapper,
.service_pic_section .service_6_wrapper {
    width: 100vw;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    margin-bottom: 80px;
    background-color: #1a1711;
    border-radius: 20px;
}

.service_pic_section .tot {
    position: relative;
    width: 530px;
    height: 489px;
}

.service_pic_section .tot .img {
    width: 334px;
    height: 323px;
    border-radius: 12px;
    object-fit: cover;
    position: absolute;
}

.service_pic_section .tot .img-top {
    top: 0;
    left: 0;
    z-index: 1;
}

.service_pic_section .tot .img-bottom {
    bottom: 0;
    right: 0;
    z-index: 2;
}

.service_pic_section .tots {
    position: relative;
    width: 407.26px;
    /* adjust as needed */
    height: 611.51px;
    /* adjust as needed */
    margin: auto;
}

/* Base image style */
.service_pic_section .tots .img {
    width: 234.54px;
    /* adjust size */
    height: 429.58px;
    object-fit: cover;
    position: absolute;
    border-radius: 12px;
    /* elliptical shape */
}

/* Left/top image */
.service_pic_section .tots .img-left {
    left: 0;
    top: 0;
    z-index: 1;
}

/* Right/bottom image */
.service_pic_section .tots .img-right {
    right: 0;
    bottom: 0;
    z-index: 2;
}

.service_pic_section .service_1 .tot {
    background-image: url(../img/Ellipse\ 2774.png), url(../img/Ellipse\ 2775.png);
    background-repeat: no-repeat, no-repeat;
    background-position: center, center;
    background-size: 80%, 65%;
    position: relative;
    right: 5px;
}

.service_pic_section .service_3 .tot {
    background-image: url(../img/Ellipse\ 2774.png), url(../img/Ellipse\ 2775.png);
    background-repeat: no-repeat, no-repeat;
    background-position: center, center;
    background-size: 80%, 65%;
}

.service_pic_section .service_5 .tot {
    background-image: url(../img/Ellipse\ 2774.png), url(../img/Ellipse\ 2775.png);
    background-repeat: no-repeat, no-repeat;
    background-position: center, center;
    background-size: 80%, 65%;
}

.service_pic_section .service_2 .tots {
    background-image: url(../img/Ellipse\ 2774.png), url(../img/Ellipse\ 2775.png);
    background-repeat: no-repeat, no-repeat;
    background-position: top 20px right 20px, bottom 20px left 20px;
    background-size: 60%, 60%;
}

.service_pic_section .service_4 .tots {
    background-image: url(../img/Ellipse\ 2774.png), url(../img/Ellipse\ 2775.png);
    background-repeat: no-repeat, no-repeat;
    background-position: top 20px right 20px, bottom 20px left 20px;
    background-size: 60%, 60%;
}

.service_pic_section .service_6 .tots {
    background-image: url(../img/Ellipse\ 2774.png), url(../img/Ellipse\ 2775.png);
    background-repeat: no-repeat, no-repeat;
    background-position: top 20px right 20px, bottom 20px left 20px;
    background-size: 60%, 60%;
}

.service_pic_section .row {
    width: 100%;
    max-width: 1312px;
    position: relative;
    margin: 0px auto;
    overflow: hidden;
    margin-bottom: 80px;
    padding: 0px 0px 0px 65px;
}

.service_pic_section .service_1 .row {
    background-image: url(../img/1.png);
    background-repeat: no-repeat;
    background-position: left bottom;
}

.service_pic_section .tts {
    width: 45px;
    height: 45px;
    margin-bottom: 17px;
}

.service_pic_section .card-title {
    background: linear-gradient(to left,
            #FEE4B5 0%,
            #FEE4B5 25%,
            #EDCD92 50%,
            #DBB56E 75%,
            #DBB56E 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #DBB56E;
    font-size: 38px;
}

.service_pic_section .card-content {
    color: white;
    font-size: 24px;
    padding-right: 60px;
    line-height: 141%;
    letter-spacing: -3%;
}

.service_pic_section .wop {
    padding-left: 50px;
}

.service_pic_section .wp {
    padding: 70px 30px;
}



.service_pic_section .service_2 .row {
    background-image: url(../img/s-2.png);
    background-repeat: no-repeat;
    background-position: right bottom;
}

.service_pic_section .service_3 .row {
    background-image: url(../img/3.png);
    background-repeat: no-repeat;
    background-position: left bottom;
}

.service_pic_section .service_4 .row {
    background-image: url(../img/4.png);
    background-repeat: no-repeat;
    background-position: right 10px bottom;
}

.service_pic_section .service_5 .row {
    background-image: url(../img/s-5.png);
    background-repeat: no-repeat;
    background-position: left bottom;
}

.service_pic_section .service_6 .row {
    background-image: url(../img/6.png);
    background-repeat: no-repeat;
    background-position: right 10px bottom;
}


/* About Us Page */
/* About Top Nav */

.about_nav {
    position: relative;
    margin: 0px auto;
    overflow: hidden;
    padding: 100px 0px 0px 0px;
    position: sticky;
    top: 80px;
    /* same as header height */
    z-index: 998;
    /* just below header */
    background-color: #0D0D0D;
    /* match site background */
    padding: 10px 0;
}

.about_nav .pills-wrapper {
    gap: 45px;
}

.about_nav .pill {
    font-size: 18px;
    font-weight: 500;
    line-height: 160%;
    font-style: Medium;
}


.about_first {
    width: 100%;
    max-width: 1440px;
    position: relative;
    margin: 0px auto;
    padding: 50px 0px 50px 65px;
}

.about_first .container {
    padding-left: 0;
}

.about_second .container {
    padding-left: 0;
}

.about_first::before {
    content: '';
    position: absolute;
    top: 100px;
    right: -100px;
    width: 498.3125px;
    height: 469px;
    background-image: url(../img/icons/image\ 59.png);
    opacity: 30%;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: top right;
    /* Makes it subtle like in your reference */
    z-index: 1;
    pointer-events: none;
    /* Ensures it doesn't interfere with content */
}

.about_first h5 {
    font-size: 16px;
    color: #797979;
    line-height: 44px;
    font-weight: 400;
    font-style: normal;
    padding-right: 400px;
}

.about_first h1 {
    font-size: 68.53px;
    color: white;
}

.about_first .company-name {
    background: linear-gradient(to left,
            #FEE4B5 0%,
            #FEE4B5 25%,
            #EDCD92 50%,
            #DBB56E 75%,
            #DBB56E 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #DBB56E;
}

.about_first p {
    font-size: 28px;
    color: #FFFFFF;
    letter-spacing: -3%;
    padding-right: 400px;
}

.about_second {
    width: 100%;
    max-width: 1440px;
    position: relative;
    margin: 0px auto;
    overflow: hidden;
    padding: 0 0 10px 0;
}

.about_second .col-8 {
    padding: 150px 40px 100px 75px;
}

.about_second h2 {
    font-size: 48px;
    color: white;
    letter-spacing: -3%;
    line-height: auto;
    margin-bottom: 24px;
    margin-top: 28px;
}

.about_second p {
    font-size: 28px;
    color: white;
    line-height: 141%;
    letter-spacing: -3%;
    margin-bottom: 16px;
    padding: 20px 100px 0px 0px;
}

.about_second .company-name {
    background: linear-gradient(to left,
            #FEE4B5 0%,
            #FEE4B5 25%,
            #EDCD92 50%,
            #DBB56E 75%,
            #DBB56E 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #DBB56E;
}


.about_second .about_second_image {
    position: absolute;
    right: 30px;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 469px;
    /* adjust as needed */
    height: 677px;
    /* adjust as needed */
    margin: auto;
}

/* Base image style */
.about_second .about_second_image .img {
    width: 291px;
    /* adjust size */
    height: 533px;
    object-fit: cover;
    position: absolute;
    border-radius: 300px;
    /* elliptical shape */
    overflow: hidden;
}

/* Left/top image */
.about_second .about_second_image .img-left {
    left: 0;
    top: 0;
    z-index: 1;
}

/* Right/bottom image */
.about_second .about_second_image .img-right {
    right: 0;
    bottom: 0;
    z-index: 2;
}

.about_third {
    width: 100%;
    max-width: 1440px;
    position: relative;
    margin: 0px auto;
    overflow: hidden;
    padding: 100px 65px 0px 65px;
}


.about_third h2 {
    font-size: 48px;
    color: white;
    letter-spacing: -3%;
    line-height: auto;
    margin-bottom: 18px;
    margin-top: 28px;

}

.about_third .company-name {
    background: linear-gradient(to left,
            #FEE4B5 0%,
            #FEE4B5 25%,
            #EDCD92 50%,
            #DBB56E 75%,
            #DBB56E 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #DBB56E;
}

.about_third .text-center p {
    font-size: 28px;
    color: white;
    line-height: 141%;
    letter-spacing: -3%;
    margin-bottom: 18px;
    padding: 0px 20px;
}

.about_third .text-center {
    margin-bottom: 57px;
}

.about_third .card {
    padding: 32px 40px 32px 40px;
    border-radius: 12px;
    background-color: #1E1C1C;
    height: 100%;
    text-align: left;
}

.about_third .card:hover {
    box-shadow: 0 0 20px #E7C586;
    /* gold glow */
}


.about_third .card .card-title p {
    line-height: 26px;
    letter-spacing: 0.15;
    font-weight: 400;
    font-size: 24px;
    background: linear-gradient(to left,
            #FEE4B5 0%,
            #FEE4B5 25%,
            #EDCD92 50%,
            #DBB56E 75%,
            #DBB56E 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #DBB56E;
    margin-bottom: 16px;
}

.about_third .card .card-content p {
    line-height: 28px;
    letter-spacing: 0;
    font-size: 20px;
    color: #D9D9D9;
}

.about_third .num1 {
    background-image: url(../img/1.png);
    background-size: auto 100px;
    /* Adjust size as needed */
    background-repeat: no-repeat;
    background-position: bottom right 10px;
    /* Position in bottom right with some padding */
    position: relative;
}

.about_third .num1 .card-title,
.about_third .num1 .card-content {
    position: relative;
    z-index: 1;
}

.about_third .num3 {
    background-image: url(../img/3.png);
    background-size: auto 100px;
    /* Adjust size as needed */
    background-repeat: no-repeat;
    background-position: bottom right;
    /* Position in bottom right with some padding */
    position: relative;
}

.about_third .num3 .card-title,
.about_third .num3 .card-content {
    position: relative;
    z-index: 1;
}

.about_third .num4 {
    background-image: url(../img/4.png);
    background-size: auto 100px;
    /* Adjust size as needed */
    background-repeat: no-repeat;
    background-position: bottom right 10px;
    /* Position in bottom right with some padding */
    position: relative;
}

.about_third .num4 .card-title,
.about_third .num4 .card-content {
    position: relative;
    z-index: 1;
}

.about_third .num6 {
    background-image: url(../img/6.png);
    background-size: auto 100px;
    /* Adjust size as needed */
    background-repeat: no-repeat;
    background-position: bottom right;
    /* Position in bottom right with some padding */
    position: relative;
}

.about_third .num6 .card-title,
.about_third .num6 .card-content {
    position: relative;
    z-index: 1;
}

.about_third .num2 {
    background-image: url(../img/2.png);
    background-size: auto 100px;
    /* Adjust size as needed */
    background-repeat: no-repeat;
    background-position: top right;
    /* Position in bottom right with some padding */
    position: relative;
}

.about_third .num2 .card-title,
.about_third .num2 .card-content {
    position: relative;
    z-index: 1;
}

.about_third .num5 {
    background-image: url(../img/5.png);
    background-size: auto 100px;
    /* Adjust size as needed */
    background-repeat: no-repeat;
    background-position: top right;
    /* Position in bottom right with some padding */
    position: relative;
}

.about_third .num5 .card-title,
.about_third .num5 .card-content {
    position: relative;
    z-index: 1;
}

.partners {
    width: 100%;
    max-width: 1440px;
    position: relative;
    margin: 0 auto;
    overflow: hidden;
    padding: 100px 65px 0 65px;
}

.partners h2 {
    font-size: 48px;
    color: white;
    margin-bottom: 20px;
}

.partners .company-name {
    background: linear-gradient(to left,
            #FEE4B5 0%,
            #FEE4B5 25%,
            #EDCD92 50%,
            #DBB56E 75%,
            #DBB56E 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #DBB56E;
}

.partners p {
    font-size: 28px;
    letter-spacing: -3%;
    color: white;
    margin-top: 18px;
}

.partners img {
    width: 888px;
    height: 838.33px;
}





.Why {
    width: 100%;
    max-width: 1440px;
    position: relative;
    margin: 0px auto;
    overflow: hidden;
    padding: 100px 65px 0 65px;
}

.Why .card-top {
    padding: 70px 100px 0 0;
}

.Why .card-top h2 {
    font-size: 48px;
    color: white;
}

.Why .company-name {
    background: linear-gradient(to left,
            #FEE4B5 0%,
            #FEE4B5 25%,
            #EDCD92 50%,
            #DBB56E 75%,
            #DBB56E 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #DBB56E;
}

.Why .card-top p {
    font-size: 24px;
    color: white;
    letter-spacing: -3%;
}

.Why .card {
    background-color: #1E1C1C;
    border-radius: 12px;
    padding: 16px 16px;
}

.Why .card:hover {
    box-shadow: 0 0 15px #E7C586;
}

.Why .card-title p {
    font-size: 18px;
    font-weight: 500;
    line-height: 22px;
    background: linear-gradient(to left,
            #FEE4B5 0%,
            #FEE4B5 25%,
            #EDCD92 50%,
            #DBB56E 75%,
            #DBB56E 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #DBB56E;
}

.Why .card-content p {
    font-size: 16px;
    color: white;
    line-height: 26px;

}





.Certificates {
    width: 100%;
    max-width: 1440px;
    padding: 100px 65px 0 65px;
    position: relative;
    margin: 0 auto;
    overflow: hidden;
}

.Certificates .text-center h3 {
    font-size: 32px;
    color: #DBB56E;
}

.Certificates .text-center p {
    font-size: 28px;
    color: white;
    letter-spacing: -3%;

}

.Certificates .text-center .colored-p {
    font-style: italic;
    color: #DBB56E;
}

.Certificates .content-bg h4 {
    font-size: 24px;
    color: #DBB56E;
}

.Certificates .content-bg h5 {
    font-size: 22px;
    font-style: bold;
    line-height: 26px;
    color: white;
}

.Certificates .content-bg p {
    color: white;
    font-size: 18px;
    line-height: 26px;
    padding-right: 315px;
}

.Certificates .col-12 {
    display: flex;
    margin-top: 57px;
}

.Certificates .cm {
    position: relative;
    bottom: 43px;
}

.Certificates .col-12 img {
    height: 19px;
    width: 19px;
    margin: 2px;
    position: relative;
}

.Certificates .col-12 .tt {
    width: 150px;
    height: 150px;
}

.Certificates .col-12 .img-ext {
    width: 150px;
    height: 190px;
}

.Certificates .col-12 .img-ext2 {
    width: 200px;
    height: 70px;
    position: relative;
    top: 50px;
}

.Certificates .second_text_box {
    padding: 0px 35px;
}

.Certificates .second_text_box p {
    color: white;
    font-size: 28px;
    margin-top: 58px;
}

.Certificates .second_text_box .bot {
    color: white;
    font-size: 28px;
    margin-top: 18px;
}










.about_last {
    width: 100%;
    max-width: 1146.81px;
    position: relative;
    margin: 100px auto;
    overflow: hidden;
    padding: 0 65px 0 65px;
}

.about_last h2 {
    font-size: 48px;
    color: white;
}

.about_last .company-name {
    background: linear-gradient(to left,
            #FEE4B5 0%,
            #FEE4B5 25%,
            #EDCD92 50%,
            #DBB56E 75%,
            #DBB56E 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #DBB56E;
}

.about_last p {
    font-size: 28px;
    letter-spacing: -3%;
    color: white;
    margin-top: 21px;
}

.about_last .color-text {
    color: #DBB56E;
    font-style: italic;
}




/* Projects Page */
/* Projects First Section */

.projects_first {
    position: relative;
    width: 100%;
    max-width: 1440px;
    margin: 66px auto 40px auto;
}

.projects_first::before {
    content: '';
    position: absolute;
    top: 30px;
    right: -146.41px;
    width: 498.3125px;
    height: 469px;
    background-image: url(../img/icons/image\ 59.png);
    opacity: 30%;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: top right;
    /* Makes it subtle like in your reference */
    z-index: 1;
    pointer-events: none;
    /* Ensures it doesn't interfere with content */
}

.projects_first .container {
    width: 100%;
    max-width: 1440px;
    position: relative;
    margin: 0 auto 0 auto;
    padding: 150px 0px 100px 65px;
}


.projects_first h5 {
    font-size: 16px;
    color: #797979;
    line-height: 44px;
}

.projects_first h1 {
    font-size: 68.53px;
    color: white;
    font-weight: 600;
    line-height: 100%;
}

.projects_first .company-name {
    background: linear-gradient(to left,
            #FEE4B5 0%,
            #FEE4B5 25%,
            #EDCD92 50%,
            #EDCD92 75%,
            #DBB56E 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #DBB56E;
}

.projects_first p {
    font-size: 28px;
    color: #FFFFFF;
    letter-spacing: -3%;
    font-weight: 400;
    padding-right: 350px;
}

.projects_first .btn {
    padding: 8px 20px;
    margin-top: 10px;
    font-size: 24px;
    background: linear-gradient(to right, #FEE4B5, #A46C03);
    font-weight: 600;
    border: none;
    border-radius: 12px;
    color: #0D0D0D;
}

.projects_main {
    width: 100%;
    max-width: 1440px;
    position: relative;
    margin: 0px auto 40px auto;
    overflow: hidden;
    padding: 0px 65px 0px 65px;
}

.projects_main h2 {
    font-size: 68.53px;
    color: white;
}

.projects_main h5 {
    font-size: 14px;
    font-weight: 400;
    font-style: normal;
    /* Sector font size */
    color: #DBB56E;
    /* Sector color */
    margin-bottom: 10px;
}

.projects_main .company-name {
    background: linear-gradient(to left,
            #FEE4B5 0%,
            #FEE4B5 25%,
            #EDCD92 50%,
            #DBB56E 75%,
            #DBB56E 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #DBB56E;
}

.project_pills-section .pills-wrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 15px;
}

.project_pills-section .pill {
    position: relative;
    background-color: transparent;
    color: #FFFFFF;
    border: none;
    text-decoration: none;
    transition: all 0.3s ease;
    display: inline-block;
    font-size: 18px;
    padding: 10px 30px;
    background-color: #353536;
    margin-top: 10px;
    margin-bottom: 30px;
}

.project_pills-section .pill.active::before {
    content: '';
    position: absolute;
    inset: 0;
    padding: 2px;
    /* This creates the border width */
    background: linear-gradient(to right, #FEE4B5, #A46C03);
    border-radius: 20px;
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask-composite: xor;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
}

.project_pills-section .pill:hover {
    box-shadow: 0 0 15px #E7C586;
    /* Gold glow on hover */
}


.project_pills-section {
    width: 100%;
    position: relative;
    margin: 0px auto 0px auto;
    overflow: hidden;
}

.project_content_list {
    width: 100%;
    max-width: 1127px;
    position: relative;
    margin: 50px auto 40px auto;
    overflow: hidden;
}





/* Project Main Section - Grid and Card Styling */
.projects_main .container {
    padding: 0 15px;
    /* Adjust container padding */
}

.projects_main .row {
    display: flex;
    flex-wrap: wrap;
    margin-left: -15px;
    /* Compensate for column padding */
    margin-right: -15px;
    /* Compensate for column padding */
    justify-content: start;
    /* Center the grid items */
}

.projects_main .col-4 {
    /* Targeting the columns directly */
    padding: 15px;
    /* Add padding between columns */
    box-sizing: border-box;
}

.projects_main .card {
    background-color: #1e1c1c;
    /* Dark background from image */
    border-radius: 12px;
    /* Rounded corners */
    overflow: hidden;
    /* Ensure image corners are rounded */
    height: 100%;
    /* Make cards same height in a row */
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    /* Push content and arrow apart */
    transition: box-shadow 0.3s ease;
    border: none;
    /* Remove default card border */
}

.projects_main .card:hover {
    box-shadow: 0 0 20px #e7c586;
    /* Gold glow on hover */
}

.projects_main .card img {
    width: fill;
    height: 268px;
    /* Fixed height for images */
    object-fit: cover;
    /* Cover the area without distortion */
    border-radius: 12px 12px 0 0;
    /* Top corners rounded */
}

.projects_main .card-content {
    padding: 20px;
    /* Padding inside the card for text */
    flex-grow: 1;
    /* Allow content to take available space */
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.projects_main .card h3 {
    font-size: 18px;
    /* Title font size */
    background: linear-gradient(to right, #DBB56E 0%, #DBB56E 25%, #EDCE93 50%, #FEE4B5 75%, #FEE4B5 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    /* Title color */
    margin-bottom: 8px;
    /* Space below title */
    font-weight: 600;
}

.projects_main .card p {
    font-size: 14px;
    font-weight: 400;
    font-style: normal;
    /* Sector font size */
    color: #FFFFFF;
    /* Sector color */
    margin-bottom: 0;
    /* No margin below sector text */
}

.projects_main .card .arrow-link {
    display: flex;
    justify-content: flex-end;
    /* Align arrow to the right */
    padding: 10px 20px 20px 20px;
    /* Padding for the arrow area */
    color: #DBB56E;
    /* Gold color for arrow */
    font-size: 24px;
    /* Size of the arrow */
    text-decoration: none;
    transition: transform 0.2s ease;
}

.projects_main .card .arrow-link:hover {
    transform: translateX(5px);
    /* Slight movement on hover */
}

/* Pagination */
.pagination-container {
    display: flex;
    justify-content: center;
    margin-top: 50px;
    margin-bottom: 50px;
}

.pagination-item {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    margin: 0 5px;
    border-radius: 50%;
    background-color: #0D0D0D;
    /* Dark background for pagination circles */
    color: #d9d9d9;
    font-size: 16px;
    text-decoration: none;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.pagination-item:hover {
    background-color: #dbb56e;
    /* Gold on hover */
    color: #0d0d0d;
    /* Dark text on hover */
}

.pagination-item.active {
    background: linear-gradient(to right, #FEE4B5, #A46C03);
    /* Active gold */
    color: #0d0d0d;
    /* Dark text for active */
    font-weight: bold;
}

/* Responsive adjustments for projects grid */
@media (max-width: 992px) {
    .projects_main .col-lg-4 {
        /* Target large columns for 2-column layout */
        width: 33.33%;
        flex: 0 0 50%;
        max-width: 33.33%;
    }
}



.project_details {
    position: relative;
    width: 100%;
    height: 600px;
    background-size: 100% auto;
    background-position: center;
    background-repeat: no-repeat;
    margin: 85px 0 0 0;
}

.project_details::before {
    content: "";
    position: absolute;
    inset: 0;
    /* overlay for readability */
    z-index: 1;
}

.project-brief-line {
    height: 2px;
    /* thickness */
    width: 50%;
    /* 60% of viewport width */
    background: linear-gradient(to right, #FEE4B5, #A46C03);
    border-radius: 3px;
    margin: 20px 0;
}


.project_details .container {
    position: relative;
    z-index: 2;
    /* keep h2 above overlay */
    max-width: 1440px;
    width: 100%;
    margin: 0 auto;
    padding: 20px 40px;
    /* add spacing from top/left */
}

.project-info {
    width: 100%;
    max-width: 1440px;
    position: relative;
    margin: 75px auto 40px auto;

}

.project_details .project-info .col-12,
.ddp {
    padding: 0 50px;
    z-index: 2;
}

.project_content .dpv {
    display: flex;
    justify-content: center !important;
    align-items: center;
}

.project_content .col-4 {
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    gap: 20px;
}

.dpv {
    position: relative;
}

.project_content .dpv::after {
    content: "";
    position: absolute;
    top: 0;
    right: 60px;
    width: 6px;
    /* thickness of border */
    height: 100%;
    background: linear-gradient(to bottom, #FEE4B5, #A46C03);
    border-radius: 3px;
}

.project_details h2 {
    color: white;
    font-size: 42px;
    margin: 0;
    position: relative;
    z-index: 2;
}

.project_content .container {
    max-width: 1440px;
    width: 100%;
    margin: 0px auto 0px auto;
    padding: 0 40px;
}

.project_details .company-name {
    background: linear-gradient(to left,
            #FEE4B5 0%,
            #FEE4B5 25%,
            #EDCD92 50%,
            #DBB56E 75%,
            #DBB56E 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #DBB56E;
}

.project_content .fa-arrow-left {
    height: 24px;
    width: 24px;
    color: #DBB56E;
    position: relative;
    left: 26px;
    top: 18px;
}

.project_details img {
    width: 100%;
    height: 600px;
    display: block;
    object-fit: cover;
    z-index: 1;
}

.project_content h1 {
    font-size: 38px;
    text-transform: uppercase;
    background: linear-gradient(to right, #DBB56E 0%, #DBB56E 25%, #EDCE93 50%, #FEE4B5 75%, #FEE4B5 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    text-align: right;
    font-weight: 600;

    /* Thin, light gray border */
    padding-right: 75px;
    /* Space between text and border */

}

.project_content .row {
    margin-top: 0px;

}

.project_content strong {
    background: linear-gradient(to right, #DBB56E 0%, #DBB56E 25%, #EDCE93 50%, #FEE4B5 75%, #FEE4B5 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    font-size: 18px;
    font-weight: 400;
}

.project_content .detail-item {
    color: white;
    font-size: 18px;
    font-weight: 400;
    text-align: left;
    width: 100%;
}

.email-link {
    position: relative;
    bottom: 3px;
}

.ddt {
    display: flex;
    align-items: start;
    padding: 0 40px;
}

.project_brief_description {
    margin-bottom: 30px;
    width: 80%;
}


.project_brief h3 {
    background: linear-gradient(to right, #FEE4B5, #A46C03);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    font-size: 68.53px;
    line-height: 100%;
    margin-top: 90px;
    padding: 0 35px 0 35px;
}

.project_brief_description p {
    font-size: 24px;
    color: #D9D9D9;
    font-weight: 400;
    line-height: 141%;
    letter-spacing: -3%;
    padding-right: 10px;
    text-align: justify;
}

.project_detailed_description p {
    font-size: 24px;
    color: #D9D9D9;
    font-style: italic;
    font-weight: 400;
    line-height: 141%;
    letter-spacing: -3%;
    text-align: justify;
}

.project_detailed_description {
    position: relative;
    /* so pseudo-element positions correctly */
    padding-left: 20px;
    /* add space so text doesn’t overlap border */
}

.project_detailed_description::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 6px;
    /* thickness of border */
    height: 100%;
    background: linear-gradient(to bottom, #FEE4B5, #A46C03);
    border-radius: 3px;
}

.project_brief_description .btn-secondary {
    position: relative;
    background-color: transparent;
    background: linear-gradient(to right, #DBB56E 0%, #DBB56E 25%, #EDCE93 50%, #FEE4B5 75%, #FEE4B5 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    border: none;
    font-size: 24px;
    font-weight: 600;
    text-decoration: none;
    border-radius: 12px;
    transition: all 0.3s ease;
    display: inline-block;
    padding: 8px 30px;
    margin-top: 30px;
}

.project_brief_description .btn-secondary::before {
    content: '';
    position: absolute;
    inset: 0;
    padding: 2px;
    /* This creates the border width */
    background: linear-gradient(to right, #FEE4B5, #A46C03);
    border-radius: 12px;
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask-composite: xor;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
}



@media (max-width: 1440px) {
    .about {
        overflow: hidden;
    }

    .why {
        overflow: hidden;
    }

    .service_first {
        overflow: hidden;
    }

    .projects_first {
        overflow: hidden;
    }

    .about_first {
        overflow: hidden;
    }

    .project_details {
        overflow: hidden;
    }
}

@media (max-width: 1060px) {
    .header {
        background-color: #0D0D0D;
        padding: 1rem 0;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        z-index: 1000;
    }

    .header-content {
        max-width: 1060px;
        margin: 0 auto;
        padding: 0 2rem;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .header img {
        width: 130px;
        background-color: #0B150F;
    }

    .menu-btn {
        background: none;
        border: none;
        font-size: 1.5rem;
        cursor: pointer;
        padding: 0.5rem;
        border-radius: 4px;
        transition: background-color 0.2s;
        color: #DBB56E;
    }

    .menu-btn:hover {
        background-color: rgba(240, 240, 240, 0.1);
    }



    /* Sidebar */
    .close-btn {
        color: white;
        background-color: #0B150F;
        border-radius: 30px;
        border: 1px solid #0B150F;
        position: absolute;
        top: 1rem;
        left: 1rem;
        font-size: 1.5rem;
        cursor: pointer;
        padding: 0.5rem;
        transition: background-color 0.2s;
    }

    .close-btn:hover {
        background-color: #34495e;
    }

    .sidebar {
        position: fixed;
        top: 0;
        right: -400px;
        width: 400px;
        height: 100vh;
        background-color: #0D0D0D;
        color: white;
        transition: right 0.3s ease;
        z-index: 1001;
        overflow-y: auto;
    }

    .sidebar.open {
        right: 0;
    }

    .nav-menu {
        padding: 100px 0;
    }

    .nav-item {
        display: block;
        padding: 1rem 1.5rem;
        color: white;
        text-decoration: none;
        transition: background-color 0.2s;
        border: none;
        background: none;
        width: 80%;
        text-align: left;
        cursor: pointer;
        display: flex;
        align-items: center;
        gap: 0.75rem;
        border-radius: 10px;
        font-size: 15px;
        font-weight: 500;
        line-height: 150%;
    }

    .nav-item:hover {
        background-color: #272727;
    }

    .nav-item.active {
        position: relative;
        background-color: #272727;
        /* Solid background color */

        font-size: 15px;
        font-weight: 500;
        line-height: 150%;
        color: transparent;
        /* So text doesn't show default color */
    }

    .nav-item.active span,
    .nav-item.active i {
        background-image: linear-gradient(to right, #fee4b5, #a46c03);
        background-clip: text;
        -webkit-background-clip: text;
        color: transparent;
        -webkit-text-fill-color: transparent;
    }

    .nav-icon {
        font-size: 1.25rem;
        width: 20px;
        text-align: center;
    }


    /* Banner-01 */


    .banner-01 {
        position: relative;
        width: 100%;
        max-width: 1060px;
        margin: 0 auto;
        overflow: hidden;
    }

    .hero-image {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }

    .hero-overlay {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        display: flex;
        align-items: center;
        padding: 0 60px;
    }

    .hero-content {
        flex: 1;
        max-width: 759px;
        z-index: 2;
    }

    .banner-01 h5 {
        color: #E1E1E1;
    }

    .inner-heading {
        position: relative;
        height: 60px;
        overflow: hidden;
        display: inline-block;
        vertical-align: top;
        width: 310px;
        min-width: 310px;
    }

    .inner-heading span {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        animation: slideText 6s ease-in-out infinite;
    }

    .inner-heading span div {
        height: 60px;
        line-height: 60px;
        background: linear-gradient(to right,
                #FEE4B5 0%,
                /* Bright gold at top */
                #FEE4B5 25%,
                /* Orange-gold */
                #D3AA5F 50%,
                /* Goldenrod middle */
                #A46C03 75%,
                /* Dark goldenrod */
                #A46C03 100%
                /* Saddle brown at bottom */
            );
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
        /* Fallback */
        font-size: inherit;
        white-space: nowrap;
        width: 100%;
    }

    @keyframes slideText {

        0%,
        20% {
            top: 0;
        }

        30%,
        50% {
            top: -62px;
        }

        60%,
        80% {
            top: -124px;
        }

        90%,
        100% {
            top: 0;
        }
    }

    .hero-title {
        font-size: 52px;
        font-weight: bold;
        color: white;
        line-height: 100%;
        margin-bottom: 24px;
        padding-right: 60px;
    }

    .hero-title .highlight {
        color: #D4AF37;
    }

    .hero-subtitle {
        font-size: 24px;
        color: #e0e0e0;
        line-height: 1.6;
        margin-bottom: 40px;
        text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
        padding-right: 80px;
    }

    .hero-buttons {
        display: flex;
        gap: 15px;
        flex-wrap: wrap;
    }

    .banner-01 .btn {
        position: relative;
        margin: 0px;
        padding: 8px 40px;
        font-size: 24px;
        font-weight: 600;
        text-decoration: none;
        border-radius: 12px;
        transition: all 0.3s ease;
        cursor: pointer;
        border: none;
        text-align: center;
        display: flex;
        justify-content: center;
        line-height: 44px;
    }

    .banner-01 .btn-primary {
        background-color: transparent;
        color: #E1E1E1;
        font-weight: 600;
    }

    .banner-01 .btn-secondary {
        background-color: transparent;
        color: #E1E1E1;
        font-weight: 600;
    }

    .banner-01 .btn-primary::before {
        content: '';
        position: absolute;
        inset: 0;
        padding: 2px;
        /* This creates the border width */
        background: linear-gradient(to right, #FEE4B5, #A46C03);
        border-radius: 12px;
        mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        mask-composite: xor;
        -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        -webkit-mask-composite: xor;
    }

    .banner-01 .btn-secondary::before {
        content: '';
        position: absolute;
        inset: 0;
        padding: 2px;
        /* This creates the border width */
        background: linear-gradient(to right, #FEE4B5, #A46C03);
        border-radius: 12px;
        mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        mask-composite: xor;
        -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        -webkit-mask-composite: xor;
    }

    .hero-logo {
        position: absolute;
        right: 150px;
        top: 50%;
        transform: translateY(-50%);
        width: 80px;
        height: 80px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    /* Main-pill section*/

    .pills-section {
        padding: 0px 16px;
    }

    .pills-container {
        max-width: 1060px;
        margin: 0 auto;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .pills-wrapper {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 16px;
    }

    .pill {
        display: inline-flex;
        align-items: center;
        padding: 12px 24px;
        color: #FFFFFF;
        text-decoration: none;
        font-size: 14px;
        font-weight: 500;
        border-radius: 9999px;
        white-space: nowrap;
        transition: background-color 0.2s ease;
        position: relative;
    }

    .main-port .pill:hover::after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
        width: 30%;
        height: 2px;
        background: linear-gradient(to right, #FEE4B5, #A46C03);
        border-radius: 3px;
    }

    .about_nav .pill:hover::after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
        width: 30%;
        height: 2px;
        background: linear-gradient(to right, #FEE4B5, #A46C03);
        border-radius: 3px;
    }


    /* about section*/

    .about {
        padding: 80px 0;
        /* Add this to contain the background */
        /* Remove your existing background-image properties */
        position: relative;
        width: 100%;
        max-width: 1060px;
        margin: 0 auto;
        overflow: hidden;
    }

    /* Add this new pseudo-element for the background logo */
    .about::before {
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        width: 400px;
        height: 400px;
        background-image: url(../img/image-02.png);
        background-size: 250px 320px;
        background-repeat: no-repeat;
        background-position: top right;
        /* Makes it subtle like in your reference */
        z-index: 1;
        pointer-events: none;
        /* Ensures it doesn't interfere with content */
    }

    .about .container {
        max-width: 1060px;
        margin: 0 auto;
        padding: 0 70px;
        position: relative;
        /* Add this */
        z-index: 2;
        /* Ensures content stays above background */
    }

    .about h2 {
        font-size: 44px;
        /* Your existing size */
        font-weight: 500;
        margin-bottom: 40px;
        line-height: 1.2;
        color: white;
    }

    .about h2 .company-name {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
    }

    .about p:first-of-type {
        font-size: 20px;
        font-style: italic;
        font-weight: 400;
        line-height: 34px;
        margin-bottom: 30px;
        color: #DBB56E;
    }

    .about p {
        font-size: 20px;
        font-weight: 400;
        line-height: 34px;
        margin-bottom: 25px;
        color: #D9D9D9;
    }

    .about .btn-secondary {
        position: relative;
        background-color: transparent;
        color: #FFFFFF;
        border: none;
        font-size: 24px;
        font-weight: 600;
        text-decoration: none;
        border-radius: 12px;
        transition: all 0.3s ease;
        display: inline-block;
        padding: 8px 20px;

    }

    .about .btn-secondary::before {
        content: '';
        position: absolute;
        inset: 0;
        padding: 2px;
        background: linear-gradient(to right, #FEE4B5, #A46C03);
        border-radius: 12px;
        mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        mask-composite: xor;
        -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        -webkit-mask-composite: xor;
    }



    .about .image-wrapper {
        position: absolute;
        right: 20px;
        top: 50%;
        transform: translateY(-50%);
        display: flex;
        align-items: center;
        justify-content: center;
        width: 350px;
        /* adjust as needed */
        height: 580px;
        /* adjust as needed */
        margin: auto;
    }

    /* Base image style */
    .about .section-about-img .img {
        width: 200px;
        /* adjust size */
        height: 400px;
        object-fit: cover;
        position: absolute;
        border-radius: 300px;
        /* elliptical shape */
        overflow: hidden;
    }

    /* Left/top image */
    .about .section-about-img .img-left {
        left: 0;
        top: 0;
        z-index: 1;
    }

    /* Right/bottom image */
    .about .section-about-img .img-right {
        right: 0;
        bottom: 0;
        z-index: 2;
    }





    /*Services Section*/

    .services {
        width: 100%;
        max-width: 1060px;
        position: relative;
        margin: 0 auto;
        overflow: hidden;
        background-color: #1A1711;

    }

    .services .container {
        padding: 0px;
        width: 90%;
        max-width: 1060px;
        margin: 0 auto;
    }

    .services .text-center h2 {
        font-size: 32px;
        color: white;
        letter-spacing: -3%;
        line-height: 48px;
        margin-bottom: 18px;
        margin-top: 28px;
    }

    .services .text-center p {
        font-size: 20px;
        color: #D9D9D9;
        line-height: 141%;
        letter-spacing: -3%;
        margin-bottom: 18px;
        padding: 0px 10px
    }

    .services .text-center {
        margin-bottom: 30px;
    }

    .services span {
        color: #DBB56E;
    }


    .services .card {
        padding: 10px 10px 10px 18px;
        border-radius: 12px;
        background-color: #1E1C1C;
        height: 100%;
        text-align: left;
        justify-content: start;

    }

    .services .card:hover {
        box-shadow: 0 0 20px #E7C586;
        /* gold glow */
    }

    .services .card img {
        height: 22px;
        width: 22px;
        margin-top: 8px;
        margin-left: 0px;
    }

    .services .card .card-title p {
        line-height: 26px;
        letter-spacing: 0.15;
        font-size: 20px;
        background: linear-gradient(to right, #DBB56E 0%, #DBB56E 25%, #EDCE93 50%, #FEE4B5 75%, #FEE4B5 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: transparent;
        margin-top: 8px;
    }

    .services .card .card-content p {
        line-height: 22px;
        letter-spacing: 0;
        font-size: 20px;
        color: #D9D9D9;
    }

    .services .num1 {
        background-image: url(../img/1.png);
        background-size: auto 50px;
        /* Adjust size as needed */
        background-repeat: no-repeat;
        background-position: bottom right 10px;
        /* Position in bottom right with some padding */
        position: relative;
    }

    .services .num1 .card-title,
    .services .num1 .card-content {
        position: relative;
        z-index: 1;
    }

    .services .num3 {
        background-image: url(../img/3.png);
        background-size: auto 50px;
        /* Adjust size as needed */
        background-repeat: no-repeat;
        background-position: bottom right;
        /* Position in bottom right with some padding */
        position: relative;
    }

    .services .num3 .card-title,
    .services .num3 .card-content {
        position: relative;
        z-index: 1;
    }

    .services .num4 {
        background-image: url(../img/4.png);
        background-size: auto 50px;
        /* Adjust size as needed */
        background-repeat: no-repeat;
        background-position: bottom right 10px;
        /* Position in bottom right with some padding */
        position: relative;
    }

    .services .num4 .card-title,
    .services .num4 .card-content {
        position: relative;
        z-index: 1;
    }

    .services .num6 {
        background-image: url(../img/6.png);
        background-size: auto 50px;
        /* Adjust size as needed */
        background-repeat: no-repeat;
        background-position: bottom right;
        /* Position in bottom right with some padding */
        position: relative;
    }

    .services .num6 .card-title,
    .services .num6 .card-content {
        position: relative;
        z-index: 1;
    }

    .services .num2 {
        background-image: url(../img/2.png);
        background-size: auto 50px;
        /* Adjust size as needed */
        background-repeat: no-repeat;
        background-position: top right;
        /* Position in bottom right with some padding */
        position: relative;
    }

    .services .num2 .card-title,
    .services .num2 .card-content {
        position: relative;
        z-index: 1;
    }

    .services .num5 {
        background-image: url(../img/5.png);
        background-size: auto 50px;
        /* Adjust size as needed */
        background-repeat: no-repeat;
        background-position: top right;
        /* Position in bottom right with some padding */
        position: relative;
    }

    .services .num5 .card-title,
    .services .num5 .card-content {
        position: relative;
        z-index: 1;
    }



    /*Projects*/

    .projects {
        width: 100%;
        max-width: 1060px;
        position: relative;
        margin: 0px auto;
        overflow: hidden;
        padding: 50px 40px 0 40px;
    }

    .projects .text-center h2 {
        font-size: 32px;
        color: white;
        margin-bottom: 18px;
    }

    .projects .text-center p {
        font-size: 24px;
        color: #D9D9D9;
        margin-bottom: 50px;
    }

    .projects .company-name {
        font-size: 32px;
        background: linear-gradient(to right, #DBB56E 0%, #DBB56E 25%, #EDCE93 50%, #FEE4B5 75%, #FEE4B5 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
    }

    .projects .row {
        width: 90%;
        max-width: 1060px;
        position: relative;
        margin: 0px auto;
    }

    .projects .image-box img {
        border-radius: 20px;
        height: 190px;
        width: 200px;
    }

    .projects .image-box img:hover {
        box-shadow: 0 0 30px #E7C586;
    }

    .projects .image-box {
        width: 200px;
    }


    .projects .image-box p {
        margin-top: 10px;
        letter-spacing: -3%;
        line-height: 141%;
        color: #FFFFFF;
        font-size: 20px;
    }

    /*Why Section Page Index*/

    .why {
        width: 100%;
        max-width: 1060px;
        position: relative;
        margin: 50px auto;
        overflow: hidden;
        padding-top: 100px;
        padding-bottom: 100px;
    }

    .why::before {
        width: 420px;
        height: 400px;
    }

    .why .container {
        padding: 00px 63px;
        width: 100%;
        max-width: 1060px;
        margin: 0 auto;
    }

    .why h2 {
        font-size: 32px;
        color: white;
        margin-bottom: 16px;
        letter-spacing: -3%;
        line-height: 58px;
    }

    .why p {
        font-size: 20px;
        color: #D9D9D9;
        line-height: 121%;
        letter-spacing: -3%;
        padding-right: 0px;
    }

    .why .company-name {
        font-size: 32px;
        background: linear-gradient(to right, #DBB56E 0%, #DBB56E 25%, #EDCE93 50%, #FEE4B5 75%, #FEE4B5 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
    }

    .why .why-top-para {
        color: #DBB56E;
        font-size: 22px;
        font-weight: 400;
        line-height: 100%;
        letter-spacing: -3%;
        padding-right: 250px;
    }

    .why .card p {
        color: #DBB56E;
        padding: 15px 10px;
        background-color: transparent;
        border-radius: 8px;
        font-size: 16px;
        font-weight: 500;
        line-height: 100%;
    }

    .why .card {
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 20px 30px;
        background-color: transparent;
    }





    .why .text-center p {
        color: #DBB56E;
        font-size: 20px;
        letter-spacing: -3%;
        line-height: 141%;
        max-width: 1000px;
        width: 100%;
        margin: 0px auto;
    }


    /* Cilent section last section*/

    .clients {
        width: 100%;
        max-width: 1060px;
        position: relative;
        margin: 30px auto 50px auto;
        overflow: hidden;

    }

    .clients h3 {
        font-size: 20px;
        color: white;
    }

    .clients .top_btn .btn {
        font-size: 24px;
        font-weight: 600;
        color: #0D0D0D;
        background: linear-gradient(to right, #FEE4B5, #A46C03);
        border: none;
        padding: 8px 20px;
        margin-top: 12px;
    }

    .clients .footer_start {
        background-color: #1A1711;
        width: 100%;
        max-width: 1231px;
        margin: 0px auto;
        border-radius: 30px;
        padding: 50px;
        background-image:
            url(../img/image\ 5.png),
            url(../img/image\ 4.png);
        background-size:
            120px 120px,
            120px 120px;
        background-position:
            top left,
            bottom right;
        background-repeat: no-repeat, no-repeat;
        position: relative;
        z-index: 1;
        pointer-events: none;
    }


    /*Footer*/


    .footer {
        width: 100%;
        max-width: 1060px;
        position: relative;
        margin: 0px auto;
        overflow: hidden;
    }

    .footer .cnum1 {
        position: relative;
        width: 100%;
        max-width: 850px;
        height: auto;
        left: 10%;
        top: 60px;
        margin: 0 auto;
        display: block;
    }

    .footer .cnum1 h1 {
        font-size: 100px;
        font-weight: 800;
        letter-spacing: -3%;
        display: inline-block;
        color: #DBB56E;
        opacity: 20%;
        overflow: hidden;
    }


    .inner-heading-bottom {
        position: relative;
        height: 95px;
        overflow: hidden;
        display: inline-block;
        width: 420px;
        min-width: 420px;
    }

    .inner-heading-bottom span {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        animation: footerslidetext 6s ease-in-out infinite;
    }

    .inner-heading-bottom span div {
        height: 100px;
        line-height: 120%;
        color: #DBB56E;
        /* Fallback */
        font-size: 100px;
        white-space: nowrap;
        width: 100%;
        overflow: hidden;
    }

    @keyframes footerslidetext {

        0%,
        20% {
            top: 0;
        }

        30%,
        50% {
            top: -100px;
        }

        60%,
        80% {
            top: -200px;
        }

        90%,
        100% {
            top: 0;
        }
    }

    .footer .cnum2 {
        position: relative;
        z-index: 1;
        padding: 0px 20px 20px 20px;
        width: 100%;
        max-width: 1060px;
        background-color: #1A1711;
        background-image: url(../img/image\ 59.png);
        background-size: 469px 200px;
        /* Adjust size as needed */
        background-repeat: no-repeat;
        background-position: bottom left;
        /* Position in bottom right with some padding */
        position: relative;
    }

    .footer .footer_head {
        margin-bottom: 30px;
    }

    .footer h2 {
        margin-top: 50px;
        color: white;
        font-size: 32px;
        letter-spacing: -3%;
        margin-bottom: 18px;
        position: relative;
        z-index: 1;
    }

    .footer .company-name {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
    }

    .footer .footer_head p {
        color: #D9D9D9;
        font-size: 20px;
        letter-spacing: -3%;
        line-height: 141%;
        width: 95%;
        margin: 0px auto 20px auto;
        position: relative;
        z-index: 1;
        margin-bottom: 30px;
    }


    .owl-carousel {
        margin: 0px auto 0 auto;
        display: flex;
        justify-content: space-between;
        align-items: center;
        position: relative;
        z-index: 1;
        width: 100%;
        max-width: 1060px;
        overflow: hidden;
        height: 80.78px;
    }

    .owl-carousel img {
        display: flex;
        justify-content: space-between;
        align-items: end;
        position: relative;
    }

    .owl-carousel .img1 img {
        height: 39.72px;
        width: 230.53px;
        margin-top: 20px;
    }

    .owl-carousel .img2 img {
        height: 49.77px;
        width: 184.3px;
    }

    .owl-carousel .img3 img {
        height: 53.47px;
        width: 85.13px;
    }

    .owl-carousel .img4 img {
        height: 58.6px;
        width: 141.54px;
    }

    .owl-carousel .img5 img {
        height: 60.82px;
        width: 140px;
    }

    .owl-carousel .img6 img {
        height: 80.78px;
        width: 156.98px;
    }

    .owl-carousel .carousel_gap {
        color: #DBB56E;
    }

    .footer .base_text {
        width: 90%;
        margin: 12px auto 0 auto;
        display: flex;
        justify-content: space-between;
        align-items: center;
        position: relative;
        z-index: 1;
        padding-top: 10px;

    }

    .footer .base_text-about {
        width: 90%;
        margin: 20px auto 0 auto;
        display: flex;
        justify-content: space-between;
        align-items: center;
        position: relative;
        z-index: 1;
        padding-top: 20px;

    }

    .footer .base_text-about::before {
        content: "";
        position: absolute;
        top: 0;
        left: 50%;
        transform: translateX(-50%);
        width: 60%;
        /* custom width */
        height: 2px;
        background: linear-gradient(to right, #FEE4B5, #A46C03);
    }

    .footer .base_text .footer-icon {
        height: 38.08020782470703px;
        width: 177px;
        margin-bottom: 5px;
    }

    .footer .base_text-about .footer-icon {
        height: 38.08020782470703px;
        width: 177px;
        margin-bottom: 5px;
    }

    .footer .text-start .link-parent {
        display: flex;
        flex-direction: column;
        gap: 4px;
        align-items: start;
    }

    .footer .text-start .link-parent img {
        margin-right: 8px;
    }

    .footer .text-start .call-calling {
        position: relative;
        top: 0px;
        right: 10px;
    }



    .footer .base_text a {
        font-size: 13px;
        /* Smaller font size for links */
        margin: 2px 0;
        /* Adjusted vertical margin */
        display: block;
        /* Ensure links stack */
        text-align: right;
        line-height: 7.6px;
        /* Align links to the left */
    }

    .footer .base_text-about a {
        font-size: 13px;
        /* Smaller font size for links */
        margin: 2px 0;
        /* Adjusted vertical margin */
        display: block;
        /* Ensure links stack */
        text-align: right;
        line-height: 7.6px;
        /* Align links to the left */
    }


    .footer .base_text a {
        color: white;

    }

    .footer .base_text .fa {
        color: gold;
    }

    .footer .base_text-about a {
        color: white;

    }

    .footer .base_text-about .fa {
        color: gold;
    }

    .footer .text-end p {
        color: #A6A6A6;
        font-size: 12px;
        text-align: left;
    }

    .footer .text-end {
        position: absolute;
        width: 250px;
        height: 60px;
        right: 0px;
    }

    .input-container {
        position: relative;
        width: 300px;
    }

    .input-container input {
        width: 402px;
        padding: 10px 50px 10px 10px;
        /* room for button */
        box-sizing: border-box;
        font-size: 12px;
        color: #A6A6A6;
        border-radius: 70px;
        border-color: #A6A6A6;
        background-color: #1A1711;
    }

    .input-container button {
        position: absolute;
        right: 0px;
        top: 2px;
        height: 40px;
        width: 40px;
        background: #DBB56E;
        color: white;
        cursor: pointer;
        border-radius: 30px;
    }

    .last_sect p {
        font-size: 12px;
    }

    .last_sect .footer_base_downloads {
        display: flex;
        justify-content: center;
        gap: 14px;
    }

    .last_sect .footer_base_downloads p {
        margin-bottom: 0px;
        font-size: 12px;
    }

    .last_sect {
        width: 90%;
        margin: 10px auto 0 auto;
        justify-content: space-between;
        align-items: center;
        position: relative;
        z-index: 1;
        padding-top: 30px;
    }



    /* Contect Page */
    /* Contact First Section Start*/
    .contact_first {
        width: 100%;
        max-width: 1060px;
        position: relative;
        margin: 50px auto 40px auto;
        overflow: hidden;
        padding: 50px 0px 0px 40px;
    }

    .contact_first h5 {
        font-size: 12px;
        color: #797979;
        line-height: 44px;
    }

    .contact_first h1 {
        font-size: 32px;
        color: white;
    }

    .contact_first .company-name {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
    }

    .contact_first p {
        font-size: 20px;
        color: #FFFFFF;
        letter-spacing: -3%;
    }


    /* Content Second Section Start */

    .contact_second {
        width: 100%;
        max-width: 1060px;
        position: relative;
        margin: 50px auto;
        overflow: hidden;
        background-color: #1A1711;
        height: 550px;
    }

    .contact_second .col_left {
        background-color: #000000;
        border-radius: 10px;
        height: 530px;
        padding: 18px;
        /* Added for internal spacing */
        box-sizing: border-box;
        margin-top: 10px;
        background-image: url(../img/image\ 4.png), url(../img/Ellipse\ 793.png);
        background-position: right bottom, left bottom;
        background-repeat: no-repeat, no-repeat;
        margin-left: 0px;
    }

    .contact_second .col_left .link-parent {
        display: flex;
        flex-direction: column;
        gap: 10px;
        align-items: start;
        margin: 0px 30px;
    }

    .contact_second .col_left .link-parent img {
        margin-right: 10px;
    }

    .contact_second .col_left .phone_link {
        position: relative;
        top: 0px;
        right: 10px;
    }

    .contact_second .col_left .email-link {
        position: relative;
        bottom: 3px;
    }

    .contact_second h2 {
        font-size: 24px;
        color: white;
        margin: 10px 0px 0px 10px;
    }

    .contact_second p {
        font-size: 14px;
        color: #C9C9C9;
        margin: 10px 0px 0px 10px;
    }

    .contact_second a {
        color: white;
    }


    .contact_second .col_right {
        border-radius: 10px;
        /* Added border-radius */
        padding: 15px;
        /* Added padding */
        height: 647px;
        /* Added height to match col_left */
        box-sizing: border-box;
        z-index: 1;

    }



    .contact_second .col_right .contact-form label {
        color: #FFFFFF;
        /* Light gray for labels */
        font-size: 16px;

    }

    .contact_second .col_right .form-control {
        color: white;
        /* White text for inputs */
        background: none;
        border: none;
        border-bottom: 1px solid #444;
        border-radius: 0;
        padding: 8px 0px;
        box-shadow: none;
    }

    .contact_second .col_right .btn {
        padding: 4px 30px;
        margin-top: 10px;
        line-height: 40px;
        font-size: 16px;
        font-weight: 600;
        background: linear-gradient(to right, #FEE4B5, #A46C03);
        border: none;
        border-radius: 12px;
        color: #0D0D0D;
    }


    .contact-third {
        width: 100%;
        max-width: 1060px;
        margin: 20px auto;
        position: relative;
        overflow: hidden;
        padding: 20px auto;
    }

    .contact-third h5 {
        color: white;
        margin: 15px;
        font-size: 15px;
    }

    .contact-third p {
        color: white;
        font-size: 12px;
    }

    .contact-third .text-bottom {
        display: flex;
        justify-content: center;
    }



    /* Service First Section */



    .service_first {
        width: 100%;
        max-width: 1060px;
        position: relative;
        margin: 50px auto 0px auto;
        overflow: hidden;
        padding: 100px 0px 70px 40px;
    }

    .service_first::before {
        width: 300px;
        height: 330px;
        top: 70px;
        right: -50px;
    }

    .service_first .container {
        padding: 0 45px;
        width: 100%;
        max-width: 1060px;
        margin: 0 auto;
    }

    .service_first h5 {
        font-size: 12px;
        color: #797979;
        line-height: 32px;

    }

    .service_first h1 {
        font-size: 32px;
        color: white;
    }

    .service_first .company-name {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
        font-size: 32px;
    }

    .service_first p {
        font-size: 20px;
        color: #FFFFFF;
        letter-spacing: -3%;
        font-weight: 400;
        line-height: 100%;
        padding-right: 250px;
    }

    .service_first .btn {
        padding: 4px 16px;
        margin-top: 10px;
        font-size: 20px;
        border: none;
        background-color: transparent;
        border-radius: 12px;

        color: #E1E1E1;
    }

    .service_first .btn::before {
        content: '';
        position: absolute;
        inset: 0;
        padding: 2px;
        background: linear-gradient(to right, #FEE4B5, #A46C03);
        border-radius: 12px;
        mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        mask-composite: xor;
        -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        -webkit-mask-composite: xor;
    }



    .service_pic_section {}

    .service_pic_section .service_1 .tot {
        background-image: url(../img/Ellipse\ 2774.png), url(../img/Ellipse\ 2775.png);
        background-repeat: no-repeat, no-repeat;
        background-position: center, center;
        background-size: 80%, 65%;
    }

    .service_pic_section .tot {
        position: relative;
        width: 300px;
        height: 300px;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .service_pic_section .tot .img {
        width: 180px;
        height: 180px;
        border-radius: 12px;
        object-fit: cover;
        position: absolute;
    }

    .service_pic_section .tot .img-top {
        top: 0;
        left: 0;
        z-index: 1;
    }

    .service_pic_section .tot .img-bottom {
        bottom: 0;
        right: 0;
        z-index: 2;
    }



    .service_pic_section .tots {
        position: relative;
        width: 330px;
        /* adjust as needed */
        height: 489px;
        /* adjust as needed */
        margin: auto;
    }

    /* Base image style */
    .service_pic_section .tots .img {
        width: 190px;
        /* adjust size */
        height: 390px;
        object-fit: cover;
        position: absolute;
        border-radius: 241.79px;
        /* elliptical shape */
    }

    /* Left/top image */
    .service_pic_section .tots .img-left {
        left: 0;
        top: 0;
        z-index: 1;
    }

    /* Right/bottom image */
    .service_pic_section .tots .img-right {
        right: 0;
        bottom: 0;
        z-index: 2;
    }

    .service_pic_section .row {
        width: 100%;
        max-width: 1060px;
        position: relative;
        margin: 0px auto;
        overflow: hidden;
        margin-bottom: 80px;
        border-radius: 20px;
        background-color: #1A1711;
        padding: 0px 0px 0px 40px;
    }

    .service_pic_section .service_1 .row {
        background-image: url(../img/1.png);
        background-repeat: no-repeat;
        background-position: left bottom;
    }

    .service_pic_section .tts {
        width: 25px;
        height: 25px;
    }

    .service_pic_section .card-title {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
        font-size: 32px;
    }

    .service_pic_section .card-content {
        color: white;
        font-size: 18px;
        padding-right: 30px;
        line-height: 141%;
        letter-spacing: -3%;
    }

    .service_pic_section .wop {
        padding-left: 0px 50px;
    }

    .service_pic_section .wp {
        padding: 50px 50px;
    }



    .service_pic_section .service_2 .row {
        background-image: url(../img/2.png);
        background-repeat: no-repeat;
        background-position: right bottom;
        background-size: auto 80px;
    }

    .service_pic_section .service_3 .row {
        background-image: url(../img/3.png);
        background-repeat: no-repeat;
        background-position: left bottom;
        background-size: auto 80px;
    }

    .service_pic_section .service_4 .row {
        background-image: url(../img/4.png);
        background-repeat: no-repeat;
        background-position: right 10px bottom;
        background-size: auto 80px;
    }

    .service_pic_section .service_5 .row {
        background-image: url(../img/s-5.png);
        background-repeat: no-repeat;
        background-position: left bottom;
        background-size: auto 80px;
    }

    .service_pic_section .service_6 .row {
        background-image: url(../img/6.png);
        background-repeat: no-repeat;
        background-position: right 10px bottom;
        background-size: auto 80px;
    }


    /* About Us Page */
    /* About Top Nav */

    .about_nav {
        width: 100%;
        max-width: 1060px;
        position: relative;
        margin: 0px auto;
        overflow: hidden;
        padding: 0px 0px 0px 0px;
        position: sticky;
        top: 60px;
        /* same as header height */
        z-index: 998;
        /* just below header */
        background-color: #0D0D0D;
        /* match site background */
        padding: 10px 0;
    }

    .about_nav .pills-wrapper {
        gap: 25px;
    }

    .about_nav .pill {
        font-size: 12px;
        font-weight: 500;
        line-height: 160%;
        font-style: Medium;
    }


    .about_first {
        width: 100%;
        max-width: 1060px;
        position: relative;
        margin: 10px auto;
        overflow: hidden;
        padding: 40px 100px 0px 0px;

    }

    .about_first::before {
        width: 300px;
        height: 330px;
        top: 50px;
        right: -50px;
    }


    .about_first .container {
        padding: 0 40px;
        width: 100%;
        max-width: 1060px;
        margin: 0 auto;
    }

    .about_first h5 {
        font-size: 12px;
        color: #797979;
        line-height: 44px;
        padding-right: 150px;
    }

    .about_first h1 {
        font-size: 32px;
        color: white;
    }

    .about_first .company-name {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
    }

    .about_first p {
        font-size: 16px;
        color: #FFFFFF;
        letter-spacing: -3%;
        padding-right: 150px;
    }

    .about_second {
        width: 100%;
        max-width: 1060px;
        position: relative;
        padding: 60px 20px 110px 0px;
        margin: 0px auto;
        overflow: hidden;
    }

    .about_second .col-8 {
        padding: 50px 30px 50px 50px;
    }

    .about_second h2 {
        font-size: 32px;
        color: white;
        letter-spacing: -3%;
        line-height: auto;
        margin-bottom: 24px;
        margin-top: 28px;
    }

    .about_second p {
        font-size: 20px;
        color: white;
        line-height: 27px;
        letter-spacing: -3%;
        margin-bottom: 16px;
        padding: 0px 50px 0px 0px;
    }

    .about_second .company-name {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
    }


    .about_second .image-wrapper {
        position: absolute;
        right: 20px;
        top: 50%;
        transform: translateY(-50%);
        display: flex;
        align-items: center;
        justify-content: center;
        width: 350px;
        /* adjust as needed */
        height: 580px;
        /* adjust as needed */
        margin: auto;
    }

    /* Base image style */
    .about_second .about_second_image .img {
        width: 200px;
        /* adjust size */
        height: 400px;
        object-fit: cover;
        position: absolute;
        border-radius: 300px;
        /* elliptical shape */
        overflow: hidden;
    }

    /* Left/top image */
    .about_second .about_second_image .img-left {
        left: 0;
        top: 0;
        z-index: 1;
    }

    /* Right/bottom image */
    .about_second .about_second_image .img-right {
        right: 0;
        bottom: 0;
        z-index: 2;
    }

    .about_third {
        width: 100%;
        max-width: 1060px;
        position: relative;
        margin: 0px auto;
        overflow: hidden;
        padding: 0 40px 0 40px;
    }


    .about_third h2 {
        font-size: 32px;
        color: white;
        letter-spacing: -3%;
        line-height: auto;
        margin-bottom: 8px;
        margin-top: 28px;
    }

    .about_third .company-name {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
    }

    .about_third .text-center p {
        font-size: 20px;
        color: white;
        line-height: 100%;
        letter-spacing: -3%;
        margin-bottom: 18px;
        padding: 0px 20px;
    }

    .about_third .text-center {
        margin-bottom: 57px;
    }

    .about_third .card {
        padding: 12px 20px 12px 10px;
        border-radius: 12px;
        background-color: #1E1C1C;
        height: 100%;
        text-align: left;

    }

    .about_third .card:hover {
        box-shadow: 0 0 20px #E7C586;
        /* gold glow */
    }


    .about_third .card .card-title p {
        line-height: 16px;
        letter-spacing: 0.15;
        font-size: 20px;
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
        margin-bottom: 16px;
    }

    .about_third .card .card-content p {
        line-height: 20px;
        letter-spacing: 0;
        font-size: 16px;
        color: #D9D9D9;
    }

    .about_third .num1 {
        background-image: url(../img/1.png);
        background-size: auto 50px;
        /* Adjust size as needed */
        background-repeat: no-repeat;
        background-position: bottom right 10px;
        /* Position in bottom right with some padding */
        position: relative;
    }

    .about_third .num1 .card-title,
    .about_third .num1 .card-content {
        position: relative;
        z-index: 1;
    }

    .about_third .num3 {
        background-image: url(../img/3.png);
        background-size: auto 50px;
        /* Adjust size as needed */
        background-repeat: no-repeat;
        background-position: bottom right;
        /* Position in bottom right with some padding */
        position: relative;
    }

    .about_third .num3 .card-title,
    .about_third .num3 .card-content {
        position: relative;
        z-index: 1;
    }

    .about_third .num4 {
        background-image: url(../img/4.png);
        background-size: auto 50px;
        /* Adjust size as needed */
        background-repeat: no-repeat;
        background-position: bottom right 10px;
        /* Position in bottom right with some padding */
        position: relative;
    }

    .about_third .num4 .card-title,
    .about_third .num4 .card-content {
        position: relative;
        z-index: 1;
    }

    .about_third .num6 {
        background-image: url(../img/6.png);
        background-size: auto 50px;
        /* Adjust size as needed */
        background-repeat: no-repeat;
        background-position: bottom right;
        /* Position in bottom right with some padding */
        position: relative;
    }

    .about_third .num6 .card-title,
    .about_third .num6 .card-content {
        position: relative;
        z-index: 1;
    }

    .about_third .num2 {
        background-image: url(../img/2.png);
        background-size: auto 50px;
        /* Adjust size as needed */
        background-repeat: no-repeat;
        background-position: top right;
        /* Position in bottom right with some padding */
        position: relative;
    }

    .about_third .num2 .card-title,
    .about_third .num2 .card-content {
        position: relative;
        z-index: 1;
    }

    .about_third .num5 {
        background-image: url(../img/5.png);
        background-size: auto 50px;
        /* Adjust size as needed */
        background-repeat: no-repeat;
        background-position: top right;
        /* Position in bottom right with some padding */
        position: relative;
    }

    .about_third .num5 .card-title,
    .about_third .num5 .card-content {
        position: relative;
        z-index: 1;
    }

    .partners {
        width: 100%;
        max-width: 1060px;
        position: relative;
        margin: 0 auto;
        overflow: hidden;
        padding: 50px 40px 0 40px;
    }

    .partners h2 {
        font-size: 32px;
        color: white;
        margin-bottom: 20px;
    }

    .partners .company-name {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
    }

    .partners p {
        font-size: 18px;
        letter-spacing: -3%;
        color: white;
        margin-top: 18px;
    }

    .partners img {
        width: 688px;
        height: 638.33px;
    }





    .Why {
        width: 100%;
        max-width: 1060px;
        position: relative;
        margin: 50px auto;
        overflow: hidden;
    }

    .Why .card-top h2 {
        font-size: 32px;
        color: white;
    }

    .Why .company-name {
        background: linear-gradient(to right, #fee4b5, #DBB56E);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
    }

    .Why .card-top p {
        font-size: 16px;
        color: white;
        letter-spacing: -3%;
        line-height: 19px;
    }

    .Why .card {
        background-color: #1E1C1C;
        border-radius: 12px;
        padding: 5px 4px;
    }

    .Why .card-title p {
        font-size: 14px;
        color: gold;
        margin-bottom: 8px;
    }

    .Why .card-content p {
        font-size: 10px;
        color: white;
        line-height: 16px;
        margin-bottom: 8px;
    }

    .Certificates {
        width: 100%;
        max-width: 1060px;
        position: relative;
        margin: 50px auto;
        overflow: hidden;
    }

    .Certificates .text-center h3 {
        font-size: 32px;
        color: #DBB56E;
    }

    .Certificates .text-center p {
        font-size: 16px;
        color: white;
        letter-spacing: -3%;
    }

    .Certificates .text-center .colored-p {
        font-style: italic;
        color: #DBB56E;
    }

    .Certificates .content-bg h4 {
        font-size: 16px;
        color: #DBB56E;
    }

    .Certificates .content-bg h5 {
        font-size: 14px;
        font-style: bold;
        line-height: 26px;
        color: white;
    }

    .Certificates .content-bg p {
        color: white;
        font-size: 12px;
        line-height: 20px;
        padding-right: 170px;
    }

    .Certificates .col-12 {
        display: flex;
        margin-top: 57px;
    }

    .Certificates .cm {
        position: relative;
        bottom: 10px;
    }

    .Certificates .col-12 img {
        height: 19px;
        width: 19px;
        right: 5px;
        margin: 0px 8px;
        position: relative;
    }

    .Certificates .col-12 .tt {
        width: 100px;
        height: 100px;
    }

    .Certificates .col-12 .img-ext {
        width: 100px;
        height: 125px;
    }

    .Certificates .col-12 .img-ext2 {
        width: 100px;
        height: 45px;
    }

    .Certificates .second_text_box {
        padding: 0px 35px;
    }

    .Certificates .second_text_box p {
        color: white;
        font-size: 16px;
        margin-top: 38px;
    }

    .Certificates .second_text_box .bot {
        color: white;
        font-size: 16px;
        margin-top: 18px;
    }










    .about_last {
        width: 100%;
        max-width: 900px;
        position: relative;
        margin: 100px auto;
        overflow: hidden;
    }

    .about_last h2 {
        font-size: 32px;
        color: white;
    }

    .about_last .company-name {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
    }

    .about_last p {
        font-size: 18px;
        letter-spacing: -3%;
        color: white;
        margin-top: 12px;
    }

    .about_last .color-text {
        color: #DBB56E;
        font-style: italic;
    }




    /* Projects Page */
    /* Projects First Section */

    .projects_first {
        width: 100%;
        max-width: 1060px;
        position: relative;
        margin: 50px auto 0px auto;
        overflow: hidden;
        padding: 50px 0px 50px 0px;

    }

    .projects_first::before {
        width: 300px;
        height: 330px;
        top: 40px;
        right: -50px;
    }

    .projects_first .container {
        padding: 20px 40px;
        width: 100%;
        max-width: 1060px;
        margin: 0 auto;
    }

    .projects_first h5 {
        font-size: 12px;
        color: #797979;
        line-height: 44px;
    }

    .projects_first h1 {
        font-size: 32px;
        color: white;
    }

    .projects_first .company-name {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #EDCD92 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
    }

    .projects_first p {
        font-size: 16px;
        color: #FFFFFF;
        letter-spacing: -3%;
        padding-right: 350px;
    }

    .projects_first .btn {
        padding: 4px 12px;
        line-height: 40px;
    }

    .projects_main {
        width: 100%;
        max-width: 1060px;
        position: relative;
        margin: 50px auto 40px auto;
        overflow: hidden;
        padding: 0px 40px 0px 40px;
    }

    .projects_main h2 {
        font-size: 32px;
        color: white;
        line-height: 44px;
    }

    .projects_main .company-name {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
    }

    .project_pills-section .pill {
        font-size: 12px;
        padding: 4px 12px;
        background-color: #353536;
        margin-bottom: 0px;
    }

    .project_pills-section {
        width: 100%;
        max-width: 1060px;
        position: relative;
        margin: 0px auto 0px auto;
        overflow: hidden;
    }

    .project_content_list {
        width: 100%;
        max-width: 1060px;
        position: relative;
        margin: 50px auto 40px auto;
        overflow: hidden;
    }





    /* Project Main Section - Grid and Card Styling */
    .projects_main .container {
        padding: 0 15px;
        /* Adjust container padding */
    }

    .projects_main .row {
        display: flex;
        flex-wrap: wrap;
        margin-left: -15px;
        /* Compensate for column padding */
        margin-right: -15px;
        /* Compensate for column padding */
        justify-content: start;
        /* Center the grid items */
    }

    .projects_main .col-4 {
        /* Targeting the columns directly */
        padding: 15px;
        /* Add padding between columns */
        box-sizing: border-box;
    }

    .projects_main .card {
        background-color: #1e1c1c;
        /* Dark background from image */
        border-radius: 12px;
        /* Rounded corners */
        overflow: hidden;
        /* Ensure image corners are rounded */
        height: 100%;
        /* Make cards same height in a row */
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        /* Push content and arrow apart */
        transition: box-shadow 0.3s ease;
        border: none;
        /* Remove default card border */
    }

    .projects_main .card:hover {
        box-shadow: 0 0 20px #e7c586;
        /* Gold glow on hover */
    }

    .projects_main .card img {
        width: fill;
        height: 150px;
        /* Fixed height for images */
        object-fit: cover;
        /* Cover the area without distortion */
        border-radius: 12px 12px 0 0;
        /* Top corners rounded */
    }

    .projects_main .card-content {
        padding: 20px;
        /* Padding inside the card for text */
        flex-grow: 1;
        /* Allow content to take available space */
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }

    .projects_main .card h3 {
        font-size: 18px;
        /* Title font size */
        background: linear-gradient(to right, #DBB56E 0%, #DBB56E 25%, #EDCE93 50%, #FEE4B5 75%, #FEE4B5 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: transparent;
        /* Title color */
        margin-bottom: 8px;
        /* Space below title */
        font-weight: 600;
    }

    .projects_main .card p {
        font-size: 14px;
        font-weight: 400;
        /* Sector font size */
        color: #FFFFFF;
        /* Sector color */
        margin-bottom: 0;
        /* No margin below sector text */
    }

    .projects_main h5 {
        font-size: 14px;
        font-weight: 400;
        font-style: normal;
        /* Sector font size */
        color: #DBB56E;
        /* Sector color */
        margin-bottom: 8px;
    }

    .projects_main .card .arrow-link {
        display: flex;
        justify-content: flex-end;
        /* Align arrow to the right */
        padding: 10px 20px 20px 20px;
        /* Padding for the arrow area */
        color: #DBB56E;
        /* Gold color for arrow */
        font-size: 24px;
        /* Size of the arrow */
        text-decoration: none;
        transition: transform 0.2s ease;
    }

    .projects_main .card .arrow-link:hover {
        transform: translateX(5px);
        /* Slight movement on hover */
    }

    /* Pagination */
    .pagination-container {
        display: flex;
        justify-content: center;
        margin-top: 50px;
        margin-bottom: 50px;
    }

    .pagination-item {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        margin: 0 5px;
        border-radius: 50%;
        background-color: #0D0D0D;
        /* Dark background for pagination circles */
        color: #d9d9d9;
        font-size: 12px;
        text-decoration: none;
        transition: background-color 0.3s ease, color 0.3s ease;
    }

    .pagination-item:hover {
        background-color: #dbb56e;
        /* Gold on hover */
        color: #0d0d0d;
        /* Dark text on hover */
    }

    .pagination-item.active {
        background: linear-gradient(to right, #FEE4B5, #A46C03);
        /* Active gold */
        color: #0d0d0d;
        /* Dark text for active */
        font-weight: bold;
    }

    /* Responsive adjustments for projects grid */
    @media (max-width: 992px) {
        .projects_main .col-lg-4 {
            /* Target large columns for 2-column layout */
            width: 33.33%;
            flex: 0 0 50%;
            max-width: 33.33%;
        }
    }



    .project_details {
        max-width: 1060px;
        margin: 75px auto 40px auto;
        overflow: hidden;
        position: relative;
        width: 100%;
        height: 500px;
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    }

    .project_content .container {
        width: 100%;
        max-width: 1060px;
        position: relative;
        padding: 10px 0px;
    }

    .project-info {
        width: 100%;
        max-width: 1060px;
        position: relative;
        margin: 0px auto 0px auto;

    }



    .project_details h2 {
        color: white;
        font-size: 32px;
        position: absolute;
        top: 20px;
        left: 20px;
    }

    .project_details .company-name {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
    }

    .project_content .fa-arrow-left {
        height: 16px;
        width: 16px;
        color: #DBB56E;
    }

    .project_details img {
        width: 100%;
        max-width: 1070px;
        height: 500;
        margin: 0px auto;
        display: block;
        object-fit: cover;
        z-index: 1;
    }

    .project_content h1 {
        font-size: 28px;
        background: linear-gradient(to right, #DBB56E 0%, #DBB56E 25%, #EDCE93 50%, #FEE4B5 75%, #FEE4B5 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: transparent;
        text-align: right;
        text-transform: uppercase;
        /* Thin, light gray border */
        padding-right: 50px;
        /* Space between text and border */

    }

    .project_content .col-6 {
        display: flex;
        justify-content: start;
        align-items: center;
    }

    .project_content .col-4 {
        display: flex;
        flex-direction: column;
        justify-content: start;
        align-items: center;
        gap: 15px;
    }

    .project_content .dpv::after {
        content: "";
        position: absolute;
        top: 0;
        right: 40px;
        width: 6px;
        /* thickness of border */
        height: 100%;
        background: linear-gradient(to bottom, #FEE4B5, #A46C03);
        border-radius: 3px;
    }

    .project_content .row {
        margin-top: 0px;
    }

    .project_content strong {
        color: #DBB56E;
        font-size: 14px;
    }

    .project_content .detail-item {
        font-size: 14px;
        color: white;
    }

    .project_brief h3 {
        background: linear-gradient(to right, #DBB56E 0%, #DBB56E 25%, #EDCE93 50%, #FEE4B5 75%, #FEE4B5 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: transparent;
        font-size: 24px;
        line-height: 40px;
        margin-top: 70px;
        padding: 0 40px;
    }

    .project_brief_description {
        margin-bottom: 15px;
        width: 90%;
    }

    .project_brief_description p {
        font-size: 16px;
        color: white;
        line-height: 141%;
        letter-spacing: -3%;
        padding-right: 0px;
        text-align: justify;
    }

    .project_detailed_description p {
        font-size: 16px;
        color: white;
        line-height: 141%;
        letter-spacing: -3%;
        text-align: justify;
    }

    .project_brief_description .btn-secondary {
        position: relative;
        background-color: transparent;
        background: linear-gradient(to right, #DBB56E 0%, #DBB56E 25%, #EDCE93 50%, #FEE4B5 75%, #FEE4B5 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: transparent;
        border: none;
        font-size: 20px;
        font-weight: 600;
        text-decoration: none;
        border-radius: 12px;
        transition: all 0.3s ease;
        display: inline-block;
        padding: 8px 16px;
        margin-top: 15px;
    }

    .project_brief_description .btn-secondary::before {
        content: '';
        position: absolute;
        inset: 0;
        padding: 2px;
        /* This creates the border width */
        background: linear-gradient(to right, #FEE4B5, #A46C03);
        border-radius: 12px;
        mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        mask-composite: xor;
        -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        -webkit-mask-composite: xor;
    }
}






@media (max-width: 850px) {
    .header {
        background-color: #0D0D0D;
        padding: 0rem 0;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        z-index: 1000;
    }

    .header-content {
        max-width: 850px;
        margin: 0 auto;
        padding: 0 2rem;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .header img {
        width: 110px;
        background-color: #0B150F;
    }

    .menu-btn {
        background: none;
        border: none;
        font-size: 1.5rem;
        cursor: pointer;
        padding: 0.5rem;
        border-radius: 4px;
        transition: background-color 0.2s;
        color: #DBB56E;
    }

    .menu-btn:hover {
        background-color: rgba(240, 240, 240, 0.1);
    }

    .close-btn {
        color: white;
        background-color: #0B150F;
        border-radius: 30px;
        border: 1px solid #0B150F;
        position: absolute;
        top: 1rem;
        left: 1rem;
        font-size: 0.5rem;
        cursor: pointer;
        padding: 0.5rem;
        transition: background-color 0.2s;
    }

    .close-btn:hover {
        background-color: #34495e;
    }

    .sidebar {
        position: fixed;
        top: 0;
        right: -250px;
        width: 250px;
        height: 100vh;
        background-color: #0D0D0D;
        color: white;
        transition: right 0.3s ease;
        z-index: 1001;
        overflow-y: auto;
    }

    .sidebar.open {
        right: 0;
    }

    .nav-menu {
        padding: 50px 0;
    }

    .nav-item {
        display: block;
        padding: 1rem 1.5rem;
        color: white;
        text-decoration: none;
        transition: background-color 0.2s;
        border: none;
        background: none;
        width: 80%;
        text-align: left;
        cursor: pointer;
        display: flex;
        align-items: center;
        gap: 0.75rem;
        border-radius: 10px;
        font-size: 10px;
        font-weight: 500;
        line-height: 100%;
    }

    .nav-item:hover {
        background-color: #272727;
        font-size: 10px;
    }

    .nav-item.active {
        background-color: #272727;
        color: transparent;
        font-size: 10px;

    }

    .nav-item.active span,
    .nav-item.active i {
        background-image: linear-gradient(to right, #fee4b5, #a46c03);
        background-clip: text;
        -webkit-background-clip: text;
        color: transparent;
        -webkit-text-fill-color: transparent;
    }

    .nav-icon {
        font-size: 1.25rem;
        width: 20px;
        text-align: center;
    }

    .header-content {
        padding: 0 1rem;
        /* Reduced padding for header content */
    }

    .header img {
        width: 100px;
        /* Smaller logo size */
    }

    .banner-01 {
        position: relative;
        width: 100%;
        max-width: 850px;
        margin: 50px auto 0 auto;
        /* Adjusted margin to remove bottom margin */
        overflow: hidden;
        height: 400px;
    }

    .hero-image {
        width: 100%;
        /* Changed to 100% to be responsive within max-width */
        height: 400px;
        object-fit: cover;
        display: block;
    }

    .hero-overlay {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        display: flex;
        align-items: center;
        padding: 200px 16px;
        /* Added horizontal padding */
    }

    .hero-content {
        flex: 1;
        max-width: 100%;
        /* Allow content to take full available width */
        z-index: 2;
    }

    .banner-01 h5 {
        color: #E1E1E1;
        ;
        margin-top: 10px;
        font-size: 12px;
        line-height: 1;
    }

    .inner-heading {
        position: relative;
        height: 24px;
        /* Reduced height for smaller font */
        overflow: hidden;
        display: inline-block;
        vertical-align: top;
        width: 250px;
        /* Adjusted width for smaller text */
        min-width: 250px;
        font-size: 24px;
        /* Adjusted font size */
    }

    .inner-heading span {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        animation: slideText 6s ease-in-out infinite;

    }

    .inner-heading span div {
        height: 24px;
        /* Adjusted height */
        line-height: 24px;
        /* Adjusted line height */
        background: linear-gradient(to right,
                #fee4b5 0%,
                /* Bright gold at top */
                #fee4b5 25%,
                /* Orange-gold */
                #d3aa5f 50%,
                /* Goldenrod middle */
                #a46c03 75%,
                /* Dark goldenrod */
                #a46c03 100%
                /* Saddle brown at bottom */
            );
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #dbb56e;
        /* Fallback */
        font-size: inherit;
        white-space: nowrap;
        width: 100%;

    }

    @keyframes slideText {

        0%,
        20% {
            top: 0;
        }

        30%,
        50% {
            top: -24px;
            /* Adjusted for new height */
        }

        60%,
        80% {
            top: -48px;
            /* Adjusted for new height */
        }

        90%,
        100% {
            top: 0;
        }
    }

    .hero-title {
        font-size: 24px;
        font-weight: bold;
        color: white;
        line-height: auto;
        margin-bottom: 10px;
    }

    .hero-title .highlight {
        color: #d4af37;

    }

    .hero-subtitle {
        font-size: 14px;
        color: #e0e0e0;
        text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
        margin-bottom: 10px;
        padding-right: 60px;

    }

    .hero-buttons {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        /* Reduced gap between buttons */
    }

    .banner-01 .btn {
        position: relative;
        background-color: transparent;
        margin: 0px;
        padding: 5px 11px;
        font-size: 16px;
        /* Slightly smaller font for buttons */
        font-weight: 600;
        text-decoration: none;
        border-radius: 7px;
        transition: all 0.3s ease;
        cursor: pointer;
        border: none;
        text-align: center;
        display: flex;
        justify-content: center;
        line-height: 20px;
    }

    .banner-01 .btn-primary {
        background-color: transparent;
        color: #E1E1E1;
        font-weight: 600;
    }

    .banner-01 .btn-secondary {
        background-color: transparent;
        color: #E1E1E1;
        font-weight: 600;

    }

    .banner-01 .btn-primary::before {
        content: '';
        position: absolute;
        inset: 0;
        padding: 1px;
        background: linear-gradient(to right, #FEE4B5, #A46C03);
        border-radius: 3.23px;
        mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        mask-composite: xor;
        -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        -webkit-mask-composite: xor;
    }

    .banner-01 .btn-secondary::before {
        content: '';
        position: absolute;
        inset: 0;
        padding: 1px;
        background: linear-gradient(to right, #FEE4B5, #A46C03);
        border-radius: 3.23px;
        mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        mask-composite: xor;
        -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        -webkit-mask-composite: xor;
    }

    .hero-logo {
        position: absolute;
        right: 5px;
        /* Adjust as needed to match the screenshot */
        top: 50%;
        transform: translateY(-50%);
        width: 206px;
        /* Use the desired width for the logo container */
        height: 185px;
        /* Use the desired height for the logo container */
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: 3;
        /* Ensure it's above other content */
    }

    .hero-logo img {
        width: 100%;
        /* Make the image fill its parent .hero-logo */
        height: 100%;
        /* Make the image fill its parent .hero-logo */
        object-fit: contain;
        /* Ensure the image scales properly within its container */
    }

    .pills-container {
        width: 100%;
        max-width: 850px;
        margin: 0 auto;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .pills-wrapper {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 2px;
    }

    .pill {
        display: inline-flex;
        align-items: center;
        padding: 4px 8px;
        /* Adjusted padding for pills */
        color: #ffffff;
        text-decoration: none;
        font-size: 9px;
        font-weight: 400;
        white-space: nowrap;
        transition: background-color 0.2s ease;
        line-height: 160%;
        position: relative;
    }

    .main-port .pill:hover::after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
        width: 30%;
        height: 2px;
        background: linear-gradient(to right, #FEE4B5, #A46C03);
        border-radius: 3px;
    }

    #about,
    #services,
    #projects,
    #why,
    #clients {
        scroll-margin-top: 100px;
    }

    .pills-section {
        position: sticky;
        top: 40px;
        /* same as .header height */
        z-index: 999;
        /* above content but below sidebar if needed */
        background-color: #0d0d0d;
        /* or your site background */
        padding: 10px 0;
    }

    .about_nav .pill:hover::after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
        width: 30%;
        height: 2px;
        background: linear-gradient(to right, #FEE4B5, #A46C03);
        border-radius: 3px;
    }


    .about {
        padding: 40px 0;
        /* Add this to contain the background */
        /* Remove your existing background-image properties */
        position: relative;
        width: 100%;
        max-width: 850px;
        margin: 0 auto;
        overflow: hidden;
    }

    .about .col-lg-7 {
        padding-right: 15px;
    }

    .about::before {
        content: '';
        position: absolute;
        top: 30px;
        right: -50px;
        width: 150px;
        height: 120px;
        background-image: url(../img/icons/image\ 59.png);
        opacity: 30%;
        background-size: auto 100%;
        background-repeat: no-repeat;
        background-position: top right;
        /* Makes it subtle like in your reference */
        z-index: 1;
        pointer-events: none;
        /* Ensures it doesn't interfere with content */

    }

    .about h2 {
        font-size: 20px;
        letter-spacing: -3%;
        margin-bottom: 12px;
    }

    .about p {
        font-size: 14px;
        letter-spacing: -3%;
        margin-bottom: 7px;
        line-height: 20px;
    }

    .about p:first-of-type {
        font-size: 14px;
        font-style: italic;
        line-height: 20px;
        margin-bottom: 7px;
        color: #DBB56E;
    }

    .about .container {
        padding: 0 30px;
    }



    .about .image-wrapper {
        position: absolute;
        right: 10px;
        top: 50%;
        transform: translateY(-50%);
        display: flex;
        align-items: center;
        justify-content: center;
        width: 160px;
        /* adjust as needed */
        height: 270px;
        /* adjust as needed */
        margin: auto;
    }

    /* Base image style */
    .about .section-about-img .img {
        width: 100px;
        /* adjust size */
        height: 170px;
        object-fit: cover;
        position: absolute;
        border-radius: 300px;
        /* elliptical shape */
        overflow: hidden;
    }

    /* Left/top image */
    .about .section-about-img .img-left {
        left: 0;
        top: 0;
        z-index: 1;
    }

    /* Right/bottom image */
    .about .section-about-img .img-right {
        right: 0;
        bottom: 0;
        z-index: 2;
    }







    .about .btn-secondary {
        position: relative;
        background-color: transparent;
        color: #FFFFFF;
        border: none;
        font-size: 16px;
        font-weight: 600;
        text-decoration: none;
        border-radius: 7px;
        transition: all 0.3s ease;
        display: inline-block;
        padding: 5px 11px;
        line-height: 20px;
    }

    .about .btn-secondary::before {
        content: '';
        position: absolute;
        inset: 0;
        padding: 2px;
        background: linear-gradient(to right, #FEE4B5, #A46C03);
        border-radius: 12px;
        mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        mask-composite: xor;
        -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        -webkit-mask-composite: xor;
    }

    .services {
        padding: 20px 0;
        /* Add this to contain the background */
        /* Remove your existing background-image properties */
        position: relative;
        width: 100%;
        max-width: 850px;
        margin: 0 auto;
        overflow: hidden;

    }

    .services .container {
        padding: 10px;
    }

    .services .text-center h2 {
        font-size: 24px;
        color: white;
        letter-spacing: -3%;
        line-height: auto;
        margin-bottom: 18px;
        margin-top: 28px;
    }

    .services .text-center p {
        font-size: 16px;
        color: white;
        line-height: 141%;
        letter-spacing: -3%;
        margin-bottom: 18px;
    }

    .services .text-center {
        margin-bottom: 15px;
    }

    .services span {
        color: #DBB56E;
    }


    .services .col-4 {
        width: 33.33%;
        flex: 0 0 33.33%;
        max-width: 33.33%;
        margin-bottom: 10px;
        /* Reduced space between cards */
        padding: 0 5px;
        /* Add horizontal padding to columns */
    }

    .services .card {
        padding: 5px;
        /* Significantly reduced padding for cards */
        border-radius: 8px;
        height: 100%;
        /* Ensure consistent height */
    }

    .services .card img {
        height: 13px;
        /* Smaller icon size */
        width: 13px;
        margin-bottom: 5px;
        /* Reduced margin below icon */
        margin-left: 0px;

    }

    .services .card .card-title p {
        line-height: 1.0;
        letter-spacing: 0;
        font-size: 14px;
        background: linear-gradient(to right, #DBB56E 0%, #DBB56E 25%, #EDCE93 50%, #FEE4B5 75%, #FEE4B5 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: transparent;
        margin-bottom: 5px;
        padding-right: 3px;
    }

    .services .card .card-content p {
        font-size: 10px;
        /* Significantly smaller font size for card content */
        line-height: 1.0;
        padding-right: 4px;
    }

    /* Adjust background numbers for services cards */
    .services .num1,
    .services .num3,
    .services .num4,
    .services .num6 {
        background-size: auto 40px;
        /* Even smaller background numbers */
        background-position: bottom right 2px;
        /* Adjust position */
    }

    .services .num2,
    .services .num5 {
        background-size: auto 40px;
        background-position: top right 2px;
    }

    .projects {
        width: 100%;
        max-width: 850px;
        position: relative;
        margin: 50px auto;
        overflow: hidden;
        padding: 0px 15px 0 15px;
    }

    .projects .container {
        padding: 0 0;
    }

    .projects .col-4 {
        display: flex;
        justify-content: center;
    }

    .projects .text-center h2 {
        font-size: 24px;
        color: white;
        margin-bottom: 18px;

    }

    .projects .text-center p {
        font-size: 16px;
        color: #D9D9D9;
        margin-bottom: 50px;
        padding: 0px 30px 0 30px;
    }

    .projects .company-name {
        font-size: 24px;
        background: linear-gradient(to right, #DBB56E 0%, #DBB56E 25%, #EDCE93 50%, #FEE4B5 75%, #FEE4B5 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
    }

    .projects .row {
        width: 100%;
        max-width: 850px;
        position: relative;
        margin: 0px auto;
    }

    .projects .image-box img {
        border-radius: 20px;
        width: 100px;
        height: 100px;
    }

    .projects .image-box img:hover {
        box-shadow: 0 0 30px #E7C586;
    }

    .projects .image-box {
        width: 100.52px;
        text-align: center;
    }


    .projects .image-box p {
        margin-top: 20px;
        letter-spacing: -3%;
        line-height: 141%;
        color: #FFFFFF;
        font-size: 12px;
    }

    .why {
        width: 100%;
        max-width: 850px;
        position: relative;
        margin: 10px auto;
        overflow: hidden;
        padding: 0px;

    }

    .why::before {
        width: 200px;
        height: 269px;
        left: -40px;
    }

    .why .container {
        padding: 0px 20px;
        width: 100%;
        max-width: 850px;
        margin: 0 auto;
    }

    .why .col-5 {
        width: 41.66666666666667%;
    }

    .why .col-7 {
        width: 58.33333333333333%;
    }

    .why h2 {
        font-size: 24px;
        color: white;
        margin-bottom: 16px;
        letter-spacing: -3%;
        line-height: 24px;
    }

    .why p {
        font-size: 13px;
        color: #D9D9D9;
        line-height: 141%;
        letter-spacing: -3%;
        padding-right: 0px;
    }

    .why .company-name {
        font-size: 24px;
        background: linear-gradient(to right, #DBB56E 0%, #DBB56E 25%, #EDCE93 50%, #FEE4B5 75%, #FEE4B5 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
    }

    .why .why-top-para {
        color: #DBB56E;
        font-size: 16px;
        font-weight: 400;
        line-height: 100%;
        letter-spacing: -3%;
        padding-right: 150px;
    }

    .why .card p {
        color: #DBB56E;
        padding: 15px 10px;
        background-color: transparent;
        border-radius: 8px;
        font-size: 12px;
        font-weight: 500;
        line-height: 100%;
    }

    .why .card {
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 10px 20px;
        background-color: transparent;
    }

    .why .text-center p {
        color: #DBB56E;
        font-size: 18px;
        letter-spacing: -3%;
        line-height: 141%;
        max-width: 600px;
        width: 100%;
        margin: 0px auto;
    }

    .clients {
        width: 100%;
        max-width: 850px;
        position: relative;
        margin: 50px auto;
        overflow: hidden;
        padding: 0px 30px 0 30px;

    }

    .clients h3 {
        font-size: 14px;
        color: white;
    }

    .clients .top_btn .btn {
        font-size: 16px;
        font-weight: 600;
        color: #0D0D0D;
        background: linear-gradient(to right, #FEE4B5, #A46C03);
        border: none;
        padding: 8px 16px;
        margin-top: 20px;
        border-radius: 7px;
    }

    .clients .footer_start {
        background-color: #1A1711;
        width: 100%;
        max-width: 800px;
        margin: 0px auto;
        border-radius: 8.65px;
        padding: 20px;
        background-image:
            url(../img/image\ 5.png),
            url(../img/image\ 4.png);
        background-size:
            102px 96px,
            104px 97px;
        background-position:
            top left,
            bottom right;
        background-repeat: no-repeat, no-repeat;
        position: relative;
        z-index: 1;
        pointer-events: none;
    }

    .footer {
        max-width: 850px;
        /* Ensure it respects the max-width */
        margin: 0px auto;
        /* Center the footer */
        padding-bottom: 0px;
        /* Add some bottom padding */
    }

    .footer .cnum1 {
        width: 100%;
        /* Make it responsive */
        max-width: 389.2px;
        /* Keep original max-width if needed, but scale */
        height: auto;
        /* Adjust height automatically */
        top: 35px;
        /* Reduced top margin */
        margin: 0 auto;
        /* Center the image */
        display: block;
        /* Ensure it takes full width */
    }

    .footer .cnum1 h1 {
        font-size: 45px;
        font-weight: 800;
        letter-spacing: -3%;
        display: inline-block;
        color: #DBB56E;
        opacity: 20%;
        overflow: hidden;
    }


    .inner-heading-bottom {
        position: relative;
        height: 50px;
        overflow: hidden;
        display: inline-block;
        width: 172px;
        min-width: 150px;
    }

    .inner-heading-bottom span {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        animation: footerslidetext 6s ease-in-out infinite;
    }

    .inner-heading-bottom span div {
        height: 45px;
        line-height: 144%;
        color: #DBB56E;
        /* Fallback */
        font-size: 45px;
        white-space: nowrap;
        width: 100%;
        overflow: hidden;
    }

    @keyframes footerslidetext {

        0%,
        20% {
            top: 0;
        }

        30%,
        50% {
            top: -45px;
        }

        60%,
        80% {
            top: -90px;
        }

        90%,
        100% {
            top: 0;
        }
    }

    .footer .cnum2 {
        padding: 15px;
        /* Reduced padding */
        background-size: 270px, 120px;
        /* Smaller background images */
        background-position: bottom left 5px;
        /* Adjust position */
    }

    .footer .footer_head {
        margin-bottom: 15px;
        /* Reduced margin */
    }

    .footer h2 {
        margin-top: 30px;
        /* Reduced top margin */
        font-size: 35px;
        /* Smaller font size */
        margin-bottom: 10px;
    }

    .footer .company-name {
        font-size: 35px;
        /* Match h2 font size */
    }

    .footer .footer_head p {
        font-size: 18px;
        /* Smaller font size */
        margin-bottom: 10px;
        /* Reduced margin */
        width: 100%;
        /* Ensure full width */
        padding: 0 5px;
        /* Add some horizontal padding */
    }

    .logo-strip {
        overflow: hidden;
        width: 100%;
        max-width: 1440px;
        margin: 0 auto;
        height: 21.93px;
        /* adjust as needed */
        position: relative;
    }

    .logos-track {
        display: flex;
        gap: 15px;
        /* space between logos */
        width: calc(200%);
        /* allow scrolling loop */
        animation: scroll 30s linear infinite;
    }

    .logos-track div img {
        height: 10px;
        /* adjust sizes as needed */
        object-fit: contain;
    }

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

        to {
            transform: translateX(-50%);
            /* move by half (because of duplication) */
        }
    }

    .logos-track .img1 img {
        height: 10.78px;
        width: 62.58px;
        margin-top: 0px;

    }

    .logos-track .img2 img {
        height: 13.51px;
        width: 50.03px;
        margin-top: 0px;
    }

    .logos-track .img3 img {
        height: 14.52px;
        width: 23.11px;
        margin-top: 0px;
    }

    .logos-track .img4 img {
        height: 15.91px;
        width: 38.42px;
        margin-top: 0px;
    }

    .logos-track .img5 img {
        height: 16.51px;
        width: 42.61px;
        margin-top: 0px;
    }

    .logos-track .img6 img {
        height: 16.51px;
        width: 42.61px;
        margin-top: 0px;
    }

    .logos-track .img7 img {
        height: 16.51px;
        width: 42.61px;
        margin-top: 0px;
    }

    .separator {
        width: 3.67px;
        height: 3.67px;
        border-radius: 50%;
        background-color: #DBB56E;
        /* gold */
        flex-shrink: 0;
        margin-top: 12px;
    }

    .footer .base_text {
        width: 100%;
        /* Full width */
        margin: 8px auto 0 auto;
        /* Adjusted margin */
        display: flex;
        /* Keep as flex row */
        flex-wrap: wrap;
        /* Allow wrapping if needed */
        justify-content: space-between;
        /* Space out items */
        align-items: center;
        /* Align items vertically */
        padding-top: 6px;
        /* Reduced padding */
        position: relative;
        /* Ensure relative positioning for children */
    }

    .footer .base_text-about {
        width: 90%;
        /* Full width */
        margin: 20px auto 0 auto;
        /* Adjusted margin */
        display: flex;
        /* Keep as flex row */
        flex-wrap: wrap;
        /* Allow wrapping if needed */
        justify-content: space-between;
        /* Space out items */
        align-items: center;
        /* Align items vertically */
        padding-top: 20px;
        /* Reduced padding */
        position: relative;
        /* Ensure relative positioning for children */
    }

    .footer .base_text-about::before {
        width: 60%;
        /* Adjust line width */
        height: 1px;
        /* Thinner line */
        left: 50%;
        /* Center the line */
        transform: translateX(-50%);
        /* Center the line */
    }

    .footer .base_text .footer-icon {
        width: 112px;
        height: 24px;
        margin-bottom: 5px;
    }

    .footer .base_text-about .footer-icon {
        width: 112px;
        height: 24px;
        margin-bottom: 5px;
    }

    .footer .text-start .links {
        margin-bottom: 4px;
    }

    .footer .text-start .link-parent {
        display: flex;
        flex-direction: column;
        gap: 2px;
        align-items: start;
    }

    .footer .text-start .call-calling {
        position: relative;
        top: 0px;
        right: 9px;
    }

    .last_sect::before {
        content: "";
        position: absolute;
        top: 0;
        left: 50%;
        transform: translateX(-50%);
        width: 100%;
        /* custom width */
        height: 1px;
        background: linear-gradient(to right, #FEE4B5, #A46C03);
    }

    .footer .text-start .links .email-icon {
        width: 16px;
        height: 12px;
        margin-right: 3px;
    }

    .footer .text-start .links .phone-icon {
        width: 20px;
        height: 20px;
        margin-right: 8px;
    }

    .footer .text-start .links .address-icon {
        width: 16px;
        height: 19px;
        margin-right: 3px;
    }

    .footer .text-start .links .site-icon {
        width: 16px;
        height: 12px;
        margin-right: 3px;
    }



    .footer .base_text a {
        font-size: 8px;
        /* Smaller font size for links */
        margin: 2px 0;
        /* Adjusted vertical margin */
        display: block;
        /* Ensure links stack */
        text-align: right;
        line-height: 7.6px;
        /* Align links to the left */
    }

    .footer .base_text-about a {
        font-size: 8px;
        /* Smaller font size for links */
        margin: 2px 0;
        /* Adjusted vertical margin */
        display: block;
        /* Ensure links stack */
        text-align: right;
        line-height: 7.6px;
        /* Align links to the left */
    }

    .footer .base_text .text-start {
        width: 45%;
        /* Allocate width for left column */
        text-align: left;
        /* Align content to the left */
        margin-bottom: 0;
        /* Remove extra margin */
    }

    .footer .base_text .text-end {
        position: static;
        /* Remove absolute positioning */
        width: 55%;
        /* Allocate width for right column */
        height: auto;
        /* Auto height */
        right: auto;
        /* Remove right positioning */
        text-align: right;
        /* Align content to the right */
    }

    .footer .base_text-about .text-start {
        width: 45%;
        /* Allocate width for left column */
        text-align: left;
        /* Align content to the left */
        margin-bottom: 0;
        /* Remove extra margin */
    }

    .footer .base_text-about .text-end {
        position: static;
        /* Remove absolute positioning */
        width: 55%;
        /* Allocate width for right column */
        height: auto;
        /* Auto height */
        right: auto;
        /* Remove right positioning */
        text-align: right;
        /* Align content to the right */
    }

    .footer .text-end p {
        font-size: 10px;
        /* Smaller font size */
        margin-bottom: 5px;
        /* Space below text */
        text-align: right;
        padding-right: 0px;
    }

    .input-container {
        width: 100%;
        /* Make it responsive within its parent */
        max-width: 200px;
        /* Limit max width for input */
        margin-left: auto;
        /* Push to the right */
        margin-right: 0;
        /* Push to the right */
    }

    .input-container input {
        width: 100%;
        /* Full width within container */
        padding: 8px 35px 8px 10px;
        /* Adjusted padding for smaller size */
        font-size: 10px;
        /* Smaller font size */
        border-radius: 20px;
        /* Smaller border-radius */
        height: 30px;
        /* Fixed height for input */
    }

    .input-container button {
        height: 25px;
        /* Smaller button */
        width: 25px;
        /* Smaller button */
        top: 2.5px;
        /* Adjust position */
        right: 2.5px;
        /* Adjust position */
        border-radius: 50%;
        /* Ensure it's a circle */
    }

    .input-container button .fa-solid {
        font-size: 12px;
        /* Adjust icon size to be visible */
        line-height: 1;
        /* Ensure proper vertical alignment */
    }

    .footer .text-end .btn {
        font-size: 16px;
        font-weight: 600;
        color: #0D0D0D;
        background: linear-gradient(to right, #FEE4B5, #A46C03);
        border: none;
        padding: 8px 16px;
        margin-top: 20px;
        border-radius: 7px;
    }


    .last_sect p {
        font-size: 10px;
    }

    .last_sect .footer_base_downloads {
        display: flex;
        justify-content: center;
        gap: 10px;
    }

    .last_sect .footer_base_downloads p {
        margin-bottom: 0px;
        font-size: 10px;
    }

    .last_sect {
        width: 90%;
        margin: 10px auto 0 auto;
        justify-content: space-between;
        align-items: center;
        position: relative;
        z-index: 1;
        padding-top: 30px;
    }

    .contact_first {
        width: 100%;
        max-width: 850px;
        position: relative;
        margin: 100px auto 40px auto;
        overflow: hidden;
        padding: 20px 100px 0px 30px;
    }

    .contact_first .container {
        padding: 0 15px;
    }

    .contact_first h5 {
        font-size: 12px;
        color: #797979;
        line-height: 11.8px;
    }

    .contact_first h1 {
        font-size: 24px;
        color: white;
    }

    .contact_first .company-name {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
    }

    .contact_first p {
        font-size: 12px;
        color: #FFFFFF;
        letter-spacing: -3%;
    }

    .contact_second {
        width: 100%;
        max-width: 850px;
        position: relative;
        margin: 50px auto;
        overflow: hidden;
        background-color: #1A1711;
        height: 336px;

    }

    .contact_second .container {
        padding: 0px 30px;
    }

    .contact_second .col_left {
        background-color: #000000;
        border-radius: 10px;
        height: 326px;
        padding: 5px;
        margin: 5px 0px 5px 5px;
        /* Added for internal spacing */
        box-sizing: border-box;
        background-image: url(../img/image\ 4.png), url(../img/Ellipse\ 793.png);
        background-position: right bottom, left bottom;
        background-repeat: no-repeat, no-repeat;
        background-size: 65.03px, 65.03px;
    }


    .contact_second h2 {
        font-size: 16px;
        color: white;
        margin: 10.87px 0px 0px 0px;
    }

    .contact_second p {
        font-size: 10px;
        color: #C9C9C9;
        margin: 7px 0px 0px 0px;
    }

    .contact_second .col_left .link-parent {
        display: flex;
        flex-direction: column;
        gap: 8px;
        align-items: start;
        margin: 0px 10px;
    }

    .contact_second .col_left .link-parent img {
        margin-right: 5px;
    }

    .contact_second .col_left .phone_link {
        position: relative;
        top: 0px;
        right: 7px;
    }

    .contact_second .col_left .phone-icon {
        position: relative;
        width: 20px;
        height: 20px;
        left: 5px;
    }

    .contact_second .col_left .phone-icon .email-icon {
        width: 16px;
        height: 12px;
    }

    .contact_second .col_left .phone-icon .address-icon {
        width: 16px;
        height: 19px;
    }

    .contact_second .col_left .site-icon {
        width: 16px;
        height: 12px;
    }

    .contact_second a {
        font-size: 10px;
        font-weight: 300;
        font-style: light;
    }

    .contect_links {
        margin-top: 5px;
    }

    .contact_second .email-icon {
        width: 16px;
        height: 12px;
        margin-right: 3px;

    }

    .contact_second .phone-icon {
        width: 16px;
        height: 16px;
        margin-right: 3px;
        position: relative;
        left: 2px;
    }

    .contact_second .address-icon {
        width: 16px;
        height: 18px;
        margin-right: 3px;
    }

    .contact_second .site-icon {
        width: 16px;
        height: 12px;
        margin-right: 3px;
    }



    .contact_second .col_right {
        color: white;
        padding: 0px 10px;
        height: auto;
    }

    .contact_second .col_right .row .col-md-6 {
        width: 50%;
        flex: 0 0 50%;
        max-width: 50%;
        padding-left: 10px;
        /* Add horizontal padding between columns */
        padding-right: 10px;
        /* Add horizontal padding between columns */
    }

    .contact_second .col_right .row.mb-4 {
        margin-bottom: 0px !important;
        /* Reduced margin between rows */
    }

    .contact_second .col_right .row.mb-2 {
        margin-bottom: 0px !important;
        /* Reduced margin between rows */
    }

    .contact_second .col_right .contact-form label {
        font-size: 10px;
        margin: 0px;
    }

    .contact_second .col_right .form-control {
        padding: 0px 0px;
        font-size: 10px;
    }

    .contact_second .col_right input {
        font-size: 10px;
        color: white;
    }

    .contact_second .col_right .btn {
        padding: 4px 8px;
        margin-top: 0px;
        font-size: 10px;
        /* Adjusted font size */
        background: linear-gradient(to right, #FEE4B5, #A46C03);
        border: none;
        border-radius: 3.46px;
        color: #0D0D0D;
        line-height: 11.5px;
        /* Corrected line-height */
    }

    .contact_second .col_right input::placeholder {
        color: #BCBCBC;
        font-weight: 500;
        font-size: 10px;
        line-height: 20px;
    }

    .contact-third {
        width: 100%;
        max-width: 850px;
        margin: 15px auto;
        position: relative;
        overflow: hidden;
        padding: 15px auto;
    }

    .contact-third .bd {
        border-right: 1px solid #444;
    }

    .contact-third h5 {
        color: white;
        margin: 15px;
        font-size: 12px;
    }

    .contact-third p {
        color: white;
        font-size: 10px;
    }

    .contact-third .text-bottom {
        display: flex;
        justify-content: center;
    }




    .service_first {
        width: 100%;
        max-width: 850px;
        position: relative;
        margin: 00px auto 0px auto;
        overflow: hidden;
        padding: 100px 0px 100px 30px;

    }

    .service_first::before {
        width: 200px;
        height: 230px;
        top: 70px;
        right: -50px;
    }

    .service_first .container {
        padding: 0 0px;
    }

    .service_first h5 {
        font-size: 12px;
        color: #797979;
        line-height: 11.8px;
        margin-bottom: 0px;

    }

    .service_first h1 {
        font-size: 24px;
        color: white;
        padding-right: 150px;
    }

    .service_first .company-name {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
        font-size: 24px;
    }

    .service_first p {
        font-size: 14px;
        color: #FFFFFF;
        letter-spacing: -3%;
        padding-right: 150px;
    }

    .service_first .btn {
        padding: 4px 12px;
        margin-top: 10px;
        font-size: 14px;
        border: none;
        border-radius: 3.24px;
        line-height: 17px;
        background-color: transparent;
        color: #E1E1E1;
    }

    .service_first .btn::before {
        content: '';
        position: absolute;
        inset: 0;
        padding: 1px;
        background: linear-gradient(to right, #FEE4B5, #A46C03);
        border-radius: 3.24px;
        mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        mask-composite: xor;
        -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        -webkit-mask-composite: xor;
    }

    .service_pic_section {
        width: 100%;
        max-width: 850px;
        position: relative;
        margin: 0px auto 40px auto;
        overflow: hidden;
    }

    .service_pic_section .service_1 .tot {
        background-image: url(../img/Ellipse\ 2774.png), url(../img/Ellipse\ 2775.png);
        background-repeat: no-repeat, no-repeat;
        background-position: center, center;
        background-size: 80%, 65%;
        margin-top: 30px;
    }

    .service_pic_section .tot {
        position: relative;
        width: 230px;
        height: 200px;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .service_pic_section .tot .img {
        width: 150px;
        height: 120px;
        border-radius: 12px;
        object-fit: cover;
        position: absolute;
    }

    .service_pic_section .tot .img-top {
        top: 0;
        left: 0;
        z-index: 1;
    }

    .service_pic_section .tot .img-bottom {
        bottom: 0;
        right: 0;
        z-index: 2;
    }



    .service_pic_section .tots {
        position: relative;
        width: 140px;
        /* adjust as needed */
        height: 230px;
        /* adjust as needed */
        margin: auto;
    }

    /* Base image style */
    .service_pic_section .tots .img {
        width: 80px;
        /* adjust size */
        height: 150px;
        object-fit: cover;
        position: absolute;
        border-radius: 241.79px;
        /* elliptical shape */
    }

    /* Left/top image */
    .service_pic_section .tots .img-left {
        left: 0;
        top: 0;
        z-index: 1;
    }

    /* Right/bottom image */
    .service_pic_section .tots .img-right {
        right: 0;
        bottom: 0;
        z-index: 2;
    }



    .service_pic_section .row {
        width: 100%;
        max-width: 850px;
        position: relative;
        margin: 0px auto;
        margin-bottom: 80px;
        border-radius: 20px;
        background-color: #1A1711;
        padding: 0px 0px 0px 15px;
    }

    .service_pic_section .service_1 .row {
        background-image: url(../img/1.png);
        background-repeat: no-repeat;
        background-position: left bottom;
        background-size: 18px, 82px;
    }


    .service_pic_section .tts {
        width: 12px;
        height: 12px;
        margin-bottom: 4.32px;
        margin-top: 12.14px;
    }

    .service_pic_section .card-title {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
        font-size: 12px;
        margin-bottom: 5px;
    }

    .service_pic_section .card-title {
        color: white;
        font-size: 16px;
        padding-right: 0px;
        line-height: 141%;
        letter-spacing: -3%;
    }

    .service_pic_section .card-content {
        color: white;
        font-size: 12px;
        padding-right: 5px;
        line-height: 141%;
        letter-spacing: -3%;
    }

    .service_pic_section .wp {
        padding: 10px 0px 25px 10px;
    }

    .service_pic_section .wop {
        padding: 20px 30px;
    }



    .service_pic_section .service_2 .row {
        background-image: url(../img/2.png);
        background-repeat: no-repeat;
        background-position: right bottom;
        background-size: 34px, 82px;

    }

    .service_pic_section .service_3 .row {
        background-image: url(../img/3.png);
        background-repeat: no-repeat;
        background-position: left bottom;
        background-size: 24px, 82px;
    }

    .service_pic_section .service_4 .row {
        background-image: url(../img/4.png);
        background-repeat: no-repeat;
        background-position: right 10px bottom;
        background-size: 34px, 82px;
    }

    .service_pic_section .service_5 .row {
        background-image: url(../img/s-5.png);
        background-repeat: no-repeat;
        background-position: left bottom;
        background-size: 24px, 82px;
    }

    .service_pic_section .service_6 .row {
        background-image: url(../img/6.png);
        background-repeat: no-repeat;
        background-position: right 10px bottom;
        background-size: 34px, 82px;

    }

    .about_nav {
        width: 100%;
        max-width: 850px;
        margin: 0px auto;
        overflow: hidden;
        padding: 0px 0px 0px 0px;
        position: sticky;
        top: 50px;
        /* same as header height */
        z-index: 998;
        /* just below header */
        background-color: #0D0D0D;
        /* match site background */
        padding: 10px 0;
    }

    .about_nav .container {
        padding: 0 5px;
    }

    .about_nav .pills-wrapper {
        gap: 4px;
    }

    .about_nav .pill {
        font-size: 8px;
        line-height: 160%;
        font-weight: 500;
        font-style: Medium;
    }


    .about_first {
        width: 100%;
        max-width: 850px;
        position: relative;
        margin: 50px auto;
        overflow: hidden;
        padding: 25px 0px 0px 30px;
    }

    .about_first::before {
        width: 200px;
        height: 230px;
        top: 20px;
        right: -50px;
    }

    .about_first .container {
        padding: 0 0px;
    }

    .about_first h5 {
        font-size: 8px;
        color: #797979;
        line-height: 11.8px;
    }

    .about_first h1 {
        font-size: 18px;
        color: white;
    }

    .about_first .company-name {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
    }

    .about_first p {
        font-size: 12px;
        color: #FFFFFF;
        letter-spacing: -3%;
    }

    .about_second {
        width: 100%;
        max-width: 850px;
        position: relative;
        margin: 0px auto;
        overflow: hidden;
        padding: 50px 0px;
    }

    .about_second .col-8 {
        padding: 0px 0px 0px 40px;
    }


    .about_second .image-wrapper {
        position: absolute;
        right: 10px;
        top: 50%;
        transform: translateY(-50%);
        display: flex;
        align-items: center;
        justify-content: center;
        width: 160px;
        /* adjust as needed */
        height: 270px;
        /* adjust as needed */
        margin: auto;
    }

    /* Base image style */
    .about_second .about_second_image .img {
        width: 100px;
        /* adjust size */
        height: 170px;
        object-fit: cover;
        position: absolute;
        border-radius: 300px;
        /* elliptical shape */
        overflow: hidden;
    }

    /* Left/top image */
    .about_second .about_second_image .img-left {
        left: 0;
        top: 0;
        z-index: 1;
    }

    /* Right/bottom image */
    .about_second .about_second_image .img-right {
        right: 0;
        bottom: 0;
        z-index: 2;
    }

    .about_second h2 {
        font-size: 18px;
        color: white;
        letter-spacing: -3%;
        line-height: auto;
        margin-bottom: 10px;
        margin-top: 0px;
    }

    .about_second p {
        font-size: 12px;
        color: white;
        line-height: 141%;
        letter-spacing: -3%;
        padding: 0px 30px 20px 0px;
    }

    .about_second .company-name {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
    }

    .about_third {
        width: 100%;
        max-width: 820px;
        position: relative;
        margin: 100px auto;
        overflow: hidden;
        padding: 0 30px 0 30px;
    }


    .about_third h2 {
        font-size: 18px;
        color: white;
        letter-spacing: -3%;
        line-height: auto;
        margin-bottom: 10px;
        margin-top: 0px;
    }

    .about_third .company-name {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
    }

    .about_third .text-center p {
        font-size: 14px;
        color: white;
        line-height: 141%;
        letter-spacing: -3%;
        margin-bottom: 12px;
        padding: 0px 0px;
    }

    .about_third .text-center {
        margin-bottom: 10px;
    }

    .about_third .col-4 {
        width: 33.33%;
        flex: 0 0 33.33%;
        max-width: 33.33%;
        margin-bottom: 5px;
        /* Reduced space between cards */
        padding: 0 5px;
        /* Add horizontal padding to columns */
    }

    .about_third .card {
        padding: 5px;
        /* Significantly reduced padding for cards */
        border-radius: 8px;
        height: 100%;
        /* Ensure consistent height */
    }

    .about_third .card img {
        height: 13px;
        /* Smaller icon size */
        width: 13px;
        margin-bottom: 5px;
        /* Reduced margin below icon */
        margin-left: 0px;

    }

    .about_third .card .card-title p {
        line-height: 1.0;
        letter-spacing: 0;
        font-size: 14px;
        /* Significantly smaller font size for card titles */
        margin-bottom: 0px;
        padding-right: 3px;
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
    }

    .about_third .card .card-content p {
        font-size: 10px;
        /* Significantly smaller font size for card content */
        line-height: 1.0;
        padding-right: 8px;
    }

    /* Adjust background numbers for about_third cards */
    .about_third .num1,
    .about_third .num3,
    .about_third .num4,
    .about_third .num6 {
        background-size: auto 20px;
        /* Even smaller background numbers */
        background-position: bottom right 2px;
        /* Adjust position */
    }

    .about_third .num2,
    .about_third .num5 {
        background-size: auto 20px;
        background-position: top right 2px;
    }

    .partners {
        width: 100%;
        max-width: 820px;
        position: relative;
        margin: 100px auto;
        overflow: hidden;
        padding: 0 30px 0 30px;
    }

    .partners h2 {
        font-size: 24px;
        color: white;
        margin-bottom: 20px;
    }

    .partners .company-name {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
    }

    .partners p {
        font-size: 14px;
        letter-spacing: -3%;
        color: white;
        margin-top: 18px;
    }

    .partners img {
        width: 261px;
        height: 336px;
    }





    .Why {
        display: none;
        width: 100%;
        max-width: 1206px;
        position: relative;
        margin: 100px auto;
        overflow: hidden;
    }

    .Why .card-top h2 {
        font-size: 48px;
        color: white;
    }

    .Why .company-name {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
    }

    .Why .card-top p {
        font-size: 24px;
        color: white;
        letter-spacing: -3%;
    }

    .Why .card {
        background-color: #1E1C1C;
        border-radius: 12px;
        padding: 20px 16px;
    }

    .Why .card-title p {
        font-size: 18px;
        color: gold;
    }

    .Why .card-content p {
        font-size: 16px;
        color: white;
        line-height: 26px;

    }





    .Certificates {
        display: none;
        width: 100%;
        max-width: 1171px;
        position: relative;
        margin: 100px auto;
        overflow: hidden;
    }

    .Certificates .text-center h3 {
        font-size: 32px;
        color: #DBB56E;
    }

    .Certificates .text-center p {
        font-size: 28px;
        color: white;
        letter-spacing: -3%;

    }

    .Certificates .text-center .colored-p {
        font-style: italic;
        color: #DBB56E;
    }

    .Certificates .content-bg h4 {
        font-size: 24px;
        color: #DBB56E;
    }

    .Certificates .content-bg h5 {
        font-size: 22px;
        font-style: bold;
        line-height: 26px;
        color: white;
    }

    .Certificates .content-bg p {
        color: white;
        font-size: 18px;
        line-height: 26px;
        padding-right: 260px;
    }

    .Certificates .col-12 {
        display: flex;
        margin-top: 57px;
    }

    .Certificates .col-12 img {
        height: 19px;
        width: 19px;
        margin: 16px;
        position: relative;
    }

    .Certificates .col-12 .tt {
        width: 90px;
        height: 90px;
    }

    .Certificates .col-12 .img-ext {
        width: 90px;
        height: 120px;
    }

    .Certificates .col-12 .img-ext2 {
        width: 90px;
        height: 40px;
    }

    .Certificates .second_text_box {
        padding: 0px 35px;
    }

    .Certificates .second_text_box p {
        color: white;
        font-size: 28px;
        margin-top: 58px;
    }

    .Certificates .second_text_box .bot {
        color: white;
        font-size: 28px;
        margin-top: 18px;
    }











    .about_last {
        display: none;
        width: 100%;
        max-width: 850px;
        position: relative;
        margin: 100px auto;
        overflow: hidden;
    }

    .about_last h2 {
        font-size: 48px;
        color: white;
    }

    .about_last .company-name {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
    }

    .about_last p {
        font-size: 28px;
        letter-spacing: -3%;
        color: white;
        margin-top: 21px;
    }

    .about_last .color-text {
        color: #DBB56E;
        font-style: italic;
    }

    .projects_first {
        width: 100%;
        max-width: 850px;
        position: relative;
        margin: 60px auto 0px auto;
        overflow: hidden;
        padding: 40px 0px 50px 0px;
    }

    .projects_first::before {
        width: 200px;
        height: 230px;
        top: 0px;
        right: -70px;
    }

    .projects_first .container {
        padding: 0 30px;
    }

    .projects_first h5 {
        font-size: 8px;
        color: #797979;
        line-height: 11.8px;
    }

    .projects_first h1 {
        font-size: 18px;
        color: white;
        padding-right: 200px;

    }

    .projects_first .company-name {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #EDCD92 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
    }

    .projects_first p {
        font-size: 12px;
        color: #FFFFFF;
        letter-spacing: -3%;
        padding-right: 200px;
    }

    .projects_first .btn {
        padding: 8px 12px;
        margin-top: 10px;
        font-size: 14px;
        background-color: #DBB56E;
        border-radius: 3.24px;
        line-height: 17px;
    }

    .projects_main {
        width: 100%;
        max-width: 850px;
        position: relative;
        margin: 0px auto 40px auto;
        overflow: hidden;
        padding: 0px 30px 0px 30px;
    }

    .projects_main h2 {
        font-size: 18px;
        color: white;

    }

    .projects_main .company-name {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
    }

    .project_pills-section .pills-container {
        width: 100%;
        max-width: 850px;
        margin: 0px auto;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .project_pills-section .pills-wrapper {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 4px;
    }

    .project_pills-section .pill {
        font-size: 8px;
        padding: 2.8px 6px;
        background-color: #353536;
        margin-bottom: 2.8px;
    }

    .project_pills-section {
        width: 100%;
        max-width: 820px;
        position: relative;
        margin: 0px auto 20px auto;
        overflow: hidden;
    }

    .project_content_list {
        width: 100%;
        max-width: 820px;
        position: relative;
        margin: 0px auto 40px auto;
        overflow: hidden;
    }

    .project_content_list .col-4 {
        width: 33.33%;
    }

    /* Project Main Section - Grid and Card Styling */
    .projects_main .container {
        padding: 0 15px;
        /* Adjust container padding */
    }

    .projects_main .row {
        display: flex;
        flex-wrap: wrap;
        margin-left: -15px;
        /* Compensate for column padding */
        margin-right: -15px;
        /* Compensate for column padding */
        justify-content: start;
        /* Center the grid items */
    }

    .projects_main .col-4 {
        /* Targeting the columns directly */
        padding: 5px;
        /* Add padding between columns */
        box-sizing: border-box;
    }

    .projects_main .card {
        background-color: #1e1c1c;
        /* Dark background from image */
        border-radius: 5.7px;
        /* Rounded corners */
        overflow: hidden;
        /* Ensure image corners are rounded */
        height: 100%;
        /* Make cards same height in a row */
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        /* Push content and arrow apart */
        transition: box-shadow 0.3s ease;
        border: none;
        /* Remove default card border */
    }

    .projects_main .card:hover {
        box-shadow: 0 0 20px #e7c586;
        /* Gold glow on hover */
    }

    .projects_main .card img {
        width: fill !important;
        height: 120px !important;
        /* Fixed height for images */
        object-fit: cover !important;
        /* Cover the area without distortion */
        border-radius: 12px 12px 0 0;
        /* Top corners rounded */
    }

    .projects_main .card-content {
        padding: 5px;
        /* Padding inside the card for text */
        flex-grow: 1;
        /* Allow content to take available space */
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }

    .projects_main .card h3 {
        font-size: 14px;
        /* Title font size */
        background: linear-gradient(to right, #DBB56E 0%, #DBB56E 25%, #EDCE93 50%, #FEE4B5 75%, #FEE4B5 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: transparent;
        /* Title color */
        margin-bottom: 0px;
        /* Space below title */
        font-weight: 600;
    }

    .projects_main .card p {
        font-size: 10px;
        font-weight: 400;
        /* Sector font size */
        color: #FFFFFF;
        /* Sector color */
        margin-bottom: 0px;
        /* No margin below sector text */
    }

    .projects_main h5 {
        font-size: 10px;
        font-weight: 400;
        font-style: normal;
        /* Sector font size */
        color: #DBB56E;
        /* Sector color */
        margin-bottom: 6px;
    }

    .projects_main .card .arrow-link {
        display: flex;
        justify-content: flex-end;
        /* Align arrow to the right */
        padding: 10px 10px 10px 10px;
        /* Padding for the arrow area */
        color: #DBB56E;
        /* Gold color for arrow */
        font-size: 14px;
        /* Size of the arrow */
        text-decoration: none;
        transition: transform 0.2s ease;
    }

    .projects_main .card .arrow-link:hover {
        transform: translateX(5px);
        /* Slight movement on hover */
    }

    /* Pagination */
    .pagination-container {
        display: flex;
        justify-content: center;
        margin-top: 2.26px;
        margin-bottom: 0px;
    }

    .pagination-item {
        margin: 0 5px;
        width: 0px;
        height: 0px;
        padding: 1.58px 3.17px;
        border-radius: 4.28px;
        background-color: #0D0D0D;
        /* Dark background for pagination circles */
        color: #d9d9d9;
        font-size: 8px;
        text-decoration: none;
        transition: background-color 0.3s ease, color 0.3s ease;
    }

    .pagination-item:hover {
        background-color: #dbb56e;
        /* Gold on hover */
        color: #0d0d0d;
        /* Dark text on hover */
    }

    .pagination-item.active {
        background: linear-gradient(to right, #FEE4B5, #A46C03);
        /* Active gold */
        color: #0d0d0d;
        /* Dark text for active */
        font-weight: bold;
    }

    .project_details {
        width: 100%;
        max-width: 850px;
        position: relative;
        padding-top: 0px;
        margin: 50px auto 0px auto;
        overflow: hidden;
        height: 400px;
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    }

    .project_content .container {
        width: 100%;
        max-width: 850px;
        position: relative;
        padding: 0px 0px;
        margin: 0px auto 0px auto;
    }

    .project-info {
        width: 100%;
        max-width: 850px;
        position: relative;
        margin: 0px auto 0px auto;

    }

    .project_content .project-info .col-12,
    .ddp {
        padding: 0 30px;
    }

    .project_details h2 {
        color: white;
        font-size: 18px;

    }

    .project_details .company-name {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
        font-size: 18px;
    }

    .project_content .fa-arrow-left {
        height: 13px;
        width: 13px;
        color: #DBB56E;
    }

    .project_details img {
        width: 100%;
        max-width: 850px;
        height: 400px;
        margin: 0px auto;
        display: block;
        border-radius: 0px;
    }


    .project_content h1 {
        font-size: 18px;
        background: linear-gradient(to right, #DBB56E 0%, #DBB56E 25%, #EDCE93 50%, #FEE4B5 75%, #FEE4B5 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: transparent;
        padding: 0px;
        line-height: 1.5;
        position: right;
        text-align: right;
        padding-right: 20px;
        text-transform: uppercase;
    }

    .project_content .row {
        margin-top: 0px;
    }

    .project_content .col-6 {
        display: flex;
        justify-content: right;
        align-items: center;
    }

    .project_content .col-4 {
        display: flex;
        flex-direction: column;
        justify-content: start;
        align-items: center;
        gap: 10px;
    }

    .project_content .dpv::after {
        content: "";
        position: absolute;
        top: 0;
        right: 20px;
        width: 2px;
        /* thickness of border */
        height: 100%;
        background: linear-gradient(to bottom, #FEE4B5, #A46C03);
        border-radius: 3px;
    }

    .project_content strong {
        color: #DBB56E;
        font-size: 12px;
    }

    .project_content .detail-item {
        color: white;
        font-size: 12px;
    }

    .project_brief h3 {

        background: linear-gradient(to right, #DBB56E 0%, #DBB56E 25%, #EDCE93 50%, #FEE4B5 75%, #FEE4B5 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: transparent;
        font-size: 16px;
        line-height: 22px;
        margin-top: 50px;
        padding: 0 40px 0 40px;
    }

    .project_detailed_description::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 3px;
        /* thickness of border */
        height: 100%;
        background: linear-gradient(to bottom, #FEE4B5, #A46C03);
        border-radius: 3px;
    }

    .project_brief_description {
        margin-bottom: 15px;
        width: 100%;
    }

    .project_brief_description p {
        font-size: 10px;
        color: white;
        line-height: 141%;
        letter-spacing: -3%;
        padding-right: 5px;
        text-align: justify;
    }

    .project_detailed_description p {
        font-size: 10px;
        color: white;
        line-height: 141%;
        letter-spacing: -3%;
        text-align: justify;
    }

    .project_brief_description .btn-secondary {
        position: relative;
        background-color: transparent;
        background: linear-gradient(to right, #DBB56E 0%, #DBB56E 25%, #EDCE93 50%, #FEE4B5 75%, #FEE4B5 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: transparent;
        border: none;
        font-size: 12px;
        font-weight: 600;
        text-decoration: none;
        border-radius: 6.5px;
        transition: all 0.3s ease;
        display: inline-block;
        padding: 8px 8px;
        margin-top: 5.4px;
    }

    .project_brief_description .btn-secondary::before {
        content: '';
        position: absolute;
        inset: 0;
        padding: 2px;
        /* This creates the border width */
        background: linear-gradient(to right, #FEE4B5, #A46C03);
        border-radius: 6.5px;
        mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        mask-composite: xor;
        -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        -webkit-mask-composite: xor;
    }
}

.clients .footer_start {
    pointer-events: auto;
}


@media(max-width: 600px) {
    .footer .footer_head p {
        font-size: 16px;
    }

    .about_second .col-8 {
        padding: 0px 30px 0px 40px;
    }

    .contact_second .col_right .contact-form label {
        font-size: 8px;
        margin: 0px;
    }

    .contact_second .col_right .form-control {
        padding: 0px 0px;
        font-size: 8px;
    }

}

@media(max-width: 500px) {
    .about_third {
        width: 100%;
        max-width: 600px;
        position: relative;
        margin: 100px auto;
        overflow: hidden;
        padding: 0 10px 0 10px;
    }

    .project_content .detail-item {
        color: white;
        font-size: 10px;
    }

    .project_content strong {
        color: #DBB56E;
        font-size: 10px;
    }
}














@media (max-width: 389.2px) {
    .header {
        background-color: #0D0D0D;
        padding: 0 0;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        z-index: 1000;
    }

    .header-content {
        max-width: 389.2px;
        margin: 0 auto;
        padding: 0 2rem;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .header img {
        width: 84px;
        height: 22px;
        background-color: #0B150F;
    }

    .menu-btn {
        background: none;
        border: none;
        font-size: 18px;
        cursor: pointer;
        padding: 0.5rem;
        border-radius: 4px;
        transition: background-color 0.2s;
        color: #DBB56E;
    }

    .menu-btn:hover {
        background-color: rgba(240, 240, 240, 0.1);
    }

    .close-btn {
        color: white;
        background-color: #0B150F;
        border-radius: 30px;
        border: 1px solid #0B150F;
        position: absolute;
        top: 1rem;
        left: 1rem;
        font-size: 0.5rem;
        cursor: pointer;
        padding: 0.5rem;
        transition: background-color 0.2s;
    }

    .close-btn:hover {
        background-color: #34495e;
    }

    .sidebar {
        position: fixed;
        top: 0;
        right: -150px;
        width: 150px;
        height: 100vh;
        background-color: #0D0D0D;
        color: white;
        transition: right 0.3s ease;
        z-index: 1001;
        overflow-y: auto;
    }

    .sidebar.open {
        right: 0;
    }

    .nav-menu {
        padding: 50px 0;
    }

    .nav-item {
        display: block;
        padding: 1rem 1.5rem;
        color: white;
        text-decoration: none;
        transition: background-color 0.2s;
        border: none;
        background: none;
        width: 90%;
        text-align: left;
        cursor: pointer;
        display: flex;
        align-items: center;
        gap: 0.75rem;
        border-radius: 10px;
        font-size: 10px;
    }

    .nav-item:hover {
        background-color: #272727;
        font-size: 10px;
    }

    .nav-item.active {
        background-color: #272727;
        color: transparent;
        font-size: 10px;
    }

    .nav-item.active span,
    .nav-item.active i {
        background-image: linear-gradient(to right, #fee4b5, #a46c03);
        background-clip: text;
        -webkit-background-clip: text;
        color: transparent;
        -webkit-text-fill-color: transparent;
    }

    .nav-icon {
        font-size: 1.25rem;
        width: 20px;
        text-align: center;
    }

    .header-content {
        padding: 0 1rem;
        /* Reduced padding for header content */
    }

    .header img {
        width: 100px;
        /* Smaller logo size */
    }

    .banner-01 {
        position: relative;
        width: 100%;
        max-width: 391px;
        margin: 0px auto 0 auto;
        /* Adjusted margin to remove bottom margin */
        overflow: hidden;
        height: 226px;
    }

    .hero-image {
        width: 100%;
        /* Changed to 100% to be responsive within max-width */
        height: 226px;
        object-fit: cover;
        display: block;
    }

    .hero-overlay {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        display: flex;
        align-items: center;
        padding: 10px 6px;
        /* Added horizontal padding */
    }

    .hero-content {
        flex: 1;
        max-width: 100%;
        /* Allow content to take full available width */
        z-index: 2;
    }

    .banner-01 h5 {
        color: #E1E1E1;
        font-size: 8px;
        line-height: 0px;
        padding-top: 60px;
    }

    .inner-heading {
        position: relative;
        height: 16px;
        /* Reduced height for smaller font */
        overflow: hidden;
        display: inline-block;
        vertical-align: top;
        width: 100px;
        /* Adjusted width for smaller text */
        min-width: 100px;
        font-size: 15px;
        /* Adjusted font size */
    }

    .inner-heading span {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        animation: slideText 6s ease-in-out infinite;
    }

    .inner-heading span div {
        height: 16px;
        /* Adjusted height */
        line-height: 16px;
        /* Adjusted line height */
        background: linear-gradient(to right,
                #fee4b5 0%,
                /* Bright gold at top */
                #fee4b5 25%,
                /* Orange-gold */
                #d3aa5f 50%,
                /* Goldenrod middle */
                #a46c03 75%,
                /* Dark goldenrod */
                #a46c03 100%
                /* Saddle brown at bottom */
            );
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #dbb56e;
        /* Fallback */
        font-size: inherit;
        white-space: nowrap;
        width: 100%;
        line-height: auto;
    }

    @keyframes slideText {

        0%,
        20% {
            top: 0;
        }

        30%,
        50% {
            top: -16px;
            /* Adjusted for new height */
        }

        60%,
        80% {
            top: -32px;
            /* Adjusted for new height */
        }

        90%,
        100% {
            top: 0;
        }
    }

    .hero-title {
        font-size: 15px;
        font-weight: bold;
        color: white;
        line-height: auto;
        margin-bottom: 5px;
        padding-right: 0px;
    }

    .hero-title .highlight {
        color: #d4af37;
    }

    .hero-subtitle {
        font-size: 10px;
        color: #e0e0e0;
        line-height: 100%;
        text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
        margin-bottom: 10px;
        padding-right: 30px;
    }

    .hero-buttons {
        display: flex;
        flex-wrap: wrap;
        gap: 7px;
        /* Reduced gap between buttons */
    }

    .banner-01 .btn {
        position: relative;
        background-color: transparent;
        margin: 0px;
        padding: 2.15px 5.38px;
        font-size: 14px;
        /* Slightly smaller font for buttons */
        font-weight: 600;
        text-decoration: none;
        border-radius: 3.24px;
        transition: all 0.3s ease;
        cursor: pointer;
        border: none;
        text-align: center;
        display: flex;
        justify-content: center;
        line-height: 17px;
    }

    .banner-01 .btn-primary {
        background-color: transparent;
        color: #E1E1E1;
        font-weight: 600;
    }

    .banner-01 .btn-secondary {
        background-color: transparent;
        color: #E1E1E1;
        font-weight: 600;
    }

    .banner-01 .btn-primary::before {
        content: '';
        position: absolute;
        inset: 0;
        padding: 1px;
        background: linear-gradient(to right, #FEE4B5, #A46C03);
        border-radius: 3.23px;
        mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        mask-composite: xor;
        -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        -webkit-mask-composite: xor;
    }

    .banner-01 .btn-secondary::before {
        content: '';
        position: absolute;
        inset: 0;
        padding: 1px;
        background: linear-gradient(to right, #FEE4B5, #A46C03);
        border-radius: 3.23px;
        mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        mask-composite: xor;
        -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        -webkit-mask-composite: xor;
    }

    .hero-logo {
        position: absolute;
        right: 10px;
        /* Adjust as needed to match the screenshot */
        top: 50%;
        transform: translateY(-50%);
        width: 96.21px;
        /* Use the desired width for the logo container */
        height: 90.55px;
        /* Use the desired height for the logo container */
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: 3;
        /* Ensure it's above other content */
    }

    .hero-logo img {
        position: relative;
        top: 20px;
        width: 100%;
        /* Make the image fill its parent .hero-logo */
        height: 100%;
        /* Make the image fill its parent .hero-logo */
        object-fit: contain;
        /* Ensure the image scales properly within its container */
    }

    .pills-container {
        width: 100%;
        max-width: 389px;
        margin: 4px auto;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .pills-wrapper {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 5px;
    }

    .pill {
        display: inline-flex;
        align-items: center;
        padding: 8px 4px;
        /* Adjusted padding for pills */
        color: #ffffff;
        text-decoration: none;
        font-size: 8px;
        font-weight: 500;
        white-space: nowrap;
        transition: background-color 0.2s ease;
        line-height: 160%;
        position: relative;
    }

    .main-port .pill:hover::after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
        width: 30%;
        height: 2px;
        background: linear-gradient(to right, #FEE4B5, #A46C03);
        border-radius: 3px;
    }

    .about_nav .pill:hover::after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
        width: 30%;
        height: 2px;
        background: linear-gradient(to right, #FEE4B5, #A46C03);
        border-radius: 3px;
    }


    .about {
        padding: 20px 0;
        /* Add this to contain the background */
        /* Remove your existing background-image properties */
        position: relative;
        width: 100%;
        max-width: 389.2px;
        margin: 0 auto;
        overflow: hidden;
    }

    .about .col-lg-7 {
        padding-right: 35px;
    }

    .about::before {
        content: '';
        position: absolute;
        top: 0;
        right: -30px;
        width: 134.11px;
        height: 126.22px;
        background-image: url(../img/icons/image\ 59.png);
        opacity: 30%;
        background-size: auto 100%;
        background-repeat: no-repeat;
        background-position: top right;
        /* Makes it subtle like in your reference */
        z-index: 1;
        pointer-events: none;
        /* Ensures it doesn't interfere with content */
    }

    .about h2 {
        font-size: 16px;
        letter-spacing: -3%;
        margin-bottom: 6px;
    }

    .about p {
        font-size: 10px;
        letter-spacing: -3%;
        margin-bottom: 3.23px;
        color: #D9D9D9;
        font-weight: 400;
        line-height: 1.0;
    }

    .about p:first-of-type {
        font-size: 10px;
        font-style: italic;
        line-height: 1.0;
        font-weight: 400;
        margin-bottom: 3.23px;
        color: #DBB56E;
    }

    .about .container {
        padding: 0 15px;
    }



    .about .image-wrapper {
        position: absolute;
        right: 20px;
        top: 50%;
        transform: translateY(-50%);
        display: flex;
        align-items: center;
        justify-content: center;
        width: 126.22px;
        /* adjust as needed */
        height: 182.2px;
        /* adjust as needed */
        margin: auto;
    }

    /* Base image style */
    .about .section-about-img .img {
        width: 78.32px;
        /* adjust size */
        height: 143.44px;
        object-fit: cover;
        position: absolute;
        border-radius: 300px;
        /* elliptical shape */
        overflow: hidden;
    }

    /* Left/top image */
    .about .section-about-img .img-left {
        left: 0;
        top: 0;
        z-index: 1;
    }

    /* Right/bottom image */
    .about .section-about-img .img-right {
        right: 0;
        bottom: 0;
        z-index: 2;
    }

    .about .btn-secondary {
        position: relative;
        background-color: transparent;
        color: #FFFFFF;
        border: none;
        font-size: 12px;
        font-weight: 600;
        text-decoration: none;
        border-radius: 3.23px;
        transition: all 0.3s ease;
        display: inline-block;
        padding: 2.15px 5.38px;
        line-height: 10.8px;
    }

    .about .btn-secondary::before {
        content: '';
        position: absolute;
        inset: 0;
        padding: 1px;
        background: linear-gradient(to right, #FEE4B5, #A46C03);
        border-radius: 3.23px;
        mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        mask-composite: xor;
        -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        -webkit-mask-composite: xor;
    }

    .services {
        padding: 0px 10px;
        /* Add this to contain the background */
        /* Remove your existing background-image properties */
        position: relative;
        width: 100%;
        max-width: 389px;
        margin: 0 auto;
        overflow: hidden;
    }

    .services .container {
        padding: 0px 0px;
    }

    .services .text-center h2 {
        font-size: 16px;
        color: white;
        letter-spacing: -3%;
        line-height: auto;
        margin-bottom: 5px;
        margin-top: 10px;
        font-weight: 500;
    }

    .services .text-center p {
        font-size: 10px;
        color: white;
        line-height: 141%;
        letter-spacing: -3%;
        margin-bottom: 5px;
        padding: 0px 0px;
    }

    .services .text-center {
        margin-bottom: 5px;
    }

    .services .company-name {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
        font-size: 16px;
        font-weight: 500;
    }

    .services .mb-5 {
        margin-bottom: 5px !important;
    }

    .services .col-4 {
        width: 33.33%;
        flex: 0 0 33.33%;
        max-width: 33.33%;
        margin-bottom: 5px;
        /* Reduced space between cards */
        padding: 0 2px;
        /* Add horizontal padding to columns */
    }

    .services .card {
        padding: 5px;
        /* Significantly reduced padding for cards */
        border-radius: 8px;
        height: 100%;
        /* Ensure consistent height */
    }

    .services .card img {
        height: 6.5px;
        /* Smaller icon size */
        width: 6.5px;
        margin-bottom: 2px;
        /* Reduced margin below icon */
        margin-left: 0px;

    }

    .services .card .card-title p {
        line-height: 1.0;
        letter-spacing: 0;
        font-size: 10px;
        background: linear-gradient(to right, #DBB56E 0%, #DBB56E 25%, #EDCE93 50%, #FEE4B5 75%, #FEE4B5 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: transparent;
        margin-bottom: 3px;
        padding-right: 3px;
    }

    .services .card .card-content p {
        font-size: 8px;
        /* Significantly smaller font size for card content */
        line-height: 1.0;
        padding-right: 8px;
    }

    /* Adjust background numbers for services cards */
    .services .num1,
    .services .num3,
    .services .num4,
    .services .num6 {
        background-size: auto 30px;
        /* Even smaller background numbers */
        background-position: bottom right 2px;
        /* Adjust position */
    }

    .services .num2,
    .services .num5 {
        background-size: auto 30px;
        background-position: top right 2px;
    }

    .projects {
        width: 100%;
        max-width: 389px;
        position: relative;
        margin: 20px auto;
        overflow: hidden;
        padding: 0px 20px 0 20px;
    }

    .projects .text-center h2 {
        font-size: 16px;
        color: white;
        margin-bottom: 6px;
        font-weight: 500;
    }

    .projects .text-center p {
        font-size: 10px;
        color: #D9D9D9;
        margin-bottom: 18px;
    }

    .projects .company-name {
        font-size: 16px;
        background: linear-gradient(to right, #DBB56E 0%, #DBB56E 25%, #EDCE93 50%, #FEE4B5 75%, #FEE4B5 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
    }

    .projects .row {
        width: 90%;
        max-width: 389.2px;
        position: relative;
        margin: 0px auto;
    }

    .projects .image-box img {
        border-radius: 5.42px;
        height: 75px;
        width: 81.52px;
    }

    .projects .image-box img:hover {
        box-shadow: 0 0 30px #E7C586;
    }

    .projects .image-box {
        width: 81.52px;
        text-align: center;
        line-height: 141%;
        letter-spacing: -3%;
    }


    .projects .image-box p {
        margin-top: 20px;
        letter-spacing: -3%;
        line-height: 141%;
        color: #FFFFFF;
        font-size: 8px;
    }

    .why {
        width: 100%;
        max-width: 385px;
        position: relative;
        margin: 10px auto;
        overflow: hidden;
        padding: 0px;

    }

    .why::before {
        width: 120px;
        height: 169px;
        left: -20px;
    }

    .why .container {
        padding: 0px 20px;
        width: 100%;
        max-width: 370px;
        margin: 0 auto;
    }

    .why h2 {
        font-size: 16px;
        color: white;
        margin-bottom: 4px;
        letter-spacing: -3%;
    }

    .why .col-5 {
        width: 41.66666666666667%;
    }

    .why .col-7 {
        width: 58.33333333333333%;
    }

    .why p {
        font-size: 8px;
        color: #D9D9D9;
        line-height: 141%;
        letter-spacing: -3%;
        padding-right: 0px;
    }

    .why .company-name {
        font-size: 16px;
        background: linear-gradient(to right, #DBB56E 0%, #DBB56E 25%, #EDCE93 50%, #FEE4B5 75%, #FEE4B5 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
    }

    .why .col-5 {
        padding-right: 0px;
    }

    .why .why-top-para {
        color: #DBB56E;
        font-size: 8px;
        font-weight: 400;
        line-height: 100%;
        letter-spacing: -3%;
        padding-right: 100px;
    }

    .why .card p {
        color: #DBB56E;
        padding: 10px 5px;
        background-color: transparent;
        border-radius: 8px;
        font-size: 8px;
        font-weight: 500;
        line-height: 100%;
    }

    .why .card {
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 0px 5px;
        background-color: transparent;
    }

    .why .text-center p {
        color: #DBB56E;
        font-size: 10px;
        letter-spacing: -3%;
        line-height: 141%;
        max-width: 320px;
        width: 100%;
        margin: 0px auto;
    }

    .clients {
        width: 100%;
        max-width: 385px;
        position: relative;
        margin: 50px auto;
        overflow: hidden;
        padding: 0px 20px 0px 20px;
    }

    .clients h3 {
        font-size: 10px;
        color: white;
    }

    .clients .top_btn .btn {
        font-size: 10px;
        font-weight: 600;
        color: #0D0D0D;
        background: linear-gradient(to right, #FEE4B5, #A46C03);
        border: none;
        padding: 4px 8px;
        margin-top: 10px;
        border-radius: 3.46px;
    }

    .clients .footer_start {
        background-color: #1A1711;
        width: 100%;
        max-width: 355px;
        margin: 0px auto;
        border-radius: 8.65px;
        padding: 10px;
        background-image:
            url(../img/image\ 5.png),
            url(../img/image\ 4.png);
        background-size:
            51.99px 48.94px,
            51.99px 48.94px;
        background-position:
            top left,
            bottom right;
        background-repeat: no-repeat, no-repeat;
        position: relative;
        z-index: 1;
        pointer-events: none;
    }

    .footer {
        max-width: 443px;
        width: 100%;
        /* Ensure it respects the max-width */
        margin: 0px auto;
        /* Center the footer */
        padding-bottom: 0px;
        /* Add some bottom padding */
    }

    .footer .cnum1 {
        width: 100%;
        /* Make it responsive */
        max-width: 311.63px;
        /* Keep original max-width if needed, but scale */
        height: auto;
        /* Adjust height automatically */
        top: 25px;
        /* Reduced top margin */
        margin: 0 auto;
        /* Center the image */
        display: block;
        /* Ensure it takes full width */
    }

    .footer .cnum1 h1 {
        font-size: 35px;
        font-weight: 800;
        letter-spacing: -3%;
        display: inline-block;
        color: #DBB56E;
        opacity: 20%;
        overflow: hidden;
    }


    .inner-heading-bottom {
        position: relative;
        height: 37px;
        overflow: hidden;
        display: inline-block;
        width: 110px;
        min-width: 110px;
    }

    .inner-heading-bottom span {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        animation: footerslidetext 6s ease-in-out infinite;
    }

    .inner-heading-bottom span div {
        height: 35px;
        line-height: 144%;
        color: #DBB56E;
        /* Fallback */
        font-size: 35px;
        white-space: nowrap;
        width: 100%;
        overflow: hidden;
    }

    @keyframes footerslidetext {

        0%,
        20% {
            top: 0;
        }

        30%,
        50% {
            top: -35px;
        }

        60%,
        80% {
            top: -70px;
        }

        90%,
        100% {
            top: 0;
        }
    }

    .footer .cnum2 {
        padding: 15px;
        /* Reduced padding */
        background-size: 135px, 60px;
        /* Smaller background images */
        background-position: bottom left 5px;
        /* Adjust position */
    }

    .footer .footer_head {
        margin-bottom: 15px;
        /* Reduced margin */
    }

    .footer h2 {
        margin-top: 30px;
        /* Reduced top margin */
        font-size: 18px;
        /* Smaller font size */
        margin-bottom: 10px;
    }

    .footer .company-name {
        font-size: 18px;
        /* Match h2 font size */
    }

    .footer .footer_head p {
        font-size: 10px;
        /* Smaller font size */
        margin-bottom: 10px;
        /* Reduced margin */
        width: 100%;
        /* Ensure full width */
        padding: 0 5px;
        /* Add some horizontal padding */
    }

    .logo-strip {
        overflow: hidden;
        width: 100%;
        max-width: 389.2px;
        margin: 0 auto;
        height: 21.93px;
        /* adjust as needed */
        position: relative;
    }

    .logos-track {
        display: flex;
        gap: 15px;
        /* space between logos */
        width: calc(200%);
        /* allow scrolling loop */
        animation: scroll 30s linear infinite;
    }

    .logos-track div img {
        height: 10px;
        /* adjust sizes as needed */
        object-fit: contain;
    }

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

        to {
            transform: translateX(-50%);
            /* move by half (because of duplication) */
        }
    }

    .logos-track .img1 img {
        height: 10.78px;
        width: 62.58px;
        margin-top: 0px;

    }

    .logos-track .img2 img {
        height: 13.51px;
        width: 50.03px;
        margin-top: 0px;
    }

    .logos-track .img3 img {
        height: 14.52px;
        width: 23.11px;
        margin-top: 0px;
    }

    .logos-track .img4 img {
        height: 15.91px;
        width: 38.42px;
        margin-top: 0px;
    }

    .logos-track .img5 img {
        height: 16.51px;
        width: 42.61px;
        margin-top: 0px;
    }

    .logos-track .img6 img {
        height: 16.51px;
        width: 42.61px;
        margin-top: 0px;
    }

    .logos-track .img7 img {
        height: 16.51px;
        width: 42.61px;
        margin-top: 0px;
    }

    .separator {
        width: 3.67px;
        height: 3.67px;
        border-radius: 50%;
        background-color: #DBB56E;
        /* gold */
        flex-shrink: 0;
        margin-top: 12px;
    }

    .owl-carousel {
        height: auto;
        /* Allow height to adjust */
        margin-top: 15px;
        /* Add some top margin */
        margin-bottom: 15px;
        /* Add some bottom margin */
        display: flex;
        /* Ensure flex behavior */
        flex-wrap: wrap;
        /* Allow items to wrap */
        justify-content: center;
        /* Center items */
        gap: 10px;
        /* Add gap between items */
    }

    .owl-carousel img {
        height: auto;
        /* Allow height to adjust */
        width: 60px;
        /* Smaller width for logos */
        margin: 0;
        /* Remove individual image margins */
    }

    .owl-carousel .img1 img,
    .owl-carousel .img2 img,
    .owl-carousel .img3 img,
    .owl-carousel .img4 img,
    .owl-carousel .img5 img,
    .owl-carousel .img6 img {
        width: auto;
        /* Let width adjust based on height */
        height: 30px;
        /* Consistent smaller height for all logos */
    }

    .footer .base_text {
        width: 100%;
        /* Full width */
        margin: 4px auto 0 auto;
        /* Adjusted margin */
        display: flex;
        /* Keep as flex row */
        flex-wrap: wrap;
        /* Allow wrapping if needed */
        justify-content: space-between;
        /* Space out items */
        align-items: center;
        /* Align items vertically */
        padding-top: 2px;
        /* Reduced padding */
        position: relative;
        /* Ensure relative positioning for children */
    }

    .footer .base_text-about {
        width: 100%;
        /* Full width */
        margin: 20px auto 0 auto;
        /* Adjusted margin */
        display: flex;
        /* Keep as flex row */
        flex-wrap: wrap;
        /* Allow wrapping if needed */
        justify-content: space-between;
        /* Space out items */
        align-items: center;
        /* Align items vertically */
        padding-top: 20px;
        /* Reduced padding */
        position: relative;
        /* Ensure relative positioning for children */
    }

    .footer .base_text-about::before {
        width: 60%;
        /* Adjust line width */
        height: 0.5px;
        /* Thinner line */
        left: 50%;
        /* Center the line */
        transform: translateX(-50%);
        /* Center the line */
    }

    .footer .base_text .text-start {
        width: 45%;
        /* Allocate width for left column */
        text-align: left;
        /* Align content to the left */
        margin-bottom: 0;
        /* Remove extra margin */
    }

    .footer .base_text .footer-icon {
        width: 56px;
        height: 12px;
        margin-bottom: 5px;
    }

    .footer .base_text-about .text-start {
        width: 50%;
        /* Allocate width for left column */
        text-align: left;
        /* Align content to the left */
        margin-bottom: 0;
        /* Remove extra margin */
    }

    .footer .base_text-about .footer-icon {
        width: 56px;
        height: 12px;
        margin-bottom: 5px;
    }

    .footer .text-start .link-parent {
        display: flex;
        flex-direction: column;
        gap: 1px;
        align-items: start;
    }

    .footer .text-start .call-calling {
        position: relative;
        top: 0px;
        right: 8px;
    }

    .last_sect::before {
        content: "";
        position: absolute;
        top: 0;
        left: 50%;
        transform: translateX(-50%);
        width: 100%;
        /* custom width */
        height: 0.5px;
        background: linear-gradient(to right, #FEE4B5, #A46C03);
    }

    .footer .base_text .links .email-icon {
        width: 8px;
        height: 6px;
        margin-right: 0px;
    }

    .footer .base_text .links .phone-icon {
        width: 10px;
        height: 8px;
        margin-right: 4px;
    }

    .footer .base_text .links .address-icon {
        width: 8px;
        height: 10px;
        margin-right: 0px;
    }

    .footer .base_text .links .site-icon {
        width: 8px;
        height: 6px;
        margin-right: 0px;
    }




    .footer .base_text-about a {
        font-size: 8px;
        /* Smaller font size for links */
        margin: 2px 0;
        /* Adjusted vertical margin */
        display: block;
        /* Ensure links stack */
        text-align: right;
        line-height: 7.6px;
        /* Align links to the left */
    }

    .footer .base_text-about .text-end {
        position: static;
        /* Remove absolute positioning */
        width: 55%;
        /* Allocate width for right column */
        height: auto;
        /* Auto height */
        right: auto;
        /* Remove right positioning */
        text-align: right;
        /* Align content to the right */
    }







    .footer .base_text-about .links .email-icon {
        width: 8px;
        height: 6px;
        margin-right: 0px;
    }

    .footer .base_text-about .links .phone-icon {
        width: 10px;
        height: 8px;
        margin-right: 4px;
    }

    .footer .base_text-about .links .address-icon {
        width: 8px;
        height: 10px;
        margin-right: 0px;
    }

    .footer .base_text-about .links .site-icon {
        width: 8px;
        height: 6px;
        margin-right: 0px;
    }




    .footer .base_text-about a {
        font-size: 8px;
        /* Smaller font size for links */
        margin: 2px 0;
        /* Adjusted vertical margin */
        display: block;
        /* Ensure links stack */
        text-align: right;
        line-height: 7.6px;
        /* Align links to the left */
    }

    .footer .base_text-about .text-end {
        position: static;
        /* Remove absolute positioning */
        width: 50%;
        /* Allocate width for right column */
        height: auto;
        /* Auto height */
        right: auto;
        /* Remove right positioning */
        text-align: right;
        /* Align content to the right */
    }

    .footer .text-end p {
        font-size: 8px;
        /* Smaller font size */
        margin-bottom: 5px;
        /* Space below text */
        padding-right: 0px;
    }

    .input-container {
        width: 100%;
        /* Make it responsive within its parent */
        max-width: 150px;
        /* Limit max width for input */
        margin-left: auto;
        /* Push to the right */
        margin-right: 0;
        /* Push to the right */
    }

    .input-container input {
        width: 100%;
        /* Full width within container */
        padding: 8px 50px 8px 10px;
        /* Adjusted padding for smaller size */
        font-size: 8px;
        /* Smaller font size */
        border-radius: 20px;
        /* Smaller border-radius */
        height: 20px;
        /* Fixed height for input */
    }

    .input-container button {
        height: 25px;
        /* Smaller button */
        width: 25px;
        /* Smaller button */
        top: 2.5px;
        /* Adjust position */
        right: 2.5px;
        /* Adjust position */
        border-radius: 50%;
        /* Ensure it's a circle */
        float: right;
    }

    .input-container button .fa-solid {
        font-size: 8px;
        /* Adjust icon size to be visible */
        line-height: 1;
        /* Ensure proper vertical alignment */
    }

    .footer .text-end .btn {
        font-size: 10px;
        font-weight: 600;
        color: #0D0D0D;
        background: linear-gradient(to right, #FEE4B5, #A46C03);
        border: none;
        padding: 4px 8px;
        margin-top: 10px;
        border-radius: 3.46px;
    }

    .last_sect p {
        font-size: 8px;
    }

    .last_sect .footer_base_downloads {
        display: flex;
        justify-content: center;
        gap: 18px;
    }

    .last_sect .footer_base_downloads p {
        margin-bottom: 0px;
        font-size: 8px;
    }

    .last_sect {
        width: 90%;
        margin: 10px auto 0 auto;
        justify-content: space-between;
        align-items: center;
        position: relative;
        z-index: 1;
        padding-top: 10px;
    }

    .contact_first {
        width: 100%;
        max-width: 389px;
        position: relative;
        margin: 100px auto 0px auto;
        overflow: hidden;
        padding: 0px 0px 0px 20px;
    }

    .contact_first h5 {
        font-size: 8px;
        color: #797979;
        line-height: 11.8px;
        font-weight: 400;
    }

    .contact_first h1 {
        font-size: 18px;
        color: white;
        font-weight: 600;
    }

    .contact_first .company-name {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
    }

    .contact_first p {
        font-size: 10px;
        color: #FFFFFF;
        letter-spacing: -3%;
        font-weight: 400;
    }

    .contact_second {
        width: 100%;
        max-width: 389px;
        position: relative;
        margin: 10px auto;
        overflow: hidden;
        background-color: #1A1711;
        height: 181.31px;

    }

    .contact_second .container {
        padding: 0px 20px;
    }

    .contact_second .col_left {
        background-color: #000000;
        border-radius: 10px;
        height: 175.87px;
        padding: 2px;
        /* Added for internal spacing */
        box-sizing: border-box;
        margin: 2px 0px 2px 2px;
        background-image: url(../img/image\ 4.png), url(../img/Ellipse\ 793.png);
        background-position: right bottom, left bottom;
        background-repeat: no-repeat, no-repeat;
        background-size: 65.03px, 65.03px;
    }

    .contact_second .col_left .link-parent {
        display: flex;
        flex-direction: column;
        gap: 0px;
        align-items: start;
        margin: 0px 10px;
    }

    .contact_second .col_left .phone_link {
        position: relative;
        top: 0px;
        right: 2px;
    }

    .contact_second .col_left .phone-icon {
        position: relative;
        width: 10px;
        height: 8px;
        left: 1.6px;
    }

    .contact_second .col_left .email-icon {
        width: 8px;
        height: 6px;
        margin-right: 0px;

    }

    .contact_second .col_left .phone-icon {
        width: 8px;
        height: 10px;
        margin-right: 0px;
        position: relative;
        left: 2px;
    }

    .contact_second .col_left .address-icon {
        width: 8px;
        height: 10px;
        margin-right: 0px;
    }

    .contact_second .col_left .site-icon {
        width: 8px;
        height: 6px;
        margin-right: 0px;
    }

    .contact_second h2 {
        font-size: 10px;
        color: white;
        margin: 10.87px 0px 0px 7px;
    }

    .contact_second p {
        font-size: 6px;
        color: #C9C9C9;
        margin: 2px 0px 0px 7px;
    }

    .contact_second a {
        color: white;
        font-size: 8px;

    }

    .contect_links {
        margin-top: 0px;
    }



    .contact_second .col_right {
        padding: 0px 10px;
        height: auto;
    }

    .contact_second .col_right .row .col-md-6 {
        width: 50%;
        flex: 0 0 50%;
        max-width: 50%;
        padding-left: 10px;
        /* Add horizontal padding between columns */
        padding-right: 5px;
        /* Add horizontal padding between columns */
    }

    .contact_second .col_right .row.mb-4 {
        margin-bottom: 0px !important;
        /* Reduced margin between rows */
    }

    .contact_second .col_right .row.mb-2 {
        margin-bottom: 0px !important;
        /* Reduced margin between rows */
    }

    .contact_second .col_right .contact-form label {
        font-size: 6px;
        margin: 0px;
    }

    .contact_second .col_right .form-control {
        padding: 0px 0px;
        font-size: 6px;
    }

    .contact_second .col_right input::placeholder {
        font-size: 6px;
        color: #8D8D8D;
    }

    .contact_second .col_right input {
        font-size: 6px;
        color: white;
    }

    .contact_second .col_right .btn {
        padding: 4px 8px;
        margin-top: 0px;
        font-size: 10px;
        /* Adjusted font size */
        background: linear-gradient(to right, #FEE4B5, #A46C03);
        border: none;
        border-radius: 3.46px;
        color: #0D0D0D;
        line-height: 11.5px;
        /* Corrected line-height */
    }

    .contact-third {
        width: 100%;
        max-width: 389.2px;
        margin: 10px auto;
        position: relative;
        overflow: hidden;
        padding: 10px auto;
    }

    .contact-third h5 {
        color: white;
        margin: 9px;
        font-size: 12px;
    }

    .contact-third p {
        color: white;
        font-size: 6px;
    }

    .contact-third .text-bottom {
        display: flex;
        justify-content: center;
    }








    .service_first {
        width: 100%;
        max-width: 389px;
        position: relative;
        margin: 0px auto 00px auto;
        overflow: hidden;
        padding: 50px 0px 50px 10px;
    }

    .service_first::before {
        width: 134.96px;
        height: 127.02px;
        top: 50px;
        right: -20px;
    }

    .service_first h5 {
        font-size: 8px;
        color: #797979;
        line-height: 11.8px;
        margin-bottom: 0px;
    }

    .service_first h1 {
        font-size: 18px;
        letter-spacing: -3%;
        color: white;
        padding-right: 100px;
    }

    .service_first .company-name {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
        font-size: 18px;
    }

    .service_first p {
        font-size: 10px;
        color: #FFFFFF;
        letter-spacing: -3%;
        font-weight: 300;
    }

    .service_first .btn {
        padding: 4px 8px;
        margin-top: 10px;
        font-size: 14px;
        border: none;
        border-radius: 3.24px;
        color: #E1E1E1;
        background-color: transparent;
        line-height: 17px;
    }

    .service_first .btn::before {
        content: '';
        position: absolute;
        inset: 0;
        padding: 1px;
        background: linear-gradient(to right, #FEE4B5, #A46C03);
        border-radius: 3.24px;
        mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        mask-composite: xor;
        -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        -webkit-mask-composite: xor;
    }

    .service_pic_section {
        width: 100%;
        max-width: 389px;
        position: relative;
        margin: 0px auto 40px auto;
        overflow: hidden;
    }

    .service_pic_section .service_1 .tot {
        background-image: url(../img/Ellipse\ 2774.png), url(../img/Ellipse\ 2775.png);
        background-repeat: no-repeat, no-repeat;
        background-position: center, center;
        background-size: 80%, 65%;
        margin-top: 30px;
    }

    .service_pic_section .tot {
        position: relative;
        height: 131.94px;
        width: 143px;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .service_pic_section .tot .img {
        width: 90.12px;
        height: 87.15px;
        border-radius: 12px;
        object-fit: cover;
        position: absolute;
    }

    .service_pic_section .tot .img-top {
        top: 0;
        left: 0;
        z-index: 1;
    }

    .service_pic_section .tot .img-bottom {
        bottom: 0;
        right: 0;
        z-index: 2;
    }


    .service_pic_section .service_3 .tot {
        margin-top: 30px;
    }



    .service_pic_section .service_5 .tot {
        margin-top: 30px;
    }



    .service_pic_section .tots {
        position: relative;
        width: 109.89px;
        /* adjust as needed */
        height: 165px;
        /* adjust as needed */
        margin: auto;
    }

    /* Base image style */
    .service_pic_section .tots .img {
        width: 63.28px;
        /* adjust size */
        height: 115.91px;
        object-fit: cover;
        position: absolute;
        border-radius: 65.24px;
        /* elliptical shape */
    }

    /* Left/top image */
    .service_pic_section .tots .img-left {
        left: 0;
        top: 0;
        z-index: 1;
    }

    /* Right/bottom image */
    .service_pic_section .tots .img-right {
        right: 0;
        bottom: 0;
        z-index: 2;
    }

    .service_pic_section {}

    .service_pic_section .service_1_wrapper,
    .service_pic_section .service_2_wrapper,
    .service_pic_section .service_3_wrapper,
    .service_pic_section .service_4_wrapper,
    .service_pic_section .service_5_wrapper,
    .service_pic_section .service_6_wrapper {
        width: 100vw;
        position: relative;
        left: 50%;
        right: 50%;
        margin-left: -50vw;
        margin-right: -50vw;
        margin-bottom: 30px;
        background-color: #1a1711;
        border-radius: 5.4px;
    }

    .service_pic_section .row {
        width: 100%;
        max-width: 389px;
        position: relative;
        margin: 0px auto;
        overflow: hidden;
        margin-bottom: 30px;
        border-radius: 20px;
        background-color: #1A1711;
        padding: 0px 0px 0px 0px;
    }

    .service_pic_section .service_1 .row {
        background-image: url(../img/1.png);
        background-repeat: no-repeat;
        background-position: left 20px bottom;
        background-size: 14px, 20px;
    }


    .service_pic_section .tts {
        width: 12.14px;
        height: 12.14px;
        margin-bottom: 4.32px;
        margin-top: 12.14px;
    }

    .service_pic_section .card-title {
        background: linear-gradient(to right, #FEE4B5, #DBB56E);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
        font-size: 12px;
        margin-bottom: 5px;
    }

    .service_pic_section .card-title {
        color: white;
        font-size: 12px;
        padding-right: 0px;
        line-height: 141%;
        letter-spacing: -3%;
    }

    .service_pic_section .card-content {
        color: white;
        font-size: 8px;
        padding-right: 5px;
        line-height: 141%;
        letter-spacing: -3%;
    }

    .service_pic_section .wp {
        padding: 10px 0px 25px 10px;
    }

    .service_pic_section .wop {
        padding: 20px 30px;
    }



    .service_pic_section .service_2 .row {
        background-image: url(../img/2.png);
        background-repeat: no-repeat;
        background-position: right 10px bottom;
        background-size: 14px, 20px;

    }

    .service_pic_section .service_3 .row {
        background-image: url(../img/3.png);
        background-repeat: no-repeat;
        background-position: left 10px bottom;
        background-size: 14px, 20px;
    }

    .service_pic_section .service_4 .row {
        background-image: url(../img/4.png);
        background-repeat: no-repeat;
        background-position: right 10px bottom;
        background-size: 14px, 20px;
    }

    .service_pic_section .service_5 .row {
        background-image: url(../img/s-5.png);
        background-repeat: no-repeat;
        background-position: left 10px bottom;
        background-size: 14px, 20px;
    }

    .service_pic_section .service_6 .row {
        background-image: url(../img/6.png);
        background-repeat: no-repeat;
        background-position: right 10px bottom;
        background-size: 14px, 20px;
    }

    .about_nav {
        width: 100%;
        max-width: 389.2px;
        margin: 0px auto;
        overflow: hidden;
        padding: 0px 0px 0px 0px;
        position: sticky;
        top: 40px;
        /* same as header height */
        z-index: 998;
        /* just below header */
        background-color: #0D0D0D;
        /* match site background */
        padding: 0px 0;
    }

    .about_nav .pills-wrapper {
        gap: 6px;
    }

    .about_nav .pill {
        font-size: 8px;
        line-height: 160%;
    }


    .about_first {
        width: 100%;
        max-width: 389.2px;
        position: relative;
        margin: 0px auto;
        overflow: hidden;
        padding: 0px 00px 0px 0px;

    }

    .about_first::before {
        width: 134.96px;
        height: 127.02px;
        top: 50px;
        right: -20px;
    }

    .about_first .container {
        padding: 0px 16px;
    }

    .about_first h5 {
        font-size: 8px;
        color: #797979;
        line-height: 11.8px;
    }

    .about_first h1 {
        font-size: 18px;
        color: white;
        line-height: 22px;
        font-weight: 500;
        padding-right: 100px;
    }

    .about_first .company-name {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
        line-height: 22px;
        font-weight: 500;
    }

    .about_first p {
        font-size: 10px;
        font-weight: 300;
        color: #FFFFFF;
        letter-spacing: -3%;
        line-height: 12px;
        padding-right: 100px;
    }

    .about_second {
        width: 100%;
        max-width: 389.2px;
        position: relative;
        margin: 0px auto;
        overflow: hidden;
        padding: 30px 0px 20px 0px;
    }

    .about_second .col-8 {
        padding: 0px 15px 0px 28px;
    }



    .about_second .image-wrapper {
        position: absolute;
        right: 10px;
        top: 50%;
        transform: translateY(-50%);
        display: flex;
        align-items: center;
        justify-content: center;
        width: 110.15px;
        /* adjust as needed */
        height: 159px;
        /* adjust as needed */
        margin: auto;
    }

    /* Base image style */
    .about_second .about_second_image .img {
        width: 68.34px;
        /* adjust size */
        height: 125.18px;
        object-fit: cover;
        position: absolute;
        border-radius: 300px;
        /* elliptical shape */
        overflow: hidden;
    }

    /* Left/top image */
    .about_second .about_second_image .img-left {
        left: 0;
        top: 0;
        z-index: 1;
    }

    /* Right/bottom image */
    .about_second .about_second_image .img-right {
        right: 0;
        bottom: 0;
        z-index: 2;
    }

    .about_second h2 {
        font-size: 18px;
        font-weight: 500;
        color: white;
        letter-spacing: 0;
        line-height: 22px;
        margin-bottom: 10px;
        margin-top: 0px;
    }

    .about_second p {
        font-size: 10px;
        color: white;
        line-height: 12px;
        font-weight: 300;
        letter-spacing: -3%;
        margin-bottom: 4px;
        padding: 0px 10px 0px 0px;
    }

    .about_second .company-name {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
    }

    .about_third {
        width: 100%;
        max-width: 358.19px;
        position: relative;
        margin: 50px auto;
        overflow: hidden;
        padding: 0 20px 0 20px;
    }

    .partners img {
        width: 270.66px;
        height: 255.52px;
    }

    .about_third h2 {
        font-size: 18px;
        color: white;
        letter-spacing: -3%;
        line-height: 22px;
        margin-bottom: 2px;
        margin-top: 0px;
    }

    .about_third .company-name {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
    }

    .about_third .text-center p {
        font-size: 28px;
        color: white;
        line-height: 141%;
        letter-spacing: -3%;
        margin-bottom: 12px;
        padding: 0px 0px
    }

    .about_third .text-center {
        margin-bottom: 10px;
    }

    .about_third .col-4 {
        width: 33.33%;
        flex: 0 0 33.33%;
        max-width: 33.33%;
        margin-bottom: 10px;
        /* Reduced space between cards */
        padding: 0 5px;
        /* Add horizontal padding to columns */
    }

    .about_third .mb-5 {
        margin-bottom: 10px !important;
        /* Reduced margin between rows */
    }

    .about_third .card {
        padding: 5px;
        /* Significantly reduced padding for cards */
        border-radius: 8px;
        height: 100%;
        /* Ensure consistent height */
    }

    .about_third .card img {
        height: 6.5px;
        /* Smaller icon size */
        width: 6.5px;
        margin-bottom: 5px;
        /* Reduced margin below icon */
        margin-left: 0px;

    }

    .about_third .card .card-title p {
        line-height: 7.6px;
        letter-spacing: 0.04px;
        font-weight: 400;
        font-size: 8px;
        /* Significantly smaller font size for card titles */
        margin-bottom: 5px;
        padding-right: 3px;
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
    }

    .about_third .card .card-content p {
        font-size: 8px;
        /* Significantly smaller font size for card content */
        font-weight: 300;
        line-height: 9px;
        padding-right: 0px;
    }

    /* Adjust background numbers for about_third cards */
    .about_third .num1,
    .about_third .num3,
    .about_third .num4,
    .about_third .num6 {
        background-size: auto 30px;
        /* Even smaller background numbers */
        background-position: bottom right 2px;
        /* Adjust position */
    }

    .about_third .num2,
    .about_third .num5 {
        background-size: auto 30px;
        background-position: top right;
    }

    .partners {
        width: 100%;
        max-width: 361px;
        position: relative;
        margin: 50px auto;
        overflow: hidden;
        padding: 0 20px 0 20px;
    }

    .partners h2 {
        font-size: 18px;
        color: white;
        margin-bottom: 15px;
        font-weight: 500;
        line-height: 22px;
    }

    .partners .company-name {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
        font-weight: 500;
        line-height: 22px;
    }

    .partners p {
        font-size: 10px;
        font-weight: 300;
        letter-spacing: -3%;
        line-height: 12px;
        color: white;
        margin-top: 0px;
    }

    .partners svg {
        width: 361px;
        height: 36px;
    }





    .Why {
        display: none;
        width: 100%;
        max-width: 1206px;
        position: relative;
        margin: 100px auto;
        overflow: hidden;
    }

    .Why .card-top h2 {
        font-size: 48px;
        color: white;
    }

    .Why .company-name {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
    }

    .Why .card-top p {
        font-size: 24px;
        color: white;
        letter-spacing: -3%;
    }

    .Why .card {
        background-color: #1E1C1C;
        border-radius: 12px;
        padding: 20px 16px;
    }

    .Why .card-title p {
        font-size: 18px;
        color: gold;
    }

    .Why .card-content p {
        font-size: 16px;
        color: white;
        line-height: 26px;

    }





    .Certificates {
        display: none;
        width: 100%;
        max-width: 1171px;
        position: relative;
        margin: 100px auto;
        overflow: hidden;
    }

    .Certificates .text-center h3 {
        font-size: 32px;
        color: #DBB56E;
    }

    .Certificates .text-center p {
        font-size: 28px;
        color: white;
        letter-spacing: -3%;

    }

    .Certificates .text-center .colored-p {
        font-style: italic;
        color: #DBB56E;
    }

    .Certificates .content-bg h4 {
        font-size: 24px;
        color: #DBB56E;
    }

    .Certificates .content-bg h5 {
        font-size: 22px;
        font-style: bold;
        line-height: 26px;
        color: white;
    }

    .Certificates .content-bg p {
        color: white;
        font-size: 18px;
        line-height: 26px;
        padding-right: 260px;
    }

    .Certificates .col-12 {
        display: flex;
        margin-top: 57px;
    }

    .Certificates .col-12 img {
        height: 19px;
        width: 19px;
        margin: 16px;
        position: relative;
    }

    .Certificates .col-12 .tt {
        width: 60px;
        height: 60px;
    }

    .Certificates .col-12 .img-ext {
        width: 60px;
        height: 90px;
    }

    .Certificates .col-12 .img-ext2 {
        width: 60px;
        height: 25px;
    }

    .Certificates .second_text_box {
        padding: 0px 35px;
    }

    .Certificates .second_text_box p {
        color: white;
        font-size: 28px;
        margin-top: 58px;
    }

    .Certificates .second_text_box .bot {
        color: white;
        font-size: 28px;
        margin-top: 18px;
    }











    .about_last {
        display: none;
        width: 100%;
        max-width: 1146.81px;
        position: relative;
        margin: 100px auto;
        overflow: hidden;
    }

    .about_last h2 {
        font-size: 48px;
        color: white;
    }

    .about_last .company-name {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
    }

    .about_last p {
        font-size: 28px;
        letter-spacing: -3%;
        color: white;
        margin-top: 21px;
    }

    .about_last .color-text {
        color: #DBB56E;
        font-style: italic;
    }

    .projects_first {
        width: 100%;
        max-width: 390px;
        position: relative;
        margin: 50px auto 0px auto;
        overflow: hidden;
        padding: 30px 0px 30px 20px;
    }

    .projects_first::before {
        width: 134.96px;
        height: 127.02px;
        top: 20px;
        right: -30px;
    }

    .projects_first .container {
        padding: 0 15px;
    }

    .projects_first h5 {
        font-size: 8px;
        color: #797979;
        line-height: 11.8px;
        font-weight: 400;
    }

    .projects_first h1 {
        font-size: 18px;
        color: white;
        font-weight: 600;
        line-height: 22px;
        padding-right: 100px;
    }

    .projects_first .company-name {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #EDCD92 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
        font-weight: 600;
        line-height: 22px;
    }

    .projects_first p {
        font-size: 10px;
        color: #FFFFFF;
        letter-spacing: -3%;
        line-height: 12px;
        font-weight: 300;
        padding-right: 100px;
    }

    .projects_first .btn {
        padding: 4px 8px;
        margin-top: 10px;
        font-size: 14px;
        font-weight: 500;
        background-color: #DBB56E;
        border-radius: 3.24px;
        color: #0D0D0D;
        line-height: 17px;
    }

    .projects_main {
        width: 100%;
        max-width: 389.2px;
        position: relative;
        margin: 0px auto 40px auto;
        overflow: hidden;
        padding: 0px 20px 0px 20px;
    }

    .projects_main h2 {
        font-size: 16px;
        color: white;
        font-weight: 500;
        line-height: 19px;
        margin-bottom: 0px;
    }

    .projects_main .company-name {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
    }

    .project_pills-section .pills-container {
        width: 100%;
        max-width: 389.2px;
        margin: 0px auto;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .project_pills-section .pills-wrapper {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 2px;
    }

    .project_pills-section .pill {
        font-size: 6px;
        padding: 2.8px 8.41px;
        background-color: #353536;
        margin-bottom: 2.8px;
        line-height: 7px;
    }

    .project_pills-section {
        width: 100%;
        max-width: 389.2px;
        position: relative;
        margin: 0px auto 00px auto;
        overflow: hidden;
    }

    .project_content_list {
        width: 100%;
        max-width: 357px;
        position: relative;
        margin: 0px auto 40px auto;
        overflow: hidden;
    }

    .project_content_list .col-4 {
        width: 33.33%;
    }

    /* Project Main Section - Grid and Card Styling */
    .projects_main .container {
        padding: 0 15px;
        /* Adjust container padding */
    }

    .projects_main .row {
        display: flex;
        flex-wrap: wrap;
        margin-left: -15px;
        /* Compensate for column padding */
        margin-right: -15px;
        /* Compensate for column padding */
        justify-content: start;
        /* Center the grid items */
    }

    .projects_main .col-4 {
        /* Targeting the columns directly */
        padding: 5px;
        /* Add padding between columns */
        box-sizing: border-box;
    }

    .projects_main .card {
        background-color: #1e1c1c;
        /* Dark background from image */
        border-radius: 5.7px;
        /* Rounded corners */
        overflow: hidden;
        /* Ensure image corners are rounded */
        height: 100%;
        /* Make cards same height in a row */
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        /* Push content and arrow apart */
        transition: box-shadow 0.3s ease;
        border: none;
        /* Remove default card border */
    }

    .projects_main .card:hover {
        box-shadow: 0 0 20px #e7c586;
        /* Gold glow on hover */
    }

    .projects_main .card img {
        width: fill !important;
        height: 85px !important;
        /* Fixed height for images */
        object-fit: cover !important;
        /* Cover the area without distortion */
        border-radius: 12px 12px 0 0;
        /* Top corners rounded */
    }

    .projects_main .card-content {
        padding: 5px;
        /* Padding inside the card for text */
        flex-grow: 1;
        /* Allow content to take available space */
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }

    .projects_main .card h3 {
        font-size: 8px;
        /* Title font size */
        background: linear-gradient(to right, #DBB56E 0%, #DBB56E 25%, #EDCE93 50%, #FEE4B5 75%, #FEE4B5 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: transparent;
        /* Title color */
        margin-bottom: 0px;
        /* Space below title */
        font-weight: 600;
    }

    .projects_main .card p {
        font-size: 6px;
        font-weight: 400;
        /* Sector font size */
        color: #FFFFFF;
        /* Sector color */
        margin-bottom: 0px;
        /* No margin below sector text */
    }

    .projects_main h5 {
        font-size: 6px;
        font-weight: 400;
        font-style: normal;
        /* Sector font size */
        color: #DBB56E;
        /* Sector color */
        margin-bottom: 4px;
    }

    .projects_main .card .arrow-link {
        display: flex;
        justify-content: flex-end;
        /* Align arrow to the right */
        padding: 10px 10px 10px 10px;
        /* Padding for the arrow area */
        color: #DBB56E;
        /* Gold color for arrow */
        font-size: 7px;
        /* Size of the arrow */
        text-decoration: none;
        transition: transform 0.2s ease;
    }

    .projects_main .card .arrow-link:hover {
        transform: translateX(5px);
        /* Slight movement on hover */
    }

    /* Pagination */
    .pagination-container {
        display: flex;
        justify-content: center;
        margin-top: 2.26px;
        margin-bottom: 0px;
    }

    .pagination-item {
        margin: 0 5px;
        padding: 1.58px 3.17px;
        border-radius: 4.28px;
        background-color: #0D0D0D;
        /* Dark background for pagination circles */
        color: #d9d9d9;
        font-size: 4.43px;
        text-decoration: none;
        line-height: 5px;
        transition: background-color 0.3s ease, color 0.3s ease;
    }

    .pagination-item:hover {
        background-color: #dbb56e;
        /* Gold on hover */
        color: #0d0d0d;
        /* Dark text on hover */
    }

    .pagination-item.active {
        background: linear-gradient(to right, #FEE4B5, #A46C03);
        /* Active gold */
        color: #0d0d0d;
        /* Dark text for active */
        font-weight: bold;
    }

    .project_details {
        width: 100%;
        max-width: 389.2px;
        position: relative;
        padding-top: 0px;
        margin: 50px auto 0px auto;
        overflow: hidden;
        height: 300px;
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    }

    .project-brief-line {
        height: 2px;
        /* thickness */
        width: 50%;
        /* 60% of viewport width */
        background: linear-gradient(to right, #FEE4B5, #A46C03);
        border-radius: 3px;
        margin: 20px 0;
    }

    .ddt {
        display: flex;
        align-items: start;
        padding: 0 20px;
    }

    .project_content .container {
        width: 100%;
        max-width: 389.2px;
        position: relative;
        padding: 0px 0px;
        margin: 0px auto 0px auto;
    }

    .project_content .project-info {
        width: 100%;
        max-width: 389.2px;
        position: relative;
        margin: 0px auto 0px auto;
        padding: 0 0px;
    }

    .project_details h2 {
        color: white;
        font-size: 16px;
        font-weight: 500;
        line-height: 19px;
        position: absolute;
        top: 10px;
        left: 10px;
    }

    .project_content .col-4 {
        display: flex;
        flex-direction: column;
        justify-content: start;
        align-items: center;
        gap: 5px;
    }

    .project_content .dpv::after {
        content: "";
        position: absolute;
        top: 0;
        right: 10px;
        width: 1px;
        /* thickness of border */
        height: 100%;
        background: linear-gradient(to bottom, #FEE4B5, #A46C03);
        border-radius: 3px;
    }

    .project_details .company-name {
        background: linear-gradient(to left,
                #FEE4B5 0%,
                #FEE4B5 25%,
                #EDCD92 50%,
                #DBB56E 75%,
                #DBB56E 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: #DBB56E;
    }

    .project_content .fa-arrow-left {
        height: 6.5px;
        width: 6.5px;
        color: #DBB56E;
        position: relative;
        left: 4px;
        top: 4px;
    }

    .project_details img {
        width: 100%;
        max-width: 400px;
        height: 250px;
        margin: 0px auto;
        display: block;
    }


    .project_content h1 {
        font-size: 12px;
        background: linear-gradient(to right, #DBB56E 0%, #DBB56E 25%, #EDCE93 50%, #FEE4B5 75%, #FEE4B5 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: transparent;
        padding: 0px;
        line-height: 10.8px;
        position: right;
        text-align: right;
        padding-right: 0px;
        text-transform: uppercase;
    }


    .project_details .row {
        margin-top: 10px;
    }

    .project_content strong {
        color: #DBB56E;
        font-size: 4.88px;
        line-height: 6px;
    }

    .project_content .detail-item {
        color: white;
        font-size: 4.88px;
        line-height: 5px;
        margin-bottom: 3px;
        border-left: 0px solid #444;
    }

    .project_brief h3 {
        background: linear-gradient(to right, #DBB56E 0%, #DBB56E 25%, #EDCE93 50%, #FEE4B5 75%, #FEE4B5 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: transparent;
        font-size: 10px;
        line-height: 10.8px;
        margin-top: 30px;
        padding: 0 20px 0 20px;
    }

    .project_content .row {
        margin-top: 0px;
    }

    .project_brief_description p {
        font-size: 8px;
        color: #D9D9D9;
        line-height: 141%;
        letter-spacing: -3%;
        padding-right: 0px;
        text-align: justify;
        margin-bottom: 0px;
    }

    .project_detailed_description {
        position: relative;
        /* so pseudo-element positions correctly */
        padding-left: 10px;
        /* add space so text doesn’t overlap border */
    }

    .project_detailed_description p {
        font-size: 8px;
        color: white;
        line-height: 141%;
        letter-spacing: -3%;
        color: #D9D9D9;
        margin-bottom: 5px;
        text-align: justify;
    }

    .project_brief_description .btn-secondary {
        position: relative;
        background-color: transparent;
        line-height: 10.8px;
        background: linear-gradient(to right, #DBB56E 0%, #DBB56E 25%, #EDCE93 50%, #FEE4B5 75%, #FEE4B5 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: transparent;
        border: none;
        font-size: 8px;
        font-weight: 500;
        text-decoration: none;
        border-radius: 3.25px;
        transition: all 0.3s ease;
        display: inline-block;
        padding: 4px 4px;
        margin-top: 0px;
        ;
    }

    .project_brief_description .btn-secondary::before {
        content: '';
        position: absolute;
        inset: 0;
        padding: 1px;
        /* This creates the border width */
        background: linear-gradient(to right, #FEE4B5, #A46C03);
        border-radius: 3.25px;
        mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        mask-composite: xor;
        -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        -webkit-mask-composite: xor;
    }
}