@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=Outfit:wght@300;400;500;600;700;800&display=swap";*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--color-primary: #ff6b35;--color-secondary: #1b3984;--color-accent: #ff4500;--color-dark: #000000;--color-light: #ffffff;--galaxy-core: #ff6030;--galaxy-outer: #1b3984;--galaxy-glow: #ff6b35;--space-black: #000000;--space-deep: #0a0a15;--space-nebula: #1a1a2e;--text-primary: rgba(255, 255, 255, .95);--text-secondary: rgba(255, 255, 255, .7);--text-muted: rgba(255, 255, 255, .5);--glass-bg: rgba(255, 255, 255, .05);--glass-border: rgba(255, 255, 255, .1);--glass-blur: blur(10px);--font-primary: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-display: "Outfit", "Inter", sans-serif;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 2rem;--spacing-xl: 4rem;--transition-fast: .15s ease;--transition-normal: .3s ease;--transition-slow: .5s ease;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 16px;--radius-full: 9999px;--shadow-glow: 0 0 20px rgba(255, 107, 53, .3);--shadow-glow-intense: 0 0 40px rgba(255, 107, 53, .5)}html{font-size:16px;scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-primary);font-weight:400;line-height:1.6;color:var(--text-primary);background:var(--space-black);overflow-x:hidden;min-height:100vh}h1,h2,h3,h4,h5,h6{font-family:var(--font-display);font-weight:700;line-height:1.2;color:var(--text-primary)}h1{font-size:clamp(2.5rem,8vw,5rem)}h2{font-size:clamp(2rem,5vw,3rem)}h3{font-size:clamp(1.5rem,3vw,2rem)}p{color:var(--text-secondary)}a{color:var(--color-primary);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--color-accent)}::selection{background:var(--color-primary);color:var(--color-light)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--space-deep)}::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--galaxy-core),var(--galaxy-outer));border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--color-primary)}:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.text-gradient{background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-accent) 50%,var(--color-secondary) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.glass{background:var(--glass-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border)}.glow{box-shadow:var(--shadow-glow)}.glow-intense{box-shadow:var(--shadow-glow-intense)}canvas{display:block;touch-action:none}.loading{display:flex;justify-content:center;align-items:center;min-height:100vh;background:var(--space-black)}.loading:after{content:"";width:40px;height:40px;border:3px solid var(--glass-border);border-top-color:var(--color-primary);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.fade-enter{opacity:0}.fade-enter-active{opacity:1;transition:opacity var(--transition-slow)}.fade-exit{opacity:1}.fade-exit-active{opacity:0;transition:opacity var(--transition-slow)}#root{min-height:100vh}.scroll-experience-advanced{position:fixed;top:0;left:0;width:100%;height:100%;background:#000;overflow:hidden}.vignette{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:50;background:radial-gradient(ellipse at center,transparent 50%,rgba(0,0,0,.4) 100%)}@keyframes scanline{0%{transform:translateY(-100%)}to{transform:translateY(100vh)}}@keyframes flicker{0%,to{opacity:1}92%{opacity:1}93%{opacity:.8}94%{opacity:1}97%{opacity:.9}98%{opacity:1}}@keyframes glitch{0%,to{transform:translate(0);filter:none}20%{transform:translate(-2px,1px)}40%{transform:translate(2px,-1px);filter:hue-rotate(10deg)}60%{transform:translate(-1px,2px)}80%{transform:translate(1px,-2px);filter:hue-rotate(-10deg)}}@keyframes holoGlow{0%,to{text-shadow:0 0 5px rgba(255,107,53,.5),0 0 10px rgba(255,107,53,.3),0 0 20px rgba(255,107,53,.2)}50%{text-shadow:0 0 8px rgba(255,107,53,.7),0 0 15px rgba(255,107,53,.5),0 0 30px rgba(255,107,53,.3)}}.text-overlay{position:fixed;top:50%;transform:translateY(-50%);width:42%;max-width:520px;z-index:100;padding:2rem;animation:flicker 8s infinite}.text-overlay:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(to bottom,transparent 0%,rgba(255,107,53,.03) 50%,transparent 100%);height:30%;animation:scanline 4s linear infinite;pointer-events:none;z-index:10}.text-overlay:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,0,0,.1) 2px,rgba(0,0,0,.1) 4px);pointer-events:none;z-index:5;opacity:.3}.text-overlay.left{left:4%}.text-overlay.right{right:4%}.text-content{width:100%;position:relative;z-index:1}.hero-section,.project-section{background:linear-gradient(135deg,#0009,#14141e66,#0009);border:1px solid rgba(255,107,53,.2);border-radius:12px;padding:2rem;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);box-shadow:0 0 20px #ff6b351a,inset 0 0 30px #0000004d;position:relative;overflow:hidden}.hero-section:before,.project-section:before{content:"";position:absolute;top:0;left:0;width:60px;height:60px;border-top:2px solid rgba(255,107,53,.5);border-left:2px solid rgba(255,107,53,.5);pointer-events:none}.hero-section:after,.project-section:after{content:"";position:absolute;bottom:0;right:0;width:60px;height:60px;border-bottom:2px solid rgba(255,107,53,.5);border-right:2px solid rgba(255,107,53,.5);pointer-events:none}.text-overlay:hover .text-content{animation:glitch .3s ease-in-out}.hero-section h1,.project-section h2{animation:holoGlow 3s ease-in-out infinite}.hero-section{text-align:left}.badge{display:inline-flex;align-items:center;gap:.5rem;padding:.65rem 1.3rem;background:linear-gradient(135deg,#ff980026,#ff57221a);border:1px solid rgba(255,152,0,.4);border-radius:50px;font-size:.9rem;font-weight:500;color:orange;margin-bottom:1.5rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.hero-section h1{margin:0 0 1.5rem;line-height:1.1}.greeting{display:block;font-size:1.35rem;font-weight:300;color:#ffffff80;letter-spacing:4px;text-transform:uppercase;margin-bottom:.5rem}.hero-section .name{display:block;font-size:clamp(3rem,7vw,5.5rem);font-weight:800;background:linear-gradient(135deg,#fff,gold,#ff6b35 80%,#ff4500);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-1px}.roles{display:flex;align-items:center;gap:.85rem;flex-wrap:wrap;margin-bottom:1.5rem}.role{font-size:1rem;font-weight:600;padding:.6rem 1.2rem;border-radius:50px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .3s ease}.role.ai{color:#ff6b35;background:#ff6b351f;border:1px solid rgba(255,107,53,.35)}.role.fullstack{color:#00d4aa;background:#00d4aa1f;border:1px solid rgba(0,212,170,.35)}.roles .divider{color:#ffffff40;font-size:1.5rem}.tagline{font-size:1.15rem;font-weight:300;color:#ffffffa6;line-height:1.8;margin:0 0 1.5rem}.social-links{display:flex;gap:1rem;margin-bottom:1.5rem;flex-wrap:wrap}.social-link{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:#ffffff14;border:1px solid rgba(255,255,255,.15);color:#ffffffb3;transition:all .3s cubic-bezier(.22,1,.36,1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.social-link svg{width:20px;height:20px}.social-link:hover{transform:translateY(-4px);box-shadow:0 8px 25px #0000004d}.social-link.github:hover{background:#ffffff26;border-color:#fff6;color:#fff}.social-link.linkedin:hover{background:#0a66c233;border-color:#0a66c299;color:#0a66c2}.social-link.facebook:hover{background:#1877f233;border-color:#1877f299;color:#1877f2}.social-link.twitter:hover{background:#ffffff26;border-color:#fff6;color:#fff}.scroll-cta{display:flex;align-items:center;gap:.8rem;color:#fff6;font-size:.95rem}.scroll-cta .arrow{font-size:1.6rem;animation:float 2s ease-in-out infinite}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(10px)}}.project-section{text-align:left}.planet-badge{display:inline-flex;align-items:center;gap:.6rem;padding:.55rem 1.2rem;border-radius:50px;font-size:.9rem;font-weight:600;color:#ffffffe6;text-transform:uppercase;letter-spacing:1.5px;border:1px solid;margin-bottom:1.25rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.planet-badge .dot{width:10px;height:10px;border-radius:50%;box-shadow:0 0 8px currentColor}.project-section h2{font-size:clamp(2.2rem,5vw,4rem);font-weight:800;line-height:1.1;margin:0 0 1rem;background:linear-gradient(135deg,#fff,#ffffffd9);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.description{font-size:1.1rem;font-weight:300;color:#ffffffb3;line-height:1.75;margin:0 0 1.5rem}.tech-stack{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.5rem}.tech{font-size:.78rem;font-weight:600;padding:.5rem 1rem;background:#ffffff0f;border:1px solid rgba(255,255,255,.12);border-radius:25px;color:#ffffffd9;transition:all .3s ease;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.tech:hover{background:#ff6b3526;border-color:#ff6b3566;color:#ff6b35;transform:translateY(-2px)}.features{margin-bottom:1.5rem;padding:1.25rem;background:#ffffff08;border-radius:16px;border:1px solid rgba(255,255,255,.08);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.features h4{font-size:.8rem;font-weight:600;color:#ffffff80;text-transform:uppercase;letter-spacing:1.5px;margin:0 0 .9rem}.feature{display:flex;align-items:center;gap:.7rem;padding:.5rem 0;font-size:.95rem;color:#fffc}.moon-icon{font-size:1rem}.links{display:flex;gap:1rem;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;gap:.6rem;padding:.95rem 1.8rem;font-size:.9rem;font-weight:600;border-radius:50px;text-decoration:none;transition:all .3s cubic-bezier(.22,1,.36,1);text-transform:uppercase;letter-spacing:1px}.btn svg{width:18px;height:18px}.btn.github{background:#ffffff14;color:#fff;border:1px solid rgba(255,255,255,.2);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.btn.github:hover{background:#ffffff2e;border-color:#ffffff73;transform:translateY(-4px);box-shadow:0 15px 35px #0006}.btn.live{background:linear-gradient(135deg,#ff6b35,#ff4500);color:#fff;border:none;box-shadow:0 5px 25px #ff6b3573}.btn.live:hover{transform:translateY(-4px);box-shadow:0 12px 40px #ff6b35a6}.progress-indicator{position:fixed;right:2.5rem;top:50%;transform:translateY(-50%);z-index:200;display:flex;flex-direction:column;gap:1.2rem}.progress-indicator .dot{width:14px;height:14px;border-radius:50%;background:#ffffff26;border:2px solid rgba(255,255,255,.2);cursor:pointer;transition:all .3s ease;position:relative}.progress-indicator .dot:hover{background:#ffffff59}.progress-indicator .dot.active{background:#ff6b35;border-color:#ff6b3599;box-shadow:0 0 25px #ff6b35b3;transform:scale(1.15)}.progress-indicator .tooltip{position:absolute;right:100%;top:50%;transform:translateY(-50%);margin-right:1rem;padding:.5rem 1rem;background:#000000d9;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);border-radius:8px;font-size:.8rem;color:#fff;white-space:nowrap;opacity:0;visibility:hidden;transition:all .2s ease;pointer-events:none}.progress-indicator .dot:hover .tooltip{opacity:1;visibility:visible}.audio-toggle{position:fixed;bottom:2rem;right:2rem;width:48px;height:48px;border-radius:50%;background:#ffffff14;border:1px solid rgba(255,255,255,.15);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);cursor:pointer;z-index:200;display:flex;align-items:center;justify-content:center;transition:all .3s ease}.audio-toggle:hover{background:#ffffff26;border-color:#ff6b3580;box-shadow:0 0 20px #ff6b354d}.audio-toggle svg{width:22px;height:22px;color:#ffffffb3;transition:color .3s ease}.audio-toggle:hover svg{color:#ff6b35}@media(max-width:1200px){.text-overlay{width:50%}}@media(max-width:900px){.text-overlay{width:65%;max-width:none}.text-overlay.left,.text-overlay.right{left:50%;right:auto;transform:translate(-50%,-50%)}.hero-section,.project-section{text-align:center}.roles,.tech-stack,.links,.scroll-cta{justify-content:center}}@media(max-width:600px){.text-overlay{width:90%;padding:1rem}.hero-section .name{font-size:2.8rem}.project-section h2{font-size:2rem}.links{flex-direction:column;align-items:center}.btn{width:100%;max-width:260px;justify-content:center}.progress-indicator{right:1rem;gap:.9rem}.progress-indicator .dot{width:10px;height:10px}.progress-indicator .tooltip{display:none}}.contact-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000d9;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:1rem}.contact-form{background:linear-gradient(135deg,#0a0a14f2,#141428e6);border:1px solid rgba(255,107,53,.3);border-radius:20px;padding:2.5rem;max-width:480px;width:100%;position:relative;box-shadow:0 0 50px #ff6b3533,inset 0 0 30px #00000080}.contact-form .close-btn{position:absolute;top:1rem;right:1rem;background:none;border:none;color:#ffffff80;font-size:2rem;cursor:pointer;transition:color .3s}.contact-form .close-btn:hover{color:#ff6b35}.form-header{text-align:center;margin-bottom:2rem}.form-header .transmission-icon{font-size:3rem;display:block;margin-bottom:1rem;animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.form-header h2{font-size:1.8rem;font-weight:700;color:#fff;margin:0 0 .5rem}.form-header p{color:#ffffff80;margin:0}.form-group{margin-bottom:1.5rem}.form-group label{display:block;font-size:.85rem;font-weight:600;color:#ff6b35;text-transform:uppercase;letter-spacing:1px;margin-bottom:.5rem}.form-group input,.form-group textarea{width:100%;padding:1rem;background:#ffffff0d;border:1px solid rgba(255,255,255,.15);border-radius:10px;color:#fff;font-size:1rem;font-family:inherit;transition:all .3s}.form-group input:focus,.form-group textarea:focus{outline:none;border-color:#ff6b35;box-shadow:0 0 15px #ff6b354d}.form-group input::placeholder,.form-group textarea::placeholder{color:#ffffff4d}.submit-btn{width:100%;padding:1.2rem;background:linear-gradient(135deg,#ff6b35,#ff4500);border:none;border-radius:50px;color:#fff;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s;display:flex;align-items:center;justify-content:center;gap:.5rem}.submit-btn:hover{transform:translateY(-3px);box-shadow:0 10px 30px #ff6b3566}.submit-btn.transmitting{background:#ff6b354d;cursor:not-allowed}.submit-btn .loading-dots:after{content:"";animation:dots 1.5s infinite}@keyframes dots{0%,20%{content:""}40%{content:"."}60%{content:".."}80%,to{content:"..."}}.submit-btn .signal-waves{animation:wave 1s ease-in-out infinite}@keyframes wave{0%,to{opacity:.3}50%{opacity:1}}.success-message{text-align:center;padding:2rem}.success-message .success-icon{display:flex;align-items:center;justify-content:center;width:80px;height:80px;background:linear-gradient(135deg,#00d4aa,#00b894);border-radius:50%;font-size:2.5rem;color:#fff;margin:0 auto 1.5rem}.success-message h3{color:#00d4aa;font-size:1.5rem;margin:0 0 .5rem}.success-message p{color:#fff9;margin:0}.contact-toggle{position:fixed;bottom:2rem;left:2rem;width:48px;height:48px;border-radius:50%;background:#ffffff14;border:1px solid rgba(255,255,255,.15);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);cursor:pointer;z-index:200;display:flex;align-items:center;justify-content:center;font-size:1.4rem;transition:all .3s ease}.contact-toggle:hover{background:#ff6b3533;border-color:#ff6b3580;box-shadow:0 0 20px #ff6b354d}.sun-click-zone{position:fixed;top:30%;left:40%;width:20%;height:30%;cursor:pointer;z-index:50}.solar-flare{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:100vmax;height:100vmax;background:radial-gradient(circle,rgba(255,200,100,.8) 0%,rgba(255,107,53,.5) 30%,rgba(255,50,0,.3) 60%,transparent 100%);pointer-events:none;z-index:500}.scroll-experience-advanced.mobile{touch-action:pan-y}.mobile-hint{position:fixed;bottom:10%;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:.5rem;color:#ffffff80;font-size:.9rem;z-index:100;animation:bounce 2s ease-in-out infinite}.mobile-hint .swipe-icon{font-size:1.5rem}@keyframes bounce{0%,to{transform:translate(-50%) translateY(0)}50%{transform:translate(-50%) translateY(-10px)}}@media(max-width:768px){.contact-toggle{bottom:1.5rem;left:1.5rem;width:42px;height:42px}.contact-form{padding:1.5rem;margin:1rem}.form-header h2{font-size:1.4rem}.social-links{justify-content:center}}
