:root{--primary: #004d4d;--secondary: #4d4d00;--text-primary: white;--text-shadow: 2px 2px var(--primary);--bg-light: rgba(0, 0, 0, .1);--bg-dark: rgba(0, 0, 0, .25);--bg-hover: rgba(0, 0, 0, .5);--bg-gradient: linear-gradient(-145deg, var(--secondary), var(--primary), var(--secondary), var(--primary));--bg-gradient-size: 400% 400%;--bg-gradient-duration: 10s;--space-1: .25rem;--space-2: .5rem;--space-2-5: .75rem;--space-3: 1rem;--space-3-5: 1.5rem;--space-4: 2rem;--text-body: 1.1rem;--text-display: clamp(1.5rem, min(6.5vw, 12vh), 6.75rem);--text-btn: clamp(.75rem, min(1.5vw, 3vh), 1.75rem);--text-sm: clamp(.6rem, min(1.5vw, 1.9vh), 1rem);--text-lg: clamp(.75rem, min(2.5vw, 3.5vh), 1.75rem);--subtitle-size: var(--text-sm);--letter-spacing-sm: 1px;--letter-spacing-lg: 3px;--line-height-prose: 1.6;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 16px;--radius-icon: clamp(5px, 1.5vw, 20px);--border-thin: 2px solid var(--primary);--border-thick: 4px solid var(--primary);--border-btn: clamp(2px, .3vw, 4px) solid var(--primary);--hover-bg-duration: .2s;--hover-bounce-duration: .2s;--fade-duration: .3s;--layout-padding-y: var(--space-3-5);--layout-padding: var(--layout-padding-y) var(--space-3);--layout-gap: var(--space-2);--panels-gap: var(--space-3-5);--header-gap: var(--space-3-5);--single-gap: var(--space-4);--panels-direction: column;--panel-direction: column;--panel-reverse-direction: column-reverse;--panel-reverse-justify: center;--nav-icon-size: clamp(2rem, min(5vw, 9vh), 5rem);--nav-icon-padding: 2px;--nav-margin-top: clamp(2vh, 6vw, 10vh);--nav-gap: clamp(5px, 1vw, 10px);--card-radius: 10px;--card-min-height: 320px;--card-min-width: 160px;--card-img-max-height: 240px;--preview-max-height: 250px;--preview-icon-size: clamp(2rem, min(9vw, 10vh), 5rem);--badge-radius: 15px;--badge-padding: 10px;--tech-icon-size: 80px;--tech-size: clamp(1.5rem, min(6vw, 12vh), 6rem);--tech-gap: clamp(.5rem, 2vw, 1.5rem);--skill-icon-padding: 5px;--embed-height: 60vh;--form-padding: clamp(4px, 1.5vw, 10px);--textarea-height: 6vh;--input-margin: 1vh 0;--output-margin-top: 2vh;--btn-padding: var(--space-2) var(--space-3);--stack-gap: var(--space-2)}@font-face{font-family:Bebas Neue;src:url(../fonts/bebas-neue-v16-latin-regular.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}@keyframes gradient{0%,to{background-position:0% 50%}50%{background-position:100% 0%}}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box;list-style:none;text-decoration:none}a,button,input,textarea{cursor:inherit;color:inherit;font:inherit}html{background:#000;color:var(--text-primary);text-shadow:var(--text-shadow);font-family:Bebas Neue,system-ui,sans-serif}body{width:100%;height:100dvh;background:var(--bg-gradient);background-size:var(--bg-gradient-size);animation:gradient var(--bg-gradient-duration) ease infinite;overflow:hidden}.hidden{display:none;pointer-events:none}.fade-out{opacity:0;pointer-events:none}.stack{display:flex;flex-direction:column;gap:var(--stack-gap);padding-top:var(--stack-gap)}.hover-cursor{cursor:pointer}.hover-bg{transition:background var(--hover-bg-duration) ease}.hover-bg:hover{background:var(--bg-hover)}.hover-bounce{transition:scale var(--hover-bounce-duration) ease}.hover-bounce:hover{scale:1.05}.hover-bounce.hover-bg{transition:scale var(--hover-bounce-duration) ease,background var(--hover-bg-duration) ease}.btn{display:inline-block;text-align:center;font-weight:400;font-family:inherit;font-size:var(--text-btn);background:var(--bg-dark);padding:var(--btn-padding);border:var(--border-btn);border-radius:var(--radius-lg)}.btn-full{width:100%;display:block}.btn-active{background:var(--bg-hover)}input,textarea{width:100%;padding:var(--form-padding);border:var(--border-thin);background:var(--bg-light)}input[type=submit]{padding:var(--form-padding)}textarea{text-align:left;height:var(--textarea-height)}.email-input{margin:var(--input-margin)}label{font-size:var(--text-sm)}#first-output,.panel-content input,.panel-content textarea,#skills-div{font-family:Arial,Helvetica,sans-serif}.nav-icon{display:block;width:var(--nav-icon-size);height:var(--nav-icon-size);padding:var(--nav-icon-padding);background:var(--bg-light);border:var(--border-thin);border-radius:var(--radius-icon)}.project-card img{max-height:var(--card-img-max-height);margin-bottom:var(--space-2-5)}#project-preview{max-height:var(--preview-max-height);margin-bottom:var(--space-3)}.project-card img,#project-preview{width:100%;object-fit:cover;border-radius:var(--radius-md);-webkit-user-drag:none;-webkit-user-select:none;user-select:none}.panel-content>a img{width:var(--preview-icon-size);height:var(--preview-icon-size);padding:var(--space-1);border:var(--border-thick);border-radius:var(--radius-icon)}#skills-div img{width:var(--tech-size);height:auto;padding:var(--skill-icon-padding);border-radius:var(--radius-icon)}#projects-grid{display:grid;gap:var(--space-3-5);overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;grid-template-columns:repeat(auto-fit,minmax(var(--card-min-width),1fr));grid-auto-rows:max-content}#projects-grid,#project-details{flex:1;transition:opacity var(--fade-duration) ease;opacity:1;padding:var(--space-3-5)}#project-details{overflow-y:auto;background:var(--bg-light);border-radius:var(--card-radius);display:flex;flex-direction:column}#project-details h3{font-size:var(--text-display);margin:0 0 var(--space-3-5) 0;font-weight:700;letter-spacing:var(--letter-spacing-sm)}#project-details p{font-size:var(--text-body);line-height:var(--line-height-prose);margin:var(--space-3-5) 0}#project-buttons{display:flex;gap:var(--space-3)}.project-card{display:flex;flex-direction:column;justify-content:space-between;pointer-events:auto;text-align:center;font-size:var(--text-lg);border-radius:var(--card-radius);background:var(--bg-dark);padding:var(--space-3-5);min-height:var(--card-min-height)}.project-card h4{margin:0;font-size:var(--text-lg);font-weight:700}.project-tech{display:flex;gap:var(--space-2-5);margin:var(--space-3) 0;flex-wrap:wrap}.tech{border:var(--border-thick);border-radius:var(--badge-radius);background:var(--bg-dark);width:var(--tech-size);aspect-ratio:3 / 4;padding:var(--badge-padding)}.tech-icon{width:var(--tech-icon-size);height:var(--tech-icon-size);object-fit:contain;background:var(--bg-light);padding:var(--space-2);border-radius:var(--radius-md)}#embed-container iframe{width:100%;height:var(--embed-height);border:0}.layout-single,.layout-double{width:100%;height:100dvh;display:flex;flex-direction:column;align-items:center;padding:var(--layout-padding);gap:var(--layout-gap)}header{width:100%;display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:nowrap;gap:var(--header-gap)}header h1{font-size:var(--text-display);line-height:1;letter-spacing:var(--letter-spacing-lg);white-space:nowrap}header p{font-size:var(--subtitle-size);margin-top:var(--space-2)}header p .btn{font-size:var(--text-sm);padding:var(--space-1) var(--space-3)}#header-nav{display:flex;align-items:center;gap:var(--space-2)}.panel-single{width:100%;flex:1;min-height:0;display:flex;justify-content:center;align-items:center}.panels-double{width:100%;flex:1;min-height:0;display:flex;flex-direction:var(--panels-direction);gap:var(--panels-gap)}.panel-double{flex:1;display:flex;flex-direction:var(--panel-direction)}.panel-double--reverse{flex-direction:var(--panel-reverse-direction);justify-content:var(--panel-reverse-justify)}.panel-nav{display:flex;justify-content:space-evenly;align-content:center;margin-top:var(--nav-margin-top);column-gap:var(--nav-gap)}#first-output,.panel-content{width:100%}.panel-content{margin-top:var(--output-margin-top);display:flex;justify-content:space-evenly}.panel-content a{text-align:center}#first-output{text-align:left}#first-output,.panel-content input,.panel-content textarea,#skills-div{font-size:var(--text-sm)}#skills-div{text-align:center;display:flex;flex-direction:column}.image-out{display:flex;flex-direction:row;justify-content:space-evenly}.image-out,#skills-div{gap:var(--tech-gap)}#resume-display,#projects-grid,#project-details{width:100%;height:100%;border:var(--border-thin);border-radius:var(--radius-md);background:var(--bg-light)}@media(min-width:768px){:root{--subtitle-size: var(--text-lg);--layout-padding-y: clamp(1rem, 6vh, 10vh);--layout-padding: var(--layout-padding-y) 10vw;--panels-gap: 10vw;--single-gap: 5vw;--panels-direction: row;--panel-reverse-direction: column;--panel-reverse-justify: flex-start}.layout-single{gap:var(--single-gap);flex-direction:row;align-items:flex-start;justify-content:space-evenly;padding-right:var(--layout-padding-y)}.layout-single header{width:25%}.panel-single{width:60%;height:100%}header p .btn{border:none;background:none;font-size:inherit;padding:0 var(--space-1);border-radius:var(--radius-sm)}}@media not (min-width:481px){:root{--text-display: 9.5vw;--text-lg: 3vw;--text-sm: 2.75vmin;--text-btn: 4vw;--btn-padding: 1.5vw;--nav-icon-size: 12.5vw;--nav-margin-top: 2vh;--output-margin-top: 2vh;--form-padding: 4px;--textarea-height: 7vh;--stack-gap: .8vh;--tech-size: 15vw}}@media(max-width:972px){#email-icon{display:none}}@media(min-width:481px)and (not (min-width:768px)){:root{--text-display: 9.5vmin;--text-lg: 3vmin;--text-sm: 2.1vmin;--text-btn: 3.5vmin;--btn-padding: 1vmin;--nav-icon-size: 9vmin;--nav-margin-top: 1vh;--output-margin-top: 1vh;--form-padding: 4px;--textarea-height: 6vh;--stack-gap: .8vh}}@media(max-height:430px)and (min-width:360px)and (max-width:972px){:root{--text-display: 7.5vw;--text-lg: 2.5vw;--text-sm: 2vmin;--text-btn: 3.5vmin;--btn-padding: 1vmin;--nav-icon-size: 8vw;--nav-margin-top: 1vh;--output-margin-top: 1vh;--textarea-height: 6vh;--stack-gap: 1vh;--layout-padding: 2vh 4vw;--panels-direction: row;--panel-reverse-direction: column;--panel-reverse-justify: flex-start;--tech-size: 5vw;--tech-gap: 1vw}#email-icon{display:inline-block}}@media(min-width:481px)and (max-width:972px)and (max-height:620px){:root{--layout-padding: 2vh 4vw;--panels-direction: row;--panel-reverse-direction: column;--panel-reverse-justify: flex-start}}@media(min-width:481px)and (not (min-width:768px))and (max-height:800px){#contact-page{--textarea-height: 5vh;--stack-gap: .5vh;--panels-direction: row;--panel-reverse-direction: column;--panel-reverse-justify: flex-start}}@media(not (min-width:481px))and (not (min-height:700px)){#contact-page{--panels-direction: row;--panel-reverse-direction: column;--panel-reverse-justify: flex-start}}@media(max-width:549px)and (max-height:549px){:root{--textarea-height: 4vh;--form-padding: 2px;--btn-padding: .8vmin;--nav-margin-top: .5vh;--output-margin-top: .5vh;--stack-gap: .5vh}}@media(min-width:768px)and (max-height:460px){:root{--textarea-height: 4vh;--nav-margin-top: .5vh;--output-margin-top: .5vh;--layout-padding-y: 1vh}}@media(max-width:320px){:root{--text-display: 8vw;--nav-icon-size: 10vw;--nav-gap: 1vw;--header-gap: 2vw}}