:root{--fade-end-day: rgba(224, 228, 235, 1);--fade-end-night: rgba(27, 31, 38, 1);font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;padding:0;margin:0}.day-mode{background:linear-gradient(to bottom,#90dffe,#38a3d1);transition:background .6s ease,color .6s ease;color:#000}.night-mode{background:linear-gradient(to bottom,#020e18,#020e18cc,#020e1880),url(https://www.shutterstock.com/image-vector/starry-night-sky-star-constellations-600nw-1901997355.jpg);background-repeat:repeat;background-size:auto;transition:background .6s ease,color .6s ease;color:#fff}.loading-screen{display:flex;justify-content:center;align-items:center;height:100vh;background-color:#1b1f26;color:#fff}.loading-content{display:flex;flex-direction:column;align-items:center;justify-content:center}.spinner{width:50px;height:50px;border:5px solid rgba(255,255,255,.3);border-top:5px solid white;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.framework-list{display:flex;justify-content:center;align-items:center;gap:20px;padding:0;list-style:none;flex-wrap:wrap}.framework-box{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:10px;border:1px solid #e0e4eb;border-radius:8px;box-shadow:2px 4px 8px #0000001a;transition:box-shadow .3s ease;width:120px;height:120px;text-align:center}.framework-box:hover{box-shadow:4px 6px 12px #0003}.framework-logo{font-size:40px;margin-bottom:10px}.App{display:flex;justify-content:center;min-height:100vh}.content-wrapper{position:relative;display:flex;flex-direction:column;width:100%;box-sizing:border-box;overflow:hidden;transition:background-color .6s ease,box-shadow .6s ease,border-left .6s ease,border-right .6s ease;padding:0}.day-mode .content-wrapper{background-color:#e0e4eb;box-shadow:0 4px 8px #0003;border-left:1px solid #9fb2be;border-right:1px solid #9fb2be}.night-mode .content-wrapper{background-color:#1b1f26;box-shadow:0 4px 8px #0003;border-left:1px solid #313436;border-right:1px solid #313436}.background-image{height:300px;width:100%;margin-bottom:-100px;position:relative;z-index:0;background-size:cover;background-position:center;transition:background .6s ease,background-image .6s ease}.day-mode .background-image{background-image:url(/assets/day-CYfkZ2g0.jpg)}.night-mode .background-image{background-image:url(/assets/night-C7M8JOrq.jpg)}.app-header{display:flex;align-items:center;padding:120px 30px 0;position:relative;z-index:1}.profile-image{width:220px;height:220px;border-radius:50%;margin-right:20px;background-image:url(/assets/profile-BrxR2Xp1.jpg);background-size:cover;background-position:center;transition:background-size .6s ease,border .6s ease;margin-top:-100px;z-index:2}.day-mode .profile-image{border:5px solid #e0e4eb}.night-mode .profile-image{border:5px solid #1b1f26}.profile-image:hover{background-size:110%}.text-container{display:flex;flex-direction:column;margin-top:-20px}.app-header h1,.app-header h2{margin:0;padding:0}.app-header h2{margin-bottom:5px}.social-links{display:flex;gap:15px;flex-wrap:wrap}.social-link-container{display:flex;align-items:center;gap:5px;background-color:#f0f0f0;padding:5px 10px;border-radius:5px;transition:background-color .3s ease;color:inherit}.night-mode .social-link-container{background-color:#333}.social-link-container a{text-decoration:none;color:inherit;transition:color .3s ease}.social-link-container:hover{background-color:#e0e0e0}.night-mode .social-link-container:hover{background-color:#444}.social-link-text{display:inline-block;font-size:14px;color:inherit}.app-content{padding:20px 50px 0;margin-top:10px;transition:border-top .6s ease,box-shadow .6s ease}.day-mode .app-content{border-top:1px solid #e0e4eb;box-shadow:0 -1px 2px #0003}.night-mode .app-content{border-top:1px solid #313436;box-shadow:0 -1px 2px #0003}.introduction p{font-size:16px;line-height:1.5}.professional-section h3{margin:0;padding:0}.professional-section-wrapper{padding:0 20px;margin-left:15px;border-left:2px solid #bababa;position:relative}.circle-timeline{width:16px;height:16px;background-color:#add8e6;border-radius:50%;position:absolute;right:calc(100% + 14px);top:0}.professional-experience h4,.professional-experience h5{margin:0;padding:0;font-weight:600}.professional-experience{margin-top:20px;padding:10px;transition:border .6s ease,box-shadow .6s ease;position:relative}.day-mode .professional-experience{border:1px solid #e0e4eb;box-shadow:2px 4px 8px #0003}.night-mode .professional-experience{border:1px solid #313436;box-shadow:2px 4px 8px #0003}.skills{padding:20px;margin-bottom:20px}.skills h4{margin:0;padding:0;font-weight:600}.day-mode .skills{border:1px solid #e0e4eb;box-shadow:2px 4px 8px #0003}.night-mode .skills{border:1px solid #313436;box-shadow:2px 4px 8px #0003}.project-highlights-section{margin:30px 7px;padding:25px;border:1px solid #313436;box-shadow:2px 4px 8px #0003;border-radius:8px}.day-mode .project-highlights-section{border:1px solid #e0e4eb;box-shadow:2px 4px 8px #0003}.project-highlights-section h3{margin:0 0 25px;font-size:1.4rem;text-align:left;font-weight:600}.highlights-grid{display:grid;grid-template-columns:1fr;gap:25px;margin:0;justify-items:stretch}@media (min-width: 600px){.highlights-grid{grid-template-columns:repeat(2,1fr);max-width:800px;margin:0 auto}}.highlight-card{position:relative;border-radius:8px;overflow:hidden;transition:transform .3s ease,box-shadow .3s ease;cursor:pointer;height:200px;background:#000;width:100%;margin:0;font-size:0;line-height:0;display:flex;align-items:stretch}.highlight-card:hover{transform:translateY(-8px);box-shadow:0 12px 35px #0006}.highlight-image{width:100%;height:100%;object-fit:cover;transition:transform .4s ease;display:block;margin:0;padding:0;flex:1}.highlight-card:hover .highlight-image{transform:scale(1.08)}.highlight-overlay{position:absolute;top:0;left:0;right:0;bottom:0;padding:20px;z-index:2;display:flex;align-items:flex-end;background:linear-gradient(to top,rgba(0,0,0,.7) 0%,rgba(0,0,0,.3) 40%,transparent 70%)}.day-mode .highlight-overlay{background:linear-gradient(to top,rgba(255,255,255,.8) 0%,rgba(255,255,255,.4) 40%,transparent 70%)}.highlight-content{display:flex;flex-direction:column;gap:8px}.highlight-title{color:#fff;font-size:1.2rem;font-weight:600;margin:0;line-height:1.2}.day-mode .highlight-title{color:#000}.highlight-tech{color:#ffffffe6;font-size:.85rem;font-weight:400;letter-spacing:.5px}.day-mode .highlight-tech{color:#000c}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000c;display:flex;align-items:center;justify-content:center;z-index:3000;padding:20px;box-sizing:border-box}.modal-content{background:#1b1f26;border-radius:0;max-width:900px;width:100%;max-height:90vh;overflow-y:auto;position:relative;box-shadow:0 20px 60px #00000080;border:1px solid rgba(255,255,255,.1)}.day-mode .modal-content{background:#e0e4eb;border:1px solid rgba(0,0,0,.1);color:#000}.modal-close{position:absolute;top:15px;right:15px;background:#000000b3;border:none;color:#fff;font-size:24px;width:40px;height:40px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background-color .2s ease;z-index:1}.modal-close:hover{background:#000000e6}.day-mode .modal-close{background:#ffffffe6;color:#000}.day-mode .modal-close:hover{background:#fff}.modal-header{padding:30px 30px 0}.modal-header h2{margin:0;font-size:1.8rem;font-weight:600;color:inherit}.modal-body{padding:20px 30px 30px}.modal-image-gallery{position:relative;display:flex;align-items:center;justify-content:center;margin-bottom:15px}.modal-image-container{position:relative;width:100%;flex:1}.modal-featured-image{width:100%;height:300px;object-fit:cover;border-radius:8px;display:block}.modal-image-nav{position:absolute;top:50%;transform:translateY(-50%);background:#000000b3;border:none;color:#fff;font-size:2rem;padding:10px 15px;cursor:pointer;z-index:2;border-radius:50%;transition:background .3s ease,transform .2s ease;width:50px;height:50px;display:flex;align-items:center;justify-content:center}.modal-image-nav:hover{background:#000000e6;transform:translateY(-50%) scale(1.1)}.modal-image-prev{left:10px}.modal-image-next{right:10px}.day-mode .modal-image-nav{background:#ffffffe6;color:#000}.day-mode .modal-image-nav:hover{background:#fff}.modal-image-dots{display:flex;justify-content:center;gap:8px;margin-bottom:10px}.modal-dot{width:12px;height:12px;border-radius:50%;background:#fff6;cursor:pointer;transition:background .2s ease,transform .2s ease}.modal-dot:hover{background:#ffffffb3;transform:scale(1.2)}.modal-dot.active{background:#fff;transform:scale(1.1)}.day-mode .modal-dot{background:#0006}.day-mode .modal-dot:hover{background:#000000b3}.day-mode .modal-dot.active{background:#000}.modal-image-counter{text-align:center;font-size:.9rem;opacity:.7;margin-bottom:15px;font-weight:500}.modal-section{margin-bottom:25px}.modal-section h4{margin:0 0 15px;font-size:1.2rem;font-weight:600;color:inherit;border-bottom:2px solid rgba(255,255,255,.1);padding-bottom:8px}.day-mode .modal-section h4{border-bottom:2px solid rgba(0,0,0,.1)}.modal-description .project-description{margin:0;font-size:1rem;line-height:1.6;color:inherit}.modal-description .project-description ul{margin:10px 0;padding-left:20px}.modal-description .project-description li{margin-bottom:8px;line-height:1.5}.image-viewer-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000e6;display:flex;align-items:center;justify-content:center;z-index:4000;overflow:hidden}.viewer-image{max-width:90%;max-height:90%;object-fit:contain;border-radius:4px;box-shadow:0 0 20px #00000080}.viewer-close,.viewer-prev,.viewer-next{position:absolute;background-color:#000c;border:none;color:#fff;cursor:pointer;font-size:2.5rem;padding:.5rem;border-radius:7px;transition:background-color .2s ease}.viewer-close:hover,.viewer-prev:hover,.viewer-next:hover{background-color:#2c2c2c}.viewer-close{top:20px;right:20px}.viewer-prev,.viewer-next{top:50%;transform:translateY(-50%)}.viewer-prev{left:20px}.viewer-next{right:20px}.scroll-top{position:fixed;bottom:40px;right:40px;width:48px;height:48px;border:none;border-radius:50%;background-color:#333;color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:.75;transition:opacity .2s ease,background-color .3s ease;z-index:1000}.scroll-top:hover{opacity:1}.day-mode .scroll-top{background-color:#f0f0f0;color:#333}.image-loading-overlay{position:absolute;top:0;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;background:var(--bg);z-index:1}@media (max-width: 600px){.social-links{flex-direction:row;gap:10px;justify-content:flex-start}.social-link-container{padding:7px;justify-content:center}.social-link-text{display:none}.framework-list{display:grid;grid-template-columns:repeat(2,1fr);gap:5px}.framework-box{width:100px;height:100px}.framework-logo{font-size:30px}.skills{padding:10px}.project-description{font-size:1rem;padding:0 10px}.highlights-grid{grid-template-columns:1fr;gap:20px}.highlight-card{height:240px;margin:0;width:100%}.highlight-overlay{padding:20px 15px 15px}.highlight-title{font-size:1.1rem}.highlight-tech{font-size:.8rem}.modal-overlay{padding:10px}.modal-content{max-height:95vh}.modal-header{padding:20px 20px 0}.modal-header h2{font-size:1.5rem}.modal-body{padding:15px 20px 20px}.modal-featured-image{height:200px}.modal-section h4{font-size:1.1rem}.modal-image-nav{width:40px;height:40px;font-size:1.5rem;padding:5px}.modal-image-prev{left:5px}.modal-image-next{right:5px}.modal-dot{width:10px;height:10px}}@media (max-width: 400px){.app-header h2{font-size:18px}.social-link-container a{font-size:12px}}@media (max-width: 404px){.content-wrapper{max-width:95%}.profile-image{width:120px;height:120px}.app-header{margin-top:35px}.app-header h1{font-size:16px}.app-header h2{font-size:12px}.background-image{height:200px}.app-content{padding:20px 20px 0;margin-top:10px}}@media (min-width: 405px) and (max-width: 599px){.content-wrapper{max-width:90%}.profile-image{width:130px;height:130px}.app-header{margin-top:35px}.app-header h1{font-size:20px}.app-header h2{font-size:15px}.background-image{height:200px}.app-content{padding:20px 20px 0;margin-top:10px}}@media (min-width: 600px) and (max-width: 899px){.content-wrapper{max-width:90%}.app-header h1{font-size:24px}.app-header h2{font-size:18px}.profile-image{width:150px;height:150px}}@media (min-width: 900px) and (max-width: 1199px){.content-wrapper{max-width:70%}}@media (min-width: 1200px){.content-wrapper{max-width:960px}}.toggle{position:absolute;top:10px;right:10px;display:inline-block;width:60px;height:30px;padding:2px;border-radius:15px;z-index:10}.toggle:before,.toggle:after{content:"";display:table}.toggle:after{clear:both}.toggle-bg{position:absolute;top:-2px;left:-2px;width:100%;height:100%;background-color:#c0e6f6;border-radius:15px;border:2px solid #81c0d5;transition:all .1s cubic-bezier(.25,.46,.45,.94)}.toggle-input{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:15px;z-index:2;opacity:0;cursor:pointer}.toggle-switch{position:relative;width:24px;height:24px;margin-left:30px;background-color:#f5eb42;border:2px solid #e4c74d;border-radius:50%;transition:all .1s cubic-bezier(.25,.46,.45,.94)}.toggle-switch-figure{position:absolute;bottom:-8px;left:-30px;display:block;width:48px;height:18px;border:5px solid #d4d4d2;border-radius:10px;background-color:#fff;transform:scale(.4);transition:all .12s cubic-bezier(.25,.46,.45,.94)}.toggle-switch-figureAlt{position:absolute;top:2px;left:1px;width:1px;height:1px;background-color:#efeeda;border-radius:100%;border:2px solid #dee1c5;box-shadow:25px -5px 0 -2px #fcfcfc,45px -8px 0 -2px #fcfcfc,32px 3px 0 -3px #fcfcfc,50px 5px 0 -1px #fcfcfc,38px 12px 0 -3px #fcfcfc,27px 18px 0 -1px #fcfcfc,48px 15px 0 -2px #fcfcfc;transition:all .12s cubic-bezier(.25,.46,.45,.94);transform:scale(0)}.toggle-switch-figureAlt:before{content:"";position:absolute;top:-4px;left:10px;width:4px;height:4px;background-color:#efeeda;border-radius:100%;border:2px solid #dee1c5}.toggle-switch-figureAlt:after{content:"";position:absolute;top:12px;left:9px;width:1px;height:1px;background-color:#efeeda;border-radius:100%;border:2px solid #dee1c5}.toggle-input:checked~.toggle-switch{margin-left:0;border-color:#dee1c5;background-color:#fffdf2}.toggle-input:checked~.toggle-bg{background-color:#484848;border-color:#202020}.toggle-input:checked~.toggle-switch .toggle-switch-figure{margin-left:20px;opacity:0;transform:scale(.1)}.toggle-input:checked~.toggle-switch .toggle-switch-figureAlt{transform:scale(1)}@media (max-width: 376px){.toggle{width:50px;height:25px}.toggle-switch{width:20px;height:20px;margin-left:20px}.toggle-switch-figure{width:40px;height:15px}}body,html{margin:0;padding:0;font-family:Arial,sans-serif;box-sizing:border-box}
