.filter-btn{margin-right:5px;cursor:pointer}
/* FILTERS */
.filters{padding:20px 0px;display:flex;align-items:center;gap:8px;flex-wrap: wrap;}
.filter-btn { padding: 7px 18px !important; border: 1px solid #3F4096 !important; background: transparent !important; color: #3F4096 !important; font-size: 12px !important; letter-spacing: 1.5px; text-transform: uppercase !important; cursor: pointer; border-radius: 2px !important; transition: all .2s; }
.filter-btn.active, .filter-btn:hover { background: #3F4096 !important; color: #FFFFFF !important; }

/* GRID */
.grid-section{padding:36px 40px 60px}
.projects-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px; margin-top: 30px;}

.p-card { background: #FFFFFF; border: 1px solid #EEEEEE; cursor: pointer; transition: transform .25s,box-shadow .25s; overflow: hidden; border-radius: 16px; }
.p-card:hover{transform:translateY(-5px);box-shadow:0 16px 40px rgba(0,0,0,0.09)}

.p-img{height:250px;display:flex;align-items:center;justify-content:center;font-size:52px;position:relative}
.projects-grid .p-card .p-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.p-badge { position: absolute; bottom: 12px; left: 12px; background: #3f4096d9; color: #FFFFFF; font-size: 11px; letter-spacing: 2px; text-transform: uppercase; padding: 8px 10px; line-height: 1; border: 1px solid #3F4096; border-radius: 100px; font-weight: 700; }

.p-body{padding:18px 20px 20px}
.p-location{font-size:11px;color:var(--gold);letter-spacing:2px;text-transform:uppercase;margin-bottom:6px}
.p-name { font-size: 18px; color: #3F4096; line-height: 1.3; margin-bottom: 8px; font-weight: 500; }
.p-meta{display:flex;gap:16px;margin-top:14px;padding-top:14px;border-top:1px solid var(--border)}
.p-meta-item{font-size:11px;color:var(--muted)}
.p-meta-item strong{display:block;font-size:13px;color:var(--dark);font-weight:500;margin-top:2px}
.p-arrow{margin-left:auto;align-self:center;color:var(--gold);font-size:18px;transition:transform .2s}
.p-card:hover .p-arrow{transform:translateX(4px)}

/* colors */
.c1{background:#262018}.c2{background:#1A2430}.c3{background:#24201A}.c4{background:#1E1C28}.c5{background:#1A2420}.c6{background:#281E1A}
/* Tablet */
@media screen and (max-width: 991px) {
    .projects-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Mobile */
@media screen and (max-width: 480px) {
    .projects-grid {
        grid-template-columns: repeat(1, 1fr);
    }
}