/* Platter CSS */
.platter-section{position: relative;}
/* .platter-section::before{position: absolute;content: '';top: 0;left: 0;width: 100%;height: 100%;background: url('../images/platter-bg1.webp') no-repeat;z-index: -1;} */
.platter-section .platter-project-box .project-detail{position: relative;}
.platter-section .platter-project-box .project-detail .pr-img { overflow: hidden;transition: 0.5s ease;}
/* .platter-section .platter-project-box .project-detail .pr-img:hover img {transform: scale(1.03); } */
.platter-section .platter-project-box .project-detail .pr-img img{border-radius: 15px;}
.platter-section .platter-project-box .project-detail .pr-img::before{position: absolute; content: ''; top: 0;left: 0;width: 100%;height: 100%;background: #00000020;/* opacity: 0; */border-radius: 15px;}

.overlay-content {position: absolute;top: 0%;left: 50%;transform: translate(-50%, -50%);display: flex;flex-direction: column;gap: 80px;align-items: center;justify-content: center;background: #fffde9;border-radius: 100%;width: 150px;height: 150px;border: 5px solid #fff;}
.overlay-content a{text-decoration: none;color: #fff;font-weight: 400;letter-spacing: 2px;padding-right: 5px;font-size: 14px;}
.overlay-content a:hover{color: #fff !important;}
.overlay-content .pro-logo {/* filter: invert(1) brightness(100); */width: 150px;padding: 20px;}

.project-detail-btn{position: absolute;bottom: 5%;right: 10%;/* transform: translateX(-50%); */}
.project-detail-btn a{color: #fff;text-decoration: none;letter-spacing: 2px;font-size: 14px;font-weight: 300;padding: 12px 22px 12px 25px;border: 1px solid #ffffff38;border-radius: 50px;background: #39393900;backdrop-filter: blur(20px);display: flex;justify-content: center;align-items: center;gap: 5px;}
.project-detail-btn a:hover{color: #fff !important;}
.project-detail-btn a img{/* filter: invert(1); */transition: 0.5s ease;width: 18px;margin-left: 4px;}
.project-detail-btn a:hover img{transform: translateX(5px);}

/* Our Projects  */

.hot-projects-details{position: relative;}
.hot-projects-details img {padding: 4px;border: 2px solid #6d242969;border-radius: 10pc;object-fit: cover;object-position: top;filter: brightness(0.5);height: 9pc;width: 18pc;}
.hot-projects-details h5{position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);width: max-content;height: auto;font-size: 20px;font-weight: 400;color: #fff;letter-spacing: 2px;}
.project-boxes {width: 85%;margin: auto;}


.our-project-details {padding: 70px 0;background: #fffde9;position: relative;}
.our-project-details::before{position: absolute;left: 0;top: 0;width: 100%;height: 100%;content: "";background: url("../images/pattern-bg.webp") no-repeat;opacity: 0.3;}


.our-project-details .project-data {padding-left: 60px;position: relative;height: 100%;display: flex;flex-direction: column;justify-content: center;}
.our-project-details .project-data .project-name {display: flex;justify-content: start;align-items: end;gap: 20px;}
.our-project-details .project-data .project-name .pro-typo p {font-size: 15px;letter-spacing: 1px;color: #636363;font-weight: 300;}
.our-project-details .project-data .project-name .pro-typo h6{font-size: 38px;color: var(--primary-color);padding: 15px 0 0;}
.our-project-details .project-data .project-name span {/* font-size: 80px; */color: #6d2429;line-height: 83px;}
.our-project-details .project-data .project-name span img {width: 68px;}
.our-project-details .project-data .project-content {padding: 20px 60px 20px 80px;}
.our-project-details .project-data .project-content p {letter-spacing: 1px;font-size: 15px;padding-bottom: 20px;line-height: 25px;font-weight: 300;}
.our-project-details .project-data .project-content ul { margin-left: 0px;}
.our-project-details .project-data .project-content ul li {text-decoration: none;list-style: none;padding-bottom: 10px;display: flex;justify-content: start;align-items: center;gap: 12px;font-size: 15px;letter-spacing: 1px;font-weight: 300;}
.our-project-details .project-data .project-content ul li img{width: 12px;}

.pro-detail-btn a {text-decoration: none;color: #fff;border: 1px solid #000;background: var(--primary-color);padding: 10px 40px;display: block;width: fit-content;margin-top: 10px;font-size: 14px;letter-spacing: 1.3px;font-weight: 400;border-radius: 3px;}
.pro-detail-btn a:hover{color: #fff !important;}
.our-project-details .project-img-section {display: flex;justify-content: center;position: relative;}
.our-project-details .project-img-section img{border: 1px solid #712633b0;padding: 7px;/* border-radius: 10px; */height: 370px;width: 100%;object-fit: cover;object-position: bottom 0px left 0;}
.project-detail-new {
    padding: 80px 30px 0;
}

.our-project-details.light-back {background: #fff;}

/* Text Rotation  */
.rotating-image img {width: 400px;height: 400px;animation: rotate 20s linear infinite;opacity: 0.04;}
.rotating-image {position: absolute;top: 65%;left: 80%;transform: translate(-50%, -50%);}

/* Keyframes for rotation */
@keyframes rotate { 
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}   

/* tab section */
.our-projects .project-tab {justify-content: space-evenly;margin: 20px;border: none;width: 40%;margin: 0px auto 50px;border: 1px solid #6d24294f;padding: 10px;border-radius: 50px;width: max-content;gap: 20px;background: #fffde9;position: absolute;top: 5%;z-index: 99;left: 50%;transform: translateX(-50%) !important;}
.our-projects .nav-tabs .nav-item.show .nav-link, .our-projects .nav-tabs .nav-link.active {color: #ffffff;background-color: var(--primary-color);border-color: unset; border: 1px solid var(--primary-color);letter-spacing: 2px;font-weight: 300;font-size: 14px;border-radius: 30px;padding: 12px 25px;min-width: 220px;}
.our-projects .nav-tabs .nav-link {margin-bottom: -1px;background: 0 0;border: 1px solid transparent;border-top-left-radius: .25rem;border-top-right-radius: .25rem;color: #000;letter-spacing: 2px;font-size: 14px;padding: 12px 25px;min-width: 220px;border: 1px solid #6d24294f;border-radius: 50px;}


/* Other projects */
.other-projects-section{position: relative;}
.other-projects-section::before{position: absolute;left: 50%;top: 0;width: 100%;height: 100%;width: 100%;background: url('../images/rotate.png') no-repeat;background-position: top;background-size: 800px;z-index: -1;content: '';transform: translateX(-50%);opacity: 0.04;}
.other-project {position: relative;}
.other-project .other-pro-image{position: relative;/*overflow: hidden;*/}
.other-project .other-pro-image img {border-radius: 20px;position: relative;width: 100%;}
.other-project .other-pro-image::before {position: absolute;content: '';top: 0;left: 0;width: 100%;height: 100%;background: linear-gradient(0deg, #00000082, transparent);z-index: 99;border-radius: 20px;}
.other-project .other-pro-typo {position: absolute;left: 5%;z-index: 99;top: 3%;border: 1px solid #fff;color: #fff;letter-spacing: 1.5px;font-weight: 300;font-size: 14px;padding: 5px 15px;border-radius: 20px;}

.other-project .overlay-content-pro h3 {font-size: 20px;letter-spacing: 1.5px;line-height: 34px;}
.overlay-content-pro a {color: #fff;letter-spacing: 2px;font-weight: 3;font-size: 13px;padding: 8px 20px;display: block;border: 1px solid;width: fit-content;border-radius: 20px;margin-top: 22px;}

.other-project .overlay-content-pro {position: absolute;bottom: -24%;color: #fff; z-index: 99;padding: 0px 20px 40px;transition: 0.5s ease;width: 100%;height: 40%;}
.other-pro-image:hover .overlay-content-pro {bottom: -10%;}
.our-projects.section {
    padding: 0px 0 0;
    position: relative;
}
.project-name-new h6 {
    color: var(--primary-color);
    font-size: 28px;
    text-align: center;
    letter-spacing: 1px;
    padding-top: 5px;
}
.pro-detail-btn {
    display: flex;
    justify-content: center;
}
.coming-soon-anm{animation: zoom-in 2s ;font-size: 46px;}
@keyframes zoom-in {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.1);
    }
    100% {
        transform: scale(1);
    }
}
.coming-soon-text {
    width: 100%;
    height: 50vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

@media(max-width:1600px){
    .overlay-content {width: 140px;height: 140px;}
    .overlay-content .pro-logo {width: 130px;}

    /* Hot Projects */

    .hot-projects-details img {padding: 2px;border: 3px solid #6d242924;border-radius: 10pc;object-fit: cover;object-position: top;filter: brightness(0.5);height: 8pc;width: 19pc;}
    .our-project-details .project-data {padding-left: 0px; }
    .our-project-details .project-data .project-content {padding: 20px 0px 20px 80px; }
    .our-project-details .project-data .project-name .pro-typo h6 {font-size: 32px; }
    .our-project-details .project-data .project-content ul li { font-size: 14px; }
    .rotating-image img { width: 300px;height: 300px;  }
    .our-project-details { padding: 70px 0; }

    .our-projects .nav-tabs .nav-item.show .nav-link, .our-projects .nav-tabs .nav-link.active {font-size: 12px;}
    .our-projects .nav-tabs .nav-link {font-size: 12px;}
    .our-projects .project-tab {margin: 10px auto 10px;}

    .other-project .overlay-content-pro {bottom: -20%;}
    .other-pro-image:hover .overlay-content-pro{bottom: -5%;}

    .other-projects-section::before {background-size: 690px;}
    .project-detail-btn a {letter-spacing: 1.4px;font-size: 13px;font-weight: 300;padding: 10px 20px 10px 25px;}
    .pro-detail-btn a {padding: 10px 34px;font-size: 12px;}
    .project-detail-new {padding: 70px 0px 0;z-index: 9;position: relative;}
}

@media(max-width:1367px){
    .other-project .overlay-content-pro h3 {font-size: 20px;}
    #exampleModal1 .coming-soon img {width: 500px; height: 500px;}
    #exampleModal1 .modal-dialog .modal-content { height: 500px;}
    #exampleModal1 .modal-dialog .modal-content button.btn-close {right: 21%;top: 6%;}
    .our-project-details .project-img-section img {height: 350px;}
    .project-detail-new {padding: 60px 0px 0;}
}

@media(max-width:767px){
    .overlay-content {width: 120px;height: 120px;}
    .overlay-content .pro-logo {width: 120px;}
    .platter-project-box {margin-top: 40px;margin-bottom: 50px;}
    .section {padding: 40px 0 0;}
    .project-detail-btn {bottom: 4%;right: 5%;}
    .project-detail-btn a {font-size: 12px;padding: 10px 20px 10px 20px;}
    .other-project .overlay-content-pro h3 {font-size: 18px;letter-spacing: 1px;}
    .other-project .overlay-content-pro { bottom: -17%;}
    .overlay-content-pro a { margin-top: 15px;}
    .other-projects-section .section-head {font-size: 36px;margin-bottom: 0;margin-top: 15px;}
    .other-projects-section::before {background-size: 100%;}
    .footer-section.section {padding-bottom: 50px;}

    .our-projects .project-tab {margin: 0px auto 40px;display: flex;flex-direction: column;justify-content: center;align-items: center;border-radius: 8px; gap: 15px;}
    .our-projects .nav-tabs .nav-item.show .nav-link, .our-projects .nav-tabs .nav-link.active { letter-spacing: 2px;}
    .our-project-details {padding: 40px 0;}
    .hot-projects.section {
        padding: 50px 0;
    }
    .project-boxes {
        width: 100%;
        gap: 40px 20px;
    }
    .hot-projects.section .container{max-width: 100% !important;}
    .hot-projects-details img {
        border-radius: 104px;
        height: 130px;
        width: 130px;}
    .hot-projects-details h5 {top: 110%;font-size: 20px;letter-spacing: 1px;color: #000;font-size: 15px;}
    #exampleModal1 .coming-soon img {width: auto;height: auto;}
    #exampleModal1 .modal-dialog .modal-content button.btn-close {right: 7%;top: 19%;}
    .modal-body {padding: 10px;align-items: center;display: flex;}
    .project-detail-new {padding: 190px 0px 0;}
    .our-project-details .project-img-section img { height: 310px;}

    .coming-soon-anm {padding-top: 130px;}
}