:root{--bg-main: #181818;--bg-surface: #242424;--bg-border: #2F2F2F;--text-primary: #F5F5F5;--text-secondary: #B0B0B0;--text-muted: #8A8A8A;--accent-primary: #48E5C2;--accent-soft: #D6D3C8}html,body,#root{height:100%}body.modal-open{overflow:hidden;touch-action:none}#root{display:flex;flex-direction:column}.main-content{flex:1;padding-top:100px}.app{min-height:100vh;display:flex;flex-direction:column}html{scroll-behavior:smooth}*{margin:0;padding:0}body{background:var(--bg-main);font-family:Oswald,sans-serif;font-size:1.2rem;line-height:1.6rem}button,input,textarea{font-family:Oswald,sans-serif;font-size:1.2rem;line-height:1.6rem}button{cursor:pointer}a{text-decoration:none}.site-header{position:fixed;top:0;left:0;width:100%;z-index:1000;box-sizing:border-box;display:flex;justify-content:space-between;align-items:center;height:100px;padding:0 10%;background:var(--bg-main);border-bottom:2px solid var(--bg-border)}.nav.pages{display:flex;gap:1.2rem;margin-right:10%}.site-header a{color:var(--text-primary);font-size:1.4rem}.site-header a.home-name{font-size:2rem;font-weight:700;letter-spacing:1px}.nav.pages a:hover,.nav.home a:hover{color:#48e5c2}.nav.home a:hover{text-shadow:0 0 4px var(--accent-primary)}.title{max-width:fit-content}a{color:var(--text-primary)}.socialbar{position:fixed;top:0;right:0;width:100px;height:100%;z-index:1000;box-sizing:border-box;display:flex;justify-content:center;align-items:center;background:transparent}.bar{padding:15px;border-radius:25px;background:var(--bg-surface);box-shadow:0 0 15px var(--bg-border)}.socialbar ul{display:flex;flex-direction:column;align-items:center;list-style:none;gap:12px}@media(max-width:900px){.socialbar{position:fixed!important;bottom:0!important;left:0;width:100%;z-index:1000;box-sizing:border-box;background:transparent}.bar{padding:15px;border-radius:25px;background:var(--bg-surface);box-shadow:0 0 15px var(--bg-border)}.socialbar ul{display:flex;flex-direction:row;list-style:none;gap:20px}}.socialbar li{font-size:1.6rem}.section{color:var(--text-primary)}.section.intro{flex-wrap:wrap;gap:0}.section.intro{margin:10%}.content.intro{position:relative;width:100%;max-width:650px}.content.intro h1{font-size:4.5rem;font-weight:300;margin-bottom:40px}.intro-text{margin-top:15px;color:var(--text-primary)}.intro-subtext{width:100%;max-width:700px;color:var(--text-secondary)}.highlight{font-weight:500;color:var(--accent-primary)}.intro-image img{width:100%;min-width:300px;max-width:420px;border-radius:25px;filter:drop-shadow(0 0 12px var(--accent-primary))}.intro-connect{width:100%;max-width:420px;margin:15px 0}.connect-buttons{display:flex;flex-direction:row;gap:10px}.button{padding:10px;border-radius:10px}.button:hover{transform:translateY(-4px)}.button.primary{background:var(--accent-primary);color:var(--bg-surface);border:1px solid var(--bg-surface)}.button.secondary{background:var(--bg-surface);color:var(--text-primary);border:1px solid var(--accent-primary)}.button.primary:hover{box-shadow:0 0 10px var(--accent-primary)}.button.secondary:hover{background:var(--accent-primary);color:var(--bg-surface);border:1px solid var(--bg-surface);box-shadow:0 0 4px var(--accent-primary)}.connect-social{width:100%;max-width:420px;margin:10px 2px}.connect-social ul{display:flex;flex-direction:row;list-style:none;gap:20px}.connect-social li{font-size:1.6rem}.connect-social i:hover{color:var(--accent-primary)}@media(min-width:900px){.section.intro{display:flex;align-items:center;justify-content:space-between;margin:100px 10%;gap:100px;scroll-margin-top:110px}}.section.stack{display:flex;justify-content:center;margin:20% 10%;scroll-margin-top:110px}@media(min-width:900px){.section.stack{margin:200px 10% 100px}}.content.stack{width:100%;min-width:350px;max-width:1400px;margin:0 4%;border-radius:25px;background:var(--bg-surface);box-shadow:0 0 15px var(--bg-border)}.content.stack h2{text-align:center;font-size:2.2rem;font-weight:300;letter-spacing:1px;margin:10px 0;padding:25px}.content.stack ul{display:flex;justify-content:center;flex-wrap:wrap;margin:0 4%;gap:2.8rem;list-style:none}.content.stack li{display:flex;align-items:center;flex-direction:column}.content.stack img{width:75px;height:auto}.content.stack i{font-size:4.7rem}.content.stack span{margin:15% 0}.section.featured-projects{display:flex;flex-direction:column;align-items:center;margin:10%;scroll-margin-top:110px}.section.featured-projects h2{font-size:2.2rem;font-weight:300;letter-spacing:1px;margin:20px 0}.all-projects{font-size:1.1rem;margin-top:20px;padding:14px 20px;color:var(--text-primary);background-color:var(--bg-surface);border:2px solid var(--bg-border);border-radius:10px;transition:background .3s,transform .3s}.fp-list{margin-top:20px}.all-projects:hover{color:var(--bg-surface);background-color:var(--accent-primary);box-shadow:0 0 12px var(--accent-primary);transform:translateY(-4px)}@media(min-width:900px){.section.featured-projects{margin:100px 10%}}.featured-card{position:relative;overflow:hidden;border-radius:10px;cursor:pointer;width:100%;max-width:300px;box-shadow:0 0 12px var(--bg-border)}.featured-card img{display:block;width:100%;max-width:300px;height:auto;transition:transform .4s ease,filter .4s ease}.fp-details{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;text-align:center;padding:1rem;opacity:0;background:#00000073;transition:opacity .4s ease}.fp-details h3{font-size:1.6rem;letter-spacing:1px;margin:10px 0;color:var(--text-primary)}.fp-details p{display:-webkit-box;-webkit-line-clamp:6;-webkit-box-orient:vertical;overflow:hidden;color:var(--text-secondary)}.fp-button{position:absolute;bottom:20px;padding:10px;border-radius:25px;border:1px solid var(--accent-soft);color:var(--text-primary);background:var(--bg-border)}.fp-button:hover{background:var(--bg-main);transition:background-color 1s ease-in-out;transform:translateY(-4px)}.featured-card:hover img{transform:scale(1.03);filter:blur(3px) brightness(.7)}.featured-card:hover .fp-details{opacity:1}.section.contact{display:flex;flex-direction:column;align-items:center;margin:10%;scroll-margin-top:110px}.section.contact h2{font-size:2.2rem;font-weight:300;letter-spacing:1px;margin:20px 0}.contact-fields{display:flex;flex-direction:column;width:100%;max-width:350px;margin-top:20px;gap:20px}.contact-fields input,.contact-fields textarea{font-size:1rem;padding:15px 20px;color:var(--text-secondary);background-color:var(--bg-surface);border:2px solid var(--bg-border);border-radius:10px;outline:none;transition:all .3s ease;resize:none}.contact-fields input:focus,.contact-fields textarea:focus{border-color:var(--accent-primary);box-shadow:0 0 12px var(--accent-primary)}.contact-fields .message{height:120px;resize:none}.contact-fields button{font-size:1.1rem;margin-top:20px;padding:14px 20px;color:var(--text-primary);background-color:var(--bg-surface);border:2px solid var(--bg-border);border-radius:10px;transition:background .3s,transform .3s}.contact-fields button:hover{color:var(--bg-surface);background-color:var(--accent-primary);box-shadow:0 0 12px var(--accent-primary);transform:translateY(-4px)}@media(min-width:900px){.section.contact{margin:100px 10% 50px}}.page.projects{margin-top:40px;color:var(--text-primary)}.proj-pg-sct-title{text-align:center}.projects-list{margin:0 10%}@media(min-width:900px){.projects-list{display:grid;grid-template-columns:auto auto;gap:2rem;margin:20px 10%}}.project-card{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;margin:10% 0;padding:1.2rem;gap:20px;color:var(--text-primary);background:var(--bg-surface);border-radius:16px;box-shadow:0 0 12px var(--bg-border)}.project-card.highlighted{border:2px solid var(--accent-primary);box-shadow:0 0 20px var(--accent-primary);transform:scale(1.02);cursor:pointer}.project-img{width:100%}.project-card img{width:100%;border-radius:10px}.card-details{position:relative;width:100%;min-height:400px}.card-nav{display:flex;margin:10px 0;padding-bottom:10px;gap:10px;border-bottom:1px solid var(--bg-border)}.card-nav button{color:var(--text-secondary);background:var(--bg-surface);border:none}.card-nav button.active{color:var(--text-primary);border-bottom:2px solid var(--accent-primary)}.card-content{margin-bottom:60px}.card-buttons{position:absolute;bottom:0}.card-buttons button{margin:0 3px;padding:10px;border-radius:25px;border:1px solid var(--accent-soft);color:var(--text-primary);background:var(--bg-border)}.button-live{color:var(--bg-border)!important;background:var(--accent-soft)!important}@media(min-width:900px){.project-card{display:flex;max-width:700px;margin:20px 0;padding:1.2rem;gap:20px}.project-card img{width:100%;max-width:300px;height:auto;border-radius:10px}.card-details{width:300px}.project-card img{width:auto;max-height:400px}.card-buttons button:hover{background:var(--bg-main);transition:background-color 1s ease-in-out;transform:translateY(-4px)}}.detail-background{position:fixed;top:0;left:0;z-index:1001;display:flex;justify-content:center;align-items:center;width:100vw;height:100vh;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.detail-main{width:100%;max-width:900px;height:100%;max-height:800px;border:2px solid var(--bg-border);border-radius:25px;background:var(--bg-surface);overflow:auto;-ms-overflow-style:none;scrollbar-width:none}.detail-main::-webkit-scrollbar{display:none}.detail-header{position:relative;top:0;background-size:cover;background-position:center;background-repeat:no-repeat;display:flex;justify-content:center;width:100%;height:250px;border-top-left-radius:25px;border-top-right-radius:25px;overflow:hidden}.detail-header:after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,rgba(0,0,0,0) 95%,var(--bg-surface) 100%)}.detail-header button{position:absolute;top:20px;right:20px;z-index:2;width:40px;height:40px;border:2px solid var(--text-primary);border-radius:100px;background:var(--bg-surface);background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIAAAACACAYAAADDPmHLAAAACXBIWXMAAAsTAAALEwEAmpwYAAADFElEQVR4nO3dS04VQRiG4QrOZAFeEtYg6lzFy0xdkbeRjmjWpDIXl6GsQV5ToStBcgIc6Lb6/P/7LICk6vu6+sKpVCmSJEmSJEmSJEmSJEmSJEmSJEmStBbgFvAQeAu8AO6V4ID7wMtxzI/qHJRsgG3gI3DMv06A78BeCQZ4DhyOYzzreJyL7ZIBsAP85GJ1kj6UIDgN+Hzw59U52SkJrvzLwj9rv2w4YH+N8R6FXgmAT6zvoGwo4Ms1xhtm5Vv1wHf+nh92JWC9K/+s38BWiQZ4fM0J2bgScP3wm90SzfjaQ/QScPPwq9clmvHddwoHwe75q+xF/QBy2avQxq4ETHPlV3+AOyWi8SMP0UrAdOFXX0tUwLMJV4FFlIBpw69X/5MSWX3PZVr7QcKv3pcMgM9M62CDH/iaoWSyySXA8POWAMPPWwIMP28JMPy8JcDw85YAw89bAgw/bwkw/LwlwPDzlgDDz1sCDD9vCTD8vCXA8DfDDP9+3Z/jb/aep9BmWAmm5JWfuARD73lJZWElGHrPR0oLKcHQex5S61yCoff41a8EQ+9xq18Jht7jVb8SDL3HqX4lGHqPT/1KMPQel65ohm/7i96VrPnDbyxB4vAbS5A4/MYSJA6/sQSJw28sQeLwG0uQOPzGEiQOv7EEicNvLMGc/FFoYnP+dJsF7EXUBf7H7/axBMv0PzdtYAmWpceOHSzBMvTcroUl6GsJe/WwBHnDbyxB4vAbS5A4/MYSJA6/sQSJw28sQeLwG0uQOPzGEiQOv7EENztIeUqRjoz5UCKr5+F5aNSF6tw8LVEBhwQKf6YSfCsReXDkldU5uluiAV4RfJcu0z0YPi/ReHj0WkIeHv2I4OFPWIIHJRrgFnAcPfwJSvAL2CoRXfMbwGLv+TM9E7wrUQHbwFHkK/+GK8EP4HaJDNi5QglOIh2kzOmB2Ze9Atc52SkZ1JbXgIHfK4L/FvEIdeDpOLaTFff89+Gv/FXqww6wC7wZPxPfKcEBd+t7/jjmB2Ef+CRJkiRJkiRJkiRJkiRJkiRJkiSV+fwF59lfaqjLsAEAAAAASUVORK5CYII=);background-size:cover;background-repeat:no-repeat}.detail-header h1{position:absolute;bottom:20px;left:20px;letter-spacing:1px;filter:drop-shadow(0 0 20px var(--bg-border))}.detail-content,.detail-gallery{display:flex;flex-direction:column;margin:5%;color:var(--text-secondary)}.dc-primary,.dc-secondary{padding:10px}.dc-primary h2,.dc-secondary h2,.detail-gallery h2{font-size:1.6rem;letter-spacing:1px;margin:10px 0;color:var(--text-primary)}.primary-impact{margin-top:20px}.secondary-stack{display:flex;flex-direction:column}.stack-list{display:flex;flex-wrap:wrap;gap:5px}.stack-list span{font-size:1rem;padding:4px 8px;border-radius:10px;border:1px solid var(--bg-border);background:var(--bg-main)}.secondary-buttons{display:flex;flex-direction:column;margin-top:20px;gap:10px}.secondary-buttons button{padding:10px;border-radius:10px;width:100%;border:1px solid var(--accent-soft);color:var(--text-primary);background:var(--bg-border)}.secondary-live{padding:10px;border-radius:10px;color:var(--bg-border)!important;background:var(--accent-soft)!important}.detail-gallery h2{text-align:center}.gallery-content img{max-width:100%;margin:10px 0;border-radius:10px;box-shadow:0 0 12px var(--bg-border)}@media(max-width:900px){.detail-main{margin:0 5%}}@media(min-width:900px){.detail-header button:hover{box-shadow:0 0 12px var(--accent-primary)}.detail-content{display:flex;justify-content:space-between;flex-direction:row}.dc-primary{max-width:500px}.dc-secondary{max-width:200px}.detail-gallery{display:flex;justify-content:center;align-items:center}.gallery-content{display:grid;grid-template-columns:repeat(2,1fr);max-width:100%;gap:10px;padding:10px}.gallery-content img{margin:0;width:100%;height:auto;object-fit:cover}.gallery-content img:last-child:nth-child(odd){justify-self:center;grid-column:span 2;width:49%;height:auto}.secondary-buttons button:hover{background:var(--bg-main);transition:background-color 1s ease-in-out;transform:translateY(-4px)}}.page.about{color:var(--text-primary)}.page.about h2{font-size:2.2rem;font-weight:300;letter-spacing:1px;margin:20px 0}.page.about h3,.page.about h4{margin-bottom:10px;font-weight:300;letter-spacing:1px}.page.about hr{width:75%;height:2px;border:none;margin-bottom:20px;background-image:linear-gradient(to right,var(--accent-primary),transparent)}.about-education,.about-achievements{margin:10%}.education-content{display:flex;flex-direction:column;gap:20px}.education-school,.education-classes,.achievements-list{display:flex;flex-direction:column;margin:10px 0;padding:20px;border-radius:10px;background:var(--bg-surface);border:2px solid var(--bg-border);box-shadow:0 0 12px var(--bg-border)}.classes-taken{display:flex;flex-direction:column;gap:10px;color:var(--text-secondary)}.classes-taken span{padding:10px;border-radius:10px;border:2px solid var(--bg-main);background:var(--bg-border)}.education-school span,.achievement-card span{color:var(--text-secondary)}@media(min-width:900px){.about-education,.about-achievements{margin:60px 10%}.education-content{display:flex;flex-direction:row;gap:100px}.education-school{width:100%;max-width:fit-content;height:max-content}.education-classes{width:100%}.classes-taken{display:flex;flex-direction:row;flex-wrap:wrap;width:100%}.achievements-list{width:100%;max-width:fit-content}}.site-footer{display:flex;justify-content:center;align-items:center;width:100%;min-height:5.2rem;background:var(--bg-border);color:var(--text-primary)}.footer-content p{margin:0;font-size:1rem;letter-spacing:1px}
