@import url("https://fonts.googleapis.com/css2?family=Permanent+Marker&display=swap");h1{font-size:large}body,html{margin:0;padding:0;height:100%;overflow-x:hidden;background:transparent}body{overflow-y:auto}.landing-layout{min-height:100vh;width:100vw;position:relative;margin:0;padding:0;background:radial-gradient(ellipse at bottom,#1b2735 0,#090a0f 100%);background-size:cover;overflow-x:hidden;display:flex;flex-direction:column}.landing-layout main{width:100%;min-height:100vh;position:relative;flex:1}.profilepicsection{position:absolute;top:20vh;right:10vw;width:25vw;height:25vw;max-width:250px;max-height:250px;min-width:200px;min-height:200px;background:radial-gradient(ellipse at center,rgba(88,0,200,.9) 30%,rgba(64,0,150,.25) 60%,rgba(16,0,50,.9) 100%);border-radius:50%;display:flex;align-items:center;justify-content:center}.profilepic{position:absolute}.profilepictext{margin-top:400px;font-size:25px;color:#3366CC}.intro,.profilepictext{position:absolute;font-family:Permanent Marker,cursive}.intro{top:25vh;font-size:clamp(1.5rem,4vw,3rem);color:#fff}.intro,.intro2,.intro3{left:5vw;max-width:50vw;z-index:2}.intro2,.intro3{position:absolute;font-size:clamp(.9rem,2vw,1.3rem);font-family:Permanent Marker,cursive}.intro2{top:35vh;color:violet}.intro3{top:22vh;color:white}@keyframes typing{0%{width:0}50%{width:27ch}90%{width:27ch}to{width:0}}@keyframes blink-caret{0%,to{border-color:transparent}50%{border-color:blue}}.highlight{position:relative;display:inline-block}.highlight:after{content:"";position:absolute;top:-10px;left:-20px;width:130%;height:150%;border:3px solid #00ffff;border-radius:50%/40%;transform:rotate(-20deg) scale(0);transform-origin:center;animation:ellipsePop 4s ease-in-out infinite}@keyframes ellipsePop{0%,35%{transform:rotate(-20deg) scale(0);opacity:0}40%,60%{transform:rotate(-20deg) scale(1);opacity:1}65%,to{transform:rotate(-20deg) scale(0);opacity:0}}@media (max-width:768px){.profilepicsection{top:15vh;right:5vw;width:35vw;height:35vw}.intro{top:30vh;max-width:60vw}.intro2{top:40vh;max-width:60vw}.intro3{top:27vh}.intro3,.website-info{max-width:60vw}.cta-section{top:55vh}}.main{position:fixed;top:50%;left:50%;height:1px;width:1px;background-color:#fff;border-radius:50%;box-shadow:-42vw -4vh 0 0 #fff,25vw -41vh 0 0 #fff,-20vw 49vh 0 1px #fff,5vw 40vh 1px 1px #fff,29vw 19vh 1px 0 #fff,-44vw -13vh 0 0 #fff,46vw 41vh 0 1px #fff,-3vw -45vh 0 1px #fff,47vw 35vh 1px 0 #fff,12vw -8vh 1px 0 #fff,-34vw 48vh 1px 1px #fff,32vw 26vh 1px 1px #fff,32vw -41vh 1px 1px #fff,0 37vh 1px 1px #fff,34vw -26vh 1px 0 #fff,-14vw -49vh 1px 0 #fff,-12vw 45vh 0 1px #fff,-44vw -33vh 0 1px #fff,-13vw 41vh 0 0 #fff,-36vw -11vh 0 1px #fff,-23vw -24vh 1px 0 #fff,-38vw -27vh 0 1px #fff,16vw -19vh 0 0 #fff,28vw 33vh 1px 0 #fff,-49vw -4vh 0 0 #fff,16vw 32vh 0 1px #fff,36vw -18vh 1px 0 #fff,-25vw -30vh 1px 0 #fff,-23vw 24vh 0 1px #fff,-2vw -35vh 1px 1px #fff,-25vw 9vh 0 0 #fff,-15vw -34vh 0 0 #fff,-8vw -19vh 1px 0 #fff,-20vw -20vh 1px 1px #fff,42vw 50vh 0 1px #fff,-32vw 10vh 1px 0 #fff,-23vw -17vh 0 0 #fff,44vw 15vh 1px 0 #fff,-40vw 33vh 1px 1px #fff,-43vw 8vh 0 0 #fff,-48vw -15vh 1px 1px #fff,-24vw 17vh 0 0 #fff,-31vw 50vh 1px 0 #fff,36vw -38vh 0 1px #fff,-7vw 48vh 0 0 #fff,15vw -32vh 0 0 #fff,29vw -41vh 0 0 #fff,2vw 37vh 1px 0 #fff,7vw -40vh 1px 1px #fff,15vw 18vh 0 0 #fff,25vw -13vh 1px 1px #fff,-46vw -12vh 1px 1px #fff,-18vw 22vh 0 0 #fff,23vw -9vh 1px 0 #fff,50vw 12vh 0 1px #fff,45vw 2vh 0 0 #fff,14vw -48vh 1px 0 #fff,23vw 43vh 0 1px #fff,-40vw 16vh 1px 1px #fff,20vw -31vh 0 1px #fff,-17vw 44vh 1px 1px #fff,18vw -45vh 0 0 #fff,33vw -6vh 0 0 #fff,0 7vh 0 1px #fff,-10vw -18vh 0 1px #fff,-19vw 5vh 1px 0 #fff,1vw 42vh 0 0 #fff,22vw 48vh 0 1px #fff,39vw -8vh 1px 1px #fff,-6vw -42vh 1px 0 #fff,-47vw 34vh 0 0 #fff,-46vw 19vh 0 1px #fff,-12vw -32vh 0 0 #fff,-45vw -38vh 0 1px #fff,-28vw 18vh 1px 0 #fff,-38vw -46vh 1px 1px #fff,49vw -6vh 1px 1px #fff,-28vw 18vh 1px 1px #fff,10vw -24vh 0 1px #fff,-5vw -11vh 1px 1px #fff,33vw -8vh 1px 0 #fff,-16vw 17vh 0 0 #fff,18vw 27vh 0 1px #fff,-8vw -10vh 1px 1px #fff;box-shadow:24vw 9vh 1px 0 #fff,12vw -24vh 0 1px #fff,-45vw -22vh 0 0 #fff,-37vw -40vh 0 1px #fff,29vw 19vh 0 1px #fff,4vw -8vh 0 1px #fff,-5vw 21vh 1px 1px #fff,-27vw 26vh 1px 1px #fff,-47vw -3vh 1px 1px #fff,-28vw -30vh 0 1px #fff,-43vw -27vh 0 1px #fff,4vw 22vh 1px 1px #fff,36vw 23vh 0 0 #fff,-21vw 24vh 1px 1px #fff,-16vw 2vh 1px 0 #fff,-16vw -6vh 0 0 #fff,5vw 26vh 0 0 #fff,-34vw 41vh 0 0 #fff,1vw 42vh 1px 1px #fff,11vw -13vh 1px 1px #fff,48vw -8vh 1px 0 #fff,22vw -15vh 0 0 #fff,45vw 49vh 0 0 #fff,43vw -27vh 1px 1px #fff,20vw -2vh 0 0 #fff,8vw 22vh 0 1px #fff,39vw 48vh 1px 1px #fff,-21vw -11vh 0 1px #fff,-40vw 45vh 0 1px #fff,11vw -30vh 1px 0 #fff,26vw 30vh 1px 0 #fff,45vw -29vh 0 1px #fff,-2vw 18vh 0 0 #fff,-29vw -45vh 1px 0 #fff,-7vw -27vh 1px 1px #fff,42vw 24vh 0 0 #fff,45vw -48vh 1px 0 #fff,-36vw -18vh 0 0 #fff,-44vw 13vh 0 1px #fff,36vw 16vh 0 1px #fff,40vw 24vh 0 0 #fff,18vw 11vh 0 0 #fff,-15vw -23vh 1px 0 #fff,-24vw 48vh 0 1px #fff,27vw -45vh 1px 0 #fff,-2vw -24vh 0 1px #fff,-15vw -28vh 0 0 #fff,-43vw 13vh 1px 0 #fff,7vw 27vh 1px 0 #fff,47vw 5vh 0 0 #fff,-45vw 15vh 1px 1px #fff,-5vw -28vh 0 1px #fff,38vw 25vh 1px 1px #fff,-39vw -1vh 1px 0 #fff,5vw 0 1px 0 #fff,49vw 13vh 0 0 #fff,48vw 10vh 0 1px #fff,19vw -28vh 0 0 #fff,4vw 7vh 0 0 #fff,21vw 21vh 1px 1px #fff,-15vw -15vh 0 1px #fff,-6vw -42vh 1px 0 #fff,-15vw 48vh 1px 1px #fff,-23vw 25vh 1px 1px #fff,-48vw 25vh 0 1px #fff,-31vw -19vh 0 1px #fff,4vw 37vh 1px 1px #fff,-43vw 28vh 0 0 #fff,3vw -25vh 0 1px #fff,-39vw 14vh 0 1px #fff,-40vw 31vh 0 1px #fff,35vw -36vh 1px 1px #fff,16vw 49vh 0 0 #fff,6vw 39vh 0 0 #fff,3vw -35vh 0 1px #fff,-44vw -2vh 1px 0 #fff,-6vw 21vh 1px 0 #fff,48vw 9vh 1px 1px #fff,-43vw 30vh 1px 1px #fff,29vw -12vh 1px 1px #fff,-48vw 13vh 1px 0 #fff,-42vw 32vh 1px 1px #fff,34vw 15vh 1px 1px #fff,29vw -37vh 1px 1px #fff,28vw 2vh 0 0 #fff;animation:zoom 16s infinite alternate}@keyframes zoom{0%{transform:scale(1)}to{transform:scale(1.5)}}.card{bottom:10vh;left:50%;transform:translateX(-50%)}.card,.website-info{position:absolute;z-index:2}.website-info{top:5vh;left:5vw;max-width:40vw;transition:all .3s ease}.website-info:hover{transform:scale(1.05)}.web-info-text{font-family:Permanent Marker,cursive;font-size:16px;color:#00ffff;text-align:center;padding:15px;background:rgba(0,255,255,.1);border-radius:10px;backdrop-filter:blur(10px);border:1px solid rgba(0,255,255,.3)}.landing-container{position:relative;min-height:100vh}.hero-section{position:relative;z-index:2}.profile-glow{position:absolute;top:-20px;left:-20px;right:-20px;bottom:-20px;background:radial-gradient(circle,rgba(0,255,255,.3) 0,transparent 70%);border-radius:50%;animation:glow 3s ease-in-out infinite alternate}@keyframes glow{0%{opacity:.5;transform:scale(1)}to{opacity:1;transform:scale(1.05)}}.text-section{position:relative;z-index:2}.typewriter{overflow:hidden;white-space:nowrap;border-right:3px solid #00ffff;animation:blink 1s infinite}.fade-in{animation:fadeIn 2s ease-in 1s both}.slide-up{animation:slideUp 1.5s ease-out 2s both}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.cta-section{position:absolute;top:50vh;left:5vw;z-index:3}.cta-button{padding:15px 30px;background:linear-gradient(45deg,#00ffff,#ff00ff);border:none;border-radius:25px;color:white;font-weight:700;font-size:16px;cursor:pointer;transition:all .3s ease;box-shadow:0 5px 15px rgba(0,255,255,.3)}.cta-button:hover{transform:translateY(-3px);box-shadow:0 8px 25px rgba(0,255,255,.5);background:linear-gradient(45deg,#ff00ff,#00ffff)}@media (max-width:768px){.web-info-text{font-size:14px;padding:10px}.cta-section{top:50vh;right:5vw}.cta-button{padding:12px 24px;font-size:14px}}.Navbar{position:absolute;top:80px;right:0;transform:translateX(-50%);z-index:1000;padding:0;width:fit-content;background:transparent}.Navbar-children{justify-content:center;border-radius:15px;padding:15px 25px;background:rgba(255,255,255,.1);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.2);box-shadow:0 8px 32px rgba(0,0,0,.3);transition:all .3s ease}.Navbar-children:hover{background:rgba(255,255,255,.15);transform:translateY(-2px);box-shadow:0 12px 40px rgba(0,0,0,.4)}.Navbar-children-ul{list-style:none;display:flex;align-items:center;padding:0;margin:0;gap:5px}.Navbar-children-li{position:relative;color:#fff;font-size:16px;font-family:Permanent Marker,cursive;font-weight:500;margin:0 15px;cursor:pointer;text-decoration:none;display:inline-block;padding:12px 16px;border-radius:8px;transition:all .3s ease;text-shadow:0 1px 2px rgba(0,0,0,.5)}.Navbar-children-li:hover{background:rgba(255,255,255,.1);transform:translateY(-1px);color:#00ffff}.Navbar-children-li:before{content:"";position:absolute;bottom:4px;left:50%;height:2px;width:0;background:linear-gradient(90deg,#00ffff,#ff00ff);border-radius:12px;transition:all .3s ease;transform:translateX(-50%)}.Navbar-children-li:hover:before{width:80%}@media (max-width:768px){.Navbar{top:70px;right:10px}.Navbar-children{padding:10px 15px}.Navbar-children-li{font-size:14px;margin:0 8px;padding:8px 12px}}.page-transition{animation-duration:.8s;animation-timing-function:cubic-bezier(.68,-.55,.265,1.55);animation-fill-mode:both;position:relative;overflow:hidden}.page-transition:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);z-index:1}.page-transition.transitioning:before{animation:shimmer .8s ease-out}@keyframes shimmer{0%{left:-100%}to{left:100%}}.page-transition.transitioning.from-left{animation-name:slideInFromLeft,shake}.page-transition.transitioning.from-right{animation-name:slideInFromRight,shake}.page-transition.transitioning.from-top{animation-name:slideInFromTop,shake}.page-transition.transitioning.from-bottom{animation-name:slideInFromBottom,shake}.page-transition.transitioning.from-center{animation-name:slideInFromCenter,shake}@keyframes slideInFromLeft{0%{transform:translateX(-100vw) rotate(-5deg);opacity:0}60%{transform:translateX(0) rotate(0deg);opacity:1}to{transform:translateX(0) rotate(0deg);opacity:1}}@keyframes slideInFromRight{0%{transform:translateX(100vw) rotate(5deg);opacity:0}60%{transform:translateX(0) rotate(0deg);opacity:1}to{transform:translateX(0) rotate(0deg);opacity:1}}@keyframes slideInFromTop{0%{transform:translateY(-100vh) rotate(-3deg);opacity:0}60%{transform:translateY(0) rotate(0deg);opacity:1}to{transform:translateY(0) rotate(0deg);opacity:1}}@keyframes slideInFromBottom{0%{transform:translateY(100vh) rotate(3deg);opacity:0}60%{transform:translateY(0) rotate(0deg);opacity:1}to{transform:translateY(0) rotate(0deg);opacity:1}}@keyframes slideInFromCenter{0%{transform:scale(0) rotate(180deg);opacity:0}60%{transform:scale(1) rotate(0deg);opacity:1}to{transform:scale(1) rotate(0deg);opacity:1}}@keyframes shake{60%,70%,80%,90%{transform:translateX(0)}65%{transform:translateX(-4px) rotate(-1deg)}75%{transform:translateX(4px) rotate(1deg)}85%{transform:translateX(-2px) rotate(-.5deg)}95%{transform:translateX(2px) rotate(.5deg)}}.page-transition.transitioning{position:relative}.page-transition.transitioning:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at center,rgba(0,255,255,.1) 0,transparent 70%);animation:pulse .8s ease-out;pointer-events:none}@keyframes pulse{0%{opacity:0;transform:scale(.8)}50%{opacity:1;transform:scale(1.05)}to{opacity:0;transform:scale(1)}}.nav-btn{position:fixed;bottom:20px;padding:12px 20px;background:rgba(255,255,255,.1);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.2);border-radius:8px;color:white;font-family:Courier New,monospace;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 8px 32px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.2),inset 0 -1px 0 rgba(0,0,0,.2);z-index:1000}.nav-btn.forward{right:20px;min-width:80px}.nav-btn.back{left:20px;min-width:120px}.nav-btn:hover:not(.disabled){background:rgba(255,255,255,.2);transform:translateY(-2px);box-shadow:0 12px 40px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.3),inset 0 -1px 0 rgba(0,0,0,.3)}.nav-btn:active:not(.disabled){transform:translateY(0);box-shadow:0 4px 16px rgba(0,0,0,.3),inset 0 2px 4px rgba(0,0,0,.2)}.nav-btn.disabled{opacity:.3;cursor:not-allowed;background:rgba(255,255,255,.05)}.key-text{font-size:14px;text-shadow:0 1px 2px rgba(0,0,0,.5)}.key-combo{display:flex;align-items:center;gap:4px;font-size:12px}.enter,.shift{padding:2px 6px;background:rgba(255,255,255,.1);border-radius:4px;border:1px solid rgba(255,255,255,.2)}.plus{font-size:10px;opacity:.8}.progress-container{position:fixed;top:0;left:0;width:100%;height:4px;background:rgba(255,255,255,.1);z-index:1001}.progress-bar{height:100%;background:linear-gradient(90deg,#00ffff,#ff00ff,#ffff00);transition:width .8s cubic-bezier(.4,0,.2,1);box-shadow:0 0 10px rgba(0,255,255,.5)}.progress-text{position:absolute;right:20px;top:10px;color:white;font-size:12px;font-weight:700}.theme-toggle{position:fixed;top:20px;right:20px;width:50px;height:50px;border-radius:50%;border:none;background:rgba(255,255,255,.1);backdrop-filter:blur(10px);font-size:24px;cursor:pointer;transition:all .3s ease;z-index:1001}.theme-toggle:hover{transform:scale(1.1) rotate(180deg);background:rgba(255,255,255,.2)}.particles{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:1}.particle{position:absolute;width:4px;height:4px;background:rgba(0,255,255,.6);border-radius:50%;animation:float 6s ease-in-out infinite}.particle-0{left:10%;animation-delay:0s}.particle-1{left:20%;animation-delay:.5s}.particle-2{left:30%;animation-delay:1s}.particle-3{left:40%;animation-delay:1.5s}.particle-4{left:50%;animation-delay:2s}.particle-5{left:60%;animation-delay:2.5s}.particle-6{left:70%;animation-delay:3s}.particle-7{left:80%;animation-delay:3.5s}.particle-8{left:90%;animation-delay:4s}.particle-9{left:15%;animation-delay:4.5s}.particle-10{left:25%;animation-delay:5s}.particle-11{left:35%;animation-delay:.2s}.particle-12{left:45%;animation-delay:.7s}.particle-13{left:55%;animation-delay:1.2s}.particle-14{left:65%;animation-delay:1.7s}.particle-15{left:75%;animation-delay:2.2s}.particle-16{left:85%;animation-delay:2.7s}.particle-17{left:95%;animation-delay:3.2s}.particle-18{left:5%;animation-delay:3.7s}.particle-19{left:95%;animation-delay:4.2s}@keyframes float{0%,to{transform:translateY(100vh) rotate(0deg);opacity:0}10%{opacity:1}90%{opacity:1}to{transform:translateY(-10vh) rotate(1turn);opacity:0}}.stats-container{position:fixed;bottom:80px;left:50%;transform:translateX(-50%);display:flex;gap:40px;z-index:1000}.stat-item{text-align:center;background:rgba(255,255,255,.1);backdrop-filter:blur(10px);padding:20px;border-radius:15px;border:1px solid rgba(255,255,255,.2);min-width:80px}.stat-number{font-size:2rem;font-weight:700;color:#00ffff;animation:countUp 2s ease-out}.stat-label{font-size:.9rem;color:white;margin-top:5px}@keyframes countUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.loading-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.9);display:flex;justify-content:center;align-items:center;z-index:9999;opacity:0;pointer-events:none;transition:opacity .3s ease}.loading-overlay.active{opacity:1;pointer-events:all}.loading-spinner{width:50px;height:50px;border:3px solid rgba(255,255,255,.3);border-top-color:#00ffff;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.breadcrumb{position:fixed;top:70px;left:20px;color:rgba(255,255,255,.7);font-size:14px;z-index:1000;text-transform:capitalize}[data-theme=light]{--bg-primary:linear-gradient(135deg,#667eea,#764ba2);--text-primary:#333;--text-secondary:#666}[data-theme=light] .landing-layout{background:var(--bg-primary)}[data-theme=light] .intro,[data-theme=light] .intro2,[data-theme=light] .intro3{color:var(--text-primary)}.hover-lift{transition:transform .3s ease,box-shadow .3s ease}.hover-lift:hover{transform:translateY(-5px);box-shadow:0 10px 25px rgba(0,0,0,.2)}.reveal{opacity:0;transform:translateY(30px);transition:all .6s ease}.reveal.active{opacity:1;transform:translateY(0)}@media (max-width:768px){.stats-container{gap:20px;bottom:100px}.stat-item{padding:15px;min-width:60px}.stat-number{font-size:1.5rem}.theme-toggle{width:40px;height:40px;font-size:20px}}