:root{color-scheme:dark;--color-background:#141414;--color-primary:#fff;--color-secondary:#ffffff8a;--color-accent-available:#50c935;--font-sans:var(--font-inter);--font-weight-regular:400;--font-weight-bold:600;--font-size-root:10px;--width-max:84.8rem;--width-text:56rem;--gap-grid:2.4rem;--gap-section:4.3rem;--radius-button:1rem;--img-border-stroke:#ffffff1a;--img-border-stroke-hover:#fff3}html{font-size:var(--font-size-root);overflow-x:clip}body{background-color:var(--color-background);color:var(--color-primary);font-family:var(--font-sans);font-weight:var(--font-weight-regular);max-width:var(--width-max);margin-inline:auto;padding:12rem 1.6rem 24rem;line-height:1.6}main{gap:var(--gap-section);flex-direction:column;display:flex}h1,h2,p,ul,li{margin:0;font-size:1.5rem}strong{font-weight:var(--font-weight-bold)}ul{padding-left:0}li{margin-left:2.4rem}section{gap:var(--gap-grid);width:100%;max-width:var(--width-text);flex-direction:column;margin-inline:auto;display:flex}.cta{flex-direction:row;align-items:center;gap:1.6rem;position:relative;&>.button{margin-right:auto}}.hover-card{box-sizing:border-box;width:28rem;color:var(--color-secondary);opacity:0;pointer-events:none;background:linear-gradient(#1f1f1f,#1a1a1a);border:1px solid #ffffff1a;border-radius:1.6rem;flex-direction:column;gap:.8rem;padding:1.5rem;display:flex;position:absolute;bottom:calc(100% + .8rem);right:0;transform:translateY(.8rem);box-shadow:0 .6rem 1.1rem -.5rem #00000038,0 .8rem 1.6rem #0000001f;& strong{color:var(--color-primary)}&[data-for=linkedin]{background:linear-gradient(#1f1f1f,#1b1f23)}&[data-for=github]{background:linear-gradient(#1f1f1f,#0d1117)}&[data-for=figma]{background:linear-gradient(#1f1f1f,#2c2c2c)}&:before{content:"";height:1.6rem;position:absolute;top:100%;left:0;right:0}}.hover-card-header{justify-content:space-between;display:flex}.avatar{border-radius:50%;width:4.8rem;height:4.8rem}.follow-button{border-radius:5rem;margin-top:.6rem}.socials{align-items:center;gap:1.6rem;display:flex}.social-link{fill:var(--color-secondary);transition:fill .1s ease-in-out;display:flex;&:hover{fill:var(--color-primary)}}.profile-picture{border-radius:1.4rem;width:8rem;height:8rem}.available{color:var(--color-accent-available)}.button{background-color:var(--color-primary);color:var(--color-background);border-radius:var(--radius-button);align-self:start;padding:.4rem 2rem .6rem;font-size:1.5rem;text-decoration:none;&:hover{background-color:#fffc;transition:background-color .1s ease-in}}.rolling-text{white-space:pre;display:block;position:relative;overflow:hidden}.rolling-copy{& span{display:inline-block}&+.rolling-copy{position:absolute;top:100%;left:0}}h2{font-weight:var(--font-weight-bold)}.experience-list{gap:var(--gap-grid);flex-direction:column;list-style:none;display:flex}.experience-item{gap:1.6rem;margin-left:0;display:flex}.experience-dates{text-overflow:ellipsis;white-space:nowrap;width:12.8rem;color:var(--color-secondary);font-variant-numeric:lining-nums tabular-nums;flex-shrink:0;overflow:hidden}.experience-details{flex-direction:column;flex:1;gap:.4rem;min-width:0;display:flex}.experience-heading{flex-wrap:wrap;align-items:baseline;column-gap:.8rem;display:flex}.experience-title a{color:inherit;text-decoration:none;&:hover{text-decoration:underline}}.experience-tag{color:var(--color-accent-available);font-size:1.1rem}.experience-description{color:var(--color-secondary);display:none}@media (width<=600px){.experience-item{flex-direction:column;gap:.4rem}.experience-dates{width:auto}}.projects{gap:var(--gap-grid);max-width:none;& h2{max-width:var(--width-text);width:100%;margin-inline:auto}}.project{flex-direction:column;gap:1.9rem;padding-bottom:3.2rem;display:flex}.project-details{width:100%;max-width:var(--width-text);align-items:flex-start;gap:1.6rem;margin-inline:auto;display:flex}.project-year{width:12.8rem;color:var(--color-secondary);font-variant-numeric:lining-nums tabular-nums;flex-shrink:0}.project-text{flex-direction:column;flex:1;justify-content:center;gap:.4rem;min-width:0;display:flex}.project-description{color:var(--color-secondary)}.gallery-buttons{gap:.8rem;display:flex}.gallery-button{cursor:pointer;background:0 0;border:0;padding:0;transition:opacity .1s ease-in-out;display:flex;&:disabled{opacity:.4;cursor:default}}.project-gallery{--gallery-inset:calc(50vw - min(var(--width-max), 100vw - 3.2rem) / 2);box-sizing:border-box;width:100vw;height:59.2rem;margin-inline:calc(-1 * var(--gallery-inset));padding-inline:var(--gallery-inset);scroll-padding-inline:var(--gallery-inset);scroll-snap-type:x proximity;scrollbar-width:none;gap:.8rem;display:flex;overflow-x:auto;&::-webkit-scrollbar{display:none}}.project-image{border-radius:var(--radius-button);scroll-snap-align:start;flex:none;height:100%;display:flex;overflow:hidden;& img{width:auto;height:100%;display:block}}@media (width<=600px){.project-details{flex-wrap:wrap;gap:.4rem}.project-year,.project-text{flex-basis:100%;width:auto}.gallery-buttons{margin-top:1.2rem}.project-gallery{height:40rem}}.side-projects{max-width:none;& h2{max-width:var(--width-text);width:100%;margin-inline:auto}}.side-project-grid{grid-template-columns:repeat(2,1fr);gap:.8rem;list-style:none;display:grid}.side-project{flex-direction:column;gap:.8rem;min-width:0;margin-left:0;display:flex;& img{box-sizing:border-box;object-fit:cover;border:1px solid var(--img-border-stroke);border-radius:var(--radius-button);width:100%;height:24rem;transition:border-color .1s ease-in-out;display:block;&:hover{border-color:var(--img-border-stroke-hover)}}}.side-project-tagline{color:var(--color-secondary)}
