:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;width:100%}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}}:root{--bg-primary: black;--bg-secondary: #111827;--text-primary: aliceblue;--text-secondary: #4b5563;--accent: #3b82f6;--border: #e5e7eb}html{scroll-behavior:smooth}[data-theme=light]{--bg-primary: #f3f4f6;--bg-secondary: #cfcfd0;--text-primary: #1f2937;--text-secondary: #ffffff;--accent: #60a5fa;--border: #374151}*{font-family:monospace;color:var(--text-primary);padding:0;margin:0}body{background-color:var(--bg-primary);display:flex;min-width:320px;min-height:100vh;justify-content:center;overflow-x:hidden}::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{background-color:var(--bg-primary)}::-webkit-scrollbar-thumb{background:#414141;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#494949}nav{padding:10px;position:fixed;justify-self:anchor-center;z-index:1000;top:0;left:0}nav #myLinks{flex-shrink:calc(100vh - 300px);flex-grow:calc(100vh - 300px);box-shadow:0 0 16px 7px #212126;display:flex;gap:10px;flex-direction:row;flex-wrap:wrap;background-color:#333331;padding:10px 15px;border-radius:50px}nav a{padding:5px;font-weight:600;text-decoration:none;color:#f0f8ff;font-size:1.5rem;cursor:pointer}nav a:hover{background-color:#4b4b49;border-radius:10px}nav #selected{background-color:#4e4e4c;border-radius:10px}.hamburger-icon{display:none;cursor:pointer;padding:10px;z-index:1001}.hamburger-icon div{width:25px;height:3px;background-color:var(--text-primary);margin:5px 0;transition:.4s}.backgroundSection{height:calc(100vh - 300px);display:block;position:fixed;width:100%;top:0;left:0;padding:20px 0 0 20px;z-index:1;unicode-bidi:isolate}#darkLight{max-width:fit-content;max-height:fit-content;float:left}#aboutMe{cursor:default;margin-top:15%;font-size:3.2vw}#aboutMe h1{cursor:default;font-size:8vw;background:linear-gradient(to top right,var(--text-primary) 0%,#82B3BE 25%,#278EBE 50%,#097AAF 75%,#020D8C 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.scroll-indicator{display:flex;justify-content:center;width:100%;margin-top:20px;margin-bottom:10px;cursor:pointer;transition:transform .3s ease}.scroll-indicator:hover{transform:translateY(5px)}.arrow-svg{transform:rotate(-90deg)}.arrow-path{stroke-dasharray:60;stroke-dashoffset:60}.arrow-path-1{animation:draw-arrow 1.5s ease-in-out infinite}.arrow-path-2{animation:draw-arrow 1.5s ease-in-out .25s infinite}@keyframes draw-arrow{0%{stroke-dashoffset:60;opacity:0}30%{opacity:1}60%,to{stroke-dashoffset:0;opacity:0}}.switch{position:relative;display:inline-block;margin-left:.4vw;width:60px;height:34px}.switch input{opacity:0;width:0;height:0}.slider.round{border-radius:34px}.slider.round:before{border-radius:50%}.slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#282727;-webkit-transition:.4s;transition:.4s}.slider:before{position:absolute;content:"";height:26px;width:26px;left:4px;bottom:4px;background-color:#fff;-webkit-transition:.4s;transition:.4s}input:checked+.slider{background-color:#b1afaf}input:checked+.slider:before{background-color:#292929}input:focus+.slider{box-shadow:0 0 1px #8e8f8f}input:checked+.slider:before{-webkit-transform:translateX(26px);-ms-transform:translateX(26px);transform:translate(26px)}.mainSection{position:relative;z-index:10;margin-top:100vw;width:100%}.mainSection2{position:relative;margin-top:5vw;z-index:10;width:100%}.aboutMeDiv{padding:5vw;display:flex;flex-direction:row;align-items:center;min-height:min-content;font-size:1.8vw;text-align:center;background-color:var(--bg-primary);box-shadow:0 -20px 20px 20px var(--bg-primary);cursor:default}.aboutMeDiv #profileImg{margin:.5vw;min-width:2vw;max-width:15vw;min-height:min-content;border-radius:100%;flex-shrink:0;box-shadow:0 4px 20px var(--text-secondary)}.technologiesDiv{padding:2vw 5vw;background-color:var(--bg-primary);cursor:default;text-align:center}.technologiesDiv h2{font-size:2.5rem;margin-bottom:2rem;text-align:center;background:var(--text-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.tech-container{display:flex;flex-direction:column;gap:1.5rem;max-width:800px;margin:0 auto}.tech-item{width:100%}.tech-header{display:flex;justify-content:space-between;margin-bottom:.5rem}.tech-name{font-size:1.2rem;font-weight:700}.tech-proficiency{font-size:1.2rem}.tech-bar-bg{width:100%;height:12px;background-color:var(--tech-bar-bg);border-radius:6px;overflow:hidden}.tech-bar-fill{height:100%;background-color:var(--tech-bar-fill);border-radius:6px;transition:width 1.5s ease-in-out}.projectDiv{min-width:100vw;min-height:min-content;text-align:center;background-color:var(--bg-primary);box-shadow:0 -20px 20px 20px var(--bg-primary);cursor:pointer}.project-container{display:flex;flex-wrap:wrap;justify-content:center;gap:20px;padding:20px}.project-card{background:var(--text-primary);border-radius:10px;box-shadow:0 3px 20px #3c3737bf;overflow:hidden;width:40vw;padding-top:5px;text-align:center;transition:transform .3s ease-in-out}.project-card:hover{transform:translateY(-5px)}.project-image{width:100%;min-height:min-content;object-fit:cover;border-bottom:2px solid #ddd}.project-title{font-size:1.5rem;font-weight:700;padding:15px;color:var(--text-secondary)}.modal-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000000bf;display:flex;align-items:center;justify-content:center;z-index:2000;cursor:default}.modal-iframe{width:100%;height:400px;min-height:300px;border:none;border-radius:5px;background-color:#f0f0f0}.modal-content{background-color:var(--bg-secondary);border-radius:10px;box-shadow:0 5px 25px #00000080;width:80%;max-width:800px;position:relative;max-height:90vh;overflow-y:auto;cursor:default}.modal-backdrop{opacity:0;animation:fadeIn .4s ease forwards}.modal-content{transform-style:preserve-3d;transform:rotateX(-90deg);transform-origin:top center;opacity:0;animation:flipIn .6s cubic-bezier(.25,.46,.45,.94) forwards}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes flipIn{0%{transform:rotateX(-90deg);opacity:0}to{transform:rotateX(0);opacity:1}}.modal-backdrop.closing{animation:fadeOut .4s ease forwards}.modal-content.closing{animation:flipOut .6s cubic-bezier(.25,.46,.45,.94) forwards}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}@keyframes flipOut{0%{transform:rotateX(0);opacity:1}to{transform:rotateX(90deg);opacity:0}}.modal-close-btn{position:absolute;top:15px;right:15px;background:none;border:none;cursor:pointer;z-index:2001}.modal-close-btn svg{color:var(--text-primary);width:24px;height:24px}.modal-body{padding:25px;cursor:default}.modal-title{font-size:2rem;font-weight:700;margin-bottom:15px;color:var(--text-primary);cursor:default}.modal-subtitle{font-size:1.5rem;font-weight:600;margin-bottom:10px;color:var(--text-primary);cursor:default}.modal-video-container{width:100%;margin-bottom:20px;border-radius:5px;overflow:hidden;cursor:default}.modal-video{width:100%;max-height:400px;object-fit:contain;cursor:default}.modal-description{margin-bottom:25px;line-height:1.6;cursor:default}.modal-description p{color:var(--text-primary);font-size:1.5rem;cursor:default}.github-link{display:inline-flex;align-items:center;background-color:#24292e;color:#fff!important;padding:10px 15px;border-radius:5px;text-decoration:none;font-weight:600;transition:background-color .2s ease}.github-link:hover{background-color:#2c3440}.github-icon{margin-right:8px}.modal-content::-webkit-scrollbar{width:5px}.modal-content::-webkit-scrollbar-track{background-color:var(--bg-secondary)}.modal-content::-webkit-scrollbar-thumb{background:#414141;border-radius:10px}.modal-content::-webkit-scrollbar-thumb:hover{background:#494949}.contactDiv{padding-top:50px;min-height:300px;min-height:min-content;text-align:center;background-color:var(--bg-primary)}.textInfo{background-color:var(--bg-primary);font-size:3.5vw;border-top:2px solid currentColor;padding-top:15px;padding-bottom:10px;border-radius:60% 60% 0 0;box-shadow:0 -6px 10px #3c3737bf;cursor:default}.textInfo h3{margin-bottom:10px}.textInfo a{text-decoration:none;margin:5px}.textInfo svg{width:10vw;height:fit-content}@media (max-width:1070px){.aboutMeDiv{padding:5vw;display:flex;flex-direction:column;align-items:center;min-height:min-content;font-size:2.5vw;text-align:center;background-color:var(--bg-primary);box-shadow:0 -20px 20px 20px var(--bg-primary)}.aboutMeDiv #profileImg{margin:1.2vw;min-width:4rem;max-width:14rem;min-height:2rem;max-height:12rem;border-radius:100%;flex-shrink:0;box-shadow:0 4px 20px var(--text-secondary)}.projectDiv{min-height:min-content;text-align:center;background-color:var(--bg-primary);box-shadow:0 -20px 20px 20px var(--bg-primary)}.project-container{display:flex;flex-wrap:wrap;justify-content:center;gap:20px;padding:20px}.project-card{background:var(--text-primary);border-radius:10px;box-shadow:0 4px 10px #0003;overflow:hidden;width:60vw;text-align:center;transition:transform .3s ease-in-out}.project-card:hover{transform:translateY(-5px)}.project-image{min-width:4rem;max-width:fit-content;min-height:2rem;object-fit:cover;border-bottom:2px solid #ddd}.project-title{font-size:1.5rem;font-weight:700;padding:15px;color:var(--text-secondary)}nav #myLinks{position:fixed;flex-direction:column;top:0;right:-300px;width:250px;height:100vh;background-color:#333331;padding:50px 20px;transition:right .3s ease-in-out;border-radius:0;box-shadow:-5px 0 15px #0000004d}nav #myLinks.active{right:0}.hamburger-icon{display:block;position:fixed;top:20px;right:20px}.hamburger-icon.active div:nth-child(1){background-color:#fff;transform:rotate(-45deg) translate(-5px,6px)}.hamburger-icon.active div:nth-child(2){opacity:0}.hamburger-icon.active div:nth-child(3){background-color:#fff;transform:rotate(45deg) translate(-5px,-6px)}nav a{margin:10px 0;font-size:1.2rem;width:100%;text-align:center}}@media (max-width: 768px){.modal-content{width:95%}.modal-title{font-size:1.5rem}.modal-subtitle{font-size:1.2rem}.modal-description p{color:var(--text-primary);font-size:3vw}.modal-iframe{height:300px;min-height:250px}.hidden{display:none}}@media (max-width: 625px){.scroll-indicator{display:none}}@media (max-width: 480px){.modal-iframe{height:250px;min-height:200px}}
