@import "https://fonts.googleapis.com/css2?family=Orbitron:wght@700&family=Inter:wght@300;400;800&display=swap";
*{box-sizing:border-box;scroll-behavior:smooth;margin:0;padding:0}body{color:#fff;background-color:#000;font-family:Inter,sans-serif;display:flex}.sidebar{z-index:10;border-right:1px solid #111;flex-direction:column;justify-content:space-between;width:250px;height:100vh;padding:40px;display:flex;position:fixed;top:0;left:0}.logo{text-transform:uppercase;text-shadow:2px 2px #b533ff;font-family:Orbitron,sans-serif;font-size:3.5rem}.nav-links{flex-direction:column;gap:20px;display:flex}.nav-links a{color:#666;text-transform:uppercase;letter-spacing:2px;font-size:.85rem;font-weight:800;text-decoration:none;transition:color .3s}.nav-links a:hover{color:#fff}.content-area{width:calc(100% - 250px);margin-left:250px}section{z-index:2;background-color:#0000;border-bottom:1px solid #111;align-items:center;min-height:100vh;padding:80px 10%;display:flex;position:relative}#inicio{perspective:1200px;z-index:1;justify-content:center;overflow:hidden}#inicio:after{content:"";z-index:10;pointer-events:none;background:linear-gradient(#0000 0%,#000 100%);width:100%;height:25vh;position:absolute;bottom:0;left:0}.parallax-container{will-change:transform;justify-content:center;width:100%;display:flex}.hologram-container{width:100%;max-width:450px;animation:6s ease-in-out infinite floating}@keyframes floating{0%{transform:translateY(0)}50%{transform:translateY(-20px)}to{transform:translateY(0)}}.hologram-wrapper{width:100%;transform-style:preserve-3d;will-change:transform;transition:transform .1s ease-out;position:relative}.main-image{filter:drop-shadow(0 0 35px #b533ff80)contrast(1.1);z-index:1;width:100%;display:block;position:relative;-webkit-mask-image:radial-gradient(#000 40%,#0000 80%);mask-image:radial-gradient(#000 40%,#0000 80%)}.hologram-overlay{content:"";mix-blend-mode:color-dodge;z-index:2;pointer-events:none;background:linear-gradient(125deg,#fff0 0%,#b533ff66 40%,#00ffff4d 60%,#fff0 100%);animation:4s linear infinite alternate holoShift;position:absolute;inset:0;-webkit-mask-image:radial-gradient(#000 40%,#0000 80%);mask-image:radial-gradient(#000 40%,#0000 80%)}@keyframes holoShift{0%{opacity:.4;filter:hue-rotate(-15deg)}to{opacity:.8;filter:hue-rotate(15deg)}}.hologram-wrapper:after{content:"";z-index:3;pointer-events:none;background:repeating-linear-gradient(#0000 0%,#b533ff26 1px,#0000 3px);animation:10s linear infinite scanline;position:absolute;inset:0;-webkit-mask-image:radial-gradient(#000 40%,#0000 80%);mask-image:radial-gradient(#000 40%,#0000 80%)}@keyframes scanline{0%{background-position:0 0}to{background-position:0 100px}}.music-container{flex-wrap:wrap;align-items:center;gap:50px;display:flex}.album-cover{width:400px;max-width:100%}.album-info h1{text-transform:uppercase;letter-spacing:-1px;margin-bottom:20px;font-size:4rem}.tracklist{color:#aaa;margin-bottom:30px;font-size:1.1rem;line-height:1.8;list-style:none}.tracklist span{color:#fff;font-weight:700}.platform-links{flex-direction:column;gap:10px;display:flex}.platform-links a{color:#fff;text-transform:uppercase;letter-spacing:1px;border:1px solid #333;width:fit-content;padding:10px 20px;font-size:.9rem;text-decoration:none;transition:background .3s,border-color .3s;display:inline-block}.platform-links a:hover{color:#000;background:#fff;border-color:#fff}#proximamente{flex-direction:column;justify-content:center;align-items:center}#proximamente h2{text-transform:uppercase;color:#fff;margin-bottom:15px;font-size:3rem}#proximamente p{color:#aaa;max-width:600px;margin-bottom:30px;font-size:1.2rem}.presave-btn{color:#fff;text-transform:uppercase;letter-spacing:1.5px;background-color:#b533ff;border-radius:5px;padding:15px 30px;font-size:1rem;font-weight:800;text-decoration:none;transition:background .3s}.presave-btn:hover{background-color:#9b28db}#socials{justify-content:center}.socials-wrapper{flex-direction:column;align-items:center;gap:50px;display:flex}.socials-main{gap:60px;font-size:3.5rem;display:flex}.socials-main a{color:#555;transition:color .3s,transform .3s}.socials-main a:hover{color:#fff;transform:translateY(-5px)}.socials-soundcloud{border-top:1px solid #222;flex-direction:column;align-items:center;gap:15px;width:100%;padding-top:40px;display:flex}.sc-message{color:#888;letter-spacing:1px;text-transform:uppercase;font-size:.9rem;font-weight:300}.sc-link{color:#555;font-size:3.5rem;transition:color .3s,transform .3s}.sc-link:hover{color:#fff;transform:translateY(-5px)}.chain-frame{z-index:50;pointer-events:none;opacity:.25;filter:drop-shadow(0 5px 10px #00000080);width:auto;height:45vh;position:fixed;top:0;-webkit-mask-image:linear-gradient(#000 40%,#0000 100%);mask-image:linear-gradient(#000 40%,#0000 100%)}.chain-left{left:260px}.chain-right{right:10px}#about p{color:#ccc;max-width:800px;font-size:2.2rem;font-weight:300;line-height:1.4}#demos{flex-direction:column;justify-content:flex-start;align-items:flex-start}.demos-section-title{letter-spacing:4px;text-transform:uppercase;color:#444;margin-bottom:40px;font-size:.8rem;font-weight:800}.demos-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:16px;width:100%;display:grid}.demo-card{cursor:pointer;flex-direction:column;gap:10px;text-decoration:none;transition:transform .25s;display:flex}.demo-card:hover{transform:translateY(-4px)}.demo-card-cover{aspect-ratio:1;object-fit:cover;border:1px solid #1a1a1a;border-radius:4px;width:100%;transition:box-shadow .25s;display:block}.demo-card:hover .demo-card-cover{box-shadow:0 0 20px #b533ff59}.demo-card-no-cover{background:#0d0d0d;justify-content:center;align-items:center;display:flex}.demo-card-title{color:#fff;letter-spacing:.5px;white-space:nowrap;text-overflow:ellipsis;margin:0;font-size:.8rem;font-weight:400;overflow:hidden}.demo-detail-page{color:#fff;background:#000;flex-direction:column;align-items:center;width:100%;min-height:100vh;padding:40px 20px 100px;font-family:Inter,sans-serif;display:flex;overflow-x:hidden}.demo-back-link{color:#555;letter-spacing:2px;text-transform:uppercase;align-self:flex-start;margin-bottom:50px;font-size:.78rem;font-weight:800;text-decoration:none;transition:color .2s}.demo-back-link:hover{color:#fff}.demo-detail-layout{justify-content:center;align-items:flex-start;gap:50px;width:100%;max-width:1100px;display:flex}.demo-detail-left{flex-direction:column;flex:1;align-items:center;gap:24px;max-width:400px;display:flex}.demo-detail-right{flex:2 0;width:100%;max-width:700px;position:sticky;top:40px}.demo-detail-cover{aspect-ratio:1;object-fit:cover;border:1px solid #1a1a1a;border-radius:6px;width:100%;max-width:300px}.demo-detail-title{text-transform:uppercase;letter-spacing:-.5px;text-align:center;margin:0;font-size:1.8rem;font-weight:800}.demo-detail-desc{color:#777;text-align:center;max-width:400px;margin:0;font-size:.9rem;line-height:1.6}.demo-stats-row{justify-content:center;align-items:center;gap:20px;display:flex}.demo-stat{color:#555;letter-spacing:.5px;align-items:center;gap:6px;font-size:.78rem;display:flex}.demo-player{align-items:center;gap:12px;width:100%;padding:16px 0;display:flex}.demo-time{color:#555;font-variant-numeric:tabular-nums;min-width:34px;font-size:.75rem}.demo-progress-bar{cursor:pointer;background:#1e1e1e;border-radius:2px;flex:1;height:3px;position:relative;overflow:hidden}.demo-progress-fill{background:#b533ff;border-radius:2px;height:100%;transition:width .1s linear}.demo-play-btn{cursor:pointer;background:#111;border:1px solid #333;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:40px;height:40px;transition:background .2s,border-color .2s;display:flex}.demo-play-btn:hover{background:#1e1e1e;border-color:#555}.demo-divider{background:#111;width:100%;height:1px}.demo-actions{justify-content:space-between;align-items:center;gap:12px;width:100%;padding:4px 0;display:flex}.demo-like-btn{color:#fff;cursor:pointer;background:0 0;border:none;align-items:center;gap:8px;padding:8px 0;font-size:.9rem;transition:opacity .2s;display:flex}.demo-like-btn:hover{opacity:.7}.demo-like-btn.liked span{color:#b533ff}.demo-comment-trigger{color:#666;letter-spacing:1.5px;text-transform:uppercase;cursor:pointer;background:0 0;border:1px solid #222;border-radius:3px;padding:8px 16px;font-family:Inter,sans-serif;font-size:.75rem;transition:color .2s,border-color .2s}.demo-comment-trigger:hover{color:#fff;border-color:#555}.demo-comments-list{flex-direction:column;gap:20px;width:100%;display:flex}.demo-comment-item{flex-direction:column;gap:4px;display:flex}.demo-comment-alias{color:#b533ff;text-transform:uppercase;letter-spacing:1.5px;font-size:.7rem;font-weight:800}.demo-comment-text{color:#ddd;margin:0;font-size:.9rem;line-height:1.5}.demo-comment-time{color:#444;font-size:.7rem}.demo-modal-overlay{z-index:999;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#000000d9;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.demo-modal{background:#0d0d0d;border:1px solid #222;border-radius:10px;flex-direction:column;gap:14px;width:100%;max-width:380px;padding:30px;display:flex}.demo-modal-title{text-transform:uppercase;letter-spacing:1px;margin:0;font-size:1rem;font-weight:800}.demo-modal-hint{color:#666;margin:0;font-size:.78rem;line-height:1.6}.demo-modal-hint span{color:#444;margin-top:6px;display:block}.demo-modal-input{color:#fff;background:#111;border:1px solid #222;border-radius:5px;outline:none;width:100%;padding:11px 14px;font-family:Inter,sans-serif;font-size:.85rem;transition:border-color .2s}.demo-modal-input:focus{border-color:#b533ff}.demo-modal-error{color:#f46;margin:0;font-size:.78rem}.demo-modal-submit{color:#fff;cursor:pointer;text-transform:uppercase;letter-spacing:1px;background:#b533ff;border:none;border-radius:5px;flex:1;padding:11px;font-family:Inter,sans-serif;font-size:.85rem;font-weight:800;transition:background .2s}.demo-modal-submit:hover{background:#9b28db}.demo-modal-submit:disabled{opacity:.5;cursor:default}.demo-modal-cancel{color:#555;cursor:pointer;background:0 0;border:1px solid #222;border-radius:5px;padding:11px 16px;font-family:Inter,sans-serif;font-size:.78rem;transition:color .2s}.demo-modal-cancel:hover{color:#fff}@media (max-width:768px){.demos-grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:12px}.demo-detail-page{padding:30px 16px 80px}.demo-detail-title{font-size:1.4rem}}.spotify-wrapper{z-index:100;transition:transform .4s cubic-bezier(.25,.8,.25,1);position:fixed;bottom:20px;right:20px}.spotify-wrapper.minimized{transform:translateY(calc(100% + 20px))}.spotify-toggle{color:#fff;cursor:pointer;background:#111;border:1px solid #333;border-bottom:none;border-radius:8px 8px 0 0;justify-content:center;align-items:center;width:40px;height:30px;font-size:1.2rem;transition:background .3s;display:flex;position:absolute;top:-30px;right:15px}.spotify-toggle:hover{background:#222}.spotify-player{background:#000;border-radius:12px;width:300px;display:block;box-shadow:0 10px 30px #000000e6}@media (max-width:768px){body{flex-direction:column}.sidebar{border-bottom:1px solid #111;border-right:none;width:100%;height:auto;padding:20px;position:relative}.nav-links{flex-flow:wrap;gap:15px;margin-top:20px}.content-area{width:100%;margin-left:0}section{justify-content:flex-start;padding:60px 20px}.music-container{flex-direction:column;align-items:flex-start;gap:30px}.album-cover{width:100%}.album-info h1{font-size:2.8rem}#proximamente h2{font-size:2.2rem}#about p{font-size:1.6rem}.socials-wrapper{gap:30px}.socials-main{gap:40px;font-size:2.5rem}.sc-link{font-size:2.5rem}.sc-message{text-align:center;font-size:.8rem}.spotify-wrapper{width:calc(100% - 40px);bottom:10px;right:20px}.spotify-wrapper.minimized{transform:translateY(calc(100% + 10px))}.spotify-player{width:100%;height:152px!important}.chain-frame{display:none}.demo-visual-container{width:100%;height:auto}.demo-detail-layout{flex-direction:column;gap:0;display:flex}.demo-detail-left,.demo-detail-right{display:contents;position:static}.demo-section-cover{order:1;margin-bottom:20px}.demo-section-info{order:2;margin-bottom:20px}.demo-section-player{order:3;width:100%;margin-bottom:20px}.demo-section-comments{order:4;width:100%}.demo-section-visual{order:5;width:100%;margin-top:40px}.demo-volume-control{display:none!important}}.demo-visual-container{justify-content:center;width:100%;margin-bottom:20px;display:flex}.demo-video-wrapper{aspect-ratio:16/9;background:#0a0a0a;border-radius:8px;width:100%;max-width:100%;position:relative;overflow:hidden;box-shadow:0 10px 40px #00000080}.demo-detail-video{pointer-events:none;width:100%;height:100%;position:absolute;top:0;left:0}.demo-player-wrapper{flex-direction:column;gap:8px;width:100%;display:flex}.demo-volume-control{align-items:center;gap:8px;padding:0 10px 10px;display:flex}.demo-volume-slider{-webkit-appearance:none;background:0 0;flex:1}.demo-volume-slider::-webkit-slider-runnable-track{background:#333;border-radius:2px;width:100%;height:4px}.demo-volume-slider::-webkit-slider-thumb{-webkit-appearance:none;cursor:pointer;background:#b533ff;border-radius:50%;width:12px;height:12px;margin-top:-4px}.demo-lyrics-section{background:#0a0a0a;border:1px solid #1a1a1a;border-radius:8px;width:100%;margin:20px 0;padding:20px}.demo-lyrics-title{color:#555;letter-spacing:2px;text-transform:uppercase;text-align:center;margin:0 0 15px;font-size:.8rem}.demo-lyrics-box{color:#ccc;text-align:center;max-height:250px;padding-right:10px;font-size:1rem;line-height:1.8;overflow-y:auto}.demo-lyrics-box::-webkit-scrollbar{width:4px}.demo-lyrics-box::-webkit-scrollbar-track{background:#111}.demo-lyrics-box::-webkit-scrollbar-thumb{background:#333;border-radius:2px}.cyberpunk-section{background-color:#050505;background-image:radial-gradient(circle,#0a1a0a 0%,#000 100%);border-top:1px solid #00ff41;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.cyberpunk-section:before{content:"";pointer-events:none;z-index:1;background:repeating-linear-gradient(#0000 0%,#00ff410d 1px,#0000 3px);position:absolute;inset:0}.terminal-container{z-index:2;background:#001400cc;border:1px solid #00ff41;width:100%;max-width:600px;padding:40px;font-family:monospace;box-shadow:0 0 20px #00ff4133}.terminal-title{color:#00ff41;text-shadow:0 0 5px #00ff41;margin-bottom:20px;font-size:1.5rem;animation:1s step-end infinite blink}.terminal-text{color:#00ff41;opacity:.8;margin-bottom:40px;font-size:1rem;line-height:1.8}.cyberpunk-btn{color:#000;letter-spacing:2px;background-color:#00ff41;padding:15px 30px;font-size:1.2rem;font-weight:700;text-decoration:none;transition:all .2s;display:inline-block;box-shadow:0 0 15px #00ff41}.cyberpunk-btn:hover{color:#000;background-color:#fff;box-shadow:0 0 25px #fff}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}