.elementor-311 .elementor-element.elementor-element-da2e991{--display:flex;--min-height:100vh;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--gap:40px 40px;--row-gap:40px;--column-gap:40px;--overlay-opacity:0.7;--margin-top:-150px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:50px;--padding-bottom:50px;--padding-left:50px;--padding-right:50px;--z-index:1;overflow:visible;}.elementor-311 .elementor-element.elementor-element-da2e991:not(.elementor-motion-effects-element-type-background), .elementor-311 .elementor-element.elementor-element-da2e991 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://velpulagroup.com/wp-content/uploads/2026/04/image-9.jpg");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-311 .elementor-element.elementor-element-da2e991::before, .elementor-311 .elementor-element.elementor-element-da2e991 > .elementor-background-video-container::before, .elementor-311 .elementor-element.elementor-element-da2e991 > .e-con-inner > .elementor-background-video-container::before, .elementor-311 .elementor-element.elementor-element-da2e991 > .elementor-background-slideshow::before, .elementor-311 .elementor-element.elementor-element-da2e991 > .e-con-inner > .elementor-background-slideshow::before, .elementor-311 .elementor-element.elementor-element-da2e991 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{--background-overlay:'';background-color:#000000;}.elementor-311 .elementor-element.elementor-element-1c8c525{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:center;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;overflow:visible;}.elementor-311 .elementor-element.elementor-element-46d04ef{--display:flex;--justify-content:center;border-style:solid;--border-style:solid;border-width:0px 0px 0px 2px;--border-top-width:0px;--border-right-width:0px;--border-bottom-width:0px;--border-left-width:2px;border-color:#FFFFFF;--border-color:#FFFFFF;--padding-top:0px;--padding-bottom:0px;--padding-left:30px;--padding-right:0px;overflow:visible;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-311 .elementor-element.elementor-element-3fddc5c .elementor-heading-title{font-family:"Poppins", Sans-serif;font-size:34px;font-weight:400;text-transform:uppercase;color:#FFFFFF;}.elementor-311 .elementor-element.elementor-element-c406e4c .elementor-heading-title{font-family:"Poppins", Sans-serif;font-size:16px;font-weight:300;text-transform:uppercase;color:#FFFFFF;}.elementor-311 .elementor-element.elementor-element-0d0f33d{--display:flex;--justify-content:center;border-style:solid;--border-style:solid;border-width:0px 0px 0px 2px;--border-top-width:0px;--border-right-width:0px;--border-bottom-width:0px;--border-left-width:2px;border-color:#FFFFFF;--border-color:#FFFFFF;--padding-top:0px;--padding-bottom:0px;--padding-left:30px;--padding-right:0px;overflow:visible;}.elementor-311 .elementor-element.elementor-element-2e944ff .elementor-heading-title{font-family:"Poppins", Sans-serif;font-size:34px;font-weight:400;text-transform:uppercase;color:#FFFFFF;}.elementor-311 .elementor-element.elementor-element-6ebcad4 .elementor-heading-title{font-family:"Poppins", Sans-serif;font-size:16px;font-weight:300;text-transform:uppercase;color:#FFFFFF;}.elementor-311 .elementor-element.elementor-element-c79b1c6{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;overflow:visible;}.elementor-311 .elementor-element.elementor-element-63931e3 .elementor-heading-title{font-family:"Poppins", Sans-serif;font-size:17px;font-weight:200;line-height:24px;color:#FFFFFF;}.elementor-311 .elementor-element.elementor-element-63931e3{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;width:100%;max-width:100%;}.elementor-311 .elementor-element.elementor-element-aebacf3{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;overflow:visible;}.elementor-311 .elementor-element.elementor-element-ac7dca4{text-align:start;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-311 .elementor-element.elementor-element-ac7dca4 .elementor-heading-title{font-family:"Jedira", Sans-serif;font-size:50px;font-weight:400;line-height:64px;letter-spacing:1.5px;color:#FFFFFF;}.elementor-311 .elementor-element.elementor-element-1edca74{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;overflow:visible;}.elementor-widget-button .elementor-button{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );background-color:var( --e-global-color-accent );}.elementor-311 .elementor-element.elementor-element-cdea37e .elementor-button{font-family:"Poppins", Sans-serif;font-size:16px;font-weight:300;text-transform:uppercase;line-height:24px;letter-spacing:1.5px;fill:#FFFFFFA1;color:#FFFFFFA1;background-color:#89726A00;padding:0px 0px 0px 0px;}.elementor-311 .elementor-element.elementor-element-cdea37e .elementor-button:hover, .elementor-311 .elementor-element.elementor-element-cdea37e .elementor-button:focus{color:#FFFFFF;}.elementor-311 .elementor-element.elementor-element-cdea37e .elementor-button:hover svg, .elementor-311 .elementor-element.elementor-element-cdea37e .elementor-button:focus svg{fill:#FFFFFF;}.elementor-311 .elementor-element.elementor-element-cdea37e{padding:10px 20px 10px 0px;border-style:solid;border-width:0px 1px 0px 0px;border-color:#FFFFFF;}.elementor-311 .elementor-element.elementor-element-cdea37e.elementor-element{--align-self:flex-start;}.elementor-311 .elementor-element.elementor-element-7e57c6f{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;overflow:visible;}@media(min-width:768px){.elementor-311 .elementor-element.elementor-element-1c8c525{--width:80%;}.elementor-311 .elementor-element.elementor-element-46d04ef{--width:25%;}.elementor-311 .elementor-element.elementor-element-0d0f33d{--width:25%;}.elementor-311 .elementor-element.elementor-element-c79b1c6{--width:50%;}.elementor-311 .elementor-element.elementor-element-aebacf3{--width:80%;}.elementor-311 .elementor-element.elementor-element-1edca74{--width:80%;}}@media(max-width:767px){.elementor-311 .elementor-element.elementor-element-da2e991{--min-height:70vh;--justify-content:flex-end;--gap:20px 20px;--row-gap:20px;--column-gap:20px;--padding-top:20px;--padding-bottom:30px;--padding-left:20px;--padding-right:20px;}.elementor-311 .elementor-element.elementor-element-1c8c525{--flex-wrap:wrap;}.elementor-311 .elementor-element.elementor-element-46d04ef{--width:45%;}.elementor-311 .elementor-element.elementor-element-3fddc5c .elementor-heading-title{font-size:24px;}.elementor-311 .elementor-element.elementor-element-c406e4c .elementor-heading-title{font-size:15px;}.elementor-311 .elementor-element.elementor-element-0d0f33d{--width:45%;}.elementor-311 .elementor-element.elementor-element-2e944ff .elementor-heading-title{font-size:24px;}.elementor-311 .elementor-element.elementor-element-6ebcad4 .elementor-heading-title{font-size:15px;}.elementor-311 .elementor-element.elementor-element-c79b1c6{--width:100%;}.elementor-311 .elementor-element.elementor-element-63931e3 .elementor-heading-title{font-size:15px;}.elementor-311 .elementor-element.elementor-element-ac7dca4 .elementor-heading-title{font-size:24px;line-height:34px;}.elementor-311 .elementor-element.elementor-element-cdea37e .elementor-button{font-size:14px;}}/* Start custom CSS for button, class: .elementor-element-cdea37e *//* Ensure the button can hold the absolute lines */
.portfolio-hover-link .elementor-button {
    position: relative;
    overflow: visible !important; /* Prevents the 5px drop from being cut off */
}

