/* =========================================================
   BALAJI CONSTRUCTION — PROJECT PAGE ONLY
   Final dropdown + spacing + animation
   Does NOT modify global style1.css
========================================================= */

.project-page{
    overflow:hidden;
}

/* Remove the large blank area between sections */
.project-page .projects-intro-section{
    padding:72px 20px 48px !important;
}

.project-page .projects-intro-container{
    max-width:820px;
}

.project-page .projects-intro-subtitle{
    font-size:14px !important;
    letter-spacing:3px;
    margin-bottom:12px;
}

.project-page .projects-intro-title{
    margin-bottom:18px;
}

.project-page .projects-intro-description{
    line-height:1.75;
}

/* Compact category area */
.project-page .projects-filter-section{
    padding:8px 20px 30px !important;
    background:var(--white);
}

.project-page .projects-filter-container{
    max-width:420px;
    margin:0 auto;
    display:block;
    text-align:center;
}

/* Premium label */
.project-page .projects-filter-label{
    display:block;
    margin:0 0 9px;
    color:#5e9f91;
    font-size:11px;
    line-height:1.2;
    font-weight:700;
    letter-spacing:1.8px;
    text-transform:uppercase;
}

/* Custom select */
.project-page .projects-filter-select-wrap{
    position:relative;
    width:100%;
}

.project-page .projects-filter-select{
    display:block;
    width:100%;
    height:54px;
    padding:0 52px 0 19px;
    appearance:none;
    -webkit-appearance:none;
    border:1px solid rgba(124,187,174,.55);
    border-radius:14px;
    outline:none;
    background:#fff;
    color:#192523;
    font:600 14px Poppins,sans-serif;
    letter-spacing:.1px;
    cursor:pointer;
    box-shadow:0 9px 25px rgba(25,37,35,.07);
    transition:
        border-color .3s ease,
        box-shadow .3s ease,
        transform .3s ease,
        background .3s ease;
}

.project-page .projects-filter-select:hover{
    border-color:#7cbbae;
    transform:translateY(-2px);
    box-shadow:0 14px 32px rgba(25,37,35,.10);
}

.project-page .projects-filter-select:focus{
    border-color:#5e9f91;
    background:#fff;
    box-shadow:
        0 0 0 4px rgba(124,187,174,.14),
        0 14px 32px rgba(25,37,35,.10);
}

.project-page .projects-filter-select-wrap i{
    position:absolute;
    top:50%;
    right:19px;
    margin:0;
    color:#5e9f91;
    font-size:13px;
    pointer-events:none;
    transform:translateY(-50%);
    transition:transform .3s ease;
}

.project-page .projects-filter-select:focus + i{
    transform:translateY(-50%) rotate(180deg);
}

/* Projects start closer to dropdown */
.project-page .featured-projects-section{
    padding:8px 20px 95px !important;
}

.project-page .featured-projects-container{
    max-width:1200px;
}

/* Card animation */
.project-page .featured-project-card{
    opacity:1;
    transform:translateY(0) scale(1);
    transition:
        opacity .45s ease,
        transform .45s cubic-bezier(.2,.7,.2,1),
        box-shadow .35s ease;
}

.project-page .featured-project-card:hover{
    transform:translateY(-7px);
    box-shadow:0 20px 42px rgba(25,37,35,.13);
}

.project-page .featured-project-card img{
    transition:transform .65s cubic-bezier(.2,.7,.2,1);
}

.project-page .featured-project-card:hover img{
    transform:scale(1.045);
}

.project-page .project-filter-hide{
    opacity:0 !important;
    transform:translateY(18px) scale(.97) !important;
    pointer-events:none;
}

.project-page .project-filter-show{
    animation:projectFilterIn .55s cubic-bezier(.2,.7,.2,1) both;
}

@keyframes projectFilterIn{
    from{
        opacity:0;
        transform:translateY(22px) scale(.97);
    }
    to{
        opacity:1;
        transform:translateY(0) scale(1);
    }
}

/* Scroll reveal */
.project-page .project-reveal{
    opacity:0;
    transform:translateY(30px);
    transition:
        opacity .8s ease,
        transform .8s cubic-bezier(.2,.7,.2,1);
}

.project-page .project-visible{
    opacity:1;
    transform:translateY(0);
}

/* Hero entrance */
.project-page .projects-hero-title{
    animation:projectHeroTitle .9s cubic-bezier(.2,.7,.2,1) both;
}

.project-page .projects-hero-text{
    animation:projectHeroText .9s .12s cubic-bezier(.2,.7,.2,1) both;
}

