.skills-accordion-wrapper{max-width:1200px;margin:0 auto;display:flex;flex-wrap:wrap;gap:20px;align-items:stretch}.skill-accordion-item{border:1px solid color-mix(in srgb,var(--body-color) 15%,transparent);border-radius:8px;overflow:hidden;flex:0 0 calc(33.3333% - 16px);width:calc(33.3333% - 16px);transition:flex 1s cubic-bezier(.23,1,.32,1) .2s,width 1s cubic-bezier(.23,1,.32,1) .2s,transform .4s ease-out .2s,opacity .4s ease-out .2s,box-shadow .4s ease-out .2s;display:flex;flex-direction:column;position:relative}.skill-accordion-item:hover{border-color:rgba(5,117,230,.3)}.skills-accordion-wrapper:has(.skill-accordion-item.active) .skill-accordion-item:not(.active){transform:scale(.85);opacity:.5;transition:transform .3s ease-out,opacity .3s ease-out}.skill-accordion-item.active{flex:0 0 100%;width:100%;transform:scale(1);opacity:1;z-index:1;box-shadow:0 20px 60px rgba(36,114,252,.3);transition:flex 1.5s cubic-bezier(.16,1,.3,1) 0s,width 1.5s cubic-bezier(.16,1,.3,1) 0s,transform .5s cubic-bezier(.34,1.56,.64,1),opacity .3s ease-out,box-shadow .5s ease-out}.skill-accordion-trigger{position:relative;display:flex;align-items:center;justify-content:space-between;padding:25px 30px;cursor:none;background:hsla(0,0%,100%,.02);transition:all .3s ease;flex:1}button.skill-accordion-trigger{border:none;font:inherit;color:inherit;text-align:left;width:100%}.skill-accordion-trigger:hover{background:hsla(0,0%,100%,.05)}.skill-accordion-item.active .skill-accordion-trigger{background:linear-gradient(135deg,var(--primary-color),var(--secondary-color))}.skill-accordion-item.active .skill-accordion-trigger .skill-title{color:#fff}.skill-trigger-left{gap:20px;overflow:visible}.skill-icon-container,.skill-trigger-left{display:flex;align-items:center;position:relative}.skill-icon-container{width:50px;height:50px;justify-content:center}.skill-icon-base{font-size:28px;color:var(--title-color);transition:all .3s ease}.skill-accordion-item.active .skill-icon-base{color:#fff}.skill-icon-overlay{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(0);font-size:40px;color:var(--primary-color);opacity:0;transition:all .4s cubic-bezier(.68,-.55,.265,1.55);pointer-events:none}.skill-accordion-trigger:hover .skill-icon-overlay{transform:translate(-50%,-50%) scale(1);opacity:1}.skill-accordion-item.active .skill-accordion-trigger:hover .skill-icon-overlay{color:#fff}.skill-accordion-trigger:hover .skill-icon-base{transform:scale(.8);opacity:0}.skill-title{font-size:20px;font-weight:700;color:var(--title-color);margin:0;transition:color .3s ease}.skill-arrow{color:var(--body-color);transition:all .3s ease;flex-shrink:0}.skill-accordion-item.active .skill-arrow{transform:rotate(90deg);color:#fff}.skill-accordion-content{display:grid;grid-template-rows:0fr;overflow:hidden;transition:grid-template-rows 1.2s cubic-bezier(.16,1,.3,1) 0s;background:transparent}.skill-accordion-item.active .skill-accordion-content{grid-template-rows:1fr;transition:grid-template-rows 1.5s cubic-bezier(.16,1,.3,1) 0s}.skill-accordion-content>div{min-height:0;padding:0 30px;transition:padding 1.2s ease-out 0s}.skill-accordion-item.active .skill-accordion-content>div{padding:30px;transition:padding 1.5s ease-out 0s}.skill-accordion-inner{opacity:0;transform:translateY(10px);transition:opacity .6s ease-out 0s,transform .6s ease-out 0s}.skill-accordion-item.active .skill-accordion-inner{opacity:1;transform:translateY(0);transition:opacity .8s ease-out .5s,transform .8s ease-out .5s}.skill-accordion-inner .skill-description{margin-bottom:30px;color:var(--body-color);font-size:18px;line-height:1.8;font-weight:400}.skill-accordion-inner ul{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:15px}.skill-accordion-inner ul li{display:flex;align-items:center;gap:12px;padding:12px 15px;background:hsla(0,0%,100%,.03);border-radius:6px;transition:all .3s ease}.skill-accordion-inner ul li:hover{background:hsla(0,0%,100%,.08);transform:translateX(5px)}.skill-accordion-inner ul li img{width:40px;height:40px;object-fit:contain;flex-shrink:0;filter:brightness(0);transition:filter .3s ease}body.dark-mode .skill-accordion-inner ul li img{filter:brightness(0) invert(1)}.skill-accordion-inner ul li span{font-size:14px;line-height:1.4;color:var(--body-color)}@media (max-width:959px){.skill-accordion-item{flex:0 0 calc(50% - 12px);width:50%}}@media (max-width:768px){.skills-accordion-wrapper{max-width:100%}.skill-accordion-trigger{padding:20px}.skill-title{font-size:18px}.skill-accordion-item.active .skill-accordion-content{padding:20px}.skill-accordion-inner ul{grid-template-columns:1fr}}@media (max-width:639px){.skill-accordion-item{flex:0 0 calc(100% - 0px);width:calc(100% - 0px)}}.skill-accordion-trigger:focus-visible{outline:3px solid var(--primary-color);outline-offset:2px}