.works{position:relative;width:100dvw;height:100dvh;display:flex;flex-direction:column;justify-content:center;align-items:center;overflow:hidden}.works:before{content:"";position:absolute;top:0;left:0;width:110%;height:110%;background:url(/assets/images/5.jpg) no-repeat 50% 50%;background-size:cover;background-color:transparent;filter:blur(10px) brightness(.8);opacity:.5;transform:scale(1.1);z-index:-1}.initial{font-size:5dvw;font-weight:400;color:#fff;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);opacity:1;z-index:2}.section p{font-size:1.2rem;color:#ccc}.section{font-family:var(--font-montserrat),sans-serif;display:flex;flex-direction:column;align-items:center;max-width:1400px;width:80dvw;height:80dvh;padding-top:calc(2em + clamp(1.5rem, 2.5vw, 3rem));margin-top:4em;overflow-y:auto;overflow-x:hidden;scrollbar-width:none;-ms-overflow-style:none}.section::-webkit-scrollbar{display:none}.service-detail{scrollbar-width:none;-ms-overflow-style:none}.service-detail::-webkit-scrollbar{display:none}.section h1{font-size:4dvw;font-weight:700;color:#fff}.section-title{font-size:clamp(3rem,5vw,8rem);font-weight:700;color:#fff;text-align:left;padding:1.5rem;width:100%}.section-content{display:flex;flex-direction:row;justify-content:flex-start;align-items:flex-start;gap:4em;max-width:1400px;width:100%;padding:1.5rem}.section-text{flex:1 1;max-width:800px;text-align:left;justify-content:flex-start}.section-text p{font-size:1.8rem;color:#ccc;line-height:2}.section-image{flex:0 0 auto;display:flex;justify-content:center;align-items:center;position:relative;height:auto;max-width:60%}.section-image img{width:100%;height:auto;object-fit:cover;border-radius:12px;border:none;box-shadow:none}.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(400px,1fr));grid-gap:2rem;gap:2rem;padding-top:2rem;width:100%;margin:0 auto}.card{background-color:#f5f5f5;border-radius:8px;padding:1.5rem;text-align:center;box-shadow:0 4px 6px rgba(0,0,0,.1);transition:transform .3s ease,box-shadow .3s ease}.card:hover{transform:translateY(-5px);box-shadow:0 6px 10px rgba(0,0,0,.15)}.card h3{font-size:1.5rem;margin-bottom:.5rem}.card p{font-size:1rem;color:#666}.service-detail{width:80dvw;max-width:1400px}.service-detail-header{.category-tabs{display:flex;flex-wrap:wrap;gap:1rem;margin-bottom:2rem;width:100%;padding:0 1.5rem}.category-tab{background:rgba(255,255,255,.1);border:none;border-radius:25px;color:#fff;cursor:pointer;font-family:var(--font-montserrat),sans-serif;font-size:clamp(.85rem,1.1vw,1.1rem);padding:.6rem 1.5rem;transition:all .3s ease}.category-tab.allworks{background:rgba(63,113,167,.869)!important}.category-tab.active{background:#4299ea;box-shadow:0 4px 10px rgba(66,153,234,.3)}.category-tab:hover{background:rgba(66,153,234,.7);transform:translateY(-2px)}.work-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));grid-gap:2.5rem;gap:2.5rem;width:100%}.work-card{background:rgba(0,0,0,.3);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:12px;overflow:hidden;box-shadow:0 6px 15px rgba(0,0,0,.2);transition:all .4s ease;height:280px}.work-card.expanded{grid-column:1/-1;height:auto;min-height:480px}.work-card-preview{position:relative;height:100%;display:flex;flex-direction:column;cursor:pointer}.work-thumbnail{width:100%;height:180px;object-fit:cover}.work-info{padding:1.2rem;display:flex;flex-direction:column;flex-grow:1}.work-title{font-size:1.2rem;color:#fff;margin:0 0 .5rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.work-artist{font-size:.9rem;color:#ccc;margin:0 0 .8rem}.work-platform{display:flex;align-items:center;gap:.5rem;font-size:.8rem;color:#aaa}.platform-icon{width:20px;height:20px;background-size:contain;background-repeat:no-repeat;background-position:50%}.expand-button{position:absolute;bottom:1rem;right:1rem;width:30px;height:30px;border-radius:50%;background:rgba(66,153,234,.7);display:flex;align-items:center;justify-content:center;transition:all .3s ease}.expand-icon{color:#fff;font-size:1.2rem;line-height:1}.work-card-preview:hover .expand-button{background:#4299ea;transform:scale(1.1)}.work-card-expanded{height:100%;display:grid;grid-template-columns:1fr;grid-template-rows:auto auto}.embed-container{position:relative;padding-bottom:56.25%;height:0;overflow:hidden;width:100%}.embed-container iframe{position:absolute;top:0;left:0;width:100%;height:100%}.soundcloud-container{padding-bottom:180px}.work-expanded-info{padding:1.5rem;display:flex;flex-direction:column;gap:.8rem}.work-link{color:#4299ea;text-decoration:none;font-size:.9rem}.work-link:hover{text-decoration:underline}.collapse-button{align-self:flex-end;background:rgba(255,255,255,.2);color:#fff;border:none;border-radius:25px;padding:.5rem 1.2rem;font-family:var(--font-montserrat),sans-serif;cursor:pointer;transition:all .3s ease}.collapse-button:hover{background:rgba(255,255,255,.3);transform:translateY(-2px)}@media (max-width:1024px){.work-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.5rem}}@media (max-width:768px){.work-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}.category-tabs{justify-content:flex-start;overflow-x:auto;padding-bottom:1rem;-webkit-overflow-scrolling:touch}.category-tab{flex:0 0 auto}}@media (max-width:480px){.work-grid{grid-template-columns:1fr}.work-card{height:250px}}width:100%;display:flex;flex-direction:column;align-items:flex-start}.back-button{background:rgba(0,0,0,.1);border:none;border-radius:25px;color:#fff;font-size:clamp(.9rem,1.2vw,1.1rem);font-family:var(--font-montserrat),sans-serif;cursor:pointer;padding-top:.4rem;padding-left:1.5rem;margin-bottom:1.5rem;display:flex;align-items:center;gap:.5rem;transition:all .3s ease;box-shadow:0 2px 5px rgba(0,0,0,.1);align-self:flex-start}.back-button:hover{transform:translateX(5px);box-shadow:0 4px 8px rgba(0,0,0,.15)}.back-icon{font-size:1.2em;display:inline-block}.explore-button{display:inline-flex;align-items:center;gap:.8rem;background-color:#4299ea;color:white;font-family:var(--font-montserrat),sans-serif;font-size:clamp(1rem,1.5vw,1.2rem);font-weight:500;padding:.8rem 1.8rem;border-radius:25px;cursor:pointer;transition:all .3s ease;text-decoration:none;margin-top:1rem;box-shadow:0 4px 10px rgba(66,153,234,.3);align-self:flex-start}.explore-button:hover{background-color:#2f7fd0;transform:translateY(-3px);box-shadow:0 6px 12px rgba(66,153,234,.4)}.arrow-icon{font-size:1.2em;transition:transform .3s ease}.explore-button:hover .arrow-icon{transform:translateX(5px)}.section-text{display:flex;flex-direction:column;gap:1.5em}@media (max-width:1024px){.section-content{gap:2em}.service-detail .section-content{flex-direction:column;align-items:center}.service-detail .section-image{max-width:100%;margin-top:2rem}}@media (max-width:768px){.card-grid{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.section-text p{font-size:clamp(1rem,3vw,1.8rem);line-height:1.6}}@media (max-width:480px){.section{width:90dvw;padding-top:calc(1em + clamp(1rem, 2vw, 2rem))}.card-grid{grid-template-columns:1fr;gap:1rem}}.work-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));grid-gap:2rem;gap:2rem;width:100%}.work-card{background:rgba(0,0,0,.3);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:12px;overflow:hidden;box-shadow:0 6px 15px rgba(0,0,0,.2);transition:all .4s ease;height:100%}.work-card,.work-card-content{display:flex;flex-direction:column}.work-card-content{flex:1 1}.embed-container{position:relative;padding-bottom:56.25%;height:0;overflow:hidden;width:100%;background-color:rgba(0,0,0,.2);border-radius:8px 8px 0 0;flex-grow:1}.embed-container iframe{position:absolute;top:0;left:0;width:100%;height:100%;transition:opacity .3s ease}.bandcamp-container,.soundcloud-container,.spotify-container{padding-bottom:180px}.loading-indicator{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;background-color:rgba(0,0,0,.2);z-index:1}.spinner{width:50px;height:50px;border:4px solid rgba(255,255,255,.2);border-top-color:#4299ea;border-radius:50%;animation:spin 1s ease-in-out infinite}@keyframes spin{to{transform:rotate(1turn)}}.no-embed-container{position:relative;width:100%;padding-bottom:56.25%;overflow:hidden;border-radius:8px 8px 0 0}.embed-error{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:1.5rem}.embed-error,.work-thumbnail{top:0;left:0;width:100%;height:100%}.work-thumbnail{position:absolute;object-fit:cover}.work-info{padding:1.2rem;display:flex;flex-direction:column;gap:.5rem;background-color:rgba(0,0,0,.3);border-radius:0 0 8px 8px;height:auto;flex-grow:0;margin-top:auto}.work-title{font-size:1.2rem;color:#fff;margin:0}.work-artist{font-size:.9rem;color:#ccc;margin:0}.work-comment{font-size:.9rem;color:#8b8b8b;margin:0}.work-link{color:#4299ea;text-decoration:none;font-size:.9rem;transition:color .3s ease;margin-top:.5rem}.work-link:hover{color:#66b0f0;text-decoration:underline}.category-tabs{display:flex;flex-wrap:wrap;gap:1rem;margin-bottom:2rem;width:100%;padding:0 1.5rem}.category-tab{background:rgba(255,255,255,.1);border:none;border-radius:25px;color:#fff;cursor:pointer;font-family:var(--font-montserrat),sans-serif;font-size:clamp(.85rem,1.1vw,1.1rem);padding:.6rem 1.5rem;transition:all .3s ease}.category-tab.allworks{font-weight:600;background:rgba(255,255,255,.1)}.category-tab.active{background:#4299ea;box-shadow:0 4px 10px rgba(66,153,234,.3)}.category-tab:hover{background:rgba(66,153,234,.7);transform:translateY(-2px)}@media (max-width:1024px){.work-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.5rem}}@media (max-width:768px){.work-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}.category-tabs{flex-direction:column;align-items:flex-start;gap:.75rem;margin-bottom:1.5rem}.category-tab{width:100%;text-align:left;padding:.5rem 1.25rem;font-size:clamp(.8rem,3.5vw,1rem)}.bandcamp-container,.embed-container,.soundcloud-container,.spotify-container{padding-bottom:56.25%}}@media (max-width:480px){.work-grid{grid-template-columns:1fr}.category-tabs{padding:0 1rem;gap:.5rem}.category-tab{padding:.4rem 1rem;border-radius:20px}}.category-loading{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4rem 0}.category-loading p{color:#ccc;margin-top:1rem;font-size:1.2rem}