/* A complete, readable portfolio; filters enhance the static HTML. */
.portfolio{padding-block:96px;background:#161c17;border-bottom:1px solid var(--rule)}
.portfolio-heading{display:grid;grid-template-columns:1.4fr 1fr;gap:60px;align-items:end;margin-top:44px}
.portfolio-heading h2 em{color:var(--lime)}
.portfolio-heading p{font-size:14px;color:#b9c0b2;max-width:390px;line-height:1.8}
.portfolio-overview{display:flex;gap:38px;margin:38px 0 0;align-items:center}
.portfolio-total{display:flex;align-items:center;gap:14px;color:var(--lime)}
.portfolio-total strong{font-size:54px;line-height:1;font-weight:500;letter-spacing:-3px}
.portfolio-total span{font:9px/1.8 var(--mono);letter-spacing:1px;text-transform:uppercase;max-width:110px}
.portfolio-legend{border-left:1px solid #485140;padding-left:26px;font-size:12px;color:#9ea994;max-width:390px;line-height:1.8}
.portfolio-controls{margin-top:38px;border-top:1px solid #3b4537;border-bottom:1px solid #3b4537;padding:18px 0;display:flex;align-items:center;gap:24px;flex-wrap:wrap}
.portfolio-controls[hidden]{display:none}
.portfolio-filters{display:flex;gap:7px;flex-wrap:wrap;flex:1}
.portfolio-filter{background:none;border:1px solid transparent;padding:10px 13px;min-height:44px;font-size:12px;color:#c7cebf;border-radius:2px;transition:color .2s,background .2s,border-color .2s}
.portfolio-filter span{font:9px var(--mono);margin-left:6px;opacity:.7}
.portfolio-filter:hover{border-color:#6e7b5f}
.portfolio-filter[aria-pressed='true']{background:var(--lime);color:var(--ink);border-color:var(--lime)}
.portfolio-search{display:flex;gap:12px;align-items:center;border-bottom:1px solid #6a765d;min-width:200px;max-width:260px}
.portfolio-search svg{width:17px;height:17px;color:#a5b792;flex:none}
.portfolio-search input{font:13px var(--sans);color:var(--paper);background:transparent;border:0;outline-offset:3px;padding:12px 0;min-height:44px;width:100%;min-width:0}
.portfolio-search input::placeholder{color:#a9b39f}
.portfolio-search input:focus-visible{outline:2px solid var(--lime)}
.portfolio-results{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-top:22px;min-height:30px;font:9px/1.6 var(--mono);letter-spacing:.3px;color:#a8b49c}
.portfolio-reset{background:none;color:var(--paper);border:0;border-bottom:1px solid #6e7b5f;font:11px var(--sans);padding:8px 0;min-height:36px}
.portfolio-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin-top:15px;border-top:1px solid #3b4537;border-left:1px solid #3b4537}
.portfolio-card{position:relative;border-bottom:1px solid #3b4537;border-right:1px solid #3b4537;padding:28px 26px 23px;min-width:0;display:flex;flex-direction:column;min-height:270px;background:#161c17;transition:background .25s ease}
.portfolio-card[hidden]{display:none}
.portfolio-card:hover,.portfolio-card:focus-within{background:#1e281c}
.portfolio-card-top{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:24px}
.portfolio-mark{height:34px;min-width:34px;display:inline-flex;justify-content:center;align-items:center;color:var(--lime);font:15px var(--mono);letter-spacing:-1px;border:1px solid #596847;border-radius:50%;padding:0 5px}
.portfolio-card-number{font:9px var(--mono);letter-spacing:1px;color:#8f9d82}
.portfolio-category{font:8px/1.6 var(--mono);letter-spacing:.8px;text-transform:uppercase;color:#9caf8c;margin-bottom:7px}
.portfolio-card h3{font-size:25px;letter-spacing:-.8px;font-weight:500;line-height:1.25;margin-bottom:12px}
.portfolio-card p{font-size:12px;line-height:1.85;color:#bdc6b5;margin-bottom:24px}
.portfolio-card-footer{margin-top:auto;display:flex;justify-content:space-between;align-items:flex-end;gap:12px}
.portfolio-role{font:8px/1.7 var(--mono);color:#a7b69b;max-width:70%;letter-spacing:.2px}
.portfolio-visit{display:inline-flex;gap:8px;align-items:center;flex:none;font-size:10px;border-bottom:1px solid #7b8b6a;padding-block:4px;min-height:32px}
.portfolio-visit:hover{color:var(--lime);border-color:var(--lime)}
.portfolio-visit span{font-size:15px;transition:transform .2s}
.portfolio-visit:hover span{transform:translate(2px,-2px)}
.portfolio-note{display:inline-block;font:8px/1.7 var(--mono);color:#a8b49c;text-align:right;max-width:100px}
.portfolio-empty{padding:65px 20px;text-align:center;border-bottom:1px solid #3b4537;color:#b9c7ad;font-size:15px}
.portfolio-empty[hidden]{display:none}
.portfolio-end{margin-top:30px;display:flex;justify-content:space-between;align-items:center;gap:30px;font-size:12px;color:#a9b69d}
.portfolio-end p{max-width:550px;line-height:1.8}
.portfolio-end .line-link{flex:none;color:var(--paper)}
.work .section-heading p{max-width:360px}
@media(min-width:1550px){.portfolio-card{min-height:280px;padding:32px}}
@media(max-width:1100px){.portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.portfolio-heading{gap:35px}.portfolio-search{max-width:230px}.portfolio-filters{flex-basis:100%}.portfolio-card{min-height:260px}}
@media(max-width:760px){.portfolio{padding-block:64px}.portfolio-heading{grid-template-columns:1fr;gap:25px;margin-top:34px}.portfolio-heading p{font-size:14px;max-width:100%}.portfolio-overview{gap:22px;margin-top:30px}.portfolio-total strong{font-size:46px}.portfolio-total span{font-size:8px;max-width:80px}.portfolio-legend{font-size:11px;padding-left:18px}.portfolio-controls{gap:12px;margin-top:28px}.portfolio-filters{gap:5px}.portfolio-filter{font-size:11px;padding:9px 11px}.portfolio-search{max-width:none;flex-basis:100%}.portfolio-results{font-size:8px;align-items:flex-start}.portfolio-grid{grid-template-columns:1fr}.portfolio-card{padding:25px 23px;min-height:235px}.portfolio-card h3{font-size:27px}.portfolio-card p{font-size:13px}.portfolio-category{font-size:9px}.portfolio-role{font-size:9px}.portfolio-visit{font-size:12px;min-height:40px}.portfolio-mark{height:36px;min-width:36px}.portfolio-card-top{margin-bottom:20px}.portfolio-end{align-items:flex-start;flex-direction:column;gap:18px}.portfolio-end p{font-size:12px}}
@media print{.portfolio{padding:24px 0;background:white;color:black;break-before:page}.portfolio-heading{margin-top:18px;gap:20px}.portfolio-heading p,.portfolio-card p{color:#333}.portfolio-heading h2 em{color:black}.portfolio-controls,.portfolio-results,.portfolio-overview,.portfolio-end,.portfolio-card-top,.portfolio-empty{display:none!important}.portfolio-grid{display:grid;grid-template-columns:1fr 1fr;border:0;gap:12px 24px}.portfolio-card,.portfolio-card[hidden]{display:flex;min-height:0;background:white;color:black;padding:12px 0;border:0;border-top:1px solid #aaa;break-inside:avoid}.portfolio-card h3{font-size:14pt;letter-spacing:-.3px;margin-bottom:7px}.portfolio-card p{font-size:9pt;margin-bottom:8px}.portfolio-category,.portfolio-role,.portfolio-note{color:#444;font-size:7pt}.portfolio-visit{display:none}.portfolio-card-footer{margin-top:0}}
