:root{--primary-bg: #1a1a1a;--primary-color: #ffffff;--accent: #2ecc71;--card-bg: #252525;--card-radius: 8px;--shadow: 0 2px 8px rgba(0, 0, 0, .2);--transition: .2s cubic-bezier(.4, 0, .2, 1);--timeline-bar: #2ecc71}html{scroll-behavior:smooth;height:100%;overflow-y:auto;scroll-snap-type:y mandatory;scroll-padding-top:80px}html,body{margin:0;padding:0;height:100%;overflow-x:hidden}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,"Segoe UI Emoji","Apple Color Emoji","Noto Color Emoji",sans-serif;margin:0;padding:0;background:var(--primary-bg);color:var(--primary-color);min-height:100%;overflow-x:hidden;position:fixed;width:100%}header{color:#fff;padding:.75rem 0;box-shadow:var(--shadow);position:fixed;top:0;left:0;right:0;z-index:1000;height:50px;background:#1a1a1af2;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid rgba(255,255,255,.05);display:flex;align-items:center;justify-content:center}nav{width:100%;display:flex;justify-content:center}main{width:100%;margin:0 auto;background:var(--primary-bg);height:100vh;overflow-x:hidden;overflow-y:auto;padding-top:50px}nav ul{list-style:none;display:flex;justify-content:center;align-items:center;gap:2rem;margin:0;padding:0;width:100%;max-width:1200px}nav a{color:#fff;text-decoration:none;font-weight:700;transition:color var(--transition);position:relative;overflow:hidden}nav a:after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--accent);transform:scaleX(0);transition:transform .3s cubic-bezier(.4,0,.2,1);transform-origin:left}nav a:hover:after{transform:scaleX(1)}nav a:hover{color:var(--accent)}nav a.active{color:var(--accent)}nav a.active:after{transform:scaleX(1)}section{margin:0;opacity:0;transform:translateY(40px);animation:fadeInUp .8s cubic-bezier(.4,0,.2,1) forwards;animation-delay:.1s;min-height:calc(100vh - 50px);width:100%;padding:0;display:flex;flex-direction:column;align-items:center;justify-content:center;scroll-snap-align:start;scroll-snap-stop:always;position:relative;box-sizing:border-box;overflow-x:hidden;transition:transform .5s cubic-bezier(.4,0,.2,1),opacity .5s cubic-bezier(.4,0,.2,1)}section.active{transform:translateY(0);opacity:1}section.inactive{opacity:.6;pointer-events:none}section:nth-child(odd){background:var(--primary-bg)}section:nth-child(2n){background:var(--card-bg)}section>*{max-width:1200px;width:100%;margin:0 auto}.project-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2rem;padding:2rem 1.5rem 2rem 2rem;width:100%;max-width:1200px;margin:0 auto;max-height:calc(100vh - 200px);overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--accent) rgba(255,255,255,.1);scroll-behavior:smooth;scroll-padding:1rem;-webkit-overflow-scrolling:touch}.project-card{background:var(--card-bg);border-radius:var(--card-radius);box-shadow:var(--shadow);padding:1.5rem;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;flex-direction:column;gap:1rem;position:relative;overflow:hidden;border:1px solid rgba(255,255,255,.1)}.project-card:before{content:"";position:absolute;top:0;left:0;width:100%;height:4px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .3s ease}.project-card:hover:before{transform:scaleX(1)}.project-card:hover{transform:translateY(-8px);box-shadow:0 12px 24px #0000001a}.project-card h3{font-size:1.4rem;margin:0;color:var(--accent)}.project-card p{color:#ccc;line-height:1.6;margin:0;flex-grow:1}.project-card img{max-width:100%;border-radius:4px;margin-bottom:.5rem}.timeline{position:relative;max-width:800px;margin:2rem auto;padding:0 1.5rem}.timeline:before{content:"";position:absolute;left:0;top:0;height:100%;width:4px;background:linear-gradient(180deg,var(--accent) 0%,var(--accent) 100%);border-radius:4px}.timeline-item{position:relative;margin-bottom:1rem;padding-left:0;transition:all .3s ease}.timeline-item h3{font-size:1.3rem;color:var(--accent);margin-bottom:.5rem;cursor:pointer;display:flex;align-items:center;justify-content:space-between;padding-left:1.5rem;padding-right:1rem}.timeline-item h3:after{content:"▼";font-size:.8em;transition:transform .3s ease;color:var(--accent)}.timeline-item strong{display:block;color:var(--primary-color);font-size:1.1rem;margin-bottom:.3rem;padding-left:1.5rem}.timeline-item span{display:inline-block;color:#888;font-size:.9rem;margin-bottom:1rem;padding-left:1.5rem}.timeline-content{max-height:0;overflow:hidden;transition:all .3s ease-in-out;background:#ffffff0d;border-radius:8px;margin-top:.5rem}.timeline-item.expanded .timeline-content{max-height:500px;padding:1rem}.timeline-content ul{list-style:none;padding:0;margin:0}.timeline-content li{position:relative;padding-left:1.5rem;margin-bottom:.8rem;line-height:1.6}.timeline-content li:before{content:"•";color:var(--accent);position:absolute;left:0;font-size:1.2em}.timeline-content p{margin:.5rem 0;line-height:1.6;color:#ccc}.section-content{opacity:0;transform:translateY(20px);transition:opacity .3s ease-out,transform .3s ease-out}.section-content.visible{opacity:1;transform:translateY(0)}section h2{text-align:center;font-size:2.5rem;margin-bottom:3rem;position:relative;color:var(--primary-color);opacity:0;transform:none;transition:opacity .1s ease}section h2.animation-ready{opacity:1}.typing-title{display:inline-block;overflow:hidden;white-space:nowrap;position:relative;max-width:fit-content;opacity:0}.typing-title.typing{opacity:1;width:0;border-right:.15em solid var(--accent);animation:typing 2s steps(30,end) forwards,blink-caret .75s step-end infinite}.typing-title.done{opacity:1;width:100%;border-right:none}@keyframes typing{0%{width:0}to{width:100%}}@keyframes blink-caret{0%,to{border-color:transparent}50%{border-color:var(--accent)}}@media screen and (max-width: 768px){.timeline{padding:0 1rem}.timeline-item{padding-left:0}.timeline-item h3,.timeline-item strong,.timeline-item span{padding-left:1.2rem}.timeline-item h3{font-size:1.1rem}.timeline-item strong{font-size:1rem}section h2{font-size:2rem;margin-bottom:2rem}.timeline-content li{font-size:.95rem}}@media (max-width: 600px){main{padding:.5rem}.project-list{grid-template-columns:1fr}}@media (max-width: 900px){section{padding:1rem;min-height:100vh}}section,.project-card,.timeline-item,.skills-list li{opacity:0;transform:translateY(40px);animation:fadeInUp .8s cubic-bezier(.4,0,.2,1) forwards}section{animation-delay:.1s}.project-card{animation-delay:.2s}.timeline-item{animation-delay:.3s}.skills-list li{animation-delay:.4s}section,.project-card,.timeline-item,.skills-list li{opacity:0;transform:translateY(20px);animation:fadeInUp .6s forwards}@keyframes fadeInUp{to{opacity:1;transform:none}}.intro-section{display:flex;align-items:stretch;min-height:100vh;width:100%;margin:0;padding:0;box-sizing:border-box;background:var(--primary-bg)}.intro-image{flex:1 1 50%;width:50%;min-height:100%;display:flex;justify-content:center;align-items:center;padding:0;box-sizing:border-box;position:relative;overflow:hidden}.intro-bio{flex:1 1 50%;width:50%;display:flex;flex-direction:column;justify-content:center;padding:4rem;box-sizing:border-box;gap:1.5rem;background:var(--primary-bg)}.intro-bio h1{margin:0;font-size:2.5rem;opacity:0;animation:fadeInTitle .6s ease-out forwards;animation-delay:.3s}.wave-emoji{display:inline-block;animation:wave 1.5s ease-in-out 2;animation-delay:1s;transform-origin:70% 70%}@keyframes fadeInTitle{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes wave{0%,to{transform:rotate(0)}10%,30%,50%,70%,90%{transform:rotate(14deg)}20%,40%,60%,80%{transform:rotate(-8deg)}}.intro-bio p{margin:0;line-height:1.6}@media screen and (max-width: 1200px){.intro-section{flex-direction:column;min-height:100vh}.intro-image,.intro-bio{width:100%;flex:none}.intro-image{height:60vh}.intro-bio{padding:3rem 2rem}.intro-bio h1{font-size:2rem;text-align:center;opacity:0;animation:fadeInTitle .6s ease-out forwards;animation-delay:.3s}.intro-image img{height:100%}}@media screen and (max-height: 800px){.intro-section{min-height:100vh;padding:1rem}.intro-image{height:auto;min-height:40vh}}@media (max-width: 900px){.intro-section{flex-direction:column;align-items:center}.intro-image,.intro-bio{max-width:100%;min-width:0}.intro-image{max-width:100%;min-width:0;height:auto}.intro-image img{max-height:350px;aspect-ratio:1/1}}@media (max-width: 800px){.intro-section{flex-direction:column;align-items:center}.intro-bio{max-width:100%;min-width:0}}.intro-image img{width:100%;height:100%;object-fit:cover;border-radius:0;transition:transform .5s cubic-bezier(.4,0,.2,1)}.intro-image img:hover{transform:scale(1.02) rotate(-1deg);box-shadow:0 12px 48px #0003;cursor:pointer}*{scrollbar-width:none;-ms-overflow-style:none}*::-webkit-scrollbar{display:none}.timeline-item .timeline-content{max-height:0;opacity:0;overflow:hidden;transition:max-height .4s cubic-bezier(.4,0,.2,1),opacity .3s cubic-bezier(.4,0,.2,1),margin .3s cubic-bezier(.4,0,.2,1);margin:0;transform-origin:top}.timeline-item.expanded .timeline-content{opacity:1;margin:1rem 0}.timeline-item h3{cursor:pointer;display:flex;align-items:center;gap:.5rem}.timeline-item h3:after{content:"▼";font-size:.8em;transition:transform .3s ease}.timeline-item.expanded h3:after{transform:rotate(180deg)}.timeline-item h3{transition:text-shadow .3s ease;text-shadow:none}.timeline-item h3:hover{text-shadow:0 0 6px rgba(46,204,113,.5),0 0 12px rgba(46,204,113,.3),0 0 18px rgba(46,204,113,.2)}.timeline-item ul{margin:.5rem 0;padding-left:1.2rem;list-style-position:outside}.timeline-item li{margin-bottom:.5rem;line-height:1.4}.timeline-item strong,.timeline-item span{display:inline-block;margin-right:.5rem}.timeline-item h3{margin-bottom:.5rem}.timeline-item p{margin:.5rem 0}.timeline-item.expanded ul{margin:1rem 0}.timeline-item ul,.timeline-item p{width:100%;text-align:left;padding-left:1.2rem;margin:.5rem 0;box-sizing:border-box}.timeline-item strong,.timeline-item span{text-align:left;display:inline-block}.timeline-item h3{width:100%;text-align:left;margin-bottom:.5rem;cursor:pointer}.timeline-item li{text-align:left;margin-bottom:.5rem;line-height:1.4}#contact-form{background:var(--card-bg);padding:2.5rem;border-radius:var(--card-radius);box-shadow:var(--shadow);max-width:600px;width:90%;margin:0 auto;display:flex;flex-direction:column;gap:1.5rem;border:1px solid rgba(255,255,255,.1);position:relative}#contact-form input,#contact-form textarea{width:100%;padding:1rem;border:2px solid #404040;border-radius:var(--card-radius);font-size:1rem;transition:all .3s ease;background:#333;color:#fff;box-sizing:border-box}#contact-form input:focus,#contact-form textarea:focus{border-color:var(--accent);outline:none;box-shadow:0 0 0 3px #ff6b0033}#contact-form textarea{min-height:150px;resize:vertical}#contact-form button{background:var(--accent);color:#fff;padding:1rem 2rem;border:none;border-radius:var(--card-radius);font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease;align-self:flex-start;margin-top:1rem;position:relative;z-index:1;width:auto}#contact-form button i.fa-spin{margin-right:8px;animation:spin 1s linear infinite}#contact-form button:disabled{background:#1a472a;cursor:not-allowed;opacity:.8}#form-message{margin-top:1rem;text-align:center;font-weight:500}section#contact{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4rem 2rem;min-height:calc(100vh - 150px)}.header-title{display:none}@media screen and (max-width: 768px){.header-title{display:block;color:var(--primary-color);font-size:1.2rem;font-weight:650;margin:0;text-align:center;position:absolute;left:52%;transform:translate(-50%);z-index:999}nav ul{display:none;position:fixed;top:60px;left:0;right:0;background:#222222f2;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);flex-direction:column;align-items:flex-start;padding:1rem 0 1rem 2rem;gap:1rem;box-shadow:0 4px 8px #0000001a}nav ul.active{display:flex}nav ul li{width:auto;text-align:left}nav ul li a{display:block;padding:.75rem 1rem .75rem 0;text-align:left;font-size:1.1rem;font-weight:500;transition:color .3s ease,padding-left .3s ease}nav ul li a:hover{padding-left:.5rem;color:var(--accent)}.hamburger{display:block;position:absolute;right:1rem;top:1rem;z-index:1001}body{position:relative;overflow-y:auto}main{width:100%;max-width:100%;margin:0;padding:0;box-shadow:none;border-radius:0}section{padding:5rem 1rem 2rem;width:100%;box-sizing:border-box;min-height:100vh;overflow-x:hidden}.intro-section{padding:1rem;gap:1rem}.intro-image{width:100%;max-width:100%;height:auto;padding:0}.intro-image img{width:100%;max-width:300px;margin:0 auto}.intro-bio{width:100%;max-width:100%;padding:1rem;text-align:center}.skills-list{grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:1rem;padding:1rem}.project-list{grid-template-columns:1fr;padding:1rem;gap:1rem}#contact-form{width:95%;padding:1.5rem;margin:1rem auto}#contact-form button{width:100%;padding:1rem}.social-links{flex-wrap:wrap;justify-content:center}.social-link{flex:1 1 auto;min-width:120px;justify-content:center}.project-card{margin:.5rem 0}.timeline{padding-left:1rem}.timeline-item{padding-left:0}.timeline-item h3,.timeline-item strong,.timeline-item span{padding-left:1.2rem}}@media screen and (max-width: 768px){body{position:relative!important;overflow-y:auto!important;height:auto!important}main{height:auto!important;overflow:visible!important;position:relative!important;padding-top:50px}section#experience,section#education,section#skills,section#projects,section#contact{padding:3rem 1rem}footer{padding:2rem 1rem;margin-top:2rem}section{min-height:100vh;height:auto!important;padding:2rem 1rem!important;overflow:visible!important;box-sizing:border-box}.intro-section{padding-top:80px!important;margin:0;width:100%;box-sizing:border-box}.intro-image{width:100%;max-width:280px!important;margin:0 auto;padding:0}.intro-image img{width:100%;max-width:100%;height:auto;aspect-ratio:3/4;object-fit:cover}.project-list{height:auto!important;max-height:none!important;overflow:visible!important}nav ul{background:#222222f2;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}}@media (hover: none){.social-link:active,.project-card:active,.skills-list li:active{transform:scale(.98)}nav a,.social-link,.timeline-item h3{padding:.8rem;min-height:44px}html{scroll-snap-type:y proximity}section{scroll-snap-align:start;scroll-snap-stop:normal}}body{width:100vw;overflow-x:hidden;position:relative}main{width:100%;overflow-x:hidden}.intro-section,.project-list,.skills-container,.timeline,#contact-form{max-width:min(100%,1200px);width:100%;box-sizing:border-box;margin-left:auto;margin-right:auto}@supports (padding: max(0px)){section{padding-left:max(1rem,env(safe-area-inset-left));padding-right:max(1rem,env(safe-area-inset-right));padding-bottom:max(1rem,env(safe-area-inset-bottom))}header{padding-top:max(1rem,env(safe-area-inset-top))}}.hamburger{display:none;background:transparent;border:none;cursor:pointer;padding:10px;z-index:1000}.hamburger span{display:block;width:25px;height:2px;background-color:var(--primary-color);margin:5px 0;transition:all .3s ease}@media screen and (max-width: 768px){.hamburger{display:block;position:fixed;right:1rem;top:1rem}nav ul{display:none;position:fixed;top:60px;left:0;right:0;background:#222222fa;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:1rem;flex-direction:column;align-items:center;gap:1rem}nav ul.active{display:flex}.hamburger[aria-expanded=true] span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}.hamburger[aria-expanded=true] span:nth-child(2){opacity:0}.hamburger[aria-expanded=true] span:nth-child(3){transform:rotate(-45deg) translate(7px,-6px)}}.social-links{display:flex;gap:1.5rem;margin:1.5rem 0;flex-wrap:wrap}.social-link{display:flex;align-items:center;gap:.5rem;padding:.8rem 1.5rem;background:var(--card-bg);color:var(--primary-color);text-decoration:none;border-radius:var(--card-radius);font-weight:500;transition:all .3s ease;border:1px solid rgba(255,255,255,.1);box-shadow:var(--shadow)}.social-link i{font-size:1.2rem;color:var(--accent)}.social-link:hover{transform:translateY(-3px);background:var(--accent);color:#fff;box-shadow:0 8px 20px #2ecc7133}.social-link:hover i{color:#fff}.action-buttons{display:flex;gap:.5rem;margin-top:1.5rem;flex-wrap:nowrap;align-items:center;justify-content:center;width:100%}.download-btn{width:auto;flex:1;display:inline-flex;align-items:center;justify-content:center;gap:.4rem;padding:.7rem .5rem;background:var(--accent);color:#fff;text-decoration:none;border-radius:8px;font-weight:600;font-size:.9rem;transition:all .3s cubic-bezier(.4,0,.2,1);white-space:nowrap;min-width:0;border:none;box-shadow:0 4px 15px #2ecc7133;position:relative;overflow:hidden;cursor:pointer}@media screen and (max-width: 480px){.download-btn{font-size:.75rem;padding:.6rem .3rem}}.download-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(to right,transparent,rgba(255,255,255,.2),transparent);transition:all .6s ease}.download-btn:hover{transform:translateY(-3px);box-shadow:0 8px 25px #2ecc7166;background:#27ae60}.download-btn:hover:before{left:100%}.download-btn:active{transform:translateY(-1px);box-shadow:0 4px 15px #2ecc714d}.download-btn:after{content:"";font-family:"Font Awesome 6 Free";font-weight:900;margin-left:.5rem;font-size:.9em}.skills-filter-bar{display:flex;gap:.75rem;flex-wrap:wrap;padding:.5rem 1rem;-webkit-overflow-scrolling:touch;scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none;position:relative;justify-content:center;align-items:center;max-width:fit-content}.skills-container{width:100%;padding:1rem;max-width:1200px;margin:0 auto;display:flex;flex-direction:column;align-items:center;overflow-x:hidden}.skills-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:1.5rem;padding:0;list-style:none;margin:0 auto;width:100%;max-width:900px;justify-content:center}.skills-list li{background:var(--card-bg);border:1px solid rgba(255,255,255,.1);border-radius:var(--card-radius);padding:1.25rem 1rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.75rem;transition:all .3s cubic-bezier(.4,0,.2,1);cursor:pointer;position:relative;overflow:hidden}.skills-list li:hover{transform:translateY(-2px);border-color:#fff3;box-shadow:0 4px 20px #0003}.skills-list li img{width:40px;height:40px;object-fit:contain;transition:transform .3s ease}.skills-list li:hover img{transform:scale(1.1)}.skills-list li span{font-size:.9rem;font-weight:500;text-align:center;color:var(--primary-color)}.skills-list li{opacity:0;transform:translateY(20px);animation:fadeInUp .5s ease forwards}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.skills-list li.loading:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.1),transparent);animation:shimmer 1.5s infinite}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}footer{width:100%;padding:2rem;margin-top:4rem;text-align:center;border-top:1px solid rgba(255,255,255,.05)}footer p{color:#ffffffb3;font-size:.9rem;letter-spacing:.5px;text-align:center;margin:0}section#experience,section#education,section#skills,section#projects{padding:4rem 2rem}section>h2{margin-bottom:3rem}.hidden{display:none!important}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.project-buttons{display:flex;gap:.5rem;margin-top:1rem;justify-content:flex-start}.details-btn,.github-btn,.demo-btn{background-color:transparent;border:none;color:#ccc;padding:.5rem;text-decoration:none;transition:color .3s ease,transform .3s ease;cursor:pointer;font-size:1.5rem}.details-btn:hover,.github-btn:hover,.demo-btn:hover{color:var(--accent);transform:scale(1.1)}.github-btn[href="#"]{display:none}.modal{display:none;position:fixed;z-index:1001;left:0;top:0;width:100%;height:100%;background-color:#000000b3;animation:fadeIn .3s ease;overflow:hidden}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal-content{background-color:var(--card-bg);margin:5vh auto;padding:2rem;border:1px solid rgba(255,255,255,.1);width:80%;max-width:900px;max-height:90vh;border-radius:var(--card-radius);position:relative;box-shadow:0 10px 30px #00000080;overflow:hidden;display:block}.close-btn{color:#aaa;position:absolute;top:1rem;right:1.5rem;font-size:2rem;font-weight:700;transition:color .3s ease}.close-btn:hover,.close-btn:focus{color:var(--primary-color);text-decoration:none;cursor:pointer}.modal-body{max-height:calc(90vh - 4rem);overflow:hidden;display:flex;gap:2rem;align-items:flex-start;flex-direction:row;padding:0}.modal-images-container{width:40%;max-height:70vh;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;gap:1rem;scrollbar-width:none;scrollbar-color:var(--accent) rgba(255,255,255,.1);position:relative;padding-bottom:20px}.modal-images-container::-webkit-scrollbar{display:none}body.modal-open{overflow:hidden;position:fixed;width:100%;height:100%;left:0;top:0}.modal-details{width:60%}.modal-details h3{font-size:2rem;color:var(--accent);margin-top:0;margin-bottom:1rem}.modal-details h4{font-size:1.2rem;color:var(--accent);margin-bottom:.5rem;display:inline-block;border-bottom:2px solid var(--accent);padding-bottom:.3rem;min-width:0;max-width:100%}.modal-details p{color:#ccc;line-height:1.7}.tech-stack-container{display:flex;flex-wrap:wrap;gap:1rem;margin-top:.5rem}.tech-item{position:relative;display:flex;align-items:center;gap:.5rem}.tech-item .skill-icon{width:32px;height:32px;transition:transform .3s ease;background-color:transparent!important;border:none!important}.tech-item .skill-name{display:none}.tech-item:hover .skill-name{display:block;position:absolute;bottom:110%;left:50%;transform:translate(-50%);background-color:#333;color:#fff;padding:5px 10px;border-radius:4px;font-size:.85rem;white-space:nowrap;z-index:10}.tech-item:hover .skill-name:after{content:"";position:absolute;top:100%;left:50%;margin-left:-5px;border-width:5px;border-style:solid;border-color:#333 transparent transparent transparent}@media screen and (max-width: 768px){.modal{animation:none!important}.modal-content{width:100%;height:100%;margin:0;padding:0;max-height:100vh;border-radius:0;display:flex;flex-direction:column}.modal-content:before{content:"";display:block;width:36px;height:4px;background:#ffffff40;border-radius:2px;margin:.6rem auto 0}.modal-header{position:sticky;top:0;background:var(--card-bg);padding:1rem;z-index:100;display:flex;align-items:center;justify-content:center;border-bottom:1px solid rgba(255,255,255,.1);position:relative}.modal-header-title{color:var(--accent)!important;font-size:1.5rem!important;font-weight:600!important;margin:0!important;text-align:center!important}.close-btn{position:absolute;right:1rem;top:50%;transform:translateY(-50%);width:40px;height:40px;display:flex;align-items:center;justify-content:center;color:var(--primary-color);font-size:1.5rem;background:transparent;border:none;cursor:pointer;padding:0;transition:color .3s ease;-webkit-tap-highlight-color:transparent}.close-btn:active{color:var(--accent)}.modal-body{flex-direction:column!important;gap:0!important;height:calc(100vh - 60px)!important;overflow-y:auto!important;padding:0!important;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;width:100%!important;box-sizing:border-box!important}.modal-images-section{width:100%!important;order:-1!important;margin-bottom:1.5rem!important;position:relative!important;display:flex!important;flex-direction:column!important;padding:0!important;box-sizing:border-box!important}.modal-images-container{width:100%!important;max-height:45vh!important;min-height:180px!important;overflow-x:auto!important;overflow-y:hidden!important;display:flex!important;flex-direction:row!important;gap:.75rem!important;padding:.75rem!important;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory!important;scrollbar-width:none;-ms-overflow-style:none;box-sizing:border-box!important}.modal-images-container::-webkit-scrollbar{display:none}.modal-images-container img{flex-shrink:0!important;height:42vh!important;width:85vw!important;object-fit:cover!important;object-position:center top!important;border-radius:10px!important;scroll-snap-align:center!important;cursor:pointer;transition:transform .2s ease;background:#ffffff0d!important;border:1px solid rgba(255,255,255,.1)!important;margin-bottom:0!important;box-shadow:0 4px 16px #0006!important}.modal-images-container img:active{transform:scale(.98)}.image-dots{display:flex;justify-content:center;gap:.5rem;margin-top:1rem;padding:.5rem}.image-dot{width:8px;height:8px;border-radius:50%;background:#ffffff4d;cursor:pointer;transition:all .3s ease}.image-dot.active{background:var(--accent);transform:scale(1.2)}.image-nav{display:none!important}.modal-details{width:100%!important;padding:1rem 1.25rem!important;padding-bottom:max(1.5rem,env(safe-area-inset-bottom))!important;box-sizing:border-box!important}.modal-details h3{font-size:1.5rem;margin:0 0 1rem}#modal-repo-section{position:static!important;bottom:auto!important;width:100%!important;margin:0!important;padding:.75rem 1rem!important;border-top:none!important;display:flex!important;justify-content:center!important;gap:.75rem!important;box-sizing:border-box!important;background:transparent!important;z-index:auto!important}.modal-images-section{margin-bottom:0!important}.tech-item .skill-name{display:block!important;position:static!important;transform:none!important;background:transparent!important;color:#ffffffbf!important;font-size:.7rem!important;padding:0!important;white-space:normal!important;text-align:center!important}.tech-stack-container{display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:.75rem;padding:.5rem 0}.tech-item{flex-direction:column!important;align-items:center!important;gap:.25rem!important;text-align:center}.modal.showing{animation:fadeIn .3s ease-out forwards}.modal.hiding{animation:fadeOut .3s ease-out forwards}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}}#modal-repo-section{margin-top:1rem;text-align:center;padding:.5rem;border-top:1px solid rgba(255,255,255,.1);width:100%;display:flex;justify-content:center}#modal-github-link{display:inline-flex;align-items:center;gap:.5rem;background-color:transparent;border:1px solid var(--accent);color:var(--accent);padding:.5rem 1rem;border-radius:var(--card-radius);text-decoration:none;font-weight:700;transition:all .3s ease;cursor:pointer;font-size:.9rem;max-width:fit-content}#modal-github-link i,#modal-demo-link i{font-size:1.3rem}#modal-github-link:hover,#modal-demo-link:hover{background-color:var(--accent);color:var(--primary-bg)}.modal-details h4{font-size:1.2rem;color:var(--accent)}.modal-body.no-images .modal-details{width:100%!important}.modal-body.no-images .modal-images-container{display:none!important}.image-fullscreen-modal{display:none;position:fixed;z-index:2000;left:0;top:0;width:100vw;height:100vh;background:#000000d9;justify-content:center;align-items:center;transition:opacity .2s}.image-fullscreen-modal.active{display:flex}#image-fullscreen-img{max-width:90vw;max-height:90vh;border-radius:12px;box-shadow:0 8px 32px #00000080;background:#222;object-fit:contain}.image-fullscreen-close{position:absolute;top:2rem;right:2.5rem;color:#fff;font-size:2.5rem;font-weight:700;cursor:pointer;z-index:2010;transition:color .2s}.image-fullscreen-close:hover{color:var(--accent)}@media (max-width: 768px){#image-fullscreen-img{max-width:98vw;max-height:70vh}.image-fullscreen-close{top:1rem;right:1.2rem;font-size:2rem}}.skills-filter-bar-container{width:100%;margin-bottom:1.5rem;position:relative;padding:0;display:flex;justify-content:center;overflow:hidden}.skills-filter-bar{display:flex;gap:.75rem;flex-wrap:nowrap;overflow-x:auto;padding:.5rem 0;-webkit-overflow-scrolling:touch;scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none;position:relative;justify-content:flex-start;align-items:center;margin:0 auto;max-width:100%}.skills-filter-bar::-webkit-scrollbar{display:none}.skills-filter-bar:before,.skills-filter-bar:after{content:"";position:absolute;top:0;bottom:0;width:40px;pointer-events:none;opacity:0;transition:opacity .3s ease}.skills-filter-bar:before{left:0;background:linear-gradient(to right,var(--card-bg),transparent)}.skills-filter-bar:after{right:0;background:linear-gradient(to left,var(--card-bg),transparent)}.skills-filter-bar.scroll-start:before{opacity:0}.skills-filter-bar.scroll-end:after{opacity:0}.filter-btn{background:var(--card-bg);color:var(--primary-color);border:1px solid rgba(255,255,255,.1);border-radius:999px;padding:.75rem 1.25rem;font-size:1rem;font-weight:500;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);white-space:nowrap;min-width:max-content;display:flex;align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent}.filter-btn:hover{color:var(--accent);border-color:var(--accent);transform:translateY(-1px)}.filter-btn.active{background:var(--accent);color:var(--primary-bg);border-color:var(--accent);font-weight:600;transform:translateY(-1px);box-shadow:0 4px 12px #ff6b0033}@media screen and (max-width: 768px){.skills-filter-bar-container{padding:0 .5rem;margin-bottom:1rem}.skills-filter-bar{gap:.5rem;padding:.5rem 0;flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;margin:0 auto;max-width:100%}.filter-btn{padding:.625rem 1rem;font-size:.9rem;flex-shrink:0}.skills-container{width:100%;max-width:100%;padding:1rem;overflow-x:hidden}}@media screen and (min-width: 769px){.modal-header-title{display:none!important}.modal-content{display:block;padding:2rem;width:80%;max-width:900px;max-height:90vh;margin:5vh auto;border-radius:var(--card-radius)}.modal-body{display:flex!important;flex-direction:row!important;gap:2rem!important;align-items:flex-start!important;height:auto!important;padding:0!important;overflow:visible!important;width:auto!important;box-sizing:content-box!important}.modal-images-section{position:relative!important;width:40%!important;order:0!important;margin-bottom:0!important;padding:0!important;display:flex!important;flex-direction:column!important}.modal-images-container{width:100%!important;max-height:60vh!important;min-height:auto!important;overflow-y:auto!important;overflow-x:hidden!important;display:flex!important;flex-direction:column!important;gap:1rem!important;padding:0!important;scroll-behavior:smooth;scroll-snap-type:none!important;box-sizing:content-box!important}.modal-images-container img{width:100%!important;height:auto!important;min-width:auto!important;max-width:100%!important;max-height:none!important;object-fit:contain!important;margin-bottom:.5rem!important;scroll-snap-align:none!important;border:none!important;background:transparent!important;flex-shrink:1!important;border-radius:4px!important;box-shadow:none!important}.modal-details{width:60%!important;min-width:0;max-width:100%;padding:0!important;box-sizing:content-box!important}.image-nav,.image-dots{display:none!important}#modal-repo-section{position:static!important;margin-top:1rem!important;margin-bottom:0!important;text-align:center!important;padding:1rem 0!important;border-top:1px solid rgba(255,255,255,.1)!important;width:100%!important;order:1!important;background:transparent!important;z-index:auto!important;left:auto!important;right:auto!important;bottom:auto!important}.modal-images-section{margin-bottom:0!important}#modal-title{color:var(--accent)!important;text-align:left!important;font-size:2rem!important;font-weight:700!important;margin-top:0!important;margin-bottom:1.5rem!important;border-bottom:2px solid var(--accent)!important;padding-bottom:.3rem!important}}.modal-body.no-images .modal-details{width:100%!important;padding:0}.modal-body.no-images .modal-images-container,.modal-body.no-images .modal-images-section{display:none!important}@media screen and (max-width: 768px){.modal{animation:none!important}.modal-content{width:100%;height:100%;margin:0;padding:0;max-height:100vh;border-radius:0;display:flex;flex-direction:column}.modal-body.no-images{padding:1rem}.modal-body.no-images .modal-details{width:100%;padding:0}}.modal-images-section{position:relative;width:40%;display:flex;flex-direction:column}.modal-images-container{width:100%;max-height:60vh;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;gap:1rem;scrollbar-width:none;scrollbar-color:var(--accent) rgba(255,255,255,.1);position:relative;padding-bottom:20px}#modal-repo-section{margin-top:1rem;text-align:center;padding:.5rem;border-top:1px solid rgba(255,255,255,.1);width:100%;display:flex;justify-content:center;gap:1rem}#modal-github-link,#modal-demo-link{display:inline-flex;align-items:center;gap:.5rem;background-color:transparent;border:1px solid var(--accent);color:var(--accent);padding:.5rem 1rem;border-radius:var(--card-radius);text-decoration:none;font-weight:700;transition:all .3s ease;cursor:pointer;font-size:.9rem;max-width:fit-content}.skill-item{transition:opacity .3s ease,transform .3s ease}.skill-image-container{position:relative;width:40px;height:40px;display:flex;align-items:center;justify-content:center}.skill-loading-placeholder{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#ffffff0d;border-radius:4px;z-index:1;animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%{opacity:1}50%{opacity:.5}to{opacity:1}}.skill-loading-placeholder i{color:var(--accent);font-size:1rem}.skill-image{width:40px;height:40px;object-fit:contain;transition:opacity .5s ease,transform .3s ease}.skill-image.loaded{opacity:1;animation:fadeInScale .5s ease forwards}@keyframes fadeInScale{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.skill-fallback{display:flex;flex-direction:column;align-items:center;gap:.75rem}.skill-fallback-icon{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:#2ecc711a;border:2px solid rgba(46,204,113,.3);border-radius:8px;color:var(--accent);font-size:1.2rem}.skill-fallback span{font-size:.9rem;font-weight:500;text-align:center;color:var(--primary-color)}.skills-list li{opacity:0;transform:translateY(20px);transition:opacity .3s ease,transform .3s ease}.skills-list li.visible{opacity:1;transform:translateY(0)}.skills-list li:nth-child(1){animation-delay:0ms}.skills-list li:nth-child(2){animation-delay:50ms}.skills-list li:nth-child(3){animation-delay:.1s}.skills-list li:nth-child(4){animation-delay:.15s}.skills-list li:nth-child(5){animation-delay:.2s}.skills-list li:nth-child(6){animation-delay:.25s}.skills-list li:nth-child(7){animation-delay:.3s}.skills-list li:nth-child(8){animation-delay:.35s}.skills-list li:nth-child(9){animation-delay:.4s}.skills-list li:nth-child(10){animation-delay:.45s}.skill-item{will-change:opacity,transform;transition:opacity .3s ease,transform .3s ease}.skill-image{transition:opacity .2s ease}.skill-image.loading{opacity:0}.skill-image.loaded{opacity:1}.skills-list{transition:opacity .2s ease}@media screen and (max-width: 768px){.skill-image-container,.skill-image,.skill-fallback-icon{width:35px;height:35px}.skill-loading-placeholder i{font-size:.9rem}.skill-fallback-icon{font-size:1rem}.skill-item{transition:opacity .2s ease,transform .2s ease}}