:root{--paper:#f2eadb;--ink:#14120f;--blue:#b9cfe2;--red:#e67979;--pink:#ff5aaa;--yellow:#e9ff57;--mono:"DM Mono",monospace;--hand:"Caveat",cursive;--marker:"Permanent Marker",cursive}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#c8c0b3;color:var(--ink);font-family:var(--hand);cursor:none;overflow-x:hidden}a{color:inherit;text-decoration:none}img{display:block;width:100%}.sheet{position:relative;margin:18px auto;width:min(1450px,calc(100% - 36px));box-shadow:0 12px 30px #2b251f24;background-color:var(--paper);background-image:linear-gradient(90deg,transparent 0 72px,var(--red) 73px 74px,transparent 75px),repeating-linear-gradient(0deg,transparent 0 37px,var(--blue) 38px 39px);border:1px solid #d6ccbb}.sheet:before{content:"";position:absolute;z-index:2;left:-11px;top:28px;width:22px;height:22px;border-radius:50%;background:#c8c0b3;box-shadow:0 62px #c8c0b3,0 124px #c8c0b3,0 186px #c8c0b3,0 248px #c8c0b3,0 310px #c8c0b3,0 372px #c8c0b3}
.loader{position:fixed;inset:0;z-index:100;background:var(--paper);background-image:repeating-linear-gradient(0deg,transparent 0 37px,var(--blue) 38px 39px);display:grid;place-content:center;transition:transform 1s cubic-bezier(.76,0,.24,1);overflow:hidden}.loader.hide{transform:translateY(-105%) rotate(-2deg)}.loader-note{font:600 1.5rem var(--hand);margin:0;transform:rotate(-3deg)}.loader-word{font:clamp(3rem,10vw,9rem) var(--marker);letter-spacing:-.05em;display:flex}.loader-word span,.loader-word i{display:block;animation:letterIn .7s both;animation-delay:calc(var(--i)*.06s)}.loader-word span:nth-child(1){--i:0}.loader-word span:nth-child(2){--i:1}.loader-word span:nth-child(3){--i:2}.loader-word i{--i:3;font-style:normal;color:var(--pink)}.loader-word span:nth-child(5){--i:4}.loader-word span:nth-child(6){--i:5}.loader-word span:nth-child(7){--i:6}.loader-word span:nth-child(8){--i:7}.loader-word span:nth-child(9){--i:8}.loader-line{height:5px;background:#0002}.loader-line b{display:block;height:100%;background:var(--pink);animation:load 1.8s forwards}.loader-count{font:12px var(--mono);text-align:right}.cursor{position:fixed;z-index:90;width:72px;height:72px;border-radius:50%;background:var(--yellow);display:grid;place-items:center;font:10px var(--mono);pointer-events:none;transform:translate(-50%,-50%) scale(0);transition:.18s;mix-blend-mode:multiply}.cursor.show{transform:translate(-50%,-50%) scale(1)}
header{height:72px;position:absolute;z-index:10;width:100%;display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;padding:0 4rem;font:600 15px var(--hand)}.logo{font:1.15rem var(--marker)}.logo span{color:var(--pink)}.location{text-align:center}.location i{font-style:normal;color:var(--pink)}nav{display:flex;justify-content:flex-end;gap:1.7rem}nav a{border-bottom:2px solid transparent}nav a:hover{border-color:var(--pink)}
.hero{min-height:calc(100svh - 36px);padding:8rem 6rem 3rem;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden}.hero-kicker{font:600 1.4rem/1.15 var(--hand);margin-left:54%;transform:rotate(2deg)}.hero h1{font:clamp(4.5rem,12vw,12rem)/.8 var(--marker);letter-spacing:-.055em;margin:4rem 0 2rem;z-index:1}.hero h1 span{display:block}.hero h1 span:last-child{text-align:right;color:var(--pink)}.hero h1 .outline{color:transparent;-webkit-text-stroke:2px var(--ink)}.hero-note{position:absolute;right:7%;top:48%;font:700 2rem var(--hand);transform:rotate(-7deg);background:linear-gradient(transparent 55%,#e9ff5788 55%)}.hero-bottom{display:flex;justify-content:space-between;border-top:3px solid;padding-top:.7rem;font:600 1.05rem var(--hand)}.hero-bottom p{margin:0}.tape{position:absolute;width:150px;height:38px;background:#f5d3a5aa;z-index:3;transform:rotate(-8deg)}.tape-one{top:18px;left:43%}.doodle{position:absolute}.star{right:5%;top:15%;font-size:5rem;color:var(--pink);animation:spin 9s linear infinite}.arrow{left:48%;top:18%;font-size:5rem}
.ticker{overflow:hidden;background:var(--yellow);border-block:3px solid;padding:.5rem 0;white-space:nowrap;font:1.25rem var(--marker)}.ticker div{width:max-content;animation:ticker 22s linear infinite}.index{font:600 1rem var(--mono);margin:0}.intro{min-height:90vh;padding:7rem;display:grid;grid-template-columns:1fr 4fr;gap:3rem}.intro h2{font:600 clamp(3rem,7vw,7rem)/.9 var(--hand);margin:0;grid-column:2}.intro h2 em{font:1em var(--marker);color:var(--pink)}.body-copy{grid-column:2;max-width:40rem;margin:4rem 0 0 25%;font-size:1.75rem;line-height:1.25}.margin-note{position:absolute;left:5%;bottom:12%;font:1.5rem var(--hand);transform:rotate(-9deg);color:#315b9a}
.about-me{min-height:100vh;padding:6rem 8%;display:grid;grid-template-columns:38% 1fr;gap:9%;align-items:center}.about-me>.index{position:absolute;top:3rem;left:7rem}.portrait-card{width:min(330px,90%);justify-self:center;background:#fff;padding:14px 14px 48px;box-shadow:5px 8px 18px #332b2130;transform:rotate(-4deg);position:relative}.portrait-card img{aspect-ratio:4/5;object-fit:cover;filter:contrast(1.05)}.portrait-card small{position:absolute;bottom:12px;left:20px;font:700 1.35rem var(--hand)}.paperclip{position:absolute;z-index:3;top:-24px;right:35px;width:21px;height:75px;border:4px solid #777;border-radius:12px;transform:rotate(9deg);box-shadow:inset 0 0 0 3px #fff}.about-writing h2{font:3.8rem var(--marker);margin:0}.about-writing p{font:600 clamp(1.4rem,2.2vw,2.2rem)/1.32 var(--hand);margin:.7rem 0}.about-writing blockquote{font:clamp(2.2rem,4vw,4.5rem)/1 var(--hand);color:var(--pink);margin:2rem 0 .5rem;transform:rotate(-2deg);text-decoration:underline;text-decoration-color:var(--yellow);text-decoration-thickness:12px;text-underline-offset:-5px}.signature{display:block;text-align:right;font:2rem var(--hand)}
.dark-sheet{background-color:#101010;color:#fff;background-image:linear-gradient(90deg,transparent 0 72px,#ff6f6f 73px 74px,transparent 75px),repeating-linear-gradient(0deg,transparent 0 37px,#273d51 38px 39px)}.work{padding:3rem 5rem 8rem}.work-head,.clients-head{display:flex;justify-content:space-between;padding:1rem 0 5rem;font:12px var(--mono)}.project-grid{display:grid;grid-template-columns:1fr 1fr;gap:8rem 3rem}.project{width:86%;background:#f4efe7;color:#111;padding:12px 12px 20px;box-shadow:3px 6px 15px #0008;transform:rotate(-1deg)}.project:nth-child(even){transform:rotate(1.4deg)}.project.shift{justify-self:end;margin-top:10rem}.project.wide{grid-column:1/-1;width:72%}.project.wide.reverse{justify-self:end}.media{overflow:hidden;background:#222}.media img{aspect-ratio:4/5;object-fit:cover;transition:.7s;filter:contrast(1.08) saturate(1.1)}.wide .media img{aspect-ratio:16/10}.project:hover img{transform:scale(1.025)}.meta{display:grid;grid-template-columns:1fr auto;padding-top:.65rem}.meta h3{font:1.7rem var(--marker);margin:0}.meta p,.meta span{font:700 .95rem var(--hand);margin:0}.meta p{grid-column:1}.meta span{grid-column:2;grid-row:1}
.clients{padding:3rem 5rem 0;overflow:hidden}.logo-wall{display:grid;grid-template-columns:repeat(3,1fr);border:1px dashed #776f64;border-width:1px 0 0 1px}.client-logo{min-height:160px;display:flex;align-items:center;justify-content:center;text-align:center;padding:1rem;border:1px dashed #776f64;border-width:0 1px 1px 0;font:clamp(1.5rem,3vw,3.6rem) var(--marker);color:var(--ink);transition:.3s}.client-logo small{display:block;font:500 .25em var(--mono);letter-spacing:.3em}.client-logo:hover{background:var(--yellow);color:#111;transform:rotate(-2deg)}.kitsune,.gisou,.flore,.melissa,.omi{font-family:var(--hand);font-style:italic}.missoni,.assouline,.juni,.halcyon,.mackenzie,.perfect,.rafael,.moncler,.annies,.ulta{font-family:serif}.client-marquee{margin:5rem -5rem 0;background:var(--yellow);color:#111;border-block:3px solid;white-space:nowrap;overflow:hidden;font:clamp(2.5rem,7vw,7rem)/.9 var(--marker);padding:.6rem 0}.client-marquee span{display:inline-block;animation:ticker 17s linear infinite}
.services{padding:8rem 7rem}.services>.index{margin-bottom:4rem}.service-list>div{border-top:2px solid;display:grid;grid-template-columns:8% 1fr auto;align-items:center;padding:.7rem 0}.service-list>div:last-child{border-bottom:2px solid}.service-list span{font:12px var(--mono)}.service-list h3{font:clamp(2rem,5vw,5.5rem) var(--marker);margin:0}.service-list i{font-style:normal;font-size:2rem;transition:.3s}.service-list>div:hover i{transform:rotate(45deg);color:var(--pink)}.contact{min-height:95vh;padding:5rem 7rem;display:flex;flex-direction:column;justify-content:space-between}.contact>a{font:clamp(5rem,14vw,14rem)/.75 var(--marker);letter-spacing:-.06em;margin:5rem 0;color:var(--pink)}.contact>a span{color:var(--ink)}.contact-foot{display:grid;grid-template-columns:repeat(3,1fr);border-top:3px solid;padding-top:1rem;font:700 1.05rem var(--hand)}.contact-foot>*{margin:0}.contact-foot a{text-align:center}.contact-foot p:last-child{text-align:right}
.reveal{opacity:0;transform:translateY(45px) rotate(.5deg);transition:opacity .9s,transform .9s}.reveal.in{opacity:1;transform:none}@keyframes load{from{width:0}to{width:100%}}@keyframes letterIn{from{opacity:0;transform:translateY(1em) rotate(8deg)}to{opacity:1;transform:none}}@keyframes ticker{to{transform:translateX(-50%)}}@keyframes spin{to{transform:rotate(360deg)}}
@media(max-width:760px){body{cursor:auto}.cursor{display:none}.sheet{width:calc(100% - 18px);margin:9px auto}.sheet:before{display:none}header{height:62px;padding:0 1.5rem;grid-template-columns:1fr 1fr}.location{display:none}nav{gap:.8rem;font-size:.8rem}.hero{padding:7rem 1.3rem 1.5rem;min-height:calc(100svh - 18px)}.hero-kicker{margin-left:22%;font-size:1.1rem}.hero h1{font-size:18.2vw}.hero h1 span:last-child{text-align:left}.hero-note{top:63%;font-size:1.25rem}.arrow{display:none}.star{font-size:3rem}.intro{padding:5rem 1.4rem 6rem;display:block}.intro h2{margin-top:3rem;font-size:3.3rem}.body-copy{margin:3rem 0 0;font-size:1.4rem}.margin-note{display:none}.about-me{padding:6rem 1.5rem;display:flex;flex-direction:column;gap:3rem}.about-me>.index{top:2rem;left:1.5rem}.portrait-card{width:210px}.about-writing h2{font-size:2.6rem}.about-writing p{font-size:1.35rem}.work{padding:2rem 1.3rem 5rem}.project-grid{display:block}.project,.project.wide,.project.shift{width:100%;margin:0 0 5rem}.wide .media img,.media img{aspect-ratio:4/5}.work-head,.clients-head{padding-bottom:3rem}.clients{padding:2rem 1.2rem 0}.logo-wall{grid-template-columns:repeat(2,1fr)}.client-logo{min-height:105px;font-size:1.25rem}.client-marquee{margin-left:-1.2rem;margin-right:-1.2rem}.services{padding:6rem 1.4rem}.service-list>div{grid-template-columns:12% 1fr auto}.service-list h3{font-size:1.8rem}.contact{padding:4rem 1.4rem}.contact>a{font-size:18vw}.contact-foot{grid-template-columns:1fr 1fr}.contact-foot p:last-child{display:none}}
.contact>a{font-size:clamp(4rem,11.5vw,11.5rem);line-height:.82;position:relative;z-index:2}
@media(max-width:760px){.contact>a{font-size:15vw}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.loader{display:none}.reveal{opacity:1;transform:none}}