:root{--font-heading: "Outfit", "Plus Jakarta Sans", sans-serif;--font-body: "Inter", system-ui, -apple-system, sans-serif}[data-theme=dark]{--color-primary: #00d2ff;--color-primary-dark: #3a7bd5;--color-primary-light: #70e1f5;--bg-primary: #050914;--bg-gradient: var(--bg-primary);--bg-secondary: #0a1128;--bg-tertiary: rgba(5, 9, 20, .7);--bg-card: rgba(10, 17, 40, .4);--bg-overlay: rgba(2, 4, 10, .85);--text-primary: #ffffff;--text-secondary: #a0aec0;--text-tertiary: #718096;--text-accent: #00d2ff;--border-primary: rgba(255, 255, 255, .1);--border-secondary: rgba(0, 210, 255, .15);--border-tertiary: rgba(255, 255, 255, .05);--shadow-glow: 0 0 30px rgba(0, 210, 255, .1), inset 0 0 20px rgba(0, 210, 255, .05);--shadow-glow-light: 0 4px 20px rgba(0, 0, 0, .5), inset 0 1px 0 rgba(255, 255, 255, .1);--shadow-card: 0 15px 35px rgba(0, 0, 0, .5);--navbar-bg: rgba(5, 9, 20, .6);--navbar-border: rgba(255, 255, 255, .05);--mesh-color: rgba(0, 210, 255, .03);--color-danger: #ef4444;--color-github: #e2e8f0;--color-linkedin: #6366f1}[data-theme=light]{--color-primary: #0077b6;--color-primary-dark: #023e8a;--color-primary-light: #0096c7;--bg-primary: #ffffff;--bg-gradient: linear-gradient(135deg, #f8fafc 0%, #e6f4fc 50%, #c4e1f7 100%);--bg-secondary: #f8fafc;--bg-tertiary: rgba(255, 255, 255, .95);--bg-card: #ffffff;--bg-overlay: rgba(241, 245, 249, .9);--text-primary: #1e293b;--text-secondary: #475569;--text-tertiary: #64748b;--text-accent: #0077b6;--border-primary: rgba(0, 0, 0, .08);--border-secondary: rgba(0, 119, 182, .2);--border-tertiary: rgba(0, 0, 0, .04);--shadow-glow: 0 10px 25px -5px rgba(0, 119, 182, .1), 0 8px 10px -6px rgba(0, 119, 182, .1);--shadow-glow-light: 0 4px 15px rgba(0, 0, 0, .05);--shadow-card: 0 10px 20px rgba(0, 0, 0, .06);--navbar-bg: rgba(255, 255, 255, .85);--navbar-border: rgba(0, 0, 0, .05);--mesh-color: rgba(0, 119, 182, .04);--color-danger: #dc2626;--color-github: #0f172a;--color-linkedin: #4f46e5}html,body{margin:0;padding:0;font-family:var(--font-body);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:var(--bg-gradient, var(--bg-primary));color:var(--text-primary);line-height:default;transition:background .3s ease,color .3s ease}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);font-weight:700;letter-spacing:-.02em;line-height:1.2}.App{background:var(--bg-gradient, var(--bg-primary));color:var(--text-primary);min-height:100vh;transition:background .3s ease,color .3s ease}.centered-panel{background-color:var(--bg-tertiary);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--border-primary);box-shadow:var(--shadow-glow);color:var(--text-primary);transition:all .4s cubic-bezier(.175,.885,.32,1.275)}.holographic-card{background:var(--bg-card);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--border-primary);border-top:1px solid rgba(255,255,255,.2);border-left:1px solid rgba(255,255,255,.1);box-shadow:var(--shadow-glow-light);color:var(--text-primary)!important;transition:all .4s cubic-bezier(.25,1,.5,1);overflow:hidden;position:relative;z-index:1}.holographic-card:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at top right,rgba(0,210,255,.05),transparent 50%),radial-gradient(circle at bottom left,rgba(58,123,213,.05),transparent 50%);z-index:-1;pointer-events:none;opacity:.5;transition:opacity .4s ease}[data-theme=light] .holographic-card{border-top:1px solid rgba(0,0,0,.05);border-left:1px solid rgba(0,0,0,.02)}.holographic-card:hover{transform:translateY(-5px);box-shadow:0 20px 40px #0003,inset 0 0 20px #00d2ff0d;border-color:var(--border-secondary)}.holographic-card:hover:before{opacity:1}.holographic-card h3{color:var(--text-accent)!important}.holographic-card p{color:var(--text-tertiary)!important}a{color:var(--color-primary);text-decoration:none;transition:color .3s ease}a:hover{color:var(--color-primary-light);text-decoration:underline}button{transition:all .3s ease}.techno-mesh{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;background-image:linear-gradient(to right,var(--mesh-color) 1px,transparent 1px),linear-gradient(to bottom,var(--mesh-color) 1px,transparent 1px);background-size:120px 120px;animation:meshMove 30s linear infinite;z-index:-1;transition:background-image .3s ease}@keyframes meshMove{0%{background-position:0 0}to{background-position:120px 120px}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.spin-animation{animation:spin 15s linear infinite}@keyframes secure-ping-btn{0%{background:#ff00002e}50%{background:#ff00000d}to{background:#ff00002e}}.MuiAppBar-root{background-color:var(--navbar-bg)!important;backdrop-filter:blur(12px)!important;-webkit-backdrop-filter:blur(12px)!important;border-bottom:1px solid var(--navbar-border)!important;background-image:none!important;box-shadow:0 4px 30px #0000001a!important;transition:all .3s ease!important}.parallax-section{min-height:500px;display:flex;align-items:center;text-align:center;width:100%}.contact-section{min-height:500px;display:flex;flex-direction:row;justify-content:space-around;align-items:center;text-align:center;width:100%;padding:6rem 0}.navbar-container{display:flex;margin-top:2em;margin-bottom:2em;width:70%;opacity:1;position:sticky}@media(max-width:850px){html,body{width:100vw!important;overflow-x:hidden!important}.MuiAppBar-root{width:100vw!important;left:0!important;translate:none!important;border-radius:0!important;min-width:0!important;transform:scale(1)!important}.App{padding:0!important;align-items:stretch!important;width:100%!important}.main-content-container{width:100vw!important;max-width:100vw!important;border-radius:0!important;padding:.5rem!important}.centered-panel{width:100vw!important;border-radius:0!important;padding:.5rem!important;margin:0!important}.parallax-section{width:100vw!important;border-radius:0!important;padding:0!important;text-align:center}.contact-section{text-align:center}.navbar-container{width:100%}.map,.contact{padding-left:1em;padding-right:1em;flex-direction:column}.logo-linkedin,.logo-github{display:none!important}}.flex-direction-column{flex-direction:column}.align-items-center{align-items:center}.min-height-100vh{min-height:100vh}.padding-20px{padding:20px}.width-100{width:100%}.main-content-container{width:80%;max-width:1200px;background-color:var(--bg-overlay);border-radius:10px;padding:20px;position:relative;box-shadow:var(--shadow-glow-light);transition:all .3s ease}[data-theme=dark] .theme-icon{filter:brightness(0) invert(1)}[data-theme=light] .theme-icon{filter:none}[data-theme=light] .light-theme-dark-icon{filter:brightness(0)}[data-theme=dark] .light-theme-dark-icon{filter:none}html{scroll-behavior:smooth}.container{max-width:1200px;margin:0 auto;padding:0 1rem}.centered-panel{width:50%;margin:0 auto;display:flex;flex-direction:column;padding:1.5rem;border-radius:15px;opacity:1;transition:opacity .3s ease-out,transform .3s ease-out}.animated-bg-container{position:fixed;top:0;left:0;width:100vw;height:100vh;overflow:hidden;z-index:-2;pointer-events:none;background:var(--bg-gradient, var(--bg-primary))}.techno-mesh{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;background-image:linear-gradient(to right,var(--mesh-color) 1px,transparent 1px),linear-gradient(to bottom,var(--mesh-color) 1px,transparent 1px);background-size:120px 120px;animation:meshMove 30s linear infinite;z-index:-1;transition:background-image .3s ease;will-change:background-position;contain:strict}.ambient-glow{position:absolute;width:60vw;height:60vw;background:radial-gradient(circle,var(--color-primary) 0%,transparent 60%);border-radius:50%;opacity:.15;filter:blur(80px);z-index:-1;pointer-events:none;animation:floatOrb 25s infinite alternate ease-in-out;will-change:transform;transform:translateZ(0)}.ambient-glow.top-left{top:-20vw;left:-20vw;background:radial-gradient(circle,var(--color-primary-dark) 0%,transparent 60%)}.ambient-glow.bottom-right{bottom:-20vw;right:-20vw;background:radial-gradient(circle,#00d2ff 0%,transparent 60%);animation-delay:-10s}@keyframes floatOrb{0%{transform:translate(0) scale(1)}33%{transform:translate(10vw,5vw) scale(1.1)}66%{transform:translate(-5vw,15vw) scale(.9)}to{transform:translate(5vw,-10vw) scale(1.05)}}.floating-icon-wrapper{position:absolute;animation-name:floating-icon;animation-iteration-count:infinite;animation-timing-function:ease-in-out;display:flex;align-items:center;justify-content:center;filter:drop-shadow(0px 10px 10px rgba(0,0,0,.1));will-change:transform;transform:translateZ(0)}@keyframes floating-icon{0%{transform:translateY(0) rotate(0)}33%{transform:translateY(-20px) rotate(5deg) scale(1.05)}66%{transform:translateY(15px) rotate(-5deg) scale(.95)}to{transform:translateY(0) rotate(0)}}.MuiAppBar-root{transition:transform .3s cubic-bezier(.4,0,.2,1),width .3s cubic-bezier(.4,0,.2,1)!important}@keyframes fadeUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.animate-fade-up{animation:fadeUp 1s cubic-bezier(.16,1,.3,1) forwards;opacity:0}.delay-100{animation-delay:.1s}.delay-200{animation-delay:.2s}.delay-300{animation-delay:.3s}.delay-400{animation-delay:.4s}.delay-500{animation-delay:.5s}.delay-600{animation-delay:.6s}@media(max-width:768px){.techno-mesh{animation:none}.ambient-glow{filter:none;animation:none;opacity:.05}.animate-fade-up{animation:none!important;opacity:1!important;transform:none!important}}@media(max-width:480px){html,body{font-size:15px;overflow-x:hidden}h1{font-size:1.9rem!important;line-height:1.15!important}h2{font-size:1.5rem!important;line-height:1.2!important}h3{font-size:1.2rem!important}p{font-size:.95rem!important;line-height:1.65!important}.parallax-section.navbar{padding-top:110px!important;padding-left:16px!important;padding-right:16px!important;align-items:flex-start!important}.MuiAppBar-root{width:90%!important;left:5%!important;top:12px!important;border-radius:50px!important;transform:none!important;translate:none!important}.projects{padding:.5em 0!important}.projects .swiper-slide{height:auto!important;min-height:380px!important;padding-bottom:2.5rem!important}.grid.grid-cols-2{grid-template-columns:repeat(2,1fr)!important;gap:1rem!important}#contacto .MuiBox-root{padding:1.5rem 1rem!important;border-radius:16px!important}}@media(max-width:768px){html,body{width:100vw!important;overflow-x:hidden!important}.parallax-section{flex-direction:column!important;align-items:center!important;padding:16px 12px!important;width:100%!important;box-sizing:border-box!important}.contact-section{flex-direction:column!important;padding:3rem 12px!important;gap:1.5rem!important}.parallax-section.navbar{padding-top:120px!important;padding-left:20px!important;padding-right:20px!important;align-items:flex-start!important}.MuiAppBar-root{width:92%!important;left:4%!important;top:14px!important;border-radius:50px!important;transform:none!important;translate:none!important;min-width:0!important}.centered-panel{width:94%!important;margin:12px auto!important;border-radius:20px!important;padding:1.5rem 1.25rem!important}.holographic-card{border-radius:16px!important}.projects{padding:.75em 0 50px!important}.projects .swiper-slide{height:auto!important;min-height:400px!important;width:88%!important;padding-bottom:2.5rem!important}.projects .swiper-slide>div{border-radius:16px!important}.projects .swiper-button-next,.projects .swiper-button-prev{display:none!important}.App{width:100%!important;overflow-x:hidden!important;padding:0!important}.main-content-container{width:100vw!important;max-width:100vw!important;border-radius:0!important;padding:.5rem!important;box-sizing:border-box!important}h2{font-size:1.7rem!important}h3{font-size:1.15rem!important}p{font-size:1rem!important;line-height:1.65!important}#contacto{width:100%!important;padding:0 12px!important}#contacto .MuiBox-root{max-width:100%!important;width:100%!important;border-radius:16px!important;padding:1.75rem 1.25rem!important;box-sizing:border-box!important}.footer-section{text-align:center!important;padding:1.5rem 1rem!important}.logo-linkedin,.logo-github{display:none!important}}@media(min-width:769px)and (max-width:1023px){.projects .swiper-slide{min-height:440px!important}.grid.grid-cols-1.md\:grid-cols-2{gap:1.5rem!important}h2{font-size:2.2rem!important}.main-content-container{width:92%!important}}@media(min-width:1024px){.grid.grid-cols-2.md\:grid-cols-4{grid-template-columns:repeat(4,1fr)!important}}@media(min-width:1440px){.main-content-container{max-width:1300px!important}html{font-size:17px}}