.project-page .projects-hero-breadcrumb{
    animation:projectHeroText .8s .22s ease both;
}

@keyframes projectHeroTitle{
    from{opacity:0;transform:translateY(25px);}
    to{opacity:1;transform:translateY(0);}
}

@keyframes projectHeroText{
    from{opacity:0;transform:translateY(16px);}
    to{opacity:1;transform:translateY(0);}
}

/* Video / gallery / process hover */
.project-page .gallery-card,
.project-page .projects-video-card,
.project-page .process-card{
    transition:
        transform .4s cubic-bezier(.2,.7,.2,1),
        box-shadow .4s ease;
}

.project-page .gallery-card:hover,
.project-page .projects-video-card:hover,
.project-page .process-card:hover{
    transform:translateY(-6px);
    box-shadow:0 18px 40px rgba(25,37,35,.11);
}

@media(max-width:768px){

    .project-page .projects-intro-section{
        padding:55px 16px 32px !important;
    }

    .project-page .projects-intro-title{
        font-size:32px;
    }

    .project-page .projects-filter-section{
        padding:6px 16px 24px !important;
    }

    .project-page .projects-filter-container{
        max-width:100%;
    }

    .project-page .projects-filter-select{
        height:51px;
    }

    .project-page .featured-projects-section{
        padding:4px 15px 70px !important;
    }
}

@media(max-width:480px){

    .project-page .projects-intro-section{
        padding:48px 15px 26px !important;
    }

    .project-page .projects-intro-title{
        font-size:27px;
    }

    .project-page .projects-intro-description{
        font-size:15px;
        line-height:1.7;
    }

    .project-page .projects-filter-label{
        font-size:10px;
    }

    .project-page .featured-projects-section{
        padding-bottom:55px !important;
    }
}

@media(prefers-reduced-motion:reduce){

    .project-page *,
    .project-page *::before,
    .project-page *::after{
        animation:none !important;
        transition:none !important;
    }

    .project-page .project-reveal{
        opacity:1 !important;
        transform:none !important;
    }
}


/* =========================================================
   UNIQUE PROJECT GALLERY
   Project page only
========================================================= */

.project-page .project-gallery-new{
    padding:100px 20px 110px;
    background:#f7fbfa;
}

.project-page .project-gallery-heading{
    max-width:850px;
    margin:0 auto 52px;
}

.project-page .project-gallery-heading span{
    display:inline-block;
    margin-bottom:10px;
    color:#7cbbae;
    font-size:13px;
    font-weight:800;
    letter-spacing:3px;
}

.project-page .project-gallery-heading h2{
    margin:0 0 14px;
}

.project-page .project-gallery-heading p{
    max-width:680px;
    margin:0 auto;
    color:#647572;
    line-height:1.8;
}

/* =========================================================
   PROJECT GALLERY — TRUE MASONRY / NO-GAP LAYOUT
   Project page only
========================================================= */

.project-page .project-gallery-grid{
    max-width:1240px;
    margin:0 auto;
    column-count:3;
    column-gap:18px;
}

.project-page .project-gallery-card{
    position:relative;
    min-width:0;
    width:100%;
    overflow:hidden;
    border-radius:20px;
    background:#192523;
    cursor:pointer;
    box-shadow:0 12px 35px rgba(25,37,35,.08);

    /* masonry cards must stay together */
    display:inline-block;
    vertical-align:top;
    margin:0 0 18px;

    opacity:0;
    transform:translateY(28px);
    animation:galleryCardReveal .75s cubic-bezier(.2,.7,.2,1) forwards;
}

/* Remove old grid spanning rules */
.project-page .project-gallery-card-large,
.project-page .project-gallery-card-tall,
.project-page .project-gallery-card-wide{
    grid-column:auto;
    grid-row:auto;
}

/* Natural masonry image heights */
.project-page .project-gallery-card-large img,
.project-page .project-gallery-card-wide img{
    aspect-ratio:16 / 10;
}

.project-page .project-gallery-card-tall img{
    aspect-ratio:4 / 5;
}

.project-page .project-gallery-card:not(.project-gallery-card-large):not(.project-gallery-card-tall):not(.project-gallery-card-wide) img{
    aspect-ratio:4 / 3;
}

.project-page .project-gallery-card img{
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
    transition:transform .8s cubic-bezier(.2,.7,.2,1);
}

.project-page .project-gallery-card::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(
        to top,
        rgba(15,25,23,.82) 0%,
        rgba(15,25,23,.20) 48%,
        rgba(15,25,23,0) 78%
    );
    opacity:.75;
    transition:opacity .4s ease;
}

