.portfolio-container{margin-top:100px;margin-bottom:100px}section.custom-spacer{margin:50px
auto}.accordion-content{display:flex;width:100%;gap:0}.accordion-content
section{position:relative;display:flex;border:1px
solid #D9D9D9;color:#333;background-color:transparent;overflow:hidden;margin:0;margin-right:-1px;max-height:650px}.accordion-content section:not(.active){width:auto;flex:1}.accordion-content .tab-button{position:relative;width:100%;display:flex;align-items:end;justify-content:center;background-color:transparent;border-right:1px solid #D9D9D9;z-index:2;cursor:pointer}.accordion-content .tab-button
p{transform:rotate(-90deg);transform-origin:center center;white-space:nowrap;font-size:30px;font-weight:500;color:#000;text-align:center;margin-bottom:70%}.accordion-content .tab-container{flex-grow:1;transition:opacity 0.7s ease}.accordion-content section:not(.active) .tab-container{width:0;opacity:0;visibility:hidden}.accordion-content
section.active{width:60%;background-color:transparent;z-index:1}.accordion-content section.active .tab-button{width:14%;background-color:transparent}.accordion-content section.active .tab-container{padding:20px;opacity:1;visibility:visible;width:calc(100% - 120px)}.accordion-content .tab-title{font-size:24px;margin-top:0;margin-bottom:15px;color:#333}.accordion-content .tab-content{display:flex;gap:15px;justify-content:space-between;animation:fadeIn 0.8s ease;height:100%}.accordion-content .tab-content .right-content
img{width:100%;height:100%;object-fit:contain;object-position:center}@keyframes
fadeIn{from{opacity:0}to{opacity:1}}.accordion-content .tab-content .left-content,
.accordion-content .tab-content .right-content{width:50%}.accordion-content .accordion-trigger{display:block;text-decoration:none;color:inherit;width:100%}.accordion-content section:not(.active):hover .tab-button{background-color:rgba(240, 240, 240, 0.3)}.accordion-content section.active .tab-button:hover{background-color:rgba(232, 232, 232, 0.3)}.accordion-content .tab-container{transition:opacity 0.7s ease}.accordion-content
section{transition:width 0.6s ease}.accordion-content section.active p.accordion-trigger{margin-bottom:120px;transition:all 0.5s ease}.accordion-content section.active .tab-button:after{content:'';display:block;width:100%;aspect-ratio:1 / 1;position:absolute;top:0;left:0;background:#DFD6D3}@media (max-width: 992px){.accordion-content section.active p.accordion-trigger{margin-bottom:initial}.accordion-content section.active .tab-button:after{display:none}.accordion-content{flex-direction:column}.accordion-content
section{margin-right:0;margin-bottom:-1px;max-height:initial}.accordion-content section:not(.active){width:100%;height:90px;flex:unset}.accordion-content .tab-button
p{transform:rotate(0deg);margin-bottom:0;font-size:20px}.accordion-content .tab-button{align-items:center}.accordion-content
section.active{width:100%;flex-direction:column}.accordion-content section.active .tab-button{width:100%;min-height:60px}.accordion-content section.active .tab-container{width:100%}.accordion-content .tab-content{flex-direction:column}.accordion-content .tab-content .left-content,
.accordion-content .tab-content .right-content{width:100%}}.portfolio-inner{display:grid;grid-template-columns:repeat(5, 1fr);gap:20px;margin-top:30px}.portfolio-item{transition:opacity 0.5s ease;margin-bottom:25px}.portfolio-item.hidden{display:none;opacity:0;pointer-events:none}.portfolio-image-container{overflow:hidden;margin-bottom:10px;border:1px
solid #D9D9D9}.portfolio-image-container
img{width:100%;height:270px;object-fit:cover;transform:scale(0.85);transition:transform 0.5s ease}.portfolio-title{font-size:14px;color:#333;margin:10px
0;text-align:center}.portfolio-link:hover .portfolio-image-container
img{transform:scale(1);transition:transform 0.5s ease}@media (max-width: 1200px){.portfolio-inner{grid-template-columns:repeat(4, 1fr)}}@media (max-width: 992px){.portfolio-inner{grid-template-columns:repeat(3, 1fr)}.buttons-group{justify-content:center;margin-top:20px}}@media (max-width: 768px){.portfolio-inner{grid-template-columns:repeat(2, 1fr)}}@media (max-width: 576px){.portfolio-inner{grid-template-columns:1fr}}