:root{--color-bg: #222222;--color-surface: rgb(24, 23, 23);--color-text: #EAEAEA;--color-muted: #333;--color-accent: #FFD700;--color-accent-hover: #c3a602;--color-accent-strong: #e6c200;--color-accent-soft: rgba(255, 215, 0, .1);--color-accent-glow: rgba(255, 215, 0, .3);--font-display: "Red Hat Display", sans-serif;--font-body: "Trebuchet MS", "Lucida Sans Unicode", "Lucida Grande", "Lucida Sans", Arial, sans-serif;--font-mono: "Courier New", Courier, monospace;--ease-out: cubic-bezier(.22, 1, .36, 1);--ease-in-out: cubic-bezier(.65, 0, .35, 1);--dur-fast: .15s;--dur: .25s;--dur-slow: .45s;--nav-height: 90px;--nav-height-mobile: 64px;--container-max: 1500px;--space-1: 4px;--space-2: 8px;--space-3: 16px;--space-4: 24px;--space-5: 40px;--space-6: 64px;font-family:var(--font-body);color:var(--color-text);background-color:var(--color-bg);scroll-behavior:smooth}html{font-size:clamp(15px,.95vw + 9px,17px)}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin:0;padding:0}body{overflow-x:hidden}.page-transition{animation:pageIn var(--dur-slow) var(--ease-out) both}@keyframes pageIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.reveal{opacity:0;transform:translateY(16px);transition:opacity var(--dur-slow) var(--ease-out),transform var(--dur-slow) var(--ease-out);will-change:opacity,transform}.reveal.is-visible{opacity:1;transform:none}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.reveal{opacity:1;transform:none}}*{box-sizing:border-box;margin:0;padding:0}.navbar{position:relative;width:100%;min-height:var(--nav-height);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding-left:3%;padding-right:3%;background:var(--color-surface);color:var(--color-text);font-family:var(--font-display);z-index:50}.nav-links{grid-column:2;justify-self:center;display:flex;flex-wrap:wrap;gap:5%;font-size:clamp(21px,1.6vw,35px);color:var(--color-accent);font-weight:400}.name:hover{cursor:pointer;color:#cecece}.nav-link{position:relative;cursor:pointer;color:var(--color-accent);text-decoration:none;padding:6px 2px;transition:color var(--dur) var(--ease-out)}.nav-link:after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--color-accent-hover);transform:scaleX(0);transform-origin:center;transition:transform var(--dur) var(--ease-out)}.nav-link:hover{color:var(--color-accent-hover)}.nav-link:hover:after,.nav-link.is-active:after{transform:scaleX(1)}.nav-link.is-active{color:var(--color-accent-strong)}.social-icons{grid-column:3;justify-self:end;display:flex;gap:30px}.icon{height:clamp(30px,3vw,80px);width:auto;filter:invert(50%) sepia(100%) saturate(2000%) hue-rotate(30deg) brightness(150%) contrast(100%);transition:transform var(--dur) var(--ease-out),filter var(--dur) var(--ease-out)}.icon:hover{cursor:pointer;transform:translateY(-2px) scale(1.05);filter:invert(50%) sepia(90%) saturate(600%) hue-rotate(20deg) brightness(100%) contrast(100%)}.nav-toggle{display:none;grid-column:3;justify-self:end;width:44px;height:44px;background:transparent;border:none;cursor:pointer;padding:10px;position:relative;z-index:110}.nav-toggle__bar{display:block;width:100%;height:2px;background:var(--color-accent);margin:5px 0;transition:transform var(--dur) var(--ease-out),opacity var(--dur-fast) var(--ease-out);transform-origin:center}.nav-toggle[aria-expanded=true] .nav-toggle__bar:nth-child(1){transform:translateY(7px) rotate(45deg)}.nav-toggle[aria-expanded=true] .nav-toggle__bar:nth-child(2){opacity:0}.nav-toggle[aria-expanded=true] .nav-toggle__bar:nth-child(3){transform:translateY(-7px) rotate(-45deg)}.mobile-menu{position:fixed;inset:0;background:#222222f7;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);display:none;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-5);padding:var(--space-5);z-index:100;opacity:0;pointer-events:none;transition:opacity var(--dur) var(--ease-out)}.mobile-menu[data-open=true]{display:flex;opacity:1;pointer-events:auto;animation:overlayIn var(--dur-slow) var(--ease-out)}@keyframes overlayIn{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}.mobile-menu .nav-links{flex-direction:column;align-items:center;gap:var(--space-4);font-size:clamp(18px,5vw,28px);text-align:center;word-break:break-word;max-width:100%}.mobile-menu .nav-link{min-height:44px;display:inline-flex;align-items:center}.mobile-menu .social-icons{gap:var(--space-4);justify-self:center}.mobile-menu .icon{height:36px}.footer{font-family:var(--font-display);font-size:clamp(15px,1vw,30px);display:flex;align-items:flex-end;width:100%;justify-content:center;padding-bottom:1.2vh;padding-top:var(--space-3);color:var(--color-accent)}@media(max-width:768px){.navbar{min-height:var(--nav-height-mobile);grid-template-columns:1fr auto;padding-left:var(--space-3);padding-right:var(--space-3)}.navbar>.nav-links,.navbar>.social-icons{display:none}.nav-toggle{display:block}}.body{display:flex;padding-top:var(--space-4);padding-left:clamp(16px,6vw,10%);padding-right:clamp(16px,6vw,10%);justify-content:center;flex-direction:column;align-items:flex-start;width:100%;color:var(--color-accent)}.wrapper{display:flex;flex-direction:row;width:100%;max-width:var(--container-max);margin-top:var(--space-4);gap:var(--space-5);align-items:center}.introtext{display:flex;flex-direction:column;max-width:800px;flex:4}.me-container{flex:2;display:flex;justify-content:center;align-items:center}.hi{font-family:var(--font-body);font-size:clamp(36px,6vw,60px);margin-bottom:3vh;line-height:1.1;word-break:break-word}.aboutme{font-size:clamp(16px,1.4vw,20px);line-height:1.55;width:100%}.me{width:min(420px,80vw);height:auto;aspect-ratio:1 / 1;object-fit:cover;border-radius:clamp(40px,8vw,100px);transition:transform var(--dur-slow) var(--ease-out)}.me:hover{transform:translateY(-4px) scale(1.01)}.skillhead{font-size:clamp(28px,4vw,40px);margin-top:var(--space-5)}.skillbody{display:flex;flex-direction:row;flex-wrap:wrap;gap:var(--space-4);font-size:clamp(15px,1.4vw,20px);padding-top:var(--space-5);width:100%;max-width:var(--container-max);justify-content:center;margin-bottom:var(--space-4)}.skilldesc{display:flex;flex-direction:column;font-size:clamp(18px,1.6vw,25px);justify-content:center;align-items:center}.skillbox{display:flex;flex-direction:row;flex-wrap:wrap;font-size:clamp(14px,1.3vw,20px);width:clamp(160px,40vw,270px);aspect-ratio:1 / 1;gap:var(--space-3);justify-content:center;align-items:center;padding:var(--space-2);background-color:var(--color-accent);border:1px solid black;border-radius:20px;color:var(--color-bg);transition:transform var(--dur) var(--ease-out),box-shadow var(--dur) var(--ease-out)}.skillbox:hover{transform:translateY(-4px);box-shadow:0 10px 24px var(--color-accent-glow)}.marginbot{margin-bottom:10px}@media(max-width:900px){.wrapper{flex-direction:column;gap:var(--space-4);align-items:center;text-align:left}.me-container{order:-1}}@media(max-width:480px){.skillbody{gap:var(--space-3)}}.underconst{display:flex;justify-content:center;align-items:center;height:500px;color:var(--color-accent);font-size:20px}.cards{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;align-items:stretch;height:auto;width:100%;margin-top:var(--space-5);padding:0 clamp(16px,4vw,40px);gap:clamp(16px,3vw,40px);margin-bottom:var(--space-4)}.projbody{color:var(--color-accent);border:1px solid var(--color-accent);width:clamp(280px,90vw,420px);height:auto;padding:var(--space-2);flex-direction:column;display:flex;border-radius:8px;background:#ffd70005;transition:transform var(--dur) var(--ease-out),box-shadow var(--dur) var(--ease-out),border-color var(--dur) var(--ease-out)}.projbody:hover{transform:translateY(-6px);box-shadow:0 12px 30px var(--color-accent-glow);border-color:var(--color-accent-strong)}.projheader{display:flex;justify-content:center;align-items:center;flex-direction:column;text-align:center}.projimg{width:100%;height:200px;object-fit:cover;margin:var(--space-3) 0;border-radius:6px;transition:transform var(--dur-slow) var(--ease-out)}.projbody:hover .projimg{transform:scale(1.02)}.projectdesc{padding:var(--space-2);padding-top:0;font-size:clamp(14px,1.1vw,16px);line-height:1.5}.projectdesc p{margin-bottom:6px}.resume{display:flex;justify-content:center;align-items:center;padding:var(--space-4) clamp(16px,5vw,var(--space-6))}.resumeimg{width:min(900px,100%);height:auto;border:1px solid var(--color-accent-soft);border-radius:8px;box-shadow:0 6px 20px #0006;transition:transform var(--dur-slow) var(--ease-out)}.resumeimg:hover{transform:translateY(-2px)}@media(max-width:768px){.resumeimg{width:100%}}.contact-wrapper{display:flex;flex-direction:column;width:100%;max-width:800px;margin-top:var(--space-4);padding:0 clamp(16px,5vw,40px);box-sizing:border-box}.contact-form{display:flex;flex-direction:column;gap:var(--space-4);margin-top:var(--space-3)}.input-group{display:flex;flex-direction:column;gap:var(--space-2)}.input-label{font-size:clamp(16px,1.4vw,20px);font-family:var(--font-body)}.terminal-input{width:100%;box-sizing:border-box;background-color:transparent;border:2px solid var(--color-accent);border-radius:10px;padding:15px;color:var(--color-accent);font-size:max(16px,1rem);font-family:var(--font-mono);outline:none;transition:background-color var(--dur) var(--ease-out),box-shadow var(--dur) var(--ease-out),border-color var(--dur) var(--ease-out)}.terminal-input:focus{background-color:var(--color-accent-soft);box-shadow:0 0 10px var(--color-accent-glow);border-color:var(--color-accent-strong)}.terminal-textarea{min-height:150px;resize:vertical}.submit-btn{align-self:flex-start;background-color:var(--color-accent);color:var(--color-bg);border:none;padding:12px 30px;min-height:48px;font-size:clamp(16px,1.4vw,20px);font-weight:700;border-radius:10px;cursor:pointer;transition:background-color var(--dur) var(--ease-out),transform var(--dur) var(--ease-out),box-shadow var(--dur) var(--ease-out);margin-top:var(--space-2);font-family:var(--font-body)}.submit-btn:hover:not(:disabled){background-color:var(--color-accent-strong);transform:translateY(-2px);box-shadow:0 8px 18px var(--color-accent-glow)}.submit-btn:disabled{opacity:.6;cursor:not-allowed}