.portfolio-gallery{background:#f6f6f3;padding:clamp(58px,7vw,105px) 0;color:#101010}
.portfolio-gallery-full{background:#fff}
.portfolio-heading{display:flex;align-items:end;justify-content:space-between;gap:32px;margin-bottom:34px}
.portfolio-heading>div{max-width:790px}
.portfolio-heading .subpage-kicker{color:#617000;margin-bottom:12px}
.portfolio-heading h2{font:400 clamp(43px,5.4vw,78px)/.98 'Sedgwick Ave Display',Impact,cursive;font-synthesis-weight:none;text-transform:uppercase;letter-spacing:-.04em;margin:0 0 19px}
.portfolio-heading h2 em{position:relative;isolation:isolate;font-style:normal;white-space:nowrap}
.portfolio-heading h2 em::before{content:"";position:absolute;z-index:-1;inset:43% -.07em -.02em;background:var(--lime);clip-path:polygon(0 16%,8% 2%,19% 13%,30% 0,43% 13%,55% 1%,69% 11%,81% 0,100% 18%,96% 100%,83% 88%,69% 100%,53% 89%,40% 100%,25% 88%,9% 100%);transform:rotate(-2deg)}
.portfolio-heading p{font-size:clamp(16px,1.65vw,20px);line-height:1.5;margin:0;max-width:720px}
.portfolio-all{flex:none;display:inline-flex;align-items:center;gap:22px;background:#111;color:#fff;padding:15px 18px;border-radius:9px;font:700 17px/1 'Asap Condensed',Arial,sans-serif;text-transform:uppercase;transition:transform .2s,background .2s}
.portfolio-all span{color:var(--lime);font-size:26px}
.portfolio-all:hover,.portfolio-all:focus-visible{background:#333;transform:translateY(-3px)}
.portfolio-controls{display:grid;grid-template-columns:minmax(0,1fr) minmax(210px,255px);gap:26px;align-items:end;padding:22px 0 18px;border-top:2px solid #111;border-bottom:1px solid #d6d6d6}
.portfolio-groups{display:flex;flex-wrap:wrap;gap:8px}
.portfolio-groups button{cursor:pointer;border:1px solid #151515;background:#fff;color:#111;border-radius:7px;padding:11px 15px;font:700 16px/1 'Asap Condensed',Arial,sans-serif;text-transform:uppercase;transition:background .2s,color .2s,transform .2s}
.portfolio-groups button:hover{transform:translateY(-2px)}
.portfolio-groups button.is-active{background:#111;color:var(--lime)}
.portfolio-category-label{display:block;font:700 13px/1.3 'Asap Condensed',Arial,sans-serif;text-transform:uppercase;letter-spacing:.08em}
.portfolio-category-label select{display:block;margin-top:7px;width:100%;min-height:43px;border:1px solid #555;border-radius:7px;background:#fff;padding:7px 12px;font:600 16px 'Asap Condensed',Arial,sans-serif;color:#111}
.portfolio-count{font:700 15px 'Asap Condensed',Arial,sans-serif;color:#515151;text-transform:uppercase;margin:22px 0 15px}
.portfolio-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.portfolio-card{min-width:0;background:#fff;box-shadow:0 8px 23px #0000000e;overflow:hidden;transition:transform .25s,box-shadow .25s}
.portfolio-card:hover{transform:translateY(-5px);box-shadow:0 14px 30px #0000001c}
.portfolio-card[hidden]{display:none!important}
.portfolio-image{display:block;position:relative;width:100%;aspect-ratio:4/3;padding:0;border:0;background:#e9e9e9;overflow:hidden;text-align:left}
.portfolio-image img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s}
.portfolio-card:hover .portfolio-image img{transform:scale(1.05)}
.portfolio-zoom{position:absolute;right:12px;bottom:12px;width:34px;height:34px;border-radius:7px;background:var(--lime);color:#111;display:grid;place-items:center;font-size:24px;font-weight:700}
.portfolio-card-caption{padding:16px 17px 19px;border-top:5px solid var(--lime)}
.portfolio-card-caption span{display:block;color:#616161;font:700 12px 'Asap Condensed',Arial,sans-serif;text-transform:uppercase;letter-spacing:.09em;margin-bottom:6px}
.portfolio-card-caption h3{font:700 clamp(18px,1.7vw,24px)/1.08 'Asap Condensed',Arial,sans-serif;text-transform:uppercase;margin:0}
.portfolio-card-caption h3 a:hover,.portfolio-card-caption h3 a:focus-visible{background:var(--lime)}
.portfolio-card-caption p{font-size:14px;line-height:1.45;color:#414141;margin:11px 0 16px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.portfolio-read{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;font:700 15px 'Asap Condensed',Arial,sans-serif;text-transform:uppercase;border-bottom:2px solid var(--lime);padding-bottom:2px}
.portfolio-card-caption .portfolio-read span{display:inline;margin:0;color:inherit;font-size:20px;line-height:1;letter-spacing:normal}
.portfolio-demo-note{font-size:13px;line-height:1.5;color:#575757;margin:25px 0 0;max-width:850px}
.portfolio-empty{padding:35px 25px;background:#f3f3f3;font-size:18px}
.portfolio-gallery-preview .portfolio-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.portfolio-groups button:focus-visible,.portfolio-category-label select:focus-visible,.portfolio-image:focus-visible,.portfolio-read:focus-visible{outline:3px solid #1c66e5;outline-offset:3px}
.portfolio-article-main{background:#fff}
.portfolio-article-header{padding-top:70px;padding-bottom:42px}
.portfolio-back{font:700 16px 'Asap Condensed',Arial,sans-serif;text-transform:uppercase;border-bottom:2px solid var(--lime)}
.portfolio-article-header .subpage-kicker{display:block;margin:40px 0 14px;color:#687600}
.portfolio-article-header h1{font:400 clamp(48px,6vw,92px)/.98 'Sedgwick Ave Display',Impact,cursive;font-synthesis-weight:none;text-transform:uppercase;letter-spacing:-.04em;max-width:1050px;margin:0 0 25px}
.portfolio-article-lead{font:700 clamp(23px,2.5vw,34px)/1.25 'Asap Condensed',Arial,sans-serif;max-width:900px;margin:0}
.portfolio-article-image{position:relative;max-width:1400px;margin:0 auto;background:#111}
.portfolio-article-image img{display:block;width:100%;max-height:780px;object-fit:cover}
.portfolio-article-image figcaption{position:absolute;bottom:15px;right:20px;background:#111;color:#fff;padding:7px 10px;font:700 13px 'Asap Condensed',Arial,sans-serif;text-transform:uppercase}
.portfolio-article-body{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:clamp(40px,7vw,120px);padding-top:55px;padding-bottom:95px}
.portfolio-article-copy{max-width:760px;font-size:19px;line-height:1.65}
.portfolio-article-copy p:first-child{font-size:23px;font-weight:700;line-height:1.45}
.portfolio-article-copy h2{font:400 clamp(32px,3.5vw,50px)/1.05 'Sedgwick Ave Display',Impact,cursive;font-synthesis-weight:none;text-transform:uppercase;margin:42px 0 18px}
.portfolio-article-aside{align-self:start;border-top:7px solid var(--lime);padding-top:23px}
.portfolio-article-aside .subpage-kicker{color:#687600;margin-bottom:12px}
.portfolio-article-tags{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:30px}
.portfolio-article-tags a{padding:8px 10px;background:#f0f0ed;border-radius:4px;font:700 13px 'Asap Condensed',Arial,sans-serif;text-transform:uppercase}
.portfolio-article-tags a:hover{background:var(--lime)}
.portfolio-article-aside .button{display:inline-flex;font-size:15px}
@media(max-width:1100px){.portfolio-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.portfolio-controls{grid-template-columns:1fr}.portfolio-category-label{max-width:330px}}
@media(max-width:760px){.portfolio-article-body{grid-template-columns:1fr;padding-top:35px;padding-bottom:65px}.portfolio-article-header{padding-top:42px}.portfolio-article-header h1{font-size:clamp(44px,10vw,68px)}.portfolio-article-image img{max-height:500px}.portfolio-article-aside{max-width:420px}}
@media(max-width:760px){.portfolio-heading{display:block}.portfolio-heading h2{font-size:clamp(40px,10vw,65px)}.portfolio-heading h2 em{white-space:normal}.portfolio-all{margin-top:22px}.portfolio-grid,.portfolio-gallery-preview .portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.portfolio-card-caption{padding:11px 12px 14px}.portfolio-card-caption h3{font-size:18px}.portfolio-card-caption span{font-size:10px}.portfolio-groups{flex-wrap:nowrap;overflow-x:auto;padding:3px 0 9px;scrollbar-width:thin}.portfolio-groups button{flex:none}.portfolio-image{aspect-ratio:1}.portfolio-gallery{padding:55px 0}}
@media(max-width:450px){.portfolio-grid,.portfolio-gallery-preview .portfolio-grid{grid-template-columns:1fr}.portfolio-image{aspect-ratio:4/3}}
