/* Filtered example work; no fabricated project statistics. */
.portfolio-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 28px; }
.portfolio-filter { display: flex; flex-wrap: wrap; gap: 9px; }
.filter-chip { min-height: 42px; padding: 10px 18px; border: 1px solid #e0e8f2; border-radius: 9px; color: #58718b; background: #f8fafd; font-size: 11px; font-weight: 600; cursor: pointer; transition: background .2s ease,color .2s ease,border-color .2s ease; }
.filter-chip:hover { border-color: #bcd0e8; background: #edf4fd; }
.filter-chip.is-active { border-color: #183c5b; color: #fff; background: #183c5b; }
.project-count { flex: 0 0 auto; color: #74899d; font-size: 10px; }
.portfolio-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 23px; }
.project-card { min-width: 0; overflow: hidden; border: 1px solid #e2eaf3; border-radius: 18px; background: #fff; box-shadow: 0 8px 24px rgba(35,67,105,.025); transition: transform .25s ease,box-shadow .25s ease; }
.project-card:hover { transform: translateY(-4px); box-shadow: 0 15px 32px rgba(35,67,105,.08); }
.portfolio-image { position: relative; height: 247px; overflow: hidden; background: #d8e5f2; }
.portfolio-image > img { width: 100%; height: 100%; object-fit: cover; object-position: 65% center; transition: transform .4s ease; }
.project-card:hover .portfolio-image > img { transform: scale(1.035); }
.image-badge { position: absolute; bottom: 15px; left: 15px; padding: 6px 11px; border: 1px solid rgba(255,255,255,.75); border-radius: 7px; color: #274969; background: #f1f7fd; font-size: 9px; font-weight: 600; }
.portfolio-copy { padding: 24px 23px 26px; }
.portfolio-index { color: #6684a2; font-size: 7px; font-weight: 600; letter-spacing: 1px; }
.portfolio-copy h3 { margin: 13px 0 11px; font-size: 21px; letter-spacing: -.6px; }
.portfolio-copy > p { color: #677e93; font-size: 12px; line-height: 1.95; }
.portfolio-copy > .action-link { margin-top: 22px; font-size: 11px; }
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) { .image-badge { background: rgba(246,251,255,.85); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); } }
@media(max-width:1000px) { .portfolio-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; } .portfolio-toolbar { align-items: flex-start; } .project-count { padding-top: 12px; } .portfolio-image { height: 255px; } }
@media(max-width:760px) { .portfolio-toolbar { flex-direction: column; gap: 15px; } .project-count { padding: 0; } .filter-chip { padding-inline: 14px; font-size: 10px; } .portfolio-grid { gap: 17px; } .portfolio-image { height: 230px; } .portfolio-copy { padding: 21px 19px; } .portfolio-copy h3 { font-size: 18px; } }
@media(max-width:580px) { .portfolio-grid { grid-template-columns: minmax(0,1fr); } .portfolio-image { height: 270px; } .portfolio-copy { padding: 24px; } .portfolio-copy h3 { font-size: 22px; } .portfolio-copy > p { font-size: 13px; } }

.portfolio-search { display:flex; flex-direction:column; gap:6px; width:min(100%,310px); }
.portfolio-search label { color:#77899b; font-size:10px; font-weight:700; }
.portfolio-search input { min-height:42px; width:100%; padding:0 13px; border:1px solid #dfe7ef; border-radius:9px; background:#fff; color:#2c4258; font:inherit; font-size:12px; outline:none; }
.portfolio-search input:focus { border-color:#86afd5; box-shadow:0 0 0 3px rgba(61,126,181,.12); }
.portfolio-card-link { display:block; color:inherit; text-decoration:none; }
.portfolio-card-link:focus-visible { outline:3px solid #7daed8; outline-offset:4px; border-radius:12px; }
.portfolio-card-footer { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:0 25px 23px; }
.portfolio-card-footer .action-link { margin:0; }
.portfolio-contact-link { color:#2f6fa7; font-size:11px; font-weight:800; text-decoration:none; }
.portfolio-grid [hidden] { display:none !important; }
@media(max-width:760px) { .portfolio-search { width:100%; } .portfolio-card-footer { padding:0 19px 20px; } }