#lavori{position:relative;overflow:hidden}
#lavori .work-showcase-head{position:relative;z-index:1}
.portfolio-organizer{position:relative;margin:42px 0 46px;padding:30px;border:1px solid #dce6ef;background:linear-gradient(145deg,#f8fbfe,#eef5fb);box-shadow:0 22px 60px rgba(11,31,54,.08)}
.portfolio-organizer:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 92% 10%,rgba(21,108,211,.13),transparent 30%)}
.portfolio-organizer-head{position:relative;display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:22px}
.portfolio-organizer-head small{display:block;margin-bottom:8px;color:#156cd3;font-size:10px;font-weight:900;letter-spacing:.18em;text-transform:uppercase}
.portfolio-organizer-head h3{margin:0;color:#071827;font-size:clamp(27px,3vw,42px);line-height:1;letter-spacing:-.04em}
.portfolio-organizer-head p{max-width:470px;margin:0;color:#596c7d;line-height:1.55}
.portfolio-filters{position:relative;display:flex;gap:9px;margin-bottom:20px;overflow-x:auto;padding:2px 2px 8px;scrollbar-width:none}
.portfolio-filters::-webkit-scrollbar,.portfolio-rail::-webkit-scrollbar{display:none}
.portfolio-filter{flex:0 0 auto;border:1px solid #d5e0ea;border-radius:999px;padding:11px 17px;color:#102437;background:#fff;font:inherit;font-size:13px;font-weight:800;cursor:pointer;transition:.25s}
.portfolio-filter:hover{border-color:#8bbcf0;transform:translateY(-2px)}
.portfolio-filter.active{border-color:transparent;color:#fff;background:linear-gradient(135deg,#1975db,#084b9c);box-shadow:0 9px 24px rgba(18,104,213,.25)}
.portfolio-rail-wrap{position:relative;overflow:hidden}
.portfolio-rail{position:relative;display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding:2px 2px 16px;scrollbar-width:none}
.portfolio-project{position:relative;flex:0 0 min(340px,78vw);height:255px;overflow:hidden;border:1px solid rgba(7,24,39,.12);border-radius:18px;color:#fff;background:#071827;scroll-snap-align:center;cursor:pointer;box-shadow:0 12px 32px rgba(7,24,39,.11);transition:transform .35s,box-shadow .35s,border-color .35s}
.portfolio-project:hover,.portfolio-project.active{transform:translateY(-4px);border-color:#4ca2f1;box-shadow:0 22px 46px rgba(7,24,39,.2)}
.portfolio-project img{display:block;width:100%;height:100%;object-fit:contain;background:#071827;transition:transform .75s cubic-bezier(.2,.8,.2,1)}
.portfolio-project:hover img,.portfolio-project.active img{transform:scale(1.035)}
.portfolio-project:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 38%,rgba(2,11,19,.9) 100%)}
.portfolio-project-copy{position:absolute;z-index:2;left:18px;right:18px;bottom:17px;text-align:left}
.portfolio-project-copy small{display:block;margin-bottom:6px;color:#62b1ff;font-size:9px;font-weight:900;letter-spacing:.17em;text-transform:uppercase}
.portfolio-project-copy strong{display:block;font-size:20px;line-height:1.12;letter-spacing:-.02em}
.portfolio-number{position:absolute;z-index:2;top:14px;right:15px;display:grid;place-items:center;width:35px;height:35px;border:1px solid rgba(255,255,255,.35);border-radius:50%;background:rgba(3,15,25,.62);font-size:11px;font-weight:900}
.portfolio-progress{position:absolute;z-index:4;left:2px;right:2px;bottom:2px;height:3px;overflow:hidden;background:#dbe6ef}
.portfolio-progress span{display:block;width:0;height:100%;background:linear-gradient(90deg,#1268d5,#62b1ff)}
.portfolio-organizer.running .portfolio-progress span{animation:portfolioTimer 5s linear infinite}
@keyframes portfolioTimer{from{width:0}to{width:100%}}
.work-groups.portfolio-filtering>.work-group{animation:portfolioReveal .5s ease both}
.work-groups>.work-group.is-filtered-out{display:none!important}
@keyframes portfolioReveal{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.work-groups.organized .work-group{scroll-margin-top:120px}
.work-groups.organized .work-group-head{position:relative}
.work-groups.organized .work-group-head:after{content:"PROGETTO";position:absolute;right:0;top:0;color:rgba(12,37,57,.08);font-size:clamp(34px,6vw,84px);font-weight:950;letter-spacing:-.06em;pointer-events:none}
.eta-project-group .work-group-head:after{color:rgba(255,255,255,.055)}
@media(max-width:800px){.portfolio-organizer{margin-inline:-10px;padding:24px 16px}.portfolio-organizer-head{align-items:start;flex-direction:column}.portfolio-organizer-head p{font-size:14px}.portfolio-project{flex-basis:82vw;height:300px}}
@media(max-width:560px){.portfolio-organizer{margin:28px -20px 36px;border-left:0;border-right:0}.portfolio-organizer-head h3{font-size:30px}.portfolio-project{height:330px}.portfolio-project-copy strong{font-size:19px}}
@media(prefers-reduced-motion:reduce){.portfolio-organizer.running .portfolio-progress span{animation:none}.portfolio-project,.portfolio-project img,.work-groups.portfolio-filtering>.work-group{transition:none;animation:none}}