.project-carousel{position:relative;padding-inline:58px}.carousel-controls{position:absolute;inset:0;display:flex;align-items:center;justify-content:space-between;pointer-events:none}
.carousel-button{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;padding:0;border:1px solid var(--line);background:var(--surface);color:var(--cyan);cursor:pointer;border-radius:50%;pointer-events:auto;z-index:2;transition:background .2s,color .2s,border-color .2s}.carousel-button::before{content:"";width:0;height:0;border-top:7px solid transparent;border-bottom:7px solid transparent}.carousel-button[data-carousel-prev]::before{border-right:10px solid currentColor;margin-right:3px}.carousel-button[data-carousel-next]::before{border-left:10px solid currentColor;margin-left:3px}
.carousel-button:hover:not(:disabled){background:var(--cyan);color:var(--bg)}
.carousel-button:disabled{opacity:.3;cursor:default}
.carousel-button:focus-visible,.project-carousel-track:focus-visible{outline:2px solid var(--cyan);outline-offset:4px}
.home-page .project-carousel-track{display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:0;padding-block:8px 20px;scrollbar-width:thin;scrollbar-color:var(--cyan) var(--surface)}
.home-page .project-carousel-track>.card{flex:0 0 calc((100% - 48px)/3);scroll-snap-align:start;animation:none}
.home-page .project-carousel-track .card-image{filter:none}
@media(max-width:1000px){.home-page .project-carousel-track>.card{flex-basis:calc((100% - 24px)/2)}}
@media(max-width:639px){.home-page .project-carousel-track>.card{flex-basis:100%}}

@media(max-width:639px){.project-carousel{padding-inline:48px}.home-page .project-carousel-track{gap:16px}}
