:root{--vt-c-white: #ffffff;--vt-c-white-soft: #f8f8f8;--vt-c-white-mute: #f2f2f2;--vt-c-black: #19192a;--vt-c-black-soft: #222222;--vt-c-black-mute: #282828;--vt-c-indigo: #2c3e50;--vt-c-divider-light-1: rgba(60, 60, 60, .29);--vt-c-divider-light-2: rgba(60, 60, 60, .12);--vt-c-divider-dark-1: rgba(84, 84, 84, .65);--vt-c-divider-dark-2: rgba(84, 84, 84, .48);--vt-c-text-light-1: var(--vt-c-indigo);--vt-c-text-light-2: rgba(60, 60, 60, .66);--vt-c-text-dark-1: var(--vt-c-white);--vt-c-text-dark-2: rgba(235, 235, 235, .804);--color-background: var(--vt-c-white);--color-background-soft: var(--vt-c-white-soft);--color-background-mute: var(--vt-c-white-mute);--color-border: var(--vt-c-divider-light-2);--color-border-hover: var(--vt-c-divider-light-1);--color-heading: var(--vt-c-text-light-1);--color-text: var(--vt-c-text-light-1);--color-primary: hsla(160, 100%, 37%, 1);--color-primary-dark: hsla(160, 100%, 30%, 1);--color-primary-subtle: hsla(160, 100%, 37%, .2);--color-error: #c92a2a;--section-gap: 2rem;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 20px;--radius-full: 50%;--space-xs: .5rem;--space-sm: .75rem;--space-md: 1.5rem;--space-lg: 2rem;--space-xl: 2.5rem}@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--color-background: var(--vt-c-black);--color-background-soft: var(--vt-c-black-soft);--color-background-mute: var(--vt-c-black-mute);--color-border: var(--vt-c-divider-dark-2);--color-border-hover: var(--vt-c-divider-dark-1);--color-heading: var(--vt-c-text-dark-1);--color-text: var(--vt-c-text-dark-2);--color-error: #ff8787}}:root[data-theme=dark]{--color-background: var(--vt-c-black);--color-background-soft: var(--vt-c-black-soft);--color-background-mute: var(--vt-c-black-mute);--color-border: var(--vt-c-divider-dark-2);--color-border-hover: var(--vt-c-divider-dark-1);--color-heading: var(--vt-c-text-dark-1);--color-text: var(--vt-c-text-dark-2);--color-error: #ff8787}*,*:before,*:after{box-sizing:border-box;margin:0;font-weight:400}body{min-height:100vh;overflow-x:hidden;color:var(--color-text);background:var(--color-background);transition:color .5s,background-color .5s;line-height:1.6;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;font-size:1.1rem;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.section-layout{max-width:1000px;margin:0 auto;padding:var(--section-gap);text-align:center}header,h1,h2{color:var(--color-heading)}h1,h2{margin-bottom:var(--space-lg)}html{scroll-behavior:smooth}#app{width:100%;max-width:1200px;margin:0 auto;padding:1rem}a{text-decoration:none;color:var(--color-primary);transition:.4s;padding:3px}.green{color:var(--color-primary)}@media(hover:hover){a:hover{background-color:var(--color-primary-subtle)}}@media(min-width:1024px){#app{padding:0 2rem;max-width:80vw}}.theme-toggle{background:none;border:none;cursor:pointer;padding:.5rem;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-sm);transition:background-color .3s}.theme-toggle:hover{background-color:var(--color-background-soft)}.theme-toggle:hover .theme-toggle-icon{background-color:var(--color-primary);transform:rotate(30deg)}.theme-toggle .theme-toggle-icon{display:inline-block;width:1.5rem;height:1.5rem;background-color:var(--color-text);-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;transition:background-color .3s,transform .5s ease}.theme-toggle .theme-toggle-icon.sun{-webkit-mask-image:url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3c!--%20Uploaded%20to:%20SVG%20Repo,%20www.svgrepo.com,%20Generator:%20SVG%20Repo%20Mixer%20Tools%20--%3e%3csvg%20width='800px'%20height='800px'%20viewBox='0%200%2024%2024'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M3%2012H5M5.00006%2019L7.00006%2017M12%2019V21M17%2017L19%2019M5%205L7%207M19%2012H21M16.9999%207L18.9999%205M12%203V5M15%2012C15%2013.6569%2013.6569%2015%2012%2015C10.3431%2015%209%2013.6569%209%2012C9%2010.3431%2010.3431%209%2012%209C13.6569%209%2015%2010.3431%2015%2012Z'%20stroke='%23000000'%20stroke-width='1.5'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3c/svg%3e");mask-image:url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3c!--%20Uploaded%20to:%20SVG%20Repo,%20www.svgrepo.com,%20Generator:%20SVG%20Repo%20Mixer%20Tools%20--%3e%3csvg%20width='800px'%20height='800px'%20viewBox='0%200%2024%2024'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M3%2012H5M5.00006%2019L7.00006%2017M12%2019V21M17%2017L19%2019M5%205L7%207M19%2012H21M16.9999%207L18.9999%205M12%203V5M15%2012C15%2013.6569%2013.6569%2015%2012%2015C10.3431%2015%209%2013.6569%209%2012C9%2010.3431%2010.3431%209%2012%209C13.6569%209%2015%2010.3431%2015%2012Z'%20stroke='%23000000'%20stroke-width='1.5'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3c/svg%3e")}.theme-toggle .theme-toggle-icon.moon{-webkit-mask-image:url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3c!--%20Uploaded%20to:%20SVG%20Repo,%20www.svgrepo.com,%20Generator:%20SVG%20Repo%20Mixer%20Tools%20--%3e%3csvg%20width='800px'%20height='800px'%20viewBox='0%200%2024%2024'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M3.32031%2011.6835C3.32031%2016.6541%207.34975%2020.6835%2012.3203%2020.6835C16.1075%2020.6835%2019.3483%2018.3443%2020.6768%2015.032C19.6402%2015.4486%2018.5059%2015.6834%2017.3203%2015.6834C12.3497%2015.6834%208.32031%2011.654%208.32031%206.68342C8.32031%205.50338%208.55165%204.36259%208.96453%203.32996C5.65605%204.66028%203.32031%207.89912%203.32031%2011.6835Z'%20stroke='%23000000'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3c/svg%3e");mask-image:url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3c!--%20Uploaded%20to:%20SVG%20Repo,%20www.svgrepo.com,%20Generator:%20SVG%20Repo%20Mixer%20Tools%20--%3e%3csvg%20width='800px'%20height='800px'%20viewBox='0%200%2024%2024'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M3.32031%2011.6835C3.32031%2016.6541%207.34975%2020.6835%2012.3203%2020.6835C16.1075%2020.6835%2019.3483%2018.3443%2020.6768%2015.032C19.6402%2015.4486%2018.5059%2015.6834%2017.3203%2015.6834C12.3497%2015.6834%208.32031%2011.654%208.32031%206.68342C8.32031%205.50338%208.55165%204.36259%208.96453%203.32996C5.65605%204.66028%203.32031%207.89912%203.32031%2011.6835Z'%20stroke='%23000000'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3c/svg%3e")}.site-header{position:sticky;top:0;left:0;right:0;line-height:1.5;display:flex;justify-content:center;background-color:var(--color-background);z-index:100;width:100vw;margin-left:calc(-50vw + 50%);margin-right:calc(-50vw + 50%);padding:1rem 0;border-bottom:1px solid var(--color-border)}.site-header .menu-toggle{display:none;background:none;border:none;cursor:pointer;padding:1rem;z-index:101}.site-header .header-theme-toggle{position:absolute;right:2rem;top:50%;transform:translateY(-50%)}.site-header .hamburger{display:block;width:24px;height:2px;background:var(--color-text);position:relative;transition:background .3s}.site-header .hamburger:before,.site-header .hamburger:after{content:"";position:absolute;width:24px;height:2px;background:var(--color-text);left:0;transition:transform .3s}.site-header .hamburger:before{top:-8px}.site-header .hamburger:after{bottom:-8px}.site-header .menu-toggle.is-active .hamburger{background:transparent}.site-header .menu-toggle.is-active .hamburger:before{transform:translateY(8px) rotate(45deg)}.site-header .menu-toggle.is-active .hamburger:after{transform:translateY(-8px) rotate(-45deg)}.site-header nav{display:flex;place-items:center;flex-direction:row;transition:all .3s ease}.site-header nav a{display:inline-block;padding:0 1.3rem;color:inherit;font-weight:500}.site-header nav a:not(:first-child){border-left:2px solid var(--color-border)}.site-header nav a:hover{color:var(--color-primary);transform:translateY(-2px)}@media(max-width:768px){.site-header{justify-content:flex-end;align-items:center;padding-right:1rem}.site-header .menu-toggle{display:block}.site-header .header-theme-toggle{right:4.5rem}.site-header nav{position:fixed;top:0;right:-100%;width:70%;height:100vh;background-color:var(--color-background);flex-direction:column;justify-content:center;box-shadow:-2px 0 10px #0000001a;z-index:100}.site-header nav.is-open{right:0}.site-header nav a{padding:1.5rem;font-size:1.2rem;width:100%;text-align:center}.site-header nav a:not(:first-child){border-left:none;border-top:1px solid var(--color-border)}}.hero img{border-radius:var(--radius-full)}.about{display:flex;flex-direction:column;align-items:center}.about p{width:100%;text-align:left}@media(min-width:768px){.about p{width:80%}}.project-card{text-align:left;border-radius:var(--radius-lg);border:1px solid var(--color-border);padding:var(--space-md);background-color:var(--color-background-soft);transition:transform .3s ease}.project-card:hover{transform:scale(1.05)}.project-card h3,.project-card p{margin-bottom:1rem}.project-card h3{color:var(--color-heading)}.projects .projects-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:var(--space-lg);margin-top:var(--space-lg)}.skills .skills-grid{display:flex;flex-wrap:wrap;gap:var(--space-xl);justify-content:center;margin:0 auto;max-width:800px}@media(min-width:768px){.skills .skills-grid{display:grid;grid-template-rows:repeat(2,auto);grid-auto-flow:column}}.skills .skill-icon{transition:transform .3s ease}.skills .skill-icon:hover{transform:scale(1.2);cursor:pointer}.contact{background:var(--color-background-soft);border-radius:var(--radius-md);margin-bottom:var(--section-gap)}.contact h2{margin-bottom:1rem;color:var(--color-heading)}.contact p{margin-bottom:var(--section-gap);color:var(--color-text)}.contact form,.contact div{display:flex;flex-direction:column}.contact form{gap:var(--space-md);width:100%;margin:0 auto}@media(min-width:768px){.contact form{width:80%;max-width:800px}}.contact label{text-align:left;color:var(--color-heading);font-weight:600;margin-left:.5rem;margin-bottom:.5rem}.contact .error-message{color:var(--color-error);font-size:.875rem;margin-top:.25rem;text-align:left}.contact input,.contact textarea{padding:var(--space-sm);border:2px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-background);color:var(--color-text);font-family:inherit;font-size:1rem;transition:border-color .4s,box-shadow .4s}.contact input:focus,.contact textarea:focus{outline:none;border-color:var(--color-primary)}.contact textarea{resize:vertical;min-height:120px}.contact button{padding:var(--space-sm) var(--space-lg);background:var(--color-primary);color:var(--vt-c-black);border:none;border-radius:var(--radius-sm);font-size:1rem;font-weight:600;cursor:pointer;transition:all .4s;margin-top:var(--space-xs)}@media(hover:hover){.contact button:hover{background:#00e699;color:var(--vt-c-black);transform:translateY(-2px);box-shadow:0 4px 12px var(--color-primary-subtle)}}.contact button:active{transform:translateY(0)}