.project-page .project-gallery-card:hover img{
    transform:scale(1.07);
}

.project-page .project-gallery-card:hover::after{
    opacity:.95;
}

.project-page .project-gallery-overlay{
    position:absolute;
    left:24px;
    right:24px;
    bottom:22px;
    z-index:2;
    color:#fff;
    transform:translateY(8px);
    transition:transform .4s ease;
}

.project-page .project-gallery-card:hover .project-gallery-overlay{
    transform:translateY(0);
}

.project-page .project-gallery-overlay span{
    display:inline-block;
    margin-bottom:6px;
    color:#9ed8cd;
    font-size:11px;
    font-weight:800;
    letter-spacing:1.6px;
    text-transform:uppercase;
}

.project-page .project-gallery-overlay h3{
    margin:0 0 12px;
    font-size:20px;
    line-height:1.2;
}

.project-page .project-gallery-view{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:0;
    border:0;
    background:transparent;
    color:#fff;
    font:600 12px Poppins,sans-serif;
    cursor:pointer;
    opacity:.9;
}

.project-page .project-gallery-view i{
    transition:transform .3s ease;
}

.project-page .project-gallery-view:hover i{
    transform:translate(3px,-3px);
}

@keyframes galleryCardReveal{
    to{
        opacity:1;
        transform:translateY(0);
    }
}

/* Modal */
.project-page .project-gallery-modal{
    position:fixed;
    inset:0;
    z-index:9999;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:24px;
    background:rgba(8,16,15,.88);
    opacity:0;
    visibility:hidden;
    transition:opacity .35s ease, visibility .35s ease;
}

.project-page .project-gallery-modal.active{
    opacity:1;
    visibility:visible;
}

.project-page .project-gallery-modal-content{
    position:relative;
    width:min(1080px,100%);
    max-height:92vh;
    padding:12px;
    border-radius:20px;
    background:#fff;
    box-shadow:0 30px 90px rgba(0,0,0,.35);
    transform:translateY(20px) scale(.97);
    transition:transform .4s cubic-bezier(.2,.7,.2,1);
    overflow:auto;
}

.project-page .project-gallery-modal.active .project-gallery-modal-content{
    transform:translateY(0) scale(1);
}

.project-page .project-gallery-modal-image{
    width:100%;
    max-height:72vh;
    display:block;
    object-fit:contain;
    border-radius:14px;
    background:#eef3f2;
}

.project-page .project-gallery-modal-info{
    padding:18px 10px 8px;
}

.project-page .project-gallery-modal-info span{
    color:#5e9f91;
    font-size:11px;
    font-weight:800;
    letter-spacing:1.5px;
    text-transform:uppercase;
}

.project-page .project-gallery-modal-info h2{
    margin:5px 0 6px;
    color:#192523;
}

.project-page .project-gallery-modal-info p{
    margin:0;
    color:#647572;
    line-height:1.7;
}

.project-page .project-gallery-modal-close{
    position:absolute;
    top:20px;
    right:20px;
    z-index:5;
    width:42px;
    height:42px;
    border:0;
    border-radius:50%;
    background:rgba(25,37,35,.88);
    color:#fff;
    font-size:27px;
    line-height:1;
    cursor:pointer;
    transition:transform .25s ease, background .25s ease;
}

.project-page .project-gallery-modal-close:hover{
    transform:rotate(90deg);
    background:#7cbbae;
}

@media(max-width:900px){
    .project-page .project-gallery-grid{
        column-count:2;
        column-gap:16px;
    }
}

@media(max-width:600px){
    .project-page .project-gallery-new{
        padding:70px 15px 75px;
    }

    .project-page .project-gallery-heading{
        margin-bottom:32px;
    }

    .project-page .project-gallery-grid{
        column-count:1;
        column-gap:0;
    }

    .project-page .project-gallery-card{
        margin-bottom:14px;
    }

    .project-page .project-gallery-overlay{
        left:18px;
        right:18px;
        bottom:18px;
    }

    .project-page .project-gallery-overlay h3{
        font-size:18px;
    }

    .project-page .project-gallery-modal{
        padding:12px;
    }

    .project-page .project-gallery-modal-content{
        border-radius:15px;
    }
}

@media(prefers-reduced-motion:reduce){
    .project-page .project-gallery-card{
        opacity:1;
        transform:none;
        animation:none;
    }

    .project-page .project-gallery-card img,
    .project-page .project-gallery-overlay,
    .project-page .project-gallery-modal,
    .project-page .project-gallery-modal-content{
        transition:none;
    }
}

.project-page body.gallery-modal-open{overflow:hidden;}