body,html{font-size:16px}h4,h5{padding-bottom:1rem}body,img,svg{margin:0 auto}header,nav .nav{margin-inline:auto;width:var(--container-fixed-lrg)}.btn,.intro-continued{color:var(--primary-dark)}body,section.section-skills{background-color:var(--primary-dark)}.btn,.element,.link{cursor:pointer}#bg1,#bg2,#bg3,#bg4,#bg5,#bg6,#bg7,#bg8{background-position:center center}*,.element,::after,::before{box-sizing:border-box}.timeline,ol,ul{list-style:none}.date-reveal p span.title,.text-reveal span{-webkit-background-clip:text;background-image:linear-gradient(90deg,var(--yellow),var(--yellow))}footer,header,nav .nav{width:var(--container-fixed-lrg)}:where(:not(iframe,canvas,img,svg,video):not(svg *)){all:unset;display:revert}table{border-collapse:collapse}textarea{white-space:revert}:root{--primary-dark:hsl(224, 21%, 10%);--secondary-dark:hsl(225, 19%, 12%);--yellow:hsl(39, 73%, 71%);--blue:hsl(232, 19%, 70%);--text:hsl(180, 5%, 96%);--ui-color-brand:var(--yellow);--ui-color-background-primary:var(--primary-dark);--ui-color-background-secondary:var(--secondary-dark);--ui-color-background-tertiary:var(--text);--ui-color-border:var(--ui-color-n-100);--ui-color-typography-heading:var(--text);--ui-color-typography-body:var(--text);--ui-color-typography-note:var(--text);--ui-color-typography-button:var(--text);--font-stack:"Poppins",sans-serif;--font-stack-headlines:"Poppins",sans-serif;--gtc:[full-start] minmax(32px, 1fr) [center-start] repeat(12, [col-start] minmax(min-content, 120px) [col-end]) [center-end] minmax(32px, 1fr) [full-end];--gtr:min-content calc(100vh - 120px) 100vh;--sub-gtc:[full-start] minmax(16px, 1fr) [center-start] repeat(12, [col-start] minmax(min-content, 120px) [col-end]) [center-end] minmax(16px, 1fr) [full-end];--header-height:90vh;--container-fixed-lrg:min(100% - 2rem, 80rem);--container-full:min(100% - 0);--section-padding-large:clamp(1.4rem, -0.16rem + 5.2vw, 4rem);--section-padding-medium:2.6rem 0;--section-padding-small:1rem 0;--section-width-small:37.5rem;--section-width-medium:60rem;--section-width-large:75rem}html{scroll-behavior:smooth}body{color:var(--ui-color-typography-body);font-family:var(--font-stack);font-feature-settings:"liga","kern";font-weight:400;min-height:100%;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}h1,h2,h3,h4,h5{font-family:var(--font-stack-headlines)}.btn{margin:2rem 0;padding:.8rem 1.8rem;border-radius:4px;transition:.4s ease-in-out;font-weight:500}.btn__primary{background-color:var(--yellow);border:1px solid var(--yellow)}.btn:hover .btn__primary{background-color:var(--yellow);box-shadow:0 4px 0 0 #eee;border:4px solid var(--yellow);color:#fff}h1{font-weight:600;font-size:clamp(2.8rem, 5vw, 4.4rem);line-height:clamp(3.2rem, 3.8vw, 4rem);margin-bottom:clamp(2rem,2.5vw,2.2rem)}h2{font-weight:200;font-size:clamp(2rem, 3.8vw, 3.8rem);line-height:clamp(2.4rem, 3vw, 4.2rem);margin-bottom:clamp(1em,1.4em,1.2em)}h3{font-weight:700;font-size:clamp(1.8rem, 2.2vw, 2.2rem);line-height:clamp(2rem, 2.4vw, 2.4rem);padding-bottom:1.2rem}h4{font-weight:500;font-size:clamp(1.6rem, 2vw, 2rem);line-height:clamp(1.6rem, 2.4vw, 2.4rem)}h5{font-weight:700;font-size:clamp(1.4rem, 2vw, 1.6rem);line-height:clamp(1.4rem, 2vw, 1.6rem)}.header__text .intro,footer p,p{font-family:var(--font-stack)}p{font-size:clamp(16px, 3vw, 18px);line-height:clamp(20px, 3.2vw, 22px);margin-bottom:clamp(1rem,1.4vw,1.4rem);font-weight:500}h1,h2,h3,h4,h5,h6{text-wrap:pretty}h1 span,h2 span,h3 span,h4 span{color:var(--yellow);font-weight:700}img,svg{display:block;height:auto;max-width:100%}.skip-nav{position:absolute;transform:translateY(-120px);transition:transform .5s ease-in;left:1rem}.skip-nav:focus{transform:translateY(20px)}nav{width:var(--container-full)}nav .nav{display:flex;align-items:center}nav .nav__logo{justify-content:left;flex:50%}nav.nav__links{justify-content:right;flex:50%}nav.nav-border{border-bottom:1px solid var(--yellow)}nav svg{display:inline;margin:1rem .3rem;max-width:3rem}nav ul.nav-links{list-style:none;display:flex;margin:none;padding:none 1rem none none;justify-content:right;align-items:center;height:100%;gap:1rem}.nav ul.nav-link li{cursor:pointer!important}nav .nav-link{height:100%;display:flex;justify-content:center;align-items:center}.header,.wrapper-skills{flex-direction:row;display:flex}header{min-height:72vh;display:grid;grid-template-columns:var(--gtc);place-items:center;margin-top:3rem}.header{padding:2rem;grid-column:center-start/center-end;grid-row:1/-1;align-items:center;justify-content:center}.intro-continued,section.section-skills{padding-block:var(--section-padding-large)}.header__text{width:100%;text-align:left;flex:50%}.header__image{width:100%;flex:50%}.header__image img{clip-path:url(#pathAll)}.header__text .intro{color:var(--yellow);font-weight:400;font-size:clamp(1.4rem, 1.4vw, 3rem);line-height:clamp(1.4rem, 1.4vw, 1.6rem);margin-bottom:clamp(.2rem,.4vw,.4rem)}.header__text .intro-content{font-weight:500;margin-bottom:4rem}.header__text h1{font-weight:100;color:#fff}.date-reveal p span.description,.date-reveal p span.title,.text-reveal span{color:hsl(0 0% 100% / .2);background-repeat:no-repeat;background-size:0 100%}.header__text h1 span{font-weight:700;color:#fff}.header__text svg{width:2rem;fill:var(--blue);display:inline-block;margin:0 .4rem;cursor:pointer}.header__text svg:first-child{margin-left:0}.mouse{padding-bottom:2rem}.mouse svg .mouse-down{animation:.6s ease-in-out 2s infinite mousedown;fill:var(--yellow)}@keyframes mousedown{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}.intro-continued{background-color:#fff;animation:720ms ease-in-out forwards color-swap;animation-timeline:view();animation-range-start:cover 30vh;animation-range-end:cover 60vh}.intro-continued p{width:min(66ch - 2rem,80rem);margin-inline:auto}section.section-skills,section.section-timeline,section.section-work{width:var(--container-full);text-align:center}.intro-continued h2{text-align:center}@keyframes color-swap{to{background-color:var(--primary-dark);color:#fff}}section.section-skills{height:auto}.wrapper-skills{max-width:var(--container-fixed-lrg);margin-inline:auto;text-align:center;flex-wrap:wrap}.wrapper-skills .skill{max-width:340px;padding:0 2rem 1rem;margin-inline:auto;text-align:left}.wrapper-skills .skill h4{color:rgb(255,255,255,.8)}.text-reveal span{background-clip:text;animation:linear forwards text-reveal;animation-timeline:view()}.date-reveal p span.description,.date-reveal p span.title,.text-reveal h5 span{animation-range-start:cover 30vh;animation-range-end:cover 40vh}@keyframes text-reveal{to{background-size:100% 100%}}@media screen and (min-width:320px){html{font-size:calc( 8px + 2 * (100vw - 320px) / 380)}}@media screen and (min-width:700px){html{font-size:calc( 10px + 6 * (100vw - 700px) / 200)}}@media screen and (min-width:900px){html{font-size:16px}}section.section-work{background:#fff;padding-block:var(--section-padding-medium)}.section-work h2{color:var(--primary-dark)}.block{width:70%;max-width:800px;margin-left:auto;margin-right:auto;display:flex;flex-direction:row}.element{width:50%;margin:4%;box-shadow:0 20px 20px -15px rgba(0,0,0,.5);transition:.3s}.element:hover{box-shadow:0 30px 40px -15px rgba(0,0,0,.3);transform:translateY(-10px)}#bg1.lazy,#bg2.lazy,#bg3.lazy,#bg4.lazy,#bg5.lazy,#bg6.lazy,#bg7.lazy,#bg8.lazy{background-image:none;background-color:#f1f1fa}#bg1{background-image:url("../images/my-work-viral-nation.webp")}#bg2{background-image:url("../images/my-work-nudge.webp")}#bg3{background-image:url("../images/my-work-absolute.webp")}#bg4{background-image:url("../images/my-work-sothebys.webp")}#bg5{background-image:url("../images/my-work-data-studio.webp")}#bg6{background-image:url("../images/my-work-hubspot.webp")}#bg7{background-image:url("../images/my-work-faros.webp")}#bg8{background-image:url("../images/my-work-pmam.webp")}.element-bg{width:100%;max-width:100%;height:0;padding-top:125.1%;background-size:cover;background-repeat:no-repeat}.element-header,.element-paragraph,.element-text{background-color:#fefefe;width:100%;text-align:center;box-sizing:border-box}.element-details{position:absolute;display:none}.event,.timeline{position:relative}.element-paragraph{padding-top:3em;font-size:.7rem;letter-spacing:.4em;text-transform:uppercase;color:#505050}.element-header{padding-top:.3em;padding-bottom:.7em;font-size:2rem;color:#2b2b2b;font-weight:700}#h2{padding-left:.75em;padding-right:.75em}section.section-timeline{background-color:var(--secondary-dark);height:auto;padding:var(--section-padding-large)}.wrapper-timeline{max-width:600px;margin-inline:auto;margin-top:50px;text-align:center}.timeline{border-left:4px solid var(--yellow);border-bottom-right-radius:4px;border-top-right-radius:4px;background:rgba(255,255,255,.1);color:var(--text);margin:50px auto;letter-spacing:.5px;line-height:1.4em;font-size:1.03em;padding:50px;text-align:left;font-weight:100;max-width:80%}.event{border-bottom:1px dashed rgba(255,255,255,.1);padding-bottom:1rem;margin-bottom:50px}.event:last-of-type{padding-bottom:0;margin-bottom:0;border:none}.wrapper-timeline .timeline-title{font-weight:400!important;color:var(--yellow)}.wrapper-timeline .date{display:none}.event:after,.event:before{position:absolute;display:block;top:0}.event:before{left:-220px;color:fade(#fff,40%);content:attr(data-date);text-align:right;font-weight:400;font-size:.9em;min-width:120px}.event:after{box-shadow:0 0 0 4px var(--yellow);left:-58px;background:var(--secondary-dark);border-radius:50%;height:11px;width:11px;content:"";top:5px}.date-reveal p span.title{background-clip:text;animation:linear forwards date-reveal;animation-timeline:view()}.date-reveal p span.description{-webkit-background-clip:text;background-clip:text;background-image:linear-gradient(90deg,#fff,#fff);animation:linear forwards date-reveal;animation-timeline:view()}@keyframes date-reveal{to{background-size:100% 100%}}section.section-contact{width:var(--container-lrg);padding:var(--section-padding-medium);text-align:center}section.section-contact .form{max-width:var(--section-width-small);margin-inline:auto}section.section-contact .form form input,section.section-contact .form form textarea{width:min(100% - 2rem,660px);padding:1rem;margin:1rem 0;border:1px solid var(--yellow);border-radius:4px;display:block;text-align:left}footer{margin-inline:auto}footer svg{display:inline;margin:0 .3rem;max-width:1rem}footer p{font-weight:400;font-size:14px}@media screen and (max-width:768px){header .header,section.section-work .block{flex-direction:column}section.section-work .element{width:100%}.event:before,section.section-timeline .date{display:block}}