html,body,#root{width:100%;height:100%;margin:0;padding:0;overflow:hidden;background:#050505}*,*:before,*:after{box-sizing:border-box}.project-card-container{width:100%;height:300px;perspective:1200px;cursor:pointer;margin-bottom:40px}.project-card-inner{width:100%;height:100%;background:#19191e00;-webkit-backdrop-filter:blur(0px);backdrop-filter:blur(0px);border:1px solid rgba(255,255,255,0);border-radius:20px;overflow:hidden;position:relative;display:flex;flex-direction:column;box-shadow:none;transform-style:preserve-3d;transition:all .5s cubic-bezier(.25,.8,.25,1)}.project-card-container:hover .project-card-inner{background:#19191e99;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.15);box-shadow:0 20px 50px #00000080}.project-card-inner:after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,#fff0 0% 100%);pointer-events:none;z-index:2;transition:background .5s ease}.project-card-container:hover .project-card-inner:after{background:linear-gradient(135deg,#ffffff1a,#fff0,#ffffff0d)}.project-content-wrapper{position:relative;width:100%;height:100%;padding:30px;display:flex;justify-content:space-between;align-items:center;z-index:10;transform-style:preserve-3d}.project-text-area{flex:1.2;display:flex;flex-direction:column;justify-content:center;height:100%;padding-right:20px;min-width:0;z-index:5;transform:translateZ(50px)}.project-title{font-family:Inter,sans-serif;font-weight:900;font-size:2.5rem;margin:0;line-height:1.1;text-transform:uppercase;letter-spacing:-1px;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.5);transition:color .4s ease,-webkit-text-stroke .4s ease;position:relative;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical}.project-card-container:hover .project-title{color:#fff;-webkit-text-stroke:0px transparent;text-shadow:0 0 20px rgba(255,255,255,.4)}.project-desc-container{overflow:hidden;margin-top:15px}.project-short-desc{font-family:monospace;font-size:.9rem;color:#ffffffe6;line-height:1.6;text-shadow:0 2px 4px rgba(0,0,0,.8);display:-webkit-box;-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}.project-image-area{flex:0 0 45%;height:100%;display:flex;align-items:center;justify-content:center;position:relative;transform:translateZ(20px);padding-left:20px}.project-image{width:100%;height:100%;object-fit:cover;border-radius:16px;box-shadow:0 10px 30px #00000080}.delay-3{animation-delay:.3s}.delay-4{animation-delay:.4s}.delay-5{animation-delay:.5s}.delay-6{animation-delay:.6s}.mb-20{margin-bottom:20px}.education-desc{margin-top:12px;font-size:14px;opacity:.8}.title-name{font-size:36px;font-weight:800;color:#fff;margin:0 0 8px;letter-spacing:-1px}.title-role{font-size:15px;color:#ffffff80;margin:0;font-weight:500;letter-spacing:.5px}.exp-info{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px}.company-title{font-size:18px;font-weight:700;color:#fff;margin:0}.role-subtitle{font-size:14px;color:#ffffff73;margin:4px 0 0}.period-badge{font-size:11px;color:#ffffff80;font-family:monospace;background:#ffffff0f;padding:5px 10px;border-radius:8px;transition:all .3s}.interactive-card:hover .period-badge{background:#ffffff1f;color:#fff}.highlights-list{margin:15px 0 0;padding-left:20px}.highlights-list li{font-size:14px;color:#fff9;margin-bottom:8px;line-height:1.6;transition:color .3s}.interactive-card:hover .highlights-list li{color:#ffffffd9}.skills-container-full{display:flex;flex-direction:column;gap:24px;padding:4px}.skill-category-block{width:100%;transition:all .3s ease}.skill-cat-label{font-size:11px;font-weight:800;color:#ffffff4d;margin-bottom:12px;text-transform:uppercase;letter-spacing:2px}.pill-wrapper{display:flex;flex-wrap:wrap;gap:8px}.skill-pill{display:flex;align-items:center;gap:8px;font-size:12px;color:#ffffffd9;font-weight:500;background:#ffffff0a;border:1px solid rgba(255,255,255,.08);padding:6px 14px;border-radius:100px;transition:all .3s cubic-bezier(.175,.885,.32,1.275);cursor:default}.pill-icon{display:flex;align-items:center;font-size:14px}.skill-pill:hover{background:#ffffff1f;border-color:#ffffff4d;transform:scale(1.1) translateY(-2px);color:#fff;box-shadow:0 5px 15px #0003}.lang-container{display:flex;gap:14px;flex-wrap:wrap}.lang-item{padding:12px 20px;display:flex;align-items:center;justify-content:space-between;gap:15px;cursor:default}.lang-item:hover{background:#ffffff14;border-color:#fff3}.lang-main{display:flex;align-items:center;gap:12px}.lang-icon{font-size:18px;display:flex;align-items:center}.lang-name{font-size:15px;color:#fff;font-weight:600}.lang-lvl{opacity:.5;font-size:11px;font-weight:700;background:#ffffff1a;padding:3px 8px;border-radius:5px;color:#fff}.project-detail-root{width:100%;flex:1;display:flex;flex-direction:column;padding-bottom:0;overflow:hidden;min-height:0}.pd-hero{position:relative;width:100%;height:clamp(160px,28vh,260px);flex-shrink:0;border-radius:20px;overflow:hidden;margin-bottom:24px;border:1px solid rgba(255,255,255,.1)}.pd-hero-img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s ease}.pd-hero:hover .pd-hero-img{transform:scale(1.04)}.pd-hero-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(5,5,5,.65) 0%,transparent 60%);pointer-events:none}.pd-title{font-size:2.2rem;font-weight:800;color:#fff;margin:0;letter-spacing:-1px;line-height:1.1;flex-shrink:0}.pd-pills{display:flex;flex-wrap:wrap;gap:8px}.pd-grid{display:grid;grid-template-columns:1fr 240px;gap:32px;align-items:stretch;margin-top:10px;flex:1;min-height:0}@media(max-width:720px){.pd-grid{grid-template-columns:1fr}.pd-title{font-size:1.6rem}}.pd-description-col,.pd-links-col{padding-top:16px;padding-right:10px;overflow-y:auto;overflow-x:hidden}.pd-description-col{display:flex;flex-direction:column;gap:18px}.pd-description-col::-webkit-scrollbar,.pd-links-col::-webkit-scrollbar{width:5px}.pd-description-col::-webkit-scrollbar-track,.pd-links-col::-webkit-scrollbar-track{background:#ffffff0a;border-radius:10px}.pd-description-col::-webkit-scrollbar-thumb,.pd-links-col::-webkit-scrollbar-thumb{background:#ffffff26;border-radius:10px}.pd-description{text-align:justify;margin:0}.pd-links-col{display:flex;flex-direction:column;gap:12px}.pd-link-btn{display:flex;align-items:center;justify-content:center;gap:10px;padding:14px 20px;border-radius:14px;font-size:.95rem;font-weight:700;text-decoration:none;border:1px solid transparent;transition:background .25s ease,color .25s ease,border-color .25s ease;cursor:pointer}.pd-link-btn.github{background:#1b1f23;color:#fff;border-color:#ffffff1f}.pd-link-btn.github:hover{background:#24292e;border-color:#ffffff4d}.pd-link-btn.gitlab{background:#e24329;color:#fff;border-color:#ffffff1a}.pd-link-btn.gitlab:hover{background:#f0522e}.pd-link-btn.live{background:#ffffff14;color:#fff;border-color:#fff3}.pd-link-btn.live:hover{background:#fff;color:#000}.pd-live-wrapper{position:relative;display:inline-flex;flex-direction:column}.pd-link-btn.live.locked{background:#ff000026;color:#ff6b6b;border-color:#f006;cursor:not-allowed;animation:shake .5s cubic-bezier(.36,.07,.19,.97) both}.pd-speech-bubble{position:fixed;width:max-content;max-width:250px;z-index:999999;pointer-events:none;filter:drop-shadow(0 8px 16px rgba(0,255,128,.25))}.pd-speech-bubble:after{content:"";position:absolute;bottom:-8px;left:50%;transform:translate(-50%);width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-top:10px solid rgba(0,255,128,.9)}.pd-bubble-content{background:linear-gradient(135deg,#00ff80e6,#00c864f2);color:#000;font-weight:800;font-size:.9rem;padding:12px 18px;border-radius:16px;box-shadow:0 4px 15px #0000004d,inset 0 2px 4px #fff6;border:1px solid rgba(255,255,255,.4);text-align:center;line-height:1.4;text-shadow:0 1px 2px rgba(255,255,255,.4);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}@keyframes shake{10%,90%{transform:translate3d(-1px,0,0)}20%,80%{transform:translate3d(2px,0,0)}30%,50%,70%{transform:translate3d(-4px,0,0)}40%,60%{transform:translate3d(4px,0,0)}}.wiggle-anim{animation:bubbleWiggle .35s ease-in-out}@keyframes bubbleWiggle{0%{transform:translate(-50%) rotate(0) scale(1)}25%{transform:translate(-50%) rotate(-5deg) scale(1.05)}50%{transform:translate(-50%) rotate(5deg) scale(1.05)}75%{transform:translate(-50%) rotate(-5deg) scale(1.05)}to{transform:translate(-50%) rotate(0) scale(1)}}.project-list-container{width:100%;flex:1;display:flex;flex-direction:column;min-height:0}.delay-1{animation-delay:.1s}.delay-2{animation-delay:.2s}.social-card{flex:1}.social-item.gitlab .social-icon{color:#fc6d26}.contact-container{display:grid;grid-template-columns:1fr 1fr;gap:clamp(15px,4vh,40px);padding:clamp(5px,1vh,10px);align-items:stretch}@media(max-width:820px){.contact-container{grid-template-columns:1fr}}.social-card{height:100%}.contact-message-block{display:flex;flex-direction:column;gap:clamp(15px,3vh,30px);height:100%;justify-content:center}.contact-message-text{font-size:clamp(.95rem,1.8vh,1.2rem);line-height:clamp(1.4,2.5vh,1.8);color:#ffffffd9;margin:0;transition:color .3s ease}.contact-message-text:hover{color:#fff}.whatsapp-wrapper{margin-top:clamp(10px,2vh,20px)}.whatsapp-btn{display:inline-flex;align-items:center;justify-content:center;gap:clamp(8px,1.5vh,12px);background:#25d366;color:#fff;text-decoration:none;padding:clamp(12px,2vh,18px) clamp(16px,2.5vw,24px);border-radius:16px;font-weight:700;font-size:clamp(.9rem,1.8vh,1.1rem);transition:all .3s cubic-bezier(.175,.885,.32,1.275);align-self:flex-start;box-shadow:0 4px 15px #25d3664d}.whatsapp-btn:hover{background:#20bd5a;transform:translateY(-4px) scale(1.02);box-shadow:0 10px 25px #25d36680;color:#fff}.whatsapp-icon{font-size:1.5rem}.social-links-grid{display:grid;grid-template-columns:1fr;gap:clamp(8px,1.2vh,12px);margin-top:clamp(5px,1vh,10px)}.social-item{display:flex;align-items:center;gap:clamp(10px,1.5vh,15px);padding:clamp(12px,1.8vh,18px);background:#19191e66;border:1px solid rgba(255,255,255,.08);border-radius:16px;text-decoration:none;color:#fff;cursor:pointer;transition:all .3s ease;width:100%;font-family:inherit;text-align:left}.social-item:hover{background:#ffffff14;border-color:#fff3;transform:translate(8px)}.social-item:hover .social-text h4{color:#fff}.social-item:hover .social-text p{color:#ffffffe6}.social-icon{font-size:24px;display:flex;align-items:center;transition:transform .3s ease}.social-item:hover .social-icon{transform:scale(1.1) rotate(5deg)}.social-text h4{margin:0;font-size:clamp(12px,1.5vh,14px);font-weight:600;transition:color .3s ease}.social-text p{margin:4px 0 0;font-size:clamp(10px,1.2vh,12px);color:#ffffff80;transition:color .3s ease}.copy-mini-btn{position:absolute;right:15px;top:50%;transform:translateY(-50%);background:transparent;border:none;color:#fff6;cursor:pointer;padding:10px;border-radius:8px;transition:all .2s ease;display:flex;align-items:center;justify-content:center;font-size:16px}.copy-mini-btn:hover{background:#ffffff1a;color:#fff}.copy-mini-btn.copied{color:#4caf50;pointer-events:none}@keyframes glassOpen{0%{opacity:0;transform:scale(.95) translateY(20px)}to{opacity:1;transform:scale(1) translateY(0)}}@keyframes fadeUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.panel-overlay{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;z-index:100;background:#0000}.panel-wrapper{position:relative;animation:glassOpen .6s cubic-bezier(.16,1,.3,1) forwards}.back-arrow-btn{position:absolute;top:clamp(10px,2vh,20px);left:clamp(-60px,calc(-8vw + 10px),-10px);width:clamp(32px,3.5vw,44px);height:clamp(32px,3.5vw,44px);display:flex;align-items:center;justify-content:center;background:#19191e99;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);border-radius:12px;color:#fff9;font-size:clamp(14px,1.5vw,20px);cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);will-change:transform;z-index:20}.back-arrow-btn:hover{background:#282832cc;color:#fff;transform:scale(1.1) translate(-5px);border-color:#ffffff40;box-shadow:0 0 15px #ffffff1a}.title-label{position:absolute;top:0;left:50%;transform:translate(-50%) translateY(-50%);background:#19191ed9;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.15);border-radius:10px;padding:10px 32px;font-family:monospace;font-size:13px;color:#fff;letter-spacing:4px;white-space:nowrap;will-change:transform;z-index:10;animation:fadeIn .4s ease-out forwards;box-shadow:0 4px 20px #0006}.glass-panel{width:clamp(820px,80vw,920px);height:clamp(400px,75vh,680px);display:flex;flex-direction:column;background:transparent;border:1px solid rgba(255,255,255,.12);border-radius:clamp(16px,3vw,28px);overflow:hidden;will-change:transform;box-shadow:0 25px 50px -12px #00000080;margin-top:0}.glass-body{flex:1;overflow-y:auto;padding:40px;font-family:Inter,-apple-system,sans-serif;scroll-behavior:smooth;display:flex;flex-direction:column}.glass-body::-webkit-scrollbar{width:6px}.glass-body::-webkit-scrollbar-track{background:transparent}.glass-body::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:10px;transition:background .3s}.glass-body::-webkit-scrollbar-thumb:hover{background:#ffffff40}.content-fade{display:flex;flex-direction:column;flex:1;min-height:0}.glass-card{background:#19191e8c;backdrop-filter:blur(25px);-webkit-backdrop-filter:blur(25px);border:1px solid rgba(255,255,255,.08);border-radius:20px;padding:28px;margin-bottom:24px;transition:all .4s cubic-bezier(.165,.84,.44,1);position:relative;overflow:hidden;opacity:0;color:#fff}.content-fade.show .glass-card{animation:fadeUp .8s cubic-bezier(.16,1,.3,1) forwards}.hover-lift:hover{transform:translateY(-8px) scale(1.01);background:#23232da6;border-color:#ffffff26;box-shadow:0 15px 35px #0000004d,0 0 20px #ffffff05}.glass-card-small{background:#ffffff08;border:1px solid rgba(255,255,255,.06);border-radius:16px;padding:20px;transition:all .3s ease;color:#fff}.interactive-card:hover{background:#ffffff0f;border-color:#ffffff1f;transform:translate(5px)}.card-label{font-size:13px;font-family:monospace;color:#ffffff59;margin:0 0 20px;letter-spacing:1.5px;text-transform:uppercase;transition:all .3s ease}.glass-card:hover .card-label{color:#ffffffd9;letter-spacing:2px;transform:translate(4px)}.card-text{font-size:15px;line-height:1.8;color:#ffffffa6;margin:0;text-align:justify;transition:color .3s ease}.glass-card:hover .card-text{color:#fffffff2}@keyframes blink{0%,to{opacity:1}50%{opacity:.3}}@keyframes slowBlink{0%,to{opacity:1}50%{opacity:.4}}.overlay-container{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:10}.splash-prompt-wrapper{display:flex;align-items:center;justify-content:center;height:100%;padding-top:20vh}.splash-prompt-text{font-family:monospace;color:#ffffffb3;font-size:14px;letter-spacing:1px;animation:blink 1.5s infinite}.animated-header{position:absolute;font-family:monospace;z-index:25;pointer-events:none;transition:all .4s cubic-bezier(.4,0,.2,1)}.animated-header.sidebar-position{top:60px;left:40px}.animated-header.mini-position{top:20px;left:25px}.animated-header h1{margin:0;font-weight:400;letter-spacing:2px;transition:all .4s cubic-bezier(.4,0,.2,1)}.animated-header.sidebar-position h1{font-size:32px;color:#fff;text-shadow:0 0 10px rgba(255,255,255,.5)}.animated-header.mini-position h1{font-size:22px;color:#fff;text-shadow:0 0 10px rgba(255,255,255,.9),0 0 20px rgba(255,255,255,.6),0 0 30px rgba(255,255,255,.3)}.system-text{font-size:12px;display:block;margin-top:5px;transition:all .4s cubic-bezier(.4,0,.2,1)}.sidebar-position .system-text{opacity:.5;color:#fff}.mini-position .system-text{opacity:1;color:#fff9}.section-name{color:#fff;text-shadow:0 0 10px rgba(255,255,255,.8);animation:slowBlink 2s ease-in-out infinite}.menu-sidebar{position:absolute;top:0;left:0;height:100%;width:300px;padding:160px 40px 60px;font-family:monospace;pointer-events:auto;display:flex;flex-direction:column;gap:40px;background:linear-gradient(90deg,rgba(0,0,0,.8) 0%,transparent 100%);z-index:20;transition:opacity .3s,transform .3s}.menu-sidebar.hidden{opacity:0;pointer-events:none;transform:translate(-20px)}.nav-wrapper{display:flex;flex-direction:column;gap:20px}.nav-link{font-size:18px;text-decoration:none;color:#fff6;transition:all .2s;display:flex;align-items:center;gap:10px;cursor:pointer}.nav-link:hover{color:#fff;text-shadow:0 0 8px rgba(255,255,255,.8);padding-left:10px}.nav-arrow{font-size:12px;opacity:.3}.content-panel-wrapper{height:100%}.lang-toggle-wrapper{position:absolute;bottom:32px;right:32px;pointer-events:auto;z-index:25;transition:opacity .3s ease,transform .3s ease}.lang-toggle-wrapper.hidden{opacity:0;pointer-events:none;transform:translateY(8px)}.lang-toggle-btn{display:flex;align-items:center;gap:8px;background:#141418b3;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.12);border-radius:10px;padding:10px 16px;cursor:pointer;font-family:monospace;font-size:13px;letter-spacing:2px;color:#ffffff59;transition:all .25s ease}.lang-toggle-btn:hover{border-color:#ffffff4d;background:#1e1e26d9;color:#fff9}.lang-option{transition:color .25s ease,text-shadow .25s ease}.lang-option.active{color:#fff;text-shadow:0 0 8px rgba(255,255,255,.8)}.lang-divider{opacity:.2}.resolution-warning-container{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#050505;color:#fff;display:flex;align-items:center;justify-content:center;font-family:monospace;z-index:9999;overflow:hidden;text-align:center}.resolution-warning-content{display:flex;flex-direction:column;align-items:center;gap:20px;max-width:80%;z-index:2;padding:30px;border:1px solid rgba(255,0,0,.3);background:#14000080;border-radius:8px;box-shadow:0 0 30px #ff00001a}.resolution-warning-icon{font-size:4rem;color:#f33;animation:blink-warning 1s infinite alternate}.resolution-warning-content h2{font-size:2rem;margin:0;color:#f33;letter-spacing:4px;text-shadow:0 0 10px rgba(255,0,0,.5)}.resolution-warning-prompt{font-size:1rem;color:#fffc;min-height:1.5rem;letter-spacing:1px;white-space:pre-wrap;text-align:center;line-height:1.5}.cursor-blink{animation:blink-cursor 1s step-end infinite;font-weight:700}.scanlines{position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(to bottom,#fff0,#fff0 50%,#0003 50%,#0003);background-size:100% 4px;pointer-events:none;z-index:3;opacity:.4}@keyframes blink-warning{0%{opacity:.5}to{opacity:1;text-shadow:0 0 20px rgba(255,0,0,.8)}}@keyframes blink-cursor{0%,to{opacity:1}50%{opacity:0}}