/* ::before handles Phase 1 (Left Line) and Phase 2 (Top Line to Center) */
.portfolio-hover-link .elementor-button::before {
    content: "";
    position: absolute;
    bottom: 50%; /* Starts at center-left */
    left: 0;
    width: 0;
    height: 0;
    box-sizing: border-box;
    border-top: 1px solid #fff; /* Gold line */
    border-left: 1px solid #fff;
    opacity: 0; 
    
    /* HOVER OUT (Reverses logic) */
    transition: 
        width 0.2s linear 0.1s, 
        height 0.2s linear 0.3s, 
        opacity 0s linear 0.5s;
}

/* ::after handles Phase 3 (The 5px downward drop at center-top) */
.portfolio-hover-link .elementor-button::after {
    content: "";
    position: absolute;
    top: 0;
    left: 50%; /* Starts at center-top */
    width: 1px;
    height: 0;
    background-color: #fff;
    
    /* HOVER OUT */
    transition: height 0.1s linear 0s;
}

/* --- HOVER IN STATES --- */

/* Draw Phase 1 & 2 */
.portfolio-hover-link .elementor-button:hover::before {
    height: 50%; /* Draws up to top-left */
    width: 50%;  /* Draws across to top-center */
    opacity: 1;

    /* HOVER IN */
    transition: 
        opacity 0s linear 0s, 
        height 0.2s linear 0s, 
        width 0.2s linear 0.2s;
}

