@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;550;600;650;700;750;800;900;1000&display=swap');
:root{--paper:#f8f9f6;--ink:#1d1e1c;--green:#44dc7c;--muted:#62645e;--line:#dfe1da}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:95px}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',Arial,sans-serif;font-size:16px}a{color:inherit;text-decoration:none}button,a{-webkit-tap-highlight-color:transparent}a:focus-visible{outline:3px solid #2360df;outline-offset:6px}header{display:flex;align-items:center;justify-content:space-between;padding:22px 3.6%;border-bottom:1px solid var(--line);background:var(--paper);position:relative;z-index:3}.brand{display:flex;align-items:center;gap:11px;font-size:21px;font-weight:800;letter-spacing:-.7px}.brand-mark{display:grid;place-items:center;width:35px;height:35px;border-radius:12px;background:var(--green);font-size:25px;transform:rotate(-8deg)}.mini{font-size:10px;letter-spacing:1.1px;font-weight:600;background:#eeefea;border:1px solid var(--line);border-radius:20px;padding:5px 9px;margin-left:5px}nav{display:flex;gap:33px;align-items:center;font-size:14px;font-weight:600}.nav-contact{padding:11px 19px;border:1px solid var(--ink);border-radius:25px}nav a:hover,.text-link:hover,footer a:hover{color:#087337}.hero{position:relative;text-align:center;overflow:hidden;background-image:radial-gradient(#d3d7cf 1px,transparent 1px);background-size:38px 38px;padding:38px 6% 0}.eyebrow{display:flex;justify-content:space-between;gap:15px;font-size:12px;letter-spacing:1.6px;font-weight:650;margin:0}.hero>.eyebrow{color:var(--muted)}.hero-title{position:relative;width:min(980px,100%);margin:35px auto 22px}h1{font-size:clamp(90px,14.8vw,210px);font-weight:1000;line-height:.84;letter-spacing:-.075em;margin:0;position:relative;z-index:1}h1 .last-name{display:block}.period{color:var(--green)}.sticker{position:absolute;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 5px 0 #1d1e1c12;font-weight:800;user-select:none;transition:transform .4s cubic-bezier(.2,1.8,.5,1)}.sticker small{font-weight:600;font-size:13px;letter-spacing:0}.sticker-code{left:5%;top:58%;background:#b9acf4;font-size:43px;line-height:1.1;border-radius:23px;padding:15px 28px;transform:rotate(-13deg)}.sticker-cloud{right:2%;top:48%;background:#ffe275;padding:23px 20px;border-radius:50%;font-size:25px;transform:rotate(12deg)}.sticker:hover{transform:rotate(0deg) scale(1.1)}.cursor-note{position:absolute;right:11%;top:6%;font-size:12px;font-weight:700;background:#ff8b79;border-radius:15px;padding:8px 13px;transform:rotate(8deg);z-index:2}.cursor-note>span{position:absolute;left:-18px;top:-24px;font-size:32px;color:var(--ink)}.intro-copy{font-size:clamp(21px,2.1vw,29px);letter-spacing:-1px;margin:31px 0 9px;font-weight:550}.highlight{background:#baf7d0;color:#106633;padding:2px 8px;border-radius:7px;display:inline-block;transform:rotate(-3deg)}.hero-description{color:var(--muted);margin:10px 0 24px;font-size:16px}.button{display:inline-flex;align-items:center;justify-content:center;gap:36px;background:var(--green);padding:19px 28px;border-radius:40px;font-size:16px;font-weight:650;transition:transform .2s,box-shadow .2s}.button:hover{transform:translateY(-4px);box-shadow:0 6px 0 #1d1e1c20}.hero-bottom{display:flex;justify-content:space-between;color:var(--muted);font-size:10px;letter-spacing:1.8px;padding:44px 0 23px}.section{padding:100px max(6%,calc((100% - 1200px)/2));border-top:1px solid var(--line)}.section-heading{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:40px}h2{font-size:clamp(38px,5vw,66px);letter-spacing:-3px;line-height:1.04;margin:18px 0 0;font-weight:750}.text-link{font-size:14px;border-bottom:1px solid var(--ink);padding-bottom:5px}.projects{display:grid;grid-template-columns:1fr 1fr;gap:24px}.project{border-radius:23px;padding:25px;min-width:0;display:block;transition:transform .25s,box-shadow .25s}.project:hover{transform:translateY(-5px);box-shadow:0 12px 25px #1d1e1c0d}.green{background:#d8f2df}.purple{background:#e7e2f7}.blue{background:#dcebf7}.yellow{background:#f5edca}.project-top{display:flex;align-items:center;justify-content:space-between;font-size:11px;font-weight:650;letter-spacing:1.4px}.circle-arrow{display:grid;place-items:center;width:35px;height:35px;border:1px solid #1d1e1c50;border-radius:50%;font-size:20px}.project-visual{height:210px;display:flex;align-items:center;justify-content:center;gap:10px}.flow span{padding:14px 18px;border:1px solid #256a3a80;background:#f8fff8;border-radius:12px;font-size:17px;font-weight:600;box-shadow:0 4px 0 #b9d7c1}.flow span:nth-of-type(2){transform:rotate(-8deg);background:var(--green)}.flow i{font-style:normal}.code{font-size:clamp(27px,3vw,42px);font-weight:750;letter-spacing:-2px;transform:rotate(-5deg)}.code>span{color:#6f4ca6;font-size:50px}.terminal>div{background:#21333b;color:#9babb1;padding:20px;border-radius:12px;font-family:monospace;font-size:12px;line-height:2.3;transform:rotate(-3deg);width:87%;box-shadow:7px 8px 0 #b9d5e9}.terminal b{font-size:clamp(12px,1.4vw,17px);color:#eaf8f8;font-weight:500}.terminal em{font-style:normal;color:#7af2a7;font-size:11px}.infra{gap:0}.infra>span{border:1px solid #8c7e44;background:#fff9df;border-radius:50%;width:105px;height:105px;display:grid;place-items:center;font-weight:650;margin-left:-9px}.infra>span:nth-child(2){background:#ffe17c;transform:translateY(-20px);z-index:1}.project-copy h3{font-size:29px;letter-spacing:-1px;margin:0 0 12px}.project-copy p{font-size:16px;line-height:1.6;color:#454943;margin:0;max-width:470px;min-height:78px}.tags{display:flex;gap:7px;flex-wrap:wrap;margin-top:25px}.tags span{font-size:12px;border:1px solid #1d1e1c30;border-radius:20px;padding:6px 10px}.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px;margin-top:28px}.about h2{margin:0}.identity{display:flex;align-items:center;gap:15px;margin-top:35px}.identity img{border-radius:50%;object-fit:cover;filter:grayscale(1)}.identity strong,.identity span{display:block}.identity span{color:var(--muted);font-size:14px;margin-top:5px}.about-copy p{font-size:19px;line-height:1.7;margin:0 0 20px;color:#575b53}.about-copy strong{font-weight:550;color:var(--ink)}.facts{display:flex;gap:45px;border-top:1px solid var(--line);padding-top:23px;margin-top:29px}.facts>div{display:flex;flex-direction:column;gap:7px}.facts strong{font-size:40px;letter-spacing:-2px}.facts strong span{font-size:24px;color:#878d80}.facts div>span{font-size:12px;color:var(--muted)}.toolbox{margin-top:65px;border-top:1px solid var(--line);padding-top:30px;display:flex;gap:35px;align-items:center}.toolbox-label{font-size:11px;letter-spacing:1.4px;white-space:nowrap}.toolbox>div{display:flex;flex-wrap:wrap;gap:10px}.toolbox>div>span{padding:8px 13px;border:1px solid #d6d9d0;border-radius:9px;font-size:14px}.contact{text-align:center;background:var(--green);background-image:radial-gradient(#27b657 1px,transparent 1px);background-size:38px 38px}.contact .eyebrow{justify-content:center}.contact h2{font-size:clamp(48px,8.8vw,124px);font-weight:900;line-height:.94;letter-spacing:-.06em;margin:32px 0}.dark{background:var(--ink);color:#fff}.email{display:block;width:fit-content;margin:23px auto 0;font-size:14px}.email:hover{text-decoration:underline}footer{display:flex;justify-content:space-between;align-items:center;gap:25px;padding:32px 4%}footer>.brand{font-size:17px}footer>span{font-size:12px;color:var(--muted)}footer>div{display:flex;gap:24px;font-size:14px}.mobile-break{display:none}.skip{position:absolute;top:-70px;left:15px;z-index:10;padding:15px;background:#fff}.skip:focus{top:10px}@media(min-width:1500px){.hero-title{margin-top:50px}.hero{padding-top:50px}}@media(max-width:800px){.mini{display:none}.hero{padding:28px 5% 0}.sticker-code{left:0%;padding:13px 17px;font-size:30px;top:62%}.sticker-cloud{right:0;top:57%;padding:18px 12px;font-size:18px}.cursor-note{right:3%;top:0}.hero-title{margin-top:55px}h1{font-size:17vw}.section{padding:65px 5%}.project{padding:20px}.project-visual{height:175px}.flow{gap:5px}.flow span{font-size:12px;padding:11px}.about-grid{gap:35px}.toolbox{flex-direction:column;align-items:flex-start;gap:20px}.project-copy h3{font-size:25px}.project-copy p{min-height:104px}footer>span{display:none}.eyebrow{font-size:10px}.infra>span{width:77px;height:77px;font-size:13px}}@media(max-width:560px){header{padding:18px 5%}.brand{font-size:17px}.brand-mark{width:29px;height:29px;font-size:22px}nav{gap:17px;font-size:12px}.nav-contact{padding:8px 12px}nav>a:first-child{display:none}.location{font-size:9px}.hero-title{margin-top:66px;margin-bottom:65px}h1{font-size:21vw;line-height:.9;letter-spacing:-.075em}.sticker-code{left:0;top:76%;padding:8px 12px;border-radius:13px;font-size:27px}.sticker-cloud{right:0;top:72%;font-size:17px;padding:15px 10px}.sticker small{font-size:10px}.cursor-note{top:-35px;right:5%;font-size:10px}.intro-copy{font-size:24px;line-height:1.5;margin-top:25px}.mobile-break{display:block}.hero-description{font-size:14px;line-height:1.6;max-width:290px;margin:12px auto 23px}.hero-bottom{font-size:8px;letter-spacing:1px;padding-top:40px}.projects{grid-template-columns:1fr;gap:20px}.section-heading{gap:20px;align-items:flex-end}.section-heading h2{font-size:40px;letter-spacing:-2px}.text-link{font-size:12px;white-space:nowrap}.section-heading .eyebrow{font-size:9px;letter-spacing:1px}.project-visual{height:185px}.flow span{font-size:17px;padding:13px}.code{font-size:39px}.terminal b{font-size:15px}.infra>span{width:95px;height:95px;font-size:15px}.project-copy p{min-height:0}.about-grid{grid-template-columns:1fr;gap:33px}.about h2{letter-spacing:-2px}.about-copy p{font-size:17px}.toolbox{margin-top:40px}.contact h2{font-size:13vw}.contact .eyebrow{font-size:10px}footer{padding:25px 5%;flex-wrap:wrap}footer>div{gap:16px;font-size:12px}.facts{gap:35px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}

/* Independent motion transforms preserve the original composition. */
.motion-letter{display:inline-block;transform-origin:50% 85%}
@media(prefers-reduced-motion:no-preference){
.sticker{transition:translate .65s cubic-bezier(.16,1,.3,1),transform .4s cubic-bezier(.2,1.8,.5,1)}
.sticker-code{animation:float-code 5.5s ease-in-out infinite}
.sticker-cloud{animation:float-cloud 6.5s ease-in-out infinite -.8s}
.cursor-note{animation:cursor-wander 7s ease-in-out infinite}
.highlight{animation:highlight-wiggle 4.8s ease-in-out infinite}
.button{transition:translate .3s ease-out,transform .35s cubic-bezier(.2,1.8,.5,1),box-shadow .25s}
.circle-arrow{transition:transform .45s cubic-bezier(.2,1.8,.5,1),background .3s}
.project:hover .circle-arrow{transform:rotate(45deg);background:#ffffff70}
.project-visual>*{transition:transform .65s cubic-bezier(.2,1.6,.5,1)}
.project:hover .flow>span:first-child{transform:rotate(-8deg) translateY(-8px)}
.project:hover .flow>span:last-child{transform:rotate(8deg) translateY(-8px)}
.project:hover .code>span:first-child{transform:translateX(-9px) rotate(-8deg)}
.project:hover .code>span:last-child{transform:translateX(9px) rotate(8deg)}
.project:hover .terminal>div{transform:rotate(0deg) translateY(-6px)}
.project:hover .infra>span:first-child{transform:translateX(-9px) rotate(-9deg)}
.project:hover .infra>span:last-child{transform:translateX(9px) rotate(9deg)}
.toolbox>div>span{transition:transform .35s cubic-bezier(.2,1.8,.5,1),background .3s}
.toolbox>div>span:hover{transform:translateY(-5px) rotate(-4deg);background:#d8f2df}
@keyframes float-code{0%,100%{transform:translateY(0) rotate(-13deg)}50%{transform:translateY(-13px) rotate(-7deg)}}
@keyframes float-cloud{0%,100%{transform:translateY(0) rotate(12deg)}50%{transform:translateY(12px) rotate(5deg)}}
@keyframes cursor-wander{0%,100%{transform:translate(0,0) rotate(8deg)}35%{transform:translate(-24px,12px) rotate(-3deg)}70%{transform:translate(8px,-8px) rotate(4deg)}}
@keyframes highlight-wiggle{0%,75%,100%{transform:rotate(-3deg)}82%{transform:rotate(3deg) scale(1.04)}90%{transform:rotate(-5deg)}}
}