:root{--text:#a1a1aa;--text-h:#f3f4f6;--bg:#0f1117;--border:#2e303a;--code-bg:#171a23;--accent:#a855f7;--accent-bg:#a855f71a;--accent-border:#a855f780;--social-bg:#171a2380;--shadow:#0006 0 10px 15px -3px, #00000040 0 4px 6px -2px;--sans:system-ui, "Segoe UI", Roboto, sans-serif;--heading:system-ui, "Segoe UI", Roboto, sans-serif;--mono:ui-monospace, Consolas, monospace;font:18px/145% var(--sans);letter-spacing:.18px;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0}#root{text-align:center;box-sizing:border-box;flex-direction:column;width:100%;max-width:100%;min-height:100svh;margin:0 auto;display:flex}h1,h2{font-family:var(--heading);color:var(--text-h);font-weight:500}h1{letter-spacing:-1.68px;margin:32px 0;font-size:56px}@media (width<=1024px){h1{margin:20px 0;font-size:36px}}h2{letter-spacing:-.24px;margin:0 0 8px;font-size:24px;line-height:118%}@media (width<=1024px){h2{font-size:20px}}p{margin:0}code,.counter{font-family:var(--mono);color:var(--text-h);border-radius:4px;display:inline-flex}code{background:var(--code-bg);padding:4px 8px;font-size:15px;line-height:135%}.button-icon{filter:invert()brightness(2)}.navbar{background:var(--bg);border-bottom:1px solid var(--border);color:#fff;justify-content:space-between;align-items:center;padding:1rem;display:flex}.navbar-left{align-items:center;gap:.75rem;display:flex}.navbar-left img{width:auto;height:35px}.navbar-center{gap:2rem;display:flex}.navbar a{color:var(--text-h);text-decoration:none;transition:color .3s}.navbar a:hover{color:var(--accent)}.dropdown{padding-bottom:10px;display:inline-block;position:relative}.dropdown-menu{background:var(--bg);border:1px solid var(--border);z-index:10;min-width:180px;box-shadow:var(--shadow);opacity:0;visibility:hidden;padding:.75rem 1rem;transition:all .25s;position:absolute;top:100%;left:50%;transform:translate(-50%)translateY(10px)}.dropdown-menu a{margin-bottom:.75rem;display:block}.dropdown-menu a:last-child{margin-bottom:0}.dropdown:hover .dropdown-menu{opacity:1;visibility:visible;transform:translate(-50%)translateY(0)}.hero{background-image:url(/sebha01.github.io/Images/HeroSectionImage.png);background-position:50%;background-size:cover;flex-direction:column;justify-content:center;align-items:center;min-height:65vh;padding:4rem 2rem;display:flex;position:relative}.hero:before{content:"";background:linear-gradient(to bottom, var(--bg) 0%, #0f111733 20%, #0f111733 80%, var(--bg) 100%);position:absolute;inset:0}.heroText{text-align:center;max-width:800px;margin-bottom:2rem;position:relative}.heroText p{margin:.6rem 0}.heroButtons{z-index:1;flex-wrap:wrap;justify-content:center;gap:1rem;display:flex;position:relative}.heroButton{border:1px solid var(--border);color:var(--text-h);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#00000026;padding:.6rem 1.2rem;text-decoration:none}.heroButton:hover{color:var(--accent)}.extras{border-top:1px solid var(--border);grid-template-columns:1fr 1fr;display:grid}.featuredProject,.keySkills{background-position:50%;background-repeat:no-repeat;background-size:cover;flex-direction:column;justify-content:flex-start;min-height:420px;padding:2rem;display:flex;position:relative}.featuredProject:before,.keySkills:before{content:"";background:#080a14b8;position:absolute;inset:0}.featuredProject>*,.keySkills>*{z-index:1;position:relative}.featuredProject{border-right:1px solid var(--border);background-image:url(/sebha01.github.io/Images/VR_Project2.png)}.keySkills{background-image:url(/sebha01.github.io/Images/Sebleste5.png)}.featuredProject a,.keySkills a{color:var(--text-h);text-decoration:none}.featuredProject img{border:3px solid #fff;border-radius:6px;width:45%;margin-top:1.5rem}.keySkills p,.featuredProject p{margin:.6rem 0}@media (width<=900px){.extras{grid-template-columns:1fr}.featuredProject{border-right:none;border-bottom:1px solid var(--border)}.featuredProject img{width:100%}}.section1{background:var(--bg);color:var(--text-h);padding:3rem 2rem 1rem}.AboutMeTitle{text-align:center;flex-direction:column;align-items:center;display:flex}.AboutMeTitle h2{color:var(--text-h);margin:0 0 .5rem;font-size:2.5rem}.AboutMeTitle hr{background:var(--accent);border:none;border-radius:999px;width:180px;height:4px;margin:0}.AboutMeSection{background:var(--bg);color:var(--text);padding:2rem}.AboutMeContainer{justify-content:center;align-items:center;gap:3rem;max-width:1100px;margin:0 auto;display:flex}.AboutMeLeftSide{flex:320px;justify-content:center;display:flex}.AboutMeLeftSide img{object-fit:cover;width:100%;max-width:380px;height:auto;box-shadow:var(--shadow);border-radius:16px}.AboutMeRightSide{flex:1.5 450px;max-width:700px}.AboutMeRightSide p{color:var(--text);margin:0;font-size:1rem;line-height:1.8}@media (width<=900px){.AboutMeContainer{text-align:center;flex-direction:column;gap:2rem}.AboutMeRightSide{max-width:100%}.AboutMeTitle h2{font-size:2rem}}@media (width<=600px){.section1{padding:2.5rem 1rem 1rem}.AboutMeSection{padding:1.5rem 1rem 3rem}.AboutMeTitle h2{font-size:1.75rem}.AboutMeRightSide p{font-size:.95rem;line-height:1.7}.AboutMeTitle hr{width:140px}}.contactPageSection{background:var(--bg);color:var(--text-h);padding:4rem 2rem}.contactContainer{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:3rem;max-width:1100px;margin:0 auto;display:flex}.contactLeft{flex-direction:column;flex:400px;gap:1rem;display:flex}.contactLeftTitle h2{color:var(--text-h);margin:0 0 .5rem;font-size:2.5rem}.contactLeftTitle hr{background:var(--accent);border:none;border-radius:999px;width:120px;height:4px;margin:0 0 1rem}.contactInputs{border:1px solid var(--border);background:var(--code-bg);width:100%;max-width:450px;color:var(--text-h);box-sizing:border-box;border-radius:12px;padding:.9rem 1rem}.contactLeft textarea{resize:vertical;min-height:140px}.contactInputs:focus{border-color:var(--accent);outline:none}.contactInputs::placeholder{color:var(--text)}.contactLeft button{border:1px solid var(--border);background:var(--accent);color:#fff;cursor:pointer;border-radius:999px;align-items:center;gap:.6rem;width:fit-content;padding:.85rem 1.4rem;display:flex}.contactLeft button:hover{opacity:.9}.contactLeft button img{height:14px}.contactRight{flex:300px;justify-content:center;display:flex}.contactRight img{width:100%;max-width:420px;height:auto}@media (width<=768px){.contactPageSection{padding:3rem 1.5rem}.contactContainer{text-align:center;flex-direction:column}.contactLeft{align-items:center}.contactInputs{max-width:100%}.contactLeft button{align-self:center}.contactRight img{max-width:280px}}.attributionSection{padding:8rem 2rem 1rem}.attributionSection a{color:#fff;text-decoration:none;transition:color .3s}.attributionSection a:hover{color:var(--accent)}.projectsContainer{color:#fff;text-align:center;padding:20px;font-size:x-large}.projectsSectionTop,.projectsSection{margin-bottom:3rem}.projectsSectionTop h3{padding:2% 0 0}.projectsSection h3{padding:4% 0 0}.projectImage{border:5px solid #fff;border-radius:10px;width:50%;height:auto}.Aku{width:30%;height:auto}.footer{background:var(--bg);border-top:1px solid var(--border);text-align:center;color:var(--text);padding:1rem 2rem;font-size:14px}.footer p{margin:.4rem 0}.footerLink{color:var(--text-h);text-decoration:none}.footerLink:hover{color:var(--accent)}.followMeText{flex-wrap:wrap;justify-content:center;align-items:center;gap:.75rem;display:flex}.footerImages{width:auto;height:18px;display:block}.projectDetails{text-align:center;flex-direction:column;justify-content:center;align-items:center;padding:5%;font-size:x-large;display:flex}.projectDetails h1{margin-bottom:1rem;line-height:1.2}hr{background-color:#fff;border:none;width:20%;height:10px}iframe{width:100%;height:auto;margin:20px 0}.projectDetails img{border-radius:10px;width:60%;height:auto;margin:20px 0}.projectDetails p{width:80%;margin:10px auto}.projectDetails h2,.projectDetails h3{color:#fff;margin:20px 0}@media screen and (width<=1024px){.projectDetails{font-size:large}.projectDetails img{width:100%}}@media screen and (width>=1025px){iframe{width:65%}}@media screen and (width>=1441px){iframe{width:45%}}