/* Draw Phase 3 */
.portfolio-hover-link .elementor-button:hover::after {
    height: 5px; /* Drops down 5px */

    /* HOVER IN: Waits 0.4s for Phase 1 & 2 to finish */
    transition: height 0.1s linear 0.4s;
}/* End custom CSS */
/* Start custom CSS for shortcode, class: .elementor-element-f74229a */.vp-meta-container { padding: 10px; }
.vp-section {
    background: #fff;
    border: 1px solid #ccd0d4;
    padding: 15px;
    margin-bottom: 20px;
    box-shadow: 0 1px 1px rgba(0,0,0,.04);
}
.vp-section h3 { margin-top: 0; padding-bottom: 10px; border-bottom: 1px solid #eee; }
.vp-field-row { margin-bottom: 15px; }
.vp-field-row label { display: block; font-weight: 600; margin-bottom: 5px; }

/* Gallery */
.vp-gallery-grid { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 15px; }
.vp-gallery-item { position: relative; width: 100px; height: 100px; border: 1px solid #ddd; }
.vp-gallery-item img { width: 100%; height: 100%; object-fit: cover; }
.vp-remove-img, .vp-remove-single-img {
    position: absolute; top: -8px; right: -8px; background: #d63638; color: white; border: none; 
    border-radius: 50%; cursor: pointer; width: 22px; height: 22px; font-weight: bold; line-height: 20px;
}

/* Repeaters */
.vp-repeater-row {
    display: flex; gap: 10px; margin-bottom: 10px; background: #f9f9f9; padding: 10px; border: 1px solid #eee; align-items: flex-start;
}
.vp-repeater-row input[type="text"] { flex: 1; }
.vp-repeater-row textarea { flex: 2; min-height: 40px; }
.vp-remove-row { color: #d63638 !important; border-color: #d63638 !important; }

/* Complex Image Card Rows */
.vp-flex-row { align-items: stretch; }
.vp-img-upload-wrap {
    width: 120px; border-right: 1px solid #ddd; padding-right: 10px; display: flex; flex-direction: column; align-items: center; gap: 10px;
}
.vp-single-img-preview { position: relative; min-height: 40px; width: 100%; background: #f1f1f1; display:flex; justify-content:center; }
.vp-inputs-wrap { flex: 1; display: flex; flex-direction: column; gap: 10px; }
.vp-inputs-wrap input, .vp-inputs-wrap textarea { width: 100%; }

/* ==================================================
   VELPULA PROJECTS GRID & FILTERS CSS
   ================================================== */

/* Overall Wrapper & Architectural Lines Effect */
.vp-frontend-wrapper {
    position: relative;
    font-family: 'Inter', sans-serif; /* Replace with your theme's sans-serif */
    padding: 20px;
    margin: 20px;
    /* Optional: Faint vertical architectural lines background */
    background-color: #F3F3F3;
}

/* Header Area (Beige Block) */
.vp-header-area {
    display: flex;
    flex-wrap: wrap;
    background-color: #F1ECEC; /* Matches the beige block */
    margin-bottom: 40px;
}

.vp-header-title {
    flex: 1 1 300px;
    padding: 50px 50px;
    display: flex;
    align-items: center;
}

.vp-header-title h2 {
    font-family: 'jedira', serif; /* Replace with your theme's serif font */
    font-size: 34px;
    line-height: 1.2;
    color: #89726A; /* The specific brownish text color */
    margin: 0;
    font-weight: 400;
}

/* The Filters Grid */
.vp-filter-grid {
    flex: 2 1 500px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    background-color: #F1ECEC; /* Slightly lighter beige for filters */
}

.vp-filter-item {
    padding: 30px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.vp-border-right { border-right: 1px solid #E5DFD8; }
.vp-border-bottom { border-bottom: 1px solid #E5DFD8; }

.vp-filter-item label {
    font-size: 14px;
    font-weight: 600;
    color: #333;
    margin-bottom: 8px;
    font-family: 'Poppins';
}

/* Custom Dropdown Styling */
.vp-filter-select, #vp-filter-keyword {
    appearance: none;
    -webkit-appearance: none;
    background: transparent;
    border: none;
    padding: 5px 20px 5px 0;
    font-size: 14px;
    color: #666;
    outline: none;
    cursor: pointer;
    font-family: inherit;
}

/* Custom Chevron for Dropdowns */
.vp-filter-select {
    background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23000000%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E");
    background-repeat: no-repeat;
    background-position: right center;
    background-size: 10px auto;
}

/* Search Input Styling */
.vp-search-input-wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.vp-search-input-wrap input { width: 100%; }
.vp-search-input-wrap svg { color: #000; }

/* ==================================================
   PROJECT CARDS GRID
   ================================================== */

.vp-cards-container {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 30px;
    transition: opacity 0.3s ease;
}

.vp-card {
    background: #FAFAFA;
    border: 1px solid #283642;
    display: flex;
    flex-direction: column;
}

.vp-card-img-wrap {
    position: relative;
    height: 240px;
    background-size: cover;
    background-position: center;
    border-bottom: 1px solid #EAEAEA;
}

/* Badges (Top Right Camera, Bottom Right Status) */
.vp-camera-badge {
    position: absolute;
    top: 15px;
    right: 15px;
    background: rgba(255, 255, 255, 0.85);
    padding: 4px 8px;
    font-size: 12px;
    font-weight: 400;
    color: #333;
    display: flex;
    align-items: center;
    gap: 5px;
}

.vp-status-badge {
    position: absolute;
    bottom: 25px;
    right: 0px;
    background: #C19A6B; /* Gold Color */
    color: #fff;
    padding: 6px 12px;
    font-size: 12px;
    font-weight: 300;
    text-transform: capitalize;
    letter-spacing: 0.5px;
    font-family: 'poppins';
}

/* Card Content */
.vp-card-body {
    padding: 30px 20px;
    flex: 1;
    display: flex;
    flex-direction: column;
}

.vp-card-title {
    font-size: 18px;
    font-weight: 600;
    font-family: 'poppins';
    color: #283642;
    margin: 0 0 10px 0;
}

.vp-card-loc {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: #283642;
    margin-bottom: 30px;
    font-family: 'poppins';
    font-weight: 300;
}

/* THE PARTIAL BORDER HOVER BUTTON */
.vp-btn-explore {
    margin-top: auto; 
    align-self: flex-start;
    position: relative;
    padding: 10px 20px 10px 15px;
    font-size: 14px;
    font-weight: 400;
    color: #555;
    text-decoration: none;
    letter-spacing: 1px;
    text-transform: uppercase;
    font-family: 'poppins';
}

/* ::before handles Phase 1 (Left Line) and Phase 2 (Top Line to Center) */
.vp-btn-explore::before {
    content: "";
    position: absolute;
    bottom: 50%; /* Starts at center-left */
    left: 0;
    width: 0;
    height: 0;
    box-sizing: border-box;
    border-top: 1px solid #C49A6C;
    border-left: 1px solid #C49A6C;
    opacity: 0; 
    
    /* HOVER OUT (Reverses logic: Erases width, then height, then opacity) */
    transition: 
        width 0.2s linear 0.1s, 
        height 0.2s linear 0.3s, 
        opacity 0s linear 0.5s;
}

/* ::after handles Phase 3 (The 5px downward drop at center-top) */
.vp-btn-explore::after {
    content: "";
    position: absolute;
    top: 0;
    left: 50%; /* Starts at center-top */
    width: 1px;
    height: 0;
    background-color: #C49A6C;
    
    /* HOVER OUT (Erases height immediately) */
    transition: height 0.1s linear 0s;
}

/* --- HOVER IN STATES --- */

/* Draw Phase 1 & 2 */
.vp-btn-explore:hover::before {
    height: 50%; /* Draws up from center-left to top-left */
    width: 50%;  /* Draws across from top-left to top-center */
    opacity: 1;

    /* HOVER IN: Opacity instant, then height, then width */
    transition: 
        opacity 0s linear 0s, 
        height 0.2s linear 0s, 
        width 0.2s linear 0.2s;
}

/* Draw Phase 3 */
.vp-btn-explore:hover::after {
    height: 5px; /* Drops down 5px */

    /* HOVER IN: Waits 0.4s for Phase 1 & 2 to finish, then drops down */
    transition: height 0.1s linear 0.4s;
}

.vp-btn-explore:hover { color: #222; }
/* Responsive tweaks */
@media (max-width: 768px) {
    .vp-filter-grid { grid-template-columns: 1fr; }
    .vp-border-right { border-right: none; }
    .vp-header-title { padding: 40px 20px; }
}/* End custom CSS */