html,body{margin:0;padding:0;height:100%;background:black;font-family:'Roboto Mono',monospace;color:white}body{background:black;display:flex;justify-content:center;align-items:center;height:100vh;margin:0;padding:0;overflow:hidden}.calon-text{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}.bottom-anim{font-weight:bold;text-transform:uppercase;display:block;white-space:nowrap;position:fixed;bottom:5px;left:10px;opacity:1;z-index:60}.text{font-family:'Archivo Black',sans-serif;font-weight:normal;display:inline-block;position:relative;text-transform:uppercase;font-weight:bold}.crt-line{position:absolute;width:100%;height:2px;background:rgba(255,255,255,0.3);opacity:0.6;z-index:6;pointer-events:none} body.error-page{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;height:100vh;padding:0 1rem;overflow:hidden;background:black;color:white;font-family:'Roboto Mono',monospace}body.error-page .logo-wrapper{position:relative;max-width:70vw;max-height:70vh;width:100%;height:auto;overflow:hidden;display:flex;align-items:center;justify-content:center;z-index:80;margin-bottom:0;padding-bottom:0}body.error-page .logo-wrapper h1.glitch404-active{font-size:clamp(4rem,20vw,18rem);line-height:1;height:1em;margin:0;padding:0;white-space:nowrap;display:inline-flex;align-items:center;justify-content:center;position:relative;text-align:center}.glitch404-active::before,.glitch404-active::after{content:attr(data-text);position:absolute;top:0;left:0;width:100%;height:100%;display:block;overflow:hidden;pointer-events:none;color:white;background:transparent}.glitch404-active::before{left:2px;text-shadow:-2px 0 red;animation:glitch404-anim-1 2s infinite linear alternate-reverse}.glitch404-active::after{left:-2px;text-shadow:-2px 0 blue;animation:glitch404-anim-2 2s infinite linear alternate-reverse}@keyframes glitch404-anim-1{0%{clip:rect(0.1em,9999px,0.5em,0)}25%{clip:rect(0.3em,9999px,0.6em,0)}50%{clip:rect(0.2em,9999px,0.8em,0)}75%{clip:rect(0em,9999px,1em,0)}100%{clip:rect(0.15em,9999px,0.9em,0)}}@keyframes glitch404-anim-2{0%{clip:rect(0em,9999px,1em,0)}25%{clip:rect(0.4em,9999px,0.7em,0)}50%{clip:rect(0.1em,9999px,0.6em,0)}75%{clip:rect(0em,9999px,1em,0)}100%{clip:rect(0.3em,9999px,0.85em,0)}}body.error-page #scrambleText{display:inline-block;min-height:1em;min-width:5ch;white-space:nowrap}body.error-page .bottom-anim{position:static !important;margin:0 0 2.5rem 0;opacity:1;text-align:center}body.error-page .svg-wrapper{margin-top:0.3rem}body.error-page .button-container{display:flex;justify-content:center;margin-top:0.2rem;max-width:600px;width:100%;z-index:1001}body.error-page .glitch-button{display:flex;align-items:stretch;font-size:clamp(0.8rem,2.5vw,1.2rem);letter-spacing:0.1em;text-transform:uppercase;color:#fff;cursor:pointer;background:transparent;border:0.1em solid #ffffff;padding:0;width:100%;font-family:'Archivo Black',sans-serif;position:relative;overflow:hidden;text-decoration:none;z-index:1001}body.error-page .glitch-button span{padding:0.6em 1.2em;display:flex;align-items:center;z-index:2;position:relative;white-space:nowrap;flex-grow:1}body.error-page .main-icon{width:clamp(2.2em,10vw,3em);padding:0 0.5em;background:white;fill:black;display:flex;align-items:center;justify-content:center;transition:background 0.3s ease,fill 0.3s ease,filter 0.1s ease}body.error-page .glitch-button:hover .main-icon{background:transparent;fill:white;filter:contrast(2) brightness(1.5) drop-shadow(2px 2px 0 #00ffff) drop-shadow(-2px -2px 0 #E94BE8);animation:glitch_button_anim 1s steps(2,end)}body.error-page .glitch-button::after{content:attr(data-text);position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:white;clip-path:inset(50% 50% 50% 50%);z-index:1;pointer-events:none;font-size:inherit}body.error-page .glitch-button:hover::after{animation:glitch_button_anim 1s steps(2,end);text-shadow:-2px -2px 0 #1df2f0,2px 2px 0 #E94BE8}body.error-page .glitch-button:hover{text-shadow:-1px -1px 0px #1df2f0,1px 1px 0px #E94BE8}@keyframes glitch_button_anim{0%{clip-path:inset(50% 50% 50% 50%);transform:translate(0,-10px)}10%{clip-path:inset(31% 0 40% 0);transform:translate(-10px,10px)}20%{clip-path:inset(39% 0 15% 0);transform:translate(10px,0)}30%{clip-path:inset(45% 0 40% 0);transform:translate(-10px,10px)}40%{clip-path:inset(45% 0 6% 0);transform:translate(10px,-10px)}50%{clip-path:inset(14% 0 61% 0);transform:translate(-10px,10px)}60%{clip-path:inset(50% 50% 50% 50%);transform:translate(10px,-10px)}70%{clip-path:inset(39% 0 15% 0);transform:translate(-10px,10px)}80%{clip-path:inset(31% 0 40% 0);transform:translate(10px,-10px)}90%{clip-path:inset(45% 0 40% 0);transform:translate(-10px,10px)}100%{clip-path:inset(0);transform:translate(0,0)}}body.error-page .terminal{position:fixed;top:0;left:10px;text-align:left;font-size:10px;color:white;opacity:1;z-index:60}body.error-page .terminal div{direction:ltr}.glitch-active::before,.glitch-active::after{content:attr(data-text);position:absolute;top:0;left:0;width:100%;overflow:hidden;background:transparent;color:white;pointer-events:none}.glitch-active::before{left:2px;text-shadow:-2px 0 red;animation:glitch-anim-1 2s infinite linear alternate-reverse}.glitch-active::after{left:-2px;text-shadow:-2px 0 blue;animation:glitch-anim-2 2s infinite linear alternate-reverse}@keyframes glitch-anim-1{0%{clip:rect(10px,9999px,50px,0)}10%{clip:rect(30px,9999px,60px,0)}20%{clip:rect(40px,9999px,70px,0)}30%{clip:rect(15px,9999px,35px,0)}40%{clip:rect(50px,9999px,80px,0)}100%{clip:rect(25px,9999px,60px,0)}}@keyframes glitch-anim-2{0%{clip:rect(60px,9999px,80px,0)}10%{clip:rect(20px,9999px,50px,0)}20%{clip:rect(30px,9999px,65px,0)}30%{clip:rect(10px,9999px,40px,0)}40%{clip:rect(70px,9999px,90px,0)}100%{clip:rect(35px,9999px,55px,0)}} .logo-wrapper{position:relative;max-width:70vw;max-height:70vh;width:100%;height:100%;overflow:hidden;display:flex;align-items:center;justify-content:center;z-index:80}.calon-logo{max-width:100%;max-height:100%;width:auto;height:auto;display:block;margin:auto}.animated-path{fill:none;stroke:#00ffff;stroke-width:10;stroke-dasharray:3000;stroke-dashoffset:3000;animation:draw 3s ease forwards,fillin 1s ease forwards 3s}@keyframes draw{to{stroke-dashoffset:0}}@keyframes fillin{from{fill:transparent}to{fill:rgba(0,0,0,0.2)}}.animated-path.neon-on{filter:url(#neonEffect)}.svg-wrapper svg{filter:url(#glitchFilter);margin-top:0.5rem;height:16px;display:block}rect{fill:white;transition:x 1s ease-in-out}.terminal{position:fixed;top:0px;left:5px;font-size:10px;color:#ffffff;opacity:1;z-index:60}#cursor{display:inline-block;width:10px;animation:blink 1s steps(1) infinite}@keyframes blink{0%,50%{opacity:1}51%,100%{opacity:0}}.glitch-line{display:inline-block}.glitch-on{filter:url(#glitchFilter)} .video-container{position:fixed;top:0;left:0;width:100vw;height:100vh;overflow:hidden;z-index:1}.video-container video{width:100%;height:100%;object-fit:cover;position:absolute;top:0;left:0}.video-container video.active{opacity:1;z-index:1}.effect-layer{position:fixed;pointer-events:none;z-index:50;top:0;left:0;width:100%;height:100%}.effect{position:absolute;width:100%;height:100%;pointer-events:none}.scanlines::before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background-image:url('../images/scanlines.png');background-repeat:repeat;background-size:100% 6px;z-index:3;pointer-events:none}@keyframes scan{0%{background-position:0 0}100%{background-position:0 3px}}.glitchOverlay{background:white;mix-blend-mode:difference;opacity:0;animation:glitchFlash 6s infinite;z-index:60}@keyframes glitchFlash{0%,97%,100%{opacity:0}98%{opacity:0.6}99%{opacity:0.8}}